@cloud-ru/uikit-product-mobile-table 0.16.3 → 0.17.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 0.17.0 (2026-01-21)
+
+
+### Features
+
+* **FF-7319:** mobile table persistent filters state and structure refactoring ([80e26a3](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/80e26a317a9b25eb8af327329a4b14d47e6b8b60))
+
+
+
+
+
 ## 0.16.3 (2025-12-17)
 
 ### Only dependencies have been changed

package/dist/cjs/components/AdaptiveServerTable/AdaptiveServerTable.js

@@ -15,15 +15,16 @@ exports.AdaptiveServerTable = AdaptiveServerTable;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const table_1 = require("@snack-uikit/table");
-const constants_1 = require("../constants");
-const hooks_1 = require("../hooks");
+const utils_1 = require("@snack-uikit/utils");
+const constants_1 = require("../../constants");
 const MobileTable_1 = require("../MobileTable");
-const utils_1 = require("../utils");
+const constants_2 = require("./constants");
+const utils_2 = require("./utils");
 function AdaptiveServerTable(_a) {
     var { layoutType } = _a, props = __rest(_a, ["layoutType"]);
     const isMobile = layoutType === 'mobile';
-    const { onChangePage, search: searchProp, pagination, items, total = constants_1.DEFAULT_PAGINATION_LIMIT, limit = constants_1.DEFAULT_PAGINATION_LIMIT, offset = 0 } = props, rest = __rest(props, ["onChangePage", "search", "pagination", "items", "total", "limit", "offset"]);
-    const { state: search, onStateChange: setSearch } = (0, hooks_1.useStateControl)(searchProp, '');
+    const { onChangePage, search: searchProp, pagination, items, total = constants_2.DEFAULT_PAGINATION_LIMIT, limit = constants_2.DEFAULT_PAGINATION_LIMIT, offset = 0 } = props, rest = __rest(props, ["onChangePage", "search", "pagination", "items", "total", "limit", "offset"]);
+    const [search, setSearch] = (0, utils_1.useValueControl)(searchProp !== null && searchProp !== void 0 ? searchProp : { defaultValue: '' });
     const [tempSearch, setTempSearch] = (0, react_1.useState)(search || '');
     (0, react_1.useEffect)(() => {
         var _a;
@@ -35,7 +36,7 @@ function AdaptiveServerTable(_a) {
     }, [searchProp === null || searchProp === void 0 ? void 0 : searchProp.state]);
     const handleSearch = (0, react_1.useCallback)((newValue) => {
         setTempSearch(newValue);
-        (0, utils_1.onSearchDebounced)(newValue.trim(), setSearch);
+        (0, utils_2.onSearchDebounced)(newValue.trim(), setSearch);
     }, [setSearch]);
     const handlePageChange = (0, react_1.useCallback)(({ pageSize, pageIndex }) => onChangePage(pageIndex * pageSize, pageSize), [onChangePage]);
     const pageIndex = (0, react_1.useMemo)(() => Math.floor(offset / limit), [limit, offset]);

package/dist/{esm/components → cjs/components/AdaptiveServerTable}/constants.d.ts

@@ -1,3 +1,2 @@
-export declare const DEFAULT_PAGE_SIZE = 5;
 export declare const SEARCH_DELAY = 500;
 export declare const DEFAULT_PAGINATION_LIMIT = 10;

package/dist/cjs/components/{constants.js → AdaptiveServerTable/constants.js}

@@ -1,6 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DEFAULT_PAGINATION_LIMIT = exports.SEARCH_DELAY = exports.DEFAULT_PAGE_SIZE = void 0;
-exports.DEFAULT_PAGE_SIZE = 5;
+exports.DEFAULT_PAGINATION_LIMIT = exports.SEARCH_DELAY = void 0;
 exports.SEARCH_DELAY = 500;
 exports.DEFAULT_PAGINATION_LIMIT = 10;

package/dist/cjs/components/{utils.d.ts → AdaptiveServerTable/utils.d.ts}

@@ -1,5 +1,3 @@
-import { FilterFn } from '@tanstack/react-table';
-export declare const fuzzyFilter: FilterFn<any>;
 type OnSearchDebouncedType = (newValue: string, onChange: (newValue: string) => void) => void;
 export declare const onSearchDebounced: OnSearchDebouncedType;
 export {};

package/dist/cjs/components/{utils.js → AdaptiveServerTable/utils.js}

@@ -3,19 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.onSearchDebounced = exports.fuzzyFilter = void 0;
-const match_sorter_utils_1 = require("@tanstack/match-sorter-utils");
+exports.onSearchDebounced = void 0;
 const lodash_debounce_1 = __importDefault(require("lodash.debounce"));
 const constants_1 = require("./constants");
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const fuzzyFilter = (row, columnId, value, addMeta) => {
-    const itemRank = (0, match_sorter_utils_1.rankItem)(row.getValue(columnId), value);
-    addMeta({
-        itemRank,
-    });
-    return itemRank.passed;
-};
-exports.fuzzyFilter = fuzzyFilter;
 exports.onSearchDebounced = (0, lodash_debounce_1.default)((newValue, onChange) => {
     onChange(newValue);
 }, constants_1.SEARCH_DELAY);

package/dist/cjs/components/MobileTable/MobileTable.d.ts

@@ -0,0 +1,7 @@
+import { FiltersState } from '@cloud-ru/uikit-product-mobile-chips';
+import { MobileTableProps } from './types';
+export declare function MobileTable<TData extends object, TFilters extends FiltersState = Record<string, unknown>>({ data, columnDefinitions, headlineId, suppressPagination, suppressToolbar, suppressSearch, enableFuzzySearch, search, onRefresh, toolbarAfter, moreActions, columnFilters, className, headerBackground, noDataState, noResultsState, errorDataState, loading, dataError, dataFiltered, pagination: paginationProp, pageCount, sorting: sortingProp, manualSorting, manualPagination, manualFiltering, autoResetPageIndex, getRowId, rowSelection: rowSelectionProp, bulkActions: bulkActionsProp, columnsSettings: columnsSettingsProp, savedState, ...rest }: MobileTableProps<TData, TFilters>): import("react/jsx-runtime").JSX.Element;
+export declare namespace MobileTable {
+    var getRowActionsColumnDef: typeof import("../../helperComponents").getRowActionsColumnDef;
+    var getStatusColumnDef: typeof import("../../helperComponents").getStatusColumnDef;
+}

package/dist/cjs/components/{MobileTable.js → MobileTable/MobileTable.js}

@@ -24,19 +24,19 @@ const uikit_product_mobile_toolbar_1 = require("@cloud-ru/uikit-product-mobile-t
 const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
 const skeleton_1 = require("@snack-uikit/skeleton");
 const table_1 = require("@snack-uikit/table");
-const helperComponents_1 = require("../helperComponents");
-const ColumnsSettings_1 = require("../helperComponents/ColumnsSettings");
-const constants_1 = require("./constants");
+const utils_1 = require("@snack-uikit/utils");
+const constants_1 = require("../../constants");
+const helperComponents_1 = require("../../helperComponents");
 const hooks_1 = require("./hooks");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
-const utils_1 = require("./utils");
+const utils_2 = require("./utils");
 function MobileTable(_a) {
     var { data, columnDefinitions, headlineId, suppressPagination = false, suppressToolbar = false, suppressSearch = false, enableFuzzySearch = false, search, onRefresh, toolbarAfter, moreActions, columnFilters, className, headerBackground = 'default', noDataState, noResultsState, errorDataState, loading, dataError, dataFiltered, pagination: paginationProp, pageCount, sorting: sortingProp, manualSorting = false, manualPagination = false, manualFiltering = false, autoResetPageIndex = false, getRowId, rowSelection: rowSelectionProp, bulkActions: bulkActionsProp, columnsSettings: columnsSettingsProp, savedState } = _a, rest = __rest(_a, ["data", "columnDefinitions", "headlineId", "suppressPagination", "suppressToolbar", "suppressSearch", "enableFuzzySearch", "search", "onRefresh", "toolbarAfter", "moreActions", "columnFilters", "className", "headerBackground", "noDataState", "noResultsState", "errorDataState", "loading", "dataError", "dataFiltered", "pagination", "pageCount", "sorting", "manualSorting", "manualPagination", "manualFiltering", "autoResetPageIndex", "getRowId", "rowSelection", "bulkActions", "columnsSettings", "savedState"]);
     const defaultPaginationState = (0, react_1.useMemo)(() => ({ pageIndex: 0, pageSize: constants_1.DEFAULT_PAGE_SIZE }), []);
-    const { state: sorting, onStateChange: onSortingChange } = (0, hooks_1.useStateControl)(sortingProp, []);
-    const { state: globalFilter, onStateChange: onGlobalFilterChange } = (0, hooks_1.useStateControl)(search, '');
-    const { state: pagination, onStateChange: onPaginationChange } = (0, hooks_1.useStateControl)(paginationProp, defaultPaginationState);
-    const { state: rowSelection, onStateChange: onRowSelectionChange } = (0, hooks_1.useStateControl)(rowSelectionProp, {});
+    const [sorting = [], onSortingChange] = (0, utils_1.useValueControl)(sortingProp !== null && sortingProp !== void 0 ? sortingProp : { defaultValue: [] });
+    const [globalFilter = '', onGlobalFilterChange] = (0, utils_1.useValueControl)(search !== null && search !== void 0 ? search : { defaultValue: '' });
+    const [pagination = defaultPaginationState, onPaginationChange] = (0, utils_1.useValueControl)(paginationProp !== null && paginationProp !== void 0 ? paginationProp : { defaultValue: defaultPaginationState });
+    const [rowSelection = {}, onRowSelectionChange] = (0, utils_1.useValueControl)(rowSelectionProp !== null && rowSelectionProp !== void 0 ? rowSelectionProp : { defaultValue: {} });
     const enableRowSelection = (0, react_1.useCallback)((row) => {
         const parent = row.getParentRow();
         const isParentSelected = parent ? parent.getCanSelect() : true;
@@ -122,7 +122,7 @@ function MobileTable(_a) {
         onPaginationChange,
         onSortingChange,
         onColumnOrderChange: enableColumnsOrderSortByDrag ? setColumnOrder : undefined,
-        globalFilterFn: enableFuzzySearch ? utils_1.fuzzyFilter : 'includesString',
+        globalFilterFn: enableFuzzySearch ? utils_2.fuzzyFilter : 'includesString',
         enableFilters: true,
         manualSorting,
         manualPagination,
@@ -173,6 +173,8 @@ function MobileTable(_a) {
     const hasSortableColumns = (0, react_1.useMemo)(() => columnDefinitions.some(column => column.enableSorting !== false), [columnDefinitions]);
     const shouldShowSorting = (0, react_1.useMemo)(() => Boolean(sortingProp) || hasSortableColumns, [sortingProp, hasSortableColumns]);
     const tableFilteredRows = table.getFilteredRowModel().rows;
+    const { filter, patchedFilter, setFilter, setFilterVisibility } = (0, hooks_1.useFilters)({ columnFilters });
+    const validatePersistedState = (0, react_1.useMemo)(() => (0, utils_2.getPersistedStateValidator)(columnFilters), [columnFilters]);
     (0, table_1.usePageReset)({
         manualPagination,
         maximumAvailablePage: pageCount || tableFilteredRows.length / pagination.pageSize,
@@ -187,7 +189,28 @@ function MobileTable(_a) {
                             onChange: onGlobalFilterChange,
                             loading: search === null || search === void 0 ? void 0 : search.loading,
                             placeholder: (search === null || search === void 0 ? void 0 : search.placeholder) || t('searchPlaceholder'),
-                        }, onRefresh: onRefresh ? handleOnRefresh : undefined, outline: true, filterRow: columnFilters, after: toolbarAfter || shouldShowSorting || (areColumnsSettingsEnabled && columnsSettings) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [toolbarAfter, shouldShowSorting && ((0, jsx_runtime_1.jsx)(helperComponents_1.TableSorting, { table: table, columnDefinitions: columnDefinitions, enabledColumns: areColumnsSettingsEnabled ? enabledColumns : undefined, areColumnsSettingsEnabled: areColumnsSettingsEnabled })), areColumnsSettingsEnabled && columnsSettings && ((0, jsx_runtime_1.jsx)(ColumnsSettings_1.ColumnsSettings, { columnsSettings: columnsSettings, enabledColumns: enabledColumns, setEnabledColumns: setEnabledColumns }))] })) : undefined, moreActions: moreActions, bulkActions: bulkActions, selectedCount: table.getSelectedRowModel().rows.length, selectionMode: selectionMode, onCheck: enableSelection ? handleOnToolbarCheck : undefined, checked: table.getIsAllPageRowsSelected(), indeterminate: table.getIsSomePageRowsSelected() }) })), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.table, children: loading ? ((0, jsx_runtime_1.jsx)(skeleton_1.SkeletonContextProvider, { loading: true, children: loadingTableRows.map((row, index) => ((0, jsx_runtime_1.jsx)(helperComponents_1.TableCard, { headlineId: headlineId, row: row, table: loadingTable, selection: 'none' }, index))) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [tableRows.map((row, index) => ((0, jsx_runtime_1.jsx)(helperComponents_1.TableCard, { headlineId: headlineId, row: row, table: table, selectionAppearance: rowSelectionProp === null || rowSelectionProp === void 0 ? void 0 : rowSelectionProp.appearance, selection: enableSelection ? selectionMode : 'none' }, index))), (0, jsx_runtime_1.jsx)(helperComponents_1.TableEmptyState, { emptyStates: emptyStates, dataError: dataError, dataFiltered: dataFiltered || Boolean(table.getState().globalFilter), tableRowsLength: tableRows.length })] })) }), !suppressPagination && (0, jsx_runtime_1.jsx)(helperComponents_1.TablePagination, { table: table })] })));
+                        }, onRefresh: onRefresh ? handleOnRefresh : undefined, outline: true, filterRow: patchedFilter, after: toolbarAfter || shouldShowSorting || (areColumnsSettingsEnabled && columnsSettings) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [toolbarAfter, shouldShowSorting && ((0, jsx_runtime_1.jsx)(helperComponents_1.TableSorting, { table: table, columnDefinitions: columnDefinitions, enabledColumns: areColumnsSettingsEnabled ? enabledColumns : undefined, areColumnsSettingsEnabled: areColumnsSettingsEnabled })), areColumnsSettingsEnabled && columnsSettings && ((0, jsx_runtime_1.jsx)(helperComponents_1.ColumnsSettings, { columnsSettings: columnsSettings, enabledColumns: enabledColumns, setEnabledColumns: setEnabledColumns }))] })) : undefined, moreActions: moreActions, bulkActions: bulkActions, selectedCount: table.getSelectedRowModel().rows.length, selectionMode: selectionMode, onCheck: enableSelection ? handleOnToolbarCheck : undefined, checked: table.getIsAllPageRowsSelected(), indeterminate: table.getIsSomePageRowsSelected(), persist: (savedState === null || savedState === void 0 ? void 0 : savedState.id) && (savedState === null || savedState === void 0 ? void 0 : savedState.filterQueryKey)
+                        ? {
+                            id: savedState.id,
+                            filterQueryKey: savedState.filterQueryKey,
+                            validateData: data => validatePersistedState(data),
+                            state: {
+                                pagination: (0, utils_2.mapPaginationToRequestPayload)(pagination),
+                                ordering: (0, utils_2.mapSortToRequestPayload)(sorting),
+                                filter,
+                                search: globalFilter || '',
+                            },
+                            onLoad: state => {
+                                state.pagination && onPaginationChange((0, utils_2.mapPaginationToTableState)(state.pagination));
+                                state.search && onGlobalFilterChange(state.search);
+                                state.ordering && onSortingChange((0, utils_2.mapSortToTableState)(state.ordering));
+                                if (state.filter) {
+                                    setFilter(state.filter);
+                                    setFilterVisibility(Object.keys(state.filter));
+                                }
+                            },
+                        }
+                        : undefined }) })), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.table, children: loading ? ((0, jsx_runtime_1.jsx)(skeleton_1.SkeletonContextProvider, { loading: true, children: loadingTableRows.map((row, index) => ((0, jsx_runtime_1.jsx)(helperComponents_1.TableCard, { headlineId: headlineId, row: row, table: loadingTable, selection: 'none' }, index))) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [tableRows.map((row, index) => ((0, jsx_runtime_1.jsx)(helperComponents_1.TableCard, { headlineId: headlineId, row: row, table: table, selectionAppearance: rowSelectionProp === null || rowSelectionProp === void 0 ? void 0 : rowSelectionProp.appearance, selection: enableSelection ? selectionMode : 'none' }, index))), (0, jsx_runtime_1.jsx)(helperComponents_1.TableEmptyState, { emptyStates: emptyStates, dataError: dataError, dataFiltered: dataFiltered || Boolean(table.getState().globalFilter), tableRowsLength: tableRows.length })] })) }), !suppressPagination && (0, jsx_runtime_1.jsx)(helperComponents_1.TablePagination, { table: table })] })));
 }
 MobileTable.getRowActionsColumnDef = helperComponents_1.getRowActionsColumnDef;
 MobileTable.getStatusColumnDef = helperComponents_1.getStatusColumnDef;

package/dist/cjs/components/MobileTable/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useLoadingTable';
+export * from './useFilters';

package/dist/cjs/components/MobileTable/hooks/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useLoadingTable"), exports);
+__exportStar(require("./useFilters"), exports);

package/dist/cjs/components/MobileTable/hooks/useFilters/index.d.ts

@@ -0,0 +1 @@
+export * from './useFilters';

package/dist/cjs/components/MobileTable/hooks/useFilters/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useFilters"), exports);

package/dist/cjs/components/MobileTable/hooks/useFilters/useFilters.d.ts

@@ -0,0 +1,78 @@
+import { FiltersState } from '@cloud-ru/uikit-product-mobile-chips';
+import { MobileTableProps } from '../../types';
+type useFiltersProps<TData extends object, TFilters extends FiltersState = Record<string, unknown>> = Pick<MobileTableProps<TData, TFilters>, 'columnFilters'>;
+export declare function useFilters<TData extends object, TFilters extends FiltersState = Record<string, unknown>>({ columnFilters, }: useFiltersProps<TData, TFilters>): {
+    filter: TFilters | undefined;
+    setFilter: (value: any, ...args: any[]) => any;
+    patchedFilter: {
+        value: TFilters | undefined;
+        onChange: (filter: TFilters) => void;
+        visibleFilters: string[];
+        onVisibleFiltersChange: (value: any, ...args: any[]) => any;
+        'data-test-id'?: string;
+        "aria-activedescendant"?: string | undefined;
+        "aria-atomic"?: (boolean | "true" | "false") | undefined;
+        "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
+        "aria-braillelabel"?: string | undefined;
+        "aria-brailleroledescription"?: string | undefined;
+        "aria-busy"?: (boolean | "true" | "false") | undefined;
+        "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
+        "aria-colcount"?: number | undefined;
+        "aria-colindex"?: number | undefined;
+        "aria-colindextext"?: string | undefined;
+        "aria-colspan"?: number | undefined;
+        "aria-controls"?: string | undefined;
+        "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
+        "aria-describedby"?: string | undefined;
+        "aria-description"?: string | undefined;
+        "aria-details"?: string | undefined;
+        "aria-disabled"?: (boolean | "true" | "false") | undefined;
+        "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+        "aria-errormessage"?: string | undefined;
+        "aria-expanded"?: (boolean | "true" | "false") | undefined;
+        "aria-flowto"?: string | undefined;
+        "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+        "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+        "aria-hidden"?: (boolean | "true" | "false") | undefined;
+        "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+        "aria-keyshortcuts"?: string | undefined;
+        "aria-label"?: string | undefined;
+        "aria-labelledby"?: string | undefined;
+        "aria-level"?: number | undefined;
+        "aria-live"?: "off" | "assertive" | "polite" | undefined;
+        "aria-modal"?: (boolean | "true" | "false") | undefined;
+        "aria-multiline"?: (boolean | "true" | "false") | undefined;
+        "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+        "aria-orientation"?: "horizontal" | "vertical" | undefined;
+        "aria-owns"?: string | undefined;
+        "aria-placeholder"?: string | undefined;
+        "aria-posinset"?: number | undefined;
+        "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
+        "aria-readonly"?: (boolean | "true" | "false") | undefined;
+        "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
+        "aria-required"?: (boolean | "true" | "false") | undefined;
+        "aria-roledescription"?: string | undefined;
+        "aria-rowcount"?: number | undefined;
+        "aria-rowindex"?: number | undefined;
+        "aria-rowindextext"?: string | undefined;
+        "aria-rowspan"?: number | undefined;
+        "aria-selected"?: (boolean | "true" | "false") | undefined;
+        "aria-setsize"?: number | undefined;
+        "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+        "aria-valuemax"?: number | undefined;
+        "aria-valuemin"?: number | undefined;
+        "aria-valuenow"?: number | undefined;
+        "aria-valuetext"?: string | undefined;
+        defaultValue?: Partial<TFilters> | undefined;
+        filters: import("@cloud-ru/uikit-product-mobile-chips").MobileChipChoiceRowFilter[];
+        size?: import("@cloud-ru/uikit-product-mobile-chips/dist/esm/components/MobileChipChoiceRow/types").ChipChoiceRowSize;
+        className?: string;
+        showClearButton?: boolean;
+        showAddButton?: boolean;
+        initialOpen?: boolean;
+        open: boolean;
+        onOpenChange: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    } | undefined;
+    setFilterVisibility: (value: any, ...args: any[]) => any;
+};
+export {};

package/dist/cjs/components/MobileTable/hooks/useFilters/useFilters.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFilters = useFilters;
+const react_1 = require("react");
+const utils_1 = require("@snack-uikit/utils");
+const utils_2 = require("./utils");
+function useFilters({ columnFilters, }) {
+    const [areColumnFiltersOpen, setAreColumnFiltersOpen] = (0, react_1.useState)(() => (0, utils_2.getInitialColumnsFiltersOpenValue)(columnFilters));
+    const [filter, setFilter] = (0, utils_1.useValueControl)({
+        value: columnFilters === null || columnFilters === void 0 ? void 0 : columnFilters.value,
+        defaultValue: columnFilters === null || columnFilters === void 0 ? void 0 : columnFilters.defaultValue,
+        onChange: columnFilters === null || columnFilters === void 0 ? void 0 : columnFilters.onChange,
+    });
+    const [filterVisibility = [], setFilterVisibility] = (0, utils_1.useValueControl)({
+        value: columnFilters === null || columnFilters === void 0 ? void 0 : columnFilters.visibleFilters,
+        defaultValue: [],
+        onChange: columnFilters === null || columnFilters === void 0 ? void 0 : columnFilters.onVisibleFiltersChange,
+    });
+    const patchedFilter = (0, react_1.useMemo)(() => {
+        if (!columnFilters) {
+            return undefined;
+        }
+        return Object.assign(Object.assign({ open: areColumnFiltersOpen, onOpenChange: setAreColumnFiltersOpen }, columnFilters), { value: filter, onChange: setFilter, visibleFilters: filterVisibility, onVisibleFiltersChange: setFilterVisibility });
+    }, [columnFilters, areColumnFiltersOpen, filter, setFilter, filterVisibility, setFilterVisibility]);
+    return {
+        filter,
+        setFilter,
+        patchedFilter,
+        setFilterVisibility,
+    };
+}

package/dist/cjs/components/MobileTable/hooks/useFilters/utils/getInitialColumnsFiltersOpenValue.d.ts

@@ -0,0 +1,2 @@
+import { MobileTableProps } from '../../../types';
+export declare function getInitialColumnsFiltersOpenValue<TData extends object>(columnFilters: MobileTableProps<TData>['columnFilters']): boolean;

package/dist/cjs/components/MobileTable/hooks/useFilters/utils/getInitialColumnsFiltersOpenValue.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getInitialColumnsFiltersOpenValue = getInitialColumnsFiltersOpenValue;
+function getInitialColumnsFiltersOpenValue(columnFilters) {
+    if (!columnFilters) {
+        return false;
+    }
+    return 'initialOpen' in columnFilters && typeof columnFilters.initialOpen === 'boolean'
+        ? columnFilters.initialOpen
+        : true;
+}

package/dist/cjs/components/MobileTable/hooks/useFilters/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './getInitialColumnsFiltersOpenValue';

package/dist/cjs/components/MobileTable/hooks/useFilters/utils/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./getInitialColumnsFiltersOpenValue"), exports);

package/dist/cjs/components/{hooks.d.ts → MobileTable/hooks/useLoadingTable.d.ts}

@@ -1,13 +1,5 @@
 import { FiltersState } from '@cloud-ru/uikit-product-mobile-chips';
 import { TableProps } from '@snack-uikit/table';
-export declare function useStateControl<TState>(control: {
-    initialState?: TState;
-    state?: TState;
-    onChange?(state: TState): void;
-} | undefined, defaultState: TState): {
-    state: TState;
-    onStateChange: import("uncontrollable").Handler;
-};
 type UseLoadingTableProps<TData extends object, TFilters extends FiltersState> = {
     columnDefinitions: TableProps<TData, TFilters>['columnDefinitions'];
     pageSize: number;

package/dist/cjs/components/{hooks.js → MobileTable/hooks/useLoadingTable.js}

@@ -1,25 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStateControl = useStateControl;
 exports.useLoadingTable = useLoadingTable;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_table_1 = require("@tanstack/react-table");
 const react_1 = require("react");
-const uncontrollable_1 = require("uncontrollable");
 const skeleton_1 = require("@snack-uikit/skeleton");
-const constants_1 = require("../constants");
-function useStateControl(control, defaultState) {
-    var _a, _b;
-    const [state, onStateChange] = (0, uncontrollable_1.useUncontrolledProp)(control === null || control === void 0 ? void 0 : control.state, (_b = (_a = control === null || control === void 0 ? void 0 : control.state) !== null && _a !== void 0 ? _a : control === null || control === void 0 ? void 0 : control.initialState) !== null && _b !== void 0 ? _b : defaultState, (controlState) => {
-        var _a;
-        const newState = typeof controlState === 'function' ? controlState(state) : controlState;
-        (_a = control === null || control === void 0 ? void 0 : control.onChange) === null || _a === void 0 ? void 0 : _a.call(control, newState);
-    });
-    return {
-        state,
-        onStateChange,
-    };
-}
+const constants_1 = require("../../../constants");
 function useLoadingTable({ pageSize, columnDefinitions, }) {
     const data = (0, react_1.useMemo)(() => (Array.from({ length: pageSize }).map(() => ({})) || []), [pageSize]);
     const columns = (0, react_1.useMemo)(() => columnDefinitions

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

@@ -0,0 +1,3 @@
+export * from './MobileTable';
+export * from './types';
+export { formatTableStateToRequestPayload } from './utils/saveTableState/mappers';

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

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatTableStateToRequestPayload = void 0;
+__exportStar(require("./MobileTable"), exports);
+__exportStar(require("./types"), exports);
+var mappers_1 = require("./utils/saveTableState/mappers");
+Object.defineProperty(exports, "formatTableStateToRequestPayload", { enumerable: true, get: function () { return mappers_1.formatTableStateToRequestPayload; } });

package/dist/cjs/components/MobileTable/types.d.ts

@@ -0,0 +1,11 @@
+import { FiltersState, MobileChipChoiceRowProps } from '@cloud-ru/uikit-product-mobile-chips';
+import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
+import { TableProps } from '@snack-uikit/table';
+export type MobileTableProps<TData extends object, TFilters extends FiltersState = Record<string, unknown>> = Pick<TableProps<TData, TFilters>, 'data' | 'columnDefinitions' | 'suppressPagination' | 'suppressToolbar' | 'suppressSearch' | 'search' | 'onRefresh' | 'moreActions' | 'className' | 'enableFuzzySearch' | 'loading' | 'dataError' | 'dataFiltered' | 'noDataState' | 'noResultsState' | 'errorDataState' | 'sorting' | 'pagination' | 'pageCount' | 'manualFiltering' | 'manualPagination' | 'manualSorting' | 'getRowId' | 'rowSelection' | 'bulkActions' | 'columnsSettings' | 'savedState' | 'autoResetPageIndex' | 'toolbarAfter'> & WithSupportProps<{
+    headlineId?: string;
+    headerBackground?: 'default' | '1-level' | '2-level';
+    /** Фильтры */
+    columnFilters?: MobileChipChoiceRowProps<TFilters> & {
+        initialOpen?: boolean;
+    };
+}>;

package/dist/cjs/components/MobileTable/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/MobileTable/utils/fuzzyFilter.d.ts

@@ -0,0 +1,2 @@
+import { FilterFn } from '@tanstack/react-table';
+export declare const fuzzyFilter: FilterFn<any>;

package/dist/cjs/components/MobileTable/utils/fuzzyFilter.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fuzzyFilter = void 0;
+const match_sorter_utils_1 = require("@tanstack/match-sorter-utils");
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const fuzzyFilter = (row, columnId, value, addMeta) => {
+    const itemRank = (0, match_sorter_utils_1.rankItem)(row.getValue(columnId), value);
+    addMeta({
+        itemRank,
+    });
+    return itemRank.passed;
+};
+exports.fuzzyFilter = fuzzyFilter;

package/dist/cjs/components/MobileTable/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './fuzzyFilter';
+export * from './saveTableState';

package/dist/cjs/components/MobileTable/utils/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./fuzzyFilter"), exports);
+__exportStar(require("./saveTableState"), exports);

package/dist/cjs/components/MobileTable/utils/saveTableState/getPersistedStateValidator.d.ts

@@ -0,0 +1,4 @@
+import { FiltersState } from '@snack-uikit/chips';
+import { PersistedFilterState } from '@snack-uikit/toolbar';
+import { MobileTableProps } from '../../types';
+export declare const getPersistedStateValidator: <TData extends object, TFilters extends FiltersState = Record<string, unknown>>(columnFilters: MobileTableProps<TData, TFilters>["columnFilters"]) => (data: unknown) => data is PersistedFilterState<TFilters>;

package/dist/cjs/components/MobileTable/utils/saveTableState/getPersistedStateValidator.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPersistedStateValidator = void 0;
+const validators_1 = require("./validators");
+const getPersistedStateValidator = (columnFilters) => (data) => {
+    const dataAsSettings = data;
+    const isPaginationValid = (0, validators_1.validatePaging)(dataAsSettings === null || dataAsSettings === void 0 ? void 0 : dataAsSettings.pagination);
+    const isSortingValid = (0, validators_1.validateSorting)(dataAsSettings === null || dataAsSettings === void 0 ? void 0 : dataAsSettings.ordering);
+    const isSearchValid = !(dataAsSettings === null || dataAsSettings === void 0 ? void 0 : dataAsSettings.search) || typeof (dataAsSettings === null || dataAsSettings === void 0 ? void 0 : dataAsSettings.search) === 'string';
+    const isFilterValid = Boolean((columnFilters === null || columnFilters === void 0 ? void 0 : columnFilters.filters) && (0, validators_1.validateFilter)(dataAsSettings.filter, columnFilters.filters));
+    return isPaginationValid && isSortingValid && isSearchValid && isFilterValid;
+};
+exports.getPersistedStateValidator = getPersistedStateValidator;

package/dist/cjs/components/MobileTable/utils/saveTableState/index.d.ts

@@ -0,0 +1,3 @@
+export * from './validators';
+export * from './mappers';
+export * from './getPersistedStateValidator';

package/dist/cjs/components/MobileTable/utils/saveTableState/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./validators"), exports);
+__exportStar(require("./mappers"), exports);
+__exportStar(require("./getPersistedStateValidator"), exports);

package/dist/cjs/components/MobileTable/utils/saveTableState/mappers.d.ts

@@ -0,0 +1,18 @@
+import { RequestPayloadParams } from '@cloud-ru/ft-request-payload-transform';
+import { PaginationState, SortingState } from '@tanstack/react-table';
+import { FiltersState } from '@snack-uikit/chips';
+import { PersistedFilterState } from '@snack-uikit/toolbar';
+export declare const mapPaginationToTableState: (value?: RequestPayloadParams["pagination"]) => PaginationState;
+export declare const mapSortToTableState: (value?: RequestPayloadParams["ordering"]) => SortingState;
+export declare const mapPaginationToRequestPayload: (value?: PaginationState | RequestPayloadParams["pagination"]) => RequestPayloadParams["pagination"];
+export declare const mapSortToRequestPayload: (value?: SortingState) => RequestPayloadParams["ordering"];
+/** Вспомогательная функция для преобразования состояния таблицы к формату RequestPayloadParams */
+export declare const formatTableStateToRequestPayload: <T extends FiltersState>({ pagination, sorting, search, filter, }: Omit<PersistedFilterState<T>, "pagination" | "sorting"> & {
+    pagination?: PaginationState | RequestPayloadParams["pagination"];
+    sorting?: SortingState;
+}) => {
+    toObject(): Partial<RequestPayloadParams>;
+    toString(params?: {
+        encode?: boolean;
+    }): string;
+};