@visactor/vtable-plugins 1.22.7-alpha.7 → 1.22.7-alpha.9

package/dist/vtable-plugins.js

@@ -10117,10 +10117,26 @@ ${recordsStr}
             const newFilter = new Map(state.filters);
             switch (type) {
                 case exports.FilterActionType.ADD_FILTER:
-                    newFilter.set(payload.field, payload);
+                    if (payload.shouldKeepUnrelatedState) {
+                        newFilter.set(payload.field, { ...newFilter.get(payload.field), ...payload });
+                    }
+                    else {
+                        newFilter.set(payload.field, payload);
+                    }
                     break;
                 case exports.FilterActionType.REMOVE_FILTER:
-                    newFilter.delete(payload.field);
+                    if (payload.shouldKeepUnrelatedState && payload.type === 'byValue') {
+                        delete newFilter.get(payload.field).values;
+                        newFilter.set(payload.field, { ...newFilter.get(payload.field), enable: false });
+                    }
+                    else if (payload.shouldKeepUnrelatedState && payload.type === 'byCondition') {
+                        delete newFilter.get(payload.field).condition;
+                        delete newFilter.get(payload.field).operator;
+                        newFilter.set(payload.field, { ...newFilter.get(payload.field), enable: false });
+                    }
+                    else {
+                        newFilter.delete(payload.field);
+                    }
                     break;
                 case exports.FilterActionType.UPDATE_FILTER:
                     newFilter.set(payload.field, { ...newFilter.get(payload.field), ...payload });
@@ -10381,42 +10397,6 @@ ${recordsStr}
             this.candidateKeys.set(fieldId, countMap);
             this.toUnformattedCache.set(fieldId, toUnformatted);
         }
-        syncRulesAndCandidateKeys() {
-            const currentRecords = this.table.internalProps.dataSource.records;
-            const filteredFields = this.filterStateManager.getActiveFilterFields();
-            currentRecords.forEach(record => {
-                filteredFields.forEach(candidateField => {
-                    const formatFn = this.getFormatFnCache(candidateField);
-                    if (isValid$2(record)) {
-                        const originalValue = record[candidateField];
-                        const formattedValue = formatFn(record);
-                        const lastToUnformatted = this.toUnformattedCache.get(candidateField) || new Map();
-                        if (!lastToUnformatted.has(formattedValue) &&
-                            this.filterStateManager.getFilterState(candidateField)?.values?.length > 0) {
-                            this.filterStateManager.getFilterState(candidateField).values.push(originalValue);
-                            this.selectedKeys.get(candidateField).add(originalValue);
-                        }
-                    }
-                });
-            });
-        }
-        syncSelectedKeys() {
-            const currentRecords = this.table.internalProps.dataSource.records;
-            const filteredFields = this.filterStateManager.getActiveFilterFields();
-            currentRecords.forEach(record => {
-                filteredFields.forEach(candidateField => {
-                    if (isValid$2(record)) {
-                        const originalValue = record[candidateField];
-                        if (this.filterStateManager.getFilterState(candidateField)?.type === 'byCondition') {
-                            if (!this.selectedKeys.get(candidateField)) {
-                                this.selectedKeys.set(candidateField, new Set());
-                            }
-                            this.selectedKeys.get(candidateField).add(originalValue);
-                        }
-                    }
-                });
-            });
-        }
         collectCandidateKeysForFilteredColumn(candidateField) {
             const syncFilterItemsState = this.pluginOptions?.syncFilterItemsState ?? true;
             const filteredFields = this.filterStateManager.getActiveFilterFields().filter(field => field !== candidateField);
@@ -10485,7 +10465,7 @@ ${recordsStr}
             if (isHasFilteredState && isValueFilter) {
                 return;
             }
-            let selectedValues = new Set();
+            const selectedValues = new Set();
             const originalValues = new Set();
             const originalRecords = this.table.internalProps.records;
             originalRecords.forEach(record => {
@@ -10501,23 +10481,41 @@ ${recordsStr}
                         selectedValues.add(record[fieldId]);
                     }
                 });
+                const hasFiltered = !arrayEqual(Array.from(originalValues), Array.from(selectedValues));
+                if (hasFiltered) {
+                    this.selectedKeys.set(fieldId, selectedValues);
+                    this.filterStateManager.dispatch({
+                        type: exports.FilterActionType.ADD_FILTER,
+                        payload: {
+                            field: fieldId,
+                            type: 'byValue',
+                            values: Array.from(selectedValues),
+                            enable: true
+                        }
+                    });
+                }
             }
             else {
-                const selectedFromRules = this.filterStateManager.getFilterState(fieldId)?.values || originalValues;
-                selectedValues = new Set(selectedFromRules);
-            }
-            this.selectedKeys.set(fieldId, selectedValues);
-            const hasFiltered = !arrayEqual(Array.from(originalValues), Array.from(selectedValues));
-            if (hasFiltered) {
-                this.filterStateManager.dispatch({
-                    type: exports.FilterActionType.ADD_FILTER,
-                    payload: {
-                        field: fieldId,
-                        type: 'byValue',
-                        values: Array.from(selectedValues),
-                        enable: true
+                const selectedRules = this.filterStateManager.getFilterState(fieldId)?.values;
+                if (selectedRules) {
+                    const hasFiltered = !arrayEqual(Array.from(originalValues), selectedRules);
+                    if (hasFiltered) {
+                        this.selectedKeys.set(fieldId, new Set(selectedRules));
+                        this.filterStateManager.dispatch({
+                            type: exports.FilterActionType.ADD_FILTER,
+                            payload: {
+                                field: fieldId,
+                                type: 'byValue',
+                                values: selectedRules,
+                                enable: true,
+                                shouldKeepUnrelatedState: true
+                            }
+                        });
                     }
-                });
+                }
+                else {
+                    this.selectedKeys.set(fieldId, originalValues);
+                }
             }
         }
         applyFilter(fieldId = this.selectedField) {
@@ -10535,14 +10533,17 @@ ${recordsStr}
                 .filter(key => key !== null)
                 .flat();
             this.selectedKeys.set(fieldId, new Set(selections));
-            if (selections.length >= 0 && selections.length < this.valueFilterOptionList.get(fieldId).length) {
+            const syncFilterItemsState = this.pluginOptions?.syncFilterItemsState ?? true;
+            if ((selections.length >= 0 && selections.length < this.valueFilterOptionList.get(fieldId).length) ||
+                !syncFilterItemsState) {
                 this.filterStateManager.dispatch({
                     type: exports.FilterActionType.APPLY_FILTERS,
                     payload: {
                         field: fieldId,
                         type: 'byValue',
                         values: selections,
-                        enable: true
+                        enable: true,
+                        shouldKeepUnrelatedState: !syncFilterItemsState
                     }
                 });
             }
@@ -10550,7 +10551,8 @@ ${recordsStr}
                 this.filterStateManager.dispatch({
                     type: exports.FilterActionType.REMOVE_FILTER,
                     payload: {
-                        field: fieldId
+                        field: fieldId,
+                        type: 'byValue'
                     }
                 });
             }
@@ -10786,6 +10788,7 @@ ${recordsStr}
         table;
         filterStateManager;
         pluginOptions;
+        filterToolBarHide;
         styles;
         filterByConditionPanel;
         conditionContainer;
@@ -10802,13 +10805,14 @@ ${recordsStr}
         currentCategory = exports.FilterOperatorCategory.ALL;
         categories = [];
         operators = [];
-        constructor(table, filterStateManager, pluginOptions) {
+        constructor(table, filterStateManager, pluginOptions, filterToolBarHide) {
             this.table = table;
             this.filterStateManager = filterStateManager;
             this.pluginOptions = pluginOptions;
             this.styles = pluginOptions.styles || {};
             this.categories = pluginOptions.conditionCategories;
             this.operators = operators;
+            this.filterToolBarHide = filterToolBarHide;
         }
         setSelectedField(fieldId) {
             this.selectedField = fieldId;
@@ -10853,19 +10857,19 @@ ${recordsStr}
         loadCurrentFilterState() {
             const filter = this.filterStateManager.getFilterState(this.selectedField);
             const syncFilterItemsState = this.pluginOptions?.syncFilterItemsState ?? true;
-            if (filter && (filter.type === 'byCondition' || !syncFilterItemsState)) {
-                if (filter.operator && this.operatorSelect) {
-                    this.operatorSelect.value = filter.operator;
+            if ((filter && filter.type === 'byCondition') || !syncFilterItemsState) {
+                if (this.operatorSelect) {
+                    this.operatorSelect.value = filter?.operator ?? operators[0].value;
                 }
-                if (filter.condition !== undefined && this.valueInput) {
-                    if (Array.isArray(filter.condition)) {
+                if (this.valueInput) {
+                    if (Array.isArray(filter?.condition)) {
                         this.valueInput.value = String(filter.condition[0]);
                         if (this.valueInputMax) {
                             this.valueInputMax.value = String(filter.condition[1]);
                         }
                     }
                     else {
-                        this.valueInput.value = String(filter.condition);
+                        this.valueInput.value = String(filter?.condition ?? '');
                         if (this.valueInputMax) {
                             this.valueInputMax.value = '';
                         }
@@ -10957,6 +10961,7 @@ ${recordsStr}
                 this.clearFilter(fieldId);
                 return;
             }
+            const syncFilterItemsState = this.pluginOptions?.syncFilterItemsState ?? true;
             this.filterStateManager.dispatch({
                 type: exports.FilterActionType.APPLY_FILTERS,
                 payload: {
@@ -10964,10 +10969,10 @@ ${recordsStr}
                     type: 'byCondition',
                     operator,
                     condition: conditionValue,
-                    enable: true
+                    enable: true,
+                    shouldKeepUnrelatedState: !syncFilterItemsState
                 }
             });
-            this.hide();
         }
         clearFilter(fieldId) {
             this.filterStateManager.dispatch({
@@ -11048,11 +11053,13 @@ ${recordsStr}
             this.valueInput.addEventListener('keypress', event => {
                 if (event.key === 'Enter') {
                     this.applyFilter();
+                    this.filterToolBarHide();
                 }
             });
             this.valueInputMax.addEventListener('keypress', event => {
                 if (event.key === 'Enter') {
                     this.applyFilter();
+                    this.filterToolBarHide();
                 }
             });
             this.categorySelect.addEventListener('change', () => {
@@ -11111,7 +11118,7 @@ ${recordsStr}
             this.table = table;
             this.filterStateManager = filterStateManager;
             this.valueFilter = new ValueFilter(this.table, this.filterStateManager, pluginOptions);
-            this.conditionFilter = new ConditionFilter(this.table, this.filterStateManager, pluginOptions);
+            this.conditionFilter = new ConditionFilter(this.table, this.filterStateManager, pluginOptions, this.hide);
             this.pluginOptions = pluginOptions;
             this.filterMenuWidth = 300;
             this.filterStateManager.subscribe(state => {
@@ -11150,7 +11157,7 @@ ${recordsStr}
             else if (this.activeTab === 'byCondition') {
                 this.conditionFilter.applyFilter(field);
             }
-            this.hide(this.currentCol, this.currentRow);
+            this.hide();
         }
         clearFilter(field) {
             if (this.valueFilter) {
@@ -11159,7 +11166,7 @@ ${recordsStr}
             if (this.conditionFilter) {
                 this.conditionFilter.clearFilter(field);
             }
-            this.hide(this.currentCol, this.currentRow);
+            this.hide();
         }
         updateClearFilterButtonState(field) {
             const currentFilter = this.filterStateManager.getFilterState(field);
@@ -11232,7 +11239,7 @@ ${recordsStr}
             this.filterTabByCondition.addEventListener('click', () => {
                 this.onTabSwitch('byCondition');
             });
-            this.cancelFilterButton.addEventListener('click', () => this.hide(this.currentCol, this.currentRow));
+            this.cancelFilterButton.addEventListener('click', () => this.hide());
             this.clearFilterOptionLink.addEventListener('click', e => {
                 e.preventDefault();
                 this.clearFilter(this.selectedField);
@@ -11242,7 +11249,7 @@ ${recordsStr}
             });
             document.addEventListener('click', () => {
                 if (this.isVisible) {
-                    this.hide(this.currentCol, this.currentRow);
+                    this.hide();
                 }
             });
             this.filterMenu.addEventListener('click', e => {
@@ -11314,14 +11321,14 @@ ${recordsStr}
                 });
             }, 0);
         }
-        hide(currentCol, currentRow) {
+        hide = (currentCol, currentRow) => {
             this.filterMenu.style.display = 'none';
             this.isVisible = false;
             this.table.fireListeners(VTable.TABLE_EVENT_TYPE.FILTER_MENU_HIDE, {
-                col: currentCol,
-                row: currentRow
+                col: currentCol ?? this.currentCol,
+                row: currentRow ?? this.currentRow
             });
-        }
+        };
         destroy() {
             this.valueFilter.destroy();
             this.filterMenu.remove();