@platforma-sdk/ui-vue 1.83.1 → 1.83.9

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
  WARN  Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
 
-> @platforma-sdk/ui-vue@1.83.1 build /home/runner/_work/platforma/platforma/sdk/ui-vue
+> @platforma-sdk/ui-vue@1.83.9 build /home/runner/_work/platforma/platforma/sdk/ui-vue
 > ts-builder build --target browser-lib
 
 Building browser-lib project...
@@ -19,134 +19,6 @@ Building browser-lib project...
 
 4 export function useGridColumns(props: { api: GridApi }) {
                   ~~~~~~~~~~~~~~
-src/components/PlAdvancedFilter/FilterEditor.test.ts:37:33 - error TS2307: Cannot find module './FilterEditor.vue' or its corresponding type declarations.
-
-37 let FilterEditor: typeof import("./FilterEditor.vue").default;
-                                   ~~~~~~~~~~~~~~~~~~~~
-src/components/PlAdvancedFilter/FilterEditor.test.ts:46:32 - error TS2307: Cannot find module './FilterEditor.vue' or its corresponding type declarations.
-
-46   FilterEditor = (await import("./FilterEditor.vue")).default;
-                                  ~~~~~~~~~~~~~~~~~~~~
-src/components/PlAdvancedFilter/index.ts:9:54 - error TS2307: Cannot find module './PlAdvancedFilter.vue' or its corresponding type declarations.
-
-9 export { default as PlAdvancedFilterComponent } from "./PlAdvancedFilter.vue";
-                                                       ~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgCellFile/index.ts:1:41 - error TS2307: Cannot find module './PlAgCellFile.vue' or its corresponding type declarations.
-
-1 export { default as PlAgCellFile } from "./PlAgCellFile.vue";
-                                          ~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgCellProgress/index.ts:1:45 - error TS2307: Cannot find module './PlAgCellProgress.vue' or its corresponding type declarations.
-
-1 export { default as PlAgCellProgress } from "./PlAgCellProgress.vue";
-                                              ~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgCellStatusTag/index.ts:1:46 - error TS2307: Cannot find module './PlAgCellStatusTag.vue' or its corresponding type declarations.
-
-1 export { default as PlAgCellStatusTag } from "./PlAgCellStatusTag.vue";
-                                               ~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgChartHistogramCell/index.ts:1:51 - error TS2307: Cannot find module './PlAgChartHistogramCell.vue' or its corresponding type declarations.
-
-1 export { default as PlAgChartHistogramCell } from "./PlAgChartHistogramCell.vue";
-                                                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgChartStackedBarCell/index.ts:1:52 - error TS2307: Cannot find module './PlAgChartStackedBarCell.vue' or its corresponding type declarations.
-
-1 export { default as PlAgChartStackedBarCell } from "./PlAgChartStackedBarCell.vue";
-                                                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgColumnHeader/index.ts:1:45 - error TS2307: Cannot find module './PlAgColumnHeader.vue' or its corresponding type declarations.
-
-1 export { default as PlAgColumnHeader } from "./PlAgColumnHeader.vue";
-                                              ~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgCsvExporter/index.ts:1:44 - error TS2307: Cannot find module './PlAgCsvExporter.vue' or its corresponding type declarations.
-
-1 export { default as PlAgCsvExporter } from "./PlAgCsvExporter.vue";
-                                             ~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgDataTable/compositions/useGrid.ts:18:30 - error TS2307: Cannot find module '../PlAgOverlayLoading.vue' or its corresponding type declarations.
-
-18 import PlOverlayLoading from "../PlAgOverlayLoading.vue";
-                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgDataTable/compositions/useGrid.ts:19:29 - error TS2307: Cannot find module '../PlAgOverlayNoRows.vue' or its corresponding type declarations.
-
-19 import PlOverlayNoRows from "../PlAgOverlayNoRows.vue";
-                               ~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgDataTable/index.ts:5:42 - error TS2307: Cannot find module './PlAgDataTableV2.vue' or its corresponding type declarations.
-
-5 export { default as PlDataTableV2 } from "./PlAgDataTableV2.vue";
-                                           ~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgDataTable/index.ts:6:47 - error TS2307: Cannot find module './PlAgOverlayLoading.vue' or its corresponding type declarations.
-
-6 export { default as PlAgOverlayLoading } from "./PlAgOverlayLoading.vue";
-                                                ~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgDataTable/index.ts:7:46 - error TS2307: Cannot find module './PlAgOverlayNoRows.vue' or its corresponding type declarations.
-
-7 export { default as PlAgOverlayNoRows } from "./PlAgOverlayNoRows.vue";
-                                               ~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgDataTable/sources/row-number.ts:10:30 - error TS2307: Cannot find module '../../PlAgRowNumHeader.vue' or its corresponding type declarations.
-
-10 import PlAgRowNumHeader from "../../PlAgRowNumHeader.vue";
-                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgGridColumnManager/index.ts:1:50 - error TS2307: Cannot find module './PlAgGridColumnManager.vue' or its corresponding type declarations.
-
-1 export { default as PlAgGridColumnManager } from "./PlAgGridColumnManager.vue";
-                                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgRowNumCheckbox/index.ts:1:47 - error TS2307: Cannot find module './PlAgRowNumCheckbox.vue' or its corresponding type declarations.
-
-1 export { default as PlAgRowNumCheckbox } from "./PlAgRowNumCheckbox.vue";
-                                                ~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAgTextAndButtonCell/index.ts:1:50 - error TS2307: Cannot find module './PlAgTextAndButtonCell.vue' or its corresponding type declarations.
-
-1 export { default as PlAgTextAndButtonCell } from "./PlAgTextAndButtonCell.vue";
-                                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAnnotations/index.ts:1:42 - error TS2307: Cannot find module './components/PlAnnotations.vue' or its corresponding type declarations.
-
-1 export { default as PlAnnotations } from "./components/PlAnnotations.vue";
-                                           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAnnotations/index.ts:2:47 - error TS2307: Cannot find module './components/PlAnnotationsModal.vue' or its corresponding type declarations.
-
-2 export { default as PlAnnotationsModal } from "./components/PlAnnotationsModal.vue";
-                                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlAppErrorNotificationAlert/index.ts:1:56 - error TS2307: Cannot find module './PlAppErrorNotificationAlert.vue' or its corresponding type declarations.
-
-1 export { default as PlAppErrorNotificationAlert } from "./PlAppErrorNotificationAlert.vue";
-                                                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlBtnExportArchive/index.ts:1:47 - error TS2307: Cannot find module './PlBtnExportArchive.vue' or its corresponding type declarations.
-
-1 export { default as PlBtnExportArchive } from "./PlBtnExportArchive.vue";
-                                                ~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlDatasetSelector/__tests__/PlDatasetSelector.jsdomtest.ts:5:31 - error TS2307: Cannot find module '../PlDatasetSelector.vue' or its corresponding type declarations.
-
-5 import PlDatasetSelector from "../PlDatasetSelector.vue";
-                                ~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlDatasetSelector/index.ts:1:46 - error TS2307: Cannot find module './PlDatasetSelector.vue' or its corresponding type declarations.
-
-1 export { default as PlDatasetSelector } from "./PlDatasetSelector.vue";
-                                               ~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlTableFastSearch/index.ts:1:46 - error TS2307: Cannot find module './PlTableFastSearch.vue' or its corresponding type declarations.
-
-1 export { default as PlTableFastSearch } from "./PlTableFastSearch.vue";
-                                               ~~~~~~~~~~~~~~~~~~~~~~~~~
-src/components/PlTableFilters/index.ts:1:45 - error TS2307: Cannot find module './PlTableFiltersV2.vue' or its corresponding type declarations.
-
-1 export { default as PlTableFiltersV2 } from "./PlTableFiltersV2.vue";
-                                              ~~~~~~~~~~~~~~~~~~~~~~~~
-src/lib.ts:3:40 - error TS2307: Cannot find module './components/BlockLayout.vue' or its corresponding type declarations.
-
-3 export { default as BlockLayout } from "./components/BlockLayout.vue";
-                                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/lib.ts:4:44 - error TS2307: Cannot find module './components/PlAgDataTable/PlAgDataTableV2.vue' or its corresponding type declarations.
-
-4 export { default as PlAgDataTableV2 } from "./components/PlAgDataTable/PlAgDataTableV2.vue";
-                                             ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/lib.ts:5:47 - error TS2307: Cannot find module './components/PlAgDataTable/PlAgOverlayLoading.vue' or its corresponding type declarations.
-
-5 export { default as PlAgOverlayLoading } from "./components/PlAgDataTable/PlAgOverlayLoading.vue";
-                                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/lib.ts:6:46 - error TS2307: Cannot find module './components/PlAgDataTable/PlAgOverlayNoRows.vue' or its corresponding type declarations.
-
-6 export { default as PlAgOverlayNoRows } from "./components/PlAgDataTable/PlAgOverlayNoRows.vue";
-                                               ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-src/plugins/Monetization/index.ts:1:33 - error TS2307: Cannot find module './MonetizationSidebar.vue' or its corresponding type declarations.
-
-1 import MonetizationSidebar from "./MonetizationSidebar.vue";
-                                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
 src/components/PlAgGridColumnManager/useGridColumns.ts:4:17 - error TS2883: The inferred type of 'useGridColumns' cannot be named without a reference to 'ColumnEventName' from '../../../../../node_modules/.pnpm/ag-grid-community@34.1.2/node_modules/ag-grid-community/dist/types/src/interfaces/iColumn'. This is likely not portable. A type annotation is necessary.
 
@@ -165,7 +37,7 @@ Building browser-lib project...
 rendering chunks...
 
 [unplugin:dts] Start generate declaration files...
-[unplugin:dts] Declaration files built in 2954ms.
+[unplugin:dts] Declaration files built in 4299ms.
 
 computing gzip size...
 dist/components/PlAnnotations/components/PlAnnotations.vue?vue&type=style&index=0&lang.css                       0.04 kB │ gzip:  0.06 kB
@@ -272,7 +144,7 @@ dist/components/PlAnnotations/components/FilterSidebar.js
 dist/components/PlAnnotations/components/PlAnnotations.js                                                        0.35 kB │ gzip:  0.24 kB │ map:  3.11 kB
 dist/components/PlAgDataTable/PlAgDataTableV2.js                                                                 0.35 kB │ gzip:  0.25 kB │ map: 24.08 kB
 dist/plugins/Monetization/UserCabinetCard.js                                                                     0.35 kB │ gzip:  0.24 kB │ map:  3.00 kB
-dist/components/PlAdvancedFilter/PlAdvancedFilter.js                                                             0.36 kB │ gzip:  0.24 kB │ map: 13.46 kB
+dist/components/PlAdvancedFilter/PlAdvancedFilter.js                                                             0.36 kB │ gzip:  0.24 kB │ map: 13.43 kB
 dist/components/PlAgDataTable/PlAgOverlayNoRows.js                                                               0.36 kB │ gzip:  0.21 kB │ map:  0.74 kB
 dist/components/PlTableFilters/PlTableFiltersV2.js                                                               0.36 kB │ gzip:  0.25 kB │ map:  6.86 kB
 dist/components/PlAgCellStatusTag/PlAgCellStatusTag.js                                                           0.36 kB │ gzip:  0.20 kB │ map:  0.74 kB
@@ -368,17 +240,17 @@ dist/components/PlBtnExportArchive/PlBtnExportArchive.vue_vue_type_script_setup_
 dist/components/PlAgDataTable/sources/table-state-v2.js                                                          5.67 kB │ gzip:  1.82 kB │ map: 19.65 kB
 dist/internal/createAppV3.js                                                                                     6.19 kB │ gzip:  2.33 kB │ map: 21.40 kB
 dist/components/PlAgDataTable/sources/table-source-v2.js                                                         7.59 kB │ gzip:  2.88 kB │ map: 27.20 kB
-dist/components/PlAdvancedFilter/PlAdvancedFilter.vue_vue_type_script_setup_true_lang.js                         8.57 kB │ gzip:  2.60 kB │ map: 18.58 kB
+dist/components/PlAdvancedFilter/PlAdvancedFilter.vue_vue_type_script_setup_true_lang.js                         8.57 kB │ gzip:  2.60 kB │ map: 18.55 kB
 dist/components/PlAdvancedFilter/FilterEditor.vue_vue_type_script_setup_true_lang.js                            10.58 kB │ gzip:  3.14 kB │ map: 24.73 kB
 dist/components/PlAgDataTable/PlAgDataTableV2.vue_vue_type_script_setup_true_lang.js                            12.79 kB │ gzip:  4.02 kB │ map: 32.00 kB
 
 [PLUGIN_TIMINGS] Warning: Your build spent significant time in plugins. Here is a breakdown:
-  - sourcemaps (41%)
-  - unplugin-dts (15%)
-  - vite:css-post (13%)
-  - vite:vue (10%)
-  - vite:css (6%)
+  - sourcemaps (28%)
+  - unplugin-dts (27%)
+  - vite:vue (14%)
+  - vite:css (9%)
+  - vite:css-post (8%)
 See https://rolldown.rs/options/checks#plugintimings for more details.
 
-✓ built in 3.83s
+✓ built in 5.09s
 Build completed successfully

package/.turbo/turbo-formatter$colon$check.log

@@ -1,6 +1,6 @@
  WARN  Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
 
-> @platforma-sdk/ui-vue@1.83.1 formatter:check /home/runner/_work/platforma/platforma/sdk/ui-vue
+> @platforma-sdk/ui-vue@1.83.9 formatter:check /home/runner/_work/platforma/platforma/sdk/ui-vue
 > ts-builder formatter --check
 
 Checking formatting...
@@ -8,5 +8,5 @@ Checking formatting...
 Checking formatting...
 
 All matched files use the correct format.
-Finished in 1463ms on 129 files using 16 threads.
+Finished in 3012ms on 129 files using 16 threads.
 Format check completed successfully

package/.turbo/turbo-linter$colon$check.log

@@ -1,10 +1,10 @@
  WARN  Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
 
-> @platforma-sdk/ui-vue@1.83.1 linter:check /home/runner/_work/platforma/platforma/sdk/ui-vue
+> @platforma-sdk/ui-vue@1.83.9 linter:check /home/runner/_work/platforma/platforma/sdk/ui-vue
 > ts-builder linter --check
 
 Linting project...
 ↳ oxlint --config /home/runner/_work/platforma/platforma/sdk/ui-vue/.oxlintrc.json --deny-warnings
 Found 0 warnings and 0 errors.
-Finished in 33ms on 112 files with 108 rules using 16 threads.
+Finished in 30ms on 112 files with 108 rules using 16 threads.
 Linting completed successfully

package/.turbo/turbo-types$colon$check.log

@@ -1,6 +1,6 @@
  WARN  Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
 
-> @platforma-sdk/ui-vue@1.83.1 types:check /home/runner/_work/platforma/platforma/sdk/ui-vue
+> @platforma-sdk/ui-vue@1.83.9 types:check /home/runner/_work/platforma/platforma/sdk/ui-vue
 > ts-builder type-check --target browser-lib
 
 ↳ vue-tsc-ts6.cjs --noEmit --project ./tsconfig.json --customConditions default

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @platforma-sdk/ui-vue
 
+## 1.83.9
+
+### Patch Changes
+
+- Updated dependencies [1b1c13c]
+  - @platforma-sdk/model@1.83.9
+  - @milaboratories/uikit@2.15.28
+
+## 1.83.3
+
+### Patch Changes
+
+- ddf58fa: Restore emission of `*.vue.d.ts` declarations in browser-lib builds.
+
+  vite-plugin-dts 5 auto-detects whether to run its Vue program processor, but its detector only scans two directory levels below the package root. Our SFCs live deeper (`src/components/**`), so it fell back to the plain TypeScript processor and silently emitted no `*.vue.d.ts` — while `dist/lib.d.ts` still re-exported those `.vue` specifiers, breaking any consumer that resolves them (e.g. block model facade builds). ts-builder now picks the processor itself.
+
+- Updated dependencies [ddf58fa]
+  - @milaboratories/uikit@2.15.27
+  - @milaboratories/columns-collection-driver@0.2.4
+  - @milaboratories/pl-model-common@1.48.0
+  - @milaboratories/pf-spec-driver@1.5.1
+  - @platforma-sdk/model@1.83.0
+
 ## 1.83.1
 
 ### Patch Changes

package/dist/components/BlockLayout.vue.d.ts

@@ -0,0 +1,4 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=BlockLayout.vue.d.ts.map

package/dist/components/BlockLayout.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockLayout.vue.d.ts","sourceRoot":"","sources":["../../src/components/BlockLayout.vue"],"names":[],"mappings":"AAiEA,OAAO,sBAAsB,CAAC;AA2I9B,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/BlockLoader.vue.d.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    value: boolean | number | undefined;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=BlockLoader.vue.d.ts.map

package/dist/components/BlockLoader.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockLoader.vue.d.ts","sourceRoot":"","sources":["../../src/components/BlockLoader.vue"],"names":[],"mappings":"AAqCA,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CACrC,CAAC;AAsDF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/LoaderPage.vue.d.ts

@@ -0,0 +1,4 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=LoaderPage.vue.d.ts.map

package/dist/components/LoaderPage.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoaderPage.vue.d.ts","sourceRoot":"","sources":["../../src/components/LoaderPage.vue"],"names":[],"mappings":"AAkCA,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/NotFound.vue.d.ts

@@ -0,0 +1,4 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=NotFound.vue.d.ts.map

package/dist/components/NotFound.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotFound.vue.d.ts","sourceRoot":"","sources":["../../src/components/NotFound.vue"],"names":[],"mappings":"AAgFA,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/PlAdvancedFilter/FilterEditor.vue.d.ts

@@ -0,0 +1,24 @@
+import { ListOptionBase } from '@platforma-sdk/model';
+import { SUPPORTED_FILTER_TYPES } from './constants';
+import { EditableFilter, Operand, PlAdvancedFilterColumnId, SourceOptionInfo } from './types';
+type __VLS_Props = {
+    filter: EditableFilter;
+    isLast: boolean;
+    operand: Operand;
+    enableDnd: boolean;
+    columnOptions: SourceOptionInfo[];
+    supportedFilters: typeof SUPPORTED_FILTER_TYPES;
+    getSuggestOptions: (params: {
+        columnId: PlAdvancedFilterColumnId;
+        axisIdx?: number;
+        searchType: "value" | "label";
+        searchStr: string;
+    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;
+    onDelete: (columnId: PlAdvancedFilterColumnId) => void;
+    onUpdateFilter: (filter: EditableFilter) => void;
+    onChangeOperand: (op: Operand) => void;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=FilterEditor.vue.d.ts.map

package/dist/components/PlAdvancedFilter/FilterEditor.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterEditor.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAdvancedFilter/FilterEditor.vue"],"names":[],"mappings":"AA+jBA,OAAO,EAKL,KAAK,cAAc,EACpB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAG1D,OAAO,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAUnG,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,gBAAgB,EAAE,CAAC;IAClC,gBAAgB,EAAE,OAAO,sBAAsB,CAAC;IAChD,iBAAiB,EAAE,CAAC,MAAM,EAAE;QAC1B,QAAQ,EAAE,wBAAwB,CAAC;QACnC,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,OAAO,GAAG,OAAO,CAAC;QAC9B,SAAS,EAAE,MAAM,CAAC;KACnB,KAAK,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;IACrF,QAAQ,EAAE,CAAC,QAAQ,EAAE,wBAAwB,KAAK,IAAI,CAAC;IACvD,cAAc,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IACjD,eAAe,EAAE,CAAC,EAAE,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,CAAC;AAmxBF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/PlAdvancedFilter/OperandButton.vue.d.ts

@@ -0,0 +1,10 @@
+import { Operand } from './types';
+type __VLS_Props = {
+    active: Operand;
+    disabled: boolean;
+    onSelect: (op: Operand) => void;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=OperandButton.vue.d.ts.map

package/dist/components/PlAdvancedFilter/OperandButton.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperandButton.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAdvancedFilter/OperandButton.vue"],"names":[],"mappings":"AAwDA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAEvC,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,EAAE,EAAE,OAAO,KAAK,IAAI,CAAC;CACjC,CAAC;AAoDF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAdvancedFilter.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends RootFilter\">\nimport { PlBtnSecondary, PlCheckbox, PlElementList } from \"@milaboratories/uikit\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { produce } from \"immer\";\nimport { computed } from \"vue\";\nimport FilterEditor from \"./FilterEditor.vue\";\nimport OperandButton from \"./OperandButton.vue\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS, SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport type {\n  CommonFilter,\n  EditableFilter,\n  NodeFilter,\n  Operand,\n  PlAdvancedFilterColumnId,\n  RootFilter,\n  SourceOptionInfo,\n} from \"./types\";\nimport { createNewGroup, getNewId, isValidColumnId } from \"./utils\";\n\nconst props = withDefaults(\n  defineProps<{\n    filters: T;\n    onUpdateFilters: (filters: T) => void;\n    /** List of ids of sources (columns, axes) that can be selected in filters */\n    options: SourceOptionInfo[];\n    /** List of supported filter types */\n    supportedFilters?: typeof SUPPORTED_FILTER_TYPES;\n    /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */\n    enableDnd?: boolean;\n    /** If true - \"Add group\" button is shown below the filter groups */\n    enableAddGroupButton?: boolean;\n    /** If true - eye icon is shown per group to toggle suppression */\n    enableToggling?: boolean;\n    /** Function to determine if a filter is pinned */\n    isPinned?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is removable */\n    isRemovable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is draggable */\n    isDraggable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a group is complete */\n    isCompletedGroup?: (group: NodeFilter, index: number) => boolean;\n    /** Loading function for unique values for Equal/InSet filters and fixed axes options. */\n    getSuggestOptions: (params: {\n      columnId: PlAdvancedFilterColumnId;\n      axisIdx?: number;\n      searchStr: string;\n      searchType: \"value\" | \"label\";\n    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  }>(),\n  {\n    supportedFilters: () => SUPPORTED_FILTER_TYPES,\n    isCompletedGroup: () => false,\n    isPinned: () => false,\n    isRemovable: () => true,\n    isDraggable: () => true,\n\n    getSuggestModel: undefined,\n\n    enableDnd: false,\n    enableAddGroupButton: false,\n    enableToggling: false,\n  },\n);\nconst produceFiltersUpdate = (updater: (draft: T) => void) => {\n  props.onUpdateFilters(produce(props.filters, updater));\n};\n\nconst firstColumnId = computed(() => props.options[0]?.id);\nconst emptyGroup: NodeFilter[] = [\n  {\n    id: -1,\n    type: \"and\",\n    filters: [],\n    isExpanded: true,\n  },\n];\n\nconst rootFilters = computed({\n  get: () => props.filters.filters,\n  set: (filters) => props.onUpdateFilters({ ...props.filters, filters: filters }),\n});\n\nfunction getRootGroups() {\n  if (props.filters.type !== \"or\" && props.filters.type !== \"and\") {\n    throw new Error('Invalid model structure, expected root to be \"or\" or \"and\" group');\n  }\n  return props.filters.filters;\n}\n\nfunction getDraftGroupContent(\n  draft: RootFilter,\n  idx: number,\n): Exclude<NodeFilter, { type: \"not\" }> {\n  const group = draft.filters[idx];\n  if (group.type === \"not\") {\n    if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n      throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n    }\n    return group.filter;\n  }\n  if (group.type !== \"and\" && group.type !== \"or\") {\n    throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n  }\n  return group;\n}\n\nfunction getNotContent<T extends CommonFilter>(item: T): Exclude<T, { type: \"not\" }> {\n  return item.type === \"not\"\n    ? (item.filter as Exclude<T, { type: \"not\" }>)\n    : (item as Exclude<T, { type: \"not\" }>);\n}\n\nfunction addColumnToGroup(groupIdx: number, selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    group.filters.push({\n      ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n      column: selectedSourceId,\n      id: getNewId(),\n      isExpanded: true,\n    } as CommonFilter);\n  });\n}\n\nfunction removeFilterFromGroup(groupIdx: number, filterIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    const removingLastLeaf = group.filters.length === 1 && filterIdx === 0;\n\n    if (removingLastLeaf && props.isRemovable(draft.filters[groupIdx], groupIdx)) {\n      draft.filters.splice(groupIdx, 1);\n    } else {\n      group.filters.splice(filterIdx, 1);\n    }\n  });\n}\n\nfunction inverseRootNode(groupIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = draft.filters[groupIdx];\n    if (group.type === \"not\") {\n      if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n        throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        ...group.filter,\n      };\n    } else {\n      const type = draft.filters[groupIdx].type;\n      if (type !== \"and\" && type !== \"or\" && type !== \"not\") {\n        throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        id: getNewId(),\n        type: \"not\",\n        filter: draft.filters[groupIdx],\n      };\n    }\n  });\n}\n\nfunction addGroup(selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters.push(createNewGroup(selectedSourceId));\n  });\n}\n\nfunction updateFilter(groupIdx: number, filterIdx: number, updatedFilter: EditableFilter) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, groupIdx).filters[filterIdx] = updatedFilter as CommonFilter;\n  });\n}\n\nfunction handleDropToExistingGroup(groupIdx: number, event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addColumnToGroup(groupIdx, draggedId);\n    }\n  }\n}\n\nfunction handleDropToNewGroup(event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addGroup(draggedId);\n    }\n  }\n}\n\nfunction dragOver(event: DragEvent) {\n  event.preventDefault();\n}\n\nfunction toggleExpand(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isExpanded = !draft.filters[index].isExpanded;\n  });\n}\n\nfunction toggleSuppress(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isSuppressed = !draft.filters[index].isSuppressed;\n  });\n}\n\nfunction changeGroupOperand(index: number, v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, index).type = v;\n  });\n}\n\nfunction changeRootOperand(v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.type = v;\n  });\n}\n\nfunction validateFilter<T extends CommonFilter>(item: T): EditableFilter {\n  if (item.type === \"and\" || item.type === \"or\" || item.type === \"not\") {\n    throw new Error(\"Invalid filter structure, expected leaf filter\");\n  }\n\n  return item as EditableFilter;\n}\n</script>\n<template>\n  <div>\n    <PlElementList\n      v-model:items=\"rootFilters\"\n      :get-item-key=\"(filter) => filter.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"(filter) => filter.isExpanded === true\"\n      :on-expand=\"toggleExpand\"\n      :is-toggled=\"(item) => item.isSuppressed === true\"\n      :on-toggle=\"toggleSuppress\"\n      :is-pinned=\"(item, index) => props.isPinned?.(item, index) === true\"\n      :is-pinnable=\"() => false\"\n      :is-removable=\"(item, index) => props.isRemovable?.(item, index) === true\"\n      :is-draggable=\"(item, index) => props.isDraggable?.(item, index) === true\"\n      :disable-toggling=\"props.enableToggling !== true\"\n      :disable-dragging=\"false\"\n      :disable-removing=\"false\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index\">Filter group</slot>\n      </template>\n      <template #item-content=\"{ item, index }\">\n        <div\n          :class=\"[$style.groupContent, { [$style.suppressedLabel]: item.isSuppressed }]\"\n          dropzone=\"true\"\n          @drop=\"(event) => handleDropToExistingGroup(index, event)\"\n          @dragover=\"dragOver\"\n        >\n          <PlCheckbox\n            :model-value=\"item.type === 'not'\"\n            :class=\"$style.notCheckbox\"\n            @update:model-value=\"inverseRootNode(index)\"\n          >\n            Filter Out\n          </PlCheckbox>\n          <template v-for=\"(_, filterIdx) in getNotContent(item).filters\" :key=\"filterIdx\">\n            <FilterEditor\n              :filter=\"validateFilter(getNotContent(item).filters[filterIdx])\"\n              :operand=\"getNotContent(item).type\"\n              :column-options=\"options\"\n              :supported-filters=\"props.supportedFilters\"\n              :get-suggest-options=\"props.getSuggestOptions\"\n              :enable-dnd=\"Boolean(props.enableDnd)\"\n              :is-last=\"filterIdx === getNotContent(item).filters.length - 1\"\n              @delete=\"() => removeFilterFromGroup(index, filterIdx)\"\n              @update-filter=\"(value) => updateFilter(index, filterIdx, value)\"\n              @change-operand=\"(v) => changeGroupOperand(index, v)\"\n            />\n          </template>\n          <div v-if=\"props.enableDnd\" :class=\"$style.dropzone\">\n            <div>Drop dimensions here</div>\n          </div>\n          <PlBtnSecondary\n            v-else-if=\"!props.isCompletedGroup(item, index)\"\n            icon=\"add\"\n            @click=\"addColumnToGroup(index, firstColumnId)\"\n          >\n            Add filter\n          </PlBtnSecondary>\n        </div>\n      </template>\n      <template #item-after=\"{ index }\">\n        <OperandButton\n          v-if=\"props.enableAddGroupButton || index < getRootGroups().length - 1\"\n          :class=\"$style.buttonWrapper\"\n          :active=\"props.filters.type\"\n          :disabled=\"index === getRootGroups().length - 1\"\n          :on-select=\"changeRootOperand\"\n        />\n      </template>\n    </PlElementList>\n\n    <!-- Last group - always empty, just for adding new groups -->\n    <PlElementList\n      v-if=\"props.enableAddGroupButton\"\n      :items=\"emptyGroup\"\n      :get-item-key=\"(group) => group.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"() => true\"\n      :disableDragging=\"true\"\n      :disableRemoving=\"true\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n      dropzone=\"true\"\n      @drop=\"handleDropToNewGroup\"\n      @dragover=\"dragOver\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index + getRootGroups().length\"\n          >Filter group</slot\n        >\n      </template>\n      <template #item-content>\n        <div v-if=\"enableDnd\" :class=\"$style.dropzone\">\n          <div>Drop dimensions here</div>\n        </div>\n        <slot v-else name=\"add-group-buttons\">\n          <PlBtnSecondary icon=\"add\" @click=\"addGroup(firstColumnId)\"> Add filter </PlBtnSecondary>\n        </slot>\n      </template>\n    </PlElementList>\n  </div>\n</template>\n<style module>\n.filterGroup {\n  background: var(--bg-base-light);\n}\n.filterGroup:hover {\n  background: rgba(99, 224, 36, 0.12);\n}\n.filterGroupTitle {\n  background: none;\n}\n.filterGroupContent {\n  padding: 4px 24px 24px 24px;\n}\n.groupContent {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.notCheckbox {\n  margin: 4px 0;\n}\n.suppressedLabel {\n  filter: grayscale(100%);\n  pointer-events: none;\n}\n.dropzone {\n  border-radius: 6px;\n  border: 1.5px dashed var(--color-div-grey);\n  color: var(--txt-03);\n  font-family: Manrope;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  height: 40px;\n  cursor: default;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.buttonWrapper {\n  margin-top: 8px;\n  height: 56px;\n  display: flex;\n  align-items: center;\n}\n:global(.sortable-chosen) .buttonWrapper {\n  visibility: hidden;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"PlAdvancedFilter.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends RootFilter\">\nimport { PlBtnSecondary, PlCheckbox, PlElementList } from \"@milaboratories/uikit\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { produce } from \"immer\";\nimport { computed } from \"vue\";\nimport FilterEditor from \"./FilterEditor.vue\";\nimport OperandButton from \"./OperandButton.vue\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS, SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport type {\n  CommonFilter,\n  EditableFilter,\n  NodeFilter,\n  Operand,\n  PlAdvancedFilterColumnId,\n  RootFilter,\n  SourceOptionInfo,\n} from \"./types\";\nimport { createNewGroup, getNewId, isValidColumnId } from \"./utils\";\n\nconst props = withDefaults(\n  defineProps<{\n    filters: T;\n    onUpdateFilters: (filters: T) => void;\n    /** List of ids of sources (columns, axes) that can be selected in filters */\n    options: SourceOptionInfo[];\n    /** List of supported filter types */\n    supportedFilters?: typeof SUPPORTED_FILTER_TYPES;\n    /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */\n    enableDnd?: boolean;\n    /** If true - \"Add group\" button is shown below the filter groups */\n    enableAddGroupButton?: boolean;\n    /** If true - eye icon is shown per group to toggle suppression */\n    enableToggling?: boolean;\n    /** Function to determine if a filter is pinned */\n    isPinned?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is removable */\n    isRemovable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is draggable */\n    isDraggable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a group is complete */\n    isCompletedGroup?: (group: NodeFilter, index: number) => boolean;\n    /** Loading function for unique values for Equal/InSet filters and fixed axes options. */\n    getSuggestOptions: (params: {\n      columnId: PlAdvancedFilterColumnId;\n      axisIdx?: number;\n      searchStr: string;\n      searchType: \"value\" | \"label\";\n    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  }>(),\n  {\n    supportedFilters: () => SUPPORTED_FILTER_TYPES,\n    isCompletedGroup: () => false,\n    isPinned: () => false,\n    isRemovable: () => true,\n    isDraggable: () => true,\n\n    enableDnd: false,\n    enableAddGroupButton: false,\n    enableToggling: false,\n  },\n);\nconst produceFiltersUpdate = (updater: (draft: T) => void) => {\n  props.onUpdateFilters(produce(props.filters, updater));\n};\n\nconst firstColumnId = computed(() => props.options[0]?.id);\nconst emptyGroup: NodeFilter[] = [\n  {\n    id: -1,\n    type: \"and\",\n    filters: [],\n    isExpanded: true,\n  },\n];\n\nconst rootFilters = computed({\n  get: () => props.filters.filters,\n  set: (filters) => props.onUpdateFilters({ ...props.filters, filters: filters }),\n});\n\nfunction getRootGroups() {\n  if (props.filters.type !== \"or\" && props.filters.type !== \"and\") {\n    throw new Error('Invalid model structure, expected root to be \"or\" or \"and\" group');\n  }\n  return props.filters.filters;\n}\n\nfunction getDraftGroupContent(\n  draft: RootFilter,\n  idx: number,\n): Exclude<NodeFilter, { type: \"not\" }> {\n  const group = draft.filters[idx];\n  if (group.type === \"not\") {\n    if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n      throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n    }\n    return group.filter;\n  }\n  if (group.type !== \"and\" && group.type !== \"or\") {\n    throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n  }\n  return group;\n}\n\nfunction getNotContent<T extends CommonFilter>(item: T): Exclude<T, { type: \"not\" }> {\n  return item.type === \"not\"\n    ? (item.filter as Exclude<T, { type: \"not\" }>)\n    : (item as Exclude<T, { type: \"not\" }>);\n}\n\nfunction addColumnToGroup(groupIdx: number, selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    group.filters.push({\n      ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n      column: selectedSourceId,\n      id: getNewId(),\n      isExpanded: true,\n    } as CommonFilter);\n  });\n}\n\nfunction removeFilterFromGroup(groupIdx: number, filterIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    const removingLastLeaf = group.filters.length === 1 && filterIdx === 0;\n\n    if (removingLastLeaf && props.isRemovable(draft.filters[groupIdx], groupIdx)) {\n      draft.filters.splice(groupIdx, 1);\n    } else {\n      group.filters.splice(filterIdx, 1);\n    }\n  });\n}\n\nfunction inverseRootNode(groupIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = draft.filters[groupIdx];\n    if (group.type === \"not\") {\n      if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n        throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        ...group.filter,\n      };\n    } else {\n      const type = draft.filters[groupIdx].type;\n      if (type !== \"and\" && type !== \"or\" && type !== \"not\") {\n        throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        id: getNewId(),\n        type: \"not\",\n        filter: draft.filters[groupIdx],\n      };\n    }\n  });\n}\n\nfunction addGroup(selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters.push(createNewGroup(selectedSourceId));\n  });\n}\n\nfunction updateFilter(groupIdx: number, filterIdx: number, updatedFilter: EditableFilter) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, groupIdx).filters[filterIdx] = updatedFilter as CommonFilter;\n  });\n}\n\nfunction handleDropToExistingGroup(groupIdx: number, event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addColumnToGroup(groupIdx, draggedId);\n    }\n  }\n}\n\nfunction handleDropToNewGroup(event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addGroup(draggedId);\n    }\n  }\n}\n\nfunction dragOver(event: DragEvent) {\n  event.preventDefault();\n}\n\nfunction toggleExpand(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isExpanded = !draft.filters[index].isExpanded;\n  });\n}\n\nfunction toggleSuppress(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isSuppressed = !draft.filters[index].isSuppressed;\n  });\n}\n\nfunction changeGroupOperand(index: number, v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, index).type = v;\n  });\n}\n\nfunction changeRootOperand(v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.type = v;\n  });\n}\n\nfunction validateFilter<T extends CommonFilter>(item: T): EditableFilter {\n  if (item.type === \"and\" || item.type === \"or\" || item.type === \"not\") {\n    throw new Error(\"Invalid filter structure, expected leaf filter\");\n  }\n\n  return item as EditableFilter;\n}\n</script>\n<template>\n  <div>\n    <PlElementList\n      v-model:items=\"rootFilters\"\n      :get-item-key=\"(filter) => filter.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"(filter) => filter.isExpanded === true\"\n      :on-expand=\"toggleExpand\"\n      :is-toggled=\"(item) => item.isSuppressed === true\"\n      :on-toggle=\"toggleSuppress\"\n      :is-pinned=\"(item, index) => props.isPinned?.(item, index) === true\"\n      :is-pinnable=\"() => false\"\n      :is-removable=\"(item, index) => props.isRemovable?.(item, index) === true\"\n      :is-draggable=\"(item, index) => props.isDraggable?.(item, index) === true\"\n      :disable-toggling=\"props.enableToggling !== true\"\n      :disable-dragging=\"false\"\n      :disable-removing=\"false\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index\">Filter group</slot>\n      </template>\n      <template #item-content=\"{ item, index }\">\n        <div\n          :class=\"[$style.groupContent, { [$style.suppressedLabel]: item.isSuppressed }]\"\n          dropzone=\"true\"\n          @drop=\"(event) => handleDropToExistingGroup(index, event)\"\n          @dragover=\"dragOver\"\n        >\n          <PlCheckbox\n            :model-value=\"item.type === 'not'\"\n            :class=\"$style.notCheckbox\"\n            @update:model-value=\"inverseRootNode(index)\"\n          >\n            Filter Out\n          </PlCheckbox>\n          <template v-for=\"(_, filterIdx) in getNotContent(item).filters\" :key=\"filterIdx\">\n            <FilterEditor\n              :filter=\"validateFilter(getNotContent(item).filters[filterIdx])\"\n              :operand=\"getNotContent(item).type\"\n              :column-options=\"options\"\n              :supported-filters=\"props.supportedFilters\"\n              :get-suggest-options=\"props.getSuggestOptions\"\n              :enable-dnd=\"Boolean(props.enableDnd)\"\n              :is-last=\"filterIdx === getNotContent(item).filters.length - 1\"\n              @delete=\"() => removeFilterFromGroup(index, filterIdx)\"\n              @update-filter=\"(value) => updateFilter(index, filterIdx, value)\"\n              @change-operand=\"(v) => changeGroupOperand(index, v)\"\n            />\n          </template>\n          <div v-if=\"props.enableDnd\" :class=\"$style.dropzone\">\n            <div>Drop dimensions here</div>\n          </div>\n          <PlBtnSecondary\n            v-else-if=\"!props.isCompletedGroup(item, index)\"\n            icon=\"add\"\n            @click=\"addColumnToGroup(index, firstColumnId)\"\n          >\n            Add filter\n          </PlBtnSecondary>\n        </div>\n      </template>\n      <template #item-after=\"{ index }\">\n        <OperandButton\n          v-if=\"props.enableAddGroupButton || index < getRootGroups().length - 1\"\n          :class=\"$style.buttonWrapper\"\n          :active=\"props.filters.type\"\n          :disabled=\"index === getRootGroups().length - 1\"\n          :on-select=\"changeRootOperand\"\n        />\n      </template>\n    </PlElementList>\n\n    <!-- Last group - always empty, just for adding new groups -->\n    <PlElementList\n      v-if=\"props.enableAddGroupButton\"\n      :items=\"emptyGroup\"\n      :get-item-key=\"(group) => group.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"() => true\"\n      :disableDragging=\"true\"\n      :disableRemoving=\"true\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n      dropzone=\"true\"\n      @drop=\"handleDropToNewGroup\"\n      @dragover=\"dragOver\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index + getRootGroups().length\"\n          >Filter group</slot\n        >\n      </template>\n      <template #item-content>\n        <div v-if=\"enableDnd\" :class=\"$style.dropzone\">\n          <div>Drop dimensions here</div>\n        </div>\n        <slot v-else name=\"add-group-buttons\">\n          <PlBtnSecondary icon=\"add\" @click=\"addGroup(firstColumnId)\"> Add filter </PlBtnSecondary>\n        </slot>\n      </template>\n    </PlElementList>\n  </div>\n</template>\n<style module>\n.filterGroup {\n  background: var(--bg-base-light);\n}\n.filterGroup:hover {\n  background: rgba(99, 224, 36, 0.12);\n}\n.filterGroupTitle {\n  background: none;\n}\n.filterGroupContent {\n  padding: 4px 24px 24px 24px;\n}\n.groupContent {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.notCheckbox {\n  margin: 4px 0;\n}\n.suppressedLabel {\n  filter: grayscale(100%);\n  pointer-events: none;\n}\n.dropzone {\n  border-radius: 6px;\n  border: 1.5px dashed var(--color-div-grey);\n  color: var(--txt-03);\n  font-family: Manrope;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  height: 40px;\n  cursor: default;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.buttonWrapper {\n  margin-top: 8px;\n  height: 56px;\n  display: flex;\n  align-items: center;\n}\n:global(.sortable-chosen) .buttonWrapper {\n  visibility: hidden;\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAdvancedFilter.vue_vue_type_style_index_0_lang.module.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends RootFilter\">\nimport { PlBtnSecondary, PlCheckbox, PlElementList } from \"@milaboratories/uikit\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { produce } from \"immer\";\nimport { computed } from \"vue\";\nimport FilterEditor from \"./FilterEditor.vue\";\nimport OperandButton from \"./OperandButton.vue\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS, SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport type {\n  CommonFilter,\n  EditableFilter,\n  NodeFilter,\n  Operand,\n  PlAdvancedFilterColumnId,\n  RootFilter,\n  SourceOptionInfo,\n} from \"./types\";\nimport { createNewGroup, getNewId, isValidColumnId } from \"./utils\";\n\nconst props = withDefaults(\n  defineProps<{\n    filters: T;\n    onUpdateFilters: (filters: T) => void;\n    /** List of ids of sources (columns, axes) that can be selected in filters */\n    options: SourceOptionInfo[];\n    /** List of supported filter types */\n    supportedFilters?: typeof SUPPORTED_FILTER_TYPES;\n    /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */\n    enableDnd?: boolean;\n    /** If true - \"Add group\" button is shown below the filter groups */\n    enableAddGroupButton?: boolean;\n    /** If true - eye icon is shown per group to toggle suppression */\n    enableToggling?: boolean;\n    /** Function to determine if a filter is pinned */\n    isPinned?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is removable */\n    isRemovable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is draggable */\n    isDraggable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a group is complete */\n    isCompletedGroup?: (group: NodeFilter, index: number) => boolean;\n    /** Loading function for unique values for Equal/InSet filters and fixed axes options. */\n    getSuggestOptions: (params: {\n      columnId: PlAdvancedFilterColumnId;\n      axisIdx?: number;\n      searchStr: string;\n      searchType: \"value\" | \"label\";\n    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  }>(),\n  {\n    supportedFilters: () => SUPPORTED_FILTER_TYPES,\n    isCompletedGroup: () => false,\n    isPinned: () => false,\n    isRemovable: () => true,\n    isDraggable: () => true,\n\n    getSuggestModel: undefined,\n\n    enableDnd: false,\n    enableAddGroupButton: false,\n    enableToggling: false,\n  },\n);\nconst produceFiltersUpdate = (updater: (draft: T) => void) => {\n  props.onUpdateFilters(produce(props.filters, updater));\n};\n\nconst firstColumnId = computed(() => props.options[0]?.id);\nconst emptyGroup: NodeFilter[] = [\n  {\n    id: -1,\n    type: \"and\",\n    filters: [],\n    isExpanded: true,\n  },\n];\n\nconst rootFilters = computed({\n  get: () => props.filters.filters,\n  set: (filters) => props.onUpdateFilters({ ...props.filters, filters: filters }),\n});\n\nfunction getRootGroups() {\n  if (props.filters.type !== \"or\" && props.filters.type !== \"and\") {\n    throw new Error('Invalid model structure, expected root to be \"or\" or \"and\" group');\n  }\n  return props.filters.filters;\n}\n\nfunction getDraftGroupContent(\n  draft: RootFilter,\n  idx: number,\n): Exclude<NodeFilter, { type: \"not\" }> {\n  const group = draft.filters[idx];\n  if (group.type === \"not\") {\n    if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n      throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n    }\n    return group.filter;\n  }\n  if (group.type !== \"and\" && group.type !== \"or\") {\n    throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n  }\n  return group;\n}\n\nfunction getNotContent<T extends CommonFilter>(item: T): Exclude<T, { type: \"not\" }> {\n  return item.type === \"not\"\n    ? (item.filter as Exclude<T, { type: \"not\" }>)\n    : (item as Exclude<T, { type: \"not\" }>);\n}\n\nfunction addColumnToGroup(groupIdx: number, selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    group.filters.push({\n      ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n      column: selectedSourceId,\n      id: getNewId(),\n      isExpanded: true,\n    } as CommonFilter);\n  });\n}\n\nfunction removeFilterFromGroup(groupIdx: number, filterIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    const removingLastLeaf = group.filters.length === 1 && filterIdx === 0;\n\n    if (removingLastLeaf && props.isRemovable(draft.filters[groupIdx], groupIdx)) {\n      draft.filters.splice(groupIdx, 1);\n    } else {\n      group.filters.splice(filterIdx, 1);\n    }\n  });\n}\n\nfunction inverseRootNode(groupIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = draft.filters[groupIdx];\n    if (group.type === \"not\") {\n      if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n        throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        ...group.filter,\n      };\n    } else {\n      const type = draft.filters[groupIdx].type;\n      if (type !== \"and\" && type !== \"or\" && type !== \"not\") {\n        throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        id: getNewId(),\n        type: \"not\",\n        filter: draft.filters[groupIdx],\n      };\n    }\n  });\n}\n\nfunction addGroup(selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters.push(createNewGroup(selectedSourceId));\n  });\n}\n\nfunction updateFilter(groupIdx: number, filterIdx: number, updatedFilter: EditableFilter) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, groupIdx).filters[filterIdx] = updatedFilter as CommonFilter;\n  });\n}\n\nfunction handleDropToExistingGroup(groupIdx: number, event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addColumnToGroup(groupIdx, draggedId);\n    }\n  }\n}\n\nfunction handleDropToNewGroup(event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addGroup(draggedId);\n    }\n  }\n}\n\nfunction dragOver(event: DragEvent) {\n  event.preventDefault();\n}\n\nfunction toggleExpand(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isExpanded = !draft.filters[index].isExpanded;\n  });\n}\n\nfunction toggleSuppress(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isSuppressed = !draft.filters[index].isSuppressed;\n  });\n}\n\nfunction changeGroupOperand(index: number, v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, index).type = v;\n  });\n}\n\nfunction changeRootOperand(v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.type = v;\n  });\n}\n\nfunction validateFilter<T extends CommonFilter>(item: T): EditableFilter {\n  if (item.type === \"and\" || item.type === \"or\" || item.type === \"not\") {\n    throw new Error(\"Invalid filter structure, expected leaf filter\");\n  }\n\n  return item as EditableFilter;\n}\n</script>\n<template>\n  <div>\n    <PlElementList\n      v-model:items=\"rootFilters\"\n      :get-item-key=\"(filter) => filter.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"(filter) => filter.isExpanded === true\"\n      :on-expand=\"toggleExpand\"\n      :is-toggled=\"(item) => item.isSuppressed === true\"\n      :on-toggle=\"toggleSuppress\"\n      :is-pinned=\"(item, index) => props.isPinned?.(item, index) === true\"\n      :is-pinnable=\"() => false\"\n      :is-removable=\"(item, index) => props.isRemovable?.(item, index) === true\"\n      :is-draggable=\"(item, index) => props.isDraggable?.(item, index) === true\"\n      :disable-toggling=\"props.enableToggling !== true\"\n      :disable-dragging=\"false\"\n      :disable-removing=\"false\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index\">Filter group</slot>\n      </template>\n      <template #item-content=\"{ item, index }\">\n        <div\n          :class=\"[$style.groupContent, { [$style.suppressedLabel]: item.isSuppressed }]\"\n          dropzone=\"true\"\n          @drop=\"(event) => handleDropToExistingGroup(index, event)\"\n          @dragover=\"dragOver\"\n        >\n          <PlCheckbox\n            :model-value=\"item.type === 'not'\"\n            :class=\"$style.notCheckbox\"\n            @update:model-value=\"inverseRootNode(index)\"\n          >\n            Filter Out\n          </PlCheckbox>\n          <template v-for=\"(_, filterIdx) in getNotContent(item).filters\" :key=\"filterIdx\">\n            <FilterEditor\n              :filter=\"validateFilter(getNotContent(item).filters[filterIdx])\"\n              :operand=\"getNotContent(item).type\"\n              :column-options=\"options\"\n              :supported-filters=\"props.supportedFilters\"\n              :get-suggest-options=\"props.getSuggestOptions\"\n              :enable-dnd=\"Boolean(props.enableDnd)\"\n              :is-last=\"filterIdx === getNotContent(item).filters.length - 1\"\n              @delete=\"() => removeFilterFromGroup(index, filterIdx)\"\n              @update-filter=\"(value) => updateFilter(index, filterIdx, value)\"\n              @change-operand=\"(v) => changeGroupOperand(index, v)\"\n            />\n          </template>\n          <div v-if=\"props.enableDnd\" :class=\"$style.dropzone\">\n            <div>Drop dimensions here</div>\n          </div>\n          <PlBtnSecondary\n            v-else-if=\"!props.isCompletedGroup(item, index)\"\n            icon=\"add\"\n            @click=\"addColumnToGroup(index, firstColumnId)\"\n          >\n            Add filter\n          </PlBtnSecondary>\n        </div>\n      </template>\n      <template #item-after=\"{ index }\">\n        <OperandButton\n          v-if=\"props.enableAddGroupButton || index < getRootGroups().length - 1\"\n          :class=\"$style.buttonWrapper\"\n          :active=\"props.filters.type\"\n          :disabled=\"index === getRootGroups().length - 1\"\n          :on-select=\"changeRootOperand\"\n        />\n      </template>\n    </PlElementList>\n\n    <!-- Last group - always empty, just for adding new groups -->\n    <PlElementList\n      v-if=\"props.enableAddGroupButton\"\n      :items=\"emptyGroup\"\n      :get-item-key=\"(group) => group.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"() => true\"\n      :disableDragging=\"true\"\n      :disableRemoving=\"true\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n      dropzone=\"true\"\n      @drop=\"handleDropToNewGroup\"\n      @dragover=\"dragOver\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index + getRootGroups().length\"\n          >Filter group</slot\n        >\n      </template>\n      <template #item-content>\n        <div v-if=\"enableDnd\" :class=\"$style.dropzone\">\n          <div>Drop dimensions here</div>\n        </div>\n        <slot v-else name=\"add-group-buttons\">\n          <PlBtnSecondary icon=\"add\" @click=\"addGroup(firstColumnId)\"> Add filter </PlBtnSecondary>\n        </slot>\n      </template>\n    </PlElementList>\n  </div>\n</template>\n<style module>\n.filterGroup {\n  background: var(--bg-base-light);\n}\n.filterGroup:hover {\n  background: rgba(99, 224, 36, 0.12);\n}\n.filterGroupTitle {\n  background: none;\n}\n.filterGroupContent {\n  padding: 4px 24px 24px 24px;\n}\n.groupContent {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.notCheckbox {\n  margin: 4px 0;\n}\n.suppressedLabel {\n  filter: grayscale(100%);\n  pointer-events: none;\n}\n.dropzone {\n  border-radius: 6px;\n  border: 1.5px dashed var(--color-div-grey);\n  color: var(--txt-03);\n  font-family: Manrope;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  height: 40px;\n  cursor: default;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.buttonWrapper {\n  margin-top: 8px;\n  height: 56px;\n  display: flex;\n  align-items: center;\n}\n:global(.sortable-chosen) .buttonWrapper {\n  visibility: hidden;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"PlAdvancedFilter.vue_vue_type_style_index_0_lang.module.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends RootFilter\">\nimport { PlBtnSecondary, PlCheckbox, PlElementList } from \"@milaboratories/uikit\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { produce } from \"immer\";\nimport { computed } from \"vue\";\nimport FilterEditor from \"./FilterEditor.vue\";\nimport OperandButton from \"./OperandButton.vue\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS, SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport type {\n  CommonFilter,\n  EditableFilter,\n  NodeFilter,\n  Operand,\n  PlAdvancedFilterColumnId,\n  RootFilter,\n  SourceOptionInfo,\n} from \"./types\";\nimport { createNewGroup, getNewId, isValidColumnId } from \"./utils\";\n\nconst props = withDefaults(\n  defineProps<{\n    filters: T;\n    onUpdateFilters: (filters: T) => void;\n    /** List of ids of sources (columns, axes) that can be selected in filters */\n    options: SourceOptionInfo[];\n    /** List of supported filter types */\n    supportedFilters?: typeof SUPPORTED_FILTER_TYPES;\n    /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */\n    enableDnd?: boolean;\n    /** If true - \"Add group\" button is shown below the filter groups */\n    enableAddGroupButton?: boolean;\n    /** If true - eye icon is shown per group to toggle suppression */\n    enableToggling?: boolean;\n    /** Function to determine if a filter is pinned */\n    isPinned?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is removable */\n    isRemovable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a filter is draggable */\n    isDraggable?: (item: NodeFilter, index: number) => boolean;\n    /** Function to determine if a group is complete */\n    isCompletedGroup?: (group: NodeFilter, index: number) => boolean;\n    /** Loading function for unique values for Equal/InSet filters and fixed axes options. */\n    getSuggestOptions: (params: {\n      columnId: PlAdvancedFilterColumnId;\n      axisIdx?: number;\n      searchStr: string;\n      searchType: \"value\" | \"label\";\n    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  }>(),\n  {\n    supportedFilters: () => SUPPORTED_FILTER_TYPES,\n    isCompletedGroup: () => false,\n    isPinned: () => false,\n    isRemovable: () => true,\n    isDraggable: () => true,\n\n    enableDnd: false,\n    enableAddGroupButton: false,\n    enableToggling: false,\n  },\n);\nconst produceFiltersUpdate = (updater: (draft: T) => void) => {\n  props.onUpdateFilters(produce(props.filters, updater));\n};\n\nconst firstColumnId = computed(() => props.options[0]?.id);\nconst emptyGroup: NodeFilter[] = [\n  {\n    id: -1,\n    type: \"and\",\n    filters: [],\n    isExpanded: true,\n  },\n];\n\nconst rootFilters = computed({\n  get: () => props.filters.filters,\n  set: (filters) => props.onUpdateFilters({ ...props.filters, filters: filters }),\n});\n\nfunction getRootGroups() {\n  if (props.filters.type !== \"or\" && props.filters.type !== \"and\") {\n    throw new Error('Invalid model structure, expected root to be \"or\" or \"and\" group');\n  }\n  return props.filters.filters;\n}\n\nfunction getDraftGroupContent(\n  draft: RootFilter,\n  idx: number,\n): Exclude<NodeFilter, { type: \"not\" }> {\n  const group = draft.filters[idx];\n  if (group.type === \"not\") {\n    if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n      throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n    }\n    return group.filter;\n  }\n  if (group.type !== \"and\" && group.type !== \"or\") {\n    throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n  }\n  return group;\n}\n\nfunction getNotContent<T extends CommonFilter>(item: T): Exclude<T, { type: \"not\" }> {\n  return item.type === \"not\"\n    ? (item.filter as Exclude<T, { type: \"not\" }>)\n    : (item as Exclude<T, { type: \"not\" }>);\n}\n\nfunction addColumnToGroup(groupIdx: number, selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    group.filters.push({\n      ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n      column: selectedSourceId,\n      id: getNewId(),\n      isExpanded: true,\n    } as CommonFilter);\n  });\n}\n\nfunction removeFilterFromGroup(groupIdx: number, filterIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = getDraftGroupContent(draft, groupIdx);\n    const removingLastLeaf = group.filters.length === 1 && filterIdx === 0;\n\n    if (removingLastLeaf && props.isRemovable(draft.filters[groupIdx], groupIdx)) {\n      draft.filters.splice(groupIdx, 1);\n    } else {\n      group.filters.splice(filterIdx, 1);\n    }\n  });\n}\n\nfunction inverseRootNode(groupIdx: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    const group = draft.filters[groupIdx];\n    if (group.type === \"not\") {\n      if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n        throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        ...group.filter,\n      };\n    } else {\n      const type = draft.filters[groupIdx].type;\n      if (type !== \"and\" && type !== \"or\" && type !== \"not\") {\n        throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n      }\n      draft.filters[groupIdx] = {\n        ...draft.filters[groupIdx],\n        id: getNewId(),\n        type: \"not\",\n        filter: draft.filters[groupIdx],\n      };\n    }\n  });\n}\n\nfunction addGroup(selectedSourceId: PlAdvancedFilterColumnId) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters.push(createNewGroup(selectedSourceId));\n  });\n}\n\nfunction updateFilter(groupIdx: number, filterIdx: number, updatedFilter: EditableFilter) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, groupIdx).filters[filterIdx] = updatedFilter as CommonFilter;\n  });\n}\n\nfunction handleDropToExistingGroup(groupIdx: number, event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addColumnToGroup(groupIdx, draggedId);\n    }\n  }\n}\n\nfunction handleDropToNewGroup(event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addGroup(draggedId);\n    }\n  }\n}\n\nfunction dragOver(event: DragEvent) {\n  event.preventDefault();\n}\n\nfunction toggleExpand(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isExpanded = !draft.filters[index].isExpanded;\n  });\n}\n\nfunction toggleSuppress(_: NodeFilter, index: number) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.filters[index].isSuppressed = !draft.filters[index].isSuppressed;\n  });\n}\n\nfunction changeGroupOperand(index: number, v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    getDraftGroupContent(draft, index).type = v;\n  });\n}\n\nfunction changeRootOperand(v: Operand) {\n  produceFiltersUpdate((draft: RootFilter) => {\n    draft.type = v;\n  });\n}\n\nfunction validateFilter<T extends CommonFilter>(item: T): EditableFilter {\n  if (item.type === \"and\" || item.type === \"or\" || item.type === \"not\") {\n    throw new Error(\"Invalid filter structure, expected leaf filter\");\n  }\n\n  return item as EditableFilter;\n}\n</script>\n<template>\n  <div>\n    <PlElementList\n      v-model:items=\"rootFilters\"\n      :get-item-key=\"(filter) => filter.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"(filter) => filter.isExpanded === true\"\n      :on-expand=\"toggleExpand\"\n      :is-toggled=\"(item) => item.isSuppressed === true\"\n      :on-toggle=\"toggleSuppress\"\n      :is-pinned=\"(item, index) => props.isPinned?.(item, index) === true\"\n      :is-pinnable=\"() => false\"\n      :is-removable=\"(item, index) => props.isRemovable?.(item, index) === true\"\n      :is-draggable=\"(item, index) => props.isDraggable?.(item, index) === true\"\n      :disable-toggling=\"props.enableToggling !== true\"\n      :disable-dragging=\"false\"\n      :disable-removing=\"false\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index\">Filter group</slot>\n      </template>\n      <template #item-content=\"{ item, index }\">\n        <div\n          :class=\"[$style.groupContent, { [$style.suppressedLabel]: item.isSuppressed }]\"\n          dropzone=\"true\"\n          @drop=\"(event) => handleDropToExistingGroup(index, event)\"\n          @dragover=\"dragOver\"\n        >\n          <PlCheckbox\n            :model-value=\"item.type === 'not'\"\n            :class=\"$style.notCheckbox\"\n            @update:model-value=\"inverseRootNode(index)\"\n          >\n            Filter Out\n          </PlCheckbox>\n          <template v-for=\"(_, filterIdx) in getNotContent(item).filters\" :key=\"filterIdx\">\n            <FilterEditor\n              :filter=\"validateFilter(getNotContent(item).filters[filterIdx])\"\n              :operand=\"getNotContent(item).type\"\n              :column-options=\"options\"\n              :supported-filters=\"props.supportedFilters\"\n              :get-suggest-options=\"props.getSuggestOptions\"\n              :enable-dnd=\"Boolean(props.enableDnd)\"\n              :is-last=\"filterIdx === getNotContent(item).filters.length - 1\"\n              @delete=\"() => removeFilterFromGroup(index, filterIdx)\"\n              @update-filter=\"(value) => updateFilter(index, filterIdx, value)\"\n              @change-operand=\"(v) => changeGroupOperand(index, v)\"\n            />\n          </template>\n          <div v-if=\"props.enableDnd\" :class=\"$style.dropzone\">\n            <div>Drop dimensions here</div>\n          </div>\n          <PlBtnSecondary\n            v-else-if=\"!props.isCompletedGroup(item, index)\"\n            icon=\"add\"\n            @click=\"addColumnToGroup(index, firstColumnId)\"\n          >\n            Add filter\n          </PlBtnSecondary>\n        </div>\n      </template>\n      <template #item-after=\"{ index }\">\n        <OperandButton\n          v-if=\"props.enableAddGroupButton || index < getRootGroups().length - 1\"\n          :class=\"$style.buttonWrapper\"\n          :active=\"props.filters.type\"\n          :disabled=\"index === getRootGroups().length - 1\"\n          :on-select=\"changeRootOperand\"\n        />\n      </template>\n    </PlElementList>\n\n    <!-- Last group - always empty, just for adding new groups -->\n    <PlElementList\n      v-if=\"props.enableAddGroupButton\"\n      :items=\"emptyGroup\"\n      :get-item-key=\"(group) => group.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"() => true\"\n      :disableDragging=\"true\"\n      :disableRemoving=\"true\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n      dropzone=\"true\"\n      @drop=\"handleDropToNewGroup\"\n      @dragover=\"dragOver\"\n    >\n      <template #item-title=\"{ item, index }\">\n        <slot name=\"group-title\" :item=\"item\" :index=\"index + getRootGroups().length\"\n          >Filter group</slot\n        >\n      </template>\n      <template #item-content>\n        <div v-if=\"enableDnd\" :class=\"$style.dropzone\">\n          <div>Drop dimensions here</div>\n        </div>\n        <slot v-else name=\"add-group-buttons\">\n          <PlBtnSecondary icon=\"add\" @click=\"addGroup(firstColumnId)\"> Add filter </PlBtnSecondary>\n        </slot>\n      </template>\n    </PlElementList>\n  </div>\n</template>\n<style module>\n.filterGroup {\n  background: var(--bg-base-light);\n}\n.filterGroup:hover {\n  background: rgba(99, 224, 36, 0.12);\n}\n.filterGroupTitle {\n  background: none;\n}\n.filterGroupContent {\n  padding: 4px 24px 24px 24px;\n}\n.groupContent {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.notCheckbox {\n  margin: 4px 0;\n}\n.suppressedLabel {\n  filter: grayscale(100%);\n  pointer-events: none;\n}\n.dropzone {\n  border-radius: 6px;\n  border: 1.5px dashed var(--color-div-grey);\n  color: var(--txt-03);\n  font-family: Manrope;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  height: 40px;\n  cursor: default;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.buttonWrapper {\n  margin-top: 8px;\n  height: 56px;\n  display: flex;\n  align-items: center;\n}\n:global(.sortable-chosen) .buttonWrapper {\n  visibility: hidden;\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.vue.d.ts

@@ -0,0 +1,62 @@
+import { ListOptionBase } from '@platforma-sdk/model';
+import { SUPPORTED_FILTER_TYPES } from './constants';
+import { NodeFilter, PlAdvancedFilterColumnId, RootFilter, SourceOptionInfo } from './types';
+declare const __VLS_export: <T extends RootFilter>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<{
+        filters: T;
+        onUpdateFilters: (filters: T) => void;
+        /** List of ids of sources (columns, axes) that can be selected in filters */
+        options: SourceOptionInfo[];
+        /** List of supported filter types */
+        supportedFilters?: typeof SUPPORTED_FILTER_TYPES;
+        /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */
+        enableDnd?: boolean;
+        /** If true - "Add group" button is shown below the filter groups */
+        enableAddGroupButton?: boolean;
+        /** If true - eye icon is shown per group to toggle suppression */
+        enableToggling?: boolean;
+        /** Function to determine if a filter is pinned */
+        isPinned?: (item: NodeFilter, index: number) => boolean;
+        /** Function to determine if a filter is removable */
+        isRemovable?: (item: NodeFilter, index: number) => boolean;
+        /** Function to determine if a filter is draggable */
+        isDraggable?: (item: NodeFilter, index: number) => boolean;
+        /** Function to determine if a group is complete */
+        isCompletedGroup?: (group: NodeFilter, index: number) => boolean;
+        /** Loading function for unique values for Equal/InSet filters and fixed axes options. */
+        getSuggestOptions: (params: {
+            columnId: PlAdvancedFilterColumnId;
+            axisIdx?: number;
+            searchStr: string;
+            searchType: "value" | "label";
+        }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        'group-title'?: (props: {
+            item: NodeFilter<import('./types').RequiredMeta>;
+            index: number;
+        }) => any;
+    } & {
+        'group-title'?: (props: {
+            item: NodeFilter;
+            index: number;
+        }) => any;
+    } & {
+        'add-group-buttons'?: (props: {}) => any;
+    };
+    emit: {};
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};
+//# sourceMappingURL=PlAdvancedFilter.vue.d.ts.map

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlAdvancedFilter.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"names":[],"mappings":"AAqYA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAK3D,OAAO,EAAwC,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAC3F,OAAO,KAAK,EAGV,UAAU,EAEV,wBAAwB,EACxB,UAAU,EACV,gBAAgB,EACjB,MAAM,SAAS,CAAC;AAGjB,QAAA,MAAM,YAAY,GAAK,CAAC,SAAS,UAAU,EAC1C,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAilBO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB;iBA/kB1C,CAAC;yBACO,CAAC,OAAO,EAAE,CAAC,KAAK,IAAI;QACrC,6EAA6E;iBACpE,gBAAgB,EAAE;QAC3B,qCAAqC;2BAClB,OAAO,sBAAsB;QAChD,wHAAwH;oBAC5G,OAAO;QACnB,oEAAoE;+BAC7C,OAAO;QAC9B,kEAAkE;yBACjD,OAAO;QACxB,kDAAkD;mBACvC,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO;QACvD,qDAAqD;sBACvC,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO;QAC1D,qDAAqD;sBACvC,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO;QAC1D,mDAAmD;2BAChC,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO;QAChE,yFAAyF;2BACtE,CAAC,MAAM,EAAE;YAC1B,QAAQ,EAAE,wBAAwB,CAAC;YACnC,OAAO,CAAC,EAAE,MAAM,CAAC;YACjB,SAAS,EAAE,MAAM,CAAC;YAClB,UAAU,EAAE,OAAO,GAAG,OAAO,CAAC;SAC/B,KAAK,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;MAqjBd,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC1I,CAAC,OAAO,EAAE,EAAE,KAAK,IAAI;WACtB,GAAG;;wBAVS,CAAC,KAAK;;;SAAgB,KAAK,GAAG;;wBAC9B,CAAC,KAAK;;;SAAiB,KAAK,GAAG;;8BACzB,CAAC,KAAK,IAAiB,KAAK,GAAG;;UAUlD,EAAE;EAEL,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;wBACpE,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}