@akinon/akifilter 0.5.4 → 1.0.0

package/package.json

@@ -1,6 +1,8 @@
 {
   "name": "@akinon/akifilter",
-  "version": "0.5.4",
+  "version": "1.0.0",
+  "private": false,
+  "description": "Akifilter is a filtering library for Akinon frontend applications.",
   "type": "module",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -8,41 +10,40 @@
     "dist"
   ],
   "dependencies": {
-    "@types/lodash": "^4.14.202",
-    "antd": "5.17.0",
-    "dayjs": "1.11.10",
-    "lodash": "^4.17.21",
-    "react-hook-form": "7.48.2",
-    "react-hook-form-antd": "1.0.1",
-    "use-immer": "^0.9.0",
-    "@akinon/akiform-builder": "^0.6.0",
-    "@akinon/ui-divider": "0.3.0",
-    "@akinon/icons": "^0.4.0",
-    "@akinon/ui-input": "0.4.0",
-    "@akinon/ui-pagination": "0.3.0",
-    "@akinon/ui-layout": "0.4.0",
-    "@akinon/ui-modal": "0.3.0",
-    "@akinon/ui-space": "0.3.0",
-    "@akinon/ui-tree-select": "0.3.0",
-    "@akinon/akilocale": "^0.12.0",
-    "@akinon/ui-typography": "0.3.0"
+    "antd": "^5.27.0",
+    "react-error-boundary": "^6.0.0",
+    "@akinon/akilocale": "1.2.0",
+    "@akinon/akiform": "1.1.1",
+    "@akinon/icons": "1.1.0",
+    "@akinon/ui-checkbox": "1.3.0",
+    "@akinon/ui-card": "1.1.0",
+    "@akinon/ui-input": "1.1.0",
+    "@akinon/akidate": "1.1.1",
+    "@akinon/ui-input-number": "1.3.0",
+    "@akinon/ui-modal": "1.1.0",
+    "@akinon/ui-pagination": "1.3.1",
+    "@akinon/ui-date-picker": "1.3.0",
+    "@akinon/ui-select": "1.3.1",
+    "@akinon/ui-space": "1.3.0",
+    "@akinon/ui-typography": "1.1.0",
+    "@akinon/ui-button": "1.3.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0",
     "copyfiles": "^2.4.1",
     "rimraf": "^5.0.5",
-    "typescript": "^5.2.2",
-    "@akinon/vite-config": "0.4.0",
-    "@akinon/eslint-config": "0.1.0",
-    "@akinon/typescript-config": "0.2.0"
+    "typescript": "*",
+    "@akinon/akiform-builder": "1.3.2",
+    "@akinon/typescript-config": "1.1.0",
+    "@akinon/ui-theme": "1.1.0",
+    "@akinon/utils": "1.1.1",
+    "@akinon/vitest-config": "1.1.0"
   },
   "peerDependencies": {
-    "react": ">=18",
-    "react-dom": ">=18",
-    "react-router": ">=6.17.0",
-    "react-router-dom": ">=6.17.0"
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19"
   },
-  "clean-package": "../../../clean-package.config.json",
+  "clean-package": "./clean-package.config.json",
   "types": "dist/esm/index.d.ts",
   "exports": {
     ".": {
@@ -50,18 +51,23 @@
       "import": "./dist/esm/index.js",
       "require": "./dist/cjs/index.js"
     },
+    "./devtools": {
+      "types": "./dist/esm/devtools.d.ts",
+      "import": "./dist/esm/devtools.js",
+      "require": "./dist/cjs/devtools.js"
+    },
     "./package.json": "./package.json"
   },
   "scripts": {
     "build": "pnpm run build:esm && pnpm run build:commonjs && pnpm run copy:files",
-    "build:esm": "tsc --outDir dist/esm",
     "build:commonjs": "tsc --module commonjs --outDir dist/cjs",
-    "copy:files": "copyfiles -u 1 src/*.css dist/esm && copyfiles -u 1 src/*.css dist/cjs && copyfiles -u 1 src/**/*.css dist/esm && copyfiles -u 1 src/**/*.css dist/cjs",
-    "lint": "eslint *.ts*",
-    "test": "vitest run",
+    "build:esm": "tsc --outDir dist/esm",
+    "clean": "rimraf dist/",
+    "copy:files": "copyfiles -u 1 \"src/**/*.!(ts|tsx)\" dist/esm && copyfiles -u 1 \"src/**/*.!(ts|tsx)\" dist/cjs",
+    "test": "vitest",
     "test:coverage": "vitest run --coverage",
+    "test:run": "vitest run",
     "test:ui": "vitest --ui",
-    "test:watch": "vitest watch",
     "typecheck": "tsc --noEmit"
   }
 }

package/dist/cjs/components/AppliedFilters/AppliedFilterItem.d.ts

@@ -1,12 +0,0 @@
-import './styles.css';
-import React from 'react';
-import type { FilterState } from '../FilterContext';
-type AppliedFilterItemProps = {
-    filterKeyValue: [
-        string,
-        (FilterState['appliedFilters'][string] | FilterState['appliedFilters'][string][])
-    ];
-};
-export declare const AppliedFilterItem: ({ filterKeyValue }: AppliedFilterItemProps) => React.JSX.Element | null;
-export {};
-//# sourceMappingURL=AppliedFilterItem.d.ts.map

package/dist/cjs/components/AppliedFilters/AppliedFilterItem.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppliedFilterItem.d.ts","sourceRoot":"","sources":["../../../../src/components/AppliedFilters/AppliedFilterItem.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AAKtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAMpD,KAAK,sBAAsB,GAAG;IAC5B,cAAc,EAAE;QACd,MAAM;QACN,CACI,WAAW,CAAC,gBAAgB,CAAC,CAAC,MAAM,CAAC,GACrC,WAAW,CAAC,gBAAgB,CAAC,CAAC,MAAM,CAAC,EAAE,CAC1C;KACF,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,iBAAiB,uBAE3B,sBAAsB,6BAuGxB,CAAC"}

package/dist/cjs/components/AppliedFilters/AppliedFilterItem.js

@@ -1,62 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AppliedFilterItem = void 0;
-require("./styles.css");
-const icons_1 = require("@akinon/icons");
-const ui_space_1 = require("@akinon/ui-space");
-const ui_typography_1 = require("@akinon/ui-typography");
-const react_1 = require("react");
-const dayjs_1 = require("dayjs");
-const FilterContext_1 = require("../FilterContext");
-const lodash_1 = require("lodash");
-const AppliedFilterItem = ({ filterKeyValue }) => {
-    const [filterKey, filterValue] = filterKeyValue;
-    const { state: { applicableFilters, appliedFilters }, dispatch, conditionalFiltersSchema } = (0, FilterContext_1.useFilterContext)();
-    // find filterItem for placeholder, etc from filterKey
-    const filterItem = [
-        ...applicableFilters,
-        ...(conditionalFiltersSchema || [])
-    ].find(i => i.key === filterKey);
-    if (!filterItem) {
-        console.warn(`filterItem with key ${filterKey} not found`);
-        return null;
-    }
-    // TODO getModifiedFilterValue doesn't need filterValue. It can obtain it from filterItem
-    // TODO explain why you need to modify the filter value
-    // const modifiedFilterValue = getModifiedFilterValue({
-    //   filterItem,
-    //   filterValue
-    // });
-    // const shouldShowActiveFilter =
-    //   !isEmpty(filterItem) && !isEmpty(modifiedFilterValue);
-    const handleRemoveFilter = (removedFilterKey) => {
-        // TODO write test for below comment
-        // you should mark the key as undefined instead of deleting it for antd form item to pick up the change
-        const newFilters = Object.assign(Object.assign({}, appliedFilters), { [removedFilterKey]: undefined });
-        dispatch({
-            type: 'SET_APPLIED_FILTERS',
-            payload: { appliedFilters: newFilters }
-        });
-    };
-    const inputField = filterItem;
-    const renderFilterValue = (value) => {
-        if (value instanceof Date) {
-            return (0, dayjs_1.default)(value).format('YYYY-MM-DD');
-        }
-        if ((0, lodash_1.isBoolean)(value)) {
-            return value.toString();
-        }
-        if ((0, lodash_1.isArray)(value)) {
-            return value.join(', ');
-        }
-        return String(value);
-    };
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(ui_space_1.Space, { key: filterKey, align: "center", className: "active-filter-item" },
-            react_1.default.createElement(ui_typography_1.Text, { className: "active-filter-item__label" }, inputField === null || inputField === void 0 ? void 0 :
-                inputField.placeholder,
-                ":"),
-            react_1.default.createElement(ui_typography_1.Text, { className: "active-filter-item__value" }, renderFilterValue(filterValue)),
-            react_1.default.createElement(icons_1.Icon, { icon: "close", size: 20, className: "active-filter-item__remove-filter-icon", onClick: () => handleRemoveFilter(filterKey) }))));
-};
-exports.AppliedFilterItem = AppliedFilterItem;

package/dist/cjs/components/AppliedFilters/common.d.ts

@@ -1,6 +0,0 @@
-export declare const isFileObject: (value: any) => boolean;
-export declare const getModifiedFilterValue: ({ filterItem, filterValue }: {
-    filterItem: any;
-    filterValue: any['value'];
-}) => any;
-//# sourceMappingURL=common.d.ts.map

package/dist/cjs/components/AppliedFilters/common.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../src/components/AppliedFilters/common.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,YAAY,UAAW,GAAG,YAAuC,CAAC;AAE/E,eAAO,MAAM,sBAAsB,gCAGhC;IACD,UAAU,EAAE,GAAG,CAAC;IAChB,WAAW,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;CAC3B,QA8BA,CAAC"}

package/dist/cjs/components/AppliedFilters/common.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getModifiedFilterValue = exports.isFileObject = void 0;
-/* eslint-disable */
-const ui_tree_select_1 = require("@akinon/ui-tree-select");
-const constants_1 = require("../../constants");
-const utils_1 = require("../../utils");
-const isFileObject = (value) => (value === null || value === void 0 ? void 0 : value.originFileObj) !== undefined;
-exports.isFileObject = isFileObject;
-const getModifiedFilterValue = ({ filterItem, filterValue }) => {
-    var _a, _b, _c;
-    switch (filterItem === null || filterItem === void 0 ? void 0 : filterItem.widget) {
-        case 'select':
-            if (((_a = filterItem === null || filterItem === void 0 ? void 0 : filterItem.widgetProps) === null || _a === void 0 ? void 0 : _a.mode) === 'multiple') {
-                return filterValue === null || filterValue === void 0 ? void 0 : filterValue.map((value) => {
-                    const optionObject = filterItem.options.find((option) => option.value === value);
-                    return (optionObject === null || optionObject === void 0 ? void 0 : optionObject.label) || value;
-                }).join(', ');
-            }
-            const optionObject = filterItem.options.find((option) => option.value === filterValue);
-            return (optionObject === null || optionObject === void 0 ? void 0 : optionObject.label) || filterValue;
-        case 'date-picker':
-            return filterValue === null || filterValue === void 0 ? void 0 : filterValue.format(constants_1.overallDateFormat);
-        case 'checkbox-group':
-            return filterValue === null || filterValue === void 0 ? void 0 : filterValue.map(() => 'Yes').join(', ');
-        case ui_tree_select_1.TreeSelect:
-            const tree = (_b = filterItem === null || filterItem === void 0 ? void 0 : filterItem.widgetProps) === null || _b === void 0 ? void 0 : _b.treeData;
-            const label = (_c = (0, utils_1.getTreeNodeByValue)({ tree, nodeValue: filterValue })) === null || _c === void 0 ? void 0 : _c.value;
-            return label || filterValue;
-        default:
-            return filterValue;
-    }
-};
-exports.getModifiedFilterValue = getModifiedFilterValue;

package/dist/cjs/components/AppliedFilters/index.d.ts

@@ -1,4 +0,0 @@
-import './styles.css';
-import React from 'react';
-export declare const AppliedFilters: () => React.JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/AppliedFilters/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/AppliedFilters/index.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AAMtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,eAAO,MAAM,cAAc,yBAyC1B,CAAC"}

package/dist/cjs/components/AppliedFilters/index.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AppliedFilters = void 0;
-require("./styles.css");
-const icons_1 = require("@akinon/icons");
-const ui_layout_1 = require("@akinon/ui-layout");
-const ui_space_1 = require("@akinon/ui-space");
-const ui_typography_1 = require("@akinon/ui-typography");
-const react_1 = require("react");
-const FilterContext_1 = require("../FilterContext");
-const AppliedFilterItem_1 = require("./AppliedFilterItem");
-const AppliedFilters = () => {
-    var _a;
-    const { state: { appliedFilters }, dispatch } = (0, FilterContext_1.useFilterContext)();
-    const handleOnResetFilters = () => {
-        dispatch({ type: 'SET_APPLIED_FILTERS', payload: { appliedFilters: {} } });
-    };
-    return (react_1.default.createElement(ui_layout_1.Row, { align: "middle", className: "applied_filters" },
-        react_1.default.createElement(ui_layout_1.Col, { className: "applied_filters__list" },
-            react_1.default.createElement(ui_space_1.Space, null,
-                react_1.default.createElement(ui_typography_1.Text, { className: "applied_filters__label" }, "Active filters:"),
-                react_1.default.createElement(ui_space_1.Space, { className: "applied_filters__items", "data-testid": "appliedFilters" }, (_a = Object.entries(appliedFilters)) === null || _a === void 0 ? void 0 : _a.map(([filterKey, filterValue], i) => filterValue !== undefined && (react_1.default.createElement(AppliedFilterItem_1.AppliedFilterItem, { filterKeyValue: [filterKey, filterValue], key: i })))))),
-        react_1.default.createElement(ui_layout_1.Col, { className: "applied_filters__clear-filters" },
-            react_1.default.createElement(icons_1.Icon, { icon: "bin", size: 35, className: "applied_filters__reset-filters-icon", onClick: handleOnResetFilters }))));
-};
-exports.AppliedFilters = AppliedFilters;

package/dist/cjs/components/AppliedFilters/styles.css

@@ -1,65 +0,0 @@
-.akinon-filter .applied_filters {
-  padding: 5px 6px;
-  background-color: #2b344c;
-  border-radius: 5px;
-}
-
-.applied_filters .applied_filters__list {
-  flex: 1;
-  background-color: #1e1e2d;
-  padding: 6px 16px;
-  border-radius: 3px;
-}
-
-.applied_filters .applied_filters__label.akinon-typography {
-  color: white;
-  font-size: 14px;
-  font-weight: 600;
-}
-
-.applied_filters .applied_filters__reset-filters-icon {
-  cursor: pointer;
-  color: white;
-  font-size: 20px;
-  padding: 6px;
-  margin: 6px;
-}
-
-.applied_filters .applied_filters__items {
-  flex-wrap: wrap;
-}
-
-.akinon-filter .active-filter-item {
-  font-size: 14px;
-  background-color: white;
-  padding: 1px 4px;
-  border-radius: 3px;
-  line-height: 1rem;
-}
-
-.active-filter-item .akinon-space-item {
-  display: flex;
-  justify-content: center;
-}
-
-.active-filter-item .active-filter-item__label.akinon-typography,
-.active-filter-item .active-filter-item__value.akinon-typography {
-  color: #4a4a4a;
-}
-
-.active-filter-item .active-filter-item__label.akinon-typography {
-  font-weight: 600;
-}
-
-.active-filter-item .active-filter-item__value.akinon-typography {
-  font-weight: 500;
-}
-
-.active-filter-item .active-filter-item__remove-filter-icon {
-  cursor: pointer;
-  background-color: #4482ff;
-  color: white;
-  font-size: 5px;
-  padding: 5px;
-  border-radius: 99px;
-}

package/dist/cjs/components/ConditionalFilters/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-export declare const ConditionalFilters: () => React.JSX.Element | null;
-//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/ConditionalFilters/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionalFilters/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,kBAAkB,gCAyC9B,CAAC"}

package/dist/cjs/components/ConditionalFilters/index.js

@@ -1,32 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ConditionalFilters = void 0;
-const akiform_builder_1 = require("@akinon/akiform-builder");
-const ui_typography_1 = require("@akinon/ui-typography");
-const react_1 = require("react");
-const FilterContext_1 = require("../FilterContext");
-const ConditionalFilters = () => {
-    const { dispatch, state, conditionalFiltersSchema } = (0, FilterContext_1.useFilterContext)();
-    const { appliedFilters } = state;
-    const [formResetCount, setFormResetCount] = react_1.default.useState(0);
-    // reset form state when conditionalFiltersSchema changes
-    react_1.default.useEffect(() => {
-        setFormResetCount(formResetCount + 1);
-    }, [conditionalFiltersSchema]);
-    // second form created just to reset antd form state when conditionalFiltersSchema changes.
-    const handleFormChange = (allValues) => {
-        dispatch({
-            type: 'SET_APPLIED_FILTERS',
-            payload: {
-                appliedFilters: Object.assign(Object.assign({}, appliedFilters), allValues)
-            }
-        });
-    };
-    if (!conditionalFiltersSchema)
-        return null;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(ui_typography_1.Paragraph, { className: "akinon-filter__header" }, "COMMON PARAMETER FILTERS"),
-        react_1.default.createElement("div", null,
-            react_1.default.createElement(akiform_builder_1.FormBuilderWatch, { builderFields: conditionalFiltersSchema, handleChange: handleFormChange, key: formResetCount, isDebounced: true }))));
-};
-exports.ConditionalFilters = ConditionalFilters;

package/dist/cjs/components/FilterContext/index.d.ts

@@ -1,45 +0,0 @@
-import { FormField } from '@akinon/akiform-builder';
-import React, { Dispatch } from 'react';
-import type { FilterProps } from '../..';
-export type FilterState = {
-    mainPath: string;
-    appliedFilters: {
-        [key: string]: string | number | boolean | undefined;
-    };
-    applicableFilters: FormField[];
-    shownFilters: string[];
-    recreateShownFiltersCount: number;
-};
-export type FilterAction = {
-    type: 'SET_APPLIED_FILTERS';
-    payload: {
-        appliedFilters: FilterState['appliedFilters'];
-    };
-} | {
-    type: 'SET_APPLICABLE_FILTERS';
-    payload: {
-        applicableFilters: FilterState['applicableFilters'];
-    };
-} | {
-    type: 'SET_SHOWN_FILTERS';
-    payload: {
-        shownFilters: FilterState['shownFilters'];
-    };
-};
-export type FilterContext = {
-    state: FilterState;
-    dispatch: Dispatch<FilterAction>;
-    conditionalFiltersSchema: FilterProps['conditionalFiltersSchema'];
-};
-type FilterContextProviderProps = FilterProps & {
-    children: React.ReactNode;
-};
-/**
- * FilterContextProvider manages both filter context and antd form state.
- * Reason for not separating antd form state from filter context is that antd
- * form state is tightly coupled with filter context state.
- */
-export declare const FilterContextProvider: ({ children, filterSchema, customMainPath, useAppliedFilters, conditionalFiltersSchema }: FilterContextProviderProps) => React.JSX.Element;
-export declare function useFilterContext(): FilterContext;
-export {};
-//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/FilterContext/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/FilterContext/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,EAAE,EAAiB,QAAQ,EAAyB,MAAM,OAAO,CAAC;AAI9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAGzC,MAAM,MAAM,WAAW,GAAG;IAExB,QAAQ,EAAE,MAAM,CAAC;IAEjB,cAAc,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAA;KAAE,CAAC;IAEzE,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAE/B,YAAY,EAAE,MAAM,EAAE,CAAC;IAEvB,yBAAyB,EAAE,MAAM,CAAC;CACnC,CAAC;AAQF,MAAM,MAAM,YAAY,GACpB;IACE,IAAI,EAAE,qBAAqB,CAAC;IAC5B,OAAO,EAAE;QAAE,cAAc,EAAE,WAAW,CAAC,gBAAgB,CAAC,CAAA;KAAE,CAAC;CAC5D,GACD;IACE,IAAI,EAAE,wBAAwB,CAAC;IAC/B,OAAO,EAAE;QAAE,iBAAiB,EAAE,WAAW,CAAC,mBAAmB,CAAC,CAAA;KAAE,CAAC;CAClE,GACD;IACE,IAAI,EAAE,mBAAmB,CAAC;IAC1B,OAAO,EAAE;QAAE,YAAY,EAAE,WAAW,CAAC,cAAc,CAAC,CAAA;KAAE,CAAC;CACxD,CAAC;AAEN,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,EAAE,QAAQ,CAAC,YAAY,CAAC,CAAC;IACjC,wBAAwB,EAAE,WAAW,CAAC,0BAA0B,CAAC,CAAC;CACnE,CAAC;AAEF,KAAK,0BAA0B,GAAG,WAAW,GAAG;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAIF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,4FAM/B,0BAA0B,sBA2F5B,CAAC;AAEF,wBAAgB,gBAAgB,kBAM/B"}

package/dist/cjs/components/FilterContext/index.js

@@ -1,85 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFilterContext = exports.FilterContextProvider = void 0;
-const react_1 = require("react");
-const react_router_dom_1 = require("react-router-dom");
-const use_immer_1 = require("use-immer");
-const utils_1 = require("../../utils");
-const FilterContext = (0, react_1.createContext)(undefined);
-/**
- * FilterContextProvider manages both filter context and antd form state.
- * Reason for not separating antd form state from filter context is that antd
- * form state is tightly coupled with filter context state.
- */
-const FilterContextProvider = ({ children, filterSchema, customMainPath, useAppliedFilters, conditionalFiltersSchema }) => {
-    const { pathname } = (0, react_router_dom_1.useLocation)();
-    const mainPath = customMainPath
-        ? customMainPath
-        : (0, utils_1.getPathFragments)(pathname).mainPath;
-    if (!mainPath) {
-        throw new Error('mainPath is not defined');
-    }
-    // load appliedFilters from local storage
-    const localAppliedFilters = JSON.parse(localStorage.getItem(`appliedFilters-${mainPath}`) || '{}');
-    // get applied filters from parent component
-    const parentAppliedFilters = useAppliedFilters[0];
-    // load shownFilters from local storage
-    const localShownFilters = JSON.parse(localStorage.getItem(`shownFilters-${mainPath}`) || '[]');
-    const initialState = {
-        mainPath,
-        // if parentAppliedFilters is not empty, use it. Otherwise, use localAppliedFilters. don't merge them to prevent conflicts since you want parent to have the control
-        appliedFilters: Object.keys(parentAppliedFilters).length > 0
-            ? parentAppliedFilters
-            : localAppliedFilters,
-        applicableFilters: filterSchema,
-        // if localShownFilters is not defined, only show first 8 filters
-        shownFilters: localShownFilters.length
-            ? localShownFilters
-            : filterSchema.map(filter => filter.key).slice(0, 8),
-        recreateShownFiltersCount: 0
-    };
-    const [state, dispatch] = (0, use_immer_1.useImmerReducer)((draft, action) => {
-        switch (action.type) {
-            case 'SET_APPLIED_FILTERS':
-                // console.log('SET_APPLIED_FILTERS', action.payload.appliedFilters);
-                draft.appliedFilters = action.payload.appliedFilters;
-                return;
-            case 'SET_APPLICABLE_FILTERS':
-                // console.log('SET_APPLICABLE_FILTERS');
-                draft.applicableFilters = action.payload.applicableFilters;
-                return;
-            case 'SET_SHOWN_FILTERS':
-                // console.log('SET_SHOWN_FILTERS', action.payload.shownFilters);
-                draft.shownFilters = action.payload.shownFilters;
-                draft.recreateShownFiltersCount = draft.recreateShownFiltersCount + 1;
-                return;
-        }
-    }, initialState);
-    (0, react_1.useEffect)(() => {
-        // send applied filters to parent component
-        useAppliedFilters[1](state.appliedFilters);
-        // save current appliedFilters to local storage to persist them
-        localStorage.setItem(`appliedFilters-${mainPath}`, JSON.stringify(state.appliedFilters));
-    }, [state.appliedFilters]);
-    // save current shownFilters to local storage to persist them
-    (0, react_1.useEffect)(() => {
-        localStorage.setItem(`shownFilters-${mainPath}`, JSON.stringify(state.shownFilters));
-    }, [state.shownFilters]);
-    (0, react_1.useEffect)(() => {
-        dispatch({
-            type: 'SET_APPLICABLE_FILTERS',
-            payload: { applicableFilters: filterSchema }
-        });
-    }, [filterSchema]);
-    // console.log('form state', state);
-    return (react_1.default.createElement(FilterContext.Provider, { value: { state, dispatch, conditionalFiltersSchema } }, children));
-};
-exports.FilterContextProvider = FilterContextProvider;
-function useFilterContext() {
-    const context = (0, react_1.useContext)(FilterContext);
-    if (context === undefined) {
-        throw new Error('useFilterContext must be used within a FilterProvider');
-    }
-    return context;
-}
-exports.useFilterContext = useFilterContext;

package/dist/cjs/components/SelectShownFilters/index.d.ts

@@ -1,7 +0,0 @@
-import './styles.css';
-import React from 'react';
-/**
- * Via this component, user can select which filters to show in the UI from applicableFilters.
- */
-export declare const SelectShownFilters: () => React.JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/SelectShownFilters/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SelectShownFilters/index.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AActB,OAAO,KAAmB,MAAM,OAAO,CAAC;AAWxC;;GAEG;AACH,eAAO,MAAM,kBAAkB,yBA+J9B,CAAC"}

package/dist/cjs/components/SelectShownFilters/index.js

@@ -1,111 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SelectShownFilters = void 0;
-require("./styles.css");
-const akiform_builder_1 = require("@akinon/akiform-builder");
-const icons_1 = require("@akinon/icons");
-const ui_input_1 = require("@akinon/ui-input");
-const ui_pagination_1 = require("@akinon/ui-pagination");
-const ui_divider_1 = require("@akinon/ui-divider");
-const ui_modal_1 = require("@akinon/ui-modal");
-const ui_space_1 = require("@akinon/ui-space");
-const react_1 = require("react");
-const FilterContext_1 = require("../FilterContext");
-// import {
-//   getModalFormInitialValues,
-//   getModalFormMeta,
-//   transformFiltersFormMetaFieldsToModalFormMetaFields
-// } from './common';
-// import useOnModalCancel from './hooks/useOnModalCancel';
-// TODO includeFileFilter
-/**
- * Via this component, user can select which filters to show in the UI from applicableFilters.
- */
-const SelectShownFilters = () => {
-    const [search, setSearch] = (0, react_1.useState)('');
-    const [pagination, setPagination] = (0, react_1.useState)({
-        current: 1,
-        pageSize: 60
-    });
-    const { state, dispatch } = (0, FilterContext_1.useFilterContext)();
-    const { applicableFilters, shownFilters } = state;
-    // create checkbox form item for each filter, which will determine whether to show it or not
-    const modalFormItems = [];
-    applicableFilters.forEach((filter) => {
-        var _a;
-        if (search &&
-            !((_a = filter.placeholder) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(search.toLowerCase())) &&
-            !filter.label.toLowerCase().includes(search.toLowerCase())) {
-            return;
-        }
-        modalFormItems.push({
-            key: filter.key,
-            label: filter.placeholder || filter.label || filter.key,
-            type: 'checkbox',
-            value: shownFilters.includes(filter.key),
-            props: {
-                labelRightAligned: true
-            }
-        });
-    });
-    const modalFormItemsPaginated = modalFormItems.slice((pagination.current - 1) * pagination.pageSize, pagination.current * pagination.pageSize);
-    // export const transformFiltersFormMetaFieldsToModalFormMetaFields = (filtersFormMetaFields) =>
-    // filtersFormMetaFields.map((metaField) => ({
-    //   key: metaField.key,
-    //   widget: WidgetType.CHECKBOX,
-    //   children: metaField.placeholder,
-    // }));
-    const [isModalOpen, setIsModalOpen] = (0, react_1.useState)(false);
-    // const onModalCancel = useOnModalCancel({
-    //   setCurrentFiltersFormMeta,
-    //   modalForm,
-    //   setIsModalOpen,
-    //   staticFiltersFormMetaFields,
-    //   dynamicFiltersFormMetaFields
-    // });
-    // const modalFormInitialValues = getModalFormInitialValues(
-    //   currentFiltersFormMeta
-    // );
-    // const modalFormMetaFields =
-    //   transformFiltersFormMetaFieldsToModalFormMetaFields([
-    //     ...staticFiltersFormMetaFields,
-    //     ...dynamicFiltersFormMetaFields
-    //   ]);
-    const handleOpenModalIconClick = () => {
-        setIsModalOpen(true);
-    };
-    const onModalCancel = () => {
-        setIsModalOpen(false);
-    };
-    const handleModalFormValuesChange = (allValues) => {
-        // select true values from allValues
-        const shownFilters = Object.keys(allValues).filter(key => allValues[key] === true);
-        dispatch({
-            type: 'SET_SHOWN_FILTERS',
-            payload: { shownFilters }
-        });
-    };
-    // const addFileToFilters = selectFile => {
-    //   setFilters({
-    //     pagePath: mainPath,
-    //     filters: { ...pageFilters, filter_file: selectFile.file }
-    //   });
-    // };
-    return (react_1.default.createElement(ui_space_1.Space, { className: "filter-options" },
-        react_1.default.createElement("div", { className: "filter-options__item", onClick: handleOpenModalIconClick },
-            react_1.default.createElement(icons_1.Icon, { icon: "filter" })),
-        react_1.default.createElement(ui_modal_1.Modal, { className: "filter-options__modal", onCancel: onModalCancel, open: isModalOpen, destroyOnClose: true, footer: null, width: '80%', "data-testid": "filter-options-modal" },
-            react_1.default.createElement("div", { className: "filter-options__modal-header" },
-                react_1.default.createElement("div", { className: "filter-options__modal-header-banner" }),
-                react_1.default.createElement("h1", { className: "filter-options__modal-header-title" }, "Select Shown Filters")),
-            react_1.default.createElement(ui_divider_1.Divider, null),
-            react_1.default.createElement("div", { className: "filter-options__modal-control" },
-                react_1.default.createElement(ui_input_1.Input, { placeholder: "Search", onChange: e => setSearch(e.target.value), className: "filter-options__modal-search" }),
-                react_1.default.createElement("div", { className: "filter-options__modal-pagination" },
-                    react_1.default.createElement(ui_pagination_1.Pagination, { current: pagination.current, pageSize: pagination.pageSize, total: modalFormItems.length, onChange: (page, pageSize) => {
-                            setPagination({ current: page, pageSize });
-                        }, showSizeChanger: false, simple: true }))),
-            react_1.default.createElement("div", { className: "filter-options__modal-form" },
-                react_1.default.createElement(akiform_builder_1.FormBuilderWatch, { builderFields: modalFormItemsPaginated, handleChange: handleModalFormValuesChange, isDebounced: false })))));
-};
-exports.SelectShownFilters = SelectShownFilters;