@doyosi/laraisy 1.0.2 → 1.0.3

package/src/DSTable/DSTableSelection.js

@@ -1,192 +1,192 @@
-export class DSTableSelection {
-    constructor(tableInstance) {
-        this.table = tableInstance;
-        this.table.registerModule('selection', this);
-
-        // Configuration for persistence
-        this.persist = this.table.config.selection_persist ?? false;
-        this.storageType = this.table.config.selection_storage ?? 'localStorage'; // 'localStorage' or 'sessionStorage'
-        this.storageKey = this.table.config.selection_storage_key ?? `dstable_selection_${this._getTableIdentifier()}`;
-
-        this.selectedIds = new Set();
-
-        // Load persisted selection if enabled
-        if (this.persist) {
-            this._loadFromStorage();
-        }
-
-        this._init();
-    }
-
-    /**
-     * Generate a unique identifier for this table instance
-     */
-    _getTableIdentifier() {
-        // Use wrapper id, data-url, or fallback to path
-        return this.table.wrapper.id ||
-            this.table.config.ajax_url ||
-            window.location.pathname.replace(/\//g, '_');
-    }
-
-    _init() {
-        // We need to re-bind on render
-        this.table.on('render', () => this.update());
-
-        // Check all toggle
-        const checkAll = this.table.table.querySelector('thead input[type="checkbox"].select-all');
-        if (checkAll) {
-            checkAll.addEventListener('change', (e) => {
-                this.toggleAll(e.target.checked);
-            });
-        }
-    }
-
-    update() {
-        // Determine indentifier key, default 'id'
-        const key = 'id';
-
-        // Find checkboxes in tbody
-        const checkboxes = this.table.tbody.querySelectorAll('input[type="checkbox"].select-row');
-
-        checkboxes.forEach(chk => {
-            const rowId = chk.value; // Assuming value holds the ID
-
-            // Restore state from selectedIds (which may have been loaded from storage)
-            chk.checked = this.selectedIds.has(rowId);
-
-            // Bind click
-            chk.onchange = (e) => {
-                this._toggleId(rowId, e.target.checked);
-            };
-        });
-
-        this._updateCheckAllState();
-    }
-
-    _toggleId(id, checked) {
-        if (checked) this.selectedIds.add(id);
-        else this.selectedIds.delete(id);
-
-        this._updateCheckAllState();
-        this._saveToStorage();
-        this.table._emit('selectionChange', { selected: Array.from(this.selectedIds) });
-    }
-
-    toggleAll(checked) {
-        const checkboxes = this.table.tbody.querySelectorAll('input[type="checkbox"].select-row');
-        checkboxes.forEach(chk => {
-            chk.checked = checked;
-            const rowId = chk.value;
-            if (checked) this.selectedIds.add(rowId);
-            else this.selectedIds.delete(rowId);
-        });
-
-        this._saveToStorage();
-        this.table._emit('selectionChange', { selected: Array.from(this.selectedIds) });
-    }
-
-    _updateCheckAllState() {
-        const checkAll = this.table.table.querySelector('thead input[type="checkbox"].select-all');
-        if (!checkAll) return;
-
-        const checkboxes = Array.from(this.table.tbody.querySelectorAll('input[type="checkbox"].select-row'));
-        if (checkboxes.length === 0) {
-            checkAll.checked = false;
-            checkAll.indeterminate = false;
-            return;
-        }
-
-        const allChecked = checkboxes.every(c => c.checked);
-        const someChecked = checkboxes.some(c => c.checked);
-
-        checkAll.checked = allChecked;
-        checkAll.indeterminate = someChecked && !allChecked;
-    }
-
-    // ==================== STORAGE ====================
-
-    /**
-     * Save selection to storage
-     */
-    _saveToStorage() {
-        if (!this.persist) return;
-
-        try {
-            const storage = this.storageType === 'sessionStorage' ? sessionStorage : localStorage;
-            storage.setItem(this.storageKey, JSON.stringify(Array.from(this.selectedIds)));
-        } catch (e) {
-            console.warn('DSTableSelection: Failed to save to storage', e);
-        }
-    }
-
-    /**
-     * Load selection from storage
-     */
-    _loadFromStorage() {
-        try {
-            const storage = this.storageType === 'sessionStorage' ? sessionStorage : localStorage;
-            const saved = storage.getItem(this.storageKey);
-
-            if (saved) {
-                const ids = JSON.parse(saved);
-                if (Array.isArray(ids)) {
-                    this.selectedIds = new Set(ids.map(String));
-                }
-            }
-        } catch (e) {
-            console.warn('DSTableSelection: Failed to load from storage', e);
-        }
-    }
-
-    /**
-     * Clear storage
-     */
-    _clearStorage() {
-        if (!this.persist) return;
-
-        try {
-            const storage = this.storageType === 'sessionStorage' ? sessionStorage : localStorage;
-            storage.removeItem(this.storageKey);
-        } catch (e) {
-            console.warn('DSTableSelection: Failed to clear storage', e);
-        }
-    }
-
-    // ==================== PUBLIC API ====================
-
-    /**
-     * Get all selected IDs
-     */
-    getSelected() {
-        return Array.from(this.selectedIds);
-    }
-
-    /**
-     * Set selected IDs programmatically
-     */
-    setSelected(ids) {
-        this.selectedIds = new Set(ids.map(String));
-        this._saveToStorage();
-        this.update();
-        this.table._emit('selectionChange', { selected: Array.from(this.selectedIds) });
-    }
-
-    /**
-     * Clear all selections
-     */
-    clearAll() {
-        this.selectedIds.clear();
-        this._clearStorage();
-        this.update();
-        this.table._emit('selectionChange', { selected: [] });
-    }
-
-    /**
-     * Check if an ID is selected
-     */
-    isSelected(id) {
-        return this.selectedIds.has(String(id));
-    }
-}
-export default DSTableSelection;
-
+export class DSTableSelection {
+    constructor(tableInstance) {
+        this.table = tableInstance;
+        this.table.registerModule('selection', this);
+
+        // Configuration for persistence
+        this.persist = this.table.config.selection_persist ?? false;
+        this.storageType = this.table.config.selection_storage ?? 'localStorage'; // 'localStorage' or 'sessionStorage'
+        this.storageKey = this.table.config.selection_storage_key ?? `dstable_selection_${this._getTableIdentifier()}`;
+
+        this.selectedIds = new Set();
+
+        // Load persisted selection if enabled
+        if (this.persist) {
+            this._loadFromStorage();
+        }
+
+        this._init();
+    }
+
+    /**
+     * Generate a unique identifier for this table instance
+     */
+    _getTableIdentifier() {
+        // Use wrapper id, data-url, or fallback to path
+        return this.table.wrapper.id ||
+            this.table.config.ajax_url ||
+            window.location.pathname.replace(/\//g, '_');
+    }
+
+    _init() {
+        // We need to re-bind on render
+        this.table.on('render', () => this.update());
+
+        // Check all toggle
+        const checkAll = this.table.table.querySelector('thead input[type="checkbox"].select-all');
+        if (checkAll) {
+            checkAll.addEventListener('change', (e) => {
+                this.toggleAll(e.target.checked);
+            });
+        }
+    }
+
+    update() {
+        // Determine indentifier key, default 'id'
+        const key = 'id';
+
+        // Find checkboxes in tbody
+        const checkboxes = this.table.tbody.querySelectorAll('input[type="checkbox"].select-row');
+
+        checkboxes.forEach(chk => {
+            const rowId = chk.value; // Assuming value holds the ID
+
+            // Restore state from selectedIds (which may have been loaded from storage)
+            chk.checked = this.selectedIds.has(rowId);
+
+            // Bind click
+            chk.onchange = (e) => {
+                this._toggleId(rowId, e.target.checked);
+            };
+        });
+
+        this._updateCheckAllState();
+    }
+
+    _toggleId(id, checked) {
+        if (checked) this.selectedIds.add(id);
+        else this.selectedIds.delete(id);
+
+        this._updateCheckAllState();
+        this._saveToStorage();
+        this.table._emit('selectionChange', { selected: Array.from(this.selectedIds) });
+    }
+
+    toggleAll(checked) {
+        const checkboxes = this.table.tbody.querySelectorAll('input[type="checkbox"].select-row');
+        checkboxes.forEach(chk => {
+            chk.checked = checked;
+            const rowId = chk.value;
+            if (checked) this.selectedIds.add(rowId);
+            else this.selectedIds.delete(rowId);
+        });
+
+        this._saveToStorage();
+        this.table._emit('selectionChange', { selected: Array.from(this.selectedIds) });
+    }
+
+    _updateCheckAllState() {
+        const checkAll = this.table.table.querySelector('thead input[type="checkbox"].select-all');
+        if (!checkAll) return;
+
+        const checkboxes = Array.from(this.table.tbody.querySelectorAll('input[type="checkbox"].select-row'));
+        if (checkboxes.length === 0) {
+            checkAll.checked = false;
+            checkAll.indeterminate = false;
+            return;
+        }
+
+        const allChecked = checkboxes.every(c => c.checked);
+        const someChecked = checkboxes.some(c => c.checked);
+
+        checkAll.checked = allChecked;
+        checkAll.indeterminate = someChecked && !allChecked;
+    }
+
+    // ==================== STORAGE ====================
+
+    /**
+     * Save selection to storage
+     */
+    _saveToStorage() {
+        if (!this.persist) return;
+
+        try {
+            const storage = this.storageType === 'sessionStorage' ? sessionStorage : localStorage;
+            storage.setItem(this.storageKey, JSON.stringify(Array.from(this.selectedIds)));
+        } catch (e) {
+            console.warn('DSTableSelection: Failed to save to storage', e);
+        }
+    }
+
+    /**
+     * Load selection from storage
+     */
+    _loadFromStorage() {
+        try {
+            const storage = this.storageType === 'sessionStorage' ? sessionStorage : localStorage;
+            const saved = storage.getItem(this.storageKey);
+
+            if (saved) {
+                const ids = JSON.parse(saved);
+                if (Array.isArray(ids)) {
+                    this.selectedIds = new Set(ids.map(String));
+                }
+            }
+        } catch (e) {
+            console.warn('DSTableSelection: Failed to load from storage', e);
+        }
+    }
+
+    /**
+     * Clear storage
+     */
+    _clearStorage() {
+        if (!this.persist) return;
+
+        try {
+            const storage = this.storageType === 'sessionStorage' ? sessionStorage : localStorage;
+            storage.removeItem(this.storageKey);
+        } catch (e) {
+            console.warn('DSTableSelection: Failed to clear storage', e);
+        }
+    }
+
+    // ==================== PUBLIC API ====================
+
+    /**
+     * Get all selected IDs
+     */
+    getSelected() {
+        return Array.from(this.selectedIds);
+    }
+
+    /**
+     * Set selected IDs programmatically
+     */
+    setSelected(ids) {
+        this.selectedIds = new Set(ids.map(String));
+        this._saveToStorage();
+        this.update();
+        this.table._emit('selectionChange', { selected: Array.from(this.selectedIds) });
+    }
+
+    /**
+     * Clear all selections
+     */
+    clearAll() {
+        this.selectedIds.clear();
+        this._clearStorage();
+        this.update();
+        this.table._emit('selectionChange', { selected: [] });
+    }
+
+    /**
+     * Check if an ID is selected
+     */
+    isSelected(id) {
+        return this.selectedIds.has(String(id));
+    }
+}
+export default DSTableSelection;
+

package/src/DSTable/DSTableSort.js

@@ -1,58 +1,58 @@
-export class DSTableSort {
-    constructor(tableInstance) {
-        this.table = tableInstance;
-        this.table.registerModule('sort', this);
-
-        // We need to attach listeners to table headers row
-        this.headers = this.table.wrapper.querySelectorAll('thead th[data-sort]');
-
-        if (this.headers.length > 0) {
-            this._init();
-        }
-    }
-
-    _init() {
-        this.headers.forEach(th => {
-            th.classList.add('cursor-pointer', 'hover:bg-base-200'); // Add UI hint
-            th.addEventListener('click', () => {
-                const sortKey = th.dataset.sort;
-                let currentDir = this.table.getParam('sort_order') || 'asc';
-                let currentSort = this.table.getParam('sort_by');
-
-                // Toggle if clicking same header, else default asc
-                if (currentSort === sortKey) {
-                    currentDir = currentDir === 'asc' ? 'desc' : 'asc';
-                } else {
-                    currentDir = 'asc';
-                }
-
-                // Reset page to 1 when sorting changes
-                this.table.setParam('page', 1);
-                this.table.setParam('sort_by', sortKey);
-                this.table.setParam('sort_order', currentDir);
-
-                this._updateIcons(th, currentDir);
-                this.table.loadData();
-            });
-        });
-    }
-
-    _updateIcons(activeTh, dir) {
-        this.headers.forEach(th => {
-            // Remove existing icons
-            const icon = th.querySelector('.sort-icon');
-            if (icon) icon.remove();
-            th.classList.remove('text-primary'); // Remove active color
-        });
-
-        // Add icon to active
-        // Simple text arrow for now, can be SVG
-        const arrow = dir === 'asc' ? '↑' : '↓';
-        const span = document.createElement('span');
-        span.className = 'sort-icon ml-1';
-        span.textContent = arrow;
-        activeTh.appendChild(span);
-        activeTh.classList.add('text-primary');
-    }
-}
-export default DSTableSort;
+export class DSTableSort {
+    constructor(tableInstance) {
+        this.table = tableInstance;
+        this.table.registerModule('sort', this);
+
+        // We need to attach listeners to table headers row
+        this.headers = this.table.wrapper.querySelectorAll('thead th[data-sort]');
+
+        if (this.headers.length > 0) {
+            this._init();
+        }
+    }
+
+    _init() {
+        this.headers.forEach(th => {
+            th.classList.add('cursor-pointer', 'hover:bg-base-200'); // Add UI hint
+            th.addEventListener('click', () => {
+                const sortKey = th.dataset.sort;
+                let currentDir = this.table.getParam('sort_order') || 'asc';
+                let currentSort = this.table.getParam('sort_by');
+
+                // Toggle if clicking same header, else default asc
+                if (currentSort === sortKey) {
+                    currentDir = currentDir === 'asc' ? 'desc' : 'asc';
+                } else {
+                    currentDir = 'asc';
+                }
+
+                // Reset page to 1 when sorting changes
+                this.table.setParam('page', 1);
+                this.table.setParam('sort_by', sortKey);
+                this.table.setParam('sort_order', currentDir);
+
+                this._updateIcons(th, currentDir);
+                this.table.loadData();
+            });
+        });
+    }
+
+    _updateIcons(activeTh, dir) {
+        this.headers.forEach(th => {
+            // Remove existing icons
+            const icon = th.querySelector('.sort-icon');
+            if (icon) icon.remove();
+            th.classList.remove('text-primary'); // Remove active color
+        });
+
+        // Add icon to active
+        // Simple text arrow for now, can be SVG
+        const arrow = dir === 'asc' ? '↑' : '↓';
+        const span = document.createElement('span');
+        span.className = 'sort-icon ml-1';
+        span.textContent = arrow;
+        activeTh.appendChild(span);
+        activeTh.classList.add('text-primary');
+    }
+}
+export default DSTableSort;