@elliemae/ds-data-table 3.5.0-rc.7 → 3.5.1-next.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/dist/cjs/DataTable.js +19 -13
- package/dist/cjs/DataTable.js.map +2 -2
- package/dist/cjs/addons/Columns/ColumnDragHandle/ColumnDragHandle.js +14 -14
- package/dist/cjs/addons/Columns/ColumnDragHandle/ColumnDragHandle.js.map +2 -2
- package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js +49 -43
- package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js.map +2 -2
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +20 -18
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/cjs/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js +19 -17
- package/dist/cjs/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js.map +2 -2
- package/dist/cjs/addons/Editables/ComboboxEditableCell/ComboboxEditableCell.js +4 -3
- package/dist/cjs/addons/Editables/ComboboxEditableCell/ComboboxEditableCell.js.map +2 -2
- package/dist/cjs/addons/Editables/DateEditableCell/DateEditableCell.js +4 -3
- package/dist/cjs/addons/Editables/DateEditableCell/DateEditableCell.js.map +2 -2
- package/dist/cjs/addons/Editables/TextEditableCell/TextEditableCell.js +4 -3
- package/dist/cjs/addons/Editables/TextEditableCell/TextEditableCell.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/index.js +52 -36
- package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/index.js.map +3 -3
- package/dist/cjs/addons/Filters/Components/DateRangeFilter/index.js +31 -24
- package/dist/cjs/addons/Filters/Components/DateRangeFilter/index.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/DateSwitcherFilter/index.js +62 -51
- package/dist/cjs/addons/Filters/Components/DateSwitcherFilter/index.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/NumberRangeFilter/index.js +52 -36
- package/dist/cjs/addons/Filters/Components/NumberRangeFilter/index.js.map +3 -3
- package/dist/cjs/addons/Filters/Components/SelectFilter/BaseSelectFilter.js +30 -18
- package/dist/cjs/addons/Filters/Components/SelectFilter/BaseSelectFilter.js.map +3 -3
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiCreatableFilter.js +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiCreatableFilter.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiSelectFilter.js +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiSelectFilter.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleCreatableFilter.js +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleCreatableFilter.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleSelectFilter.js +2 -2
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleSelectFilter.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/SingleDateFilter/index.js +28 -21
- package/dist/cjs/addons/Filters/Components/SingleDateFilter/index.js.map +2 -2
- package/dist/cjs/addons/Pagination/Pagination.js +3 -2
- package/dist/cjs/addons/Pagination/Pagination.js.map +2 -2
- package/dist/cjs/exported-related/EditableCell.js +18 -8
- package/dist/cjs/exported-related/EditableCell.js.map +2 -2
- package/dist/cjs/exported-related/FilterBar/FilterBarDropdownMenu.js +24 -20
- package/dist/cjs/exported-related/FilterBar/FilterBarDropdownMenu.js.map +2 -2
- package/dist/cjs/exported-related/FilterPopover.js +52 -39
- package/dist/cjs/exported-related/FilterPopover.js.map +2 -2
- package/dist/cjs/exported-related/RowRenderer/DefaultRowContentRenderer.js +43 -35
- package/dist/cjs/exported-related/RowRenderer/DefaultRowContentRenderer.js.map +2 -2
- package/dist/cjs/exported-related/RowRenderer/index.js +34 -27
- package/dist/cjs/exported-related/RowRenderer/index.js.map +2 -2
- package/dist/cjs/exported-related/Toolbar/Toolbar.js +25 -16
- package/dist/cjs/exported-related/Toolbar/Toolbar.js.map +2 -2
- package/dist/cjs/parts/Cells/Cell.js +28 -19
- package/dist/cjs/parts/Cells/Cell.js.map +2 -2
- package/dist/cjs/parts/Cells/index.js +42 -40
- package/dist/cjs/parts/Cells/index.js.map +2 -2
- package/dist/cjs/parts/DnDHandle.js +5 -3
- package/dist/cjs/parts/DnDHandle.js.map +2 -2
- package/dist/cjs/parts/DropIndicator.js +20 -14
- package/dist/cjs/parts/DropIndicator.js.map +2 -2
- package/dist/cjs/parts/EmptyContent.js +28 -15
- package/dist/cjs/parts/EmptyContent.js.map +1 -1
- package/dist/cjs/parts/FilterBar/FiltersBar.js +50 -45
- package/dist/cjs/parts/FilterBar/FiltersBar.js.map +1 -1
- package/dist/cjs/parts/FilterBar/components/DateRangePill.js +16 -10
- package/dist/cjs/parts/FilterBar/components/DateRangePill.js.map +2 -2
- package/dist/cjs/parts/FilterBar/components/DateSwitcherPill.js +16 -10
- package/dist/cjs/parts/FilterBar/components/DateSwitcherPill.js.map +2 -2
- package/dist/cjs/parts/FilterBar/components/MultiSelectPill.js +16 -11
- package/dist/cjs/parts/FilterBar/components/MultiSelectPill.js.map +2 -2
- package/dist/cjs/parts/FilterBar/components/NumberRangePill.js +16 -10
- package/dist/cjs/parts/FilterBar/components/NumberRangePill.js.map +2 -2
- package/dist/cjs/parts/FilterBar/components/SelectPill.js +16 -10
- package/dist/cjs/parts/FilterBar/components/SelectPill.js.map +2 -2
- package/dist/cjs/parts/FilterBar/components/SingleDatePill.js +16 -10
- package/dist/cjs/parts/FilterBar/components/SingleDatePill.js.map +2 -2
- package/dist/cjs/parts/Filters/index.js +4 -3
- package/dist/cjs/parts/Filters/index.js.map +2 -2
- package/dist/cjs/parts/Footer.js +4 -2
- package/dist/cjs/parts/Footer.js.map +2 -2
- package/dist/cjs/parts/Headers/EmptyChildrenGroup.js +2 -2
- package/dist/cjs/parts/Headers/EmptyChildrenGroup.js.map +2 -2
- package/dist/cjs/parts/Headers/HeaderCell.js +62 -44
- package/dist/cjs/parts/Headers/HeaderCell.js.map +2 -2
- package/dist/cjs/parts/Headers/HeaderCellGroup.js +31 -24
- package/dist/cjs/parts/Headers/HeaderCellGroup.js.map +2 -2
- package/dist/cjs/parts/Headers/HeaderCellTitle.js +19 -13
- package/dist/cjs/parts/Headers/HeaderCellTitle.js.map +2 -2
- package/dist/cjs/parts/Headers/HeaderResizer.js +3 -2
- package/dist/cjs/parts/Headers/HeaderResizer.js.map +2 -2
- package/dist/cjs/parts/Headers/RequiredDot.js +10 -9
- package/dist/cjs/parts/Headers/RequiredDot.js.map +2 -2
- package/dist/cjs/parts/Headers/index.js +19 -16
- package/dist/cjs/parts/Headers/index.js.map +2 -2
- package/dist/cjs/parts/HoC/withConditionalDnDColumnContext.js +19 -11
- package/dist/cjs/parts/HoC/withConditionalDnDColumnContext.js.map +1 -1
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js +33 -25
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map +1 -1
- package/dist/cjs/parts/HoC/withConditionalDnDSortableContext.js +9 -7
- package/dist/cjs/parts/HoC/withConditionalDnDSortableContext.js.map +2 -2
- package/dist/cjs/parts/HoC/withDnDSortableColumnContext.js +8 -6
- package/dist/cjs/parts/HoC/withDnDSortableColumnContext.js.map +2 -2
- package/dist/cjs/parts/HoC/withDnDSortableRowContext.js +8 -6
- package/dist/cjs/parts/HoC/withDnDSortableRowContext.js.map +2 -2
- package/dist/cjs/parts/Loader.js +12 -10
- package/dist/cjs/parts/Loader.js.map +2 -2
- package/dist/cjs/parts/Row.js +13 -11
- package/dist/cjs/parts/Row.js.map +2 -2
- package/dist/cjs/parts/RowVariants/RowVariantHeader.js +25 -17
- package/dist/cjs/parts/RowVariants/RowVariantHeader.js.map +2 -2
- package/dist/cjs/parts/RowVariants/RowVariantPrimary.js +2 -2
- package/dist/cjs/parts/RowVariants/RowVariantPrimary.js.map +2 -2
- package/dist/cjs/parts/RowVariants/RowVariantSecondary.js +2 -2
- package/dist/cjs/parts/RowVariants/RowVariantSecondary.js.map +2 -2
- package/dist/cjs/parts/RowVariants/RowVariantSkeleton.js +4 -3
- package/dist/cjs/parts/RowVariants/RowVariantSkeleton.js.map +2 -2
- package/dist/cjs/parts/RowVariants/index.js +4 -4
- package/dist/cjs/parts/RowVariants/index.js.map +2 -2
- package/dist/cjs/parts/Rows.js +28 -25
- package/dist/cjs/parts/Rows.js.map +2 -2
- package/dist/cjs/parts/SortByCaret.js +14 -9
- package/dist/cjs/parts/SortByCaret.js.map +2 -2
- package/dist/cjs/parts/TableContent.js +15 -9
- package/dist/cjs/parts/TableContent.js.map +1 -1
- package/dist/cjs/parts/VirtualRowsList.js +22 -9
- package/dist/cjs/parts/VirtualRowsList.js.map +2 -2
- package/dist/esm/DataTable.js +19 -13
- package/dist/esm/DataTable.js.map +2 -2
- package/dist/esm/addons/Columns/ColumnDragHandle/ColumnDragHandle.js +14 -14
- package/dist/esm/addons/Columns/ColumnDragHandle/ColumnDragHandle.js.map +2 -2
- package/dist/esm/addons/Columns/ColumnExpand/ColumnExpand.js +49 -43
- package/dist/esm/addons/Columns/ColumnExpand/ColumnExpand.js.map +2 -2
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +20 -18
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/esm/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js +19 -17
- package/dist/esm/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js.map +2 -2
- package/dist/esm/addons/Editables/ComboboxEditableCell/ComboboxEditableCell.js +4 -3
- package/dist/esm/addons/Editables/ComboboxEditableCell/ComboboxEditableCell.js.map +2 -2
- package/dist/esm/addons/Editables/DateEditableCell/DateEditableCell.js +4 -3
- package/dist/esm/addons/Editables/DateEditableCell/DateEditableCell.js.map +2 -2
- package/dist/esm/addons/Editables/TextEditableCell/TextEditableCell.js +4 -3
- package/dist/esm/addons/Editables/TextEditableCell/TextEditableCell.js.map +2 -2
- package/dist/esm/addons/Filters/Components/CurrencyRangeFilter/index.js +52 -36
- package/dist/esm/addons/Filters/Components/CurrencyRangeFilter/index.js.map +3 -3
- package/dist/esm/addons/Filters/Components/DateRangeFilter/index.js +31 -24
- package/dist/esm/addons/Filters/Components/DateRangeFilter/index.js.map +2 -2
- package/dist/esm/addons/Filters/Components/DateSwitcherFilter/index.js +62 -51
- package/dist/esm/addons/Filters/Components/DateSwitcherFilter/index.js.map +2 -2
- package/dist/esm/addons/Filters/Components/NumberRangeFilter/index.js +52 -36
- package/dist/esm/addons/Filters/Components/NumberRangeFilter/index.js.map +3 -3
- package/dist/esm/addons/Filters/Components/SelectFilter/BaseSelectFilter.js +30 -18
- package/dist/esm/addons/Filters/Components/SelectFilter/BaseSelectFilter.js.map +3 -3
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiCreatableFilter.js +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiCreatableFilter.js.map +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiSelectFilter.js +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiSelectFilter.js.map +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleCreatableFilter.js +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleCreatableFilter.js.map +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleSelectFilter.js +2 -2
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleSelectFilter.js.map +2 -2
- package/dist/esm/addons/Filters/Components/SingleDateFilter/index.js +28 -21
- package/dist/esm/addons/Filters/Components/SingleDateFilter/index.js.map +2 -2
- package/dist/esm/addons/Pagination/Pagination.js +3 -2
- package/dist/esm/addons/Pagination/Pagination.js.map +2 -2
- package/dist/esm/exported-related/EditableCell.js +18 -8
- package/dist/esm/exported-related/EditableCell.js.map +2 -2
- package/dist/esm/exported-related/FilterBar/FilterBarDropdownMenu.js +24 -20
- package/dist/esm/exported-related/FilterBar/FilterBarDropdownMenu.js.map +2 -2
- package/dist/esm/exported-related/FilterPopover.js +52 -39
- package/dist/esm/exported-related/FilterPopover.js.map +2 -2
- package/dist/esm/exported-related/RowRenderer/DefaultRowContentRenderer.js +43 -35
- package/dist/esm/exported-related/RowRenderer/DefaultRowContentRenderer.js.map +2 -2
- package/dist/esm/exported-related/RowRenderer/index.js +34 -27
- package/dist/esm/exported-related/RowRenderer/index.js.map +2 -2
- package/dist/esm/exported-related/Toolbar/Toolbar.js +25 -16
- package/dist/esm/exported-related/Toolbar/Toolbar.js.map +2 -2
- package/dist/esm/parts/Cells/Cell.js +28 -19
- package/dist/esm/parts/Cells/Cell.js.map +2 -2
- package/dist/esm/parts/Cells/index.js +42 -40
- package/dist/esm/parts/Cells/index.js.map +2 -2
- package/dist/esm/parts/DnDHandle.js +5 -3
- package/dist/esm/parts/DnDHandle.js.map +2 -2
- package/dist/esm/parts/DropIndicator.js +20 -14
- package/dist/esm/parts/DropIndicator.js.map +2 -2
- package/dist/esm/parts/EmptyContent.js +28 -15
- package/dist/esm/parts/EmptyContent.js.map +1 -1
- package/dist/esm/parts/FilterBar/FiltersBar.js +50 -45
- package/dist/esm/parts/FilterBar/FiltersBar.js.map +1 -1
- package/dist/esm/parts/FilterBar/components/DateRangePill.js +16 -10
- package/dist/esm/parts/FilterBar/components/DateRangePill.js.map +2 -2
- package/dist/esm/parts/FilterBar/components/DateSwitcherPill.js +16 -10
- package/dist/esm/parts/FilterBar/components/DateSwitcherPill.js.map +2 -2
- package/dist/esm/parts/FilterBar/components/MultiSelectPill.js +16 -11
- package/dist/esm/parts/FilterBar/components/MultiSelectPill.js.map +2 -2
- package/dist/esm/parts/FilterBar/components/NumberRangePill.js +16 -10
- package/dist/esm/parts/FilterBar/components/NumberRangePill.js.map +2 -2
- package/dist/esm/parts/FilterBar/components/SelectPill.js +16 -10
- package/dist/esm/parts/FilterBar/components/SelectPill.js.map +2 -2
- package/dist/esm/parts/FilterBar/components/SingleDatePill.js +16 -10
- package/dist/esm/parts/FilterBar/components/SingleDatePill.js.map +2 -2
- package/dist/esm/parts/Filters/index.js +4 -3
- package/dist/esm/parts/Filters/index.js.map +2 -2
- package/dist/esm/parts/Footer.js +4 -2
- package/dist/esm/parts/Footer.js.map +2 -2
- package/dist/esm/parts/Headers/EmptyChildrenGroup.js +2 -2
- package/dist/esm/parts/Headers/EmptyChildrenGroup.js.map +2 -2
- package/dist/esm/parts/Headers/HeaderCell.js +62 -44
- package/dist/esm/parts/Headers/HeaderCell.js.map +2 -2
- package/dist/esm/parts/Headers/HeaderCellGroup.js +31 -24
- package/dist/esm/parts/Headers/HeaderCellGroup.js.map +2 -2
- package/dist/esm/parts/Headers/HeaderCellTitle.js +19 -13
- package/dist/esm/parts/Headers/HeaderCellTitle.js.map +2 -2
- package/dist/esm/parts/Headers/HeaderResizer.js +3 -2
- package/dist/esm/parts/Headers/HeaderResizer.js.map +2 -2
- package/dist/esm/parts/Headers/RequiredDot.js +10 -9
- package/dist/esm/parts/Headers/RequiredDot.js.map +2 -2
- package/dist/esm/parts/Headers/index.js +19 -16
- package/dist/esm/parts/Headers/index.js.map +2 -2
- package/dist/esm/parts/HoC/withConditionalDnDColumnContext.js +19 -11
- package/dist/esm/parts/HoC/withConditionalDnDColumnContext.js.map +1 -1
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js +33 -25
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js.map +1 -1
- package/dist/esm/parts/HoC/withConditionalDnDSortableContext.js +9 -7
- package/dist/esm/parts/HoC/withConditionalDnDSortableContext.js.map +2 -2
- package/dist/esm/parts/HoC/withDnDSortableColumnContext.js +8 -6
- package/dist/esm/parts/HoC/withDnDSortableColumnContext.js.map +2 -2
- package/dist/esm/parts/HoC/withDnDSortableRowContext.js +8 -6
- package/dist/esm/parts/HoC/withDnDSortableRowContext.js.map +2 -2
- package/dist/esm/parts/Loader.js +12 -10
- package/dist/esm/parts/Loader.js.map +2 -2
- package/dist/esm/parts/Row.js +13 -11
- package/dist/esm/parts/Row.js.map +2 -2
- package/dist/esm/parts/RowVariants/RowVariantHeader.js +25 -17
- package/dist/esm/parts/RowVariants/RowVariantHeader.js.map +2 -2
- package/dist/esm/parts/RowVariants/RowVariantPrimary.js +2 -2
- package/dist/esm/parts/RowVariants/RowVariantPrimary.js.map +2 -2
- package/dist/esm/parts/RowVariants/RowVariantSecondary.js +2 -2
- package/dist/esm/parts/RowVariants/RowVariantSecondary.js.map +2 -2
- package/dist/esm/parts/RowVariants/RowVariantSkeleton.js +4 -3
- package/dist/esm/parts/RowVariants/RowVariantSkeleton.js.map +2 -2
- package/dist/esm/parts/RowVariants/index.js +4 -4
- package/dist/esm/parts/RowVariants/index.js.map +2 -2
- package/dist/esm/parts/Rows.js +28 -25
- package/dist/esm/parts/Rows.js.map +2 -2
- package/dist/esm/parts/SortByCaret.js +14 -9
- package/dist/esm/parts/SortByCaret.js.map +2 -2
- package/dist/esm/parts/TableContent.js +15 -9
- package/dist/esm/parts/TableContent.js.map +1 -1
- package/dist/esm/parts/VirtualRowsList.js +22 -9
- package/dist/esm/parts/VirtualRowsList.js.map +2 -2
- package/package.json +18 -18
package/dist/cjs/DataTable.js
CHANGED
|
@@ -29,7 +29,8 @@ __export(DataTable_exports, {
|
|
|
29
29
|
});
|
|
30
30
|
module.exports = __toCommonJS(DataTable_exports);
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
|
-
var
|
|
32
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
|
+
var import_react = require("react");
|
|
33
34
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
34
35
|
var import_TableContent = require("./parts/TableContent");
|
|
35
36
|
var import_DataTableContext = require("./DataTableContext");
|
|
@@ -46,18 +47,23 @@ const DataTable = (props) => {
|
|
|
46
47
|
const {
|
|
47
48
|
tableProps: { height, width }
|
|
48
49
|
} = ctx;
|
|
49
|
-
return /* @__PURE__ */
|
|
50
|
-
value: ctx
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
50
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DataTableContext.DataTableContext.Provider, {
|
|
51
|
+
value: ctx,
|
|
52
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.StyledDataTableWrapper, {
|
|
53
|
+
ref: tableWrapperRef,
|
|
54
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_WRAPPER,
|
|
55
|
+
height,
|
|
56
|
+
width,
|
|
57
|
+
cols: ["100%"],
|
|
58
|
+
rows: withFilterBar ? ["auto", "1fr"] : ["1fr"],
|
|
59
|
+
children: [
|
|
60
|
+
withFilterBar ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_FiltersBar.FiltersBar, {}) : null,
|
|
61
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TableContent.TableContent, {
|
|
62
|
+
ref: tableContentWrapperRef
|
|
63
|
+
})
|
|
64
|
+
]
|
|
65
|
+
})
|
|
66
|
+
});
|
|
61
67
|
};
|
|
62
68
|
DataTable.propTypes = import_DataTableSchema.DataTableSchema;
|
|
63
69
|
DataTable.defaultProps = { ...import_DataTableContext.defaultProps };
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DataTable.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { TableContent } from './parts/TableContent';\nimport { TypescriptProps } from './types/props';\nimport { DataTableContext, defaultProps } from './DataTableContext';\nimport { DATA_TESTID } from './configs/constants';\nimport { useDatatableConfig } from './configs/useDatatableConfig';\nimport { FiltersBar } from './parts/FilterBar/FiltersBar';\nimport { DataTableSchema } from './DataTableSchema';\nimport { StyledDataTableWrapper } from './styled';\n\nexport const DataTable = (props: TypescriptProps): JSX.Element => {\n const { withFilterBar } = props;\n\n const tableWrapperRef = useRef();\n const tableContentWrapperRef = useRef();\n\n const ctx = useDatatableConfig(props);\n\n const {\n tableProps: { height, width },\n } = ctx;\n\n return (\n <DataTableContext.Provider value={ctx}>\n <StyledDataTableWrapper\n ref={tableWrapperRef}\n data-testid={DATA_TESTID.DATA_TABLE_WRAPPER}\n height={height}\n width={width}\n cols={['100%']}\n rows={withFilterBar ? ['auto', '1fr'] : ['1fr']}\n >\n {withFilterBar ? <FiltersBar /> : null}\n <TableContent ref={tableContentWrapperRef} />\n </StyledDataTableWrapper>\n </DataTableContext.Provider>\n );\n};\n\nDataTable.propTypes = DataTableSchema;\nDataTable.defaultProps = { ...defaultProps };\nDataTable.displayName = 'DataTable';\nexport const DataTableWithSchema = describe(DataTable).description('Data Table');\nDataTableWithSchema.propTypes = DataTableSchema;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA8B;AAC9B,0BAAyB;AACzB,0BAA6B;AAE7B,8BAA+C;AAC/C,uBAA4B;AAC5B,gCAAmC;AACnC,wBAA2B;AAC3B,6BAAgC;AAChC,oBAAuC;AAEhC,MAAM,YAAY,CAAC,UAAwC;AAChE,QAAM,EAAE,cAAc,IAAI;AAE1B,QAAM,sBAAkB,qBAAO;AAC/B,QAAM,6BAAyB,qBAAO;AAEtC,QAAM,UAAM,8CAAmB,KAAK;AAEpC,QAAM;AAAA,IACJ,YAAY,EAAE,QAAQ,MAAM;AAAA,EAC9B,IAAI;AAEJ,SACE,
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA8B;AAC9B,0BAAyB;AACzB,0BAA6B;AAE7B,8BAA+C;AAC/C,uBAA4B;AAC5B,gCAAmC;AACnC,wBAA2B;AAC3B,6BAAgC;AAChC,oBAAuC;AAEhC,MAAM,YAAY,CAAC,UAAwC;AAChE,QAAM,EAAE,cAAc,IAAI;AAE1B,QAAM,sBAAkB,qBAAO;AAC/B,QAAM,6BAAyB,qBAAO;AAEtC,QAAM,UAAM,8CAAmB,KAAK;AAEpC,QAAM;AAAA,IACJ,YAAY,EAAE,QAAQ,MAAM;AAAA,EAC9B,IAAI;AAEJ,SACE,4CAAC,yCAAiB,UAAjB;AAAA,IAA0B,OAAO;AAAA,IAChC,uDAAC;AAAA,MACC,KAAK;AAAA,MACL,eAAa,6BAAY;AAAA,MACzB;AAAA,MACA;AAAA,MACA,MAAM,CAAC,MAAM;AAAA,MACb,MAAM,gBAAgB,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK;AAAA,MAE7C;AAAA,wBAAgB,4CAAC,gCAAW,IAAK;AAAA,QAClC,4CAAC;AAAA,UAAa,KAAK;AAAA,SAAwB;AAAA;AAAA,KAC7C;AAAA,GACF;AAEJ;AAEA,UAAU,YAAY;AACtB,UAAU,eAAe,EAAE,GAAG,qCAAa;AAC3C,UAAU,cAAc;AACjB,MAAM,0BAAsB,8BAAS,SAAS,EAAE,YAAY,YAAY;AAC/E,oBAAoB,YAAY;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,25 +28,25 @@ __export(ColumnDragHandle_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(ColumnDragHandle_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
32
|
var import_parts = require("../../../parts");
|
|
33
33
|
var import_styled = require("../../../styled");
|
|
34
34
|
const dragHandleColumn = {
|
|
35
35
|
id: "dragHandleColumn",
|
|
36
|
-
Header: () => /* @__PURE__ */
|
|
37
|
-
Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps }) => /* @__PURE__ */
|
|
36
|
+
Header: () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
37
|
+
Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFocusWithin, {
|
|
38
38
|
style: { width: "100%", height: "100%" },
|
|
39
|
-
hideFocus: draggableProps && draggableProps.isDragging
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
})
|
|
39
|
+
hideFocus: draggableProps && draggableProps.isDragging,
|
|
40
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_parts.DnDHandle, {
|
|
41
|
+
id: row.uid,
|
|
42
|
+
isReachable: isRowSelected,
|
|
43
|
+
innerRef: (_ref) => {
|
|
44
|
+
if (!isDragOverlay)
|
|
45
|
+
cell.ref.current = _ref;
|
|
46
|
+
},
|
|
47
|
+
isDragOverlay
|
|
48
|
+
}, row.uid)
|
|
49
|
+
}),
|
|
50
50
|
textWrap: "wrap-all",
|
|
51
51
|
width: 24,
|
|
52
52
|
padding: 4,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Columns/ColumnDragHandle/ColumnDragHandle.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport React from 'react';\nimport { DnDHandle } from '../../../parts';\nimport { StyledFocusWithin } from '../../../styled';\nimport { TypescriptColumn } from '../../../types/props';\n\nexport const dragHandleColumn: TypescriptColumn<HTMLDivElement> = {\n // Build our singleSelecter column\n id: 'dragHandleColumn', // Make sure it has an ID\n // The header doesn't need anything for single selection\n Header: () => <div />,\n Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps }) => (\n <StyledFocusWithin\n style={{ width: '100%', height: '100%' }}\n hideFocus={draggableProps && draggableProps.isDragging}\n >\n <DnDHandle\n id={row.uid}\n key={row.uid}\n isReachable={isRowSelected}\n innerRef={(_ref) => {\n if (!isDragOverlay) cell.ref.current = _ref;\n }}\n isDragOverlay={isDragOverlay}\n />\n </StyledFocusWithin>\n ),\n textWrap: 'wrap-all',\n width: 24,\n padding: 4,\n canResize: false,\n disableDnD: true,\n isFocuseable: false,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,mBAA0B;AAC1B,oBAAkC;AAG3B,MAAM,mBAAqD;AAAA,EAEhE,IAAI;AAAA,EAEJ,QAAQ,MAAM,4CAAC,SAAI;AAAA,EACnB,MAAM,CAAC,EAAE,KAAK,eAAe,MAAM,eAAe,eAAe,MAC/D,4CAAC;AAAA,IACC,OAAO,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,IACvC,WAAW,kBAAkB,eAAe;AAAA,IAE5C,sDAAC;AAAA,MACC,IAAI,IAAI;AAAA,MAER,aAAa;AAAA,MACb,UAAU,CAAC,SAAS;AAClB,YAAI,CAAC;AAAe,eAAK,IAAI,UAAU;AAAA,MACzC;AAAA,MACA;AAAA,OALK,IAAI,GAMX;AAAA,GACF;AAAA,EAEF,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,cAAc;AAChB;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,8 @@ __export(ColumnExpand_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(ColumnExpand_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
32
33
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
33
34
|
var import_ds_system = require("@elliemae/ds-system");
|
|
34
35
|
var import_styled = require("../../../styled");
|
|
@@ -46,19 +47,19 @@ const StyledSpan = import_ds_system.styled.span`
|
|
|
46
47
|
|
|
47
48
|
${({ disabled }) => disabled && disabledCaret}
|
|
48
49
|
`;
|
|
49
|
-
const ArrowDown = ({ color = ["brand-primary", "600"], ...rest }) => /* @__PURE__ */
|
|
50
|
+
const ArrowDown = ({ color = ["brand-primary", "600"], ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadDown, {
|
|
50
51
|
size: "s",
|
|
51
52
|
color,
|
|
52
53
|
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN,
|
|
53
54
|
...rest
|
|
54
55
|
});
|
|
55
|
-
const ArrowMixed = () => /* @__PURE__ */
|
|
56
|
+
const ArrowMixed = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadRight, {
|
|
56
57
|
size: "s",
|
|
57
58
|
color: ["brand-primary", "600"],
|
|
58
59
|
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED,
|
|
59
60
|
style: { transform: "rotate(45deg)" }
|
|
60
61
|
});
|
|
61
|
-
const ArrowRight = ({ color = ["brand-primary", "600"], ...rest }) => /* @__PURE__ */
|
|
62
|
+
const ArrowRight = ({ color = ["brand-primary", "600"], ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadRight, {
|
|
62
63
|
size: "s",
|
|
63
64
|
color,
|
|
64
65
|
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT,
|
|
@@ -102,21 +103,24 @@ const expandRowColumn = {
|
|
|
102
103
|
);
|
|
103
104
|
const GlobalExpandIcon = (0, import_react.useMemo)(() => {
|
|
104
105
|
if (isAllRowsExpanded)
|
|
105
|
-
return /* @__PURE__ */
|
|
106
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowDown, {});
|
|
106
107
|
if (Object.keys(expandedRows).length)
|
|
107
|
-
return /* @__PURE__ */
|
|
108
|
-
return /* @__PURE__ */
|
|
108
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowMixed, {});
|
|
109
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowRight, {});
|
|
109
110
|
}, [expandedRows, isAllRowsExpanded]);
|
|
110
|
-
return /* @__PURE__ */
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
111
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFocusWithin, {
|
|
112
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledSpan, {
|
|
113
|
+
role: "button",
|
|
114
|
+
tabIndex: 0,
|
|
115
|
+
title: "Toggle All Rows Expanded",
|
|
116
|
+
onClick: onExpandedAllHandler,
|
|
117
|
+
onKeyDown: onKeyDownHandler,
|
|
118
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL,
|
|
119
|
+
"aria-expanded": isAllRowsExpanded,
|
|
120
|
+
style: { width: "24px", height: "24px" },
|
|
121
|
+
children: GlobalExpandIcon
|
|
122
|
+
})
|
|
123
|
+
});
|
|
120
124
|
},
|
|
121
125
|
Cell: ({ cell, row, isRowSelected, ctx, draggableProps }) => {
|
|
122
126
|
const {
|
|
@@ -168,39 +172,41 @@ const expandRowColumn = {
|
|
|
168
172
|
);
|
|
169
173
|
const PureCaretIcon = (0, import_react.useMemo)(() => {
|
|
170
174
|
const Caret = isExpanded && !isDragging && !isDragOverlay ? ArrowDown : ArrowRight;
|
|
171
|
-
return /* @__PURE__ */
|
|
175
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Caret, {
|
|
172
176
|
"data-is-col-expanded": isExpanded,
|
|
173
177
|
"data-role": "row-expander-col",
|
|
174
178
|
color: disabledRows[row.uid] ? ["neutral", "400"] : ["brand-primary", "600"]
|
|
175
179
|
});
|
|
176
180
|
}, [isExpanded, isDragging, isDragOverlay, disabledRows, row.uid]);
|
|
177
181
|
if (shouldPrintCaret)
|
|
178
|
-
return /* @__PURE__ */
|
|
179
|
-
style: indentStyle
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
182
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFocusWithin, {
|
|
183
|
+
style: indentStyle,
|
|
184
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledSpan, {
|
|
185
|
+
role: "button",
|
|
186
|
+
title: "Toggle Row Expanded",
|
|
187
|
+
onClick: onRowExpandHandler,
|
|
188
|
+
onKeyDown: onKeyDownHandler,
|
|
189
|
+
ref: cell.ref,
|
|
190
|
+
tabIndex: isRowSelected && !disabledRows[row.uid] ? 0 : -1,
|
|
191
|
+
"data-testid": "data-table-row-expand-cell",
|
|
192
|
+
"aria-expanded": isExpanded,
|
|
193
|
+
isRightArrow: !isExpanded || isDragging || isDragOverlay,
|
|
194
|
+
disabled: disabledRows[row.uid],
|
|
195
|
+
"aria-disabled": disabledRows[row.uid],
|
|
196
|
+
children: PureCaretIcon
|
|
197
|
+
}, `${row.uid}-expand-button`)
|
|
198
|
+
});
|
|
194
199
|
if (row.depth !== 0)
|
|
195
|
-
return /* @__PURE__ */
|
|
196
|
-
style: indentStyle
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
200
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
|
201
|
+
style: indentStyle,
|
|
202
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowShortReturn, {
|
|
203
|
+
size: "s",
|
|
204
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_ICON_CHILD,
|
|
205
|
+
style: { transform: "rotate(90deg) scaleY(-1)" },
|
|
206
|
+
color: ["brand-primary", "600"]
|
|
207
|
+
})
|
|
208
|
+
});
|
|
209
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
204
210
|
style: { width: "36px" }
|
|
205
211
|
});
|
|
206
212
|
},
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Columns/ColumnExpand/ColumnExpand.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useMemo, useCallback } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn } from '@elliemae/ds-icons';\nimport { styled, css } from '@elliemae/ds-system';\nimport { TypescriptColumn } from '../../../types/props';\nimport { StyledFocusWithin } from '../../../styled';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst disabledCaret = css`\n cursor: not-allowed;\n`;\nconst StyledSpan = styled.span<{ disabled: boolean }>`\n cursor: pointer;\n box-sizing: border-box;\n outline: none;\n display: flex;\n justify-content: center;\n align-items: center;\n\n ${({ disabled }) => disabled && disabledCaret}\n`;\n\nconst ArrowDown = ({ color = ['brand-primary', '600'], ...rest }) => (\n <ArrowheadDown size=\"s\" color={color} data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN} {...rest} />\n);\n\nconst ArrowMixed = () => (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n style={{ transform: 'rotate(45deg)' }}\n />\n);\n\nconst ArrowRight = ({ color = ['brand-primary', '600'], ...rest }) => (\n <ArrowheadRight size=\"s\" color={color} data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT} {...rest} />\n);\n\nexport const expandRowColumn: TypescriptColumn<HTMLSpanElement> = {\n // Build our expander column\n id: 'expander', // Make sure it has an ID\n accessor: 'expandRowColumn',\n Header: ({ ctx }) => {\n const {\n tableProps: { expandedRows, onRowExpand, disabledRows },\n allDataFlattened,\n } = ctx;\n\n const allExpandable = useMemo(() => {\n const expandable: Record<string, boolean> = {};\n allDataFlattened.forEach((row) => {\n const isExpandableRow = row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue;\n if (!disabledRows[row.uid] && isExpandableRow) expandable[row.uid] = true;\n });\n return expandable;\n }, [allDataFlattened, disabledRows]);\n\n const isAllRowsExpanded = useMemo(\n () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n [allExpandable, expandedRows],\n );\n\n const onExpandedAllHandler = useCallback(() => {\n if (isAllRowsExpanded) onRowExpand({}, 'All');\n else onRowExpand({ ...allExpandable }, 'All');\n }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n const onKeyDownHandler = useCallback(\n (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) {\n onExpandedAllHandler();\n e.preventDefault();\n }\n },\n [onExpandedAllHandler],\n );\n\n const GlobalExpandIcon = useMemo(() => {\n if (isAllRowsExpanded) return <ArrowDown />;\n if (Object.keys(expandedRows).length) return <ArrowMixed />;\n return <ArrowRight />;\n }, [expandedRows, isAllRowsExpanded]);\n\n return (\n <StyledFocusWithin>\n <StyledSpan\n role=\"button\"\n tabIndex={0}\n title=\"Toggle All Rows Expanded\"\n onClick={onExpandedAllHandler}\n onKeyDown={onKeyDownHandler}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n aria-expanded={isAllRowsExpanded}\n style={{ width: '24px', height: '24px' }}\n >\n {GlobalExpandIcon}\n </StyledSpan>\n </StyledFocusWithin>\n );\n },\n Cell: ({ cell, row, isRowSelected, ctx, draggableProps }) => {\n const {\n tableProps: { dragAndDropRows, expandedRows, onRowExpand, disabledRows },\n } = ctx;\n\n const uniqueId = row.uid;\n\n const isExpanded = !!expandedRows[uniqueId];\n\n const shouldPrintCaret = useMemo(\n () =>\n (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n row.original.tableRowDetails ||\n row.original.dimsumHeaderValue,\n [row.depth, row.original.dimsumHeaderValue, row.original.subRows?.length, row.original.tableRowDetails],\n );\n\n const onRowExpandHandler = useCallback(\n (e: React.MouseEvent | React.KeyboardEvent) => {\n if (disabledRows[row.uid]) return;\n e.stopPropagation(); // to prevent on row click\n if (expandedRows[uniqueId]) {\n delete expandedRows[uniqueId];\n } else {\n expandedRows[uniqueId] = true;\n }\n onRowExpand({ ...expandedRows }, uniqueId);\n },\n [disabledRows, row.uid, expandedRows, uniqueId, onRowExpand],\n );\n\n const onKeyDownHandler = useCallback(\n (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n onRowExpandHandler(e);\n }\n },\n [onRowExpandHandler],\n );\n\n const isDragging = draggableProps && draggableProps.isDragging;\n const isDragOverlay = dragAndDropRows && !draggableProps;\n\n const indentStyle: React.CSSProperties = useMemo(\n () => ({\n marginLeft: `${row.depth * 32}px`,\n marginRight: '18px',\n paddingLeft: '2px',\n paddingRight: '2px',\n position: 'relative',\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n }),\n [row.depth],\n );\n\n const PureCaretIcon = useMemo(() => {\n const Caret = isExpanded && !isDragging && !isDragOverlay ? ArrowDown : ArrowRight;\n return (\n <Caret\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n color={disabledRows[row.uid] ? ['neutral', '400'] : ['brand-primary', '600']}\n />\n );\n }, [isExpanded, isDragging, isDragOverlay, disabledRows, row.uid]);\n\n if (shouldPrintCaret)\n return (\n <StyledFocusWithin style={indentStyle}>\n <StyledSpan\n role=\"button\"\n key={`${row.uid}-expand-button`}\n title=\"Toggle Row Expanded\"\n onClick={onRowExpandHandler}\n onKeyDown={onKeyDownHandler}\n ref={cell.ref}\n tabIndex={isRowSelected && !disabledRows[row.uid] ? 0 : -1}\n data-testid=\"data-table-row-expand-cell\"\n aria-expanded={isExpanded}\n isRightArrow={!isExpanded || isDragging || isDragOverlay}\n disabled={disabledRows[row.uid]}\n aria-disabled={disabledRows[row.uid]}\n >\n {PureCaretIcon}\n </StyledSpan>\n </StyledFocusWithin>\n );\n\n if (row.depth !== 0)\n return (\n <span style={indentStyle}>\n <ArrowShortReturn\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n color={['brand-primary', '600']}\n />\n </span>\n );\n\n return <div style={{ width: '36px' }} />;\n },\n textWrap: 'wrap',\n canResize: false,\n width: 25,\n padding: 0,\n isFocuseable: false,\n disableDnD: true,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAA4C;AAC5C,sBAAgE;AAChE,uBAA4B;AAE5B,oBAAkC;AAClC,uBAA4B;AAE5B,MAAM,gBAAgB;AAAA;AAAA;AAGtB,MAAM,aAAa,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQtB,CAAC,EAAE,SAAS,MAAM,YAAY;AAAA;AAGlC,MAAM,YAAY,CAAC,EAAE,QAAQ,CAAC,iBAAiB,KAAK,MAAM,KAAK,MAC7D,4CAAC;AAAA,EAAc,MAAK;AAAA,EAAI;AAAA,EAAc,eAAa,6BAAY;AAAA,EAA6B,GAAG;AAAA,CAAM;AAGvG,MAAM,aAAa,MACjB,4CAAC;AAAA,EACC,MAAK;AAAA,EACL,OAAO,CAAC,iBAAiB,KAAK;AAAA,EAC9B,eAAa,6BAAY;AAAA,EACzB,OAAO,EAAE,WAAW,gBAAgB;AAAA,CACtC;AAGF,MAAM,aAAa,CAAC,EAAE,QAAQ,CAAC,iBAAiB,KAAK,MAAM,KAAK,MAC9D,4CAAC;AAAA,EAAe,MAAK;AAAA,EAAI;AAAA,EAAc,eAAa,6BAAY;AAAA,EAA8B,GAAG;AAAA,CAAM;AAGlG,MAAM,kBAAqD;AAAA,EAEhE,IAAI;AAAA,EACJ,UAAU;AAAA,EACV,QAAQ,CAAC,EAAE,IAAI,MAAM;AACnB,UAAM;AAAA,MACJ,YAAY,EAAE,cAAc,aAAa,aAAa;AAAA,MACtD;AAAA,IACF,IAAI;AAEJ,UAAM,oBAAgB,sBAAQ,MAAM;AAClC,YAAM,aAAsC,CAAC;AAC7C,uBAAiB,QAAQ,CAAC,QAAQ;AAChC,cAAM,kBAAkB,IAAI,SAAS,WAAW,IAAI,SAAS,mBAAmB,IAAI,SAAS;AAC7F,YAAI,CAAC,aAAa,IAAI,QAAQ;AAAiB,qBAAW,IAAI,OAAO;AAAA,MACvE,CAAC;AACD,aAAO;AAAA,IACT,GAAG,CAAC,kBAAkB,YAAY,CAAC;AAEnC,UAAM,wBAAoB;AAAA,MACxB,MAAM,OAAO,KAAK,aAAa,EAAE,WAAW,OAAO,KAAK,YAAY,EAAE;AAAA,MACtE,CAAC,eAAe,YAAY;AAAA,IAC9B;AAEA,UAAM,2BAAuB,0BAAY,MAAM;AAC7C,UAAI;AAAmB,oBAAY,CAAC,GAAG,KAAK;AAAA;AACvC,oBAAY,EAAE,GAAG,cAAc,GAAG,KAAK;AAAA,IAC9C,GAAG,CAAC,eAAe,mBAAmB,WAAW,CAAC;AAElD,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2B;AAC1B,YAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,GAAG;AACvC,+BAAqB;AACrB,YAAE,eAAe;AAAA,QACnB;AAAA,MACF;AAAA,MACA,CAAC,oBAAoB;AAAA,IACvB;AAEA,UAAM,uBAAmB,sBAAQ,MAAM;AACrC,UAAI;AAAmB,eAAO,4CAAC,aAAU;AACzC,UAAI,OAAO,KAAK,YAAY,EAAE;AAAQ,eAAO,4CAAC,cAAW;AACzD,aAAO,4CAAC,cAAW;AAAA,IACrB,GAAG,CAAC,cAAc,iBAAiB,CAAC;AAEpC,WACE,4CAAC;AAAA,MACC,sDAAC;AAAA,QACC,MAAK;AAAA,QACL,UAAU;AAAA,QACV,OAAM;AAAA,QACN,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,6BAAY;AAAA,QACzB,iBAAe;AAAA,QACf,OAAO,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,QAEtC;AAAA,OACH;AAAA,KACF;AAAA,EAEJ;AAAA,EACA,MAAM,CAAC,EAAE,MAAM,KAAK,eAAe,KAAK,eAAe,MAAM;AAC3D,UAAM;AAAA,MACJ,YAAY,EAAE,iBAAiB,cAAc,aAAa,aAAa;AAAA,IACzE,IAAI;AAEJ,UAAM,WAAW,IAAI;AAErB,UAAM,aAAa,CAAC,CAAC,aAAa;AAElC,UAAM,uBAAmB;AAAA,MACvB,MACG,IAAI,SAAS,SAAS,UAAU,IAAI,UAAU,KAC/C,IAAI,SAAS,mBACb,IAAI,SAAS;AAAA,MACf,CAAC,IAAI,OAAO,IAAI,SAAS,mBAAmB,IAAI,SAAS,SAAS,QAAQ,IAAI,SAAS,eAAe;AAAA,IACxG;AAEA,UAAM,yBAAqB;AAAA,MACzB,CAAC,MAA8C;AAC7C,YAAI,aAAa,IAAI;AAAM;AAC3B,UAAE,gBAAgB;AAClB,YAAI,aAAa,WAAW;AAC1B,iBAAO,aAAa;AAAA,QACtB,OAAO;AACL,uBAAa,YAAY;AAAA,QAC3B;AACA,oBAAY,EAAE,GAAG,aAAa,GAAG,QAAQ;AAAA,MAC3C;AAAA,MACA,CAAC,cAAc,IAAI,KAAK,cAAc,UAAU,WAAW;AAAA,IAC7D;AAEA,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2B;AAC1B,YAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,GAAG;AACvC,YAAE,eAAe;AACjB,6BAAmB,CAAC;AAAA,QACtB;AAAA,MACF;AAAA,MACA,CAAC,kBAAkB;AAAA,IACrB;AAEA,UAAM,aAAa,kBAAkB,eAAe;AACpD,UAAM,gBAAgB,mBAAmB,CAAC;AAE1C,UAAM,kBAAmC;AAAA,MACvC,OAAO;AAAA,QACL,YAAY,GAAG,IAAI,QAAQ;AAAA,QAC3B,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,YAAY;AAAA,MACd;AAAA,MACA,CAAC,IAAI,KAAK;AAAA,IACZ;AAEA,UAAM,oBAAgB,sBAAQ,MAAM;AAClC,YAAM,QAAQ,cAAc,CAAC,cAAc,CAAC,gBAAgB,YAAY;AACxE,aACE,4CAAC;AAAA,QACC,wBAAsB;AAAA,QACtB,aAAU;AAAA,QACV,OAAO,aAAa,IAAI,OAAO,CAAC,WAAW,KAAK,IAAI,CAAC,iBAAiB,KAAK;AAAA,OAC7E;AAAA,IAEJ,GAAG,CAAC,YAAY,YAAY,eAAe,cAAc,IAAI,GAAG,CAAC;AAEjE,QAAI;AACF,aACE,4CAAC;AAAA,QAAkB,OAAO;AAAA,QACxB,sDAAC;AAAA,UACC,MAAK;AAAA,UAEL,OAAM;AAAA,UACN,SAAS;AAAA,UACT,WAAW;AAAA,UACX,KAAK,KAAK;AAAA,UACV,UAAU,iBAAiB,CAAC,aAAa,IAAI,OAAO,IAAI;AAAA,UACxD,eAAY;AAAA,UACZ,iBAAe;AAAA,UACf,cAAc,CAAC,cAAc,cAAc;AAAA,UAC3C,UAAU,aAAa,IAAI;AAAA,UAC3B,iBAAe,aAAa,IAAI;AAAA,UAE/B;AAAA,WAZI,GAAG,IAAI,mBAad;AAAA,OACF;AAGJ,QAAI,IAAI,UAAU;AAChB,aACE,4CAAC;AAAA,QAAK,OAAO;AAAA,QACX,sDAAC;AAAA,UACC,MAAK;AAAA,UACL,eAAa,6BAAY;AAAA,UACzB,OAAO,EAAE,WAAW,2BAA2B;AAAA,UAC/C,OAAO,CAAC,iBAAiB,KAAK;AAAA,SAChC;AAAA,OACF;AAGJ,WAAO,4CAAC;AAAA,MAAI,OAAO,EAAE,OAAO,OAAO;AAAA,KAAG;AAAA,EACxC;AAAA,EACA,UAAU;AAAA,EACV,WAAW;AAAA,EACX,OAAO;AAAA,EACP,SAAS;AAAA,EACT,cAAc;AAAA,EACd,YAAY;AACd;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,8 @@ __export(ColumnSelectMultiple_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(ColumnSelectMultiple_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
32
33
|
var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
|
|
33
34
|
var import_constants = require("../../../configs/constants");
|
|
34
35
|
const stopThePropagation = (e) => e.stopPropagation();
|
|
@@ -64,7 +65,7 @@ const multiSelectColumn = {
|
|
|
64
65
|
() => allDataFlattened.map((datum) => `data-table-checkbox-${datum.uid}`).join(" "),
|
|
65
66
|
[allDataFlattened]
|
|
66
67
|
);
|
|
67
|
-
return /* @__PURE__ */
|
|
68
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledCheckbox, {
|
|
68
69
|
"aria-controls": ariaControls,
|
|
69
70
|
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_GLOBAL_CHECKBOX,
|
|
70
71
|
"aria-label": "Toggle all rows selected",
|
|
@@ -89,24 +90,25 @@ const multiSelectColumn = {
|
|
|
89
90
|
},
|
|
90
91
|
[onSelectionChange, selectedState, selection, uid]
|
|
91
92
|
);
|
|
92
|
-
return /* @__PURE__ */
|
|
93
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
93
94
|
role: "presentation",
|
|
94
95
|
onClick: stopThePropagation,
|
|
95
|
-
onKeyDown: stopThePropagation
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
96
|
+
onKeyDown: stopThePropagation,
|
|
97
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledCheckbox, {
|
|
98
|
+
id: `data-table-checkbox-${uid}`,
|
|
99
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_CHECKBOX,
|
|
100
|
+
"aria-label": "Toggle row selected",
|
|
101
|
+
"aria-checked": selectedState,
|
|
102
|
+
"aria-disabled": false,
|
|
103
|
+
checked: selectedState,
|
|
104
|
+
onClick: onChangeHandler,
|
|
105
|
+
onChange: stopThePropagation,
|
|
106
|
+
disabled: disabledRows[row.uid],
|
|
107
|
+
innerRef: cell.ref,
|
|
108
|
+
tabIndex: isRowSelected ? 0 : -1,
|
|
109
|
+
style: { cursor: "pointer" }
|
|
110
|
+
})
|
|
111
|
+
});
|
|
110
112
|
},
|
|
111
113
|
textWrap: "wrap",
|
|
112
114
|
width: 32,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useMemo, useCallback } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-controlled-form';\nimport { TypescriptColumn, TypescriptSelection } from '../../../types/props';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst stopThePropagation = (e: React.MouseEvent | React.KeyboardEvent) => e.stopPropagation();\n\nexport const multiSelectColumn: TypescriptColumn<HTMLInputElement> = {\n // Build our multiSelecter column\n id: 'multiSelecter', // Make sure it has an ID\n Header: ({ ctx }) => {\n const {\n tableProps: { onSelectionChange, selection, data, disabledRows },\n allDataFlattened,\n } = ctx;\n\n // We for sure have selection, so we just typecast it for TS reasons\n const dtSelection = selection ?? {};\n\n const selectionKeyCount = Object.keys(dtSelection).length;\n\n const currentGlobalState = useMemo(\n () => (selectionKeyCount > 0 && selectionKeyCount < data.length ? 'mixed' : selectionKeyCount > 0),\n [selectionKeyCount, data],\n );\n\n // global state toggling: false to true, mixed to true, true to false\n const newGlobalStateAfterToggle = useMemo(() => currentGlobalState !== true, [currentGlobalState]);\n\n const newSelection: TypescriptSelection = useMemo(() => {\n if (!newGlobalStateAfterToggle) return {};\n\n return allDataFlattened.reduce<TypescriptSelection>((newSelectionObject, datum) => {\n newSelectionObject[datum.uid] = !disabledRows[datum.uid];\n return newSelectionObject;\n }, {});\n }, [newGlobalStateAfterToggle, allDataFlattened, disabledRows]);\n\n const onChangeHandler = useCallback(\n (e: React.ChangeEvent) => {\n onSelectionChange(newSelection, 'All', e);\n },\n [newSelection, onSelectionChange],\n );\n\n const ariaControls = useMemo(\n () => allDataFlattened.map((datum) => `data-table-checkbox-${datum.uid}`).join(' '),\n [allDataFlattened],\n );\n\n return (\n <DSControlledCheckbox\n aria-controls={ariaControls}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_CHECKBOX}\n aria-label=\"Toggle all rows selected\"\n checked={currentGlobalState}\n onChange={onChangeHandler}\n style={{ cursor: 'pointer' }}\n />\n );\n },\n Cell: ({ cell, row, isRowSelected, ctx }) => {\n const {\n tableProps: { onSelectionChange, selection, disabledRows },\n } = ctx;\n const { uid } = row;\n const selectedState = selection?.[uid] ?? false;\n\n const onChangeHandler = useCallback(\n (e: React.ChangeEvent) => {\n const newState = !selectedState;\n const newSelection = { ...selection, [uid]: newState }; // we only want true and mixed values\n if (!newState) delete newSelection[uid]; // if newState is false, remove from the new selection\n onSelectionChange(newSelection, uid, e);\n },\n [onSelectionChange, selectedState, selection, uid],\n );\n\n return (\n <div role=\"presentation\" onClick={stopThePropagation} onKeyDown={stopThePropagation}>\n <DSControlledCheckbox\n id={`data-table-checkbox-${uid}`}\n data-testid={DATA_TESTID.DATA_TABLE_CHECKBOX}\n aria-label=\"Toggle row selected\"\n aria-checked={selectedState}\n aria-disabled={false}\n checked={selectedState}\n onClick={onChangeHandler}\n onChange={stopThePropagation}\n disabled={disabledRows[row.uid]}\n innerRef={cell.ref}\n tabIndex={isRowSelected ? 0 : -1}\n style={{ cursor: 'pointer' }}\n />\n </div>\n );\n },\n textWrap: 'wrap',\n width: 32,\n padding: 7,\n canResize: false,\n isFocuseable: false,\n disableDnD: true,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA4C;AAC5C,gCAAqC;AAErC,uBAA4B;AAE5B,MAAM,qBAAqB,CAAC,MAA8C,EAAE,gBAAgB;AAErF,MAAM,oBAAwD;AAAA,EAEnE,IAAI;AAAA,EACJ,QAAQ,CAAC,EAAE,IAAI,MAAM;AACnB,UAAM;AAAA,MACJ,YAAY,EAAE,mBAAmB,WAAW,MAAM,aAAa;AAAA,MAC/D;AAAA,IACF,IAAI;AAGJ,UAAM,cAAc,aAAa,CAAC;AAElC,UAAM,oBAAoB,OAAO,KAAK,WAAW,EAAE;AAEnD,UAAM,yBAAqB;AAAA,MACzB,MAAO,oBAAoB,KAAK,oBAAoB,KAAK,SAAS,UAAU,oBAAoB;AAAA,MAChG,CAAC,mBAAmB,IAAI;AAAA,IAC1B;AAGA,UAAM,gCAA4B,sBAAQ,MAAM,uBAAuB,MAAM,CAAC,kBAAkB,CAAC;AAEjG,UAAM,mBAAoC,sBAAQ,MAAM;AACtD,UAAI,CAAC;AAA2B,eAAO,CAAC;AAExC,aAAO,iBAAiB,OAA4B,CAAC,oBAAoB,UAAU;AACjF,2BAAmB,MAAM,OAAO,CAAC,aAAa,MAAM;AACpD,eAAO;AAAA,MACT,GAAG,CAAC,CAAC;AAAA,IACP,GAAG,CAAC,2BAA2B,kBAAkB,YAAY,CAAC;AAE9D,UAAM,sBAAkB;AAAA,MACtB,CAAC,MAAyB;AACxB,0BAAkB,cAAc,OAAO,CAAC;AAAA,MAC1C;AAAA,MACA,CAAC,cAAc,iBAAiB;AAAA,IAClC;AAEA,UAAM,mBAAe;AAAA,MACnB,MAAM,iBAAiB,IAAI,CAAC,UAAU,uBAAuB,MAAM,KAAK,EAAE,KAAK,GAAG;AAAA,MAClF,CAAC,gBAAgB;AAAA,IACnB;AAEA,WACE,
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA4C;AAC5C,gCAAqC;AAErC,uBAA4B;AAE5B,MAAM,qBAAqB,CAAC,MAA8C,EAAE,gBAAgB;AAErF,MAAM,oBAAwD;AAAA,EAEnE,IAAI;AAAA,EACJ,QAAQ,CAAC,EAAE,IAAI,MAAM;AACnB,UAAM;AAAA,MACJ,YAAY,EAAE,mBAAmB,WAAW,MAAM,aAAa;AAAA,MAC/D;AAAA,IACF,IAAI;AAGJ,UAAM,cAAc,aAAa,CAAC;AAElC,UAAM,oBAAoB,OAAO,KAAK,WAAW,EAAE;AAEnD,UAAM,yBAAqB;AAAA,MACzB,MAAO,oBAAoB,KAAK,oBAAoB,KAAK,SAAS,UAAU,oBAAoB;AAAA,MAChG,CAAC,mBAAmB,IAAI;AAAA,IAC1B;AAGA,UAAM,gCAA4B,sBAAQ,MAAM,uBAAuB,MAAM,CAAC,kBAAkB,CAAC;AAEjG,UAAM,mBAAoC,sBAAQ,MAAM;AACtD,UAAI,CAAC;AAA2B,eAAO,CAAC;AAExC,aAAO,iBAAiB,OAA4B,CAAC,oBAAoB,UAAU;AACjF,2BAAmB,MAAM,OAAO,CAAC,aAAa,MAAM;AACpD,eAAO;AAAA,MACT,GAAG,CAAC,CAAC;AAAA,IACP,GAAG,CAAC,2BAA2B,kBAAkB,YAAY,CAAC;AAE9D,UAAM,sBAAkB;AAAA,MACtB,CAAC,MAAyB;AACxB,0BAAkB,cAAc,OAAO,CAAC;AAAA,MAC1C;AAAA,MACA,CAAC,cAAc,iBAAiB;AAAA,IAClC;AAEA,UAAM,mBAAe;AAAA,MACnB,MAAM,iBAAiB,IAAI,CAAC,UAAU,uBAAuB,MAAM,KAAK,EAAE,KAAK,GAAG;AAAA,MAClF,CAAC,gBAAgB;AAAA,IACnB;AAEA,WACE,4CAAC;AAAA,MACC,iBAAe;AAAA,MACf,eAAa,6BAAY;AAAA,MACzB,cAAW;AAAA,MACX,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO,EAAE,QAAQ,UAAU;AAAA,KAC7B;AAAA,EAEJ;AAAA,EACA,MAAM,CAAC,EAAE,MAAM,KAAK,eAAe,IAAI,MAAM;AAC3C,UAAM;AAAA,MACJ,YAAY,EAAE,mBAAmB,WAAW,aAAa;AAAA,IAC3D,IAAI;AACJ,UAAM,EAAE,IAAI,IAAI;AAChB,UAAM,gBAAgB,YAAY,QAAQ;AAE1C,UAAM,sBAAkB;AAAA,MACtB,CAAC,MAAyB;AACxB,cAAM,WAAW,CAAC;AAClB,cAAM,eAAe,EAAE,GAAG,WAAW,CAAC,MAAM,SAAS;AACrD,YAAI,CAAC;AAAU,iBAAO,aAAa;AACnC,0BAAkB,cAAc,KAAK,CAAC;AAAA,MACxC;AAAA,MACA,CAAC,mBAAmB,eAAe,WAAW,GAAG;AAAA,IACnD;AAEA,WACE,4CAAC;AAAA,MAAI,MAAK;AAAA,MAAe,SAAS;AAAA,MAAoB,WAAW;AAAA,MAC/D,sDAAC;AAAA,QACC,IAAI,uBAAuB;AAAA,QAC3B,eAAa,6BAAY;AAAA,QACzB,cAAW;AAAA,QACX,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,SAAS;AAAA,QACT,SAAS;AAAA,QACT,UAAU;AAAA,QACV,UAAU,aAAa,IAAI;AAAA,QAC3B,UAAU,KAAK;AAAA,QACf,UAAU,gBAAgB,IAAI;AAAA,QAC9B,OAAO,EAAE,QAAQ,UAAU;AAAA,OAC7B;AAAA,KACF;AAAA,EAEJ;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AACd;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,8 @@ __export(ColumnSelectSingle_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(ColumnSelectSingle_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
32
33
|
var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
|
|
33
34
|
var import_ds_system = require("@elliemae/ds-system");
|
|
34
35
|
var import_constants = require("../../../configs/constants");
|
|
@@ -42,7 +43,7 @@ const CenteredContent = import_ds_system.styled.div`
|
|
|
42
43
|
const stopThePropagation = (e) => e.stopPropagation();
|
|
43
44
|
const singleSelectColumn = {
|
|
44
45
|
id: "singleSelecter",
|
|
45
|
-
Header: () => /* @__PURE__ */
|
|
46
|
+
Header: () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
46
47
|
Cell: ({ cell, row, isRowSelected, ctx }) => {
|
|
47
48
|
const {
|
|
48
49
|
tableProps: { onSelectionChange, selection, disabledRows }
|
|
@@ -55,22 +56,23 @@ const singleSelectColumn = {
|
|
|
55
56
|
},
|
|
56
57
|
[onSelectionChange, selectedState, uid]
|
|
57
58
|
);
|
|
58
|
-
return /* @__PURE__ */
|
|
59
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CenteredContent, {
|
|
59
60
|
onClick: stopThePropagation,
|
|
60
|
-
onKeyDown: stopThePropagation
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
61
|
+
onKeyDown: stopThePropagation,
|
|
62
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledRadio, {
|
|
63
|
+
"aria-checked": selectedState,
|
|
64
|
+
"aria-disabled": disabledRows[row.uid],
|
|
65
|
+
title: "Toggle row selected",
|
|
66
|
+
"aria-label": "Toggle row selected",
|
|
67
|
+
checked: selectedState,
|
|
68
|
+
onChange: onChangeHandler,
|
|
69
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_RADIO,
|
|
70
|
+
disabled: disabledRows[row.uid],
|
|
71
|
+
innerRef: cell.ref,
|
|
72
|
+
value: uid,
|
|
73
|
+
tabIndex: isRowSelected ? 0 : -1
|
|
74
|
+
})
|
|
75
|
+
});
|
|
74
76
|
},
|
|
75
77
|
textWrap: "wrap",
|
|
76
78
|
width: 32,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useCallback } from 'react';\nimport { DSControlledRadio } from '@elliemae/ds-controlled-form';\nimport { styled } from '@elliemae/ds-system';\nimport { TypescriptColumn } from '../../../types/props';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst CenteredContent = styled.div`\n display: flex;\n height: 100%;\n width: 100%;\n justify-content: center;\n align-items: center;\n`;\n\nconst stopThePropagation = (e: React.MouseEvent | React.KeyboardEvent) => e.stopPropagation();\n\nexport const singleSelectColumn: TypescriptColumn<HTMLInputElement> = {\n // Build our singleSelecter column\n id: 'singleSelecter', // Make sure it has an ID\n // The header doesn't need anything for single selection\n Header: () => <div />,\n Cell: ({ cell, row, isRowSelected, ctx }) => {\n const {\n tableProps: { onSelectionChange, selection, disabledRows },\n } = ctx;\n const { uid } = row;\n const selectedState = !!selection?.[uid];\n\n const onChangeHandler = useCallback(\n (newValue: string, e: React.ChangeEvent) => {\n // in single select we only allow one item to be selected\n onSelectionChange({ [uid]: !selectedState }, uid, e);\n },\n [onSelectionChange, selectedState, uid],\n );\n\n return (\n <CenteredContent onClick={stopThePropagation} onKeyDown={stopThePropagation}>\n <DSControlledRadio\n aria-checked={selectedState}\n aria-disabled={disabledRows[row.uid]}\n title=\"Toggle row selected\"\n aria-label=\"Toggle row selected\"\n checked={selectedState}\n onChange={onChangeHandler}\n data-testid={DATA_TESTID.DATA_TABLE_RADIO}\n disabled={disabledRows[row.uid]}\n innerRef={cell.ref}\n value={uid}\n tabIndex={isRowSelected ? 0 : -1}\n />\n </CenteredContent>\n );\n },\n textWrap: 'wrap',\n width: 32,\n padding: 4,\n canResize: false,\n isFocuseable: false,\n disableDnD: true,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAmC;AACnC,gCAAkC;AAClC,uBAAuB;AAEvB,uBAA4B;AAE5B,MAAM,kBAAkB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ/B,MAAM,qBAAqB,CAAC,MAA8C,EAAE,gBAAgB;AAErF,MAAM,qBAAyD;AAAA,EAEpE,IAAI;AAAA,EAEJ,QAAQ,MAAM,
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAmC;AACnC,gCAAkC;AAClC,uBAAuB;AAEvB,uBAA4B;AAE5B,MAAM,kBAAkB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ/B,MAAM,qBAAqB,CAAC,MAA8C,EAAE,gBAAgB;AAErF,MAAM,qBAAyD;AAAA,EAEpE,IAAI;AAAA,EAEJ,QAAQ,MAAM,4CAAC,SAAI;AAAA,EACnB,MAAM,CAAC,EAAE,MAAM,KAAK,eAAe,IAAI,MAAM;AAC3C,UAAM;AAAA,MACJ,YAAY,EAAE,mBAAmB,WAAW,aAAa;AAAA,IAC3D,IAAI;AACJ,UAAM,EAAE,IAAI,IAAI;AAChB,UAAM,gBAAgB,CAAC,CAAC,YAAY;AAEpC,UAAM,sBAAkB;AAAA,MACtB,CAAC,UAAkB,MAAyB;AAE1C,0BAAkB,EAAE,CAAC,MAAM,CAAC,cAAc,GAAG,KAAK,CAAC;AAAA,MACrD;AAAA,MACA,CAAC,mBAAmB,eAAe,GAAG;AAAA,IACxC;AAEA,WACE,4CAAC;AAAA,MAAgB,SAAS;AAAA,MAAoB,WAAW;AAAA,MACvD,sDAAC;AAAA,QACC,gBAAc;AAAA,QACd,iBAAe,aAAa,IAAI;AAAA,QAChC,OAAM;AAAA,QACN,cAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU;AAAA,QACV,eAAa,6BAAY;AAAA,QACzB,UAAU,aAAa,IAAI;AAAA,QAC3B,UAAU,KAAK;AAAA,QACf,OAAO;AAAA,QACP,UAAU,gBAAgB,IAAI;AAAA,OAChC;AAAA,KACF;AAAA,EAEJ;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AACd;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,8 @@ __export(ComboboxEditableCell_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(ComboboxEditableCell_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
32
33
|
var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
|
|
33
34
|
var import_exported_related = require("../../../exported-related");
|
|
34
35
|
var import_DataTableContext = require("../../../DataTableContext");
|
|
@@ -62,9 +63,9 @@ const ComboboxEditableCell = (props) => {
|
|
|
62
63
|
const property = columnId;
|
|
63
64
|
onCellValueChange({ value: value?.value, property, rowIndex: cell.row.index });
|
|
64
65
|
}, [columnId, onCellValueChange, value?.value, cell]);
|
|
65
|
-
return /* @__PURE__ */
|
|
66
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.EditableCell, {
|
|
66
67
|
StandardRender: DefaultCellRender,
|
|
67
|
-
EditableRenderer: /* @__PURE__ */
|
|
68
|
+
EditableRenderer: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSComboBox, {
|
|
68
69
|
selectedValues: value,
|
|
69
70
|
autoFocus: true,
|
|
70
71
|
withoutPortal: false,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Editables/ComboboxEditableCell/ComboboxEditableCell.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable jsx-a11y/no-autofocus */\nimport React, { useContext, useState, useCallback, useMemo } from 'react';\nimport { DSComboBox } from '@elliemae/ds-controlled-form';\nimport { EditableCell } from '../../../exported-related';\nimport { DataTableContext } from '../../../DataTableContext';\n\nexport const ComboboxEditableCell: React.ComponentType<any> = (props) => {\n const { cell, DefaultCellRender, isRowSelected } = props;\n\n const {\n tableProps: { onCellValueChange },\n flattenedData,\n } = useContext(DataTableContext);\n const cellValue = useMemo(() => cell.value, [cell.value]);\n const columnId = useMemo(() => cell.column.id, [cell.column.id]);\n\n const [value, setValue] = useState({\n dsId: cellValue,\n type: 'option',\n value: cellValue,\n label: cellValue,\n });\n\n const uniqueOptions = useMemo(() => {\n const uniqueValuesMap = {};\n return flattenedData.reduce((optionsSoFar, currRow) => {\n const currValue = currRow.original[columnId];\n if (!uniqueValuesMap[currValue]) {\n optionsSoFar.push({ dsId: currValue, type: 'option', value: currValue, label: currValue });\n uniqueValuesMap[currValue] = true;\n }\n return optionsSoFar;\n }, []);\n }, [flattenedData, columnId]);\n\n const [currentOptions, setCurrentOptions] = useState(uniqueOptions);\n\n const handleOnBlur = useCallback(() => {\n const property = columnId;\n onCellValueChange({ value: value?.value, property, rowIndex: cell.row.index });\n }, [columnId, onCellValueChange, value?.value, cell]);\n return (\n <EditableCell\n StandardRender={DefaultCellRender}\n EditableRenderer={\n <DSComboBox\n selectedValues={value}\n autoFocus\n withoutPortal={false}\n onBlur={handleOnBlur}\n onChange={setValue}\n allOptions={uniqueOptions}\n onFilter={setCurrentOptions}\n filteredOptions={currentOptions}\n />\n }\n cell={cell}\n isRowSelected={isRowSelected}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAkE;AAClE,gCAA2B;AAC3B,8BAA6B;AAC7B,8BAAiC;AAE1B,MAAM,uBAAiD,CAAC,UAAU;AACvE,QAAM,EAAE,MAAM,mBAAmB,cAAc,IAAI;AAEnD,QAAM;AAAA,IACJ,YAAY,EAAE,kBAAkB;AAAA,IAChC;AAAA,EACF,QAAI,yBAAW,wCAAgB;AAC/B,QAAM,gBAAY,sBAAQ,MAAM,KAAK,OAAO,CAAC,KAAK,KAAK,CAAC;AACxD,QAAM,eAAW,sBAAQ,MAAM,KAAK,OAAO,IAAI,CAAC,KAAK,OAAO,EAAE,CAAC;AAE/D,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAS;AAAA,IACjC,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,EACT,CAAC;AAED,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,UAAM,kBAAkB,CAAC;AACzB,WAAO,cAAc,OAAO,CAAC,cAAc,YAAY;AACrD,YAAM,YAAY,QAAQ,SAAS;AACnC,UAAI,CAAC,gBAAgB,YAAY;AAC/B,qBAAa,KAAK,EAAE,MAAM,WAAW,MAAM,UAAU,OAAO,WAAW,OAAO,UAAU,CAAC;AACzF,wBAAgB,aAAa;AAAA,MAC/B;AACA,aAAO;AAAA,IACT,GAAG,CAAC,CAAC;AAAA,EACP,GAAG,CAAC,eAAe,QAAQ,CAAC;AAE5B,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAAS,aAAa;AAElE,QAAM,mBAAe,0BAAY,MAAM;AACrC,UAAM,WAAW;AACjB,sBAAkB,EAAE,OAAO,OAAO,OAAO,UAAU,UAAU,KAAK,IAAI,MAAM,CAAC;AAAA,EAC/E,GAAG,CAAC,UAAU,mBAAmB,OAAO,OAAO,IAAI,CAAC;AACpD,SACE,4CAAC;AAAA,IACC,gBAAgB;AAAA,IAChB,kBACE,4CAAC;AAAA,MACC,gBAAgB;AAAA,MAChB,WAAS;AAAA,MACT,eAAe;AAAA,MACf,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,iBAAiB;AAAA,KACnB;AAAA,IAEF;AAAA,IACA;AAAA,GACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,8 @@ __export(DateEditableCell_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(DateEditableCell_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
32
33
|
var import_exported_related = require("../../../exported-related");
|
|
33
34
|
var import_DataTableContext = require("../../../DataTableContext");
|
|
34
35
|
function DateEditableCell(props) {
|
|
@@ -51,9 +52,9 @@ function DateEditableCell(props) {
|
|
|
51
52
|
const rowIndex = cell.row.index;
|
|
52
53
|
onCellValueChange({ value, property, rowIndex });
|
|
53
54
|
}, [value, onCellValueChange, cell.column.id, cell.row.index]);
|
|
54
|
-
return /* @__PURE__ */
|
|
55
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.EditableCell, {
|
|
55
56
|
StandardRender: DefaultCellRender,
|
|
56
|
-
EditableRenderer: /* @__PURE__ */
|
|
57
|
+
EditableRenderer: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
|
|
57
58
|
value,
|
|
58
59
|
onChange: handleOnChange,
|
|
59
60
|
onBlur: handleOnBlur,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Editables/DateEditableCell/DateEditableCell.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable jsx-a11y/no-autofocus */\nimport React, { useContext, useState, useCallback } from 'react';\nimport { EditableCell } from '../../../exported-related';\nimport { DataTableContext } from '../../../DataTableContext';\n\nexport function DateEditableCell(props) {\n const { cell, DefaultCellRender } = props;\n\n const {\n tableProps: { onCellValueChange },\n } = useContext(DataTableContext);\n\n const [value, setValue] = useState(cell.value);\n\n const handleOnChange = useCallback(\n (e) => {\n const {\n target: { value: tValue },\n } = e;\n setValue(tValue);\n },\n [onCellValueChange, value],\n );\n const handleOnBlur = useCallback(() => {\n const property = cell.column.id;\n const rowIndex = cell.row.index;\n onCellValueChange({ value, property, rowIndex });\n }, [value, onCellValueChange, cell.column.id, cell.row.index]);\n\n return (\n <EditableCell\n StandardRender={DefaultCellRender}\n EditableRenderer={\n <input\n value={value}\n onChange={handleOnChange}\n onBlur={handleOnBlur}\n autoFocus\n />\n }\n cell={cell}\n />\n );\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAyD;AACzD,8BAA6B;AAC7B,8BAAiC;AAE1B,SAAS,iBAAiB,OAAO;AACtC,QAAM,EAAE,MAAM,kBAAkB,IAAI;AAEpC,QAAM;AAAA,IACJ,YAAY,EAAE,kBAAkB;AAAA,EAClC,QAAI,yBAAW,wCAAgB;AAE/B,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAS,KAAK,KAAK;AAE7C,QAAM,qBAAiB;AAAA,IACrB,CAAC,MAAM;AACL,YAAM;AAAA,QACJ,QAAQ,EAAE,OAAO,OAAO;AAAA,MAC1B,IAAI;AACJ,eAAS,MAAM;AAAA,IACjB;AAAA,IACA,CAAC,mBAAmB,KAAK;AAAA,EAC3B;AACA,QAAM,mBAAe,0BAAY,MAAM;AACrC,UAAM,WAAW,KAAK,OAAO;AAC7B,UAAM,WAAW,KAAK,IAAI;AAC1B,sBAAkB,EAAE,OAAO,UAAU,SAAS,CAAC;AAAA,EACjD,GAAG,CAAC,OAAO,mBAAmB,KAAK,OAAO,IAAI,KAAK,IAAI,KAAK,CAAC;AAE7D,SACE,4CAAC;AAAA,IACC,gBAAgB;AAAA,IAChB,kBACE,4CAAC;AAAA,MACC;AAAA,MACA,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,WAAS;AAAA,KACX;AAAA,IAEF;AAAA,GACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,8 @@ __export(TextEditableCell_exports, {
|
|
|
28
28
|
});
|
|
29
29
|
module.exports = __toCommonJS(TextEditableCell_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
32
33
|
var import_ds_system = require("@elliemae/ds-system");
|
|
33
34
|
var import_exported_related = require("../../../exported-related");
|
|
34
35
|
var import_DataTableContext = require("../../../DataTableContext");
|
|
@@ -71,9 +72,9 @@ const TextEditableCell = (props) => {
|
|
|
71
72
|
},
|
|
72
73
|
[cell]
|
|
73
74
|
);
|
|
74
|
-
return /* @__PURE__ */
|
|
75
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_exported_related.EditableCell, {
|
|
75
76
|
StandardRender: DefaultCellRender,
|
|
76
|
-
EditableRenderer: /* @__PURE__ */
|
|
77
|
+
EditableRenderer: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, {
|
|
77
78
|
value,
|
|
78
79
|
onKeyDown: handleOnKeyDown,
|
|
79
80
|
onChange: handleOnChange,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Editables/TextEditableCell/TextEditableCell.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable jsx-a11y/no-autofocus */\nimport React, { useContext, useState, useRef, useCallback } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { EditableCell } from '../../../exported-related';\nimport { DataTableContext } from '../../../DataTableContext';\n\nconst StyledInput = styled.input`\n outline: none;\n :focus {\n border: 2px solid ${(props) => props.theme.colors.brand[700]};\n }\n max-width: 100%;\n`;\n\nexport const TextEditableCell: React.ComponentType<any> = (props) => {\n const { cell, DefaultCellRender, isRowSelected } = props;\n const {\n tableProps: { onCellValueChange },\n } = useContext(DataTableContext);\n\n const [value, setValue] = useState<string>(cell.value);\n\n const handleOnChange = useCallback((e) => {\n const {\n target: { value: tValue },\n } = e;\n setValue(tValue);\n }, []);\n\n const handleOnBlur = useCallback(() => {\n const property = cell.column.id;\n const rowIndex = cell.row.index;\n onCellValueChange({ value, property, rowIndex });\n }, [value, onCellValueChange, cell.column.id, cell.row.index]);\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.code === 'Enter') {\n cell.ref.current.focus();\n // will exec on blur callback from input and save new value\n }\n if (e.code === 'Escape') {\n setValue(cell.value);\n const auxRef = cell.ref.current;\n // this prevent the on blur\n setTimeout(() => {\n auxRef.focus();\n });\n }\n },\n [cell],\n );\n return (\n <EditableCell\n StandardRender={DefaultCellRender}\n EditableRenderer={\n <StyledInput\n value={value}\n onKeyDown={handleOnKeyDown}\n onChange={handleOnChange}\n onBlur={handleOnBlur}\n autoFocus\n />\n }\n cell={cell}\n setValue={setValue}\n isRowSelected={isRowSelected}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": [
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAiE;AACjE,uBAAuB;AACvB,8BAA6B;AAC7B,8BAAiC;AAEjC,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA,wBAGH,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAKrD,MAAM,mBAA6C,CAAC,UAAU;AACnE,QAAM,EAAE,MAAM,mBAAmB,cAAc,IAAI;AACnD,QAAM;AAAA,IACJ,YAAY,EAAE,kBAAkB;AAAA,EAClC,QAAI,yBAAW,wCAAgB;AAE/B,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAiB,KAAK,KAAK;AAErD,QAAM,qBAAiB,0BAAY,CAAC,MAAM;AACxC,UAAM;AAAA,MACJ,QAAQ,EAAE,OAAO,OAAO;AAAA,IAC1B,IAAI;AACJ,aAAS,MAAM;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAe,0BAAY,MAAM;AACrC,UAAM,WAAW,KAAK,OAAO;AAC7B,UAAM,WAAW,KAAK,IAAI;AAC1B,sBAAkB,EAAE,OAAO,UAAU,SAAS,CAAC;AAAA,EACjD,GAAG,CAAC,OAAO,mBAAmB,KAAK,OAAO,IAAI,KAAK,IAAI,KAAK,CAAC;AAE7D,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA2B;AAC1B,UAAI,EAAE,SAAS,SAAS;AACtB,aAAK,IAAI,QAAQ,MAAM;AAAA,MAEzB;AACA,UAAI,EAAE,SAAS,UAAU;AACvB,iBAAS,KAAK,KAAK;AACnB,cAAM,SAAS,KAAK,IAAI;AAExB,mBAAW,MAAM;AACf,iBAAO,MAAM;AAAA,QACf,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,IAAI;AAAA,EACP;AACA,SACE,4CAAC;AAAA,IACC,gBAAgB;AAAA,IAChB,kBACE,4CAAC;AAAA,MACC;AAAA,MACA,WAAW;AAAA,MACX,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,WAAS;AAAA,KACX;AAAA,IAEF;AAAA,IACA;AAAA,IACA;AAAA,GACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|