@coveord/plasma-mantine 52.5.0 → 52.7.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/.turbo/turbo-build.log +3 -3
- package/.turbo/turbo-test.log +31 -30
- package/dist/.tsbuildinfo +1 -1
- package/dist/cjs/components/blank-slate/BlankSlate.js.map +1 -1
- package/dist/cjs/components/button/Button.js.map +1 -1
- package/dist/cjs/components/button/ButtonWithDisabledTooltip.js.map +1 -1
- package/dist/cjs/components/code-editor/CodeEditor.js.map +1 -1
- package/dist/cjs/components/code-editor/languages/xml.js.map +1 -1
- package/dist/cjs/components/collection/Collection.js.map +1 -1
- package/dist/cjs/components/collection/Collection.styles.js.map +1 -1
- package/dist/cjs/components/collection/CollectionItem.js.map +1 -1
- package/dist/cjs/components/copyToClipboard/CopyToClipboard.js.map +1 -1
- package/dist/cjs/components/date-range-picker/DateRangePickerInlineCalendar.js +5 -5
- package/dist/cjs/components/date-range-picker/DateRangePickerInlineCalendar.js.map +1 -1
- package/dist/cjs/components/date-range-picker/DateRangePickerPopoverCalendar.js.map +1 -1
- package/dist/cjs/components/date-range-picker/DateRangePickerPresetSelect.js.map +1 -1
- package/dist/cjs/components/date-range-picker/EditableDateRangePicker.js.map +1 -1
- package/dist/cjs/components/header/Header.d.ts.map +1 -1
- package/dist/cjs/components/header/Header.js +3 -0
- package/dist/cjs/components/header/Header.js.map +1 -1
- package/dist/cjs/components/header/__tests__/__snapshots__/Header.spec.tsx.snap +1 -1
- package/dist/cjs/components/inline-confirm/InlineConfirm.js.map +1 -1
- package/dist/cjs/components/inline-confirm/InlineConfirmButton.js.map +1 -1
- package/dist/cjs/components/inline-confirm/InlineConfirmContext.js.map +1 -1
- package/dist/cjs/components/inline-confirm/InlineConfirmMenuItem.js.map +1 -1
- package/dist/cjs/components/inline-confirm/InlineConfirmPrompt.js.map +1 -1
- package/dist/cjs/components/inline-confirm/useInlineConfirm.js.map +1 -1
- package/dist/cjs/components/menu/Menu.js.map +1 -1
- package/dist/cjs/components/modal-wizard/ModalWizard.js.map +1 -1
- package/dist/cjs/components/modal-wizard/ModalWizardStep.js.map +1 -1
- package/dist/cjs/components/prompt/Prompt.js.map +1 -1
- package/dist/cjs/components/prompt/PromptFooter.js.map +1 -1
- package/dist/cjs/components/sticky-footer/StickyFooter.js.map +1 -1
- package/dist/cjs/components/table/Table.d.ts.map +1 -1
- package/dist/cjs/components/table/Table.js +33 -84
- package/dist/cjs/components/table/Table.js.map +1 -1
- package/dist/cjs/components/table/Table.styles.d.ts +2 -4
- package/dist/cjs/components/table/Table.styles.d.ts.map +1 -1
- package/dist/cjs/components/table/Table.styles.js +7 -25
- package/dist/cjs/components/table/Table.styles.js.map +1 -1
- package/dist/cjs/components/table/Table.types.d.ts +68 -2
- package/dist/cjs/components/table/Table.types.d.ts.map +1 -1
- package/dist/cjs/components/table/TableActions.d.ts +12 -2
- package/dist/cjs/components/table/TableActions.d.ts.map +1 -1
- package/dist/cjs/components/table/TableActions.js +29 -7
- package/dist/cjs/components/table/TableActions.js.map +1 -1
- package/dist/cjs/components/table/TableCollapsibleColumn.js.map +1 -1
- package/dist/cjs/components/table/TableContext.js.map +1 -1
- package/dist/cjs/components/table/TableDateRangePicker.d.ts +12 -1
- package/dist/cjs/components/table/TableDateRangePicker.d.ts.map +1 -1
- package/dist/cjs/components/table/TableDateRangePicker.js +38 -12
- package/dist/cjs/components/table/TableDateRangePicker.js.map +1 -1
- package/dist/cjs/components/table/TableFilter.d.ts +1 -0
- package/dist/cjs/components/table/TableFilter.d.ts.map +1 -1
- package/dist/cjs/components/table/TableFilter.js +3 -1
- package/dist/cjs/components/table/TableFilter.js.map +1 -1
- package/dist/cjs/components/table/TableFooter.js.map +1 -1
- package/dist/cjs/components/table/TableHeader.d.ts.map +1 -1
- package/dist/cjs/components/table/TableHeader.js +5 -2
- package/dist/cjs/components/table/TableHeader.js.map +1 -1
- package/dist/cjs/components/table/TableLayoutControl.d.ts +3 -0
- package/dist/cjs/components/table/TableLayoutControl.d.ts.map +1 -0
- package/dist/cjs/components/table/TableLayoutControl.js +50 -0
- package/dist/cjs/components/table/TableLayoutControl.js.map +1 -0
- package/dist/cjs/components/table/TableLoading.d.ts +4 -0
- package/dist/cjs/components/table/TableLoading.d.ts.map +1 -0
- package/dist/cjs/components/table/TableLoading.js +28 -0
- package/dist/cjs/components/table/TableLoading.js.map +1 -0
- package/dist/cjs/components/table/TablePagination.js.map +1 -1
- package/dist/cjs/components/table/TablePerPage.js.map +1 -1
- package/dist/cjs/components/table/TablePredicate.d.ts +12 -2
- package/dist/cjs/components/table/TablePredicate.d.ts.map +1 -1
- package/dist/cjs/components/table/TablePredicate.js +29 -4
- package/dist/cjs/components/table/TablePredicate.js.map +1 -1
- package/dist/cjs/components/table/TableSelectableColumn.js.map +1 -1
- package/dist/cjs/components/table/Th.d.ts.map +1 -1
- package/dist/cjs/components/table/Th.js +2 -1
- package/dist/cjs/components/table/Th.js.map +1 -1
- package/dist/cjs/components/table/index.d.ts +1 -0
- package/dist/cjs/components/table/index.d.ts.map +1 -1
- package/dist/cjs/components/table/index.js +12 -3
- package/dist/cjs/components/table/index.js.map +1 -1
- package/dist/cjs/components/table/layouts/RowLayout.d.ts +3 -0
- package/dist/cjs/components/table/layouts/RowLayout.d.ts.map +1 -0
- package/dist/cjs/components/table/layouts/RowLayout.js +156 -0
- package/dist/cjs/components/table/layouts/RowLayout.js.map +1 -0
- package/dist/cjs/components/table/layouts/TableLayouts.d.ts +4 -0
- package/dist/cjs/components/table/layouts/TableLayouts.d.ts.map +1 -0
- package/dist/cjs/components/table/layouts/TableLayouts.js +16 -0
- package/dist/cjs/components/table/layouts/TableLayouts.js.map +1 -0
- package/dist/cjs/components/table/useRowSelection.js.map +1 -1
- package/dist/cjs/form/FormProvider.js.map +1 -1
- package/dist/cjs/form/useForm.js.map +1 -1
- package/dist/cjs/hooks/useControlledList.js.map +1 -1
- package/dist/cjs/hooks/useParentHeight.js.map +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/theme/PlasmaColors.js.map +1 -1
- package/dist/cjs/theme/Plasmantine.js.map +1 -1
- package/dist/cjs/theme/Theme.js +12 -10
- package/dist/cjs/theme/Theme.js.map +1 -1
- package/dist/cjs/utils/createPolymorphicComponent.js.map +1 -1
- package/dist/cjs/utils/overrideComponent.js.map +1 -1
- package/dist/esm/components/blank-slate/BlankSlate.js.map +1 -1
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/button/ButtonWithDisabledTooltip.js.map +1 -1
- package/dist/esm/components/code-editor/CodeEditor.js.map +1 -1
- package/dist/esm/components/code-editor/languages/xml.js.map +1 -1
- package/dist/esm/components/collection/Collection.js.map +1 -1
- package/dist/esm/components/collection/Collection.styles.js.map +1 -1
- package/dist/esm/components/collection/CollectionItem.js.map +1 -1
- package/dist/esm/components/copyToClipboard/CopyToClipboard.js.map +1 -1
- package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.js +5 -5
- package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.js.map +1 -1
- package/dist/esm/components/date-range-picker/DateRangePickerPopoverCalendar.js.map +1 -1
- package/dist/esm/components/date-range-picker/DateRangePickerPresetSelect.js.map +1 -1
- package/dist/esm/components/date-range-picker/EditableDateRangePicker.js.map +1 -1
- package/dist/esm/components/header/Header.d.ts.map +1 -1
- package/dist/esm/components/header/Header.js +3 -0
- package/dist/esm/components/header/Header.js.map +1 -1
- package/dist/esm/components/header/__tests__/__snapshots__/Header.spec.tsx.snap +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirm.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmButton.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmContext.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmMenuItem.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmPrompt.js.map +1 -1
- package/dist/esm/components/inline-confirm/useInlineConfirm.js.map +1 -1
- package/dist/esm/components/menu/Menu.js.map +1 -1
- package/dist/esm/components/modal-wizard/ModalWizard.js.map +1 -1
- package/dist/esm/components/modal-wizard/ModalWizardStep.js.map +1 -1
- package/dist/esm/components/prompt/Prompt.js.map +1 -1
- package/dist/esm/components/prompt/PromptFooter.js.map +1 -1
- package/dist/esm/components/sticky-footer/StickyFooter.js.map +1 -1
- package/dist/esm/components/table/Table.d.ts.map +1 -1
- package/dist/esm/components/table/Table.js +36 -87
- package/dist/esm/components/table/Table.js.map +1 -1
- package/dist/esm/components/table/Table.styles.d.ts +2 -4
- package/dist/esm/components/table/Table.styles.d.ts.map +1 -1
- package/dist/esm/components/table/Table.styles.js +7 -25
- package/dist/esm/components/table/Table.styles.js.map +1 -1
- package/dist/esm/components/table/Table.types.d.ts +68 -2
- package/dist/esm/components/table/Table.types.d.ts.map +1 -1
- package/dist/esm/components/table/Table.types.js.map +1 -1
- package/dist/esm/components/table/TableActions.d.ts +12 -2
- package/dist/esm/components/table/TableActions.d.ts.map +1 -1
- package/dist/esm/components/table/TableActions.js +30 -8
- package/dist/esm/components/table/TableActions.js.map +1 -1
- package/dist/esm/components/table/TableCollapsibleColumn.js.map +1 -1
- package/dist/esm/components/table/TableContext.js.map +1 -1
- package/dist/esm/components/table/TableDateRangePicker.d.ts +12 -1
- package/dist/esm/components/table/TableDateRangePicker.d.ts.map +1 -1
- package/dist/esm/components/table/TableDateRangePicker.js +39 -13
- package/dist/esm/components/table/TableDateRangePicker.js.map +1 -1
- package/dist/esm/components/table/TableFilter.d.ts +1 -0
- package/dist/esm/components/table/TableFilter.d.ts.map +1 -1
- package/dist/esm/components/table/TableFilter.js +3 -1
- package/dist/esm/components/table/TableFilter.js.map +1 -1
- package/dist/esm/components/table/TableFooter.js.map +1 -1
- package/dist/esm/components/table/TableHeader.d.ts.map +1 -1
- package/dist/esm/components/table/TableHeader.js +5 -2
- package/dist/esm/components/table/TableHeader.js.map +1 -1
- package/dist/esm/components/table/TableLayoutControl.d.ts +3 -0
- package/dist/esm/components/table/TableLayoutControl.d.ts.map +1 -0
- package/dist/esm/components/table/TableLayoutControl.js +40 -0
- package/dist/esm/components/table/TableLayoutControl.js.map +1 -0
- package/dist/esm/components/table/TableLoading.d.ts +4 -0
- package/dist/esm/components/table/TableLoading.d.ts.map +1 -0
- package/dist/esm/components/table/TableLoading.js +18 -0
- package/dist/esm/components/table/TableLoading.js.map +1 -0
- package/dist/esm/components/table/TablePagination.js.map +1 -1
- package/dist/esm/components/table/TablePerPage.js.map +1 -1
- package/dist/esm/components/table/TablePredicate.d.ts +12 -2
- package/dist/esm/components/table/TablePredicate.d.ts.map +1 -1
- package/dist/esm/components/table/TablePredicate.js +30 -5
- package/dist/esm/components/table/TablePredicate.js.map +1 -1
- package/dist/esm/components/table/TableSelectableColumn.js.map +1 -1
- package/dist/esm/components/table/Th.d.ts.map +1 -1
- package/dist/esm/components/table/Th.js +2 -1
- package/dist/esm/components/table/Th.js.map +1 -1
- package/dist/esm/components/table/index.d.ts +1 -0
- package/dist/esm/components/table/index.d.ts.map +1 -1
- package/dist/esm/components/table/index.js +1 -0
- package/dist/esm/components/table/index.js.map +1 -1
- package/dist/esm/components/table/layouts/RowLayout.d.ts +3 -0
- package/dist/esm/components/table/layouts/RowLayout.d.ts.map +1 -0
- package/dist/esm/components/table/layouts/RowLayout.js +146 -0
- package/dist/esm/components/table/layouts/RowLayout.js.map +1 -0
- package/dist/esm/components/table/layouts/TableLayouts.d.ts +4 -0
- package/dist/esm/components/table/layouts/TableLayouts.d.ts.map +1 -0
- package/dist/esm/components/table/layouts/TableLayouts.js +6 -0
- package/dist/esm/components/table/layouts/TableLayouts.js.map +1 -0
- package/dist/esm/components/table/useRowSelection.js.map +1 -1
- package/dist/esm/form/FormProvider.js.map +1 -1
- package/dist/esm/form/useForm.js.map +1 -1
- package/dist/esm/hooks/useControlledList.js.map +1 -1
- package/dist/esm/hooks/useParentHeight.js.map +1 -1
- package/dist/esm/theme/PlasmaColors.js.map +1 -1
- package/dist/esm/theme/Theme.js +12 -10
- package/dist/esm/theme/Theme.js.map +1 -1
- package/dist/esm/utils/overrideComponent.js.map +1 -1
- package/package.json +10 -10
- package/src/__tests__/VitestSetup.ts +7 -5
- package/src/components/date-range-picker/DateRangePickerInlineCalendar.tsx +3 -3
- package/src/components/header/Header.tsx +5 -1
- package/src/components/header/__tests__/Header.spec.tsx +1 -1
- package/src/components/header/__tests__/__snapshots__/Header.spec.tsx.snap +1 -1
- package/src/components/table/Table.styles.ts +33 -63
- package/src/components/table/Table.tsx +42 -83
- package/src/components/table/Table.types.ts +71 -2
- package/src/components/table/TableActions.tsx +22 -6
- package/src/components/table/TableDateRangePicker.tsx +34 -12
- package/src/components/table/TableFilter.tsx +4 -3
- package/src/components/table/TableHeader.tsx +10 -2
- package/src/components/table/TableLayoutControl.tsx +29 -0
- package/src/components/table/TableLoading.tsx +8 -0
- package/src/components/table/TablePredicate.tsx +24 -7
- package/src/components/table/Th.tsx +1 -0
- package/src/components/table/__tests__/Table.spec.tsx +140 -316
- package/src/components/table/__tests__/TableDateRangePicker.spec.tsx +41 -14
- package/src/components/table/index.ts +1 -0
- package/src/components/table/layouts/RowLayout.tsx +150 -0
- package/src/components/table/layouts/TableLayouts.tsx +5 -0
- package/src/components/table/layouts/__tests__/RowLayout.spec.tsx +296 -0
- package/src/theme/Theme.tsx +10 -10
|
@@ -1,16 +1,15 @@
|
|
|
1
|
-
import { _ as _define_property } from "@swc/helpers/_/_define_property";
|
|
2
1
|
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
3
2
|
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
4
3
|
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
|
|
5
4
|
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
6
5
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
7
|
-
import { Box, Center,
|
|
6
|
+
import { Box, Center, Loader, Table as MantineTable } from "@mantine/core";
|
|
8
7
|
import { useForm } from "@mantine/form";
|
|
9
8
|
import { useDidUpdate } from "@mantine/hooks";
|
|
10
|
-
import {
|
|
9
|
+
import { getCoreRowModel, useReactTable } from "@tanstack/react-table";
|
|
11
10
|
import debounce from "lodash.debounce";
|
|
12
11
|
import defaultsDeep from "lodash.defaultsdeep";
|
|
13
|
-
import { Children,
|
|
12
|
+
import { Children, useCallback, useEffect, useState } from "react";
|
|
14
13
|
import useStyles from "./Table.styles";
|
|
15
14
|
import { TableActions } from "./TableActions";
|
|
16
15
|
import { TableAccordionColumn, TableCollapsibleColumn } from "./TableCollapsibleColumn";
|
|
@@ -24,22 +23,13 @@ import { TablePagination } from "./TablePagination";
|
|
|
24
23
|
import { TablePerPage } from "./TablePerPage";
|
|
25
24
|
import { TablePredicate } from "./TablePredicate";
|
|
26
25
|
import { TableSelectableColumn } from "./TableSelectableColumn";
|
|
27
|
-
import { Th } from "./Th";
|
|
28
26
|
import { useRowSelection } from "./useRowSelection";
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
style: {
|
|
32
|
-
display: "inline-block"
|
|
33
|
-
}
|
|
34
|
-
}, props), {
|
|
35
|
-
sx: !props.visible ? {
|
|
36
|
-
borderRadius: 0
|
|
37
|
-
} : undefined,
|
|
38
|
-
children: props.children
|
|
39
|
-
}));
|
|
40
|
-
};
|
|
27
|
+
import { TableLoading } from "./TableLoading";
|
|
28
|
+
import { TableLayouts } from "./layouts/TableLayouts";
|
|
41
29
|
export var Table = function(param) {
|
|
42
|
-
var data = param.data, getRowId = param.getRowId, noDataChildren = param.noDataChildren, getExpandChildren = param.getExpandChildren, _param_initialState = param.initialState, initialState = _param_initialState === void 0 ? {} : _param_initialState, columns = param.columns,
|
|
30
|
+
var data = param.data, getRowId = param.getRowId, noDataChildren = param.noDataChildren, getExpandChildren = param.getExpandChildren, _param_initialState = param.initialState, initialState = _param_initialState === void 0 ? {} : _param_initialState, columns = param.columns, _param_layouts = param.layouts, layouts = _param_layouts === void 0 ? [
|
|
31
|
+
TableLayouts.Rows
|
|
32
|
+
] : _param_layouts, onMount = param.onMount, onChange = param.onChange, children = param.children, _param_loading = param.loading, loading = _param_loading === void 0 ? false : _param_loading, doubleClickAction = param.doubleClickAction, multiRowSelectionEnabled = param.multiRowSelectionEnabled, disableRowSelection = param.disableRowSelection, onRowSelectionChange = param.onRowSelectionChange, _param_options = param.options, options = _param_options === void 0 ? {} : _param_options;
|
|
43
33
|
var _form_values, _form_values_dateRange, _form_values_dateRange1;
|
|
44
34
|
var convertedChildren = Children.toArray(children);
|
|
45
35
|
var header = convertedChildren.find(function(child) {
|
|
@@ -55,19 +45,18 @@ export var Table = function(param) {
|
|
|
55
45
|
"predicates",
|
|
56
46
|
"dateRange"
|
|
57
47
|
]);
|
|
58
|
-
var _initialState_predicates, _initialState_dateRange;
|
|
48
|
+
var _initialState_predicates, _initialState_dateRange, _initialState_layout;
|
|
59
49
|
var form = useForm({
|
|
60
50
|
initialValues: {
|
|
61
51
|
predicates: (_initialState_predicates = initialState === null || initialState === void 0 ? void 0 : initialState.predicates) !== null && _initialState_predicates !== void 0 ? _initialState_predicates : {},
|
|
62
52
|
dateRange: (_initialState_dateRange = initialState === null || initialState === void 0 ? void 0 : initialState.dateRange) !== null && _initialState_dateRange !== void 0 ? _initialState_dateRange : [
|
|
63
53
|
null,
|
|
64
54
|
null
|
|
65
|
-
]
|
|
55
|
+
],
|
|
56
|
+
layout: (_initialState_layout = initialState === null || initialState === void 0 ? void 0 : initialState.layout) !== null && _initialState_layout !== void 0 ? _initialState_layout : layouts[0].name
|
|
66
57
|
}
|
|
67
58
|
});
|
|
68
|
-
var
|
|
69
|
-
multiRowSelectionEnabled: multiRowSelectionEnabled
|
|
70
|
-
}), cx = _useStyles.cx, classes = _useStyles.classes;
|
|
59
|
+
var classes = useStyles().classes;
|
|
71
60
|
var _ref;
|
|
72
61
|
var table = useReactTable(_object_spread({
|
|
73
62
|
initialState: defaultsDeep(initialStateWithoutForm, {
|
|
@@ -121,7 +110,8 @@ export var Table = function(param) {
|
|
|
121
110
|
state.globalFilter,
|
|
122
111
|
state.pagination,
|
|
123
112
|
state.sorting,
|
|
124
|
-
form.values
|
|
113
|
+
JSON.stringify(form.values.dateRange),
|
|
114
|
+
JSON.stringify(form.values.predicates)
|
|
125
115
|
]);
|
|
126
116
|
var clearFilters = useCallback(function() {
|
|
127
117
|
var _initialState_predicates;
|
|
@@ -140,57 +130,11 @@ export var Table = function(param) {
|
|
|
140
130
|
children: /*#__PURE__*/ _jsx(Loader, {})
|
|
141
131
|
});
|
|
142
132
|
}
|
|
143
|
-
var
|
|
144
|
-
var
|
|
145
|
-
|
|
146
|
-
var isSelected = !!row.getIsSelected();
|
|
147
|
-
return /*#__PURE__*/ _jsxs(Fragment, {
|
|
148
|
-
children: [
|
|
149
|
-
/*#__PURE__*/ _jsx("tr", {
|
|
150
|
-
onClick: function() {
|
|
151
|
-
return row.toggleSelected();
|
|
152
|
-
},
|
|
153
|
-
onDoubleClick: function() {
|
|
154
|
-
return doubleClickAction === null || doubleClickAction === void 0 ? void 0 : doubleClickAction(row.original);
|
|
155
|
-
},
|
|
156
|
-
className: cx(classes.row, _define_property({}, classes.rowSelected, isSelected)),
|
|
157
|
-
"aria-selected": isSelected,
|
|
158
|
-
children: row.getVisibleCells().map(function(cell) {
|
|
159
|
-
var size = cell.column.getSize();
|
|
160
|
-
var width = size !== defaultColumnSizing.size ? size : undefined;
|
|
161
|
-
return /*#__PURE__*/ _jsx("td", {
|
|
162
|
-
style: {
|
|
163
|
-
width: width
|
|
164
|
-
},
|
|
165
|
-
className: cx(_define_property({}, classes.rowCollapsibleButtonCell, cell.column.id === TableCollapsibleColumn.id)),
|
|
166
|
-
children: /*#__PURE__*/ _jsx(LoadingSkeleton, {
|
|
167
|
-
visible: loading,
|
|
168
|
-
children: flexRender(cell.column.columnDef.cell, cell.getContext())
|
|
169
|
-
})
|
|
170
|
-
}, cell.id);
|
|
171
|
-
})
|
|
172
|
-
}),
|
|
173
|
-
rowChildren ? /*#__PURE__*/ _jsx("tr", {
|
|
174
|
-
children: /*#__PURE__*/ _jsx("td", {
|
|
175
|
-
colSpan: table.getAllColumns().length,
|
|
176
|
-
style: {
|
|
177
|
-
padding: 0,
|
|
178
|
-
borderTop: row.getIsExpanded() ? undefined : "none",
|
|
179
|
-
borderBottom: row.getIsExpanded() ? undefined : "none"
|
|
180
|
-
},
|
|
181
|
-
children: /*#__PURE__*/ _jsx(Collapse, {
|
|
182
|
-
in: row.getIsExpanded(),
|
|
183
|
-
children: /*#__PURE__*/ _jsx(Box, {
|
|
184
|
-
px: "sm",
|
|
185
|
-
py: "xs",
|
|
186
|
-
children: rowChildren
|
|
187
|
-
})
|
|
188
|
-
})
|
|
189
|
-
})
|
|
190
|
-
}) : null
|
|
191
|
-
]
|
|
192
|
-
}, row.id);
|
|
133
|
+
var Layout = layouts.find(function(param) {
|
|
134
|
+
var name = param.name;
|
|
135
|
+
return name === form.values.layout;
|
|
193
136
|
});
|
|
137
|
+
var hasRows = table.getRowModel().rows.length > 0;
|
|
194
138
|
return /*#__PURE__*/ _jsx(Box, {
|
|
195
139
|
ref: outsideClickRef,
|
|
196
140
|
children: /*#__PURE__*/ _jsxs(TableContext.Provider, {
|
|
@@ -206,11 +150,13 @@ export var Table = function(param) {
|
|
|
206
150
|
form: form,
|
|
207
151
|
containerRef: outsideClickRef,
|
|
208
152
|
multiRowSelectionEnabled: multiRowSelectionEnabled,
|
|
209
|
-
getPageCount: table.getPageCount
|
|
153
|
+
getPageCount: table.getPageCount,
|
|
154
|
+
disableRowSelection: disableRowSelection,
|
|
155
|
+
layouts: layouts
|
|
210
156
|
},
|
|
211
157
|
children: [
|
|
212
158
|
consumer,
|
|
213
|
-
!
|
|
159
|
+
!hasRows && !isFiltered && !loading ? noDataChildren : /*#__PURE__*/ _jsxs(_Fragment, {
|
|
214
160
|
children: [
|
|
215
161
|
/*#__PURE__*/ _jsxs(MantineTable, {
|
|
216
162
|
className: classes.table,
|
|
@@ -232,23 +178,24 @@ export var Table = function(param) {
|
|
|
232
178
|
children: header
|
|
233
179
|
})
|
|
234
180
|
}) : null,
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
header: columnHeader
|
|
241
|
-
}, columnHeader.id);
|
|
242
|
-
})
|
|
243
|
-
}, headerGroup.id);
|
|
181
|
+
/*#__PURE__*/ _jsx(Layout.Header, {
|
|
182
|
+
table: table,
|
|
183
|
+
doubleClickAction: doubleClickAction,
|
|
184
|
+
getExpandChildren: getExpandChildren,
|
|
185
|
+
loading: loading
|
|
244
186
|
})
|
|
245
187
|
]
|
|
246
188
|
}),
|
|
247
189
|
/*#__PURE__*/ _jsx("tbody", {
|
|
248
|
-
children:
|
|
190
|
+
children: hasRows ? /*#__PURE__*/ _jsx(Layout.Body, {
|
|
191
|
+
table: table,
|
|
192
|
+
doubleClickAction: doubleClickAction,
|
|
193
|
+
getExpandChildren: getExpandChildren,
|
|
194
|
+
loading: loading
|
|
195
|
+
}) : /*#__PURE__*/ _jsx("tr", {
|
|
249
196
|
children: /*#__PURE__*/ _jsx("td", {
|
|
250
197
|
colSpan: table.getAllColumns().length,
|
|
251
|
-
children: /*#__PURE__*/ _jsx(
|
|
198
|
+
children: /*#__PURE__*/ _jsx(TableLoading, {
|
|
252
199
|
visible: loading,
|
|
253
200
|
children: noDataChildren
|
|
254
201
|
})
|
|
@@ -276,5 +223,7 @@ Table.CollapsibleColumn = TableCollapsibleColumn;
|
|
|
276
223
|
Table.AccordionColumn = TableAccordionColumn;
|
|
277
224
|
Table.DateRangePicker = TableDateRangePicker;
|
|
278
225
|
Table.Consumer = TableConsumer;
|
|
226
|
+
Table.Loading = TableLoading;
|
|
227
|
+
Table.Layouts = TableLayouts;
|
|
279
228
|
|
|
280
229
|
//# sourceMappingURL=Table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/table/Table.tsx"],"sourcesContent":["import {Box, Center, Collapse, Loader, Skeleton, SkeletonProps, Table as MantineTable} from '@mantine/core';\nimport {useForm} from '@mantine/form';\nimport {useDidUpdate} from '@mantine/hooks';\nimport {\n ColumnDef,\n defaultColumnSizing,\n flexRender,\n getCoreRowModel,\n Row,\n TableState as TanstackTableState,\n useReactTable,\n} from '@tanstack/react-table';\nimport debounce from 'lodash.debounce';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport {Children, Dispatch, FC, Fragment, ReactElement, useCallback, useEffect, useState} from 'react';\n\nimport useStyles from './Table.styles';\nimport {TableFormType, TableProps, TableState, TableType} from './Table.types';\nimport {TableActions} from './TableActions';\nimport {TableAccordionColumn, TableCollapsibleColumn} from './TableCollapsibleColumn';\nimport {TableConsumer} from './TableConsumer';\nimport {TableContext} from './TableContext';\nimport {TableDateRangePicker} from './TableDateRangePicker';\nimport {TableFilter} from './TableFilter';\nimport {TableFooter} from './TableFooter';\nimport {TableHeader} from './TableHeader';\nimport {TablePagination} from './TablePagination';\nimport {TablePerPage} from './TablePerPage';\nimport {TablePredicate} from './TablePredicate';\nimport {TableSelectableColumn} from './TableSelectableColumn';\nimport {Th} from './Th';\nimport {useRowSelection} from './useRowSelection';\n\nconst LoadingSkeleton: FC<SkeletonProps> = (props) => (\n <Skeleton style={{display: 'inline-block'}} {...props} sx={!props.visible ? {borderRadius: 0} : undefined}>\n {props.children}\n </Skeleton>\n);\n\nexport const Table: TableType = <T,>({\n data,\n getRowId,\n noDataChildren,\n getExpandChildren,\n initialState = {},\n columns,\n onMount,\n onChange,\n children,\n loading = false,\n doubleClickAction,\n multiRowSelectionEnabled,\n onRowSelectionChange,\n options = {},\n}: TableProps<T>) => {\n const convertedChildren = Children.toArray(children) as ReactElement[];\n const header = convertedChildren.find((child) => child.type === TableHeader);\n const footer = convertedChildren.find((child) => child.type === TableFooter);\n const consumer = convertedChildren.find((child) => child.type === TableConsumer);\n\n const {predicates, dateRange, ...initialStateWithoutForm} = initialState;\n const form = useForm<TableFormType>({\n initialValues: {predicates: initialState?.predicates ?? {}, dateRange: initialState?.dateRange ?? [null, null]},\n });\n const {cx, classes} = useStyles({multiRowSelectionEnabled});\n\n const table = useReactTable({\n initialState: defaultsDeep(initialStateWithoutForm, {pagination: {pageSize: TablePerPage.DEFAULT_SIZE}}),\n data,\n columns: multiRowSelectionEnabled ? [TableSelectableColumn as ColumnDef<T>].concat(columns) : columns,\n getCoreRowModel: getCoreRowModel(),\n manualPagination: options?.getPaginationRowModel === undefined,\n enableMultiRowSelection: !!multiRowSelectionEnabled,\n getRowId,\n getRowCanExpand: (row: Row<T>) => !!getExpandChildren?.(row.original) ?? false,\n enableRowSelection: !loading,\n ...options,\n });\n const [state, setState] = useState<TableState<T>>(table.initialState as TableState<T>);\n table.setOptions((prev) => ({\n ...prev,\n state: state as TanstackTableState,\n onStateChange: setState as Dispatch<React.SetStateAction<TanstackTableState>>,\n }));\n const {clearSelection, getSelectedRow, getSelectedRows, outsideClickRef} = useRowSelection(table, {\n multiRowSelectionEnabled,\n onRowSelectionChange,\n });\n const isFiltered =\n !!state.globalFilter ||\n Object.keys(form.values?.predicates ?? {}).some((predicate) => !!form.values.predicates[predicate]) ||\n !!form.values.dateRange?.[0] ||\n !!form.values.dateRange?.[1];\n\n const triggerChange = debounce(() => onChange?.({...state, ...form.values}), 500);\n\n useEffect(() => {\n onMount?.({...state, ...form.values});\n return () => {\n triggerChange.cancel();\n };\n }, []);\n\n useDidUpdate(() => {\n triggerChange();\n if (!multiRowSelectionEnabled) {\n clearSelection();\n }\n }, [state.globalFilter, state.pagination, state.sorting, form.values]);\n\n const clearFilters = useCallback(() => {\n form.setFieldValue('predicates', initialState.predicates ?? {});\n setState((prevState) => ({...prevState, globalFilter: ''}));\n }, []);\n\n if (!data) {\n return (\n <Center sx={{flexGrow: 1}}>\n <Loader />\n </Center>\n );\n }\n\n const rows = table.getRowModel().rows.map((row) => {\n const rowChildren = getExpandChildren?.(row.original) ?? null;\n const isSelected = !!row.getIsSelected();\n\n return (\n <Fragment key={row.id}>\n <tr\n onClick={() => row.toggleSelected()}\n onDoubleClick={() => doubleClickAction?.(row.original)}\n className={cx(classes.row, {[classes.rowSelected]: isSelected})}\n aria-selected={isSelected}\n >\n {row.getVisibleCells().map((cell) => {\n const size = cell.column.getSize();\n const width = size !== defaultColumnSizing.size ? size : undefined;\n return (\n <td\n key={cell.id}\n style={{width}}\n className={cx({\n [classes.rowCollapsibleButtonCell]: cell.column.id === TableCollapsibleColumn.id,\n })}\n >\n <LoadingSkeleton visible={loading}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </LoadingSkeleton>\n </td>\n );\n })}\n </tr>\n {rowChildren ? (\n <tr>\n <td\n colSpan={table.getAllColumns().length}\n style={{\n padding: 0,\n borderTop: row.getIsExpanded() ? undefined : 'none',\n borderBottom: row.getIsExpanded() ? undefined : 'none',\n }}\n >\n <Collapse in={row.getIsExpanded()}>\n <Box px=\"sm\" py=\"xs\">\n {rowChildren}\n </Box>\n </Collapse>\n </td>\n </tr>\n ) : null}\n </Fragment>\n );\n });\n\n return (\n <Box ref={outsideClickRef}>\n <TableContext.Provider\n value={{\n onChange: triggerChange,\n state,\n isFiltered,\n setState,\n clearFilters,\n getSelectedRow,\n getSelectedRows,\n clearSelection,\n form,\n containerRef: outsideClickRef,\n multiRowSelectionEnabled,\n getPageCount: table.getPageCount,\n }}\n >\n {consumer}\n {!rows.length && !isFiltered && !loading ? (\n noDataChildren\n ) : (\n <>\n <MantineTable className={classes.table} horizontalSpacing=\"sm\" verticalSpacing=\"xs\" pb=\"sm\">\n <thead className={classes.header}>\n {!!header ? (\n <tr>\n <th\n // need to use inline style because Mantine define style on `.mantine-{id} thead tr th`\n style={{padding: 0, fontWeight: 'unset'}}\n colSpan={table.getAllColumns().length}\n >\n {header}\n </th>\n </tr>\n ) : null}\n {table.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id} className={classes.headerColumns}>\n {headerGroup.headers.map((columnHeader) => (\n <Th key={columnHeader.id} header={columnHeader} />\n ))}\n </tr>\n ))}\n </thead>\n <tbody>\n {rows.length ? (\n rows\n ) : (\n <tr>\n <td colSpan={table.getAllColumns().length}>\n <LoadingSkeleton visible={loading}>{noDataChildren}</LoadingSkeleton>\n </td>\n </tr>\n )}\n </tbody>\n </MantineTable>\n {footer}\n </>\n )}\n </TableContext.Provider>\n </Box>\n );\n};\n\nTable.Actions = TableActions;\nTable.Filter = TableFilter;\nTable.Footer = TableFooter;\nTable.Header = TableHeader;\nTable.Pagination = TablePagination;\nTable.Predicate = TablePredicate;\nTable.PerPage = TablePerPage;\nTable.Predicate = TablePredicate;\nTable.CollapsibleColumn = TableCollapsibleColumn;\nTable.AccordionColumn = TableAccordionColumn;\nTable.DateRangePicker = TableDateRangePicker;\nTable.Consumer = TableConsumer;\n"],"names":["Box","Center","Collapse","Loader","Skeleton","Table","MantineTable","useForm","useDidUpdate","defaultColumnSizing","flexRender","getCoreRowModel","useReactTable","debounce","defaultsDeep","Children","Fragment","useCallback","useEffect","useState","useStyles","TableActions","TableAccordionColumn","TableCollapsibleColumn","TableConsumer","TableContext","TableDateRangePicker","TableFilter","TableFooter","TableHeader","TablePagination","TablePerPage","TablePredicate","TableSelectableColumn","Th","useRowSelection","LoadingSkeleton","props","style","display","sx","visible","borderRadius","undefined","children","data","getRowId","noDataChildren","getExpandChildren","initialState","columns","onMount","onChange","loading","doubleClickAction","multiRowSelectionEnabled","onRowSelectionChange","options","form","convertedChildren","toArray","header","find","child","type","footer","consumer","predicates","dateRange","initialStateWithoutForm","initialValues","cx","classes","table","pagination","pageSize","DEFAULT_SIZE","concat","manualPagination","getPaginationRowModel","enableMultiRowSelection","getRowCanExpand","row","original","enableRowSelection","state","setState","setOptions","prev","onStateChange","clearSelection","getSelectedRow","getSelectedRows","outsideClickRef","isFiltered","globalFilter","Object","keys","values","some","predicate","triggerChange","cancel","sorting","clearFilters","setFieldValue","prevState","flexGrow","rows","getRowModel","map","rowChildren","isSelected","getIsSelected","tr","onClick","toggleSelected","onDoubleClick","className","rowSelected","aria-selected","getVisibleCells","cell","size","column","getSize","width","td","rowCollapsibleButtonCell","id","columnDef","getContext","colSpan","getAllColumns","length","padding","borderTop","getIsExpanded","borderBottom","in","px","py","ref","Provider","value","containerRef","getPageCount","horizontalSpacing","verticalSpacing","pb","thead","th","fontWeight","getHeaderGroups","headerGroup","headerColumns","headers","columnHeader","tbody","Actions","Filter","Footer","Header","Pagination","Predicate","PerPage","CollapsibleColumn","AccordionColumn","DateRangePicker","Consumer"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/table/Table.tsx"],"sourcesContent":["import {Box, Center, Loader, Table as MantineTable} from '@mantine/core';\nimport {useForm} from '@mantine/form';\nimport {useDidUpdate} from '@mantine/hooks';\nimport {ColumnDef, Row, TableState as TanstackTableState, getCoreRowModel, useReactTable} from '@tanstack/react-table';\nimport debounce from 'lodash.debounce';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport {Children, Dispatch, ReactElement, useCallback, useEffect, useState} from 'react';\n\nimport useStyles from './Table.styles';\nimport {TableFormType, TableProps, TableState, TableType} from './Table.types';\nimport {TableActions} from './TableActions';\nimport {TableAccordionColumn, TableCollapsibleColumn} from './TableCollapsibleColumn';\nimport {TableConsumer} from './TableConsumer';\nimport {TableContext} from './TableContext';\nimport {TableDateRangePicker} from './TableDateRangePicker';\nimport {TableFilter} from './TableFilter';\nimport {TableFooter} from './TableFooter';\nimport {TableHeader} from './TableHeader';\nimport {TablePagination} from './TablePagination';\nimport {TablePerPage} from './TablePerPage';\nimport {TablePredicate} from './TablePredicate';\nimport {TableSelectableColumn} from './TableSelectableColumn';\nimport {useRowSelection} from './useRowSelection';\nimport {TableLoading} from './TableLoading';\nimport {TableLayouts} from './layouts/TableLayouts';\n\nexport const Table: TableType = <T,>({\n data,\n getRowId,\n noDataChildren,\n getExpandChildren,\n initialState = {},\n columns,\n layouts = [TableLayouts.Rows],\n onMount,\n onChange,\n children,\n loading = false,\n doubleClickAction,\n multiRowSelectionEnabled,\n disableRowSelection,\n onRowSelectionChange,\n options = {},\n}: TableProps<T>) => {\n const convertedChildren = Children.toArray(children) as ReactElement[];\n const header = convertedChildren.find((child) => child.type === TableHeader);\n const footer = convertedChildren.find((child) => child.type === TableFooter);\n const consumer = convertedChildren.find((child) => child.type === TableConsumer);\n\n const {predicates, dateRange, ...initialStateWithoutForm} = initialState;\n const form = useForm<TableFormType>({\n initialValues: {\n predicates: initialState?.predicates ?? {},\n dateRange: initialState?.dateRange ?? [null, null],\n layout: initialState?.layout ?? layouts[0].name,\n },\n });\n const {classes} = useStyles();\n\n const table = useReactTable({\n initialState: defaultsDeep(initialStateWithoutForm, {pagination: {pageSize: TablePerPage.DEFAULT_SIZE}}),\n data,\n columns: multiRowSelectionEnabled ? [TableSelectableColumn as ColumnDef<T>].concat(columns) : columns,\n getCoreRowModel: getCoreRowModel(),\n manualPagination: options?.getPaginationRowModel === undefined,\n enableMultiRowSelection: !!multiRowSelectionEnabled,\n getRowId,\n getRowCanExpand: (row: Row<T>) => !!getExpandChildren?.(row.original) ?? false,\n enableRowSelection: !loading,\n ...options,\n });\n\n const [state, setState] = useState<TableState<T>>(table.initialState as TableState<T>);\n table.setOptions((prev) => ({\n ...prev,\n state: state as TanstackTableState,\n onStateChange: setState as Dispatch<React.SetStateAction<TanstackTableState>>,\n }));\n const {clearSelection, getSelectedRow, getSelectedRows, outsideClickRef} = useRowSelection(table, {\n multiRowSelectionEnabled,\n onRowSelectionChange,\n });\n const isFiltered =\n !!state.globalFilter ||\n Object.keys(form.values?.predicates ?? {}).some((predicate) => !!form.values.predicates[predicate]) ||\n !!form.values.dateRange?.[0] ||\n !!form.values.dateRange?.[1];\n\n const triggerChange = debounce(() => onChange?.({...state, ...form.values}), 500);\n\n useEffect(() => {\n onMount?.({...state, ...form.values});\n return () => {\n triggerChange.cancel();\n };\n }, []);\n\n useDidUpdate(() => {\n triggerChange();\n if (!multiRowSelectionEnabled) {\n clearSelection();\n }\n }, [\n state.globalFilter,\n state.pagination,\n state.sorting,\n JSON.stringify(form.values.dateRange),\n JSON.stringify(form.values.predicates),\n ]);\n\n const clearFilters = useCallback(() => {\n form.setFieldValue('predicates', initialState.predicates ?? {});\n setState((prevState) => ({...prevState, globalFilter: ''}));\n }, []);\n\n if (!data) {\n return (\n <Center sx={{flexGrow: 1}}>\n <Loader />\n </Center>\n );\n }\n\n const Layout = layouts.find(({name}) => name === form.values.layout);\n const hasRows = table.getRowModel().rows.length > 0;\n\n return (\n <Box ref={outsideClickRef}>\n <TableContext.Provider\n value={{\n onChange: triggerChange,\n state,\n isFiltered,\n setState,\n clearFilters,\n getSelectedRow,\n getSelectedRows,\n clearSelection,\n form,\n containerRef: outsideClickRef,\n multiRowSelectionEnabled,\n getPageCount: table.getPageCount,\n disableRowSelection,\n layouts,\n }}\n >\n {consumer}\n {!hasRows && !isFiltered && !loading ? (\n noDataChildren\n ) : (\n <>\n <MantineTable className={classes.table} horizontalSpacing=\"sm\" verticalSpacing=\"xs\" pb=\"sm\">\n <thead className={classes.header}>\n {!!header ? (\n <tr>\n <th\n // need to use inline style because Mantine define style on `.mantine-{id} thead tr th`\n style={{padding: 0, fontWeight: 'unset'}}\n colSpan={table.getAllColumns().length}\n >\n {header}\n </th>\n </tr>\n ) : null}\n <Layout.Header\n table={table}\n doubleClickAction={doubleClickAction}\n getExpandChildren={getExpandChildren}\n loading={loading}\n />\n </thead>\n <tbody>\n {hasRows ? (\n <Layout.Body\n table={table}\n doubleClickAction={doubleClickAction}\n getExpandChildren={getExpandChildren}\n loading={loading}\n />\n ) : (\n <tr>\n <td colSpan={table.getAllColumns().length}>\n <TableLoading visible={loading}>{noDataChildren}</TableLoading>\n </td>\n </tr>\n )}\n </tbody>\n </MantineTable>\n {footer}\n </>\n )}\n </TableContext.Provider>\n </Box>\n );\n};\n\nTable.Actions = TableActions;\nTable.Filter = TableFilter;\nTable.Footer = TableFooter;\nTable.Header = TableHeader;\nTable.Pagination = TablePagination;\nTable.Predicate = TablePredicate;\nTable.PerPage = TablePerPage;\nTable.Predicate = TablePredicate;\nTable.CollapsibleColumn = TableCollapsibleColumn;\nTable.AccordionColumn = TableAccordionColumn;\nTable.DateRangePicker = TableDateRangePicker;\nTable.Consumer = TableConsumer;\nTable.Loading = TableLoading;\nTable.Layouts = TableLayouts;\n"],"names":["Box","Center","Loader","Table","MantineTable","useForm","useDidUpdate","getCoreRowModel","useReactTable","debounce","defaultsDeep","Children","useCallback","useEffect","useState","useStyles","TableActions","TableAccordionColumn","TableCollapsibleColumn","TableConsumer","TableContext","TableDateRangePicker","TableFilter","TableFooter","TableHeader","TablePagination","TablePerPage","TablePredicate","TableSelectableColumn","useRowSelection","TableLoading","TableLayouts","data","getRowId","noDataChildren","getExpandChildren","initialState","columns","layouts","Rows","onMount","onChange","children","loading","doubleClickAction","multiRowSelectionEnabled","disableRowSelection","onRowSelectionChange","options","form","convertedChildren","toArray","header","find","child","type","footer","consumer","predicates","dateRange","initialStateWithoutForm","initialValues","layout","name","classes","table","pagination","pageSize","DEFAULT_SIZE","concat","manualPagination","getPaginationRowModel","undefined","enableMultiRowSelection","getRowCanExpand","row","original","enableRowSelection","state","setState","setOptions","prev","onStateChange","clearSelection","getSelectedRow","getSelectedRows","outsideClickRef","isFiltered","globalFilter","Object","keys","values","some","predicate","triggerChange","cancel","sorting","JSON","stringify","clearFilters","setFieldValue","prevState","sx","flexGrow","Layout","hasRows","getRowModel","rows","length","ref","Provider","value","containerRef","getPageCount","className","horizontalSpacing","verticalSpacing","pb","thead","tr","th","style","padding","fontWeight","colSpan","getAllColumns","Header","tbody","Body","td","visible","Actions","Filter","Footer","Pagination","Predicate","PerPage","CollapsibleColumn","AccordionColumn","DateRangePicker","Consumer","Loading","Layouts"],"mappings":"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"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
multiRowSelectionEnabled: boolean;
|
|
3
|
-
}
|
|
4
|
-
declare const useStyles: (params: TableStylesParams, options?: import("@mantine/core").UseStylesOptions<string>) => {
|
|
1
|
+
declare const useStyles: (params: void, options?: import("@mantine/core").UseStylesOptions<string>) => {
|
|
5
2
|
classes: {
|
|
6
3
|
[x: string]: string;
|
|
7
4
|
};
|
|
@@ -14,6 +11,7 @@ export declare const TableComponentsOrder: {
|
|
|
14
11
|
Predicate: number;
|
|
15
12
|
Filter: number;
|
|
16
13
|
DateRangePicker: number;
|
|
14
|
+
LayoutControl: number;
|
|
17
15
|
};
|
|
18
16
|
export default useStyles;
|
|
19
17
|
//# sourceMappingURL=Table.styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/table/Table.styles.ts"],"names":[],"mappings":"AAEA,
|
|
1
|
+
{"version":3,"file":"Table.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/table/Table.styles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,SAAS;;;;;;CA8BZ,CAAC;AAEJ,eAAO,MAAM,oBAAoB;;;;;;;CAOhC,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import { createStyles } from "@mantine/core";
|
|
2
|
-
var useStyles = createStyles(function(theme
|
|
3
|
-
var multiRowSelectionEnabled = param.multiRowSelectionEnabled;
|
|
4
|
-
var rowBackgroundColor = theme.colorScheme === "dark" ? theme.fn.rgba(theme.colors[theme.primaryColor][7], 0.2) : theme.colors[theme.primaryColor][0];
|
|
2
|
+
var useStyles = createStyles(function(theme) {
|
|
5
3
|
return {
|
|
6
4
|
table: {
|
|
7
5
|
width: "100%",
|
|
@@ -29,32 +27,16 @@ var useStyles = createStyles(function(theme, param) {
|
|
|
29
27
|
bottom: 0,
|
|
30
28
|
borderBottom: "1px solid ".concat(theme.colors.gray[3])
|
|
31
29
|
}
|
|
32
|
-
},
|
|
33
|
-
headerColumns: {
|
|
34
|
-
"& th:first-of-type > *": {
|
|
35
|
-
paddingLeft: theme.spacing.xl
|
|
36
|
-
}
|
|
37
|
-
},
|
|
38
|
-
rowSelected: {
|
|
39
|
-
backgroundColor: multiRowSelectionEnabled ? undefined : rowBackgroundColor
|
|
40
|
-
},
|
|
41
|
-
rowCollapsibleButtonCell: {
|
|
42
|
-
textAlign: "right",
|
|
43
|
-
padding: "calc(".concat(theme.spacing.xs, "/2) ").concat(theme.spacing.sm, " !important")
|
|
44
|
-
},
|
|
45
|
-
row: {
|
|
46
|
-
"&:hover": {
|
|
47
|
-
backgroundColor: rowBackgroundColor
|
|
48
|
-
}
|
|
49
30
|
}
|
|
50
31
|
};
|
|
51
32
|
});
|
|
52
33
|
export var TableComponentsOrder = {
|
|
53
|
-
MultiSelectInfo:
|
|
54
|
-
Actions:
|
|
55
|
-
Predicate:
|
|
56
|
-
Filter:
|
|
57
|
-
DateRangePicker:
|
|
34
|
+
MultiSelectInfo: 6,
|
|
35
|
+
Actions: 5,
|
|
36
|
+
Predicate: 4,
|
|
37
|
+
Filter: 3,
|
|
38
|
+
DateRangePicker: 2,
|
|
39
|
+
LayoutControl: 1
|
|
58
40
|
};
|
|
59
41
|
export default useStyles;
|
|
60
42
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/table/Table.styles.ts"],"sourcesContent":["import {createStyles} from '@mantine/core';\n\
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/table/Table.styles.ts"],"sourcesContent":["import {createStyles} from '@mantine/core';\n\nconst useStyles = createStyles<string>((theme) => ({\n table: {\n width: '100%',\n '& thead tr th': {\n borderBottom: 'none',\n },\n '& td:first-of-type': {\n paddingLeft: theme.spacing.xl,\n },\n '& tbody td': {\n verticalAlign: 'top',\n },\n },\n\n header: {\n position: 'sticky',\n top: 0,\n backgroundColor: theme.colorScheme === 'dark' ? theme.black : theme.white,\n transition: 'box-shadow 150ms ease',\n zIndex: 1,\n\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: 0,\n borderBottom: `1px solid ${theme.colors.gray[3]}`,\n },\n },\n}));\n\nexport const TableComponentsOrder = {\n MultiSelectInfo: 6,\n Actions: 5,\n Predicate: 4,\n Filter: 3,\n DateRangePicker: 2,\n LayoutControl: 1,\n};\n\nexport default useStyles;\n"],"names":["createStyles","useStyles","theme","table","width","borderBottom","paddingLeft","spacing","xl","verticalAlign","header","position","top","backgroundColor","colorScheme","black","white","transition","zIndex","content","left","right","bottom","colors","gray","TableComponentsOrder","MultiSelectInfo","Actions","Predicate","Filter","DateRangePicker","LayoutControl"],"mappings":"AAAA,SAAQA,YAAY,QAAO,gBAAgB;AAE3C,IAAMC,YAAYD,aAAqB,SAACE;WAAW;QAC/CC,OAAO;YACHC,OAAO;YACP,iBAAiB;gBACbC,cAAc;YAClB;YACA,sBAAsB;gBAClBC,aAAaJ,MAAMK,QAAQC;YAC/B;YACA,cAAc;gBACVC,eAAe;YACnB;QACJ;QAEAC,QAAQ;YACJC,UAAU;YACVC,KAAK;YACLC,iBAAiBX,MAAMY,gBAAgB,SAASZ,MAAMa,QAAQb,MAAMc;YACpEC,YAAY;YACZC,QAAQ;YAER,YAAY;gBACRC,SAAS;gBACTR,UAAU;gBACVS,MAAM;gBACNC,OAAO;gBACPC,QAAQ;gBACRjB,cAAc,AAAC,aAAiC,OAArBH,MAAMqB,OAAOC,IAAI,CAAC,EAAE;YACnD;QACJ;IACJ;;AAEA,OAAO,IAAMC,uBAAuB;IAChCC,iBAAiB;IACjBC,SAAS;IACTC,WAAW;IACXC,QAAQ;IACRC,iBAAiB;IACjBC,eAAe;AACnB,EAAE;AAEF,eAAe9B,UAAU"}
|
|
@@ -1,17 +1,20 @@
|
|
|
1
1
|
import { UseFormReturnType } from '@mantine/form';
|
|
2
|
-
import { ColumnDef, CoreOptions, InitialTableState as TanstackInitialTableState,
|
|
2
|
+
import { ColumnDef, CoreOptions, Table, TableOptions, InitialTableState as TanstackInitialTableState, TableState as TanstackTableState } from '@tanstack/table-core';
|
|
3
3
|
import { Dispatch, ReactElement, ReactNode, RefObject } from 'react';
|
|
4
|
+
import { Icon } from '@coveord/plasma-react-icons';
|
|
4
5
|
import { DateRangePickerValue } from '../date-range-picker/DateRangePickerInlineCalendar';
|
|
5
6
|
import { TableActions } from './TableActions';
|
|
6
7
|
import { TableAccordionColumn, TableCollapsibleColumn } from './TableCollapsibleColumn';
|
|
8
|
+
import { TableConsumer } from './TableConsumer';
|
|
7
9
|
import { TableDateRangePicker } from './TableDateRangePicker';
|
|
8
10
|
import { TableFilter } from './TableFilter';
|
|
9
11
|
import { TableFooter } from './TableFooter';
|
|
10
12
|
import { TableHeader } from './TableHeader';
|
|
13
|
+
import { TableLoading } from './TableLoading';
|
|
11
14
|
import { TablePagination } from './TablePagination';
|
|
12
15
|
import { TablePerPage } from './TablePerPage';
|
|
13
16
|
import { TablePredicate } from './TablePredicate';
|
|
14
|
-
import {
|
|
17
|
+
import { TableLayouts } from './layouts/TableLayouts';
|
|
15
18
|
export type RowSelectionWithData<TData> = Record<string, TData>;
|
|
16
19
|
export interface RowSelectionState<TData> {
|
|
17
20
|
rowSelection: RowSelectionWithData<TData>;
|
|
@@ -21,6 +24,43 @@ export interface TableState<TData> extends Omit<TanstackTableState, 'rowSelectio
|
|
|
21
24
|
export interface InitialTableState<TData> extends Omit<TanstackInitialTableState, 'rowSelection'>, Partial<RowSelectionState<TData>>, Partial<TableFormType> {
|
|
22
25
|
}
|
|
23
26
|
export type onTableChangeEvent<TData> = (params: TableState<TData> & TableFormType) => void;
|
|
27
|
+
export interface TableLayout {
|
|
28
|
+
/**
|
|
29
|
+
* Name of the layout.
|
|
30
|
+
* Will be displayed in the layout control
|
|
31
|
+
*/
|
|
32
|
+
name: string;
|
|
33
|
+
/**
|
|
34
|
+
* Icon illustrating the layout.
|
|
35
|
+
* Will be displayed in the layout control
|
|
36
|
+
*/
|
|
37
|
+
icon?: Icon;
|
|
38
|
+
/**
|
|
39
|
+
* Header portion of the table.
|
|
40
|
+
* In the standard row layout that is where column headers would be displayed.
|
|
41
|
+
*/
|
|
42
|
+
Header: <T>(props: TableLayoutProps<T>) => ReactElement;
|
|
43
|
+
/**
|
|
44
|
+
* Body portion of the table.
|
|
45
|
+
* In the standard row layout that is where the rows would be displayed.
|
|
46
|
+
*/
|
|
47
|
+
Body: <T>(props: TableLayoutProps<T>) => ReactElement;
|
|
48
|
+
}
|
|
49
|
+
export interface TableLayoutProps<T = unknown> {
|
|
50
|
+
table: Table<T>;
|
|
51
|
+
loading?: boolean;
|
|
52
|
+
/**
|
|
53
|
+
* Action passed when user double clicks on a row
|
|
54
|
+
*/
|
|
55
|
+
doubleClickAction?: (datum: T) => void;
|
|
56
|
+
/**
|
|
57
|
+
* Function that generates the expandable content of a row
|
|
58
|
+
* Return null for rows that don't need to be expandable
|
|
59
|
+
*
|
|
60
|
+
* @param datum the row for which the children should be generated.
|
|
61
|
+
*/
|
|
62
|
+
getExpandChildren?: (datum: T) => ReactNode;
|
|
63
|
+
}
|
|
24
64
|
export type TableFormType = {
|
|
25
65
|
/**
|
|
26
66
|
* Object containing the table predicates and their selected values
|
|
@@ -34,6 +74,10 @@ export type TableFormType = {
|
|
|
34
74
|
* @example [new Date(2022, 0, 1), new Date(2022, 0, 31)]
|
|
35
75
|
*/
|
|
36
76
|
dateRange: DateRangePickerValue;
|
|
77
|
+
/**
|
|
78
|
+
* Selected layout name
|
|
79
|
+
*/
|
|
80
|
+
layout: TableLayout['name'];
|
|
37
81
|
};
|
|
38
82
|
export type TableContextType<TData> = {
|
|
39
83
|
/**
|
|
@@ -83,10 +127,18 @@ export type TableContextType<TData> = {
|
|
|
83
127
|
* Whether multi row selection is activated
|
|
84
128
|
*/
|
|
85
129
|
multiRowSelectionEnabled: boolean;
|
|
130
|
+
/**
|
|
131
|
+
* Whether row selection is enabled or not
|
|
132
|
+
*/
|
|
133
|
+
disableRowSelection: boolean;
|
|
86
134
|
/**
|
|
87
135
|
* Function that returns the number of pages
|
|
88
136
|
*/
|
|
89
137
|
getPageCount: () => number;
|
|
138
|
+
/**
|
|
139
|
+
* Available layouts. When more than one layout is provided, it will display a layout control to switch between them.
|
|
140
|
+
*/
|
|
141
|
+
layouts: TableLayout[];
|
|
90
142
|
};
|
|
91
143
|
export interface TableProps<T> {
|
|
92
144
|
/**
|
|
@@ -103,6 +155,12 @@ export interface TableProps<T> {
|
|
|
103
155
|
* @see https://tanstack.com/table/v8/docs/guide/column-defs
|
|
104
156
|
*/
|
|
105
157
|
columns: Array<ColumnDef<T>>;
|
|
158
|
+
/**
|
|
159
|
+
* Available layouts
|
|
160
|
+
*
|
|
161
|
+
* @default [Table.Layouts.Rows]
|
|
162
|
+
*/
|
|
163
|
+
layouts?: TableLayout[];
|
|
106
164
|
/**
|
|
107
165
|
* Function called when the table mounts
|
|
108
166
|
*
|
|
@@ -163,6 +221,12 @@ export interface TableProps<T> {
|
|
|
163
221
|
* @default false
|
|
164
222
|
*/
|
|
165
223
|
multiRowSelectionEnabled?: boolean;
|
|
224
|
+
/**
|
|
225
|
+
* Whether row selection is enabled or not
|
|
226
|
+
*
|
|
227
|
+
* @default false
|
|
228
|
+
*/
|
|
229
|
+
disableRowSelection?: boolean;
|
|
166
230
|
/**
|
|
167
231
|
* Additional options that can be passed to the table
|
|
168
232
|
*/
|
|
@@ -181,5 +245,7 @@ export interface TableType {
|
|
|
181
245
|
CollapsibleColumn: typeof TableCollapsibleColumn;
|
|
182
246
|
AccordionColumn: typeof TableAccordionColumn;
|
|
183
247
|
Consumer: typeof TableConsumer;
|
|
248
|
+
Loading: typeof TableLoading;
|
|
249
|
+
Layouts: typeof TableLayouts;
|
|
184
250
|
}
|
|
185
251
|
//# sourceMappingURL=Table.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.types.d.ts","sourceRoot":"","sources":["../../../../src/components/table/Table.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAChD,OAAO,EACH,SAAS,EACT,WAAW,EACX,iBAAiB,IAAI,yBAAyB,EAC9C,
|
|
1
|
+
{"version":3,"file":"Table.types.d.ts","sourceRoot":"","sources":["../../../../src/components/table/Table.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/table/Table.types.ts"],"sourcesContent":["import {UseFormReturnType} from '@mantine/form';\nimport {\n ColumnDef,\n CoreOptions,\n InitialTableState as TanstackInitialTableState,\n
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/table/Table.types.ts"],"sourcesContent":["import {UseFormReturnType} from '@mantine/form';\nimport {\n ColumnDef,\n CoreOptions,\n Table,\n TableOptions,\n InitialTableState as TanstackInitialTableState,\n TableState as TanstackTableState,\n} from '@tanstack/table-core';\nimport {Dispatch, ReactElement, ReactNode, RefObject} from 'react';\n\nimport {Icon} from '@coveord/plasma-react-icons';\nimport {DateRangePickerValue} from '../date-range-picker/DateRangePickerInlineCalendar';\nimport {TableActions} from './TableActions';\nimport {TableAccordionColumn, TableCollapsibleColumn} from './TableCollapsibleColumn';\nimport {TableConsumer} from './TableConsumer';\nimport {TableDateRangePicker} from './TableDateRangePicker';\nimport {TableFilter} from './TableFilter';\nimport {TableFooter} from './TableFooter';\nimport {TableHeader} from './TableHeader';\nimport {TableLoading} from './TableLoading';\nimport {TablePagination} from './TablePagination';\nimport {TablePerPage} from './TablePerPage';\nimport {TablePredicate} from './TablePredicate';\nimport {TableLayouts} from './layouts/TableLayouts';\n\nexport type RowSelectionWithData<TData> = Record<string, TData>;\nexport interface RowSelectionState<TData> {\n rowSelection: RowSelectionWithData<TData>;\n}\n\nexport interface TableState<TData> extends Omit<TanstackTableState, 'rowSelection'>, RowSelectionState<TData> {}\n\nexport interface InitialTableState<TData>\n extends Omit<TanstackInitialTableState, 'rowSelection'>,\n Partial<RowSelectionState<TData>>,\n Partial<TableFormType> {}\n\nexport type onTableChangeEvent<TData> = (params: TableState<TData> & TableFormType) => void;\n\nexport interface TableLayout {\n /**\n * Name of the layout.\n * Will be displayed in the layout control\n */\n name: string;\n /**\n * Icon illustrating the layout.\n * Will be displayed in the layout control\n */\n icon?: Icon;\n /**\n * Header portion of the table.\n * In the standard row layout that is where column headers would be displayed.\n */\n Header: <T>(props: TableLayoutProps<T>) => ReactElement;\n /**\n * Body portion of the table.\n * In the standard row layout that is where the rows would be displayed.\n */\n Body: <T>(props: TableLayoutProps<T>) => ReactElement;\n}\n\nexport interface TableLayoutProps<T = unknown> {\n table: Table<T>;\n loading?: boolean;\n /**\n * Action passed when user double clicks on a row\n */\n doubleClickAction?: (datum: T) => void;\n /**\n * Function that generates the expandable content of a row\n * Return null for rows that don't need to be expandable\n *\n * @param datum the row for which the children should be generated.\n */\n getExpandChildren?: (datum: T) => ReactNode;\n}\n\nexport type TableFormType = {\n /**\n * Object containing the table predicates and their selected values\n *\n * @example {type: \"LONG\", origin: \"system\"}\n */\n predicates: Record<string, string>;\n /**\n * Selected date range in the table\n *\n * @example [new Date(2022, 0, 1), new Date(2022, 0, 31)]\n */\n dateRange: DateRangePickerValue;\n /**\n * Selected layout name\n */\n layout: TableLayout['name'];\n};\n\nexport type TableContextType<TData> = {\n /**\n * Function to call when the table needs an update\n */\n onChange: () => void;\n /**\n * Internal state of the table\n *\n * @see https://tanstack.com/table/v8/docs/api/core/table#state\n */\n state: TableState<TData>;\n /**\n * Function to update the table state\n */\n setState: Dispatch<(prevState: TableState<TData>) => TableState<TData>>;\n /**\n * Whether the table currently as any kind of filter applied.\n * Useful to determine if the noDataChildren is an empty state or just the result of a filter\n */\n isFiltered: boolean;\n /**\n * Function that clears the filter and predicates\n */\n clearFilters: () => void;\n /**\n * Function that returns the selected row if any.\n */\n getSelectedRow: () => TData | null;\n /**\n * Function that returns an array of the selected rows. Most useful when multi row selection is enabled.\n */\n getSelectedRows: () => TData[];\n /**\n * Function that clear the selected row\n */\n clearSelection: () => void;\n /**\n * Form used to handle predicates and dateRange\n */\n form: UseFormReturnType<TableFormType>;\n /**\n * Table container ref\n */\n containerRef: RefObject<HTMLDivElement>;\n /**\n * Whether multi row selection is activated\n */\n multiRowSelectionEnabled: boolean;\n /**\n * Whether row selection is enabled or not\n */\n disableRowSelection: boolean;\n /**\n * Function that returns the number of pages\n */\n getPageCount: () => number;\n /**\n * Available layouts. When more than one layout is provided, it will display a layout control to switch between them.\n */\n layouts: TableLayout[];\n};\n\nexport interface TableProps<T> {\n /**\n * Data to display in the table\n */\n data: T[];\n /**\n * Defines how each row is uniquely identified. It is highly recommended that you specify this prop to an ID that makes sense.\n */\n getRowId?: CoreOptions<T>['getRowId'];\n /**\n * Columns to display in the table.\n *\n * @see https://tanstack.com/table/v8/docs/guide/column-defs\n */\n columns: Array<ColumnDef<T>>;\n /**\n * Available layouts\n *\n * @default [Table.Layouts.Rows]\n */\n layouts?: TableLayout[];\n /**\n * Function called when the table mounts\n *\n * @param state the state of the table\n */\n onMount?: onTableChangeEvent<T>;\n /**\n * Function called when the table should update\n *\n * @param state the state of the table\n */\n onChange?: onTableChangeEvent<T>;\n /**\n * Function that generates the expandable content of a row\n * Return null for rows that don't need to be expandable\n *\n * @param datum the row for which the children should be generated.\n */\n getExpandChildren?: (datum: T) => ReactNode;\n /**\n * React children to show when the table has no rows to show. You can leverage useTable to get the state of the table\n */\n noDataChildren?: ReactNode;\n /**\n * Whether the table is loading or not\n *\n * @default false\n */\n loading?: boolean;\n /**\n * Childrens to display in the table. They need to be wrap in either `Table.Header` or `Table.Footer`\n *\n * @example\n * <Table ...>\n * <Table.Header>\n * <div>Hello</div>\n * </Table.Header>\n * </Table>\n */\n children?: ReactNode;\n /**\n * Initial state of the table\n */\n initialState?: InitialTableState<T>;\n /**\n * Action passed when user double clicks on a row\n */\n doubleClickAction?: (datum: T) => void;\n /**\n * Function called whenever the row selection changes\n *\n * @param selectedRows The selected rows\n */\n onRowSelectionChange?: (selectedRows: T[]) => void;\n /**\n * Whether the user can select multiple rows in order to perform actions in bulk\n *\n * @default false\n */\n multiRowSelectionEnabled?: boolean;\n /**\n * Whether row selection is enabled or not\n *\n * @default false\n */\n disableRowSelection?: boolean;\n /**\n * Additional options that can be passed to the table\n */\n options?: Omit<\n Partial<TableOptions<T>>,\n | 'initialState'\n | 'data'\n | 'columns'\n | 'manualPagination'\n | 'enableMultiRowSelection'\n | 'getRowId'\n | 'getRowCanExpand'\n | 'enableRowSelection'\n | 'onRowSelectionChange'\n >;\n}\n\nexport interface TableType {\n <T>(props: TableProps<T>): ReactElement;\n Actions: typeof TableActions;\n Filter: typeof TableFilter;\n Footer: typeof TableFooter;\n Header: typeof TableHeader;\n Pagination: typeof TablePagination;\n PerPage: typeof TablePerPage;\n Predicate: typeof TablePredicate;\n DateRangePicker: typeof TableDateRangePicker;\n CollapsibleColumn: typeof TableCollapsibleColumn;\n AccordionColumn: typeof TableAccordionColumn;\n Consumer: typeof TableConsumer;\n Loading: typeof TableLoading;\n Layouts: typeof TableLayouts;\n}\n"],"names":[],"mappings":"AAAA,WAuRC"}
|
|
@@ -1,5 +1,15 @@
|
|
|
1
|
+
import { DefaultProps, Selectors } from '@mantine/core';
|
|
1
2
|
import { ReactElement, ReactNode } from 'react';
|
|
2
|
-
|
|
3
|
+
declare const useStyles: (params: void, options?: import("@mantine/core").UseStylesOptions<string>) => {
|
|
4
|
+
classes: {
|
|
5
|
+
root: string;
|
|
6
|
+
wrapper: string;
|
|
7
|
+
};
|
|
8
|
+
cx: (...args: any) => string;
|
|
9
|
+
theme: import("@mantine/core").MantineTheme;
|
|
10
|
+
};
|
|
11
|
+
type TableActionsStylesNames = Selectors<typeof useStyles>;
|
|
12
|
+
interface TableActionsProps<T> extends DefaultProps<TableActionsStylesNames> {
|
|
3
13
|
/**
|
|
4
14
|
* Function that return components for the selected row or selected rows when multi row selection is enabled
|
|
5
15
|
*
|
|
@@ -21,6 +31,6 @@ interface TableActionsProps<T> {
|
|
|
21
31
|
*/
|
|
22
32
|
children: ((datum: T) => ReactNode) | ((data: T[]) => ReactNode);
|
|
23
33
|
}
|
|
24
|
-
export declare const TableActions: <T>({ children }: TableActionsProps<T>) => ReactElement;
|
|
34
|
+
export declare const TableActions: <T>({ children, classNames, styles, unstyled, ...others }: TableActionsProps<T>) => ReactElement;
|
|
25
35
|
export {};
|
|
26
36
|
//# sourceMappingURL=TableActions.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableActions.d.ts","sourceRoot":"","sources":["../../../../src/components/table/TableActions.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TableActions.d.ts","sourceRoot":"","sources":["../../../../src/components/table/TableActions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,YAAY,EAAe,SAAS,EAAC,MAAM,eAAe,CAAC;AACjF,OAAO,EAAC,YAAY,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAK9C,QAAA,MAAM,SAAS;;;;;;;CAKZ,CAAC;AAEJ,KAAK,uBAAuB,GAAG,SAAS,CAAC,OAAO,SAAS,CAAC,CAAC;AAE3D,UAAU,iBAAiB,CAAC,CAAC,CAAE,SAAQ,YAAY,CAAC,uBAAuB,CAAC;IACxE;;;;;;;;;;;;;;;;;;OAkBG;IACH,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC;CACpE;AAED,eAAO,MAAM,YAAY,sFAMC,YAkBzB,CAAC"}
|