@cloud-ru/uikit-product-mobile-toolbar 0.4.3 → 0.4.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/cjs/components/AdaptiveToolbar/AdaptiveToolbar.d.ts +6 -0
  3. package/dist/cjs/components/AdaptiveToolbar/AdaptiveToolbar.js +22 -0
  4. package/dist/cjs/components/AdaptiveToolbar/index.d.ts +1 -0
  5. package/dist/cjs/components/AdaptiveToolbar/index.js +17 -0
  6. package/dist/cjs/components/MobileToolbar/MobileToolbar.d.ts +7 -0
  7. package/dist/cjs/components/MobileToolbar/MobileToolbar.js +51 -0
  8. package/dist/cjs/components/MobileToolbar/helpers.d.ts +4 -0
  9. package/dist/cjs/components/MobileToolbar/helpers.js +6 -0
  10. package/dist/cjs/components/MobileToolbar/hooks.d.ts +12 -0
  11. package/dist/cjs/components/MobileToolbar/hooks.js +30 -0
  12. package/dist/cjs/components/MobileToolbar/index.d.ts +1 -0
  13. package/dist/cjs/components/MobileToolbar/index.js +17 -0
  14. package/dist/cjs/components/MobileToolbar/styles.module.css +91 -0
  15. package/dist/cjs/components/MobileToolbar/types.d.ts +44 -0
  16. package/dist/cjs/components/MobileToolbar/types.js +2 -0
  17. package/dist/cjs/components/MobileToolbar/typesUtils.d.ts +12 -0
  18. package/dist/cjs/components/MobileToolbar/typesUtils.js +2 -0
  19. package/dist/cjs/components/index.d.ts +2 -0
  20. package/dist/cjs/components/index.js +18 -0
  21. package/dist/cjs/constants.d.ts +19 -0
  22. package/dist/cjs/constants.js +22 -0
  23. package/dist/cjs/helperComponents/BulkActions/BulkActions.d.ts +4 -0
  24. package/dist/cjs/helperComponents/BulkActions/BulkActions.js +38 -0
  25. package/dist/cjs/helperComponents/BulkActions/constants.d.ts +4 -0
  26. package/dist/cjs/helperComponents/BulkActions/constants.js +7 -0
  27. package/dist/cjs/helperComponents/BulkActions/index.d.ts +3 -0
  28. package/dist/cjs/helperComponents/BulkActions/index.js +19 -0
  29. package/dist/cjs/helperComponents/BulkActions/styles.module.css +60 -0
  30. package/dist/cjs/helperComponents/BulkActions/types.d.ts +28 -0
  31. package/dist/cjs/helperComponents/BulkActions/types.js +2 -0
  32. package/dist/cjs/helperComponents/BulkActionsCheckbox/BulkActionsCheckbox.d.ts +6 -0
  33. package/dist/cjs/helperComponents/BulkActionsCheckbox/BulkActionsCheckbox.js +19 -0
  34. package/dist/cjs/helperComponents/BulkActionsCheckbox/index.d.ts +1 -0
  35. package/dist/cjs/helperComponents/BulkActionsCheckbox/index.js +17 -0
  36. package/dist/cjs/helperComponents/BulkActionsCheckbox/styles.module.css +18 -0
  37. package/dist/cjs/helperComponents/FilterButton/FilterButton.d.ts +6 -0
  38. package/dist/cjs/helperComponents/FilterButton/FilterButton.js +13 -0
  39. package/dist/cjs/helperComponents/FilterButton/index.d.ts +1 -0
  40. package/dist/cjs/helperComponents/FilterButton/index.js +17 -0
  41. package/dist/cjs/helperComponents/MoreActions/MoreActions.d.ts +12 -0
  42. package/dist/cjs/helperComponents/MoreActions/MoreActions.js +34 -0
  43. package/dist/cjs/helperComponents/MoreActions/constants.d.ts +2 -0
  44. package/dist/cjs/helperComponents/MoreActions/constants.js +8 -0
  45. package/dist/cjs/helperComponents/MoreActions/index.d.ts +1 -0
  46. package/dist/cjs/helperComponents/MoreActions/index.js +17 -0
  47. package/dist/cjs/helperComponents/Separator/Separator.d.ts +1 -0
  48. package/dist/cjs/helperComponents/Separator/Separator.js +11 -0
  49. package/dist/cjs/helperComponents/Separator/index.d.ts +1 -0
  50. package/dist/cjs/helperComponents/Separator/index.js +17 -0
  51. package/dist/cjs/helperComponents/Separator/styles.module.css +12 -0
  52. package/dist/cjs/helperComponents/index.d.ts +5 -0
  53. package/dist/cjs/helperComponents/index.js +21 -0
  54. package/dist/cjs/index.d.ts +1 -0
  55. package/dist/cjs/index.js +17 -0
  56. package/dist/esm/components/AdaptiveToolbar/AdaptiveToolbar.d.ts +6 -0
  57. package/dist/esm/components/AdaptiveToolbar/AdaptiveToolbar.js +19 -0
  58. package/dist/esm/components/AdaptiveToolbar/index.d.ts +1 -0
  59. package/dist/esm/components/AdaptiveToolbar/index.js +1 -0
  60. package/dist/esm/components/MobileToolbar/MobileToolbar.d.ts +7 -0
  61. package/dist/esm/components/MobileToolbar/MobileToolbar.js +45 -0
  62. package/dist/esm/components/MobileToolbar/helpers.d.ts +4 -0
  63. package/dist/esm/components/MobileToolbar/helpers.js +3 -0
  64. package/dist/esm/components/MobileToolbar/hooks.d.ts +12 -0
  65. package/dist/esm/components/MobileToolbar/hooks.js +27 -0
  66. package/dist/esm/components/MobileToolbar/index.d.ts +1 -0
  67. package/dist/esm/components/MobileToolbar/index.js +1 -0
  68. package/dist/esm/components/MobileToolbar/styles.module.css +91 -0
  69. package/dist/esm/components/MobileToolbar/types.d.ts +44 -0
  70. package/dist/esm/components/MobileToolbar/types.js +1 -0
  71. package/dist/esm/components/MobileToolbar/typesUtils.d.ts +12 -0
  72. package/dist/esm/components/MobileToolbar/typesUtils.js +1 -0
  73. package/dist/esm/components/index.d.ts +2 -0
  74. package/dist/esm/components/index.js +2 -0
  75. package/dist/esm/constants.d.ts +19 -0
  76. package/dist/esm/constants.js +19 -0
  77. package/dist/esm/helperComponents/BulkActions/BulkActions.d.ts +4 -0
  78. package/dist/esm/helperComponents/BulkActions/BulkActions.js +32 -0
  79. package/dist/esm/helperComponents/BulkActions/constants.d.ts +4 -0
  80. package/dist/esm/helperComponents/BulkActions/constants.js +4 -0
  81. package/dist/esm/helperComponents/BulkActions/index.d.ts +3 -0
  82. package/dist/esm/helperComponents/BulkActions/index.js +3 -0
  83. package/dist/esm/helperComponents/BulkActions/styles.module.css +60 -0
  84. package/dist/esm/helperComponents/BulkActions/types.d.ts +28 -0
  85. package/dist/esm/helperComponents/BulkActions/types.js +1 -0
  86. package/dist/esm/helperComponents/BulkActionsCheckbox/BulkActionsCheckbox.d.ts +6 -0
  87. package/dist/esm/helperComponents/BulkActionsCheckbox/BulkActionsCheckbox.js +13 -0
  88. package/dist/esm/helperComponents/BulkActionsCheckbox/index.d.ts +1 -0
  89. package/dist/esm/helperComponents/BulkActionsCheckbox/index.js +1 -0
  90. package/dist/esm/helperComponents/BulkActionsCheckbox/styles.module.css +18 -0
  91. package/dist/esm/helperComponents/FilterButton/FilterButton.d.ts +6 -0
  92. package/dist/esm/helperComponents/FilterButton/FilterButton.js +10 -0
  93. package/dist/esm/helperComponents/FilterButton/index.d.ts +1 -0
  94. package/dist/esm/helperComponents/FilterButton/index.js +1 -0
  95. package/dist/esm/helperComponents/MoreActions/MoreActions.d.ts +12 -0
  96. package/dist/esm/helperComponents/MoreActions/MoreActions.js +31 -0
  97. package/dist/esm/helperComponents/MoreActions/constants.d.ts +2 -0
  98. package/dist/esm/helperComponents/MoreActions/constants.js +5 -0
  99. package/dist/esm/helperComponents/MoreActions/index.d.ts +1 -0
  100. package/dist/esm/helperComponents/MoreActions/index.js +1 -0
  101. package/dist/esm/helperComponents/Separator/Separator.d.ts +1 -0
  102. package/dist/esm/helperComponents/Separator/Separator.js +5 -0
  103. package/dist/esm/helperComponents/Separator/index.d.ts +1 -0
  104. package/dist/esm/helperComponents/Separator/index.js +1 -0
  105. package/dist/esm/helperComponents/Separator/styles.module.css +12 -0
  106. package/dist/esm/helperComponents/index.d.ts +5 -0
  107. package/dist/esm/helperComponents/index.js +5 -0
  108. package/dist/esm/index.d.ts +1 -0
  109. package/dist/esm/index.js +1 -0
  110. package/package.json +8 -7
package/CHANGELOG.md CHANGED
@@ -3,6 +3,30 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 0.4.5 (2025-11-13)
7
+
8
+ ### Only dependencies have been changed
9
+ * [@cloud-ru/uikit-product-icons@15.1.3](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/icons/CHANGELOG.md)
10
+ * [@cloud-ru/uikit-product-mobile-chips@0.8.38](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/mobile-chips/CHANGELOG.md)
11
+ * [@cloud-ru/uikit-product-mobile-dropdown@0.9.23](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/mobile-dropdown/CHANGELOG.md)
12
+ * [@cloud-ru/uikit-product-mobile-tooltip@0.4.67](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/mobile-tooltip/CHANGELOG.md)
13
+ * [@cloud-ru/uikit-product-utils@7.0.2](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/utils/CHANGELOG.md)
14
+
15
+
16
+
17
+
18
+
19
+ ## 0.4.4 (2025-11-12)
20
+
21
+
22
+ ### Bug Fixes
23
+
24
+ * **PD-3377:** contributors update to publish all packages ([719fd3e](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/719fd3e1249e247443b125c47ea408d92c8395c3))
25
+
26
+
27
+
28
+
29
+
6
30
  ## 0.4.3 (2025-11-12)
7
31
 
8
32
  ### Only dependencies have been changed
@@ -0,0 +1,6 @@
1
+ import { FiltersState } from '@sbercloud/uikit-product-mobile-chips';
2
+ import { WithLayoutType } from '@sbercloud/uikit-product-utils';
3
+ import { ToolbarProps } from '@snack-uikit/toolbar';
4
+ export type AdaptiveToolbarProps<TState extends FiltersState = Record<string, unknown>> = WithLayoutType<ToolbarProps<TState>>;
5
+ export declare function AdaptiveToolbar<TState extends FiltersState = Record<string, unknown>>({ layoutType, ...props }: AdaptiveToolbarProps<TState>): import("react/jsx-runtime").JSX.Element;
6
+ export type { ToolbarProps };
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ var __rest = (this && this.__rest) || function (s, e) {
3
+ var t = {};
4
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
+ t[p] = s[p];
6
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
+ t[p[i]] = s[p[i]];
10
+ }
11
+ return t;
12
+ };
13
+ Object.defineProperty(exports, "__esModule", { value: true });
14
+ exports.AdaptiveToolbar = AdaptiveToolbar;
15
+ const jsx_runtime_1 = require("react/jsx-runtime");
16
+ const toolbar_1 = require("@snack-uikit/toolbar");
17
+ const MobileToolbar_1 = require("../MobileToolbar");
18
+ function AdaptiveToolbar(_a) {
19
+ var { layoutType } = _a, props = __rest(_a, ["layoutType"]);
20
+ const isMobile = layoutType === 'mobile';
21
+ return isMobile ? (0, jsx_runtime_1.jsx)(MobileToolbar_1.MobileToolbar, Object.assign({}, props)) : (0, jsx_runtime_1.jsx)(toolbar_1.Toolbar, Object.assign({}, props));
22
+ }
@@ -0,0 +1 @@
1
+ export * from './AdaptiveToolbar';
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./AdaptiveToolbar"), exports);
@@ -0,0 +1,7 @@
1
+ import { FiltersState } from '@sbercloud/uikit-product-mobile-chips';
2
+ import { WithSupportProps } from '@snack-uikit/utils';
3
+ import { CheckedToolbarProps, DefaultToolbarProps, FilterRow } from './types';
4
+ export type MobileToolbarProps<TState extends FiltersState = Record<string, unknown>> = WithSupportProps<DefaultToolbarProps | CheckedToolbarProps> & {
5
+ filterRow?: FilterRow<TState>;
6
+ };
7
+ export declare function MobileToolbar<TState extends FiltersState = Record<string, unknown>>({ className, after, outline, moreActions, onRefresh, search, filterRow: filterRowProps, ...rest }: MobileToolbarProps<TState>): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,51 @@
1
+ "use strict";
2
+ var __rest = (this && this.__rest) || function (s, e) {
3
+ var t = {};
4
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
+ t[p] = s[p];
6
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
+ t[p[i]] = s[p[i]];
10
+ }
11
+ return t;
12
+ };
13
+ var __importDefault = (this && this.__importDefault) || function (mod) {
14
+ return (mod && mod.__esModule) ? mod : { "default": mod };
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ exports.MobileToolbar = MobileToolbar;
18
+ const jsx_runtime_1 = require("react/jsx-runtime");
19
+ const classnames_1 = __importDefault(require("classnames"));
20
+ const react_1 = require("react");
21
+ const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
22
+ const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
23
+ const uikit_product_mobile_chips_1 = require("@sbercloud/uikit-product-mobile-chips");
24
+ const button_1 = require("@snack-uikit/button");
25
+ const search_private_1 = require("@snack-uikit/search-private");
26
+ const utils_1 = require("@snack-uikit/utils");
27
+ const constants_1 = require("../../constants");
28
+ const helperComponents_1 = require("../../helperComponents");
29
+ const BulkActionsCheckbox_1 = require("../../helperComponents/BulkActionsCheckbox");
30
+ const helpers_1 = require("./helpers");
31
+ const hooks_1 = require("./hooks");
32
+ const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
33
+ function MobileToolbar(_a) {
34
+ var _b, _c;
35
+ var { className, after, outline, moreActions, onRefresh, search, filterRow: filterRowProps } = _a, rest = __rest(_a, ["className", "after", "outline", "moreActions", "onRefresh", "search", "filterRow"]);
36
+ const needsBulkActions = (0, helpers_1.isBulkActionsProps)(rest);
37
+ const hasVisibleRefresh = onRefresh && !(moreActions === null || moreActions === void 0 ? void 0 : moreActions.length);
38
+ const hasLeftSideElements = Boolean(needsBulkActions || hasVisibleRefresh);
39
+ const resizingContainerRef = (0, react_1.useRef)(null);
40
+ const { t } = (0, uikit_product_locale_1.useLocale)('MobileToolbar');
41
+ const moreActionsProps = (0, react_1.useMemo)(() => onRefresh
42
+ ? {
43
+ pinTop: [{ content: { option: t('refresh') }, icon: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.UpdateSVG, {}), onClick: onRefresh }],
44
+ items: moreActions,
45
+ }
46
+ : { items: moreActions }, [moreActions, onRefresh, t]);
47
+ const hasMoreActions = Boolean((_b = moreActionsProps.items) === null || _b === void 0 ? void 0 : _b.length);
48
+ const { filterButton, filterRow } = (0, hooks_1.useFilters)({ filterRow: filterRowProps });
49
+ const hasBulkActionsOpened = Boolean((rest.checked || rest.indeterminate) && rest.selectionMode === 'multiple' && ((_c = rest.bulkActions) === null || _c === void 0 ? void 0 : _c.length));
50
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: styles_module_scss_1.default.containerWrapper }, (0, utils_1.extractSupportProps)(rest), { children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.panel, "data-bulk-actions-opened": hasBulkActionsOpened !== null && hasBulkActionsOpened !== void 0 ? hasBulkActionsOpened : undefined, "data-outline": outline || undefined, children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.topRow, className), ref: resizingContainerRef, children: [hasLeftSideElements && ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.beforeSearch, children: [needsBulkActions && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(BulkActionsCheckbox_1.BulkActionsCheckbox, { onCheck: rest.onCheck, checked: rest.checked, indeterminate: rest.indeterminate }), (0, jsx_runtime_1.jsx)(helperComponents_1.Separator, {})] })), hasVisibleRefresh && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.ButtonFunction, { icon: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.UpdateSVG, {}), size: 'm', className: styles_module_scss_1.default.updateButton, onClick: onRefresh, "data-test-id": constants_1.TEST_IDS.refreshButton }), (0, jsx_runtime_1.jsx)(helperComponents_1.Separator, {})] }))] })), search && (0, jsx_runtime_1.jsx)(search_private_1.SearchPrivate, Object.assign({}, search, { className: styles_module_scss_1.default.search, size: 'm', "data-test-id": constants_1.TEST_IDS.search })), (hasMoreActions || after || filterButton) && ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.flexRow, "data-align-right": (!search && !hasLeftSideElements) || undefined, children: [after && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(search || hasLeftSideElements) && (0, jsx_runtime_1.jsx)(helperComponents_1.Separator, {}), (0, jsx_runtime_1.jsx)("div", { "data-test-id": constants_1.TEST_IDS.after, className: styles_module_scss_1.default.actions, children: after })] })), (hasMoreActions || filterButton) && (0, jsx_runtime_1.jsx)(helperComponents_1.Separator, {}), filterButton && (0, jsx_runtime_1.jsx)(helperComponents_1.FilterButton, Object.assign({}, filterButton)), hasMoreActions && (0, jsx_runtime_1.jsx)(helperComponents_1.MoreActions, Object.assign({}, moreActionsProps))] }))] }), hasBulkActionsOpened && ((0, jsx_runtime_1.jsx)(helperComponents_1.BulkActions, { actions: rest.bulkActions, onCheck: rest.onCheck, checked: rest.checked, indeterminate: rest.indeterminate, selectionMode: rest.selectionMode, selectedCount: rest.selectedCount, outline: outline }))] }), filterRow && (0, jsx_runtime_1.jsx)(uikit_product_mobile_chips_1.MobileChipChoiceRow, Object.assign({}, filterRow, { size: 's', "data-test-id": constants_1.TEST_IDS.filterRow }))] })));
51
+ }
@@ -0,0 +1,4 @@
1
+ import { FiltersState } from '@sbercloud/uikit-product-mobile-chips';
2
+ import { MobileToolbarProps } from './MobileToolbar';
3
+ import { ToolbarBulkActionProps } from './types';
4
+ export declare function isBulkActionsProps<TState extends FiltersState>(props: Partial<MobileToolbarProps<TState>>): props is ToolbarBulkActionProps;
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.isBulkActionsProps = isBulkActionsProps;
4
+ function isBulkActionsProps(props) {
5
+ return 'selectionMode' in props && props.selectionMode === 'multiple';
6
+ }
@@ -0,0 +1,12 @@
1
+ import { FiltersState } from '@sbercloud/uikit-product-mobile-chips';
2
+ import { FilterButtonProps } from '../../helperComponents';
3
+ import { FilterRow } from './types';
4
+ type UseFiltersProps<TState extends FiltersState> = {
5
+ filterRow?: FilterRow<TState>;
6
+ };
7
+ type UseFiltersReturnType<TState extends FiltersState> = {
8
+ filterButton?: FilterButtonProps;
9
+ filterRow?: FilterRow<TState>;
10
+ };
11
+ export declare function useFilters<TState extends FiltersState>({ filterRow, }: UseFiltersProps<TState>): UseFiltersReturnType<TState>;
12
+ export {};
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useFilters = useFilters;
4
+ const react_1 = require("react");
5
+ const uncontrollable_1 = require("uncontrollable");
6
+ const uikit_product_mobile_chips_1 = require("@sbercloud/uikit-product-mobile-chips");
7
+ function useFilters({ filterRow, }) {
8
+ var _a;
9
+ const [filtersOpen, setFiltersOpen] = (0, uncontrollable_1.useUncontrolledProp)(filterRow === null || filterRow === void 0 ? void 0 : filterRow.open, (filterRow === null || filterRow === void 0 ? void 0 : filterRow.initialOpen) || false, newValue => {
10
+ var _a;
11
+ const result = typeof newValue === 'function' ? newValue(filtersOpen) : newValue;
12
+ (_a = filterRow === null || filterRow === void 0 ? void 0 : filterRow.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(filterRow, result);
13
+ });
14
+ const [value, setValue] = (0, uncontrollable_1.useUncontrolledProp)(filterRow === null || filterRow === void 0 ? void 0 : filterRow.value, ((_a = filterRow === null || filterRow === void 0 ? void 0 : filterRow.defaultValue) !== null && _a !== void 0 ? _a : {}), newValue => {
15
+ var _a;
16
+ const result = typeof newValue === 'function' ? newValue(value) : newValue;
17
+ (_a = filterRow === null || filterRow === void 0 ? void 0 : filterRow.onChange) === null || _a === void 0 ? void 0 : _a.call(filterRow, result);
18
+ });
19
+ const [visibleFilters, setVisibleFilters] = (0, uncontrollable_1.useUncontrolledProp)(filterRow === null || filterRow === void 0 ? void 0 : filterRow.visibleFilters, Object.keys(value), newState => {
20
+ var _a;
21
+ const result = typeof newState === 'function' ? newState(visibleFilters) : newState;
22
+ (_a = filterRow === null || filterRow === void 0 ? void 0 : filterRow.onVisibleFiltersChange) === null || _a === void 0 ? void 0 : _a.call(filterRow, result);
23
+ });
24
+ const numberOfFilters = (0, react_1.useMemo)(() => Object.keys(value).reduce((result, filterKey) => result + Number((0, uikit_product_mobile_chips_1.hasFilterBeenApplied)(value[filterKey])), 0), [value]);
25
+ return {
26
+ filterButton: filterRow ? { open: filtersOpen, onOpenChange: setFiltersOpen, numberOfFilters } : undefined,
27
+ filterRow: filtersOpen && filterRow
28
+ ? Object.assign(Object.assign({}, filterRow), { open: undefined, onOpenChange: undefined, value, onChange: setValue, visibleFilters, onVisibleFiltersChange: setVisibleFilters }) : undefined,
29
+ };
30
+ }
@@ -0,0 +1 @@
1
+ export * from './MobileToolbar';
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./MobileToolbar"), exports);
@@ -0,0 +1,91 @@
1
+ .toolbar{
2
+ box-sizing:border-box;
3
+ }
4
+
5
+ .containerWrapper{
6
+ gap:var(--space-toolbar-container-wrapper-gap, 8px);
7
+ display:flex;
8
+ flex-direction:column;
9
+ }
10
+
11
+ .panel{
12
+ border-radius:var(--radius-toolbar-container, 4px);
13
+ position:relative;
14
+ background-color:var(--sys-neutral-background1-level, #fdfdfd);
15
+ }
16
+ .panel[data-outline]::before{
17
+ border-radius:var(--radius-toolbar-container, 4px);
18
+ border-width:var(--border-width-toolbar-outline, 1px);
19
+ pointer-events:none;
20
+ content:"";
21
+ position:absolute;
22
+ top:0;
23
+ left:0;
24
+ box-sizing:border-box;
25
+ width:100%;
26
+ height:100%;
27
+ border-color:var(--sys-neutral-decor-default, #dde0ea);
28
+ border-style:solid;
29
+ }
30
+
31
+ .topRow{
32
+ position:relative;
33
+ display:flex;
34
+ justify-content:space-between;
35
+ box-sizing:border-box;
36
+ }
37
+ [data-bulk-actions-opened=true] .topRow{
38
+ border-bottom:1px solid var(--sys-neutral-decor-default, #dde0ea);
39
+ }
40
+
41
+ .search{
42
+ height:var(--size-toolbar-checkbox, 40px);
43
+ padding-left:var(--space-toolbar-search-horizontal-padding, 8px);
44
+ padding-right:var(--space-toolbar-search-horizontal-padding, 8px);
45
+ border-radius:var(--radius-toolbar-search, 4px);
46
+ min-width:var(--size-toolbar-search-min-width, 80px);
47
+ flex-shrink:1;
48
+ flex-grow:1;
49
+ overflow:hidden;
50
+ min-width:0;
51
+ }
52
+ .search:focus-within{
53
+ outline-width:var(--border-state-focus-s-border-width, 2px);
54
+ outline-style:var(--border-state-focus-s-border-style, solid);
55
+ outline-color:var(--border-state-focus-s-border-color, );
56
+ position:relative;
57
+ outline-color:var(--sys-available-complementary, #1c1c24);
58
+ }
59
+
60
+ .updateButton{
61
+ flex-shrink:0;
62
+ }
63
+ .updateButton svg{
64
+ transform:rotate(360deg);
65
+ transition:transform 0.5s;
66
+ }
67
+ .updateButton:active svg{
68
+ transform:rotate(0deg);
69
+ transition-duration:0s;
70
+ }
71
+
72
+ .beforeSearch{
73
+ display:flex;
74
+ flex-shrink:0;
75
+ box-sizing:border-box;
76
+ min-width:0;
77
+ }
78
+
79
+ .flexRow{
80
+ display:flex;
81
+ flex-shrink:0;
82
+ box-sizing:border-box;
83
+ }
84
+ .flexRow[data-align-right]{
85
+ margin-left:auto;
86
+ }
87
+
88
+ .actions{
89
+ flex-shrink:0;
90
+ box-sizing:border-box;
91
+ }
@@ -0,0 +1,44 @@
1
+ import { ReactNode } from 'react';
2
+ import { FiltersState, MobileChipChoiceRowProps } from '@sbercloud/uikit-product-mobile-chips';
3
+ import { BulkActionsProps, MoreActionsProps } from '../../helperComponents';
4
+ import { NeverOrUndefined, RequireAtLeastOne } from './typesUtils';
5
+ type OptionalProps = {
6
+ /** Колбек обновления */
7
+ onRefresh?(): void;
8
+ /** Дополнительный слот в конце тулбара */
9
+ after?: ReactNode;
10
+ /** Элементы выпадающего списка кнопки с действиями */
11
+ moreActions?: MoreActionsProps['items'];
12
+ };
13
+ export type CommonToolbarProps = {
14
+ /** Параметры отвечают за строку поиска <br>
15
+ * <strong>value</strong>: Значение строки поиска <br>
16
+ * <strong>onChange</strong>: Колбэк смены значения <br>
17
+ * <strong>onSubmit</strong>: Колбэк на подтверждение поиска по строке
18
+ * <strong>placeholder</strong>: Плейсхолдер <br>
19
+ * <strong>loading</strong>: Состояние загрузки <br>
20
+ * */
21
+ search?: {
22
+ value: string;
23
+ onChange(value: string): void;
24
+ onSubmit?(value: string): void;
25
+ placeholder?: string;
26
+ loading?: boolean;
27
+ };
28
+ /** Класснейм */
29
+ className?: string;
30
+ /** Внешний бордер */
31
+ outline?: boolean;
32
+ };
33
+ export type ToolbarBulkActionProps = Omit<BulkActionsProps, 'actions'> & {
34
+ /** Список массовых действий */
35
+ bulkActions?: BulkActionsProps['actions'];
36
+ };
37
+ export type CheckedToolbarProps = CommonToolbarProps & ToolbarBulkActionProps & OptionalProps;
38
+ export type DefaultToolbarProps = CommonToolbarProps & NeverOrUndefined<ToolbarBulkActionProps> & RequireAtLeastOne<OptionalProps>;
39
+ export type FilterRow<TState extends FiltersState> = Omit<MobileChipChoiceRowProps<TState>, 'size' | 'data-test-id'> & {
40
+ open?: boolean;
41
+ initialOpen?: boolean;
42
+ onOpenChange?(isOpen: boolean): void;
43
+ };
44
+ export {};
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,12 @@
1
+ export type IsEqual<A, B> = (<G>() => G extends A ? 1 : 2) extends <G>() => G extends B ? 1 : 2 ? true : false;
2
+ type Filter<KeyType, ExcludeType> = IsEqual<KeyType, ExcludeType> extends true ? never : KeyType extends ExcludeType ? never : KeyType;
3
+ type Except<ObjectType, KeysType extends keyof ObjectType> = {
4
+ [KeyType in keyof ObjectType as Filter<KeyType, KeysType>]: ObjectType[KeyType];
5
+ };
6
+ export type RequireAtLeastOne<ObjectType, KeysType extends keyof ObjectType = keyof ObjectType> = {
7
+ [Key in KeysType]-?: Required<Pick<ObjectType, Key>> & Partial<Pick<ObjectType, Exclude<KeysType, Key>>>;
8
+ }[KeysType] & Except<ObjectType, KeysType>;
9
+ export type NeverOrUndefined<T> = {
10
+ [P in keyof T]?: never;
11
+ };
12
+ export {};
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,2 @@
1
+ export * from './AdaptiveToolbar';
2
+ export * from './MobileToolbar';
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./AdaptiveToolbar"), exports);
18
+ __exportStar(require("./MobileToolbar"), exports);
@@ -0,0 +1,19 @@
1
+ export declare const TEST_IDS: {
2
+ main: string;
3
+ checkbox: string;
4
+ confirmAction: string;
5
+ rejectAction: string;
6
+ deleteAction: string;
7
+ deactivateAction: string;
8
+ disabledAction: string;
9
+ bulkActions: string;
10
+ moreBulkActionsButton: string;
11
+ refreshButton: string;
12
+ search: string;
13
+ filterButton: string;
14
+ filterRow: string;
15
+ moreActionsButton: string;
16
+ droplist: string;
17
+ option: string;
18
+ after: string;
19
+ };
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.TEST_IDS = void 0;
4
+ exports.TEST_IDS = {
5
+ main: 'toolbar',
6
+ checkbox: 'toolbar__checkbox',
7
+ confirmAction: 'toolbar__confirm-action',
8
+ rejectAction: 'toolbar__reject-action',
9
+ deleteAction: 'toolbar__delete-action',
10
+ deactivateAction: 'toolbar__deactivate-action',
11
+ disabledAction: 'toolbar__disabled-action',
12
+ bulkActions: 'toolbar__bulk-actions',
13
+ moreBulkActionsButton: 'toolbar__more-bulk-actions-button',
14
+ refreshButton: 'toolbar__refresh-button',
15
+ search: 'toolbar__search',
16
+ filterButton: 'toolbar__filter-button',
17
+ filterRow: 'toolbar__filter-row',
18
+ moreActionsButton: 'toolbar__more-actions-button',
19
+ droplist: 'toolbar__droplist',
20
+ option: 'toolbar__droplist-option',
21
+ after: 'toolbar__after',
22
+ };
@@ -0,0 +1,4 @@
1
+ import { BulkActionsProps } from './types';
2
+ export declare function BulkActions({ actions, selectedCount, outline }: BulkActionsProps & {
3
+ outline?: boolean;
4
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,38 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.BulkActions = BulkActions;
7
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
+ const react_1 = require("react");
9
+ const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
10
+ const uikit_product_mobile_dropdown_1 = require("@sbercloud/uikit-product-mobile-dropdown");
11
+ const uikit_product_mobile_tooltip_1 = require("@sbercloud/uikit-product-mobile-tooltip");
12
+ const button_1 = require("@snack-uikit/button");
13
+ const counter_1 = require("@snack-uikit/counter");
14
+ const utils_1 = require("@snack-uikit/utils");
15
+ const constants_1 = require("../../constants");
16
+ const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
17
+ function BulkActions({ actions = [], selectedCount, outline }) {
18
+ const [isOpen, setIsOpen] = (0, react_1.useState)(false);
19
+ const parentContainerRef = (0, react_1.useRef)(null);
20
+ const { t } = (0, uikit_product_locale_1.useLocale)('MobileToolbar');
21
+ const { visibleItems, hiddenItems } = (0, utils_1.useDynamicList)({
22
+ items: actions,
23
+ parentContainerRef,
24
+ maxVisibleItems: 3,
25
+ });
26
+ return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.bulkActionsContainer, "data-outline": outline, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.counter, children: selectedCount && (0, jsx_runtime_1.jsx)(counter_1.Counter, { value: selectedCount, appearance: 'primary', color: 'decor' }) }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.bulkActionsWrapper, "data-test-id": constants_1.TEST_IDS.bulkActions, ref: parentContainerRef, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.smallSeparator }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.bulkActions, children: visibleItems.map(({ label, icon: Icon, onClick, disabled, tooltip, 'data-test-id': testId }) => ((0, jsx_runtime_1.jsx)(uikit_product_mobile_tooltip_1.MobileTooltip, { tip: tooltip, open: tooltip ? undefined : false, placement: 'top', "data-test-id": `${testId}-tooltip`, children: (0, jsx_runtime_1.jsx)(button_1.ButtonFunction, { className: styles_module_scss_1.default.action, "data-test-id": testId, iconPosition: 'before', icon: (0, jsx_runtime_1.jsx)(Icon, {}), label: label, size: 'm', onClick: onClick, disabled: disabled }) }, label))) }), hiddenItems.length > 0 && ((0, jsx_runtime_1.jsx)(uikit_product_mobile_dropdown_1.MobileDroplist, { open: isOpen, onOpenChange: setIsOpen, items: hiddenItems.map(({ label, icon: Icon, onClick, disabled, tooltip, 'data-test-id': testId }) => ({
27
+ id: label,
28
+ content: { option: label },
29
+ beforeContent: (0, jsx_runtime_1.jsx)(Icon, {}),
30
+ onClick: () => {
31
+ onClick === null || onClick === void 0 ? void 0 : onClick();
32
+ setIsOpen(false);
33
+ },
34
+ disabled,
35
+ itemWrapRender: item => ((0, jsx_runtime_1.jsx)(uikit_product_mobile_tooltip_1.MobileTooltip, { tip: tooltip, open: tooltip ? undefined : false, placement: 'right', "data-test-id": `${testId}-tooltip`, children: item })),
36
+ 'data-test-id': testId,
37
+ })), children: (0, jsx_runtime_1.jsx)(button_1.ButtonFunction, { className: styles_module_scss_1.default.moreActionButton, size: 'm', appearance: 'primary', label: t('more'), "data-test-id": constants_1.TEST_IDS.moreBulkActionsButton }) }))] })] }));
38
+ }
@@ -0,0 +1,4 @@
1
+ export declare const SELECTION_MODE: {
2
+ readonly Single: "single";
3
+ readonly Multiple: "multiple";
4
+ };
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SELECTION_MODE = void 0;
4
+ exports.SELECTION_MODE = {
5
+ Single: 'single',
6
+ Multiple: 'multiple',
7
+ };
@@ -0,0 +1,3 @@
1
+ export * from './BulkActions';
2
+ export * from './constants';
3
+ export * from './types';
@@ -0,0 +1,19 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./BulkActions"), exports);
18
+ __exportStar(require("./constants"), exports);
19
+ __exportStar(require("./types"), exports);
@@ -0,0 +1,60 @@
1
+ .bulkActionsContainer{
2
+ position:relative;
3
+ display:flex;
4
+ flex-direction:row;
5
+ align-items:center;
6
+ }
7
+
8
+ .counter{
9
+ display:flex;
10
+ align-items:center;
11
+ justify-content:center;
12
+ flex-shrink:0;
13
+ flex-grow:0;
14
+ width:40px;
15
+ height:40px;
16
+ }
17
+
18
+ .bulkActionsWrapper{
19
+ padding-right:var(--space-toolbar-bulk-action-padding-right, 12px);
20
+ width:100%;
21
+ scrollbar-width:none;
22
+ display:flex;
23
+ flex-grow:1;
24
+ flex-shrink:1;
25
+ justify-content:start;
26
+ align-items:center;
27
+ min-width:0;
28
+ -ms-overflow-style:none;
29
+ }
30
+ .bulkActionsWrapper::-webkit-scrollbar{
31
+ display:none;
32
+ }
33
+
34
+ .bulkActions{
35
+ gap:var(--space-toolbar-bulk-action-gap, 8px);
36
+ display:flex;
37
+ flex-grow:1;
38
+ flex-shrink:1;
39
+ padding-left:8px;
40
+ }
41
+
42
+ .moreActionButton{
43
+ flex-shrink:0;
44
+ padding-left:4px;
45
+ }
46
+
47
+ .action{
48
+ white-space:nowrap;
49
+ }
50
+ .action[data-full-width]:not([data-variant=icon-only]){
51
+ flex-shrink:0;
52
+ width:auto;
53
+ }
54
+
55
+ .smallSeparator{
56
+ box-sizing:border-box;
57
+ width:var(--border-width-toolbar-separator, 1px);
58
+ height:16px;
59
+ background-color:var(--sys-neutral-decor-default, #dde0ea);
60
+ }
@@ -0,0 +1,28 @@
1
+ import { JSXElementConstructor } from 'react';
2
+ import { MobileTooltipProps } from '@sbercloud/uikit-product-mobile-tooltip';
3
+ import { ValueOf, WithSupportProps } from '@snack-uikit/utils';
4
+ import { SELECTION_MODE } from './constants';
5
+ export type SelectionMode = ValueOf<typeof SELECTION_MODE>;
6
+ export type BulkAction = WithSupportProps<{
7
+ label: string;
8
+ icon: JSXElementConstructor<{
9
+ className?: string;
10
+ }>;
11
+ disabled?: boolean;
12
+ tooltip?: MobileTooltipProps['tip'];
13
+ onClick?(): void;
14
+ }>;
15
+ export type BulkActionsProps = {
16
+ /** Список массовых действий */
17
+ actions?: BulkAction[];
18
+ /** Колбек смены значения чекбокса */
19
+ onCheck?(): void;
20
+ /** Значение чекбокса */
21
+ checked?: boolean;
22
+ /** Состояние частичного выбора */
23
+ indeterminate?: boolean;
24
+ /** Режим выбора @default 'multiple'*/
25
+ selectionMode?: SelectionMode;
26
+ /** Количество выбранных элементов */
27
+ selectedCount?: number;
28
+ };
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,6 @@
1
+ export type BulkActionsCheckboxProps = {
2
+ onCheck?: () => void;
3
+ checked?: boolean;
4
+ indeterminate?: boolean;
5
+ };
6
+ export declare function BulkActionsCheckbox({ onCheck, checked, indeterminate }: BulkActionsCheckboxProps): import("react/jsx-runtime").JSX.Element;