=DashboardManager overhaul. A bit easier to modify the output of pages. Sti...

Jake Vanderwerf

2026-06-29 4089ba01e0881c89a72332e13bc3a80b6bddec2a

 assets/js/concise/HandleSelection.js

@@ -1,5 +1,5 @@
class HandleSelection {
   constructor(container, options = {}) {
   constructor(container, options = {}, hasTable = false) {
      this.container = container;
      const defaults = {
         selectAll: {
@@ -10,9 +10,9 @@
            count: '.selected-count, .selected .info',
            bulkControls: '.bulk-actions',
         },
         items: '.item-grid',
         items: '.item-grid, table',
         wrapper: {
            wrapper: ':has(.item-grid, [data-select-all])',
            wrapper: ':has(.item-grid, [data-select-all]):not([hidden]), table',
            id: 'selection',
         },
         item: {
@@ -23,7 +23,7 @@
         wrappers: {},
      };
      this.selectors = window.deepMerge(defaults, options);

      this.hasTable = hasTable;
      this.a11y = window.jvbA11y;

      this.selectedItems = new Set();
@@ -49,11 +49,19 @@
      this.index = 0;
      let selectors = this.removeDataReferences();
      this.ui = window.uiFromSelectors(selectors, this.container);
      if (this.hasTable) {
         this.checkForTable();
      }

      this.container.querySelectorAll(this.selectors.wrapper.wrapper).forEach(wrapper => {
         this.addWrapper(wrapper);
      });
   }
      checkForTable() {
         if (!Object.hasOwn(this.ui.wrapper, 'table') || !this.ui.wrapper.table) {
            this.ui.wrapper.table = this.container.querySelector('table');
         }
      }
      addWrapper(el) {
         let id = this.selectors.wrapper.id;
         if (!Object.hasOwn(el.dataset, id)) {
@@ -61,7 +69,7 @@
            this.index++;
         }
         let selectors = this.removeDataReferences().selectAll;

         console.log('Adding wrapper from element: ', el);
         //store the DOM of the grid and selectAll
         this.ui.wrappers[el.dataset[id]] = {
            element: el,
@@ -140,6 +148,7 @@

      // Do range selection
      const currentId = this.getItemId(item);

      const items = this.getWrapperChildren(wrapper);
      const lastIndex = items.findIndex(itemId => itemId === this.lastSelected);
      const currentIndex = items.findIndex(itemId => itemId === currentId);
@@ -163,18 +172,28 @@
   }

   getWrapperChildren(wrapper) {
      return Array.from(wrapper.items.children)

      return Array.from(wrapper.tagName === 'TABLE' ? Array.from(wrapper.children)[1].children : wrapper.items.children)
         .map(item => this.getItemId(item));
   }

   getItemWrapper(item) {
      if (!item) return null;
      console.log('Wrapper: ',this.selectors.wrapper.wrapper);
      let wrapper = item.closest(this.selectors.wrapper.wrapper);
      console.log('Found wrapper: ', wrapper);
      if (!wrapper)return null;
      return this.getWrapper(wrapper);
   }

   getWrapper(wrapper) {
      if (this.hasTable) {
         //Find the table, if available
         this.checkForTable();
         if (!this.ui.wrapper.table.hidden) {
            return this.ui.wrapper.table;
         }
      }
      return this.ui.wrappers[wrapper.dataset[this.selectors.wrapper.id]]??null;
   }

@@ -211,7 +230,7 @@
      }

      // Update label text
      if (wrapper.selectAll.span) {
      if (Object.hasOwn(wrapper, 'selectAll') && Object.hasOwn(Object.selectAll,'span') && wrapper.selectAll.span) {
         wrapper.selectAll.span.textContent = (trigger.checked && ids.length > 0) ? 'Clear Selection' : 'Select All';
      }

@@ -237,9 +256,14 @@
    * PUBLIC API
    *******************************************************************/
   select(id, updateCheckbox = true, updateUI = true) {
      console.log('Selecting items...');
      if (this.selectedItems.has(id)) return;
      console.log('Not already selected...');

      this.selectedItems.add(id);
      let item = this.getItem(id);
      console.log('Got item: ', item);
      if (item) item.element.classList.add('selected');
      if (updateCheckbox) this.setCheckboxState(id, true);
      if (updateUI) {
         this.updateSelectionUI();
@@ -251,6 +275,8 @@
      if (!this.selectedItems.has(id)) return;

      this.selectedItems.delete(id);
      let item = this.getItem(id);
      if (item) item.element.classList.remove('selected');
      if (updateCheckbox) this.setCheckboxState(id, false);
      if (updateUI) {
         this.updateSelectionUI();