@drivenets/design-system 0.12.0 → 0.13.0
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.
- package/CHANGELOG.md +21 -0
- package/dist/index.cjs +1652 -455
- package/dist/index.d.cts +1226 -989
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.ts +1226 -989
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1643 -456
- package/dist/index.js.map +1 -1
- package/dist/index.min.css +1 -1
- package/package.json +31 -31
- package/src/components/ds-catalog-layout/catalog-layout-empty-illustration.tsx +57 -0
- package/src/components/ds-catalog-layout/ds-catalog-layout.context.ts +19 -0
- package/src/components/ds-catalog-layout/ds-catalog-layout.module.scss +167 -0
- package/src/components/ds-catalog-layout/ds-catalog-layout.tsx +130 -0
- package/src/components/ds-catalog-layout/ds-catalog-layout.types.ts +62 -0
- package/src/components/ds-catalog-layout/index.ts +9 -0
- package/src/components/ds-date-input/ds-date-input.utils.ts +2 -2
- package/src/components/ds-drawer/ds-drawer.tsx +2 -0
- package/src/components/ds-form-control/ds-form-control.tsx +14 -11
- package/src/components/ds-form-control/ds-form-control.types.ts +4 -0
- package/src/components/ds-grid/ds-grid.tsx +1 -2
- package/src/components/ds-modal/ds-modal.tsx +3 -0
- package/src/components/ds-smart-tabs/ds-smart-tabs.module.scss +1 -0
- package/src/components/ds-table/components/ds-table-body-virtualized/ds-table-body-virtualized.module.scss +21 -2
- package/src/components/ds-table/components/ds-table-body-virtualized/ds-table-body-virtualized.tsx +14 -11
- package/src/components/ds-table/components/ds-table-body-virtualized/ds-table-body-virtualized.types.ts +1 -6
- package/src/components/ds-table/components/ds-table-bulk-actions/ds-table-bulk-actions.module.scss +2 -2
- package/src/components/ds-table/components/ds-table-cell/ds-table-cell.module.scss +2 -0
- package/src/components/ds-table/components/ds-table-cell/ds-table-cell.tsx +42 -11
- package/src/components/ds-table/components/ds-table-header/ds-table-header.module.scss +24 -4
- package/src/components/ds-table/components/ds-table-header/ds-table-header.tsx +22 -1
- package/src/components/ds-table/components/ds-table-row/ds-table-row.module.scss +22 -0
- package/src/components/ds-table/components/ds-table-row/ds-table-row.tsx +1 -0
- package/src/components/ds-table/components/ds-table-row-virtualized/ds-table-row-virtualized.module.scss +19 -0
- package/src/components/ds-table/components/ds-table-row-virtualized/ds-table-row-virtualized.tsx +2 -1
- package/src/components/ds-table/components/ds-table-row-virtualized/ds-table-row-virtualized.types.ts +1 -1
- package/src/components/ds-table/components/edit/cell-editors/cell-editors.module.scss +3 -0
- package/src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-checkbox.tsx +27 -0
- package/src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-date.tsx +50 -0
- package/src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-number.tsx +51 -0
- package/src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-select.tsx +36 -0
- package/src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-text.tsx +50 -0
- package/src/components/ds-table/components/edit/cell-editors/index.ts +14 -0
- package/src/components/ds-table/components/edit/cell-editors/table-edit-form-control.tsx +31 -0
- package/src/components/ds-table/components/edit/ds-table-editable-cell/ds-table-editable-cell.module.scss +28 -0
- package/src/components/ds-table/components/edit/ds-table-editable-cell/ds-table-editable-cell.tsx +39 -0
- package/src/components/ds-table/components/edit/ds-table-editable-cell/ds-table-editable-cell.types.ts +7 -0
- package/src/components/ds-table/components/edit/ds-table-editable-cell/index.ts +2 -0
- package/src/components/ds-table/components/edit/ds-table-editing-cell/ds-table-editing-cell.module.scss +48 -0
- package/src/components/ds-table/components/edit/ds-table-editing-cell/ds-table-editing-cell.tsx +76 -0
- package/src/components/ds-table/components/edit/ds-table-editing-cell/ds-table-editing-cell.types.ts +5 -0
- package/src/components/ds-table/components/edit/ds-table-editing-cell/index.ts +2 -0
- package/src/components/ds-table/context/ds-table-context.ts +79 -1
- package/src/components/ds-table/ds-table-column.types.ts +12 -0
- package/src/components/ds-table/ds-table.module.scss +100 -10
- package/src/components/ds-table/ds-table.tsx +18 -19
- package/src/components/ds-table/ds-table.types.ts +52 -0
- package/src/components/ds-table/filters/adapters/create-checkbox-filter-adapter.tsx +24 -40
- package/src/components/ds-table/filters/adapters/create-dual-range-filter-adapter.tsx +10 -31
- package/src/components/ds-table/filters/adapters/create-filter-adapter.ts +6 -98
- package/src/components/ds-table/filters/components/checkbox-filter/checkbox-filter.module.scss +36 -0
- package/src/components/ds-table/filters/components/checkbox-filter/checkbox-filter.tsx +92 -13
- package/src/components/ds-table/filters/components/checkbox-filter/index.ts +1 -1
- package/src/components/ds-table/filters/components/column-filter-popover/column-filter-popover.module.scss +42 -0
- package/src/components/ds-table/filters/components/column-filter-popover/column-filter-popover.tsx +89 -0
- package/src/components/ds-table/filters/components/column-filter-popover/column-filter-popover.types.ts +25 -0
- package/src/components/ds-table/filters/components/column-filter-popover/index.ts +5 -0
- package/src/components/ds-table/filters/hooks/use-table-filters.ts +113 -78
- package/src/components/ds-table/filters/index.ts +2 -44
- package/src/components/ds-table/filters/types/column-meta.augmentation.ts +19 -0
- package/src/components/ds-table/filters/types/filter-adapter.types.ts +48 -81
- package/src/components/ds-table/hooks/use-cell-editor.ts +81 -0
- package/src/components/ds-table/index.ts +29 -0
- package/src/components/ds-table/utils/column-size.ts +9 -8
- package/src/components/ds-tag/ds-tag.tsx +2 -2
- package/src/components/ds-workspace-layout/ds-workspace-layout.context.ts +19 -0
- package/src/components/ds-workspace-layout/ds-workspace-layout.module.scss +166 -0
- package/src/components/ds-workspace-layout/ds-workspace-layout.tsx +135 -0
- package/src/components/ds-workspace-layout/ds-workspace-layout.types.ts +52 -0
- package/src/components/ds-workspace-layout/index.ts +11 -0
- package/src/index.ts +2 -1
- package/src/styles/_scrollbars.scss +37 -0
- package/src/utils/restore-document-body-modal-styles.ts +44 -0
- package/src/utils/use-ark-dialog-body-lock-cleanup.ts +36 -0
- package/src/components/ds-workspace/ds-workspace.module.scss +0 -55
- package/src/components/ds-workspace/ds-workspace.tsx +0 -37
- package/src/components/ds-workspace/ds-workspace.types.ts +0 -17
- package/src/components/ds-workspace/index.ts +0 -8
package/dist/index.cjs
CHANGED
|
@@ -3225,7 +3225,7 @@ const Title$2 = (t0) => {
|
|
|
3225
3225
|
} else t2 = $[5];
|
|
3226
3226
|
return t2;
|
|
3227
3227
|
};
|
|
3228
|
-
const Body$
|
|
3228
|
+
const Body$5 = (t0) => {
|
|
3229
3229
|
const $ = (0, react_compiler_runtime.c)(6);
|
|
3230
3230
|
const { style, className, children } = t0;
|
|
3231
3231
|
let t1;
|
|
@@ -3273,7 +3273,7 @@ const Actions$3 = (t0) => {
|
|
|
3273
3273
|
return t2;
|
|
3274
3274
|
};
|
|
3275
3275
|
DsAlertBanner.Title = Title$2;
|
|
3276
|
-
DsAlertBanner.Body = Body$
|
|
3276
|
+
DsAlertBanner.Body = Body$5;
|
|
3277
3277
|
DsAlertBanner.Actions = Actions$3;
|
|
3278
3278
|
//#endregion
|
|
3279
3279
|
//#region src/components/ds-alert-banner/ds-alert-banner.types.ts
|
|
@@ -4082,7 +4082,7 @@ const Trigger = _ark_ui_react_menu.Menu.Trigger;
|
|
|
4082
4082
|
/**
|
|
4083
4083
|
* Content component - wraps the dropdown content
|
|
4084
4084
|
*/
|
|
4085
|
-
const Content$
|
|
4085
|
+
const Content$2 = (t0) => {
|
|
4086
4086
|
const $ = (0, react_compiler_runtime.c)(9);
|
|
4087
4087
|
const { disablePortal: t1, children, className, style } = t0;
|
|
4088
4088
|
const Wrapper = (t1 === void 0 ? false : t1) ? react.Fragment : _ark_ui_react_portal.Portal;
|
|
@@ -4187,7 +4187,7 @@ const ItemIndicator = (t0) => {
|
|
|
4187
4187
|
/**
|
|
4188
4188
|
* Header component - sticky header container for search, filters, or other controls
|
|
4189
4189
|
*/
|
|
4190
|
-
const Header$
|
|
4190
|
+
const Header$5 = (t0) => {
|
|
4191
4191
|
const $ = (0, react_compiler_runtime.c)(6);
|
|
4192
4192
|
const { children, className, style } = t0;
|
|
4193
4193
|
let t1;
|
|
@@ -4663,11 +4663,11 @@ const DsDropdownMenuLegacy = (t0) => {
|
|
|
4663
4663
|
const DsDropdownMenu = {
|
|
4664
4664
|
Root: Root$3,
|
|
4665
4665
|
Trigger,
|
|
4666
|
-
Content: Content$
|
|
4666
|
+
Content: Content$2,
|
|
4667
4667
|
Item: Item$2,
|
|
4668
4668
|
ItemIndicator,
|
|
4669
4669
|
TriggerItem,
|
|
4670
|
-
Header: Header$
|
|
4670
|
+
Header: Header$5,
|
|
4671
4671
|
Actions: Actions$2,
|
|
4672
4672
|
ItemGroup,
|
|
4673
4673
|
ItemGroupLabel,
|
|
@@ -5505,7 +5505,7 @@ const Root$2 = (t0) => {
|
|
|
5505
5505
|
* Use with DsCard.Title and DsCard.Extra for standard layout,
|
|
5506
5506
|
* or provide custom children for full flexibility.
|
|
5507
5507
|
*/
|
|
5508
|
-
const Header$
|
|
5508
|
+
const Header$4 = (t0) => {
|
|
5509
5509
|
const $ = (0, react_compiler_runtime.c)(12);
|
|
5510
5510
|
let children;
|
|
5511
5511
|
let className;
|
|
@@ -5549,7 +5549,7 @@ const Header$3 = (t0) => {
|
|
|
5549
5549
|
/**
|
|
5550
5550
|
* Card body - main content area.
|
|
5551
5551
|
*/
|
|
5552
|
-
const Body$
|
|
5552
|
+
const Body$4 = (t0) => {
|
|
5553
5553
|
const $ = (0, react_compiler_runtime.c)(12);
|
|
5554
5554
|
let children;
|
|
5555
5555
|
let className;
|
|
@@ -5636,8 +5636,8 @@ const Footer$3 = (t0) => {
|
|
|
5636
5636
|
};
|
|
5637
5637
|
const DsCard = {
|
|
5638
5638
|
Root: Root$2,
|
|
5639
|
-
Header: Header$
|
|
5640
|
-
Body: Body$
|
|
5639
|
+
Header: Header$4,
|
|
5640
|
+
Body: Body$4,
|
|
5641
5641
|
Footer: Footer$3
|
|
5642
5642
|
};
|
|
5643
5643
|
//#endregion
|
|
@@ -5648,190 +5648,597 @@ const cardSizes = [
|
|
|
5648
5648
|
"large"
|
|
5649
5649
|
];
|
|
5650
5650
|
//#endregion
|
|
5651
|
-
//#region src/components/ds-
|
|
5652
|
-
var
|
|
5653
|
-
"
|
|
5654
|
-
"
|
|
5655
|
-
"
|
|
5656
|
-
"
|
|
5657
|
-
"
|
|
5658
|
-
"
|
|
5659
|
-
"
|
|
5660
|
-
"
|
|
5651
|
+
//#region src/components/ds-catalog-layout/ds-catalog-layout.module.scss
|
|
5652
|
+
var ds_catalog_layout_module_default = {
|
|
5653
|
+
"body": "ub6JXq_body",
|
|
5654
|
+
"content": "ub6JXq_content",
|
|
5655
|
+
"contentHeader": "ub6JXq_contentHeader",
|
|
5656
|
+
"contentHeaderActions": "ub6JXq_contentHeaderActions",
|
|
5657
|
+
"contentHeaderItem": "ub6JXq_contentHeaderItem",
|
|
5658
|
+
"contentHeaderTitle": "ub6JXq_contentHeaderTitle",
|
|
5659
|
+
"contentHeaderTitleRow": "ub6JXq_contentHeaderTitleRow",
|
|
5660
|
+
"contentWithSideMenu": "ub6JXq_contentWithSideMenu",
|
|
5661
|
+
"fillParent": "ub6JXq_fillParent",
|
|
5662
|
+
"header": "ub6JXq_header",
|
|
5663
|
+
"root": "ub6JXq_root",
|
|
5664
|
+
"sideMenu": "ub6JXq_sideMenu",
|
|
5665
|
+
"sideMenuPanel": "ub6JXq_sideMenuPanel",
|
|
5666
|
+
"sideMenuPinButton": "ub6JXq_sideMenuPinButton"
|
|
5667
|
+
};
|
|
5668
|
+
//#endregion
|
|
5669
|
+
//#region src/components/ds-catalog-layout/ds-catalog-layout.context.ts
|
|
5670
|
+
const DsCatalogLayoutContext = (0, react.createContext)(null);
|
|
5671
|
+
const useDsCatalogLayoutContext = () => {
|
|
5672
|
+
const context = (0, react.useContext)(DsCatalogLayoutContext);
|
|
5673
|
+
if (!context) throw new Error("DsCatalogLayout compound components must be used within DsCatalogLayout");
|
|
5674
|
+
return context;
|
|
5661
5675
|
};
|
|
5662
5676
|
//#endregion
|
|
5663
|
-
//#region src/components/ds-
|
|
5664
|
-
|
|
5665
|
-
|
|
5666
|
-
|
|
5667
|
-
|
|
5668
|
-
|
|
5677
|
+
//#region src/components/ds-catalog-layout/ds-catalog-layout.tsx
|
|
5678
|
+
const DEFAULT_LOCALE$1 = Object.freeze({
|
|
5679
|
+
pinButtonLabel: "Pin side menu",
|
|
5680
|
+
unpinButtonLabel: "Unpin side menu"
|
|
5681
|
+
});
|
|
5682
|
+
const DsCatalogLayout = (t0) => {
|
|
5683
|
+
const $ = (0, react_compiler_runtime.c)(17);
|
|
5669
5684
|
let className;
|
|
5670
|
-
let
|
|
5671
|
-
let labelInfo;
|
|
5672
|
-
let onCheckedChange;
|
|
5673
|
-
let props;
|
|
5685
|
+
let rest;
|
|
5674
5686
|
let t1;
|
|
5675
|
-
let value;
|
|
5676
5687
|
if ($[0] !== t0) {
|
|
5677
|
-
({
|
|
5688
|
+
({className, fillParent: t1, ...rest} = t0);
|
|
5678
5689
|
$[0] = t0;
|
|
5679
5690
|
$[1] = className;
|
|
5680
|
-
$[2] =
|
|
5681
|
-
$[3] =
|
|
5682
|
-
$[4] = onCheckedChange;
|
|
5683
|
-
$[5] = props;
|
|
5684
|
-
$[6] = t1;
|
|
5685
|
-
$[7] = value;
|
|
5691
|
+
$[2] = rest;
|
|
5692
|
+
$[3] = t1;
|
|
5686
5693
|
} else {
|
|
5687
5694
|
className = $[1];
|
|
5688
|
-
|
|
5689
|
-
|
|
5690
|
-
onCheckedChange = $[4];
|
|
5691
|
-
props = $[5];
|
|
5692
|
-
t1 = $[6];
|
|
5693
|
-
value = $[7];
|
|
5695
|
+
rest = $[2];
|
|
5696
|
+
t1 = $[3];
|
|
5694
5697
|
}
|
|
5695
|
-
const
|
|
5698
|
+
const fillParent = t1 === void 0 ? false : t1;
|
|
5699
|
+
const [hasSideMenu, setHasSideMenu] = (0, react.useState)(false);
|
|
5700
|
+
let t2;
|
|
5701
|
+
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
|
|
5702
|
+
t2 = () => setHasSideMenu(true);
|
|
5703
|
+
$[4] = t2;
|
|
5704
|
+
} else t2 = $[4];
|
|
5705
|
+
const registerSideMenu = t2;
|
|
5696
5706
|
let t3;
|
|
5697
|
-
if ($[
|
|
5698
|
-
t3 = (
|
|
5699
|
-
$[
|
|
5700
|
-
|
|
5701
|
-
|
|
5702
|
-
} else t3 = $[10];
|
|
5707
|
+
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
|
|
5708
|
+
t3 = () => setHasSideMenu(false);
|
|
5709
|
+
$[5] = t3;
|
|
5710
|
+
} else t3 = $[5];
|
|
5711
|
+
const unregisterSideMenu = t3;
|
|
5703
5712
|
let t4;
|
|
5704
|
-
if ($[
|
|
5705
|
-
t4 =
|
|
5706
|
-
|
|
5707
|
-
|
|
5708
|
-
|
|
5709
|
-
|
|
5713
|
+
if ($[6] !== hasSideMenu) {
|
|
5714
|
+
t4 = {
|
|
5715
|
+
hasSideMenu,
|
|
5716
|
+
registerSideMenu,
|
|
5717
|
+
unregisterSideMenu
|
|
5718
|
+
};
|
|
5719
|
+
$[6] = hasSideMenu;
|
|
5720
|
+
$[7] = t4;
|
|
5721
|
+
} else t4 = $[7];
|
|
5722
|
+
const contextValue = t4;
|
|
5723
|
+
let t5;
|
|
5724
|
+
if ($[8] !== className || $[9] !== fillParent) {
|
|
5725
|
+
t5 = (0, classnames.default)(ds_catalog_layout_module_default.root, { [ds_catalog_layout_module_default.fillParent]: fillParent }, className);
|
|
5726
|
+
$[8] = className;
|
|
5727
|
+
$[9] = fillParent;
|
|
5728
|
+
$[10] = t5;
|
|
5729
|
+
} else t5 = $[10];
|
|
5710
5730
|
let t6;
|
|
5711
|
-
if ($[
|
|
5712
|
-
t6 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
5713
|
-
|
|
5714
|
-
|
|
5715
|
-
icon: "check_small",
|
|
5716
|
-
size: "tiny",
|
|
5717
|
-
variant: "rounded"
|
|
5718
|
-
})
|
|
5731
|
+
if ($[11] !== rest || $[12] !== t5) {
|
|
5732
|
+
t6 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
5733
|
+
...rest,
|
|
5734
|
+
className: t5
|
|
5719
5735
|
});
|
|
5736
|
+
$[11] = rest;
|
|
5737
|
+
$[12] = t5;
|
|
5720
5738
|
$[13] = t6;
|
|
5721
5739
|
} else t6 = $[13];
|
|
5722
5740
|
let t7;
|
|
5723
|
-
|
|
5724
|
-
|
|
5725
|
-
|
|
5726
|
-
|
|
5727
|
-
children: [t6, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_checkbox.Checkbox.Indicator, {
|
|
5728
|
-
className: ds_checkbox_module_default.indicator,
|
|
5729
|
-
indeterminate: true,
|
|
5730
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
5731
|
-
icon: "check_indeterminate_small",
|
|
5732
|
-
size: "tiny",
|
|
5733
|
-
variant: "rounded"
|
|
5734
|
-
})
|
|
5735
|
-
})]
|
|
5741
|
+
if ($[14] !== contextValue || $[15] !== t6) {
|
|
5742
|
+
t7 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCatalogLayoutContext.Provider, {
|
|
5743
|
+
value: contextValue,
|
|
5744
|
+
children: t6
|
|
5736
5745
|
});
|
|
5737
|
-
|
|
5738
|
-
$[
|
|
5739
|
-
$[
|
|
5746
|
+
$[14] = contextValue;
|
|
5747
|
+
$[15] = t6;
|
|
5748
|
+
$[16] = t7;
|
|
5749
|
+
} else t7 = $[16];
|
|
5750
|
+
return t7;
|
|
5751
|
+
};
|
|
5752
|
+
const Header$3 = (t0) => {
|
|
5753
|
+
const $ = (0, react_compiler_runtime.c)(8);
|
|
5754
|
+
let className;
|
|
5755
|
+
let rest;
|
|
5756
|
+
if ($[0] !== t0) {
|
|
5757
|
+
({className, ...rest} = t0);
|
|
5758
|
+
$[0] = t0;
|
|
5759
|
+
$[1] = className;
|
|
5760
|
+
$[2] = rest;
|
|
5740
5761
|
} else {
|
|
5741
|
-
|
|
5742
|
-
|
|
5762
|
+
className = $[1];
|
|
5763
|
+
rest = $[2];
|
|
5743
5764
|
}
|
|
5744
|
-
let
|
|
5745
|
-
if ($[
|
|
5746
|
-
|
|
5747
|
-
|
|
5748
|
-
|
|
5749
|
-
|
|
5750
|
-
|
|
5751
|
-
|
|
5752
|
-
|
|
5753
|
-
|
|
5754
|
-
|
|
5755
|
-
});
|
|
5756
|
-
$[16] = label;
|
|
5757
|
-
$[17] = labelInfo;
|
|
5758
|
-
$[18] = t9;
|
|
5759
|
-
} else t9 = $[18];
|
|
5760
|
-
let t10;
|
|
5761
|
-
if ($[19] !== props || $[20] !== t3 || $[21] !== t4 || $[22] !== t5 || $[23] !== t9) {
|
|
5762
|
-
t10 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ark_ui_react_checkbox.Checkbox.Root, {
|
|
5763
|
-
className: t3,
|
|
5764
|
-
onCheckedChange: t4,
|
|
5765
|
-
...props,
|
|
5766
|
-
value: t5,
|
|
5767
|
-
children: [
|
|
5768
|
-
t7,
|
|
5769
|
-
t8,
|
|
5770
|
-
t9
|
|
5771
|
-
]
|
|
5765
|
+
let t1;
|
|
5766
|
+
if ($[3] !== className) {
|
|
5767
|
+
t1 = (0, classnames.default)(ds_catalog_layout_module_default.header, className);
|
|
5768
|
+
$[3] = className;
|
|
5769
|
+
$[4] = t1;
|
|
5770
|
+
} else t1 = $[4];
|
|
5771
|
+
let t2;
|
|
5772
|
+
if ($[5] !== rest || $[6] !== t1) {
|
|
5773
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("header", {
|
|
5774
|
+
...rest,
|
|
5775
|
+
className: t1
|
|
5772
5776
|
});
|
|
5773
|
-
$[
|
|
5774
|
-
$[
|
|
5775
|
-
$[
|
|
5776
|
-
|
|
5777
|
-
|
|
5778
|
-
$[24] = t10;
|
|
5779
|
-
} else t10 = $[24];
|
|
5780
|
-
return t10;
|
|
5777
|
+
$[5] = rest;
|
|
5778
|
+
$[6] = t1;
|
|
5779
|
+
$[7] = t2;
|
|
5780
|
+
} else t2 = $[7];
|
|
5781
|
+
return t2;
|
|
5781
5782
|
};
|
|
5782
|
-
|
|
5783
|
-
|
|
5784
|
-
|
|
5785
|
-
|
|
5786
|
-
|
|
5787
|
-
|
|
5788
|
-
|
|
5789
|
-
|
|
5790
|
-
|
|
5783
|
+
const Body$3 = (t0) => {
|
|
5784
|
+
const $ = (0, react_compiler_runtime.c)(8);
|
|
5785
|
+
let className;
|
|
5786
|
+
let rest;
|
|
5787
|
+
if ($[0] !== t0) {
|
|
5788
|
+
({className, ...rest} = t0);
|
|
5789
|
+
$[0] = t0;
|
|
5790
|
+
$[1] = className;
|
|
5791
|
+
$[2] = rest;
|
|
5792
|
+
} else {
|
|
5793
|
+
className = $[1];
|
|
5794
|
+
rest = $[2];
|
|
5795
|
+
}
|
|
5796
|
+
let t1;
|
|
5797
|
+
if ($[3] !== className) {
|
|
5798
|
+
t1 = (0, classnames.default)(ds_catalog_layout_module_default.body, className);
|
|
5799
|
+
$[3] = className;
|
|
5800
|
+
$[4] = t1;
|
|
5801
|
+
} else t1 = $[4];
|
|
5802
|
+
let t2;
|
|
5803
|
+
if ($[5] !== rest || $[6] !== t1) {
|
|
5804
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
5805
|
+
...rest,
|
|
5806
|
+
className: t1
|
|
5807
|
+
});
|
|
5808
|
+
$[5] = rest;
|
|
5809
|
+
$[6] = t1;
|
|
5810
|
+
$[7] = t2;
|
|
5811
|
+
} else t2 = $[7];
|
|
5812
|
+
return t2;
|
|
5791
5813
|
};
|
|
5792
|
-
|
|
5793
|
-
|
|
5794
|
-
const DsCheckboxGroup = (t0) => {
|
|
5795
|
-
const $ = (0, react_compiler_runtime.c)(12);
|
|
5814
|
+
const SideMenu$1 = (t0) => {
|
|
5815
|
+
const $ = (0, react_compiler_runtime.c)(32);
|
|
5796
5816
|
let children;
|
|
5797
5817
|
let className;
|
|
5798
|
-
let
|
|
5818
|
+
let locale;
|
|
5819
|
+
let onPinnedChange;
|
|
5820
|
+
let rest;
|
|
5799
5821
|
let t1;
|
|
5800
5822
|
if ($[0] !== t0) {
|
|
5801
|
-
({
|
|
5823
|
+
({className, pinned: t1, onPinnedChange, locale, children, ...rest} = t0);
|
|
5802
5824
|
$[0] = t0;
|
|
5803
5825
|
$[1] = children;
|
|
5804
5826
|
$[2] = className;
|
|
5805
|
-
$[3] =
|
|
5806
|
-
$[4] =
|
|
5827
|
+
$[3] = locale;
|
|
5828
|
+
$[4] = onPinnedChange;
|
|
5829
|
+
$[5] = rest;
|
|
5830
|
+
$[6] = t1;
|
|
5807
5831
|
} else {
|
|
5808
5832
|
children = $[1];
|
|
5809
5833
|
className = $[2];
|
|
5810
|
-
|
|
5811
|
-
|
|
5834
|
+
locale = $[3];
|
|
5835
|
+
onPinnedChange = $[4];
|
|
5836
|
+
rest = $[5];
|
|
5837
|
+
t1 = $[6];
|
|
5812
5838
|
}
|
|
5813
|
-
const
|
|
5839
|
+
const pinned = t1 === void 0 ? false : t1;
|
|
5840
|
+
const { registerSideMenu, unregisterSideMenu } = useDsCatalogLayoutContext();
|
|
5841
|
+
const [isHovering, setIsHovering] = (0, react.useState)(false);
|
|
5842
|
+
let t2;
|
|
5814
5843
|
let t3;
|
|
5815
|
-
if ($[
|
|
5816
|
-
|
|
5817
|
-
|
|
5818
|
-
|
|
5819
|
-
|
|
5820
|
-
|
|
5821
|
-
|
|
5822
|
-
|
|
5823
|
-
|
|
5824
|
-
className: t3,
|
|
5825
|
-
...props,
|
|
5826
|
-
children
|
|
5827
|
-
});
|
|
5828
|
-
$[8] = children;
|
|
5829
|
-
$[9] = props;
|
|
5844
|
+
if ($[7] !== registerSideMenu || $[8] !== unregisterSideMenu) {
|
|
5845
|
+
t2 = () => {
|
|
5846
|
+
registerSideMenu();
|
|
5847
|
+
return unregisterSideMenu;
|
|
5848
|
+
};
|
|
5849
|
+
t3 = [registerSideMenu, unregisterSideMenu];
|
|
5850
|
+
$[7] = registerSideMenu;
|
|
5851
|
+
$[8] = unregisterSideMenu;
|
|
5852
|
+
$[9] = t2;
|
|
5830
5853
|
$[10] = t3;
|
|
5831
|
-
|
|
5832
|
-
|
|
5833
|
-
|
|
5834
|
-
}
|
|
5854
|
+
} else {
|
|
5855
|
+
t2 = $[9];
|
|
5856
|
+
t3 = $[10];
|
|
5857
|
+
}
|
|
5858
|
+
(0, react.useEffect)(t2, t3);
|
|
5859
|
+
const isExpanded = pinned || isHovering;
|
|
5860
|
+
const ariaLabel = pinned ? locale?.unpinButtonLabel ?? DEFAULT_LOCALE$1.unpinButtonLabel : locale?.pinButtonLabel ?? DEFAULT_LOCALE$1.pinButtonLabel;
|
|
5861
|
+
let t4;
|
|
5862
|
+
if ($[11] !== className) {
|
|
5863
|
+
t4 = (0, classnames.default)(ds_catalog_layout_module_default.sideMenu, className);
|
|
5864
|
+
$[11] = className;
|
|
5865
|
+
$[12] = t4;
|
|
5866
|
+
} else t4 = $[12];
|
|
5867
|
+
let t5;
|
|
5868
|
+
if ($[13] !== pinned) {
|
|
5869
|
+
t5 = pinned ? { "data-pinned": "" } : {};
|
|
5870
|
+
$[13] = pinned;
|
|
5871
|
+
$[14] = t5;
|
|
5872
|
+
} else t5 = $[14];
|
|
5873
|
+
let t6;
|
|
5874
|
+
if ($[15] !== isExpanded) {
|
|
5875
|
+
t6 = isExpanded ? { "data-expanded": "" } : {};
|
|
5876
|
+
$[15] = isExpanded;
|
|
5877
|
+
$[16] = t6;
|
|
5878
|
+
} else t6 = $[16];
|
|
5879
|
+
let t7;
|
|
5880
|
+
let t8;
|
|
5881
|
+
if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
|
|
5882
|
+
t7 = () => setIsHovering(true);
|
|
5883
|
+
t8 = () => setIsHovering(false);
|
|
5884
|
+
$[17] = t7;
|
|
5885
|
+
$[18] = t8;
|
|
5886
|
+
} else {
|
|
5887
|
+
t7 = $[17];
|
|
5888
|
+
t8 = $[18];
|
|
5889
|
+
}
|
|
5890
|
+
let t9;
|
|
5891
|
+
if ($[19] !== ariaLabel || $[20] !== onPinnedChange || $[21] !== pinned) {
|
|
5892
|
+
t9 = onPinnedChange ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
5893
|
+
type: "button",
|
|
5894
|
+
className: ds_catalog_layout_module_default.sideMenuPinButton,
|
|
5895
|
+
onClick: () => onPinnedChange(!pinned),
|
|
5896
|
+
"aria-label": ariaLabel,
|
|
5897
|
+
"aria-pressed": pinned,
|
|
5898
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
5899
|
+
icon: "keep",
|
|
5900
|
+
size: "small",
|
|
5901
|
+
filled: pinned
|
|
5902
|
+
})
|
|
5903
|
+
}) : null;
|
|
5904
|
+
$[19] = ariaLabel;
|
|
5905
|
+
$[20] = onPinnedChange;
|
|
5906
|
+
$[21] = pinned;
|
|
5907
|
+
$[22] = t9;
|
|
5908
|
+
} else t9 = $[22];
|
|
5909
|
+
let t10;
|
|
5910
|
+
if ($[23] !== children || $[24] !== t9) {
|
|
5911
|
+
t10 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
5912
|
+
className: ds_catalog_layout_module_default.sideMenuPanel,
|
|
5913
|
+
onMouseEnter: t7,
|
|
5914
|
+
onMouseLeave: t8,
|
|
5915
|
+
children: [t9, children]
|
|
5916
|
+
});
|
|
5917
|
+
$[23] = children;
|
|
5918
|
+
$[24] = t9;
|
|
5919
|
+
$[25] = t10;
|
|
5920
|
+
} else t10 = $[25];
|
|
5921
|
+
let t11;
|
|
5922
|
+
if ($[26] !== rest || $[27] !== t10 || $[28] !== t4 || $[29] !== t5 || $[30] !== t6) {
|
|
5923
|
+
t11 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("aside", {
|
|
5924
|
+
...rest,
|
|
5925
|
+
className: t4,
|
|
5926
|
+
...t5,
|
|
5927
|
+
...t6,
|
|
5928
|
+
children: t10
|
|
5929
|
+
});
|
|
5930
|
+
$[26] = rest;
|
|
5931
|
+
$[27] = t10;
|
|
5932
|
+
$[28] = t4;
|
|
5933
|
+
$[29] = t5;
|
|
5934
|
+
$[30] = t6;
|
|
5935
|
+
$[31] = t11;
|
|
5936
|
+
} else t11 = $[31];
|
|
5937
|
+
return t11;
|
|
5938
|
+
};
|
|
5939
|
+
const Content$1 = (t0) => {
|
|
5940
|
+
const $ = (0, react_compiler_runtime.c)(9);
|
|
5941
|
+
let className;
|
|
5942
|
+
let rest;
|
|
5943
|
+
if ($[0] !== t0) {
|
|
5944
|
+
({className, ...rest} = t0);
|
|
5945
|
+
$[0] = t0;
|
|
5946
|
+
$[1] = className;
|
|
5947
|
+
$[2] = rest;
|
|
5948
|
+
} else {
|
|
5949
|
+
className = $[1];
|
|
5950
|
+
rest = $[2];
|
|
5951
|
+
}
|
|
5952
|
+
const { hasSideMenu } = useDsCatalogLayoutContext();
|
|
5953
|
+
let t1;
|
|
5954
|
+
if ($[3] !== className || $[4] !== hasSideMenu) {
|
|
5955
|
+
t1 = (0, classnames.default)(ds_catalog_layout_module_default.content, { [ds_catalog_layout_module_default.contentWithSideMenu]: hasSideMenu }, className);
|
|
5956
|
+
$[3] = className;
|
|
5957
|
+
$[4] = hasSideMenu;
|
|
5958
|
+
$[5] = t1;
|
|
5959
|
+
} else t1 = $[5];
|
|
5960
|
+
let t2;
|
|
5961
|
+
if ($[6] !== rest || $[7] !== t1) {
|
|
5962
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
5963
|
+
...rest,
|
|
5964
|
+
className: t1
|
|
5965
|
+
});
|
|
5966
|
+
$[6] = rest;
|
|
5967
|
+
$[7] = t1;
|
|
5968
|
+
$[8] = t2;
|
|
5969
|
+
} else t2 = $[8];
|
|
5970
|
+
return t2;
|
|
5971
|
+
};
|
|
5972
|
+
const ContentHeader = (t0) => {
|
|
5973
|
+
const $ = (0, react_compiler_runtime.c)(22);
|
|
5974
|
+
let children;
|
|
5975
|
+
let className;
|
|
5976
|
+
let headerActions;
|
|
5977
|
+
let rest;
|
|
5978
|
+
let title;
|
|
5979
|
+
if ($[0] !== t0) {
|
|
5980
|
+
({className, title, headerActions, children, ...rest} = t0);
|
|
5981
|
+
$[0] = t0;
|
|
5982
|
+
$[1] = children;
|
|
5983
|
+
$[2] = className;
|
|
5984
|
+
$[3] = headerActions;
|
|
5985
|
+
$[4] = rest;
|
|
5986
|
+
$[5] = title;
|
|
5987
|
+
} else {
|
|
5988
|
+
children = $[1];
|
|
5989
|
+
className = $[2];
|
|
5990
|
+
headerActions = $[3];
|
|
5991
|
+
rest = $[4];
|
|
5992
|
+
title = $[5];
|
|
5993
|
+
}
|
|
5994
|
+
let t1;
|
|
5995
|
+
if ($[6] !== className) {
|
|
5996
|
+
t1 = (0, classnames.default)(ds_catalog_layout_module_default.contentHeader, className);
|
|
5997
|
+
$[6] = className;
|
|
5998
|
+
$[7] = t1;
|
|
5999
|
+
} else t1 = $[7];
|
|
6000
|
+
let t2;
|
|
6001
|
+
if ($[8] !== title) {
|
|
6002
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
6003
|
+
className: ds_catalog_layout_module_default.contentHeaderTitle,
|
|
6004
|
+
children: title
|
|
6005
|
+
});
|
|
6006
|
+
$[8] = title;
|
|
6007
|
+
$[9] = t2;
|
|
6008
|
+
} else t2 = $[9];
|
|
6009
|
+
let t3;
|
|
6010
|
+
if ($[10] !== headerActions) {
|
|
6011
|
+
t3 = headerActions ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
6012
|
+
className: ds_catalog_layout_module_default.contentHeaderActions,
|
|
6013
|
+
children: headerActions
|
|
6014
|
+
}) : null;
|
|
6015
|
+
$[10] = headerActions;
|
|
6016
|
+
$[11] = t3;
|
|
6017
|
+
} else t3 = $[11];
|
|
6018
|
+
let t4;
|
|
6019
|
+
if ($[12] !== t2 || $[13] !== t3) {
|
|
6020
|
+
t4 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
6021
|
+
className: ds_catalog_layout_module_default.contentHeaderTitleRow,
|
|
6022
|
+
children: [t2, t3]
|
|
6023
|
+
});
|
|
6024
|
+
$[12] = t2;
|
|
6025
|
+
$[13] = t3;
|
|
6026
|
+
$[14] = t4;
|
|
6027
|
+
} else t4 = $[14];
|
|
6028
|
+
let t5;
|
|
6029
|
+
if ($[15] !== children) {
|
|
6030
|
+
t5 = children ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
6031
|
+
className: ds_catalog_layout_module_default.contentHeaderItem,
|
|
6032
|
+
children
|
|
6033
|
+
}) : null;
|
|
6034
|
+
$[15] = children;
|
|
6035
|
+
$[16] = t5;
|
|
6036
|
+
} else t5 = $[16];
|
|
6037
|
+
let t6;
|
|
6038
|
+
if ($[17] !== rest || $[18] !== t1 || $[19] !== t4 || $[20] !== t5) {
|
|
6039
|
+
t6 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
6040
|
+
...rest,
|
|
6041
|
+
className: t1,
|
|
6042
|
+
children: [t4, t5]
|
|
6043
|
+
});
|
|
6044
|
+
$[17] = rest;
|
|
6045
|
+
$[18] = t1;
|
|
6046
|
+
$[19] = t4;
|
|
6047
|
+
$[20] = t5;
|
|
6048
|
+
$[21] = t6;
|
|
6049
|
+
} else t6 = $[21];
|
|
6050
|
+
return t6;
|
|
6051
|
+
};
|
|
6052
|
+
DsCatalogLayout.Header = Header$3;
|
|
6053
|
+
DsCatalogLayout.Body = Body$3;
|
|
6054
|
+
DsCatalogLayout.SideMenu = SideMenu$1;
|
|
6055
|
+
DsCatalogLayout.Content = Content$1;
|
|
6056
|
+
DsCatalogLayout.ContentHeader = ContentHeader;
|
|
6057
|
+
//#endregion
|
|
6058
|
+
//#region src/components/ds-checkbox/ds-checkbox.module.scss
|
|
6059
|
+
var ds_checkbox_module_default = {
|
|
6060
|
+
"control": "-9VV7a_control",
|
|
6061
|
+
"hiddenInput": "-9VV7a_hiddenInput",
|
|
6062
|
+
"indicator": "-9VV7a_indicator",
|
|
6063
|
+
"label": "-9VV7a_label",
|
|
6064
|
+
"labelColumn": "-9VV7a_labelColumn",
|
|
6065
|
+
"labelInfo": "-9VV7a_labelInfo",
|
|
6066
|
+
"root": "-9VV7a_root",
|
|
6067
|
+
"warning": "-9VV7a_warning"
|
|
6068
|
+
};
|
|
6069
|
+
//#endregion
|
|
6070
|
+
//#region src/components/ds-checkbox/ds-checkbox.tsx
|
|
6071
|
+
/**
|
|
6072
|
+
* Design system Checkbox component
|
|
6073
|
+
*/
|
|
6074
|
+
const DsCheckbox = (t0) => {
|
|
6075
|
+
const $ = (0, react_compiler_runtime.c)(25);
|
|
6076
|
+
let className;
|
|
6077
|
+
let label;
|
|
6078
|
+
let labelInfo;
|
|
6079
|
+
let onCheckedChange;
|
|
6080
|
+
let props;
|
|
6081
|
+
let t1;
|
|
6082
|
+
let value;
|
|
6083
|
+
if ($[0] !== t0) {
|
|
6084
|
+
({variant: t1, label, labelInfo, className, onCheckedChange, value, ...props} = t0);
|
|
6085
|
+
$[0] = t0;
|
|
6086
|
+
$[1] = className;
|
|
6087
|
+
$[2] = label;
|
|
6088
|
+
$[3] = labelInfo;
|
|
6089
|
+
$[4] = onCheckedChange;
|
|
6090
|
+
$[5] = props;
|
|
6091
|
+
$[6] = t1;
|
|
6092
|
+
$[7] = value;
|
|
6093
|
+
} else {
|
|
6094
|
+
className = $[1];
|
|
6095
|
+
label = $[2];
|
|
6096
|
+
labelInfo = $[3];
|
|
6097
|
+
onCheckedChange = $[4];
|
|
6098
|
+
props = $[5];
|
|
6099
|
+
t1 = $[6];
|
|
6100
|
+
value = $[7];
|
|
6101
|
+
}
|
|
6102
|
+
const t2 = (t1 === void 0 ? "default" : t1) === "warning" && ds_checkbox_module_default.warning;
|
|
6103
|
+
let t3;
|
|
6104
|
+
if ($[8] !== className || $[9] !== t2) {
|
|
6105
|
+
t3 = (0, classnames.default)(ds_checkbox_module_default.root, t2, className);
|
|
6106
|
+
$[8] = className;
|
|
6107
|
+
$[9] = t2;
|
|
6108
|
+
$[10] = t3;
|
|
6109
|
+
} else t3 = $[10];
|
|
6110
|
+
let t4;
|
|
6111
|
+
if ($[11] !== onCheckedChange) {
|
|
6112
|
+
t4 = (details) => onCheckedChange?.(details.checked);
|
|
6113
|
+
$[11] = onCheckedChange;
|
|
6114
|
+
$[12] = t4;
|
|
6115
|
+
} else t4 = $[12];
|
|
6116
|
+
const t5 = value === void 0 ? void 0 : String(value);
|
|
6117
|
+
let t6;
|
|
6118
|
+
if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
|
|
6119
|
+
t6 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_checkbox.Checkbox.Indicator, {
|
|
6120
|
+
className: ds_checkbox_module_default.indicator,
|
|
6121
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
6122
|
+
icon: "check_small",
|
|
6123
|
+
size: "tiny",
|
|
6124
|
+
variant: "rounded"
|
|
6125
|
+
})
|
|
6126
|
+
});
|
|
6127
|
+
$[13] = t6;
|
|
6128
|
+
} else t6 = $[13];
|
|
6129
|
+
let t7;
|
|
6130
|
+
let t8;
|
|
6131
|
+
if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
|
|
6132
|
+
t7 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ark_ui_react_checkbox.Checkbox.Control, {
|
|
6133
|
+
className: ds_checkbox_module_default.control,
|
|
6134
|
+
children: [t6, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_checkbox.Checkbox.Indicator, {
|
|
6135
|
+
className: ds_checkbox_module_default.indicator,
|
|
6136
|
+
indeterminate: true,
|
|
6137
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
6138
|
+
icon: "check_indeterminate_small",
|
|
6139
|
+
size: "tiny",
|
|
6140
|
+
variant: "rounded"
|
|
6141
|
+
})
|
|
6142
|
+
})]
|
|
6143
|
+
});
|
|
6144
|
+
t8 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_checkbox.Checkbox.HiddenInput, { className: ds_checkbox_module_default.hiddenInput });
|
|
6145
|
+
$[14] = t7;
|
|
6146
|
+
$[15] = t8;
|
|
6147
|
+
} else {
|
|
6148
|
+
t7 = $[14];
|
|
6149
|
+
t8 = $[15];
|
|
6150
|
+
}
|
|
6151
|
+
let t9;
|
|
6152
|
+
if ($[16] !== label || $[17] !== labelInfo) {
|
|
6153
|
+
t9 = (label || labelInfo) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
6154
|
+
className: ds_checkbox_module_default.labelColumn,
|
|
6155
|
+
children: [label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_checkbox.Checkbox.Label, {
|
|
6156
|
+
className: ds_checkbox_module_default.label,
|
|
6157
|
+
children: label
|
|
6158
|
+
}), labelInfo && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
6159
|
+
className: ds_checkbox_module_default.labelInfo,
|
|
6160
|
+
children: labelInfo
|
|
6161
|
+
})]
|
|
6162
|
+
});
|
|
6163
|
+
$[16] = label;
|
|
6164
|
+
$[17] = labelInfo;
|
|
6165
|
+
$[18] = t9;
|
|
6166
|
+
} else t9 = $[18];
|
|
6167
|
+
let t10;
|
|
6168
|
+
if ($[19] !== props || $[20] !== t3 || $[21] !== t4 || $[22] !== t5 || $[23] !== t9) {
|
|
6169
|
+
t10 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ark_ui_react_checkbox.Checkbox.Root, {
|
|
6170
|
+
className: t3,
|
|
6171
|
+
onCheckedChange: t4,
|
|
6172
|
+
...props,
|
|
6173
|
+
value: t5,
|
|
6174
|
+
children: [
|
|
6175
|
+
t7,
|
|
6176
|
+
t8,
|
|
6177
|
+
t9
|
|
6178
|
+
]
|
|
6179
|
+
});
|
|
6180
|
+
$[19] = props;
|
|
6181
|
+
$[20] = t3;
|
|
6182
|
+
$[21] = t4;
|
|
6183
|
+
$[22] = t5;
|
|
6184
|
+
$[23] = t9;
|
|
6185
|
+
$[24] = t10;
|
|
6186
|
+
} else t10 = $[24];
|
|
6187
|
+
return t10;
|
|
6188
|
+
};
|
|
6189
|
+
//#endregion
|
|
6190
|
+
//#region src/components/ds-checkbox/ds-checkbox.types.ts
|
|
6191
|
+
const checkboxVariants = ["default", "warning"];
|
|
6192
|
+
//#endregion
|
|
6193
|
+
//#region src/components/ds-checkbox-group/ds-checkbox-group.module.scss
|
|
6194
|
+
var ds_checkbox_group_module_default = {
|
|
6195
|
+
"horizontal": "f9-vsG_horizontal",
|
|
6196
|
+
"root": "f9-vsG_root",
|
|
6197
|
+
"vertical": "f9-vsG_vertical"
|
|
6198
|
+
};
|
|
6199
|
+
//#endregion
|
|
6200
|
+
//#region src/components/ds-checkbox-group/ds-checkbox-group.tsx
|
|
6201
|
+
const DsCheckboxGroup = (t0) => {
|
|
6202
|
+
const $ = (0, react_compiler_runtime.c)(12);
|
|
6203
|
+
let children;
|
|
6204
|
+
let className;
|
|
6205
|
+
let props;
|
|
6206
|
+
let t1;
|
|
6207
|
+
if ($[0] !== t0) {
|
|
6208
|
+
({orientation: t1, className, children, ...props} = t0);
|
|
6209
|
+
$[0] = t0;
|
|
6210
|
+
$[1] = children;
|
|
6211
|
+
$[2] = className;
|
|
6212
|
+
$[3] = props;
|
|
6213
|
+
$[4] = t1;
|
|
6214
|
+
} else {
|
|
6215
|
+
children = $[1];
|
|
6216
|
+
className = $[2];
|
|
6217
|
+
props = $[3];
|
|
6218
|
+
t1 = $[4];
|
|
6219
|
+
}
|
|
6220
|
+
const t2 = ds_checkbox_group_module_default[t1 === void 0 ? "vertical" : t1];
|
|
6221
|
+
let t3;
|
|
6222
|
+
if ($[5] !== className || $[6] !== t2) {
|
|
6223
|
+
t3 = (0, classnames.default)(ds_checkbox_group_module_default.root, t2, className);
|
|
6224
|
+
$[5] = className;
|
|
6225
|
+
$[6] = t2;
|
|
6226
|
+
$[7] = t3;
|
|
6227
|
+
} else t3 = $[7];
|
|
6228
|
+
let t4;
|
|
6229
|
+
if ($[8] !== children || $[9] !== props || $[10] !== t3) {
|
|
6230
|
+
t4 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_checkbox.Checkbox.Group, {
|
|
6231
|
+
className: t3,
|
|
6232
|
+
...props,
|
|
6233
|
+
children
|
|
6234
|
+
});
|
|
6235
|
+
$[8] = children;
|
|
6236
|
+
$[9] = props;
|
|
6237
|
+
$[10] = t3;
|
|
6238
|
+
$[11] = t4;
|
|
6239
|
+
} else t4 = $[11];
|
|
6240
|
+
return t4;
|
|
6241
|
+
};
|
|
5835
6242
|
//#endregion
|
|
5836
6243
|
//#region src/components/ds-checkbox-group/hooks/use-checkbox-select-all.ts
|
|
5837
6244
|
/**
|
|
@@ -7871,6 +8278,78 @@ var ds_drawer_module_default = {
|
|
|
7871
8278
|
"toolbar": "MWmQHa_toolbar"
|
|
7872
8279
|
};
|
|
7873
8280
|
//#endregion
|
|
8281
|
+
//#region src/utils/restore-document-body-modal-styles.ts
|
|
8282
|
+
const SCROLL_LOCK_ATTRIBUTE = "data-scroll-lock";
|
|
8283
|
+
const INERT_ATTRIBUTE = "data-inert";
|
|
8284
|
+
const ARIA_HIDDEN_MARKER = "data-aria-hidden";
|
|
8285
|
+
/**
|
|
8286
|
+
* Clears document body styles and attributes left by Zag dialog modal effects when a
|
|
8287
|
+
* dialog instance tears down without a normal close transition.
|
|
8288
|
+
*
|
|
8289
|
+
* No-op unless a leak sentinel is present: in the common case Zag restores the body on
|
|
8290
|
+
* unmount itself, and we must not clobber styles the host app owns.
|
|
8291
|
+
*/
|
|
8292
|
+
const restoreDocumentBodyModalStyles = (doc = document) => {
|
|
8293
|
+
const { body, documentElement } = doc;
|
|
8294
|
+
if (!(body.hasAttribute(SCROLL_LOCK_ATTRIBUTE) || body.hasAttribute(INERT_ATTRIBUTE) || body.style.pointerEvents === "none")) return;
|
|
8295
|
+
body.removeAttribute(SCROLL_LOCK_ATTRIBUTE);
|
|
8296
|
+
body.removeAttribute(INERT_ATTRIBUTE);
|
|
8297
|
+
body.removeAttribute(ARIA_HIDDEN_MARKER);
|
|
8298
|
+
if (body.getAttribute("aria-hidden") === "true") body.removeAttribute("aria-hidden");
|
|
8299
|
+
body.style.removeProperty("overflow");
|
|
8300
|
+
body.style.removeProperty("pointer-events");
|
|
8301
|
+
body.style.removeProperty("position");
|
|
8302
|
+
body.style.removeProperty("top");
|
|
8303
|
+
body.style.removeProperty("left");
|
|
8304
|
+
body.style.removeProperty("right");
|
|
8305
|
+
if (body.style.length === 0) body.removeAttribute("style");
|
|
8306
|
+
documentElement.style.removeProperty("--scrollbar-width");
|
|
8307
|
+
};
|
|
8308
|
+
//#endregion
|
|
8309
|
+
//#region src/utils/use-ark-dialog-body-lock-cleanup.ts
|
|
8310
|
+
const activeBodyLockInstances = /* @__PURE__ */ new Set();
|
|
8311
|
+
const scheduleBodyLockRestoreIfIdle = () => {
|
|
8312
|
+
queueMicrotask(() => {
|
|
8313
|
+
if (activeBodyLockInstances.size > 0) return;
|
|
8314
|
+
restoreDocumentBodyModalStyles();
|
|
8315
|
+
});
|
|
8316
|
+
};
|
|
8317
|
+
/**
|
|
8318
|
+
* Ensures Zag dialog body scroll-lock and modal pointer blocking are released when
|
|
8319
|
+
* an Ark dialog unmounts while still open (e.g. close + conditional unmount + navigate).
|
|
8320
|
+
*/
|
|
8321
|
+
const useArkDialogBodyLockCleanup = (open, enabled) => {
|
|
8322
|
+
const $ = (0, react_compiler_runtime.c)(5);
|
|
8323
|
+
let t0;
|
|
8324
|
+
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
|
|
8325
|
+
t0 = Symbol("ark-dialog-body-lock");
|
|
8326
|
+
$[0] = t0;
|
|
8327
|
+
} else t0 = $[0];
|
|
8328
|
+
const instanceIdRef = (0, react.useRef)(t0);
|
|
8329
|
+
let t1;
|
|
8330
|
+
let t2;
|
|
8331
|
+
if ($[1] !== enabled || $[2] !== open) {
|
|
8332
|
+
t1 = () => {
|
|
8333
|
+
if (!open || !enabled) return;
|
|
8334
|
+
const instanceId = instanceIdRef.current;
|
|
8335
|
+
activeBodyLockInstances.add(instanceId);
|
|
8336
|
+
return () => {
|
|
8337
|
+
activeBodyLockInstances.delete(instanceId);
|
|
8338
|
+
scheduleBodyLockRestoreIfIdle();
|
|
8339
|
+
};
|
|
8340
|
+
};
|
|
8341
|
+
t2 = [open, enabled];
|
|
8342
|
+
$[1] = enabled;
|
|
8343
|
+
$[2] = open;
|
|
8344
|
+
$[3] = t1;
|
|
8345
|
+
$[4] = t2;
|
|
8346
|
+
} else {
|
|
8347
|
+
t1 = $[3];
|
|
8348
|
+
t2 = $[4];
|
|
8349
|
+
}
|
|
8350
|
+
(0, react.useLayoutEffect)(t1, t2);
|
|
8351
|
+
};
|
|
8352
|
+
//#endregion
|
|
7874
8353
|
//#region src/components/ds-drawer/ds-drawer.tsx
|
|
7875
8354
|
const DsDrawer = (t0) => {
|
|
7876
8355
|
const $ = (0, react_compiler_runtime.c)(25);
|
|
@@ -7882,6 +8361,7 @@ const DsDrawer = (t0) => {
|
|
|
7882
8361
|
const closeOnInteractOutside = t5 === void 0 ? false : t5;
|
|
7883
8362
|
const portal = t6 === void 0 ? false : t6;
|
|
7884
8363
|
const resolvedColumns = useResponsiveValue(columns);
|
|
8364
|
+
useArkDialogBodyLockCleanup(open, backdrop);
|
|
7885
8365
|
let t7;
|
|
7886
8366
|
if ($[0] !== onOpenChange) {
|
|
7887
8367
|
t7 = (details) => {
|
|
@@ -8070,7 +8550,7 @@ const Toolbar = (t0) => {
|
|
|
8070
8550
|
} else t2 = $[5];
|
|
8071
8551
|
return t2;
|
|
8072
8552
|
};
|
|
8073
|
-
const Body$
|
|
8553
|
+
const Body$2 = (t0) => {
|
|
8074
8554
|
const $ = (0, react_compiler_runtime.c)(6);
|
|
8075
8555
|
const { style, className, children } = t0;
|
|
8076
8556
|
let t1;
|
|
@@ -8143,7 +8623,7 @@ DsDrawer.Header = Header$2;
|
|
|
8143
8623
|
DsDrawer.Title = Title$1;
|
|
8144
8624
|
DsDrawer.CloseTrigger = CloseTrigger$1;
|
|
8145
8625
|
DsDrawer.Toolbar = Toolbar;
|
|
8146
|
-
DsDrawer.Body = Body$
|
|
8626
|
+
DsDrawer.Body = Body$2;
|
|
8147
8627
|
DsDrawer.Footer = Footer$2;
|
|
8148
8628
|
DsDrawer.Actions = Actions$1;
|
|
8149
8629
|
//#endregion
|
|
@@ -8691,6 +9171,7 @@ const DsModal = (t0) => {
|
|
|
8691
9171
|
const dividers = t2 === void 0 ? false : t2;
|
|
8692
9172
|
const modal = t3 === void 0 ? true : t3;
|
|
8693
9173
|
const closeOnInteractOutside = t4 === void 0 ? false : t4;
|
|
9174
|
+
useArkDialogBodyLockCleanup(open, modal);
|
|
8694
9175
|
let t5;
|
|
8695
9176
|
if ($[0] !== onOpenChange) {
|
|
8696
9177
|
t5 = (details) => {
|
|
@@ -8837,7 +9318,7 @@ const CloseTrigger = (t0) => {
|
|
|
8837
9318
|
} else t2 = $[3];
|
|
8838
9319
|
return t2;
|
|
8839
9320
|
};
|
|
8840
|
-
const Body = (t0) => {
|
|
9321
|
+
const Body$1 = (t0) => {
|
|
8841
9322
|
const $ = (0, react_compiler_runtime.c)(6);
|
|
8842
9323
|
const { style, className, children } = t0;
|
|
8843
9324
|
let t1;
|
|
@@ -8909,7 +9390,7 @@ const Actions = (t0) => {
|
|
|
8909
9390
|
DsModal.Header = Header$1;
|
|
8910
9391
|
DsModal.Title = Title;
|
|
8911
9392
|
DsModal.CloseTrigger = CloseTrigger;
|
|
8912
|
-
DsModal.Body = Body;
|
|
9393
|
+
DsModal.Body = Body$1;
|
|
8913
9394
|
DsModal.Footer = Footer$1;
|
|
8914
9395
|
DsModal.Actions = Actions;
|
|
8915
9396
|
//#endregion
|
|
@@ -12753,66 +13234,50 @@ const DsFormControlDescription = (t0) => {
|
|
|
12753
13234
|
return t2;
|
|
12754
13235
|
};
|
|
12755
13236
|
const DsFormControl = (t0) => {
|
|
12756
|
-
const $ = (0, react_compiler_runtime.c)(
|
|
12757
|
-
const { id, status, label,
|
|
12758
|
-
const
|
|
12759
|
-
const
|
|
13237
|
+
const $ = (0, react_compiler_runtime.c)(23);
|
|
13238
|
+
const { id, status, label, hideLabel: t1, required: t2, slots, message, messageIcon: t3, className, style, children } = t0;
|
|
13239
|
+
const hideLabel = t1 === void 0 ? false : t1;
|
|
13240
|
+
const required = t2 === void 0 ? false : t2;
|
|
13241
|
+
const messageIcon = t3 === void 0 ? "info" : t3;
|
|
12760
13242
|
const generatedId = (0, react.useId)();
|
|
12761
13243
|
const controlId = id || generatedId;
|
|
12762
|
-
let
|
|
13244
|
+
let t4;
|
|
12763
13245
|
if ($[0] !== controlId) {
|
|
12764
|
-
|
|
13246
|
+
t4 = { controlId };
|
|
12765
13247
|
$[0] = controlId;
|
|
12766
|
-
$[1] =
|
|
12767
|
-
} else
|
|
12768
|
-
const
|
|
12769
|
-
let t5;
|
|
12770
|
-
if ($[2] !== className || $[3] !== t4) {
|
|
12771
|
-
t5 = (0, classnames.default)(ds_form_control_module_default.container, className, t4);
|
|
12772
|
-
$[2] = className;
|
|
12773
|
-
$[3] = t4;
|
|
12774
|
-
$[4] = t5;
|
|
12775
|
-
} else t5 = $[4];
|
|
13248
|
+
$[1] = t4;
|
|
13249
|
+
} else t4 = $[1];
|
|
13250
|
+
const t5 = status && message && ds_form_control_module_default[status];
|
|
12776
13251
|
let t6;
|
|
12777
|
-
if ($[
|
|
12778
|
-
t6 = (0, classnames.default)(ds_form_control_module_default.
|
|
12779
|
-
$[
|
|
12780
|
-
$[
|
|
12781
|
-
|
|
13252
|
+
if ($[2] !== className || $[3] !== t5) {
|
|
13253
|
+
t6 = (0, classnames.default)(ds_form_control_module_default.container, className, t5);
|
|
13254
|
+
$[2] = className;
|
|
13255
|
+
$[3] = t5;
|
|
13256
|
+
$[4] = t6;
|
|
13257
|
+
} else t6 = $[4];
|
|
12782
13258
|
let t7;
|
|
12783
|
-
if ($[
|
|
12784
|
-
t7 = /* @__PURE__ */ (0, react_jsx_runtime.
|
|
12785
|
-
|
|
12786
|
-
|
|
12787
|
-
|
|
13259
|
+
if ($[5] !== controlId || $[6] !== hideLabel || $[7] !== label || $[8] !== required || $[9] !== slots) {
|
|
13260
|
+
t7 = !hideLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
13261
|
+
className: ds_form_control_module_default.labelContainer,
|
|
13262
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
|
|
13263
|
+
htmlFor: controlId,
|
|
13264
|
+
className: (0, classnames.default)(ds_form_control_module_default.label, { [ds_form_control_module_default.required]: required }),
|
|
13265
|
+
children: label
|
|
13266
|
+
}), slots?.endAdornment && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
13267
|
+
className: ds_form_control_module_default.endAdornment,
|
|
13268
|
+
children: slots.endAdornment
|
|
13269
|
+
})]
|
|
12788
13270
|
});
|
|
12789
|
-
$[
|
|
12790
|
-
$[
|
|
12791
|
-
$[
|
|
13271
|
+
$[5] = controlId;
|
|
13272
|
+
$[6] = hideLabel;
|
|
13273
|
+
$[7] = label;
|
|
13274
|
+
$[8] = required;
|
|
13275
|
+
$[9] = slots;
|
|
12792
13276
|
$[10] = t7;
|
|
12793
13277
|
} else t7 = $[10];
|
|
12794
13278
|
let t8;
|
|
12795
|
-
if ($[11] !==
|
|
12796
|
-
t8 =
|
|
12797
|
-
className: ds_form_control_module_default.endAdornment,
|
|
12798
|
-
children: slots.endAdornment
|
|
12799
|
-
});
|
|
12800
|
-
$[11] = slots;
|
|
12801
|
-
$[12] = t8;
|
|
12802
|
-
} else t8 = $[12];
|
|
12803
|
-
let t9;
|
|
12804
|
-
if ($[13] !== t7 || $[14] !== t8) {
|
|
12805
|
-
t9 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
12806
|
-
className: ds_form_control_module_default.labelContainer,
|
|
12807
|
-
children: [t7, t8]
|
|
12808
|
-
});
|
|
12809
|
-
$[13] = t7;
|
|
12810
|
-
$[14] = t8;
|
|
12811
|
-
$[15] = t9;
|
|
12812
|
-
} else t9 = $[15];
|
|
12813
|
-
let t10;
|
|
12814
|
-
if ($[16] !== message || $[17] !== messageIcon) {
|
|
12815
|
-
t10 = message && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
13279
|
+
if ($[11] !== message || $[12] !== messageIcon) {
|
|
13280
|
+
t8 = message && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
12816
13281
|
className: ds_form_control_module_default.message,
|
|
12817
13282
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
12818
13283
|
icon: messageIcon,
|
|
@@ -12820,39 +13285,39 @@ const DsFormControl = (t0) => {
|
|
|
12820
13285
|
filled: true
|
|
12821
13286
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: message })]
|
|
12822
13287
|
});
|
|
12823
|
-
$[
|
|
12824
|
-
$[
|
|
12825
|
-
$[
|
|
12826
|
-
} else
|
|
12827
|
-
let
|
|
12828
|
-
if ($[
|
|
12829
|
-
|
|
12830
|
-
className:
|
|
13288
|
+
$[11] = message;
|
|
13289
|
+
$[12] = messageIcon;
|
|
13290
|
+
$[13] = t8;
|
|
13291
|
+
} else t8 = $[13];
|
|
13292
|
+
let t9;
|
|
13293
|
+
if ($[14] !== children || $[15] !== style || $[16] !== t6 || $[17] !== t7 || $[18] !== t8) {
|
|
13294
|
+
t9 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
13295
|
+
className: t6,
|
|
12831
13296
|
style,
|
|
12832
13297
|
children: [
|
|
12833
|
-
|
|
13298
|
+
t7,
|
|
12834
13299
|
children,
|
|
12835
|
-
|
|
13300
|
+
t8
|
|
12836
13301
|
]
|
|
12837
13302
|
});
|
|
12838
|
-
$[
|
|
12839
|
-
$[
|
|
12840
|
-
$[
|
|
12841
|
-
$[
|
|
12842
|
-
$[
|
|
12843
|
-
$[
|
|
12844
|
-
} else
|
|
12845
|
-
let
|
|
12846
|
-
if ($[
|
|
12847
|
-
|
|
12848
|
-
value:
|
|
12849
|
-
children:
|
|
13303
|
+
$[14] = children;
|
|
13304
|
+
$[15] = style;
|
|
13305
|
+
$[16] = t6;
|
|
13306
|
+
$[17] = t7;
|
|
13307
|
+
$[18] = t8;
|
|
13308
|
+
$[19] = t9;
|
|
13309
|
+
} else t9 = $[19];
|
|
13310
|
+
let t10;
|
|
13311
|
+
if ($[20] !== t4 || $[21] !== t9) {
|
|
13312
|
+
t10 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormControlContext.Provider, {
|
|
13313
|
+
value: t4,
|
|
13314
|
+
children: t9
|
|
12850
13315
|
});
|
|
12851
|
-
$[
|
|
12852
|
-
$[
|
|
12853
|
-
$[
|
|
12854
|
-
} else
|
|
12855
|
-
return
|
|
13316
|
+
$[20] = t4;
|
|
13317
|
+
$[21] = t9;
|
|
13318
|
+
$[22] = t10;
|
|
13319
|
+
} else t10 = $[22];
|
|
13320
|
+
return t10;
|
|
12856
13321
|
};
|
|
12857
13322
|
DsFormControl.TextInput = controlify(DsTextInput);
|
|
12858
13323
|
DsFormControl.NumberInput = controlify(DsNumberInput);
|
|
@@ -17730,68 +18195,9 @@ const systemStatuses = [
|
|
|
17730
18195
|
//#endregion
|
|
17731
18196
|
//#region src/components/ds-table/filters/adapters/create-filter-adapter.ts
|
|
17732
18197
|
/**
|
|
17733
|
-
* Base factory
|
|
17734
|
-
*
|
|
17735
|
-
*
|
|
17736
|
-
* Use this when checkbox or dual-range adapters don't fit your requirements.
|
|
17737
|
-
*
|
|
17738
|
-
* ## When to use directly:
|
|
17739
|
-
* - Complex filtering logic (e.g., editor + date range)
|
|
17740
|
-
* - Unique UI that doesn't fit generic patterns
|
|
17741
|
-
* - Combining multiple sub-filters
|
|
17742
|
-
* - Special chip generation requirements
|
|
17743
|
-
*
|
|
17744
|
-
* ## When to use specialized helpers instead:
|
|
17745
|
-
* - **Checkbox filters**: Use `createCheckboxFilterAdapter` for multi-select
|
|
17746
|
-
* - **Range filters**: Use `createDualRangeFilterAdapter` for numeric ranges
|
|
17747
|
-
*
|
|
17748
|
-
* ## Example:
|
|
17749
|
-
* ```typescript
|
|
17750
|
-
* interface MyFilterValue {
|
|
17751
|
-
* users: string[];
|
|
17752
|
-
* dateRange: { from?: Date; to?: Date };
|
|
17753
|
-
* }
|
|
17754
|
-
*
|
|
17755
|
-
* const myFilter = createFilterAdapter<DataType, MyFilterValue>({
|
|
17756
|
-
* id: 'myColumn',
|
|
17757
|
-
* label: 'My Filter',
|
|
17758
|
-
* initialValue: { users: [], dateRange: {} },
|
|
17759
|
-
*
|
|
17760
|
-
* filterFn: (row, columnId, filterValue) => {
|
|
17761
|
-
* // Your custom logic
|
|
17762
|
-
* return matchesUsers && matchesDateRange;
|
|
17763
|
-
* },
|
|
17764
|
-
*
|
|
17765
|
-
* toChips: (value) => {
|
|
17766
|
-
* // Generate chips from your filter value
|
|
17767
|
-
* return chips;
|
|
17768
|
-
* },
|
|
17769
|
-
*
|
|
17770
|
-
* fromChip: (chip, currentValue) => {
|
|
17771
|
-
* // Remove chip's effect from value
|
|
17772
|
-
* return updatedValue;
|
|
17773
|
-
* },
|
|
17774
|
-
*
|
|
17775
|
-
* getActiveFiltersCount: (value) => {
|
|
17776
|
-
* // Count active filters (0 means none active)
|
|
17777
|
-
* return count;
|
|
17778
|
-
* },
|
|
17779
|
-
*
|
|
17780
|
-
* renderFilter: (value, onChange) => (
|
|
17781
|
-
* <YourCustomFilterComponent
|
|
17782
|
-
* value={value}
|
|
17783
|
-
* onChange={onChange}
|
|
17784
|
-
* />
|
|
17785
|
-
* ),
|
|
17786
|
-
* });
|
|
17787
|
-
* ```
|
|
17788
|
-
*
|
|
17789
|
-
* ## Reference Implementation:
|
|
17790
|
-
* See `workflow-filters.config.tsx` for a complete example (lastEditedFilterAdapter).
|
|
17791
|
-
*
|
|
17792
|
-
* ## Note:
|
|
17793
|
-
* Most use cases are covered by `createCheckboxFilterAdapter` or `createDualRangeFilterAdapter`.
|
|
17794
|
-
* Only use this base function directly when you need completely custom filter logic.
|
|
18198
|
+
* Base factory used by every specialized adapter. Reach for it only when
|
|
18199
|
+
* `createCheckboxFilterAdapter` / `createDualRangeFilterAdapter` don't fit
|
|
18200
|
+
* (custom UI, mixed sub-filters, bespoke chip logic).
|
|
17795
18201
|
*/
|
|
17796
18202
|
function createFilterAdapter(config) {
|
|
17797
18203
|
return {
|
|
@@ -17808,31 +18214,78 @@ function createFilterAdapter(config) {
|
|
|
17808
18214
|
};
|
|
17809
18215
|
}
|
|
17810
18216
|
//#endregion
|
|
18217
|
+
//#region src/components/ds-table/filters/components/checkbox-filter/checkbox-filter.module.scss
|
|
18218
|
+
var checkbox_filter_module_default = {
|
|
18219
|
+
"checkboxItem": "H6sVkG_checkboxItem",
|
|
18220
|
+
"empty": "H6sVkG_empty",
|
|
18221
|
+
"list": "H6sVkG_list",
|
|
18222
|
+
"root": "H6sVkG_root"
|
|
18223
|
+
};
|
|
18224
|
+
//#endregion
|
|
17811
18225
|
//#region src/components/ds-table/filters/components/checkbox-filter/checkbox-filter.tsx
|
|
17812
|
-
const CheckboxFilter = ({ items, renderer, selectedItems, onSelectionChange }) => {
|
|
18226
|
+
const CheckboxFilter = ({ items, renderer, selectedItems, onSelectionChange, searchable = false, selectAll = false, locale, className }) => {
|
|
18227
|
+
const { allLabel = "All", searchPlaceholder = "Search", noMatchesLabel = "No matches" } = locale ?? {};
|
|
18228
|
+
const [query, setQuery] = (0, react.useState)("");
|
|
18229
|
+
const visibleItems = searchable ? items.filter((item) => item.label.toLowerCase().includes(query.trim().toLowerCase())) : items;
|
|
17813
18230
|
const handleCheckedChange = (selected, checked) => {
|
|
17814
18231
|
if (checked) onSelectionChange([...selectedItems, selected]);
|
|
17815
18232
|
else onSelectionChange(selectedItems.filter((item) => item.value !== selected.value));
|
|
17816
18233
|
};
|
|
17817
|
-
|
|
17818
|
-
|
|
17819
|
-
|
|
17820
|
-
|
|
17821
|
-
|
|
17822
|
-
|
|
18234
|
+
const visibleSelectedCount = visibleItems.filter((item) => selectedItems.some((selected) => selected.value === item.value)).length;
|
|
18235
|
+
const allVisibleSelected = visibleItems.length > 0 && visibleSelectedCount === visibleItems.length;
|
|
18236
|
+
const someVisibleSelected = visibleSelectedCount > 0 && !allVisibleSelected;
|
|
18237
|
+
const handleSelectAllChange = (next) => {
|
|
18238
|
+
const shouldSelect = next === true;
|
|
18239
|
+
const visibleValues = new Set(visibleItems.map((item) => item.value));
|
|
18240
|
+
const withoutVisible = selectedItems.filter((item) => !visibleValues.has(item.value));
|
|
18241
|
+
onSelectionChange(shouldSelect ? [...withoutVisible, ...visibleItems] : withoutVisible);
|
|
18242
|
+
};
|
|
18243
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
18244
|
+
className: (0, classnames.default)(checkbox_filter_module_default.root, className),
|
|
18245
|
+
children: [searchable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTextInput, {
|
|
18246
|
+
value: query,
|
|
18247
|
+
placeholder: searchPlaceholder,
|
|
18248
|
+
onValueChange: setQuery,
|
|
18249
|
+
slots: { startAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
18250
|
+
icon: "search",
|
|
18251
|
+
size: "tiny"
|
|
18252
|
+
}) }
|
|
18253
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
18254
|
+
className: checkbox_filter_module_default.list,
|
|
18255
|
+
role: "group",
|
|
18256
|
+
children: [
|
|
18257
|
+
selectAll && visibleItems.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
|
|
18258
|
+
className: checkbox_filter_module_default.checkboxItem,
|
|
18259
|
+
label: allLabel,
|
|
18260
|
+
checked: allVisibleSelected ? true : someVisibleSelected ? "indeterminate" : false,
|
|
18261
|
+
onCheckedChange: handleSelectAllChange
|
|
18262
|
+
}),
|
|
18263
|
+
visibleItems.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
18264
|
+
className: checkbox_filter_module_default.empty,
|
|
18265
|
+
children: noMatchesLabel
|
|
18266
|
+
}),
|
|
18267
|
+
visibleItems.map((item) => {
|
|
18268
|
+
const label = renderer ? renderer(item) : item.label;
|
|
18269
|
+
const checked = selectedItems.some((selected) => selected.value === item.value);
|
|
18270
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
|
|
18271
|
+
className: checkbox_filter_module_default.checkboxItem,
|
|
18272
|
+
label,
|
|
18273
|
+
checked,
|
|
18274
|
+
onCheckedChange: (next) => handleCheckedChange(item, next === true)
|
|
18275
|
+
}, JSON.stringify(item.value));
|
|
18276
|
+
})
|
|
18277
|
+
]
|
|
18278
|
+
})]
|
|
17823
18279
|
});
|
|
17824
18280
|
};
|
|
17825
18281
|
//#endregion
|
|
17826
18282
|
//#region src/components/ds-table/filters/adapters/create-checkbox-filter-adapter.tsx
|
|
17827
18283
|
/**
|
|
17828
|
-
*
|
|
17829
|
-
*
|
|
17830
|
-
* Handles multi-select checkbox filtering with inclusion model:
|
|
17831
|
-
* - Empty selection = show all data (no filter active)
|
|
17832
|
-
* - Selected items = show only those items
|
|
18284
|
+
* Multi-select inclusion filter: empty selection shows every row, selected
|
|
18285
|
+
* items show only those rows.
|
|
17833
18286
|
*/
|
|
17834
18287
|
function createCheckboxFilterAdapter(config) {
|
|
17835
|
-
const { id, label, items, renderer, chipLabelTemplate = (item) => `${label}: ${item.label}`, cellRenderer, getRowValue = (row) => row.getValue(id) } = config;
|
|
18288
|
+
const { id, label, items, renderer, chipLabelTemplate = (item) => `${label}: ${item.label}`, cellRenderer, getRowValue = (row) => row.getValue(id), searchable = false, selectAll = false, locale } = config;
|
|
17836
18289
|
return createFilterAdapter({
|
|
17837
18290
|
id,
|
|
17838
18291
|
label,
|
|
@@ -17864,7 +18317,10 @@ function createCheckboxFilterAdapter(config) {
|
|
|
17864
18317
|
items,
|
|
17865
18318
|
renderer,
|
|
17866
18319
|
selectedItems: value,
|
|
17867
|
-
onSelectionChange: onChange
|
|
18320
|
+
onSelectionChange: onChange,
|
|
18321
|
+
searchable,
|
|
18322
|
+
selectAll,
|
|
18323
|
+
locale
|
|
17868
18324
|
});
|
|
17869
18325
|
}
|
|
17870
18326
|
});
|
|
@@ -17949,10 +18405,7 @@ const RangeFilter = ({ label, value, onChange, onClear }) => {
|
|
|
17949
18405
|
};
|
|
17950
18406
|
//#endregion
|
|
17951
18407
|
//#region src/components/ds-table/filters/adapters/create-dual-range-filter-adapter.tsx
|
|
17952
|
-
/**
|
|
17953
|
-
* Factory function to create a dual-range filter adapter
|
|
17954
|
-
* Handles filtering on multiple numeric ranges within a single column
|
|
17955
|
-
*/
|
|
18408
|
+
/** Filter over multiple numeric ranges within one column (AND across fields). */
|
|
17956
18409
|
function createDualRangeFilterAdapter(config) {
|
|
17957
18410
|
const { id, label, fields, formatNumber = (num) => num.toLocaleString("en-US"), getRowValue = (row) => row.getValue(id) } = config;
|
|
17958
18411
|
const initialValue = {};
|
|
@@ -18031,28 +18484,16 @@ function createDualRangeFilterAdapter(config) {
|
|
|
18031
18484
|
}
|
|
18032
18485
|
//#endregion
|
|
18033
18486
|
//#region src/components/ds-table/filters/hooks/use-table-filters.ts
|
|
18487
|
+
const resolveColumnAdapterId = (meta) => {
|
|
18488
|
+
if (!meta) return;
|
|
18489
|
+
if ("render" in meta) return meta.filterId;
|
|
18490
|
+
if (meta.adapter) return meta.adapter.id;
|
|
18491
|
+
return meta.adapterId;
|
|
18492
|
+
};
|
|
18034
18493
|
/**
|
|
18035
|
-
*
|
|
18036
|
-
*
|
|
18037
|
-
*
|
|
18038
|
-
* **Uncontrolled mode** (default): Filters are managed internally.
|
|
18039
|
-
* **Controlled mode**: Filters are managed externally via appliedFilters/onFiltersChange.
|
|
18040
|
-
*
|
|
18041
|
-
* @example
|
|
18042
|
-
* // Uncontrolled mode
|
|
18043
|
-
* const { filterChips, handlers } = useTableFilters({
|
|
18044
|
-
* filterAdapters: adapters,
|
|
18045
|
-
* baseColumns: columns,
|
|
18046
|
-
* });
|
|
18047
|
-
*
|
|
18048
|
-
* @example
|
|
18049
|
-
* // Controlled mode (e.g., URL-driven filtering)
|
|
18050
|
-
* const { filterChips, handlers } = useTableFilters({
|
|
18051
|
-
* filterAdapters: adapters,
|
|
18052
|
-
* baseColumns: columns,
|
|
18053
|
-
* appliedFilters: filtersFromUrl,
|
|
18054
|
-
* onFiltersChange: (filters) => updateUrlAndRefetch(filters),
|
|
18055
|
-
* });
|
|
18494
|
+
* Orchestrates table filtering: drafts → applied state, chips, nav counts, and
|
|
18495
|
+
* column wiring. Uncontrolled by default; pass `appliedFilters` +
|
|
18496
|
+
* `onFiltersChange` for URL-driven / external state.
|
|
18056
18497
|
*/
|
|
18057
18498
|
function useTableFilters({ filterAdapters, baseColumns, appliedFilters: externalAppliedFilters, onFiltersChange: setExternalAppliedFilters }) {
|
|
18058
18499
|
const _filterAdapters = filterAdapters;
|
|
@@ -18087,13 +18528,28 @@ function useTableFilters({ filterAdapters, baseColumns, appliedFilters: external
|
|
|
18087
18528
|
count: adapter.getActiveFiltersCount(draftFilters[adapter.id])
|
|
18088
18529
|
}));
|
|
18089
18530
|
const enhancedColumns = !baseColumns ? [] : baseColumns.map((col) => {
|
|
18090
|
-
const
|
|
18531
|
+
const metaFilter = col.meta?.filter;
|
|
18532
|
+
const adapterIdFromMeta = resolveColumnAdapterId(metaFilter);
|
|
18533
|
+
const adapter = adapterIdFromMeta && _filterAdapters.find((a) => a.id === adapterIdFromMeta) || _filterAdapters.find((a) => a.id === col.id);
|
|
18091
18534
|
if (!adapter) return col;
|
|
18092
18535
|
const cellRenderer = adapter.cellRenderer;
|
|
18536
|
+
const appliedValue = appliedFilters[adapter.id];
|
|
18537
|
+
const resolvedFilter = metaFilter ? {
|
|
18538
|
+
filterId: adapter.id,
|
|
18539
|
+
hasActiveFilter: appliedValue !== void 0 && adapter.getActiveFiltersCount(appliedValue) > 0,
|
|
18540
|
+
render: () => renderForId(adapter.id),
|
|
18541
|
+
onApply: () => applyColumnFilter(adapter.id),
|
|
18542
|
+
onClear: () => clearColumnFilter(adapter.id),
|
|
18543
|
+
onCancel: () => cancelColumnFilter(adapter.id)
|
|
18544
|
+
} : void 0;
|
|
18093
18545
|
return {
|
|
18094
18546
|
...col,
|
|
18095
18547
|
filterFn: adapter.columnFilterFn,
|
|
18096
|
-
...cellRenderer && { cell: (info) => cellRenderer(info.getValue()) }
|
|
18548
|
+
...cellRenderer && { cell: (info) => cellRenderer(info.getValue()) },
|
|
18549
|
+
...resolvedFilter && { meta: {
|
|
18550
|
+
...col.meta,
|
|
18551
|
+
filter: resolvedFilter
|
|
18552
|
+
} }
|
|
18097
18553
|
};
|
|
18098
18554
|
});
|
|
18099
18555
|
const updateFilter = (filterId, value) => {
|
|
@@ -18114,6 +18570,29 @@ function useTableFilters({ filterAdapters, baseColumns, appliedFilters: external
|
|
|
18114
18570
|
setPendingFilters({});
|
|
18115
18571
|
setAppliedFilters({});
|
|
18116
18572
|
};
|
|
18573
|
+
const omitKey = (source, filterId) => Object.fromEntries(Object.entries(source).filter(([key]) => key !== filterId));
|
|
18574
|
+
const applyColumnFilter = (filterId) => {
|
|
18575
|
+
const adapter = _filterAdapters.find((a) => a.id === filterId);
|
|
18576
|
+
if (!adapter) return;
|
|
18577
|
+
const draftValue = draftFilters[filterId];
|
|
18578
|
+
setAppliedFilters(adapter.getActiveFiltersCount(draftValue) > 0 ? {
|
|
18579
|
+
...appliedFilters,
|
|
18580
|
+
[filterId]: draftValue
|
|
18581
|
+
} : omitKey(appliedFilters, filterId));
|
|
18582
|
+
setPendingFilters((prev) => omitKey(prev, filterId));
|
|
18583
|
+
};
|
|
18584
|
+
const cancelColumnFilter = (filterId) => {
|
|
18585
|
+
setPendingFilters((prev) => omitKey(prev, filterId));
|
|
18586
|
+
};
|
|
18587
|
+
const clearColumnFilter = (filterId) => {
|
|
18588
|
+
const adapter = _filterAdapters.find((a) => a.id === filterId);
|
|
18589
|
+
if (!adapter) return;
|
|
18590
|
+
setPendingFilters((prev) => ({
|
|
18591
|
+
...omitKey(prev, filterId),
|
|
18592
|
+
[filterId]: adapter.initialValue
|
|
18593
|
+
}));
|
|
18594
|
+
if (appliedFilters[filterId] !== void 0) setAppliedFilters(omitKey(appliedFilters, filterId));
|
|
18595
|
+
};
|
|
18117
18596
|
const deleteChip = (chip) => {
|
|
18118
18597
|
const filterKey = typeof chip.metadata?.key === "string" ? chip.metadata.key : void 0;
|
|
18119
18598
|
if (!filterKey) return;
|
|
@@ -18127,13 +18606,15 @@ function useTableFilters({ filterAdapters, baseColumns, appliedFilters: external
|
|
|
18127
18606
|
[filterKey]: newValue
|
|
18128
18607
|
});
|
|
18129
18608
|
};
|
|
18130
|
-
const
|
|
18131
|
-
const adapter = _filterAdapters.find((a) => a.id ===
|
|
18609
|
+
const renderForId = (filterId) => {
|
|
18610
|
+
const adapter = _filterAdapters.find((a) => a.id === filterId);
|
|
18132
18611
|
if (!adapter) return null;
|
|
18133
18612
|
const value = draftFilters[adapter.id];
|
|
18134
18613
|
const onChange = (newValue) => updateFilter(adapter.id, newValue);
|
|
18135
18614
|
return adapter.renderFilter(value, onChange);
|
|
18136
18615
|
};
|
|
18616
|
+
const renderFilterContent = (selectedFilter) => renderForId(selectedFilter.id);
|
|
18617
|
+
const renderColumnFilter = (filterId) => renderForId(filterId);
|
|
18137
18618
|
return {
|
|
18138
18619
|
filterState: draftFilters,
|
|
18139
18620
|
columnFilters,
|
|
@@ -18144,12 +18625,94 @@ function useTableFilters({ filterAdapters, baseColumns, appliedFilters: external
|
|
|
18144
18625
|
updateFilter,
|
|
18145
18626
|
applyFilters,
|
|
18146
18627
|
clearAll,
|
|
18147
|
-
deleteChip
|
|
18628
|
+
deleteChip,
|
|
18629
|
+
applyColumnFilter,
|
|
18630
|
+
cancelColumnFilter,
|
|
18631
|
+
clearColumnFilter
|
|
18148
18632
|
},
|
|
18149
|
-
renderFilterContent
|
|
18633
|
+
renderFilterContent,
|
|
18634
|
+
renderColumnFilter
|
|
18150
18635
|
};
|
|
18151
18636
|
}
|
|
18152
18637
|
//#endregion
|
|
18638
|
+
//#region src/components/ds-table/filters/components/column-filter-popover/column-filter-popover.module.scss
|
|
18639
|
+
var column_filter_popover_module_default = {
|
|
18640
|
+
"body": "_0oV9a_body",
|
|
18641
|
+
"content": "_0oV9a_content",
|
|
18642
|
+
"footer": "_0oV9a_footer",
|
|
18643
|
+
"trigger": "_0oV9a_trigger",
|
|
18644
|
+
"triggerActive": "_0oV9a_triggerActive",
|
|
18645
|
+
"triggerOpen": "_0oV9a_triggerOpen"
|
|
18646
|
+
};
|
|
18647
|
+
//#endregion
|
|
18648
|
+
//#region src/components/ds-table/filters/components/column-filter-popover/column-filter-popover.tsx
|
|
18649
|
+
const stopPropagation = (event) => event.stopPropagation();
|
|
18650
|
+
/**
|
|
18651
|
+
* Per-column filter popover anchored to a header cell: funnel trigger,
|
|
18652
|
+
* adapter UI as the body, Clear / Save footer wired to `useTableFilters`.
|
|
18653
|
+
*/
|
|
18654
|
+
const DsTableColumnFilterPopover = ({ children, hasActiveFilter, onApply, onClear, onCancel, locale, className }) => {
|
|
18655
|
+
const { triggerAriaLabel = "Filter column", clearLabel = "Clear", saveLabel = "Save" } = locale ?? {};
|
|
18656
|
+
const [open, setOpen] = (0, react.useState)(false);
|
|
18657
|
+
const handleOpenChange = (details) => {
|
|
18658
|
+
if (open && !details.open) onCancel();
|
|
18659
|
+
setOpen(details.open);
|
|
18660
|
+
};
|
|
18661
|
+
const handleSave = () => {
|
|
18662
|
+
onApply();
|
|
18663
|
+
setOpen(false);
|
|
18664
|
+
};
|
|
18665
|
+
const handleClear = () => {
|
|
18666
|
+
onClear();
|
|
18667
|
+
setOpen(false);
|
|
18668
|
+
};
|
|
18669
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ark_ui_react_popover.Popover.Root, {
|
|
18670
|
+
open,
|
|
18671
|
+
onOpenChange: handleOpenChange,
|
|
18672
|
+
positioning: {
|
|
18673
|
+
placement: "bottom-end",
|
|
18674
|
+
gutter: 4
|
|
18675
|
+
},
|
|
18676
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_popover.Popover.Trigger, {
|
|
18677
|
+
asChild: true,
|
|
18678
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsButtonV3, {
|
|
18679
|
+
variant: "tertiary",
|
|
18680
|
+
size: "tiny",
|
|
18681
|
+
className: (0, classnames.default)(column_filter_popover_module_default.trigger, hasActiveFilter && column_filter_popover_module_default.triggerActive, open && column_filter_popover_module_default.triggerOpen),
|
|
18682
|
+
"aria-label": triggerAriaLabel,
|
|
18683
|
+
"data-active": hasActiveFilter ? "true" : void 0,
|
|
18684
|
+
onClick: (event) => event.stopPropagation(),
|
|
18685
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
18686
|
+
icon: "filter_alt",
|
|
18687
|
+
variant: "outlined",
|
|
18688
|
+
filled: hasActiveFilter,
|
|
18689
|
+
size: "tiny"
|
|
18690
|
+
})
|
|
18691
|
+
})
|
|
18692
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_portal.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ark_ui_react_popover.Popover.Positioner, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ark_ui_react_popover.Popover.Content, {
|
|
18693
|
+
className: (0, classnames.default)(column_filter_popover_module_default.content, className),
|
|
18694
|
+
onClick: stopPropagation,
|
|
18695
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
18696
|
+
className: column_filter_popover_module_default.body,
|
|
18697
|
+
children
|
|
18698
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
18699
|
+
className: column_filter_popover_module_default.footer,
|
|
18700
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsButtonV3, {
|
|
18701
|
+
variant: "secondary",
|
|
18702
|
+
size: "small",
|
|
18703
|
+
onClick: handleClear,
|
|
18704
|
+
children: clearLabel
|
|
18705
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsButtonV3, {
|
|
18706
|
+
variant: "primary",
|
|
18707
|
+
size: "small",
|
|
18708
|
+
onClick: handleSave,
|
|
18709
|
+
children: saveLabel
|
|
18710
|
+
})]
|
|
18711
|
+
})]
|
|
18712
|
+
}) }) })]
|
|
18713
|
+
});
|
|
18714
|
+
};
|
|
18715
|
+
//#endregion
|
|
18153
18716
|
//#region src/components/ds-table/components/core-table/core-table.module.scss
|
|
18154
18717
|
var core_table_module_default = {
|
|
18155
18718
|
"table": "JP3Vta_table",
|
|
@@ -18286,6 +18849,9 @@ const DsTableBulkActions = ({ numSelectedRows, actions, onClearSelection }) => {
|
|
|
18286
18849
|
//#endregion
|
|
18287
18850
|
//#region src/components/ds-table/components/ds-table-header/ds-table-header.module.scss
|
|
18288
18851
|
var ds_table_header_module_default = {
|
|
18852
|
+
"filterableHeader": "-2rCNG_filterableHeader",
|
|
18853
|
+
"filterActive": "-2rCNG_filterActive",
|
|
18854
|
+
"filterTriggerContainer": "-2rCNG_filterTriggerContainer",
|
|
18289
18855
|
"headerCell": "-2rCNG_headerCell",
|
|
18290
18856
|
"headerRow": "-2rCNG_headerRow",
|
|
18291
18857
|
"headerRowNoBorder": "-2rCNG_headerRowNoBorder",
|
|
@@ -18320,18 +18886,83 @@ const useDsTableContext = () => {
|
|
|
18320
18886
|
if (!context) throw new Error("useDsTableContext must be used within DsTable");
|
|
18321
18887
|
return context;
|
|
18322
18888
|
};
|
|
18889
|
+
/**
|
|
18890
|
+
* Hoisted editing state for single-cell-at-a-time inline editing.
|
|
18891
|
+
* Lives on {@link DsTableContext} so cell renderers and editors share one provider.
|
|
18892
|
+
*/
|
|
18893
|
+
const useEditingState = (onCellEdit, onCellValidate) => {
|
|
18894
|
+
const [editing, setEditing] = (0, react.useState)(null);
|
|
18895
|
+
const onCellEditRef = (0, react.useRef)(onCellEdit);
|
|
18896
|
+
onCellEditRef.current = onCellEdit;
|
|
18897
|
+
const onCellValidateRef = (0, react.useRef)(onCellValidate);
|
|
18898
|
+
onCellValidateRef.current = onCellValidate;
|
|
18899
|
+
const editingRef = (0, react.useRef)(editing);
|
|
18900
|
+
editingRef.current = editing;
|
|
18901
|
+
return {
|
|
18902
|
+
editing,
|
|
18903
|
+
beginEdit: (0, react.useCallback)((cell) => {
|
|
18904
|
+
const current = editingRef.current;
|
|
18905
|
+
if (current) {
|
|
18906
|
+
if (current.cell.row.id === cell.row.id && current.cell.column.id === cell.column.id) return;
|
|
18907
|
+
}
|
|
18908
|
+
setEditing({
|
|
18909
|
+
cell,
|
|
18910
|
+
draftValue: cell.getValue(),
|
|
18911
|
+
error: null
|
|
18912
|
+
});
|
|
18913
|
+
}, []),
|
|
18914
|
+
setDraft: (0, react.useCallback)((value) => {
|
|
18915
|
+
const current = editingRef.current;
|
|
18916
|
+
if (!current) return;
|
|
18917
|
+
setEditing({
|
|
18918
|
+
...current,
|
|
18919
|
+
draftValue: value,
|
|
18920
|
+
error: null
|
|
18921
|
+
});
|
|
18922
|
+
}, []),
|
|
18923
|
+
commit: (0, react.useCallback)((overrideValue) => {
|
|
18924
|
+
const current = editingRef.current;
|
|
18925
|
+
if (!current) return;
|
|
18926
|
+
const valueToCommit = overrideValue !== void 0 ? overrideValue : current.draftValue;
|
|
18927
|
+
const error = onCellValidateRef.current?.(current.cell.row.original, current.cell.column.id, valueToCommit) ?? null;
|
|
18928
|
+
if (error !== null) {
|
|
18929
|
+
setEditing({
|
|
18930
|
+
...current,
|
|
18931
|
+
draftValue: valueToCommit,
|
|
18932
|
+
error
|
|
18933
|
+
});
|
|
18934
|
+
return;
|
|
18935
|
+
}
|
|
18936
|
+
onCellEditRef.current?.(current.cell.row.original, current.cell.column.id, valueToCommit);
|
|
18937
|
+
setEditing(null);
|
|
18938
|
+
}, []),
|
|
18939
|
+
cancel: (0, react.useCallback)(() => {
|
|
18940
|
+
setEditing(null);
|
|
18941
|
+
}, [])
|
|
18942
|
+
};
|
|
18943
|
+
};
|
|
18323
18944
|
//#endregion
|
|
18324
18945
|
//#region src/components/ds-table/utils/column-size.ts
|
|
18325
18946
|
/**
|
|
18326
|
-
* Generates the appropriate style object for a table column/cell based on its size
|
|
18947
|
+
* Generates the appropriate style object for a table column/cell based on its size
|
|
18948
|
+
*
|
|
18949
|
+
* Custom-sized columns get a fixed `width` plus `minWidth` and `flexShrink: 0` so
|
|
18950
|
+
* they enforce horizontal overflow on the table container. Default-sized columns
|
|
18951
|
+
* grow to fill the row evenly via `flex: 1`.
|
|
18327
18952
|
*
|
|
18328
18953
|
* @param columnSize - The size of the column
|
|
18329
|
-
* @
|
|
18330
|
-
* @returns Style object or undefined if no custom styling is needed
|
|
18954
|
+
* @returns Style object for the column/cell
|
|
18331
18955
|
*/
|
|
18332
|
-
const getColumnSizeStyle = (columnSize
|
|
18333
|
-
if (columnSize !== _tanstack_react_table.defaultColumnSizing.size) return {
|
|
18334
|
-
|
|
18956
|
+
const getColumnSizeStyle = (columnSize) => {
|
|
18957
|
+
if (columnSize !== _tanstack_react_table.defaultColumnSizing.size) return {
|
|
18958
|
+
width: columnSize,
|
|
18959
|
+
minWidth: columnSize,
|
|
18960
|
+
flexShrink: 0
|
|
18961
|
+
};
|
|
18962
|
+
return {
|
|
18963
|
+
flex: 1,
|
|
18964
|
+
minWidth: 0
|
|
18965
|
+
};
|
|
18335
18966
|
};
|
|
18336
18967
|
/**
|
|
18337
18968
|
* Column id used for the synthetic expander column injected when `expandable` is set.
|
|
@@ -18355,33 +18986,49 @@ const DsTableHeader = ({ table }) => {
|
|
|
18355
18986
|
children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, {
|
|
18356
18987
|
className: (0, classnames.default)(ds_table_header_module_default.headerRow, !bordered && ds_table_header_module_default.headerRowNoBorder, virtualized && ds_table_header_module_default.headerRowVirtualized),
|
|
18357
18988
|
children: headerGroup.headers.map((header) => {
|
|
18358
|
-
const headerStyle = getColumnSizeStyle(header.column.getSize()
|
|
18989
|
+
const headerStyle = getColumnSizeStyle(header.column.getSize());
|
|
18359
18990
|
const canSort = header.column.getCanSort();
|
|
18360
18991
|
const isSelectColumn = header.column.id === SELECT_COLUMN_ID;
|
|
18992
|
+
const metaFilter = header.column.columnDef.meta?.filter;
|
|
18993
|
+
const resolvedFilter = metaFilter && "render" in metaFilter ? metaFilter : void 0;
|
|
18994
|
+
const hasActiveColumnFilter = resolvedFilter?.hasActiveFilter ?? false;
|
|
18361
18995
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHead, {
|
|
18362
|
-
className: (0, classnames.default)(ds_table_header_module_default.headerCell, canSort && ds_table_header_module_default.sortableHeader, isSelectColumn && ds_table_header_module_default.selectHeaderCell),
|
|
18996
|
+
className: (0, classnames.default)(ds_table_header_module_default.headerCell, canSort && ds_table_header_module_default.sortableHeader, isSelectColumn && ds_table_header_module_default.selectHeaderCell, resolvedFilter && ds_table_header_module_default.filterableHeader, hasActiveColumnFilter && ds_table_header_module_default.filterActive),
|
|
18363
18997
|
onClick: header.column.getToggleSortingHandler(),
|
|
18364
18998
|
style: headerStyle,
|
|
18365
18999
|
children: header.isPlaceholder ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
18366
19000
|
className: ds_table_header_module_default.headerSortContainer,
|
|
18367
|
-
children: [
|
|
18368
|
-
|
|
18369
|
-
|
|
18370
|
-
|
|
18371
|
-
|
|
18372
|
-
|
|
18373
|
-
|
|
18374
|
-
|
|
18375
|
-
|
|
18376
|
-
|
|
18377
|
-
|
|
18378
|
-
|
|
18379
|
-
|
|
18380
|
-
|
|
18381
|
-
|
|
19001
|
+
children: [
|
|
19002
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsStack, {
|
|
19003
|
+
direction: "column",
|
|
19004
|
+
justifyContent: "center",
|
|
19005
|
+
width: "100%",
|
|
19006
|
+
children: (0, _tanstack_react_table.flexRender)(header.column.columnDef.header, header.getContext())
|
|
19007
|
+
}),
|
|
19008
|
+
canSort && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
19009
|
+
className: ds_table_header_module_default.pageButtonIconContainer,
|
|
19010
|
+
children: {
|
|
19011
|
+
asc: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
19012
|
+
icon: "arrow_drop_up",
|
|
19013
|
+
className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon)
|
|
19014
|
+
}),
|
|
19015
|
+
desc: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
19016
|
+
icon: "arrow_drop_down",
|
|
19017
|
+
className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon)
|
|
19018
|
+
})
|
|
19019
|
+
}[header.column.getIsSorted()] ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon) })
|
|
19020
|
+
}),
|
|
19021
|
+
resolvedFilter && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
19022
|
+
className: ds_table_header_module_default.filterTriggerContainer,
|
|
19023
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableColumnFilterPopover, {
|
|
19024
|
+
hasActiveFilter: resolvedFilter.hasActiveFilter,
|
|
19025
|
+
onApply: resolvedFilter.onApply,
|
|
19026
|
+
onClear: resolvedFilter.onClear,
|
|
19027
|
+
onCancel: resolvedFilter.onCancel,
|
|
19028
|
+
children: resolvedFilter.render()
|
|
18382
19029
|
})
|
|
18383
|
-
}
|
|
18384
|
-
|
|
19030
|
+
})
|
|
19031
|
+
]
|
|
18385
19032
|
})
|
|
18386
19033
|
}, header.id);
|
|
18387
19034
|
})
|
|
@@ -18396,20 +19043,124 @@ var ds_table_module_default = {
|
|
|
18396
19043
|
"dataTableContainer": "iL9mtW_dataTableContainer",
|
|
18397
19044
|
"emptyState": "iL9mtW_emptyState",
|
|
18398
19045
|
"fullWidth": "iL9mtW_fullWidth",
|
|
18399
|
-
"
|
|
18400
|
-
"rotate-135": "iL9mtW_rotate-135",
|
|
18401
|
-
"rotate-180": "iL9mtW_rotate-180",
|
|
18402
|
-
"rotate-225": "iL9mtW_rotate-225",
|
|
18403
|
-
"rotate-270": "iL9mtW_rotate-270",
|
|
18404
|
-
"rotate-315": "iL9mtW_rotate-315",
|
|
18405
|
-
"rotate-45": "iL9mtW_rotate-45",
|
|
18406
|
-
"rotate-90": "iL9mtW_rotate-90",
|
|
19046
|
+
"scrollbar-thin": "iL9mtW_scrollbar-thin",
|
|
18407
19047
|
"table": "iL9mtW_table",
|
|
18408
19048
|
"tableNoBorder": "iL9mtW_tableNoBorder",
|
|
18409
|
-
"virtualized": "iL9mtW_virtualized",
|
|
18410
19049
|
"virtualizedContainer": "iL9mtW_virtualizedContainer"
|
|
18411
19050
|
};
|
|
18412
19051
|
//#endregion
|
|
19052
|
+
//#region src/components/ds-table/components/edit/ds-table-editable-cell/ds-table-editable-cell.module.scss
|
|
19053
|
+
var ds_table_editable_cell_module_default = {
|
|
19054
|
+
"editButton": "g5FEoW_editButton",
|
|
19055
|
+
"root": "g5FEoW_root"
|
|
19056
|
+
};
|
|
19057
|
+
//#endregion
|
|
19058
|
+
//#region src/components/ds-table/components/edit/ds-table-editable-cell/ds-table-editable-cell.tsx
|
|
19059
|
+
const DsTableEditableCell = ({ cell, children }) => {
|
|
19060
|
+
const { beginEdit, editing } = useDsTableContext();
|
|
19061
|
+
const isEditing = editing !== null && editing.cell.row.id === cell.row.id && editing.cell.column.id === cell.column.id;
|
|
19062
|
+
const handleEdit = (event) => {
|
|
19063
|
+
event.stopPropagation();
|
|
19064
|
+
beginEdit(cell);
|
|
19065
|
+
};
|
|
19066
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
19067
|
+
className: ds_table_editable_cell_module_default.root,
|
|
19068
|
+
"data-active": isEditing ? "" : void 0,
|
|
19069
|
+
onDoubleClick: handleEdit,
|
|
19070
|
+
tabIndex: 0,
|
|
19071
|
+
role: "button",
|
|
19072
|
+
"aria-label": "Double-click to edit",
|
|
19073
|
+
children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsButtonV3, {
|
|
19074
|
+
className: ds_table_editable_cell_module_default.editButton,
|
|
19075
|
+
variant: "tertiary",
|
|
19076
|
+
size: "small",
|
|
19077
|
+
icon: "edit",
|
|
19078
|
+
"aria-label": "Edit cell",
|
|
19079
|
+
onClick: handleEdit
|
|
19080
|
+
})]
|
|
19081
|
+
});
|
|
19082
|
+
};
|
|
19083
|
+
//#endregion
|
|
19084
|
+
//#region src/components/ds-table/components/edit/ds-table-editing-cell/ds-table-editing-cell.module.scss
|
|
19085
|
+
var ds_table_editing_cell_module_default = {
|
|
19086
|
+
"actions": "-EpLaa_actions",
|
|
19087
|
+
"editAnchor": "-EpLaa_editAnchor",
|
|
19088
|
+
"overlay": "-EpLaa_overlay",
|
|
19089
|
+
"row": "-EpLaa_row",
|
|
19090
|
+
"slot": "-EpLaa_slot"
|
|
19091
|
+
};
|
|
19092
|
+
//#endregion
|
|
19093
|
+
//#region src/components/ds-table/components/edit/ds-table-editing-cell/ds-table-editing-cell.tsx
|
|
19094
|
+
const DsTableEditingCell = ({ cell }) => {
|
|
19095
|
+
const { commit, cancel } = useDsTableContext();
|
|
19096
|
+
const columnDef = cell.column.columnDef;
|
|
19097
|
+
const editAnchorRef = (0, react.useRef)(null);
|
|
19098
|
+
const handleSubmit = (event) => {
|
|
19099
|
+
event.preventDefault();
|
|
19100
|
+
event.stopPropagation();
|
|
19101
|
+
commit();
|
|
19102
|
+
};
|
|
19103
|
+
(0, react.useEffect)(() => {
|
|
19104
|
+
const handleKeyDown = (event) => {
|
|
19105
|
+
if (event.key !== "Escape") return;
|
|
19106
|
+
if (!editAnchorRef.current?.contains(document.activeElement)) return;
|
|
19107
|
+
event.preventDefault();
|
|
19108
|
+
event.stopPropagation();
|
|
19109
|
+
cancel();
|
|
19110
|
+
};
|
|
19111
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
19112
|
+
return () => {
|
|
19113
|
+
document.removeEventListener("keydown", handleKeyDown);
|
|
19114
|
+
};
|
|
19115
|
+
}, [cancel]);
|
|
19116
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
19117
|
+
ref: editAnchorRef,
|
|
19118
|
+
className: ds_table_editing_cell_module_default.editAnchor,
|
|
19119
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("form", {
|
|
19120
|
+
className: ds_table_editing_cell_module_default.overlay,
|
|
19121
|
+
onSubmit: handleSubmit,
|
|
19122
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DsStack, {
|
|
19123
|
+
direction: "row",
|
|
19124
|
+
gap: "var(--3xs)",
|
|
19125
|
+
alignItems: "flex-start",
|
|
19126
|
+
width: "100%",
|
|
19127
|
+
className: ds_table_editing_cell_module_default.row,
|
|
19128
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsStack, {
|
|
19129
|
+
flex: "1 1 auto",
|
|
19130
|
+
className: ds_table_editing_cell_module_default.slot,
|
|
19131
|
+
children: columnDef.editCell ? (0, _tanstack_react_table.flexRender)(columnDef.editCell, cell.getContext()) : null
|
|
19132
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DsStack, {
|
|
19133
|
+
direction: "row",
|
|
19134
|
+
gap: "var(--3xs)",
|
|
19135
|
+
className: ds_table_editing_cell_module_default.actions,
|
|
19136
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsButtonV3, {
|
|
19137
|
+
type: "button",
|
|
19138
|
+
variant: "tertiary",
|
|
19139
|
+
size: "small",
|
|
19140
|
+
icon: "close",
|
|
19141
|
+
"aria-label": "Cancel edit",
|
|
19142
|
+
onClick: (event) => {
|
|
19143
|
+
event.stopPropagation();
|
|
19144
|
+
cancel();
|
|
19145
|
+
},
|
|
19146
|
+
style: { color: "var(--icon-error)" }
|
|
19147
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsButtonV3, {
|
|
19148
|
+
type: "submit",
|
|
19149
|
+
variant: "tertiary",
|
|
19150
|
+
size: "small",
|
|
19151
|
+
icon: "check",
|
|
19152
|
+
"aria-label": "Confirm edit",
|
|
19153
|
+
onClick: (event) => {
|
|
19154
|
+
event.stopPropagation();
|
|
19155
|
+
},
|
|
19156
|
+
style: { color: "var(--icon-success)" }
|
|
19157
|
+
})]
|
|
19158
|
+
})]
|
|
19159
|
+
})
|
|
19160
|
+
})
|
|
19161
|
+
});
|
|
19162
|
+
};
|
|
19163
|
+
//#endregion
|
|
18413
19164
|
//#region src/components/ds-table/components/ds-table-cell/ds-table-cell.module.scss
|
|
18414
19165
|
var ds_table_cell_module_default = {
|
|
18415
19166
|
"cellActions": "UprPSq_cellActions",
|
|
@@ -18421,20 +19172,19 @@ var ds_table_cell_module_default = {
|
|
|
18421
19172
|
};
|
|
18422
19173
|
//#endregion
|
|
18423
19174
|
//#region src/components/ds-table/components/ds-table-cell/ds-table-cell.tsx
|
|
18424
|
-
const DsDefaultTableCell = ({ cell }) => {
|
|
18425
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
18426
|
-
className: ds_table_cell_module_default.tableCellEllipsis,
|
|
18427
|
-
children: (0, _tanstack_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
|
|
18428
|
-
});
|
|
18429
|
-
};
|
|
18430
19175
|
const DsTableCell = ({ row, cell, primaryRowActions = [], secondaryRowActions = [] }) => {
|
|
19176
|
+
const { editing } = useDsTableContext();
|
|
19177
|
+
const isCellBeingEdited = editing !== null && editing.cell.row.id === row.id && editing.cell.column.id === cell.column.id;
|
|
18431
19178
|
const visiblePrimary = primaryRowActions.filter((action) => !action.hidden?.(row.original));
|
|
18432
19179
|
const visibleSecondary = secondaryRowActions.filter((action) => !action.hidden?.(row.original));
|
|
18433
|
-
if (visiblePrimary.length || visibleSecondary.length) {
|
|
19180
|
+
if (!isCellBeingEdited && (visiblePrimary.length || visibleSecondary.length)) {
|
|
18434
19181
|
const hasSecondaryRowActions = visibleSecondary.length > 0;
|
|
18435
19182
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
18436
19183
|
className: ds_table_cell_module_default.lastCell,
|
|
18437
|
-
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
19184
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CellContent, {
|
|
19185
|
+
cell,
|
|
19186
|
+
isCellBeingEdited
|
|
19187
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
18438
19188
|
className: ds_table_cell_module_default.cellActions,
|
|
18439
19189
|
children: [visiblePrimary.map((action, i) => {
|
|
18440
19190
|
const isDisabled = action.disabled?.(row.original);
|
|
@@ -18485,13 +19235,32 @@ const DsTableCell = ({ row, cell, primaryRowActions = [], secondaryRowActions =
|
|
|
18485
19235
|
})]
|
|
18486
19236
|
});
|
|
18487
19237
|
}
|
|
18488
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
19238
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CellContent, {
|
|
19239
|
+
cell,
|
|
19240
|
+
isCellBeingEdited
|
|
19241
|
+
});
|
|
19242
|
+
};
|
|
19243
|
+
const CellContent = ({ cell, isCellBeingEdited }) => {
|
|
19244
|
+
const isEditable = typeof cell.column.columnDef.editCell === "function";
|
|
19245
|
+
if (isCellBeingEdited) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableEditingCell, { cell });
|
|
19246
|
+
if (isEditable) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableEditableCell, {
|
|
19247
|
+
cell,
|
|
19248
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
19249
|
+
className: ds_table_cell_module_default.tableCellEllipsis,
|
|
19250
|
+
children: (0, _tanstack_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
|
|
19251
|
+
})
|
|
19252
|
+
});
|
|
19253
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
19254
|
+
className: ds_table_cell_module_default.tableCellEllipsis,
|
|
19255
|
+
children: (0, _tanstack_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
|
|
19256
|
+
});
|
|
18489
19257
|
};
|
|
18490
19258
|
//#endregion
|
|
18491
19259
|
//#region src/components/ds-table/components/ds-table-row/ds-table-row.module.scss
|
|
18492
19260
|
var ds_table_row_module_default = {
|
|
18493
19261
|
"cellReorder": "t8OZCq_cellReorder",
|
|
18494
19262
|
"clickableRow": "t8OZCq_clickableRow",
|
|
19263
|
+
"editableCell": "t8OZCq_editableCell",
|
|
18495
19264
|
"expandableCell": "t8OZCq_expandableCell",
|
|
18496
19265
|
"expanded": "t8OZCq_expanded",
|
|
18497
19266
|
"expandedRow": "t8OZCq_expandedRow",
|
|
@@ -18560,7 +19329,7 @@ const DsTableRow = ({ ref, row, isSelected }) => {
|
|
|
18560
19329
|
}, cell.id);
|
|
18561
19330
|
const isLastColumn = idx === row.getVisibleCells().length - 1;
|
|
18562
19331
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
|
|
18563
|
-
className: (0, classnames.default)(ds_table_row_module_default.tableCell, cell.column.id === "expander" && ds_table_row_module_default.expandableCell, cell.column.id === "select" && ds_table_row_module_default.selectableCell),
|
|
19332
|
+
className: (0, classnames.default)(ds_table_row_module_default.tableCell, cell.column.id === "expander" && ds_table_row_module_default.expandableCell, cell.column.id === "select" && ds_table_row_module_default.selectableCell, typeof cell.column.columnDef.editCell === "function" && ds_table_row_module_default.editableCell),
|
|
18564
19333
|
style: cellStyle,
|
|
18565
19334
|
children: isLastColumn ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
|
|
18566
19335
|
row,
|
|
@@ -18680,13 +19449,16 @@ function useDragAndDrop({ isDragEnabled, onOrderChange, items }) {
|
|
|
18680
19449
|
//#region src/components/ds-table/components/ds-table-body-virtualized/ds-table-body-virtualized.module.scss
|
|
18681
19450
|
var ds_table_body_virtualized_module_default = {
|
|
18682
19451
|
"body": "vRRk8q_body",
|
|
18683
|
-
"emptyState": "vRRk8q_emptyState"
|
|
19452
|
+
"emptyState": "vRRk8q_emptyState",
|
|
19453
|
+
"scrollbar-thin": "vRRk8q_scrollbar-thin",
|
|
19454
|
+
"sentinel": "vRRk8q_sentinel"
|
|
18684
19455
|
};
|
|
18685
19456
|
//#endregion
|
|
18686
19457
|
//#region src/components/ds-table/components/ds-table-row-virtualized/ds-table-row-virtualized.module.scss
|
|
18687
19458
|
var ds_table_row_virtualized_module_default = {
|
|
18688
19459
|
"cell": "NcME7q_cell",
|
|
18689
19460
|
"clickableRow": "NcME7q_clickableRow",
|
|
19461
|
+
"editableCell": "NcME7q_editableCell",
|
|
18690
19462
|
"expandableCell": "NcME7q_expandableCell",
|
|
18691
19463
|
"expanded": "NcME7q_expanded",
|
|
18692
19464
|
"expandedRow": "NcME7q_expandedRow",
|
|
@@ -18726,8 +19498,8 @@ const DsTableRowVirtualized = ({ row, isSelected, rowsMapRef, rowHeightsMapRef,
|
|
|
18726
19498
|
children: isExpandedRowContent ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, { children: renderExpandedRow?.(row.original) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: row.getVisibleCells().map((cell, idx) => {
|
|
18727
19499
|
const isLastColumn = idx === row.getVisibleCells().length - 1;
|
|
18728
19500
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
|
|
18729
|
-
style: getColumnSizeStyle(cell.column.getSize()
|
|
18730
|
-
className: (0, classnames.default)(ds_table_row_virtualized_module_default.cell, cell.column.id === "expander" && ds_table_row_virtualized_module_default.expandableCell, cell.column.id === "select" && ds_table_row_virtualized_module_default.selectableCell),
|
|
19501
|
+
style: getColumnSizeStyle(cell.column.getSize()),
|
|
19502
|
+
className: (0, classnames.default)(ds_table_row_virtualized_module_default.cell, cell.column.id === "expander" && ds_table_row_virtualized_module_default.expandableCell, cell.column.id === "select" && ds_table_row_virtualized_module_default.selectableCell, typeof cell.column.columnDef.editCell === "function" && ds_table_row_virtualized_module_default.editableCell),
|
|
18731
19503
|
children: isLastColumn ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
|
|
18732
19504
|
row,
|
|
18733
19505
|
cell,
|
|
@@ -18772,9 +19544,10 @@ const useInfiniteScroll = (scrollElementRef, rowCount, config) => {
|
|
|
18772
19544
|
};
|
|
18773
19545
|
//#endregion
|
|
18774
19546
|
//#region src/components/ds-table/components/ds-table-body-virtualized/ds-table-body-virtualized.tsx
|
|
18775
|
-
const DsTableBodyVirtualized = ({ table,
|
|
19547
|
+
const DsTableBodyVirtualized = ({ table, emptyState, estimateSize, overscan, onScroll, rowSelection, infiniteScroll }) => {
|
|
18776
19548
|
const rowsMapRef = (0, react.useRef)(/* @__PURE__ */ new Map());
|
|
18777
19549
|
const rowHeightsMapRef = (0, react.useRef)(/* @__PURE__ */ new Map());
|
|
19550
|
+
const tbodyRef = (0, react.useRef)(null);
|
|
18778
19551
|
const { rows } = table.getRowModel();
|
|
18779
19552
|
const rowsAndExpandedRowContent = rows.flatMap((row) => row.getIsExpanded() ? [{ row }, {
|
|
18780
19553
|
row,
|
|
@@ -18784,14 +19557,14 @@ const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimate
|
|
|
18784
19557
|
const item = rowsAndExpandedRowContent[index];
|
|
18785
19558
|
return item ? `${item.row.id}${item.isExpandedRowContent ? "-expanded-content" : ""}` : String(index);
|
|
18786
19559
|
};
|
|
18787
|
-
const { loadDataIfNeeded } = useInfiniteScroll(
|
|
19560
|
+
const { loadDataIfNeeded } = useInfiniteScroll(tbodyRef, rows.length, infiniteScroll);
|
|
18788
19561
|
const rowVirtualizer = (0, _tanstack_react_virtual.useVirtualizer)({
|
|
18789
19562
|
count: rowsAndExpandedRowContent.length,
|
|
18790
19563
|
estimateSize: (index) => {
|
|
18791
19564
|
return rowHeightsMapRef.current.get(getItemKey(index)) || estimateSize;
|
|
18792
19565
|
},
|
|
18793
19566
|
getItemKey,
|
|
18794
|
-
getScrollElement: () =>
|
|
19567
|
+
getScrollElement: () => tbodyRef.current,
|
|
18795
19568
|
measureElement: typeof window !== "undefined" && navigator.userAgent.indexOf("Firefox") === -1 ? (element) => element.getBoundingClientRect().height : void 0,
|
|
18796
19569
|
overscan: overscan ?? 5,
|
|
18797
19570
|
onChange: (instance, sync) => {
|
|
@@ -18824,6 +19597,7 @@ const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimate
|
|
|
18824
19597
|
rowVirtualizer.measure();
|
|
18825
19598
|
}, [table.getState()]);
|
|
18826
19599
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableBody, {
|
|
19600
|
+
ref: tbodyRef,
|
|
18827
19601
|
rowsMapRef,
|
|
18828
19602
|
rowHeightsMapRef,
|
|
18829
19603
|
rowVirtualizer,
|
|
@@ -18832,12 +19606,13 @@ const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimate
|
|
|
18832
19606
|
rowSelection
|
|
18833
19607
|
});
|
|
18834
19608
|
};
|
|
18835
|
-
function DsTableBody({ rowVirtualizer, rowsMapRef, rowHeightsMapRef, rowsAndExpandedRowContent, emptyState, rowSelection }) {
|
|
19609
|
+
function DsTableBody({ ref, rowVirtualizer, rowsMapRef, rowHeightsMapRef, rowsAndExpandedRowContent, emptyState, rowSelection }) {
|
|
18836
19610
|
const virtualRows = rowVirtualizer.getVirtualItems();
|
|
18837
|
-
|
|
19611
|
+
const totalSize = rowVirtualizer.getTotalSize();
|
|
19612
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TableBody, {
|
|
19613
|
+
ref,
|
|
18838
19614
|
className: ds_table_body_virtualized_module_default.body,
|
|
18839
|
-
|
|
18840
|
-
children: virtualRows.length > 0 ? virtualRows.map((virtualRow) => {
|
|
19615
|
+
children: [virtualRows.length > 0 ? virtualRows.map((virtualRow) => {
|
|
18841
19616
|
const row = rowsAndExpandedRowContent[virtualRow.index];
|
|
18842
19617
|
if (!row) return null;
|
|
18843
19618
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRowVirtualized, {
|
|
@@ -18852,7 +19627,12 @@ function DsTableBody({ rowVirtualizer, rowsMapRef, rowHeightsMapRef, rowsAndExpa
|
|
|
18852
19627
|
}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
|
|
18853
19628
|
className: ds_table_body_virtualized_module_default.emptyState,
|
|
18854
19629
|
children: emptyState || "No results."
|
|
18855
|
-
}) })
|
|
19630
|
+
}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
|
|
19631
|
+
"aria-hidden": true,
|
|
19632
|
+
className: ds_table_body_virtualized_module_default.sentinel,
|
|
19633
|
+
style: { top: `${totalSize.toString()}px` },
|
|
19634
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {})
|
|
19635
|
+
})]
|
|
18856
19636
|
});
|
|
18857
19637
|
}
|
|
18858
19638
|
//#endregion
|
|
@@ -18865,7 +19645,7 @@ const ROW_SIZE_HEIGHT_MAP = {
|
|
|
18865
19645
|
/**
|
|
18866
19646
|
* Design system Table component
|
|
18867
19647
|
*/
|
|
18868
|
-
const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = false, virtualizedOptions, className, onRowClick, emptyState, stickyHeader = true, bordered = true, fullWidth = true, rowSize = "medium", expandable = false, renderExpandedRow, selectable = false, showSelectAllCheckbox = true, onSelectionChange, onSortingChange, onScroll, actions = [], onRowDoubleClick, primaryRowActions = [], secondaryRowActions, reorderable = false, onOrderChange, columnFilters: externalColumnFilters, onColumnFiltersChange, columnVisibility: externalColumnVisibility, onColumnVisibilityChange, activeRowId, infiniteScroll }) => {
|
|
19648
|
+
const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = false, virtualizedOptions, className, onRowClick, emptyState, stickyHeader = true, bordered = true, fullWidth = true, rowSize = "medium", expandable = false, renderExpandedRow, selectable = false, showSelectAllCheckbox = true, onSelectionChange, onSortingChange, onScroll, actions = [], onRowDoubleClick, primaryRowActions = [], secondaryRowActions, reorderable = false, onOrderChange, columnFilters: externalColumnFilters, onColumnFiltersChange, columnVisibility: externalColumnVisibility, onColumnVisibilityChange, activeRowId, infiniteScroll, onCellEdit, onCellValidate }) => {
|
|
18869
19649
|
const [data, setData] = react.useState(tableData);
|
|
18870
19650
|
const [sorting, setSorting] = react.useState([]);
|
|
18871
19651
|
const [internalColumnFilters, setInternalColumnFilters] = react.useState([]);
|
|
@@ -19031,18 +19811,19 @@ const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = fal
|
|
|
19031
19811
|
secondaryRowActions,
|
|
19032
19812
|
renderExpandedRow,
|
|
19033
19813
|
virtualized,
|
|
19034
|
-
activeRowId
|
|
19814
|
+
activeRowId,
|
|
19815
|
+
onCellEdit,
|
|
19816
|
+
...useEditingState(onCellEdit, onCellValidate)
|
|
19035
19817
|
};
|
|
19036
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.
|
|
19818
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableContext.Provider, {
|
|
19037
19819
|
value: contextValue,
|
|
19038
|
-
children:
|
|
19820
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
19039
19821
|
ref: tableContainerRef,
|
|
19040
19822
|
className: (0, classnames.default)(ds_table_module_default.container, !virtualized && ds_table_module_default.dataTableContainer, virtualized && ds_table_module_default.virtualizedContainer, isBulkActionsVisible && ds_table_module_default.bulkActionsVisible, className),
|
|
19041
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DragWrapper, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Table, {
|
|
19042
|
-
className: (0, classnames.default)(fullWidth && ds_table_module_default.fullWidth, !bordered && ds_table_module_default.tableNoBorder
|
|
19823
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DragWrapper, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Table, {
|
|
19824
|
+
className: (0, classnames.default)(fullWidth && ds_table_module_default.fullWidth, !bordered && ds_table_module_default.tableNoBorder),
|
|
19043
19825
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableHeader, { table }), virtualized ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableBodyVirtualized, {
|
|
19044
19826
|
table,
|
|
19045
|
-
tableContainerRef,
|
|
19046
19827
|
emptyState,
|
|
19047
19828
|
estimateSize: virtualizedOptions?.estimateSize || ROW_SIZE_HEIGHT_MAP[rowSize],
|
|
19048
19829
|
overscan: virtualizedOptions?.overscan,
|
|
@@ -19053,15 +19834,175 @@ const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = fal
|
|
|
19053
19834
|
row,
|
|
19054
19835
|
isSelected: !!rowSelection[row.id]
|
|
19055
19836
|
}, row.id)) : renderEmptyState() }) })]
|
|
19056
|
-
}) })
|
|
19057
|
-
|
|
19058
|
-
|
|
19059
|
-
|
|
19060
|
-
|
|
19061
|
-
|
|
19062
|
-
|
|
19063
|
-
|
|
19064
|
-
})
|
|
19837
|
+
}) }), selectable && actions.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableBulkActions, {
|
|
19838
|
+
numSelectedRows: selectedRows.length,
|
|
19839
|
+
actions: actions.map((action) => ({
|
|
19840
|
+
...action,
|
|
19841
|
+
onClick: () => action.onClick(selectedRows)
|
|
19842
|
+
})),
|
|
19843
|
+
onClearSelection: table.resetRowSelection
|
|
19844
|
+
})]
|
|
19845
|
+
})
|
|
19846
|
+
});
|
|
19847
|
+
};
|
|
19848
|
+
//#endregion
|
|
19849
|
+
//#region src/components/ds-table/hooks/use-cell-editor.ts
|
|
19850
|
+
/**
|
|
19851
|
+
* Wires a TanStack Table `editCell` renderer into DsTable's hoisted editing state.
|
|
19852
|
+
* Only mount this hook inside `ColumnDef.editCell` — the table cell layer handles
|
|
19853
|
+
* entering edit mode on double-click.
|
|
19854
|
+
*/
|
|
19855
|
+
const useCellEditor = ({ cellContext }) => {
|
|
19856
|
+
const ctx = useDsTableContext();
|
|
19857
|
+
const { row, column, getValue } = cellContext;
|
|
19858
|
+
const isActiveCell = ctx.editing !== null && ctx.editing.cell.row.id === row.id && ctx.editing.cell.column.id === column.id;
|
|
19859
|
+
const value = isActiveCell && ctx.editing ? ctx.editing.draftValue : getValue();
|
|
19860
|
+
const error = isActiveCell && ctx.editing ? ctx.editing.error : null;
|
|
19861
|
+
const setValue = (next) => {
|
|
19862
|
+
ctx.setDraft(next);
|
|
19863
|
+
};
|
|
19864
|
+
const commit = (overrideValue) => {
|
|
19865
|
+
ctx.commit(overrideValue);
|
|
19866
|
+
};
|
|
19867
|
+
const cancel = () => {
|
|
19868
|
+
ctx.cancel();
|
|
19869
|
+
};
|
|
19870
|
+
const stopPropagation = (event) => {
|
|
19871
|
+
event.stopPropagation();
|
|
19872
|
+
};
|
|
19873
|
+
return {
|
|
19874
|
+
value,
|
|
19875
|
+
error,
|
|
19876
|
+
setValue,
|
|
19877
|
+
commit,
|
|
19878
|
+
cancel,
|
|
19879
|
+
stopPropagation,
|
|
19880
|
+
editorContainerProps: {
|
|
19881
|
+
onKeyDown: () => {},
|
|
19882
|
+
onClick: stopPropagation,
|
|
19883
|
+
onDoubleClick: stopPropagation
|
|
19884
|
+
}
|
|
19885
|
+
};
|
|
19886
|
+
};
|
|
19887
|
+
//#endregion
|
|
19888
|
+
//#region src/components/ds-table/components/edit/cell-editors/cell-editors.module.scss
|
|
19889
|
+
var cell_editors_module_default = { "fullWidth": "m8hPaq_fullWidth" };
|
|
19890
|
+
//#endregion
|
|
19891
|
+
//#region src/components/ds-table/components/edit/cell-editors/table-edit-form-control.tsx
|
|
19892
|
+
const TableEditFormControl = ({ cellContext, error, children }) => {
|
|
19893
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsFormControl, {
|
|
19894
|
+
hideLabel: true,
|
|
19895
|
+
label: String(cellContext.column.columnDef.header ?? cellContext.column.id),
|
|
19896
|
+
className: cell_editors_module_default.fullWidth,
|
|
19897
|
+
status: error ? "error" : void 0,
|
|
19898
|
+
message: error ?? void 0,
|
|
19899
|
+
messageIcon: "cancel",
|
|
19900
|
+
children
|
|
19901
|
+
});
|
|
19902
|
+
};
|
|
19903
|
+
//#endregion
|
|
19904
|
+
//#region src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-text.tsx
|
|
19905
|
+
/** Text input editor for table cells. Render via `ColumnDef.editCell`. */
|
|
19906
|
+
const DsTableEditCellText = ({ cellContext, placeholder, maxLength }) => {
|
|
19907
|
+
const { value, setValue, error } = useCellEditor({ cellContext });
|
|
19908
|
+
const inputRef = (0, react.useRef)(null);
|
|
19909
|
+
(0, react.useEffect)(() => {
|
|
19910
|
+
const input = inputRef.current;
|
|
19911
|
+
if (!input) return;
|
|
19912
|
+
input.focus();
|
|
19913
|
+
input.select();
|
|
19914
|
+
}, []);
|
|
19915
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableEditFormControl, {
|
|
19916
|
+
cellContext,
|
|
19917
|
+
error,
|
|
19918
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsFormControl.TextInput, {
|
|
19919
|
+
ref: inputRef,
|
|
19920
|
+
className: cell_editors_module_default.fullWidth,
|
|
19921
|
+
value,
|
|
19922
|
+
placeholder,
|
|
19923
|
+
maxLength,
|
|
19924
|
+
onValueChange: setValue,
|
|
19925
|
+
slots: error ? { endAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
19926
|
+
icon: "error",
|
|
19927
|
+
size: "tiny"
|
|
19928
|
+
}) } : void 0
|
|
19929
|
+
})
|
|
19930
|
+
});
|
|
19931
|
+
};
|
|
19932
|
+
//#endregion
|
|
19933
|
+
//#region src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-number.tsx
|
|
19934
|
+
/** Number input editor for table cells. Render via `ColumnDef.editCell`. */
|
|
19935
|
+
const DsTableEditCellNumber = ({ cellContext, min, max, step }) => {
|
|
19936
|
+
const { value, setValue, error } = useCellEditor({ cellContext });
|
|
19937
|
+
const inputRef = (0, react.useRef)(null);
|
|
19938
|
+
(0, react.useEffect)(() => {
|
|
19939
|
+
const input = inputRef.current;
|
|
19940
|
+
if (!input) return;
|
|
19941
|
+
input.focus();
|
|
19942
|
+
input.select();
|
|
19943
|
+
}, []);
|
|
19944
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableEditFormControl, {
|
|
19945
|
+
cellContext,
|
|
19946
|
+
error,
|
|
19947
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsFormControl.NumberInput, {
|
|
19948
|
+
ref: inputRef,
|
|
19949
|
+
className: cell_editors_module_default.fullWidth,
|
|
19950
|
+
value,
|
|
19951
|
+
min,
|
|
19952
|
+
max,
|
|
19953
|
+
step,
|
|
19954
|
+
onValueChange: setValue
|
|
19955
|
+
})
|
|
19956
|
+
});
|
|
19957
|
+
};
|
|
19958
|
+
//#endregion
|
|
19959
|
+
//#region src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-select.tsx
|
|
19960
|
+
/** Select editor for table cells. Render via `ColumnDef.editCell`. */
|
|
19961
|
+
const DsTableEditCellSelect = ({ cellContext, options, placeholder }) => {
|
|
19962
|
+
const { value, setValue, error } = useCellEditor({ cellContext });
|
|
19963
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableEditFormControl, {
|
|
19964
|
+
cellContext,
|
|
19965
|
+
error,
|
|
19966
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsFormControl.Select, {
|
|
19967
|
+
className: cell_editors_module_default.fullWidth,
|
|
19968
|
+
value,
|
|
19969
|
+
options,
|
|
19970
|
+
placeholder,
|
|
19971
|
+
onValueChange: setValue
|
|
19972
|
+
})
|
|
19973
|
+
});
|
|
19974
|
+
};
|
|
19975
|
+
//#endregion
|
|
19976
|
+
//#region src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-date.tsx
|
|
19977
|
+
/** Date picker editor for table cells. Render via `ColumnDef.editCell`. */
|
|
19978
|
+
const DsTableEditCellDate = ({ cellContext, min, max, placeholder }) => {
|
|
19979
|
+
const { value, setValue, error } = useCellEditor({ cellContext });
|
|
19980
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableEditFormControl, {
|
|
19981
|
+
cellContext,
|
|
19982
|
+
error,
|
|
19983
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsFormControl.DatePicker, {
|
|
19984
|
+
className: cell_editors_module_default.fullWidth,
|
|
19985
|
+
value,
|
|
19986
|
+
min,
|
|
19987
|
+
max,
|
|
19988
|
+
placeholder,
|
|
19989
|
+
onChange: setValue,
|
|
19990
|
+
slotProps: error ? { input: { slots: { endAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
19991
|
+
icon: "error",
|
|
19992
|
+
size: "tiny"
|
|
19993
|
+
}) } } } : void 0
|
|
19994
|
+
})
|
|
19995
|
+
});
|
|
19996
|
+
};
|
|
19997
|
+
//#endregion
|
|
19998
|
+
//#region src/components/ds-table/components/edit/cell-editors/ds-table-edit-cell-checkbox.tsx
|
|
19999
|
+
/** Checkbox editor for table cells. Render via `ColumnDef.editCell`. */
|
|
20000
|
+
const DsTableEditCellCheckbox = ({ cellContext, disabled }) => {
|
|
20001
|
+
const { value, setValue } = useCellEditor({ cellContext });
|
|
20002
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
|
|
20003
|
+
checked: value,
|
|
20004
|
+
disabled,
|
|
20005
|
+
onCheckedChange: (checked) => setValue(checked === true)
|
|
19065
20006
|
});
|
|
19066
20007
|
};
|
|
19067
20008
|
//#endregion
|
|
@@ -20024,19 +20965,37 @@ DsVerticalTabs.List = DsVerticalTabsList;
|
|
|
20024
20965
|
DsVerticalTabs.Tab = DsVerticalTabsTab;
|
|
20025
20966
|
DsVerticalTabs.Content = DsVerticalTabsContent;
|
|
20026
20967
|
//#endregion
|
|
20027
|
-
//#region src/components/ds-workspace/ds-workspace.module.scss
|
|
20028
|
-
var
|
|
20029
|
-
"
|
|
20030
|
-
"
|
|
20031
|
-
"
|
|
20032
|
-
"
|
|
20033
|
-
"
|
|
20034
|
-
"
|
|
20968
|
+
//#region src/components/ds-workspace-layout/ds-workspace-layout.module.scss
|
|
20969
|
+
var ds_workspace_layout_module_default = {
|
|
20970
|
+
"body": "pc7Upa_body",
|
|
20971
|
+
"content": "pc7Upa_content",
|
|
20972
|
+
"contentWithLeftPanel": "pc7Upa_contentWithLeftPanel",
|
|
20973
|
+
"fillParent": "pc7Upa_fillParent",
|
|
20974
|
+
"footer": "pc7Upa_footer",
|
|
20975
|
+
"header": "pc7Upa_header",
|
|
20976
|
+
"leftPanel": "pc7Upa_leftPanel",
|
|
20977
|
+
"root": "pc7Upa_root",
|
|
20978
|
+
"sideMenu": "pc7Upa_sideMenu",
|
|
20979
|
+
"sideMenuPanel": "pc7Upa_sideMenuPanel",
|
|
20980
|
+
"sideMenuPinButton": "pc7Upa_sideMenuPinButton",
|
|
20981
|
+
"subHeader": "pc7Upa_subHeader"
|
|
20982
|
+
};
|
|
20983
|
+
//#endregion
|
|
20984
|
+
//#region src/components/ds-workspace-layout/ds-workspace-layout.context.ts
|
|
20985
|
+
const DsWorkspaceLayoutContext = (0, react.createContext)(null);
|
|
20986
|
+
const useDsWorkspaceLayoutContext = () => {
|
|
20987
|
+
const context = (0, react.useContext)(DsWorkspaceLayoutContext);
|
|
20988
|
+
if (!context) throw new Error("DsWorkspaceLayout compound components must be used within DsWorkspaceLayout");
|
|
20989
|
+
return context;
|
|
20035
20990
|
};
|
|
20036
20991
|
//#endregion
|
|
20037
|
-
//#region src/components/ds-workspace/ds-workspace.tsx
|
|
20038
|
-
const
|
|
20039
|
-
|
|
20992
|
+
//#region src/components/ds-workspace-layout/ds-workspace-layout.tsx
|
|
20993
|
+
const DEFAULT_LOCALE = Object.freeze({
|
|
20994
|
+
pinButtonLabel: "Pin side menu",
|
|
20995
|
+
unpinButtonLabel: "Unpin side menu"
|
|
20996
|
+
});
|
|
20997
|
+
const DsWorkspaceLayout = (t0) => {
|
|
20998
|
+
const $ = (0, react_compiler_runtime.c)(17);
|
|
20040
20999
|
let className;
|
|
20041
21000
|
let rest;
|
|
20042
21001
|
let t1;
|
|
@@ -20052,24 +21011,58 @@ const DsWorkspace = (t0) => {
|
|
|
20052
21011
|
t1 = $[3];
|
|
20053
21012
|
}
|
|
20054
21013
|
const fillParent = t1 === void 0 ? false : t1;
|
|
21014
|
+
const [hasLeftSidePanel, setHasLeftSidePanel] = (0, react.useState)(false);
|
|
20055
21015
|
let t2;
|
|
20056
|
-
if ($[4]
|
|
20057
|
-
t2 = (
|
|
20058
|
-
$[4] =
|
|
20059
|
-
|
|
20060
|
-
|
|
20061
|
-
} else t2 = $[6];
|
|
21016
|
+
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
|
|
21017
|
+
t2 = () => setHasLeftSidePanel(true);
|
|
21018
|
+
$[4] = t2;
|
|
21019
|
+
} else t2 = $[4];
|
|
21020
|
+
const registerLeftSidePanel = t2;
|
|
20062
21021
|
let t3;
|
|
20063
|
-
if ($[
|
|
20064
|
-
t3 =
|
|
21022
|
+
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
|
|
21023
|
+
t3 = () => setHasLeftSidePanel(false);
|
|
21024
|
+
$[5] = t3;
|
|
21025
|
+
} else t3 = $[5];
|
|
21026
|
+
const unregisterLeftSidePanel = t3;
|
|
21027
|
+
let t4;
|
|
21028
|
+
if ($[6] !== hasLeftSidePanel) {
|
|
21029
|
+
t4 = {
|
|
21030
|
+
hasLeftSidePanel,
|
|
21031
|
+
registerLeftSidePanel,
|
|
21032
|
+
unregisterLeftSidePanel
|
|
21033
|
+
};
|
|
21034
|
+
$[6] = hasLeftSidePanel;
|
|
21035
|
+
$[7] = t4;
|
|
21036
|
+
} else t4 = $[7];
|
|
21037
|
+
const contextValue = t4;
|
|
21038
|
+
let t5;
|
|
21039
|
+
if ($[8] !== className || $[9] !== fillParent) {
|
|
21040
|
+
t5 = (0, classnames.default)(ds_workspace_layout_module_default.root, { [ds_workspace_layout_module_default.fillParent]: fillParent }, className);
|
|
21041
|
+
$[8] = className;
|
|
21042
|
+
$[9] = fillParent;
|
|
21043
|
+
$[10] = t5;
|
|
21044
|
+
} else t5 = $[10];
|
|
21045
|
+
let t6;
|
|
21046
|
+
if ($[11] !== rest || $[12] !== t5) {
|
|
21047
|
+
t6 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
20065
21048
|
...rest,
|
|
20066
|
-
className:
|
|
21049
|
+
className: t5
|
|
20067
21050
|
});
|
|
20068
|
-
$[
|
|
20069
|
-
$[
|
|
20070
|
-
$[
|
|
20071
|
-
} else
|
|
20072
|
-
|
|
21051
|
+
$[11] = rest;
|
|
21052
|
+
$[12] = t5;
|
|
21053
|
+
$[13] = t6;
|
|
21054
|
+
} else t6 = $[13];
|
|
21055
|
+
let t7;
|
|
21056
|
+
if ($[14] !== contextValue || $[15] !== t6) {
|
|
21057
|
+
t7 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsWorkspaceLayoutContext.Provider, {
|
|
21058
|
+
value: contextValue,
|
|
21059
|
+
children: t6
|
|
21060
|
+
});
|
|
21061
|
+
$[14] = contextValue;
|
|
21062
|
+
$[15] = t6;
|
|
21063
|
+
$[16] = t7;
|
|
21064
|
+
} else t7 = $[16];
|
|
21065
|
+
return t7;
|
|
20073
21066
|
};
|
|
20074
21067
|
const Header = (t0) => {
|
|
20075
21068
|
const $ = (0, react_compiler_runtime.c)(8);
|
|
@@ -20086,7 +21079,7 @@ const Header = (t0) => {
|
|
|
20086
21079
|
}
|
|
20087
21080
|
let t1;
|
|
20088
21081
|
if ($[3] !== className) {
|
|
20089
|
-
t1 = (0, classnames.default)(
|
|
21082
|
+
t1 = (0, classnames.default)(ds_workspace_layout_module_default.header, className);
|
|
20090
21083
|
$[3] = className;
|
|
20091
21084
|
$[4] = t1;
|
|
20092
21085
|
} else t1 = $[4];
|
|
@@ -20117,7 +21110,7 @@ const SubHeader = (t0) => {
|
|
|
20117
21110
|
}
|
|
20118
21111
|
let t1;
|
|
20119
21112
|
if ($[3] !== className) {
|
|
20120
|
-
t1 = (0, classnames.default)(
|
|
21113
|
+
t1 = (0, classnames.default)(ds_workspace_layout_module_default.subHeader, className);
|
|
20121
21114
|
$[3] = className;
|
|
20122
21115
|
$[4] = t1;
|
|
20123
21116
|
} else t1 = $[4];
|
|
@@ -20133,8 +21126,41 @@ const SubHeader = (t0) => {
|
|
|
20133
21126
|
} else t2 = $[7];
|
|
20134
21127
|
return t2;
|
|
20135
21128
|
};
|
|
20136
|
-
/**
|
|
21129
|
+
/** Content area: column layout, 24px vertical margins, 16px gap, 40px horizontal margins (24px when LeftPanel is mounted). */
|
|
20137
21130
|
const Content = (t0) => {
|
|
21131
|
+
const $ = (0, react_compiler_runtime.c)(9);
|
|
21132
|
+
let className;
|
|
21133
|
+
let rest;
|
|
21134
|
+
if ($[0] !== t0) {
|
|
21135
|
+
({className, ...rest} = t0);
|
|
21136
|
+
$[0] = t0;
|
|
21137
|
+
$[1] = className;
|
|
21138
|
+
$[2] = rest;
|
|
21139
|
+
} else {
|
|
21140
|
+
className = $[1];
|
|
21141
|
+
rest = $[2];
|
|
21142
|
+
}
|
|
21143
|
+
const { hasLeftSidePanel } = useDsWorkspaceLayoutContext();
|
|
21144
|
+
let t1;
|
|
21145
|
+
if ($[3] !== className || $[4] !== hasLeftSidePanel) {
|
|
21146
|
+
t1 = (0, classnames.default)(ds_workspace_layout_module_default.content, { [ds_workspace_layout_module_default.contentWithLeftPanel]: hasLeftSidePanel }, className);
|
|
21147
|
+
$[3] = className;
|
|
21148
|
+
$[4] = hasLeftSidePanel;
|
|
21149
|
+
$[5] = t1;
|
|
21150
|
+
} else t1 = $[5];
|
|
21151
|
+
let t2;
|
|
21152
|
+
if ($[6] !== rest || $[7] !== t1) {
|
|
21153
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
21154
|
+
...rest,
|
|
21155
|
+
className: t1
|
|
21156
|
+
});
|
|
21157
|
+
$[6] = rest;
|
|
21158
|
+
$[7] = t1;
|
|
21159
|
+
$[8] = t2;
|
|
21160
|
+
} else t2 = $[8];
|
|
21161
|
+
return t2;
|
|
21162
|
+
};
|
|
21163
|
+
const Footer = (t0) => {
|
|
20138
21164
|
const $ = (0, react_compiler_runtime.c)(8);
|
|
20139
21165
|
let className;
|
|
20140
21166
|
let rest;
|
|
@@ -20149,13 +21175,13 @@ const Content = (t0) => {
|
|
|
20149
21175
|
}
|
|
20150
21176
|
let t1;
|
|
20151
21177
|
if ($[3] !== className) {
|
|
20152
|
-
t1 = (0, classnames.default)(
|
|
21178
|
+
t1 = (0, classnames.default)(ds_workspace_layout_module_default.footer, className);
|
|
20153
21179
|
$[3] = className;
|
|
20154
21180
|
$[4] = t1;
|
|
20155
21181
|
} else t1 = $[4];
|
|
20156
21182
|
let t2;
|
|
20157
21183
|
if ($[5] !== rest || $[6] !== t1) {
|
|
20158
|
-
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("
|
|
21184
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("footer", {
|
|
20159
21185
|
...rest,
|
|
20160
21186
|
className: t1
|
|
20161
21187
|
});
|
|
@@ -20165,7 +21191,7 @@ const Content = (t0) => {
|
|
|
20165
21191
|
} else t2 = $[7];
|
|
20166
21192
|
return t2;
|
|
20167
21193
|
};
|
|
20168
|
-
const
|
|
21194
|
+
const Body = (t0) => {
|
|
20169
21195
|
const $ = (0, react_compiler_runtime.c)(8);
|
|
20170
21196
|
let className;
|
|
20171
21197
|
let rest;
|
|
@@ -20178,15 +21204,16 @@ const Footer = (t0) => {
|
|
|
20178
21204
|
className = $[1];
|
|
20179
21205
|
rest = $[2];
|
|
20180
21206
|
}
|
|
21207
|
+
useDsWorkspaceLayoutContext();
|
|
20181
21208
|
let t1;
|
|
20182
21209
|
if ($[3] !== className) {
|
|
20183
|
-
t1 = (0, classnames.default)(
|
|
21210
|
+
t1 = (0, classnames.default)(ds_workspace_layout_module_default.body, className);
|
|
20184
21211
|
$[3] = className;
|
|
20185
21212
|
$[4] = t1;
|
|
20186
21213
|
} else t1 = $[4];
|
|
20187
21214
|
let t2;
|
|
20188
21215
|
if ($[5] !== rest || $[6] !== t1) {
|
|
20189
|
-
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("
|
|
21216
|
+
t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
20190
21217
|
...rest,
|
|
20191
21218
|
className: t1
|
|
20192
21219
|
});
|
|
@@ -20196,10 +21223,170 @@ const Footer = (t0) => {
|
|
|
20196
21223
|
} else t2 = $[7];
|
|
20197
21224
|
return t2;
|
|
20198
21225
|
};
|
|
20199
|
-
|
|
20200
|
-
|
|
20201
|
-
|
|
20202
|
-
|
|
21226
|
+
const SideMenu = (t0) => {
|
|
21227
|
+
const $ = (0, react_compiler_runtime.c)(28);
|
|
21228
|
+
let children;
|
|
21229
|
+
let className;
|
|
21230
|
+
let locale;
|
|
21231
|
+
let onPinnedChange;
|
|
21232
|
+
let rest;
|
|
21233
|
+
let t1;
|
|
21234
|
+
if ($[0] !== t0) {
|
|
21235
|
+
({className, pinned: t1, onPinnedChange, locale, children, ...rest} = t0);
|
|
21236
|
+
$[0] = t0;
|
|
21237
|
+
$[1] = children;
|
|
21238
|
+
$[2] = className;
|
|
21239
|
+
$[3] = locale;
|
|
21240
|
+
$[4] = onPinnedChange;
|
|
21241
|
+
$[5] = rest;
|
|
21242
|
+
$[6] = t1;
|
|
21243
|
+
} else {
|
|
21244
|
+
children = $[1];
|
|
21245
|
+
className = $[2];
|
|
21246
|
+
locale = $[3];
|
|
21247
|
+
onPinnedChange = $[4];
|
|
21248
|
+
rest = $[5];
|
|
21249
|
+
t1 = $[6];
|
|
21250
|
+
}
|
|
21251
|
+
const pinned = t1 === void 0 ? false : t1;
|
|
21252
|
+
useDsWorkspaceLayoutContext();
|
|
21253
|
+
const [isHovering, setIsHovering] = (0, react.useState)(false);
|
|
21254
|
+
const isExpanded = pinned || isHovering;
|
|
21255
|
+
const ariaLabel = pinned ? locale?.unpinButtonLabel ?? DEFAULT_LOCALE.unpinButtonLabel : locale?.pinButtonLabel ?? DEFAULT_LOCALE.pinButtonLabel;
|
|
21256
|
+
let t2;
|
|
21257
|
+
if ($[7] !== className) {
|
|
21258
|
+
t2 = (0, classnames.default)(ds_workspace_layout_module_default.sideMenu, className);
|
|
21259
|
+
$[7] = className;
|
|
21260
|
+
$[8] = t2;
|
|
21261
|
+
} else t2 = $[8];
|
|
21262
|
+
let t3;
|
|
21263
|
+
if ($[9] !== pinned) {
|
|
21264
|
+
t3 = pinned ? { "data-pinned": "" } : {};
|
|
21265
|
+
$[9] = pinned;
|
|
21266
|
+
$[10] = t3;
|
|
21267
|
+
} else t3 = $[10];
|
|
21268
|
+
let t4;
|
|
21269
|
+
if ($[11] !== isExpanded) {
|
|
21270
|
+
t4 = isExpanded ? { "data-expanded": "" } : {};
|
|
21271
|
+
$[11] = isExpanded;
|
|
21272
|
+
$[12] = t4;
|
|
21273
|
+
} else t4 = $[12];
|
|
21274
|
+
let t5;
|
|
21275
|
+
let t6;
|
|
21276
|
+
if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
|
|
21277
|
+
t5 = () => setIsHovering(true);
|
|
21278
|
+
t6 = () => setIsHovering(false);
|
|
21279
|
+
$[13] = t5;
|
|
21280
|
+
$[14] = t6;
|
|
21281
|
+
} else {
|
|
21282
|
+
t5 = $[13];
|
|
21283
|
+
t6 = $[14];
|
|
21284
|
+
}
|
|
21285
|
+
let t7;
|
|
21286
|
+
if ($[15] !== ariaLabel || $[16] !== onPinnedChange || $[17] !== pinned) {
|
|
21287
|
+
t7 = onPinnedChange ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
21288
|
+
type: "button",
|
|
21289
|
+
className: ds_workspace_layout_module_default.sideMenuPinButton,
|
|
21290
|
+
onClick: () => onPinnedChange(!pinned),
|
|
21291
|
+
"aria-label": ariaLabel,
|
|
21292
|
+
"aria-pressed": pinned,
|
|
21293
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
|
|
21294
|
+
icon: "keep",
|
|
21295
|
+
size: "small",
|
|
21296
|
+
filled: pinned
|
|
21297
|
+
})
|
|
21298
|
+
}) : null;
|
|
21299
|
+
$[15] = ariaLabel;
|
|
21300
|
+
$[16] = onPinnedChange;
|
|
21301
|
+
$[17] = pinned;
|
|
21302
|
+
$[18] = t7;
|
|
21303
|
+
} else t7 = $[18];
|
|
21304
|
+
let t8;
|
|
21305
|
+
if ($[19] !== children || $[20] !== t7) {
|
|
21306
|
+
t8 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
21307
|
+
className: ds_workspace_layout_module_default.sideMenuPanel,
|
|
21308
|
+
onMouseEnter: t5,
|
|
21309
|
+
onMouseLeave: t6,
|
|
21310
|
+
children: [t7, children]
|
|
21311
|
+
});
|
|
21312
|
+
$[19] = children;
|
|
21313
|
+
$[20] = t7;
|
|
21314
|
+
$[21] = t8;
|
|
21315
|
+
} else t8 = $[21];
|
|
21316
|
+
let t9;
|
|
21317
|
+
if ($[22] !== rest || $[23] !== t2 || $[24] !== t3 || $[25] !== t4 || $[26] !== t8) {
|
|
21318
|
+
t9 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("aside", {
|
|
21319
|
+
...rest,
|
|
21320
|
+
className: t2,
|
|
21321
|
+
...t3,
|
|
21322
|
+
...t4,
|
|
21323
|
+
children: t8
|
|
21324
|
+
});
|
|
21325
|
+
$[22] = rest;
|
|
21326
|
+
$[23] = t2;
|
|
21327
|
+
$[24] = t3;
|
|
21328
|
+
$[25] = t4;
|
|
21329
|
+
$[26] = t8;
|
|
21330
|
+
$[27] = t9;
|
|
21331
|
+
} else t9 = $[27];
|
|
21332
|
+
return t9;
|
|
21333
|
+
};
|
|
21334
|
+
const LeftPanel = (t0) => {
|
|
21335
|
+
const $ = (0, react_compiler_runtime.c)(12);
|
|
21336
|
+
let className;
|
|
21337
|
+
let rest;
|
|
21338
|
+
if ($[0] !== t0) {
|
|
21339
|
+
({className, ...rest} = t0);
|
|
21340
|
+
$[0] = t0;
|
|
21341
|
+
$[1] = className;
|
|
21342
|
+
$[2] = rest;
|
|
21343
|
+
} else {
|
|
21344
|
+
className = $[1];
|
|
21345
|
+
rest = $[2];
|
|
21346
|
+
}
|
|
21347
|
+
const { registerLeftSidePanel, unregisterLeftSidePanel } = useDsWorkspaceLayoutContext();
|
|
21348
|
+
let t1;
|
|
21349
|
+
let t2;
|
|
21350
|
+
if ($[3] !== registerLeftSidePanel || $[4] !== unregisterLeftSidePanel) {
|
|
21351
|
+
t1 = () => {
|
|
21352
|
+
registerLeftSidePanel();
|
|
21353
|
+
return unregisterLeftSidePanel;
|
|
21354
|
+
};
|
|
21355
|
+
t2 = [registerLeftSidePanel, unregisterLeftSidePanel];
|
|
21356
|
+
$[3] = registerLeftSidePanel;
|
|
21357
|
+
$[4] = unregisterLeftSidePanel;
|
|
21358
|
+
$[5] = t1;
|
|
21359
|
+
$[6] = t2;
|
|
21360
|
+
} else {
|
|
21361
|
+
t1 = $[5];
|
|
21362
|
+
t2 = $[6];
|
|
21363
|
+
}
|
|
21364
|
+
(0, react.useEffect)(t1, t2);
|
|
21365
|
+
let t3;
|
|
21366
|
+
if ($[7] !== className) {
|
|
21367
|
+
t3 = (0, classnames.default)(ds_workspace_layout_module_default.leftPanel, className);
|
|
21368
|
+
$[7] = className;
|
|
21369
|
+
$[8] = t3;
|
|
21370
|
+
} else t3 = $[8];
|
|
21371
|
+
let t4;
|
|
21372
|
+
if ($[9] !== rest || $[10] !== t3) {
|
|
21373
|
+
t4 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("aside", {
|
|
21374
|
+
...rest,
|
|
21375
|
+
className: t3
|
|
21376
|
+
});
|
|
21377
|
+
$[9] = rest;
|
|
21378
|
+
$[10] = t3;
|
|
21379
|
+
$[11] = t4;
|
|
21380
|
+
} else t4 = $[11];
|
|
21381
|
+
return t4;
|
|
21382
|
+
};
|
|
21383
|
+
DsWorkspaceLayout.Header = Header;
|
|
21384
|
+
DsWorkspaceLayout.SubHeader = SubHeader;
|
|
21385
|
+
DsWorkspaceLayout.Content = Content;
|
|
21386
|
+
DsWorkspaceLayout.Footer = Footer;
|
|
21387
|
+
DsWorkspaceLayout.Body = Body;
|
|
21388
|
+
DsWorkspaceLayout.SideMenu = SideMenu;
|
|
21389
|
+
DsWorkspaceLayout.LeftPanel = LeftPanel;
|
|
20203
21390
|
//#endregion
|
|
20204
21391
|
exports.BREAKPOINT_LG = BREAKPOINT_LG;
|
|
20205
21392
|
exports.DsAlertBanner = DsAlertBanner;
|
|
@@ -20210,6 +21397,7 @@ exports.DsBreadcrumb = DsBreadcrumb;
|
|
|
20210
21397
|
exports.DsButton = DsButton;
|
|
20211
21398
|
exports.DsButtonV3 = DsButtonV3;
|
|
20212
21399
|
exports.DsCard = DsCard;
|
|
21400
|
+
exports.DsCatalogLayout = DsCatalogLayout;
|
|
20213
21401
|
exports.DsCheckbox = DsCheckbox;
|
|
20214
21402
|
exports.DsCheckboxGroup = DsCheckboxGroup;
|
|
20215
21403
|
exports.DsChip = DsChip;
|
|
@@ -20265,6 +21453,14 @@ exports.DsStepContent = DsStepContent;
|
|
|
20265
21453
|
exports.DsStepper = DsStepper;
|
|
20266
21454
|
exports.DsSystemStatus = DsSystemStatus;
|
|
20267
21455
|
exports.DsTable = DsTable;
|
|
21456
|
+
exports.DsTableColumnFilterPopover = DsTableColumnFilterPopover;
|
|
21457
|
+
exports.DsTableEditCellCheckbox = DsTableEditCellCheckbox;
|
|
21458
|
+
exports.DsTableEditCellDate = DsTableEditCellDate;
|
|
21459
|
+
exports.DsTableEditCellNumber = DsTableEditCellNumber;
|
|
21460
|
+
exports.DsTableEditCellSelect = DsTableEditCellSelect;
|
|
21461
|
+
exports.DsTableEditCellText = DsTableEditCellText;
|
|
21462
|
+
exports.DsTableEditableCell = DsTableEditableCell;
|
|
21463
|
+
exports.DsTableEditingCell = DsTableEditingCell;
|
|
20268
21464
|
exports.DsTabs = DsTabs;
|
|
20269
21465
|
exports.DsTag = DsTag;
|
|
20270
21466
|
exports.DsTagFilter = DsTagFilter;
|
|
@@ -20278,7 +21474,7 @@ exports.DsTooltip = DsTooltip;
|
|
|
20278
21474
|
exports.DsTree = DsTree;
|
|
20279
21475
|
exports.DsTypography = DsTypography;
|
|
20280
21476
|
exports.DsVerticalTabs = DsVerticalTabs;
|
|
20281
|
-
exports.
|
|
21477
|
+
exports.DsWorkspaceLayout = DsWorkspaceLayout;
|
|
20282
21478
|
exports.FatalFileUploadError = FatalFileUploadError;
|
|
20283
21479
|
exports.FileUpload = FileUpload;
|
|
20284
21480
|
exports.FileUploadError = FileUploadError;
|
|
@@ -20326,6 +21522,7 @@ exports.tagSizes = tagSizes;
|
|
|
20326
21522
|
exports.tagVariants = tagVariants;
|
|
20327
21523
|
exports.textInputSizes = textInputSizes;
|
|
20328
21524
|
exports.useBreakpoint = useBreakpoint;
|
|
21525
|
+
exports.useCellEditor = useCellEditor;
|
|
20329
21526
|
exports.useCheckboxSelectAll = useCheckboxSelectAll;
|
|
20330
21527
|
exports.useFileUpload = useFileUpload;
|
|
20331
21528
|
exports.useResponsiveValue = useResponsiveValue;
|