vgapp 1.3.0 → 1.3.2

package/app/modules/vgdynamictable/js/editable.js

@@ -1,13 +1,13 @@
-import EventHandler from "../../../utils/js/dom/event";
-import Data from "../../../utils/js/dom/data";
-
-const TABLE_SELECTOR = '[data-vg-table]';
-const ROW_SELECTOR = 'tbody tr:not([data-group-header="1"])';
-const ROW_CHECK_SELECTOR = '[data-row-select]';
-const CHECK_ALL_SELECTOR = '[data-select-all]';
-const DEFAULT_ROW_REORDER_HANDLE_SELECTOR = '[data-row-reorder-handle]';
-const ROW_REORDER_IGNORE_SELECTOR = 'input, button, a, select, textarea, [contenteditable="true"]';
-const TABLE_DATA_KEY = 'vg.dynamicTable';
+import EventHandler from "../../../utils/js/dom/event";
+import Data from "../../../utils/js/dom/data";
+
+const TABLE_SELECTOR = '[data-vg-table]';
+const ROW_SELECTOR = 'tbody tr:not([data-group-header="1"])';
+const ROW_CHECK_SELECTOR = '[data-row-select]';
+const CHECK_ALL_SELECTOR = '[data-select-all]';
+const DEFAULT_ROW_REORDER_HANDLE_SELECTOR = '[data-row-reorder-handle]';
+const ROW_REORDER_IGNORE_SELECTOR = 'input, button, a, select, textarea, [contenteditable="true"]';
+const TABLE_DATA_KEY = 'vg.dynamicTable';
 const ACTION_CALLBACK_MAP = {
     rowcheck: 'onRowCheck',
     checkall: 'onCheckAll',
@@ -403,12 +403,12 @@ class Editable {
             : {};
     }
 
-    static _getTableInstance(table) {
-        if (!table) {
-            return null;
-        }
-        return Data.get(table, TABLE_DATA_KEY);
-    }
+    static _getTableInstance(table) {
+        if (!table) {
+            return null;
+        }
+        return Data.get(table, TABLE_DATA_KEY);
+    }
 
     static _getEventPrefix(table) {
         const instance = this._getTableInstance(table);
@@ -431,8 +431,8 @@ class Editable {
     }
 }
 
-EventHandler.on(document, 'DOMContentLoaded', () => {
-    Editable.initAll();
-});
+EventHandler.on(document, 'DOMContentLoaded', () => {
+    Editable.initAll();
+});
 
 export default Editable;

package/app/modules/vgdynamictable/js/filters.js

@@ -1,6 +1,6 @@
-import {normalizeNonNegativeInt, safeQuerySelector} from "./utils/common";
-
-class Filters {
+import {normalizeNonNegativeInt, safeQuerySelector} from "./utils/common";
+
+class Filters {
     constructor(options = {}) {
         this._options = Object.assign({
             enabled: true,
@@ -19,12 +19,12 @@ class Filters {
             operatorAttr: 'data-filter-operator',
             defaultOperator: 'eq',
             skipEmpty: true,
-            trimValues: true,
-            emitOnInit: false,
-            initialValues: {},
-            onChange: null,
-            onReset: null,
-        }, options);
+            trimValues: true,
+            emitOnInit: false,
+            initialValues: {},
+            onChange: null,
+            onReset: null,
+        }, options);
 
         this._form = null;
         this._timer = null;
@@ -119,7 +119,7 @@ class Filters {
         if (!selector) {
             return null;
         }
-        return safeQuerySelector(selector);
+        return safeQuerySelector(selector);
     }
 
     _handleInput(event) {
@@ -134,8 +134,8 @@ class Filters {
             this._emit();
             return;
         }
-        clearTimeout(this._timer);
-        this._timer = setTimeout(() => this._emit(), normalizeNonNegativeInt(this._options.debounceMs, 300));
+        clearTimeout(this._timer);
+        this._timer = setTimeout(() => this._emit(), normalizeNonNegativeInt(this._options.debounceMs, 300));
     }
 
     _handleChange(event) {
@@ -169,14 +169,14 @@ class Filters {
         if (!resetButton) {
             return;
         }
-        event.preventDefault();
-        this._reset();
-        if (typeof this._options.onReset === 'function') {
-            this._options.onReset();
-        }
-        clearTimeout(this._timer);
-        this._emit();
-    }
+        event.preventDefault();
+        this._reset();
+        if (typeof this._options.onReset === 'function') {
+            this._options.onReset();
+        }
+        clearTimeout(this._timer);
+        this._emit();
+    }
 
     _handleSubmit(event) {
         if (!this._isManualMode()) {
@@ -441,7 +441,7 @@ class Filters {
         const tag = String(node.tagName || '').toUpperCase();
         return tag === 'INPUT' || tag === 'SELECT' || tag === 'TEXTAREA';
     }
-    _isManualMode() {
+    _isManualMode() {
         const mode = String(this._options.applyMode || 'auto').toLowerCase().trim();
         return mode === 'manual';
     }

package/app/modules/vgdynamictable/js/fixed.js

@@ -13,56 +13,56 @@ const fixedColumnsMethods = {
         return String(raw || '').trim();
     },
 
-    _hasFixedColumnsConfig() {
-        const attr = this._getFixedColumnsConfigRaw();
-        if (attr !== '') {
-            return true;
-        }
+    _hasFixedColumnsConfig() {
+        const attr = this._getFixedColumnsConfigRaw();
+        if (attr !== '') {
+            return true;
+        }
         const headers = this._element && this._element.tHead
             ? Array.from(this._element.tHead.querySelectorAll('th'))
             : [];
         return headers.some((header) => {
             const fixedAttr = String(header.getAttribute('data-fixed') || '').toLowerCase().trim();
             const fixedColumnAttr = String(header.getAttribute('data-fixed-column') || '').toLowerCase().trim();
-            return fixedAttr === 'left' || fixedAttr === 'right' || fixedColumnAttr === 'left' || fixedColumnAttr === 'right';
-        });
-    },
-
-    _buildFixedColumnsStateMap(fixed) {
-        const state = new Map();
-        const left = Array.isArray(fixed && fixed.left) ? fixed.left : [];
-        const right = Array.isArray(fixed && fixed.right) ? fixed.right : [];
-        left.forEach((index) => {
-            if (Number.isInteger(index) && index >= 0) {
-                state.set(index, 'left');
-            }
-        });
-        right.forEach((index) => {
-            if (Number.isInteger(index) && index >= 0 && !state.has(index)) {
-                state.set(index, 'right');
-            }
-        });
-        return state;
-    },
-
-    _collectFixedColumnsTransitions(nextState) {
-        const previousState = this._fixedColumnsLastStateMap instanceof Map
-            ? this._fixedColumnsLastStateMap
-            : new Map();
-        const transitions = [];
-        nextState.forEach((side, index) => {
-            if (previousState.get(index) !== side) {
-                transitions.push({ index, side });
-            }
-        });
-        this._fixedColumnsLastStateMap = nextState;
-        return transitions;
-    },
-
-    _applyFixedColumnsLayout() {
-        if (!this._element) {
-            return;
-        }
+            return fixedAttr === 'left' || fixedAttr === 'right' || fixedColumnAttr === 'left' || fixedColumnAttr === 'right';
+        });
+    },
+
+    _buildFixedColumnsStateMap(fixed) {
+        const state = new Map();
+        const left = Array.isArray(fixed && fixed.left) ? fixed.left : [];
+        const right = Array.isArray(fixed && fixed.right) ? fixed.right : [];
+        left.forEach((index) => {
+            if (Number.isInteger(index) && index >= 0) {
+                state.set(index, 'left');
+            }
+        });
+        right.forEach((index) => {
+            if (Number.isInteger(index) && index >= 0 && !state.has(index)) {
+                state.set(index, 'right');
+            }
+        });
+        return state;
+    },
+
+    _collectFixedColumnsTransitions(nextState) {
+        const previousState = this._fixedColumnsLastStateMap instanceof Map
+            ? this._fixedColumnsLastStateMap
+            : new Map();
+        const transitions = [];
+        nextState.forEach((side, index) => {
+            if (previousState.get(index) !== side) {
+                transitions.push({ index, side });
+            }
+        });
+        this._fixedColumnsLastStateMap = nextState;
+        return transitions;
+    },
+
+    _applyFixedColumnsLayout() {
+        if (!this._element) {
+            return;
+        }
         const suppressFixedColumns = Boolean(this._fixedColumnsSuppressed);
 
         const sourceHeaders = this._element.tHead ? Array.from(this._element.tHead.querySelectorAll('th')) : [];
@@ -74,40 +74,40 @@ const fixedColumnsMethods = {
             ? { left: [], right: [] }
             : this._applyMobileFixedColumnsGuard(this._element, sourceFixedRaw);
         const hasSourceFixed = sourceFixed.left.length > 0 || sourceFixed.right.length > 0;
-        this._element.classList.toggle('table-fixed-cols', hasSourceFixed);
-        if (this._parent) {
-            this._parent.classList.toggle('table-fixed-cols', hasSourceFixed);
-        }
-        const sourceFixedTransitions = this._collectFixedColumnsTransitions(
-            this._buildFixedColumnsStateMap(sourceFixed)
-        );
-        this._applyFixedColumnsToTable(this._element, sourceFixed, {
-            includeBody: true,
-            emitAction: true,
-            transitionedColumns: sourceFixedTransitions,
-        });
-        this._toggleFixedColumnsScrollBinding(hasSourceFixed);
-
-        const cloneTable = this._cloneStickyState && this._cloneStickyState.table
-            ? this._cloneStickyState.table
-            : null;
+        this._element.classList.toggle('table-fixed-cols', hasSourceFixed);
+        if (this._parent) {
+            this._parent.classList.toggle('table-fixed-cols', hasSourceFixed);
+        }
+        const sourceFixedTransitions = this._collectFixedColumnsTransitions(
+            this._buildFixedColumnsStateMap(sourceFixed)
+        );
+        this._applyFixedColumnsToTable(this._element, sourceFixed, {
+            includeBody: true,
+            emitAction: true,
+            transitionedColumns: sourceFixedTransitions,
+        });
+        this._toggleFixedColumnsScrollBinding(hasSourceFixed);
+
+        const cloneTable = this._cloneStickyState && this._cloneStickyState.table
+            ? this._cloneStickyState.table
+            : null;
         if (cloneTable) {
             const cloneHeaders = cloneTable.tHead ? Array.from(cloneTable.tHead.querySelectorAll('th')) : [];
             const cloneFixedRaw = this._getFixedColumnsByHeaders(cloneHeaders, {
                 parseTableAttr: false,
                 fallbackByPosition: false,
             });
-            const cloneFixed = hasSourceFixed
-                ? this._applyMobileFixedColumnsGuard(cloneTable, cloneFixedRaw)
-                : { left: [], right: [] };
-            this._applyFixedColumnsToTable(cloneTable, cloneFixed, {
-                includeBody: false,
-                emitAction: false,
-            });
-        }
-        this._rebuildFixedColumnsCellsCache();
-        this._syncFixedColumnsScroll({ immediate: true });
-    },
+            const cloneFixed = hasSourceFixed
+                ? this._applyMobileFixedColumnsGuard(cloneTable, cloneFixedRaw)
+                : { left: [], right: [] };
+            this._applyFixedColumnsToTable(cloneTable, cloneFixed, {
+                includeBody: false,
+                emitAction: false,
+            });
+        }
+        this._rebuildFixedColumnsCellsCache();
+        this._syncFixedColumnsScroll({ immediate: true });
+    },
 
     _applyMobileFixedColumnsGuard(table, fixed) {
         const next = {
@@ -234,19 +234,19 @@ const fixedColumnsMethods = {
         return { left, right };
     },
 
-    _applyFixedColumnsToTable(table, fixed, options = {}) {
-        if (!table) {
-            return;
-        }
-        const includeBody = options.includeBody !== false;
-        const shouldEmitAction = options.emitAction !== false;
-        const transitionedColumns = Array.isArray(options.transitionedColumns)
-            ? options.transitionedColumns
-            : [];
-        const sections = [];
-        if (table.tHead) {
-            sections.push(table.tHead);
-        }
+    _applyFixedColumnsToTable(table, fixed, options = {}) {
+        if (!table) {
+            return;
+        }
+        const includeBody = options.includeBody !== false;
+        const shouldEmitAction = options.emitAction !== false;
+        const transitionedColumns = Array.isArray(options.transitionedColumns)
+            ? options.transitionedColumns
+            : [];
+        const sections = [];
+        if (table.tHead) {
+            sections.push(table.tHead);
+        }
         if (includeBody && table.tBodies && table.tBodies.length) {
             sections.push(...Array.from(table.tBodies));
         }
@@ -282,17 +282,17 @@ const fixedColumnsMethods = {
             ? viewportMetrics.effectiveWidth
             : tableRect.width;
         const metrics = {};
-        headerCells.forEach((cell, index) => {
-            const rect = cell.getBoundingClientRect();
-            metrics[index] = {
-                width: Math.max(0, rect.width),
-                left: Math.max(0, rect.left - tableRect.left),
-                height: Math.max(0, rect.height),
-                top: Math.max(0, rect.top - tableRect.top),
-            };
-        });
-        const leftOffsets = {};
-        let leftOffset = 0;
+        headerCells.forEach((cell, index) => {
+            const rect = cell.getBoundingClientRect();
+            metrics[index] = {
+                width: Math.max(0, rect.width),
+                left: Math.max(0, rect.left - tableRect.left),
+                height: Math.max(0, rect.height),
+                top: Math.max(0, rect.top - tableRect.top),
+            };
+        });
+        const leftOffsets = {};
+        let leftOffset = 0;
         fixed.left.forEach((index) => {
             const width = metrics[index] ? metrics[index].width : 0;
             leftOffsets[index] = leftOffset;
@@ -318,10 +318,10 @@ const fixedColumnsMethods = {
                 if (!cell) {
                     return;
                 }
-                const metric = metrics[index] || { left: 0 };
-                const baseShift = leftOffsets[index] - metric.left;
-                cell.setAttribute('data-fixed-side', 'left');
-                cell.setAttribute('data-fixed-shift', String(baseShift));
+                const metric = metrics[index] || { left: 0 };
+                const baseShift = leftOffsets[index] - metric.left;
+                cell.setAttribute('data-fixed-side', 'left');
+                cell.setAttribute('data-fixed-shift', String(baseShift));
                 cell.style.zIndex = String(zIndex);
                 if (index === leftEdgeIndex) {
                     cell.setAttribute('data-fixed-edge', 'right');
@@ -333,83 +333,83 @@ const fixedColumnsMethods = {
                 if (!cell) {
                     return;
                 }
-                const metric = metrics[index] || { left: 0, width: 0 };
-                const desiredLeft = viewportWidth - rightOffsets[index] - metric.width;
-                const baseShift = desiredLeft - metric.left;
-                cell.setAttribute('data-fixed-side', 'right');
+                const metric = metrics[index] || { left: 0, width: 0 };
+                const desiredLeft = viewportWidth - rightOffsets[index] - metric.width;
+                const baseShift = desiredLeft - metric.left;
+                cell.setAttribute('data-fixed-side', 'right');
                 cell.setAttribute('data-fixed-shift', String(baseShift));
                 cell.style.zIndex = String(zIndex);
                 if (index === rightEdgeIndex) {
                     cell.setAttribute('data-fixed-edge', 'left');
-                }
-            });
-        });
-
-        if (!shouldEmitAction || typeof this._emitAction !== 'function' || !transitionedColumns.length) {
-            return;
-        }
-
-        transitionedColumns.forEach((entry) => {
-            const index = Number.isInteger(entry && entry.index) ? entry.index : -1;
-            const side = entry && (entry.side === 'left' || entry.side === 'right')
-                ? entry.side
-                : '';
-            const headerCell = index >= 0 && index < headerCells.length
-                ? headerCells[index]
-                : null;
-            if (!headerCell || !side) {
-                return;
-            }
-
-            const metric = metrics[index] || { left: 0, width: 0, top: 0, height: 0 };
-            const width = metric.width || 0;
-            const height = metric.height || 0;
-            const left = side === 'left'
-                ? (leftOffsets[index] || 0)
-                : Math.max(0, viewportWidth - (rightOffsets[index] || 0) - width);
-            const right = side === 'right'
-                ? (rightOffsets[index] || 0)
-                : Math.max(0, viewportWidth - left - width);
-            const top = metric.top || 0;
-            const bottom = Math.max(0, tableRect.height - top - height);
-            const field = String(headerCell.getAttribute('data-field') || '').trim();
-            const fallbackBaseShift = left - (metric.left || 0);
-            const attrBaseShift = Number.parseFloat(headerCell.getAttribute('data-fixed-shift') || '');
-            const baseShift = Number.isFinite(attrBaseShift) ? attrBaseShift : fallbackBaseShift;
-            const scrollLeft = this._tableViewport ? (this._tableViewport.scrollLeft || 0) : 0;
-            const fixedAtTs = Date.now();
-
-            this._emitAction('columnfixed', {
-                columnIndex: index,
-                side,
-                phase: 'fixed',
-                field,
-                column: {
-                    index,
-                    side,
-                    field,
-                    width,
-                    height,
-                    element: headerCell,
-                },
-                offsets: {
-                    left,
-                    right,
-                    top,
-                    bottom,
-                },
-                shift: {
-                    base: baseShift,
-                    current: baseShift + scrollLeft,
-                    scrollLeft,
-                },
-                fixedAt: {
-                    timestamp: fixedAtTs,
-                    iso: new Date(fixedAtTs).toISOString(),
-                },
-            });
-        });
-    },
+                }
+            });
+        });
+
+        if (!shouldEmitAction || typeof this._emitAction !== 'function' || !transitionedColumns.length) {
+            return;
+        }
+
+        transitionedColumns.forEach((entry) => {
+            const index = Number.isInteger(entry && entry.index) ? entry.index : -1;
+            const side = entry && (entry.side === 'left' || entry.side === 'right')
+                ? entry.side
+                : '';
+            const headerCell = index >= 0 && index < headerCells.length
+                ? headerCells[index]
+                : null;
+            if (!headerCell || !side) {
+                return;
+            }
+
+            const metric = metrics[index] || { left: 0, width: 0, top: 0, height: 0 };
+            const width = metric.width || 0;
+            const height = metric.height || 0;
+            const left = side === 'left'
+                ? (leftOffsets[index] || 0)
+                : Math.max(0, viewportWidth - (rightOffsets[index] || 0) - width);
+            const right = side === 'right'
+                ? (rightOffsets[index] || 0)
+                : Math.max(0, viewportWidth - left - width);
+            const top = metric.top || 0;
+            const bottom = Math.max(0, tableRect.height - top - height);
+            const field = String(headerCell.getAttribute('data-field') || '').trim();
+            const fallbackBaseShift = left - (metric.left || 0);
+            const attrBaseShift = Number.parseFloat(headerCell.getAttribute('data-fixed-shift') || '');
+            const baseShift = Number.isFinite(attrBaseShift) ? attrBaseShift : fallbackBaseShift;
+            const scrollLeft = this._tableViewport ? (this._tableViewport.scrollLeft || 0) : 0;
+            const fixedAtTs = Date.now();
+
+            this._emitAction('columnfixed', {
+                columnIndex: index,
+                side,
+                phase: 'fixed',
+                field,
+                column: {
+                    index,
+                    side,
+                    field,
+                    width,
+                    height,
+                    element: headerCell,
+                },
+                offsets: {
+                    left,
+                    right,
+                    top,
+                    bottom,
+                },
+                shift: {
+                    base: baseShift,
+                    current: baseShift + scrollLeft,
+                    scrollLeft,
+                },
+                fixedAt: {
+                    timestamp: fixedAtTs,
+                    iso: new Date(fixedAtTs).toISOString(),
+                },
+            });
+        });
+    },
 
     _toggleFixedColumnsScrollBinding(enabled) {
         if (!this._tableViewport) {
@@ -436,12 +436,12 @@ const fixedColumnsMethods = {
         }
         this._fixedColumnsSyncFrame = 0;
         this._fixedColumnsLastScrollLeft = 0;
-        this._fixedColumnsLastAppliedScrollLeft = Number.NaN;
-        this._fixedColumnsLastShadowStateKey = '';
-        this._fixedColumnsCellsCache = [];
-        this._fixedColumnsShadowTargetsCache = [];
-        this._fixedColumnsLastStateMap = new Map();
-    },
+        this._fixedColumnsLastAppliedScrollLeft = Number.NaN;
+        this._fixedColumnsLastShadowStateKey = '';
+        this._fixedColumnsCellsCache = [];
+        this._fixedColumnsShadowTargetsCache = [];
+        this._fixedColumnsLastStateMap = new Map();
+    },
 
     _rebuildFixedColumnsCellsCache() {
         const tables = [this._element];

package/app/modules/vgdynamictable/js/pagination.js

@@ -1,4 +1,4 @@
-import VGDropdown from "../../vgdropdown";
+import VGDropdown from "../../vgdropdown";
 
 class Pagination {
 	constructor(el, params = {}) {

package/app/modules/vgdynamictable/js/search.js

@@ -1,6 +1,6 @@
-import {normalizeNonNegativeInt, safeQuerySelector} from "./utils/common";
-
-class Search {
+import {normalizeNonNegativeInt, safeQuerySelector} from "./utils/common";
+
+class Search {
     constructor(options = {}) {
         this._options = Object.assign({
             enabled: true,
@@ -27,10 +27,10 @@ class Search {
             return;
         }
 
-        const input = safeQuerySelector(selector);
-        if (!input) {
-            return;
-        }
+        const input = safeQuerySelector(selector);
+        if (!input) {
+            return;
+        }
 
         this._input = input;
         this._input.addEventListener('input', this._boundInput);
@@ -50,10 +50,10 @@ class Search {
     }
 
     _handleInput() {
-        clearTimeout(this._timer);
-        this._timer = setTimeout(() => {
-            this._emit();
-        }, normalizeNonNegativeInt(this._options.debounceMs, 300));
+        clearTimeout(this._timer);
+        this._timer = setTimeout(() => {
+            this._emit();
+        }, normalizeNonNegativeInt(this._options.debounceMs, 300));
     }
 
     _handleKeyDown(event) {
@@ -76,7 +76,7 @@ class Search {
             param: String(this._options.param || 'q'),
         });
     }
-}
+}
 
 export default Search;