@elliemae/ds-datagrids 2.2.0-alpha.1 → 2.2.0-alpha.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/DSDataGrid.js +395 -635
- package/cjs/DSDataGrid.js.map +7 -0
- package/cjs/DataGridImpl.js +103 -128
- package/cjs/DataGridImpl.js.map +7 -0
- package/cjs/PaginatedDataGrid.js +68 -68
- package/cjs/PaginatedDataGrid.js.map +7 -0
- package/cjs/blockNames.js +39 -11
- package/cjs/blockNames.js.map +7 -0
- package/cjs/columns/IconColumn.js +78 -62
- package/cjs/columns/IconColumn.js.map +7 -0
- package/cjs/columns/NumberColumn.js +35 -5
- package/cjs/columns/NumberColumn.js.map +7 -0
- package/cjs/components/BodyCell.js +83 -80
- package/cjs/components/BodyCell.js.map +7 -0
- package/cjs/components/BodyList.js +52 -52
- package/cjs/components/BodyList.js.map +7 -0
- package/cjs/components/ColumnVisibilityMenuOption.js +53 -31
- package/cjs/components/ColumnVisibilityMenuOption.js.map +7 -0
- package/cjs/components/ColumnsOptionsMenuSection.js +59 -44
- package/cjs/components/ColumnsOptionsMenuSection.js.map +7 -0
- package/cjs/components/EmptyState.js +81 -50
- package/cjs/components/EmptyState.js.map +7 -0
- package/cjs/components/HeaderCell.js +64 -58
- package/cjs/components/HeaderCell.js.map +7 -0
- package/cjs/components/List.js +41 -29
- package/cjs/components/List.js.map +7 -0
- package/cjs/components/ListItem.js +43 -36
- package/cjs/components/ListItem.js.map +7 -0
- package/cjs/components/NoResults.js +55 -51
- package/cjs/components/NoResults.js.map +7 -0
- package/cjs/components/RowsLoader.js +42 -22
- package/cjs/components/RowsLoader.js.map +7 -0
- package/cjs/components/Table.js +78 -87
- package/cjs/components/Table.js.map +7 -0
- package/cjs/components/TableBody.js +61 -60
- package/cjs/components/TableBody.js.map +7 -0
- package/cjs/components/TableHeader.js +47 -30
- package/cjs/components/TableHeader.js.map +7 -0
- package/cjs/components/footer/addOptionalFooterComponents.js +53 -43
- package/cjs/components/footer/addOptionalFooterComponents.js.map +7 -0
- package/cjs/components/header/PrimaryControls.js +49 -35
- package/cjs/components/header/PrimaryControls.js.map +7 -0
- package/cjs/components/header/addOptionalHeaderComponents.js +54 -43
- package/cjs/components/header/addOptionalHeaderComponents.js.map +7 -0
- package/cjs/components/index.js +43 -17
- package/cjs/components/index.js.map +7 -0
- package/cjs/components/renderers/defaultClassedRenderers.js +64 -57
- package/cjs/components/renderers/defaultClassedRenderers.js.map +7 -0
- package/cjs/components/renderers/index.js +44 -17
- package/cjs/components/renderers/index.js.map +7 -0
- package/cjs/components/renderers/renderRowsLoader.js +39 -18
- package/cjs/components/renderers/renderRowsLoader.js.map +7 -0
- package/cjs/components/tableContext.js +36 -13
- package/cjs/components/tableContext.js.map +7 -0
- package/cjs/defaultPlugins.js +44 -12
- package/cjs/defaultPlugins.js.map +7 -0
- package/cjs/index.js +72 -67
- package/cjs/index.js.map +7 -0
- package/cjs/plugins/body-header-scroll-sync/BodyHeaderScrollSyncPlugin.js +102 -114
- package/cjs/plugins/body-header-scroll-sync/BodyHeaderScrollSyncPlugin.js.map +7 -0
- package/cjs/plugins/body-header-scroll-sync/index.js +35 -9
- package/cjs/plugins/body-header-scroll-sync/index.js.map +7 -0
- package/cjs/plugins/column-dnd/DndColumnsPlugin.js +107 -86
- package/cjs/plugins/column-dnd/DndColumnsPlugin.js.map +7 -0
- package/cjs/plugins/column-dnd/decorateGridWithDndColumns.js +43 -27
- package/cjs/plugins/column-dnd/decorateGridWithDndColumns.js.map +7 -0
- package/cjs/plugins/column-dnd/index.js +35 -9
- package/cjs/plugins/column-dnd/index.js.map +7 -0
- package/cjs/plugins/column-sizing/ColumnSizingPlugin.js +59 -55
- package/cjs/plugins/column-sizing/ColumnSizingPlugin.js.map +7 -0
- package/cjs/plugins/column-sizing/columnMeasurerTransformer.js +48 -53
- package/cjs/plugins/column-sizing/columnMeasurerTransformer.js.map +7 -0
- package/cjs/plugins/column-sizing/ext-points/decorateColumn.js +40 -13
- package/cjs/plugins/column-sizing/ext-points/decorateColumn.js.map +7 -0
- package/cjs/plugins/column-sizing/ext-points/getTableProps.js +55 -54
- package/cjs/plugins/column-sizing/ext-points/getTableProps.js.map +7 -0
- package/cjs/plugins/column-sizing/getColumnNameFromProperty.js +37 -9
- package/cjs/plugins/column-sizing/getColumnNameFromProperty.js.map +7 -0
- package/cjs/plugins/column-sizing/index.js +35 -9
- package/cjs/plugins/column-sizing/index.js.map +7 -0
- package/cjs/plugins/column-sizing/useColumnSizeService.js +72 -86
- package/cjs/plugins/column-sizing/useColumnSizeService.js.map +7 -0
- package/cjs/plugins/column-sizing/useStylesheetHelpers.js +96 -199
- package/cjs/plugins/column-sizing/useStylesheetHelpers.js.map +7 -0
- package/cjs/plugins/column-sizing/utils.js +52 -29
- package/cjs/plugins/column-sizing/utils.js.map +7 -0
- package/cjs/plugins/custom-cell-renderer/CustomRendererPlugin.js +38 -16
- package/cjs/plugins/custom-cell-renderer/CustomRendererPlugin.js.map +7 -0
- package/cjs/plugins/custom-cell-renderer/addCustomRendererToCell.js +61 -56
- package/cjs/plugins/custom-cell-renderer/addCustomRendererToCell.js.map +7 -0
- package/cjs/plugins/custom-cell-renderer/getRendererComponent.js +58 -60
- package/cjs/plugins/custom-cell-renderer/getRendererComponent.js.map +7 -0
- package/cjs/plugins/custom-cell-renderer/index.js +35 -9
- package/cjs/plugins/custom-cell-renderer/index.js.map +7 -0
- package/cjs/plugins/editable/EditableComponents/ComboBox.js +50 -53
- package/cjs/plugins/editable/EditableComponents/ComboBox.js.map +7 -0
- package/cjs/plugins/editable/EditableComponents/TextBox.js +56 -76
- package/cjs/plugins/editable/EditableComponents/TextBox.js.map +7 -0
- package/cjs/plugins/editable/EditableComponents/index.js +37 -11
- package/cjs/plugins/editable/EditableComponents/index.js.map +7 -0
- package/cjs/plugins/editable/EditablePlugin.js +60 -75
- package/cjs/plugins/editable/EditablePlugin.js.map +7 -0
- package/cjs/plugins/editable/decorateEditable.js +61 -98
- package/cjs/plugins/editable/decorateEditable.js.map +7 -0
- package/cjs/plugins/editable/getEditorComponent.js +70 -76
- package/cjs/plugins/editable/getEditorComponent.js.map +7 -0
- package/cjs/plugins/editable/index.js +38 -13
- package/cjs/plugins/editable/index.js.map +7 -0
- package/cjs/plugins/expandable-grid/ExpandableColumn.js +112 -144
- package/cjs/plugins/expandable-grid/ExpandableColumn.js.map +7 -0
- package/cjs/plugins/expandable-grid/ExpandablePlugin.js +118 -180
- package/cjs/plugins/expandable-grid/ExpandablePlugin.js.map +7 -0
- package/cjs/plugins/expandable-grid/ExpandedRow.js +117 -139
- package/cjs/plugins/expandable-grid/ExpandedRow.js.map +7 -0
- package/cjs/plugins/expandable-grid/ExpandedRowExtra.js +54 -52
- package/cjs/plugins/expandable-grid/ExpandedRowExtra.js.map +7 -0
- package/cjs/plugins/expandable-grid/index.js +37 -11
- package/cjs/plugins/expandable-grid/index.js.map +7 -0
- package/cjs/plugins/expandable-grid/useExpandGridState.js +45 -31
- package/cjs/plugins/expandable-grid/useExpandGridState.js.map +7 -0
- package/cjs/plugins/export-data/ExportDataPlugin.js +82 -116
- package/cjs/plugins/export-data/ExportDataPlugin.js.map +7 -0
- package/cjs/plugins/export-data/index.js +35 -12
- package/cjs/plugins/export-data/index.js.map +7 -0
- package/cjs/plugins/filterable/FilterablePlugin.js +54 -55
- package/cjs/plugins/filterable/FilterablePlugin.js.map +7 -0
- package/cjs/plugins/filterable/addFilterToColumn.js +40 -28
- package/cjs/plugins/filterable/addFilterToColumn.js.map +7 -0
- package/cjs/plugins/filterable/components/FilterableHeader.js +119 -107
- package/cjs/plugins/filterable/components/FilterableHeader.js.map +7 -0
- package/cjs/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.js +116 -116
- package/cjs/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.js.map +7 -0
- package/cjs/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.js +97 -73
- package/cjs/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.js.map +7 -0
- package/cjs/plugins/filterable/components/filterable-menus/SingleRangeSwitcherMenu.js +138 -132
- package/cjs/plugins/filterable/components/filterable-menus/SingleRangeSwitcherMenu.js.map +7 -0
- package/cjs/plugins/filterable/components/filterable-menus/TextFilterMenu.js +115 -119
- package/cjs/plugins/filterable/components/filterable-menus/TextFilterMenu.js.map +7 -0
- package/cjs/plugins/filterable/components/filterable-menus/defaultDateFormat.js +35 -7
- package/cjs/plugins/filterable/components/filterable-menus/defaultDateFormat.js.map +7 -0
- package/cjs/plugins/filterable/components/filterable-menus/getFilterMenuByType.js +46 -15
- package/cjs/plugins/filterable/components/filterable-menus/getFilterMenuByType.js.map +7 -0
- package/cjs/plugins/filterable/filterableFormatter.js +61 -51
- package/cjs/plugins/filterable/filterableFormatter.js.map +7 -0
- package/cjs/plugins/filterable/filtering-helper/filterRowsByQuery.js +60 -55
- package/cjs/plugins/filterable/filtering-helper/filterRowsByQuery.js.map +7 -0
- package/cjs/plugins/filterable/filtering-helper/strategiesOperators.js +43 -22
- package/cjs/plugins/filterable/filtering-helper/strategiesOperators.js.map +7 -0
- package/cjs/plugins/filterable/helper.js +68 -79
- package/cjs/plugins/filterable/helper.js.map +7 -0
- package/cjs/plugins/filterable/index.js +35 -9
- package/cjs/plugins/filterable/index.js.map +7 -0
- package/cjs/plugins/filterable/useFilterableState.js +62 -66
- package/cjs/plugins/filterable/useFilterableState.js.map +7 -0
- package/cjs/plugins/grouping-by/GroupingByPlugin.js +40 -23
- package/cjs/plugins/grouping-by/GroupingByPlugin.js.map +7 -0
- package/cjs/plugins/grouping-grid/GroupingPlugin.js +86 -109
- package/cjs/plugins/grouping-grid/GroupingPlugin.js.map +7 -0
- package/cjs/plugins/grouping-grid/walkStrategy.js +46 -26
- package/cjs/plugins/grouping-grid/walkStrategy.js.map +7 -0
- package/cjs/plugins/index.js +68 -48
- package/cjs/plugins/index.js.map +7 -0
- package/cjs/plugins/infinite-scrolling/InfiniteScrollPlugin.js +64 -88
- package/cjs/plugins/infinite-scrolling/InfiniteScrollPlugin.js.map +7 -0
- package/cjs/plugins/infinite-scrolling/index.js +35 -9
- package/cjs/plugins/infinite-scrolling/index.js.map +7 -0
- package/cjs/plugins/pagination/PaginationPlugin.js +73 -90
- package/cjs/plugins/pagination/PaginationPlugin.js.map +7 -0
- package/cjs/plugins/pagination/components/Pagination.js +54 -35
- package/cjs/plugins/pagination/components/Pagination.js.map +7 -0
- package/cjs/plugins/pagination/components/Paginator.js +59 -44
- package/cjs/plugins/pagination/components/Paginator.js.map +7 -0
- package/cjs/plugins/pagination/components/PerPageDropdown.js +51 -63
- package/cjs/plugins/pagination/components/PerPageDropdown.js.map +7 -0
- package/cjs/plugins/pagination/helper.js +45 -24
- package/cjs/plugins/pagination/helper.js.map +7 -0
- package/cjs/plugins/pagination/index.js +35 -9
- package/cjs/plugins/pagination/index.js.map +7 -0
- package/cjs/plugins/pagination/usePaginationState.js +46 -38
- package/cjs/plugins/pagination/usePaginationState.js.map +7 -0
- package/cjs/plugins/resizable/ResizablePlugin.js +51 -55
- package/cjs/plugins/resizable/ResizablePlugin.js.map +7 -0
- package/cjs/plugins/resizable/decorateResizable.js +49 -53
- package/cjs/plugins/resizable/decorateResizable.js.map +7 -0
- package/cjs/plugins/resizable/index.js +35 -9
- package/cjs/plugins/resizable/index.js.map +7 -0
- package/cjs/plugins/resizable/useResizeHandle.js +56 -50
- package/cjs/plugins/resizable/useResizeHandle.js.map +7 -0
- package/cjs/plugins/resizable/utils.js +49 -28
- package/cjs/plugins/resizable/utils.js.map +7 -0
- package/cjs/plugins/row-dnd/DndRowsPlugin.js +103 -82
- package/cjs/plugins/row-dnd/DndRowsPlugin.js.map +7 -0
- package/cjs/plugins/row-dnd/index.js +35 -9
- package/cjs/plugins/row-dnd/index.js.map +7 -0
- package/cjs/plugins/selectable/SelectablePlugin.js +101 -134
- package/cjs/plugins/selectable/SelectablePlugin.js.map +7 -0
- package/cjs/plugins/selectable/addSelectableColumn.js +67 -68
- package/cjs/plugins/selectable/addSelectableColumn.js.map +7 -0
- package/cjs/plugins/selectable/helper.js +50 -39
- package/cjs/plugins/selectable/helper.js.map +7 -0
- package/cjs/plugins/selectable/index.js +35 -9
- package/cjs/plugins/selectable/index.js.map +7 -0
- package/cjs/plugins/selectable/selectableFormatter.js +83 -105
- package/cjs/plugins/selectable/selectableFormatter.js.map +7 -0
- package/cjs/plugins/selectable/useSelectableState.js +67 -94
- package/cjs/plugins/selectable/useSelectableState.js.map +7 -0
- package/cjs/plugins/sortable/SortablePlugin.js +62 -76
- package/cjs/plugins/sortable/SortablePlugin.js.map +7 -0
- package/cjs/plugins/sortable/checkIfSortable.js +37 -14
- package/cjs/plugins/sortable/checkIfSortable.js.map +7 -0
- package/cjs/plugins/sortable/index.js +35 -9
- package/cjs/plugins/sortable/index.js.map +7 -0
- package/cjs/plugins/sortable/sortHeaderFormatter.js +56 -50
- package/cjs/plugins/sortable/sortHeaderFormatter.js.map +7 -0
- package/cjs/plugins/sortable/sortTree.js +40 -47
- package/cjs/plugins/sortable/sortTree.js.map +7 -0
- package/cjs/plugins/sortable/sorter.js +140 -172
- package/cjs/plugins/sortable/sorter.js.map +7 -0
- package/cjs/plugins/sortable/useSortableState.js +53 -79
- package/cjs/plugins/sortable/useSortableState.js.map +7 -0
- package/cjs/plugins/toolbar/RowRenderer.js +75 -76
- package/cjs/plugins/toolbar/RowRenderer.js.map +7 -0
- package/cjs/plugins/toolbar/ToolbarPlugin.js +49 -33
- package/cjs/plugins/toolbar/ToolbarPlugin.js.map +7 -0
- package/cjs/plugins/toolbar/ToolbarTrigger.js +89 -70
- package/cjs/plugins/toolbar/ToolbarTrigger.js.map +7 -0
- package/cjs/plugins/toolbar/index.js +35 -9
- package/cjs/plugins/toolbar/index.js.map +7 -0
- package/cjs/plugins/virtualization/AutoHeightList.js +64 -52
- package/cjs/plugins/virtualization/AutoHeightList.js.map +7 -0
- package/cjs/plugins/virtualization/VirtualizationPlugin.js +86 -97
- package/cjs/plugins/virtualization/VirtualizationPlugin.js.map +7 -0
- package/cjs/plugins/virtualization/VirtualizedBody.js +139 -155
- package/cjs/plugins/virtualization/VirtualizedBody.js.map +7 -0
- package/cjs/plugins/virtualization/VirtualizedBodyRow.js +39 -17
- package/cjs/plugins/virtualization/VirtualizedBodyRow.js.map +7 -0
- package/cjs/plugins/virtualization/helper.js +35 -7
- package/cjs/plugins/virtualization/helper.js.map +7 -0
- package/cjs/plugins/virtualization/index.js +35 -9
- package/cjs/plugins/virtualization/index.js.map +7 -0
- package/cjs/renders/CellWithAddons.js +98 -50
- package/cjs/renders/CellWithAddons.js.map +7 -0
- package/cjs/renders/index.js +37 -11
- package/cjs/renders/index.js.map +7 -0
- package/cjs/renders/styled.js +78 -27
- package/cjs/renders/styled.js.map +7 -0
- package/cjs/rowSizes.js +44 -12
- package/cjs/rowSizes.js.map +7 -0
- package/cjs/utilities/DataGridUtilities.json +1315 -0
- package/cjs/utilities/getPluginsFromProps.js +67 -39
- package/cjs/utilities/getPluginsFromProps.js.map +7 -0
- package/cjs/utilities/getScrollbarSize.js +44 -25
- package/cjs/utilities/getScrollbarSize.js.map +7 -0
- package/cjs/utilities/normalizeData.js +44 -34
- package/cjs/utilities/normalizeData.js.map +7 -0
- package/esm/DSDataGrid.js +337 -597
- package/esm/DSDataGrid.js.map +7 -0
- package/esm/DataGridImpl.js +68 -113
- package/esm/DataGridImpl.js.map +7 -0
- package/esm/PaginatedDataGrid.js +39 -59
- package/esm/PaginatedDataGrid.js.map +7 -0
- package/esm/blockNames.js +10 -5
- package/esm/blockNames.js.map +7 -0
- package/esm/columns/IconColumn.js +49 -54
- package/esm/columns/IconColumn.js.map +7 -0
- package/esm/columns/NumberColumn.js +6 -3
- package/esm/columns/NumberColumn.js.map +7 -0
- package/esm/components/BodyCell.js +51 -68
- package/esm/components/BodyCell.js.map +7 -0
- package/esm/components/BodyList.js +23 -43
- package/esm/components/BodyList.js.map +7 -0
- package/esm/components/ColumnVisibilityMenuOption.js +24 -27
- package/esm/components/ColumnVisibilityMenuOption.js.map +7 -0
- package/esm/components/ColumnsOptionsMenuSection.js +30 -38
- package/esm/components/ColumnsOptionsMenuSection.js.map +7 -0
- package/esm/components/EmptyState.js +52 -40
- package/esm/components/EmptyState.js.map +7 -0
- package/esm/components/HeaderCell.js +33 -48
- package/esm/components/HeaderCell.js.map +7 -0
- package/esm/components/List.js +12 -23
- package/esm/components/List.js.map +7 -0
- package/esm/components/ListItem.js +14 -30
- package/esm/components/ListItem.js.map +7 -0
- package/esm/components/NoResults.js +26 -43
- package/esm/components/NoResults.js.map +7 -0
- package/esm/components/RowsLoader.js +13 -15
- package/esm/components/RowsLoader.js.map +7 -0
- package/esm/components/Table.js +45 -76
- package/esm/components/Table.js.map +7 -0
- package/esm/components/TableBody.js +32 -52
- package/esm/components/TableBody.js.map +7 -0
- package/esm/components/TableHeader.js +17 -23
- package/esm/components/TableHeader.js.map +7 -0
- package/esm/components/footer/addOptionalFooterComponents.js +24 -37
- package/esm/components/footer/addOptionalFooterComponents.js.map +7 -0
- package/esm/components/header/PrimaryControls.js +20 -29
- package/esm/components/header/PrimaryControls.js.map +7 -0
- package/esm/components/header/addOptionalHeaderComponents.js +25 -36
- package/esm/components/header/addOptionalHeaderComponents.js.map +7 -0
- package/esm/components/index.js +14 -5
- package/esm/components/index.js.map +7 -0
- package/esm/components/renderers/defaultClassedRenderers.js +41 -46
- package/esm/components/renderers/defaultClassedRenderers.js.map +7 -0
- package/esm/components/renderers/index.js +16 -5
- package/esm/components/renderers/index.js.map +7 -0
- package/esm/components/renderers/renderRowsLoader.js +10 -10
- package/esm/components/renderers/renderRowsLoader.js.map +7 -0
- package/esm/components/tableContext.js +7 -5
- package/esm/components/tableContext.js.map +7 -0
- package/esm/defaultPlugins.js +15 -8
- package/esm/defaultPlugins.js.map +7 -0
- package/esm/index.js +63 -27
- package/esm/index.js.map +7 -0
- package/esm/plugins/body-header-scroll-sync/BodyHeaderScrollSyncPlugin.js +71 -101
- package/esm/plugins/body-header-scroll-sync/BodyHeaderScrollSyncPlugin.js.map +7 -0
- package/esm/plugins/body-header-scroll-sync/index.js +6 -1
- package/esm/plugins/body-header-scroll-sync/index.js.map +7 -0
- package/esm/plugins/column-dnd/DndColumnsPlugin.js +69 -68
- package/esm/plugins/column-dnd/DndColumnsPlugin.js.map +7 -0
- package/esm/plugins/column-dnd/decorateGridWithDndColumns.js +16 -18
- package/esm/plugins/column-dnd/decorateGridWithDndColumns.js.map +7 -0
- package/esm/plugins/column-dnd/index.js +6 -1
- package/esm/plugins/column-dnd/index.js.map +7 -0
- package/esm/plugins/column-sizing/ColumnSizingPlugin.js +20 -37
- package/esm/plugins/column-sizing/ColumnSizingPlugin.js.map +7 -0
- package/esm/plugins/column-sizing/columnMeasurerTransformer.js +16 -42
- package/esm/plugins/column-sizing/columnMeasurerTransformer.js.map +7 -0
- package/esm/plugins/column-sizing/ext-points/decorateColumn.js +9 -7
- package/esm/plugins/column-sizing/ext-points/decorateColumn.js.map +7 -0
- package/esm/plugins/column-sizing/ext-points/getTableProps.js +23 -43
- package/esm/plugins/column-sizing/ext-points/getTableProps.js.map +7 -0
- package/esm/plugins/column-sizing/getColumnNameFromProperty.js +8 -7
- package/esm/plugins/column-sizing/getColumnNameFromProperty.js.map +7 -0
- package/esm/plugins/column-sizing/index.js +6 -1
- package/esm/plugins/column-sizing/index.js.map +7 -0
- package/esm/plugins/column-sizing/useColumnSizeService.js +34 -71
- package/esm/plugins/column-sizing/useColumnSizeService.js.map +7 -0
- package/esm/plugins/column-sizing/useStylesheetHelpers.js +64 -171
- package/esm/plugins/column-sizing/useStylesheetHelpers.js.map +7 -0
- package/esm/plugins/column-sizing/utils.js +23 -21
- package/esm/plugins/column-sizing/utils.js.map +7 -0
- package/esm/plugins/custom-cell-renderer/CustomRendererPlugin.js +8 -7
- package/esm/plugins/custom-cell-renderer/CustomRendererPlugin.js.map +7 -0
- package/esm/plugins/custom-cell-renderer/addCustomRendererToCell.js +28 -43
- package/esm/plugins/custom-cell-renderer/addCustomRendererToCell.js.map +7 -0
- package/esm/plugins/custom-cell-renderer/getRendererComponent.js +22 -44
- package/esm/plugins/custom-cell-renderer/getRendererComponent.js.map +7 -0
- package/esm/plugins/custom-cell-renderer/index.js +6 -1
- package/esm/plugins/custom-cell-renderer/index.js.map +7 -0
- package/esm/plugins/editable/EditableComponents/ComboBox.js +20 -46
- package/esm/plugins/editable/EditableComponents/ComboBox.js.map +7 -0
- package/esm/plugins/editable/EditableComponents/TextBox.js +26 -68
- package/esm/plugins/editable/EditableComponents/TextBox.js.map +7 -0
- package/esm/plugins/editable/EditableComponents/index.js +8 -2
- package/esm/plugins/editable/EditableComponents/index.js.map +7 -0
- package/esm/plugins/editable/EditablePlugin.js +27 -63
- package/esm/plugins/editable/EditablePlugin.js.map +7 -0
- package/esm/plugins/editable/decorateEditable.js +32 -68
- package/esm/plugins/editable/decorateEditable.js.map +7 -0
- package/esm/plugins/editable/getEditorComponent.js +39 -66
- package/esm/plugins/editable/getEditorComponent.js.map +7 -0
- package/esm/plugins/editable/index.js +9 -3
- package/esm/plugins/editable/index.js.map +7 -0
- package/esm/plugins/expandable-grid/ExpandableColumn.js +82 -133
- package/esm/plugins/expandable-grid/ExpandableColumn.js.map +7 -0
- package/esm/plugins/expandable-grid/ExpandablePlugin.js +81 -160
- package/esm/plugins/expandable-grid/ExpandablePlugin.js.map +7 -0
- package/esm/plugins/expandable-grid/ExpandedRow.js +86 -124
- package/esm/plugins/expandable-grid/ExpandedRow.js.map +7 -0
- package/esm/plugins/expandable-grid/ExpandedRowExtra.js +25 -44
- package/esm/plugins/expandable-grid/ExpandedRowExtra.js.map +7 -0
- package/esm/plugins/expandable-grid/index.js +8 -2
- package/esm/plugins/expandable-grid/index.js.map +7 -0
- package/esm/plugins/expandable-grid/useExpandGridState.js +14 -25
- package/esm/plugins/expandable-grid/useExpandGridState.js.map +7 -0
- package/esm/plugins/export-data/ExportDataPlugin.js +52 -103
- package/esm/plugins/export-data/ExportDataPlugin.js.map +7 -0
- package/esm/plugins/export-data/index.js +6 -1
- package/esm/plugins/export-data/index.js.map +7 -0
- package/esm/plugins/filterable/FilterablePlugin.js +22 -44
- package/esm/plugins/filterable/FilterablePlugin.js.map +7 -0
- package/esm/plugins/filterable/addFilterToColumn.js +11 -20
- package/esm/plugins/filterable/addFilterToColumn.js.map +7 -0
- package/esm/plugins/filterable/components/FilterableHeader.js +85 -95
- package/esm/plugins/filterable/components/FilterableHeader.js.map +7 -0
- package/esm/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.js +83 -103
- package/esm/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.js.map +7 -0
- package/esm/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.js +68 -63
- package/esm/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.js.map +7 -0
- package/esm/plugins/filterable/components/filterable-menus/SingleRangeSwitcherMenu.js +108 -116
- package/esm/plugins/filterable/components/filterable-menus/SingleRangeSwitcherMenu.js.map +7 -0
- package/esm/plugins/filterable/components/filterable-menus/TextFilterMenu.js +84 -106
- package/esm/plugins/filterable/components/filterable-menus/TextFilterMenu.js.map +7 -0
- package/esm/plugins/filterable/components/filterable-menus/defaultDateFormat.js +6 -3
- package/esm/plugins/filterable/components/filterable-menus/defaultDateFormat.js.map +7 -0
- package/esm/plugins/filterable/components/filterable-menus/getFilterMenuByType.js +16 -12
- package/esm/plugins/filterable/components/filterable-menus/getFilterMenuByType.js.map +7 -0
- package/esm/plugins/filterable/filterableFormatter.js +32 -45
- package/esm/plugins/filterable/filterableFormatter.js.map +7 -0
- package/esm/plugins/filterable/filtering-helper/filterRowsByQuery.js +29 -44
- package/esm/plugins/filterable/filtering-helper/filterRowsByQuery.js.map +7 -0
- package/esm/plugins/filterable/filtering-helper/strategiesOperators.js +11 -13
- package/esm/plugins/filterable/filtering-helper/strategiesOperators.js.map +7 -0
- package/esm/plugins/filterable/helper.js +42 -62
- package/esm/plugins/filterable/helper.js.map +7 -0
- package/esm/plugins/filterable/index.js +6 -1
- package/esm/plugins/filterable/index.js.map +7 -0
- package/esm/plugins/filterable/useFilterableState.js +33 -54
- package/esm/plugins/filterable/useFilterableState.js.map +7 -0
- package/esm/plugins/grouping-by/GroupingByPlugin.js +10 -14
- package/esm/plugins/grouping-by/GroupingByPlugin.js.map +7 -0
- package/esm/plugins/grouping-grid/GroupingPlugin.js +53 -94
- package/esm/plugins/grouping-grid/GroupingPlugin.js.map +7 -0
- package/esm/plugins/grouping-grid/walkStrategy.js +17 -22
- package/esm/plugins/grouping-grid/walkStrategy.js.map +7 -0
- package/esm/plugins/index.js +39 -19
- package/esm/plugins/index.js.map +7 -0
- package/esm/plugins/infinite-scrolling/InfiniteScrollPlugin.js +31 -74
- package/esm/plugins/infinite-scrolling/InfiniteScrollPlugin.js.map +7 -0
- package/esm/plugins/infinite-scrolling/index.js +6 -1
- package/esm/plugins/infinite-scrolling/index.js.map +7 -0
- package/esm/plugins/pagination/PaginationPlugin.js +42 -75
- package/esm/plugins/pagination/PaginationPlugin.js.map +7 -0
- package/esm/plugins/pagination/components/Pagination.js +25 -27
- package/esm/plugins/pagination/components/Pagination.js.map +7 -0
- package/esm/plugins/pagination/components/Paginator.js +29 -35
- package/esm/plugins/pagination/components/Paginator.js.map +7 -0
- package/esm/plugins/pagination/components/PerPageDropdown.js +22 -54
- package/esm/plugins/pagination/components/PerPageDropdown.js.map +7 -0
- package/esm/plugins/pagination/helper.js +16 -19
- package/esm/plugins/pagination/helper.js.map +7 -0
- package/esm/plugins/pagination/index.js +6 -1
- package/esm/plugins/pagination/index.js.map +7 -0
- package/esm/plugins/pagination/usePaginationState.js +15 -28
- package/esm/plugins/pagination/usePaginationState.js.map +7 -0
- package/esm/plugins/resizable/ResizablePlugin.js +20 -45
- package/esm/plugins/resizable/ResizablePlugin.js.map +7 -0
- package/esm/plugins/resizable/decorateResizable.js +19 -41
- package/esm/plugins/resizable/decorateResizable.js.map +7 -0
- package/esm/plugins/resizable/index.js +6 -1
- package/esm/plugins/resizable/index.js.map +7 -0
- package/esm/plugins/resizable/useResizeHandle.js +24 -39
- package/esm/plugins/resizable/useResizeHandle.js.map +7 -0
- package/esm/plugins/resizable/utils.js +20 -18
- package/esm/plugins/resizable/utils.js.map +7 -0
- package/esm/plugins/row-dnd/DndRowsPlugin.js +73 -71
- package/esm/plugins/row-dnd/DndRowsPlugin.js.map +7 -0
- package/esm/plugins/row-dnd/index.js +6 -1
- package/esm/plugins/row-dnd/index.js.map +7 -0
- package/esm/plugins/selectable/SelectablePlugin.js +64 -117
- package/esm/plugins/selectable/SelectablePlugin.js.map +7 -0
- package/esm/plugins/selectable/addSelectableColumn.js +39 -57
- package/esm/plugins/selectable/addSelectableColumn.js.map +7 -0
- package/esm/plugins/selectable/helper.js +19 -25
- package/esm/plugins/selectable/helper.js.map +7 -0
- package/esm/plugins/selectable/index.js +6 -1
- package/esm/plugins/selectable/index.js.map +7 -0
- package/esm/plugins/selectable/selectableFormatter.js +54 -97
- package/esm/plugins/selectable/selectableFormatter.js.map +7 -0
- package/esm/plugins/selectable/useSelectableState.js +34 -78
- package/esm/plugins/selectable/useSelectableState.js.map +7 -0
- package/esm/plugins/sortable/SortablePlugin.js +30 -43
- package/esm/plugins/sortable/SortablePlugin.js.map +7 -0
- package/esm/plugins/sortable/checkIfSortable.js +8 -9
- package/esm/plugins/sortable/checkIfSortable.js.map +7 -0
- package/esm/plugins/sortable/index.js +6 -1
- package/esm/plugins/sortable/index.js.map +7 -0
- package/esm/plugins/sortable/sortHeaderFormatter.js +27 -43
- package/esm/plugins/sortable/sortHeaderFormatter.js.map +7 -0
- package/esm/plugins/sortable/sortTree.js +13 -24
- package/esm/plugins/sortable/sortTree.js.map +7 -0
- package/esm/plugins/sortable/sorter.js +112 -163
- package/esm/plugins/sortable/sorter.js.map +7 -0
- package/esm/plugins/sortable/useSortableState.js +22 -49
- package/esm/plugins/sortable/useSortableState.js.map +7 -0
- package/esm/plugins/toolbar/RowRenderer.js +40 -61
- package/esm/plugins/toolbar/RowRenderer.js.map +7 -0
- package/esm/plugins/toolbar/ToolbarPlugin.js +19 -23
- package/esm/plugins/toolbar/ToolbarPlugin.js.map +7 -0
- package/esm/plugins/toolbar/ToolbarTrigger.js +59 -57
- package/esm/plugins/toolbar/ToolbarTrigger.js.map +7 -0
- package/esm/plugins/toolbar/index.js +6 -1
- package/esm/plugins/toolbar/index.js.map +7 -0
- package/esm/plugins/virtualization/AutoHeightList.js +30 -40
- package/esm/plugins/virtualization/AutoHeightList.js.map +7 -0
- package/esm/plugins/virtualization/VirtualizationPlugin.js +55 -84
- package/esm/plugins/virtualization/VirtualizationPlugin.js.map +7 -0
- package/esm/plugins/virtualization/VirtualizedBody.js +94 -132
- package/esm/plugins/virtualization/VirtualizedBody.js.map +7 -0
- package/esm/plugins/virtualization/VirtualizedBodyRow.js +10 -15
- package/esm/plugins/virtualization/VirtualizedBodyRow.js.map +7 -0
- package/esm/plugins/virtualization/helper.js +6 -3
- package/esm/plugins/virtualization/helper.js.map +7 -0
- package/esm/plugins/virtualization/index.js +6 -1
- package/esm/plugins/virtualization/index.js.map +7 -0
- package/esm/renders/CellWithAddons.js +69 -40
- package/esm/renders/CellWithAddons.js.map +7 -0
- package/esm/renders/index.js +8 -2
- package/esm/renders/index.js.map +7 -0
- package/esm/renders/styled.js +49 -16
- package/esm/renders/styled.js.map +7 -0
- package/esm/rowSizes.js +15 -6
- package/esm/rowSizes.js.map +7 -0
- package/esm/utilities/DataGridUtilities.json +1315 -0
- package/esm/utilities/getPluginsFromProps.js +25 -24
- package/esm/utilities/getPluginsFromProps.js.map +7 -0
- package/esm/utilities/getScrollbarSize.js +15 -21
- package/esm/utilities/getScrollbarSize.js.map +7 -0
- package/esm/utilities/normalizeData.js +15 -24
- package/esm/utilities/normalizeData.js.map +7 -0
- package/package.json +20 -20
- package/types/DSDataGrid.d.ts +1 -1
- package/types/DataGridImpl.d.ts +3 -2
- package/types/PaginatedDataGrid.d.ts +1 -2
- package/types/columns/IconColumn.d.ts +3 -2
- package/types/components/BodyCell.d.ts +13 -12
- package/types/components/ColumnVisibilityMenuOption.d.ts +2 -2
- package/types/components/ColumnsOptionsMenuSection.d.ts +1 -0
- package/types/components/HeaderCell.d.ts +10 -10
- package/types/components/NoResults.d.ts +2 -2
- package/types/components/RowsLoader.d.ts +2 -2
- package/types/components/Table.d.ts +6 -11
- package/types/components/TableBody.d.ts +3 -8
- package/types/components/TableHeader.d.ts +2 -1
- package/types/components/footer/addOptionalFooterComponents.d.ts +1 -0
- package/types/components/header/PrimaryControls.d.ts +1 -0
- package/types/components/header/addOptionalHeaderComponents.d.ts +1 -1
- package/types/components/renderers/index.d.ts +1 -1
- package/types/components/renderers/renderRowsLoader.d.ts +1 -1
- package/types/index.d.ts +7 -8
- package/types/plugins/body-header-scroll-sync/index.d.ts +1 -1
- package/types/plugins/column-dnd/index.d.ts +1 -1
- package/types/plugins/column-sizing/getColumnNameFromProperty.d.ts +2 -1
- package/types/plugins/column-sizing/index.d.ts +1 -1
- package/types/plugins/column-sizing/useColumnSizeService.d.ts +2 -1
- package/types/plugins/custom-cell-renderer/addCustomRendererToCell.d.ts +1 -0
- package/types/plugins/custom-cell-renderer/getRendererComponent.d.ts +1 -0
- package/types/plugins/custom-cell-renderer/index.d.ts +1 -1
- package/types/plugins/editable/EditableComponents/ComboBox.d.ts +3 -1
- package/types/plugins/editable/EditableComponents/TextBox.d.ts +3 -1
- package/types/plugins/editable/getEditorComponent.d.ts +1 -0
- package/types/plugins/editable/index.d.ts +2 -2
- package/types/plugins/expandable-grid/ExpandableColumn.d.ts +3 -2
- package/types/plugins/expandable-grid/ExpandedRow.d.ts +1 -0
- package/types/plugins/expandable-grid/ExpandedRowExtra.d.ts +1 -0
- package/types/plugins/expandable-grid/index.d.ts +2 -2
- package/types/plugins/export-data/index.d.ts +1 -1
- package/types/plugins/filterable/components/FilterableHeader.d.ts +15 -15
- package/types/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.d.ts +1 -0
- package/types/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.d.ts +1 -0
- package/types/plugins/filterable/components/filterable-menus/SingleRangeSwitcherMenu.d.ts +2 -1
- package/types/plugins/filterable/components/filterable-menus/TextFilterMenu.d.ts +1 -0
- package/types/plugins/filterable/components/filterable-menus/getFilterMenuByType.d.ts +2 -1
- package/types/plugins/filterable/filterableFormatter.d.ts +3 -2
- package/types/plugins/filterable/filtering-helper/filterRowsByQuery.d.ts +2 -1
- package/types/plugins/filterable/filtering-helper/strategiesOperators.d.ts +2 -2
- package/types/plugins/filterable/index.d.ts +1 -1
- package/types/plugins/index.d.ts +16 -16
- package/types/plugins/infinite-scrolling/index.d.ts +1 -1
- package/types/plugins/pagination/components/Paginator.d.ts +1 -0
- package/types/plugins/pagination/components/PerPageDropdown.d.ts +1 -0
- package/types/plugins/pagination/helper.d.ts +3 -2
- package/types/plugins/pagination/index.d.ts +1 -1
- package/types/plugins/resizable/index.d.ts +1 -1
- package/types/plugins/row-dnd/index.d.ts +1 -1
- package/types/plugins/selectable/index.d.ts +1 -1
- package/types/plugins/selectable/selectableFormatter.d.ts +1 -0
- package/types/plugins/sortable/index.d.ts +1 -1
- package/types/plugins/sortable/sortHeaderFormatter.d.ts +1 -0
- package/types/plugins/sortable/sortTree.d.ts +1 -0
- package/types/plugins/toolbar/index.d.ts +1 -1
- package/types/plugins/virtualization/AutoHeightList.d.ts +1 -1
- package/types/plugins/virtualization/VirtualizedBody.d.ts +1 -0
- package/types/plugins/virtualization/VirtualizedBodyRow.d.ts +2 -2
- package/types/plugins/virtualization/index.d.ts +1 -1
- package/types/utilities/getPluginsFromProps.d.ts +2 -1
package/esm/index.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DSDataGrid } from './DSDataGrid';\n\nexport { DSDataGridsWithSchema } from './DSDataGrid';\nexport { ColumnsOptionsMenuSection } from './components/ColumnsOptionsMenuSection';\n\nexport { getColumnVisibilityMenuOption } from './components/ColumnVisibilityMenuOption';\n\nexport { EmptyState } from './components/EmptyState';\n\nexport { IconColumn } from './columns/IconColumn';\n\nexport {\n BodyHeaderScrollSyncPlugin,\n DndColumnsPlugin,\n ColumnSizingPlugin,\n CustomRendererPlugin,\n EditablePlugin,\n ComboBox,\n TextBox,\n ExpandablePlugin,\n ExpandableColumn,\n FilterablePlugin,\n InfiniteScrollPlugin,\n PaginationPlugin,\n ResizablePlugin,\n DndRowsPlugin,\n SelectablePlugin,\n SortablePlugin,\n ToolbarPlugin,\n ExportDataPlugin,\n VirtualizationPlugin,\n} from './plugins';\n\nexport { RowSizes, RowSizesOptions, RowSizesOptionsArr } from './rowSizes';\n\nexport { CellWithAddons, CellContainer } from './renders';\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AAEA;AACA;AAEA;AAEA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AAEA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,43 +1,63 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2, { useMemo, useRef, useEffect } from "react";
|
|
3
|
+
import { mergeRefs } from "@elliemae/ds-utilities";
|
|
4
|
+
import { ScrollSync, ScrollSyncPane } from "@elliemae/ds-shared/ScrollSync";
|
|
5
|
+
import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
|
|
6
|
+
import { getScrollbarWidth } from "../../utilities/getScrollbarSize";
|
|
7
|
+
const SCROLLBAR_WIDTH = getScrollbarWidth(2);
|
|
8
|
+
const HeaderSyncHoc = (Component) => (props) => /* @__PURE__ */ React2.createElement(ScrollSyncPane, null, ({ registerPane }) => /* @__PURE__ */ React2.createElement(Component, {
|
|
9
|
+
...props,
|
|
10
|
+
innerRef: mergeRefs(props.innerRef, registerPane)
|
|
11
|
+
}));
|
|
12
|
+
const BodySyncHoc = (Component, notPaginated, grid) => ({
|
|
13
|
+
children,
|
|
14
|
+
classProps,
|
|
15
|
+
columns,
|
|
16
|
+
getContainer,
|
|
17
|
+
helperClass,
|
|
18
|
+
innerBodyRef,
|
|
19
|
+
innerRef,
|
|
20
|
+
isPlaceholderActive,
|
|
21
|
+
listProps,
|
|
22
|
+
lockAxis,
|
|
23
|
+
noResultsPlaceholder,
|
|
24
|
+
numRowsVisible,
|
|
25
|
+
onSortEnd,
|
|
26
|
+
onSortOver,
|
|
27
|
+
onSortStart,
|
|
28
|
+
rowKey,
|
|
29
|
+
rowRenderer,
|
|
30
|
+
rows,
|
|
31
|
+
useDragHandle,
|
|
32
|
+
className,
|
|
33
|
+
listComponent,
|
|
34
|
+
...rest
|
|
35
|
+
}) => {
|
|
36
|
+
const t = useRef();
|
|
37
|
+
const repositionToolbarBasedOnBodyScrollPosition = (SCROLLBAR_WIDTH2) => () => {
|
|
38
|
+
grid.refs.body.current.style.setProperty("--toolbar-scroll", `${grid.refs.body.current.offsetWidth + grid.refs.body.current.scrollLeft - 15}px`);
|
|
39
|
+
grid.refs.body.current.style.setProperty("--toolbar-scroll-paginated", `${grid.refs.body.current.offsetWidth + grid.refs.body.current.scrollLeft - 19}px`);
|
|
40
|
+
};
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
setTimeout(repositionToolbarBasedOnBodyScrollPosition(-SCROLLBAR_WIDTH), 300);
|
|
43
|
+
}, []);
|
|
44
|
+
useEffect(() => {
|
|
45
|
+
window.addEventListener("resize", repositionToolbarBasedOnBodyScrollPosition(-SCROLLBAR_WIDTH));
|
|
46
|
+
return () => {
|
|
47
|
+
window.removeEventListener("resize", repositionToolbarBasedOnBodyScrollPosition(-SCROLLBAR_WIDTH));
|
|
48
|
+
};
|
|
49
|
+
});
|
|
50
|
+
return /* @__PURE__ */ React2.createElement(ScrollSyncPane, {
|
|
51
|
+
notPaginated
|
|
52
|
+
}, ({ registerPane }) => /* @__PURE__ */ React2.createElement(Component, {
|
|
53
|
+
ref: t,
|
|
35
54
|
classProps,
|
|
55
|
+
className,
|
|
56
|
+
listComponent,
|
|
36
57
|
columns,
|
|
37
58
|
getContainer,
|
|
38
59
|
helperClass,
|
|
39
60
|
innerBodyRef,
|
|
40
|
-
innerRef,
|
|
41
61
|
isPlaceholderActive,
|
|
42
62
|
listProps,
|
|
43
63
|
lockAxis,
|
|
@@ -50,83 +70,33 @@ const BodySyncHoc = (Component, notPaginated, grid) => _ref2 => {
|
|
|
50
70
|
rowRenderer,
|
|
51
71
|
rows,
|
|
52
72
|
useDragHandle,
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}
|
|
56
|
-
rest = _objectWithoutProperties(_ref2, _excluded);
|
|
57
|
-
|
|
58
|
-
const t = useRef();
|
|
59
|
-
|
|
60
|
-
const repositionToolbarBasedOnBodyScrollPosition = SCROLLBAR_WIDTH => () => {
|
|
61
|
-
grid.refs.body.current.style.setProperty('--toolbar-scroll', "".concat(grid.refs.body.current.offsetWidth + grid.refs.body.current.scrollLeft - 15, "px"));
|
|
62
|
-
grid.refs.body.current.style.setProperty('--toolbar-scroll-paginated', "".concat(grid.refs.body.current.offsetWidth + grid.refs.body.current.scrollLeft - 19, "px"));
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
useEffect(() => {
|
|
66
|
-
setTimeout(repositionToolbarBasedOnBodyScrollPosition(), 300);
|
|
67
|
-
}, []);
|
|
68
|
-
useEffect(() => {
|
|
69
|
-
window.addEventListener('resize', repositionToolbarBasedOnBodyScrollPosition());
|
|
70
|
-
return () => {
|
|
71
|
-
window.removeEventListener('resize', repositionToolbarBasedOnBodyScrollPosition());
|
|
72
|
-
};
|
|
73
|
-
});
|
|
74
|
-
return /*#__PURE__*/_jsx(ScrollSyncPane, {
|
|
75
|
-
notPaginated: notPaginated
|
|
76
|
-
}, void 0, _ref3 => {
|
|
77
|
-
let {
|
|
78
|
-
registerPane
|
|
79
|
-
} = _ref3;
|
|
80
|
-
return /*#__PURE__*/jsx(Component, _objectSpread({
|
|
81
|
-
ref: t,
|
|
82
|
-
classProps: classProps,
|
|
83
|
-
className: className,
|
|
84
|
-
listComponent: listComponent,
|
|
85
|
-
columns: columns,
|
|
86
|
-
getContainer: getContainer,
|
|
87
|
-
helperClass: helperClass,
|
|
88
|
-
innerBodyRef: innerBodyRef // innerRef={innerRef}
|
|
89
|
-
,
|
|
90
|
-
isPlaceholderActive: isPlaceholderActive,
|
|
91
|
-
listProps: listProps,
|
|
92
|
-
lockAxis: lockAxis,
|
|
93
|
-
noResultsPlaceholder: noResultsPlaceholder,
|
|
94
|
-
numRowsVisible: numRowsVisible,
|
|
95
|
-
onSortEnd: onSortEnd,
|
|
96
|
-
onSortOver: onSortOver,
|
|
97
|
-
onSortStart: onSortStart,
|
|
98
|
-
rowKey: rowKey,
|
|
99
|
-
rowRenderer: rowRenderer,
|
|
100
|
-
rows: rows,
|
|
101
|
-
useDragHandle: useDragHandle,
|
|
102
|
-
innerRef: mergeRefs(innerRef, registerPane, t)
|
|
103
|
-
}, rest));
|
|
104
|
-
});
|
|
73
|
+
innerRef: mergeRefs(innerRef, registerPane, t),
|
|
74
|
+
...rest
|
|
75
|
+
}));
|
|
105
76
|
};
|
|
106
|
-
|
|
107
|
-
const TableSyncHoc = Component => props => /*#__PURE__*/_jsx(ScrollSync, {
|
|
77
|
+
const TableSyncHoc = (Component) => (props) => /* @__PURE__ */ React2.createElement(ScrollSync, {
|
|
108
78
|
proportional: false,
|
|
109
|
-
onScroll: e => {
|
|
110
|
-
e.target.style.setProperty(
|
|
111
|
-
e.target.style.setProperty(
|
|
79
|
+
onScroll: (e) => {
|
|
80
|
+
e.target.style.setProperty("--toolbar-scroll", `${e.target.offsetWidth + e.target.scrollLeft - 15}px`);
|
|
81
|
+
e.target.style.setProperty("--toolbar-scroll-paginated", `${e.target.offsetWidth + e.target.scrollLeft - 19}px`);
|
|
112
82
|
}
|
|
113
|
-
},
|
|
114
|
-
|
|
83
|
+
}, /* @__PURE__ */ React2.createElement(Component, {
|
|
84
|
+
...props
|
|
85
|
+
}));
|
|
115
86
|
const decorateRenderers = (renderers, grid) => {
|
|
116
87
|
const HeaderWrapper = renderers.header.wrapper;
|
|
117
88
|
const BodyWrapper = renderers.body.wrapper;
|
|
118
89
|
const Table = renderers.table;
|
|
119
|
-
const {
|
|
120
|
-
paginated
|
|
121
|
-
} = grid.props;
|
|
90
|
+
const { paginated } = grid.props;
|
|
122
91
|
renderers.table = useMemo(() => TableSyncHoc(Table), []);
|
|
123
92
|
renderers.header.wrapper = useMemo(() => HeaderSyncHoc(HeaderWrapper), []);
|
|
124
93
|
renderers.body.wrapper = useMemo(() => BodySyncHoc(BodyWrapper, !paginated, grid), []);
|
|
125
94
|
return renderers;
|
|
126
95
|
};
|
|
127
|
-
|
|
128
|
-
const BodyHeaderScrollSyncPlugin = createInstancePlugin('body-header-scroll-sync', {
|
|
96
|
+
const BodyHeaderScrollSyncPlugin = createInstancePlugin("body-header-scroll-sync", {
|
|
129
97
|
decorateRenderers
|
|
130
98
|
});
|
|
131
|
-
|
|
132
|
-
|
|
99
|
+
export {
|
|
100
|
+
BodyHeaderScrollSyncPlugin
|
|
101
|
+
};
|
|
102
|
+
//# sourceMappingURL=BodyHeaderScrollSyncPlugin.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/body-header-scroll-sync/BodyHeaderScrollSyncPlugin.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-shadow */\n/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable no-unused-vars */\n/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\n/* eslint-disable react-hooks/rules-of-hooks */\n/* eslint-disable no-param-reassign */\n/* eslint-disable react/display-name */\nimport React, { useMemo, useRef, useEffect } from 'react';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport { ScrollSync, ScrollSyncPane } from '@elliemae/ds-shared/ScrollSync';\nimport { createInstancePlugin } from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';\nimport { getScrollbarWidth } from '../../utilities/getScrollbarSize';\n\nconst SCROLLBAR_WIDTH = getScrollbarWidth(2);\n\nconst HeaderSyncHoc = (Component) => (props) =>\n (\n <ScrollSyncPane>\n {({ registerPane }) => <Component {...props} innerRef={mergeRefs(props.innerRef, registerPane)} />}\n </ScrollSyncPane>\n );\nconst BodySyncHoc =\n (Component, notPaginated, grid) =>\n ({\n children,\n classProps,\n columns,\n getContainer,\n helperClass,\n innerBodyRef,\n innerRef,\n isPlaceholderActive,\n listProps,\n lockAxis,\n noResultsPlaceholder,\n numRowsVisible,\n onSortEnd,\n onSortOver,\n onSortStart,\n rowKey,\n rowRenderer,\n rows,\n useDragHandle,\n className,\n listComponent,\n ...rest\n }) => {\n const t = useRef();\n const repositionToolbarBasedOnBodyScrollPosition = (SCROLLBAR_WIDTH) => () => {\n grid.refs.body.current.style.setProperty(\n '--toolbar-scroll',\n `${grid.refs.body.current.offsetWidth + grid.refs.body.current.scrollLeft - 15}px`,\n );\n grid.refs.body.current.style.setProperty(\n '--toolbar-scroll-paginated',\n `${grid.refs.body.current.offsetWidth + grid.refs.body.current.scrollLeft - 19}px`,\n );\n };\n useEffect(() => {\n setTimeout(repositionToolbarBasedOnBodyScrollPosition(-SCROLLBAR_WIDTH), 300);\n }, []);\n useEffect(() => {\n window.addEventListener('resize', repositionToolbarBasedOnBodyScrollPosition(-SCROLLBAR_WIDTH));\n return () => {\n window.removeEventListener('resize', repositionToolbarBasedOnBodyScrollPosition(-SCROLLBAR_WIDTH));\n };\n });\n return (\n <ScrollSyncPane notPaginated={notPaginated}>\n {({ registerPane }) => (\n <Component\n ref={t}\n classProps={classProps}\n className={className}\n listComponent={listComponent}\n columns={columns}\n getContainer={getContainer}\n helperClass={helperClass}\n innerBodyRef={innerBodyRef}\n // innerRef={innerRef}\n isPlaceholderActive={isPlaceholderActive}\n listProps={listProps}\n lockAxis={lockAxis}\n noResultsPlaceholder={noResultsPlaceholder}\n numRowsVisible={numRowsVisible}\n onSortEnd={onSortEnd}\n onSortOver={onSortOver}\n onSortStart={onSortStart}\n rowKey={rowKey}\n rowRenderer={rowRenderer}\n rows={rows}\n useDragHandle={useDragHandle}\n innerRef={mergeRefs(innerRef, registerPane, t)}\n {...rest}\n />\n )}\n </ScrollSyncPane>\n );\n };\n\nconst TableSyncHoc = (Component) => (props) =>\n (\n <ScrollSync\n proportional={false}\n onScroll={(e) => {\n e.target.style.setProperty('--toolbar-scroll', `${e.target.offsetWidth + e.target.scrollLeft - 15}px`);\n e.target.style.setProperty(\n '--toolbar-scroll-paginated',\n `${e.target.offsetWidth + e.target.scrollLeft - 19}px`,\n );\n }}\n >\n <Component {...props} />\n </ScrollSync>\n );\n\nconst decorateRenderers = (renderers, grid) => {\n const HeaderWrapper = renderers.header.wrapper;\n const BodyWrapper = renderers.body.wrapper;\n const Table = renderers.table;\n const { paginated } = grid.props;\n\n renderers.table = useMemo(() => TableSyncHoc(Table), []);\n renderers.header.wrapper = useMemo(() => HeaderSyncHoc(HeaderWrapper), []);\n renderers.body.wrapper = useMemo(() => BodySyncHoc(BodyWrapper, !paginated, grid), []);\n\n return renderers;\n};\n\nexport const BodyHeaderScrollSyncPlugin = createInstancePlugin('body-header-scroll-sync', {\n decorateRenderers,\n});\n"],
|
|
5
|
+
"mappings": "AAAA;ACQA;AACA;AACA;AACA;AACA;AAEA,MAAM,kBAAkB,kBAAkB;AAE1C,MAAM,gBAAgB,CAAC,cAAc,CAAC,UAElC,qCAAC,gBAAD,MACG,CAAC,EAAE,mBAAmB,qCAAC,WAAD;AAAA,KAAe;AAAA,EAAO,UAAU,UAAU,MAAM,UAAU;AAAA;AAGvF,MAAM,cACJ,CAAC,WAAW,cAAc,SAC1B,CAAC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MACC;AACJ,QAAM,IAAI;AACV,QAAM,6CAA6C,CAAC,qBAAoB,MAAM;AAC5E,SAAK,KAAK,KAAK,QAAQ,MAAM,YAC3B,oBACA,GAAG,KAAK,KAAK,KAAK,QAAQ,cAAc,KAAK,KAAK,KAAK,QAAQ,aAAa;AAE9E,SAAK,KAAK,KAAK,QAAQ,MAAM,YAC3B,8BACA,GAAG,KAAK,KAAK,KAAK,QAAQ,cAAc,KAAK,KAAK,KAAK,QAAQ,aAAa;AAAA;AAGhF,YAAU,MAAM;AACd,eAAW,2CAA2C,CAAC,kBAAkB;AAAA,KACxE;AACH,YAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,2CAA2C,CAAC;AAC9E,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,2CAA2C,CAAC;AAAA;AAAA;AAGrF,SACE,qCAAC,gBAAD;AAAA,IAAgB;AAAA,KACb,CAAC,EAAE,mBACF,qCAAC,WAAD;AAAA,IACE,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,UAAU,UAAU,cAAc;AAAA,OACxC;AAAA;AAAA;AAOhB,MAAM,eAAe,CAAC,cAAc,CAAC,UAEjC,qCAAC,YAAD;AAAA,EACE,cAAc;AAAA,EACd,UAAU,CAAC,MAAM;AACf,MAAE,OAAO,MAAM,YAAY,oBAAoB,GAAG,EAAE,OAAO,cAAc,EAAE,OAAO,aAAa;AAC/F,MAAE,OAAO,MAAM,YACb,8BACA,GAAG,EAAE,OAAO,cAAc,EAAE,OAAO,aAAa;AAAA;AAAA,GAIpD,qCAAC,WAAD;AAAA,KAAe;AAAA;AAIrB,MAAM,oBAAoB,CAAC,WAAW,SAAS;AAC7C,QAAM,gBAAgB,UAAU,OAAO;AACvC,QAAM,cAAc,UAAU,KAAK;AACnC,QAAM,QAAQ,UAAU;AACxB,QAAM,EAAE,cAAc,KAAK;AAE3B,YAAU,QAAQ,QAAQ,MAAM,aAAa,QAAQ;AACrD,YAAU,OAAO,UAAU,QAAQ,MAAM,cAAc,gBAAgB;AACvE,YAAU,KAAK,UAAU,QAAQ,MAAM,YAAY,aAAa,CAAC,WAAW,OAAO;AAEnF,SAAO;AAAA;AAGF,MAAM,6BAA6B,qBAAqB,2BAA2B;AAAA,EACxF;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/body-header-scroll-sync/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { BodyHeaderScrollSyncPlugin } from './BodyHeaderScrollSyncPlugin';\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,29 +1,38 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2, { useEffect, useMemo, useRef } from "react";
|
|
3
|
+
import { SortableContainer, SortableElement } from "react-sortable-hoc";
|
|
4
|
+
import { arrayMove, omit, mergeRefs } from "@elliemae/ds-utilities";
|
|
5
|
+
import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
|
|
6
|
+
import { addDragAndDropToColumn } from "./decorateGridWithDndColumns";
|
|
7
|
+
const keysToOmit = [
|
|
8
|
+
"axis",
|
|
9
|
+
"contentWindow",
|
|
10
|
+
"disableAutoscroll",
|
|
11
|
+
"distance",
|
|
12
|
+
"getContainer",
|
|
13
|
+
"getHelperDimensions",
|
|
14
|
+
"helperClass",
|
|
15
|
+
"helperContainer",
|
|
16
|
+
"hideSortableGhost",
|
|
17
|
+
"keyboardSortingTransitionDuration",
|
|
18
|
+
"lockAxis",
|
|
19
|
+
"lockOffset",
|
|
20
|
+
"lockToContainerEdges",
|
|
21
|
+
"onSortEnd",
|
|
22
|
+
"onSortMove",
|
|
23
|
+
"onSortOver",
|
|
24
|
+
"onSortStart",
|
|
25
|
+
"pressDelay",
|
|
26
|
+
"pressThreshold",
|
|
27
|
+
"shouldCancelStart",
|
|
28
|
+
"transitionDuration",
|
|
29
|
+
"updateBeforeSortStart",
|
|
30
|
+
"useDragHandle",
|
|
31
|
+
"useWindowAsScrollContainer"
|
|
32
|
+
];
|
|
19
33
|
const decorateColumn = (column, grid) => column.isUserColumn ? addDragAndDropToColumn(grid, column) : column;
|
|
20
|
-
|
|
21
34
|
const getHeaderRowProps = (props, grid) => {
|
|
22
|
-
const {
|
|
23
|
-
onMoveColumnStart,
|
|
24
|
-
onMoveColumnEnd,
|
|
25
|
-
onMoveColumnOver
|
|
26
|
-
} = grid.props;
|
|
35
|
+
const { onMoveColumnStart, onMoveColumnEnd, onMoveColumnOver } = grid.props;
|
|
27
36
|
const headerRowRef = useRef();
|
|
28
37
|
const columnDraggingOffset = useRef(0);
|
|
29
38
|
const sortedColumns = useRef(grid.getInstance().decoratedColumns);
|
|
@@ -31,95 +40,87 @@ const getHeaderRowProps = (props, grid) => {
|
|
|
31
40
|
useEffect(() => {
|
|
32
41
|
sortedColumns.current = grid.getInstance().decoratedColumns;
|
|
33
42
|
});
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
const {
|
|
37
|
-
index,
|
|
38
|
-
newIndex,
|
|
39
|
-
oldIndex
|
|
40
|
-
} = params;
|
|
43
|
+
const onSortOver = (params) => {
|
|
44
|
+
const { index, newIndex, oldIndex } = params;
|
|
41
45
|
const oldColumn = sortedColumns.current[oldIndex];
|
|
42
46
|
const newColumn = sortedColumns.current[newIndex];
|
|
43
|
-
if (!newColumn.isUserColumn || !oldColumn.isUserColumn)
|
|
47
|
+
if (!newColumn.isUserColumn || !oldColumn.isUserColumn)
|
|
48
|
+
return;
|
|
44
49
|
const columnWidth = nodeRef.current.offsetWidth;
|
|
45
50
|
const newColumnWidth = headerRowRef.current.childNodes.item(newColumn.index).offsetWidth;
|
|
46
|
-
const forward = newIndex > oldIndex;
|
|
47
|
-
|
|
51
|
+
const forward = newIndex > oldIndex;
|
|
48
52
|
const columnTranslate = forward ? newIndex > index ? columnWidth * -1 : 0 : newIndex < index ? columnWidth : 0;
|
|
49
53
|
columnDraggingOffset.current += forward ? newColumnWidth : newColumnWidth * -1;
|
|
50
54
|
newColumn.updateStyle({
|
|
51
|
-
transitionDuration:
|
|
52
|
-
transform:
|
|
55
|
+
transitionDuration: "300ms",
|
|
56
|
+
transform: `translate3d(${columnTranslate}px, 0, 0)`
|
|
53
57
|
});
|
|
54
58
|
oldColumn.updateStyle({
|
|
55
|
-
transitionDuration:
|
|
56
|
-
transform:
|
|
59
|
+
transitionDuration: "300ms",
|
|
60
|
+
transform: `translate3d(${columnDraggingOffset.current}px, 0, 0)`
|
|
57
61
|
});
|
|
58
62
|
sortedColumns.current = arrayMove(sortedColumns.current, oldIndex, newIndex);
|
|
59
63
|
onMoveColumnOver(params);
|
|
60
64
|
};
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
const {
|
|
64
|
-
node
|
|
65
|
-
} = params;
|
|
65
|
+
const onSortStart = (params) => {
|
|
66
|
+
const { node } = params;
|
|
66
67
|
grid.disableEvents();
|
|
67
68
|
nodeRef.current = node;
|
|
68
69
|
onMoveColumnStart(params);
|
|
69
70
|
};
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
const {
|
|
73
|
-
oldIndex,
|
|
74
|
-
newIndex
|
|
75
|
-
} = params;
|
|
71
|
+
const onSortEnd = (params) => {
|
|
72
|
+
const { oldIndex, newIndex } = params;
|
|
76
73
|
grid.enableEvents();
|
|
77
74
|
columnDraggingOffset.current = 0;
|
|
78
75
|
sortedColumns.current = grid.decoratedColumns;
|
|
79
|
-
grid.decoratedColumns.forEach(column => {
|
|
80
|
-
if (!column.updateStyle)
|
|
76
|
+
grid.decoratedColumns.forEach((column) => {
|
|
77
|
+
if (!column.updateStyle)
|
|
78
|
+
return;
|
|
81
79
|
column.updateStyle({
|
|
82
80
|
transitionDuration: null,
|
|
83
81
|
transform: null
|
|
84
82
|
});
|
|
85
83
|
});
|
|
86
|
-
const originalOldColumnIndex = grid.columns.findIndex(column => column.property === grid.decoratedColumns[oldIndex].property);
|
|
87
|
-
const originalNewColumnIndex = grid.columns.findIndex(column => column.property === grid.decoratedColumns[newIndex].property);
|
|
84
|
+
const originalOldColumnIndex = grid.columns.findIndex((column) => column.property === grid.decoratedColumns[oldIndex].property);
|
|
85
|
+
const originalNewColumnIndex = grid.columns.findIndex((column) => column.property === grid.decoratedColumns[newIndex].property);
|
|
88
86
|
onMoveColumnEnd({
|
|
89
87
|
newIndex: originalNewColumnIndex,
|
|
90
88
|
oldIndex: originalOldColumnIndex
|
|
91
89
|
});
|
|
92
90
|
};
|
|
93
|
-
|
|
94
91
|
return {
|
|
95
|
-
axis:
|
|
96
|
-
helperClass:
|
|
92
|
+
axis: "x",
|
|
93
|
+
helperClass: "header-dnd-column",
|
|
97
94
|
innerRef: mergeRefs(props.innerRef, headerRowRef),
|
|
98
|
-
lockAxis:
|
|
95
|
+
lockAxis: "x",
|
|
99
96
|
onSortEnd,
|
|
100
97
|
onSortOver,
|
|
101
98
|
onSortStart,
|
|
102
99
|
useDragHandle: true
|
|
103
100
|
};
|
|
104
101
|
};
|
|
105
|
-
|
|
106
|
-
const decorateRenderers = renderers => {
|
|
102
|
+
const decorateRenderers = (renderers) => {
|
|
107
103
|
const RowComponent = renderers.header.row;
|
|
108
104
|
const CellComponent = renderers.header.cell;
|
|
109
|
-
const Row = useMemo(() => SortableContainer(props =>
|
|
105
|
+
const Row = useMemo(() => SortableContainer((props) => /* @__PURE__ */ React2.createElement(RowComponent, {
|
|
106
|
+
...omit(props, keysToOmit)
|
|
107
|
+
})), []);
|
|
110
108
|
const Cell = useMemo(() => SortableElement(CellComponent), []);
|
|
111
|
-
return
|
|
112
|
-
|
|
109
|
+
return {
|
|
110
|
+
...renderers,
|
|
111
|
+
header: {
|
|
112
|
+
...renderers.header,
|
|
113
113
|
row: Row,
|
|
114
114
|
cell: Cell
|
|
115
|
-
}
|
|
116
|
-
}
|
|
115
|
+
}
|
|
116
|
+
};
|
|
117
117
|
};
|
|
118
|
-
|
|
119
|
-
const DndColumnsPlugin = createInstancePlugin('dnd-columns', {
|
|
118
|
+
const DndColumnsPlugin = createInstancePlugin("dnd-columns", {
|
|
120
119
|
getHeaderRowProps,
|
|
121
120
|
decorateColumn,
|
|
122
121
|
decorateRenderers
|
|
123
122
|
});
|
|
124
|
-
|
|
125
|
-
|
|
123
|
+
export {
|
|
124
|
+
DndColumnsPlugin
|
|
125
|
+
};
|
|
126
|
+
//# sourceMappingURL=DndColumnsPlugin.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-dnd/DndColumnsPlugin.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/display-name */\nimport React, { useEffect, useMemo, useRef } from 'react';\nimport { SortableContainer, SortableElement } from 'react-sortable-hoc';\nimport { arrayMove, omit, mergeRefs } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';\nimport { addDragAndDropToColumn } from './decorateGridWithDndColumns';\n\n// todo: remove once it's fixed in react-sortable-hoc library\nconst keysToOmit = [\n 'axis',\n 'contentWindow',\n 'disableAutoscroll',\n 'distance',\n 'getContainer',\n 'getHelperDimensions',\n 'helperClass',\n 'helperContainer',\n 'hideSortableGhost',\n 'keyboardSortingTransitionDuration',\n 'lockAxis',\n 'lockOffset',\n 'lockToContainerEdges',\n 'onSortEnd',\n 'onSortMove',\n 'onSortOver',\n 'onSortStart',\n 'pressDelay',\n 'pressThreshold',\n 'shouldCancelStart',\n 'transitionDuration',\n 'updateBeforeSortStart',\n 'useDragHandle',\n 'useWindowAsScrollContainer',\n];\n\nconst decorateColumn = (column, grid) => (column.isUserColumn ? addDragAndDropToColumn(grid, column) : column);\n\nconst getHeaderRowProps = (props, grid) => {\n const { onMoveColumnStart, onMoveColumnEnd, onMoveColumnOver } = grid.props;\n\n const headerRowRef = useRef();\n const columnDraggingOffset = useRef(0);\n const sortedColumns = useRef(grid.getInstance().decoratedColumns);\n const nodeRef = useRef();\n\n useEffect(() => {\n sortedColumns.current = grid.getInstance().decoratedColumns;\n });\n\n const onSortOver = (params) => {\n const { index, newIndex, oldIndex } = params;\n const oldColumn = sortedColumns.current[oldIndex];\n const newColumn = sortedColumns.current[newIndex];\n\n if (!newColumn.isUserColumn || !oldColumn.isUserColumn) return;\n\n const columnWidth = nodeRef.current.offsetWidth;\n const newColumnWidth = headerRowRef.current.childNodes.item(newColumn.index).offsetWidth;\n\n const forward = newIndex > oldIndex;\n\n // eslint-disable-next-line no-nested-ternary\n const columnTranslate = forward ? (newIndex > index ? columnWidth * -1 : 0) : newIndex < index ? columnWidth : 0;\n\n columnDraggingOffset.current += forward ? newColumnWidth : newColumnWidth * -1;\n\n newColumn.updateStyle({\n transitionDuration: '300ms',\n transform: `translate3d(${columnTranslate}px, 0, 0)`,\n });\n oldColumn.updateStyle({\n transitionDuration: '300ms',\n transform: `translate3d(${columnDraggingOffset.current}px, 0, 0)`,\n });\n\n sortedColumns.current = arrayMove(sortedColumns.current, oldIndex, newIndex);\n onMoveColumnOver(params);\n };\n\n const onSortStart = (params) => {\n const { node } = params;\n grid.disableEvents();\n nodeRef.current = node;\n onMoveColumnStart(params);\n };\n\n const onSortEnd = (params) => {\n const { oldIndex, newIndex } = params;\n grid.enableEvents();\n columnDraggingOffset.current = 0;\n sortedColumns.current = grid.decoratedColumns;\n grid.decoratedColumns.forEach((column) => {\n if (!column.updateStyle) return;\n column.updateStyle({\n transitionDuration: null,\n transform: null,\n });\n });\n\n const originalOldColumnIndex = grid.columns.findIndex(\n (column) => column.property === grid.decoratedColumns[oldIndex].property,\n );\n const originalNewColumnIndex = grid.columns.findIndex(\n (column) => column.property === grid.decoratedColumns[newIndex].property,\n );\n\n onMoveColumnEnd({\n newIndex: originalNewColumnIndex,\n oldIndex: originalOldColumnIndex,\n });\n };\n\n return {\n axis: 'x',\n helperClass: 'header-dnd-column',\n innerRef: mergeRefs(props.innerRef, headerRowRef),\n lockAxis: 'x',\n onSortEnd,\n onSortOver,\n onSortStart,\n useDragHandle: true,\n };\n};\n\nconst decorateRenderers = (renderers) => {\n const RowComponent = renderers.header.row;\n const CellComponent = renderers.header.cell;\n\n const Row = useMemo(() => SortableContainer((props) => <RowComponent {...omit(props, keysToOmit)} />), []);\n\n const Cell = useMemo(() => SortableElement(CellComponent), []);\n\n return {\n ...renderers,\n header: {\n ...renderers.header,\n row: Row,\n cell: Cell,\n },\n };\n};\n\nexport const DndColumnsPlugin = createInstancePlugin('dnd-columns', {\n getHeaderRowProps,\n decorateColumn,\n decorateRenderers,\n});\n"],
|
|
5
|
+
"mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AAGA,MAAM,aAAa;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAGF,MAAM,iBAAiB,CAAC,QAAQ,SAAU,OAAO,eAAe,uBAAuB,MAAM,UAAU;AAEvG,MAAM,oBAAoB,CAAC,OAAO,SAAS;AACzC,QAAM,EAAE,mBAAmB,iBAAiB,qBAAqB,KAAK;AAEtE,QAAM,eAAe;AACrB,QAAM,uBAAuB,OAAO;AACpC,QAAM,gBAAgB,OAAO,KAAK,cAAc;AAChD,QAAM,UAAU;AAEhB,YAAU,MAAM;AACd,kBAAc,UAAU,KAAK,cAAc;AAAA;AAG7C,QAAM,aAAa,CAAC,WAAW;AAC7B,UAAM,EAAE,OAAO,UAAU,aAAa;AACtC,UAAM,YAAY,cAAc,QAAQ;AACxC,UAAM,YAAY,cAAc,QAAQ;AAExC,QAAI,CAAC,UAAU,gBAAgB,CAAC,UAAU;AAAc;AAExD,UAAM,cAAc,QAAQ,QAAQ;AACpC,UAAM,iBAAiB,aAAa,QAAQ,WAAW,KAAK,UAAU,OAAO;AAE7E,UAAM,UAAU,WAAW;AAG3B,UAAM,kBAAkB,UAAW,WAAW,QAAQ,cAAc,KAAK,IAAK,WAAW,QAAQ,cAAc;AAE/G,yBAAqB,WAAW,UAAU,iBAAiB,iBAAiB;AAE5E,cAAU,YAAY;AAAA,MACpB,oBAAoB;AAAA,MACpB,WAAW,eAAe;AAAA;AAE5B,cAAU,YAAY;AAAA,MACpB,oBAAoB;AAAA,MACpB,WAAW,eAAe,qBAAqB;AAAA;AAGjD,kBAAc,UAAU,UAAU,cAAc,SAAS,UAAU;AACnE,qBAAiB;AAAA;AAGnB,QAAM,cAAc,CAAC,WAAW;AAC9B,UAAM,EAAE,SAAS;AACjB,SAAK;AACL,YAAQ,UAAU;AAClB,sBAAkB;AAAA;AAGpB,QAAM,YAAY,CAAC,WAAW;AAC5B,UAAM,EAAE,UAAU,aAAa;AAC/B,SAAK;AACL,yBAAqB,UAAU;AAC/B,kBAAc,UAAU,KAAK;AAC7B,SAAK,iBAAiB,QAAQ,CAAC,WAAW;AACxC,UAAI,CAAC,OAAO;AAAa;AACzB,aAAO,YAAY;AAAA,QACjB,oBAAoB;AAAA,QACpB,WAAW;AAAA;AAAA;AAIf,UAAM,yBAAyB,KAAK,QAAQ,UAC1C,CAAC,WAAW,OAAO,aAAa,KAAK,iBAAiB,UAAU;AAElE,UAAM,yBAAyB,KAAK,QAAQ,UAC1C,CAAC,WAAW,OAAO,aAAa,KAAK,iBAAiB,UAAU;AAGlE,oBAAgB;AAAA,MACd,UAAU;AAAA,MACV,UAAU;AAAA;AAAA;AAId,SAAO;AAAA,IACL,MAAM;AAAA,IACN,aAAa;AAAA,IACb,UAAU,UAAU,MAAM,UAAU;AAAA,IACpC,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA;AAAA;AAInB,MAAM,oBAAoB,CAAC,cAAc;AACvC,QAAM,eAAe,UAAU,OAAO;AACtC,QAAM,gBAAgB,UAAU,OAAO;AAEvC,QAAM,MAAM,QAAQ,MAAM,kBAAkB,CAAC,UAAU,qCAAC,cAAD;AAAA,OAAkB,KAAK,OAAO;AAAA,OAAkB;AAEvG,QAAM,OAAO,QAAQ,MAAM,gBAAgB,gBAAgB;AAE3D,SAAO;AAAA,OACF;AAAA,IACH,QAAQ;AAAA,SACH,UAAU;AAAA,MACb,KAAK;AAAA,MACL,MAAM;AAAA;AAAA;AAAA;AAKL,MAAM,mBAAmB,qBAAqB,eAAe;AAAA,EAClE;AAAA,EACA;AAAA,EACA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,22 +1,20 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import { SortableHandle } from
|
|
4
|
-
import { GripperVertical } from
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const DragHandle = SortableHandle(() =>
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2 from "react";
|
|
3
|
+
import { SortableHandle } from "react-sortable-hoc";
|
|
4
|
+
import { GripperVertical } from "@elliemae/ds-icons";
|
|
5
|
+
import {
|
|
6
|
+
appendHeaderFormatter,
|
|
7
|
+
mergeClassNameToColumnHeader
|
|
8
|
+
} from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
|
|
9
|
+
const DragHandle = SortableHandle(() => /* @__PURE__ */ React2.createElement(GripperVertical, {
|
|
10
10
|
className: "drag-handle"
|
|
11
|
-
}))
|
|
12
|
-
|
|
13
|
-
const DndHeaderFormatter = value => /*#__PURE__*/jsxs(Fragment, {
|
|
14
|
-
children: [_DragHandle || (_DragHandle = /*#__PURE__*/_jsx(DragHandle, {})), value]
|
|
15
|
-
});
|
|
16
|
-
|
|
11
|
+
}));
|
|
12
|
+
const DndHeaderFormatter = (value) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(DragHandle, null), value);
|
|
17
13
|
const addDragAndDropToColumn = (grid, column) => {
|
|
18
14
|
column = appendHeaderFormatter(DndHeaderFormatter, column);
|
|
19
|
-
return mergeClassNameToColumnHeader(
|
|
15
|
+
return mergeClassNameToColumnHeader("with-dnd-column", column);
|
|
20
16
|
};
|
|
21
|
-
|
|
22
|
-
|
|
17
|
+
export {
|
|
18
|
+
addDragAndDropToColumn
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=decorateGridWithDndColumns.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-dnd/decorateGridWithDndColumns.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { SortableHandle } from 'react-sortable-hoc';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport {\n appendHeaderFormatter,\n mergeClassNameToColumnHeader,\n} from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';\n\nconst DragHandle = SortableHandle(() => <GripperVertical className=\"drag-handle\" />);\n\nconst DndHeaderFormatter = (value) => (\n <>\n <DragHandle />\n {value}\n </>\n);\n\nconst addDragAndDropToColumn = (grid, column) => {\n column = appendHeaderFormatter(DndHeaderFormatter, column);\n return mergeClassNameToColumnHeader('with-dnd-column', column);\n};\n\nexport { addDragAndDropToColumn };\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAKA,MAAM,aAAa,eAAe,MAAM,qCAAC,iBAAD;AAAA,EAAiB,WAAU;AAAA;AAEnE,MAAM,qBAAqB,CAAC,UAC1B,4DACE,qCAAC,YAAD,OACC;AAIL,MAAM,yBAAyB,CAAC,MAAM,WAAW;AAC/C,WAAS,sBAAsB,oBAAoB;AACnD,SAAO,6BAA6B,mBAAmB;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-dnd/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DndColumnsPlugin } from './DndColumnsPlugin';\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,32 +1,21 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
const getHeaderRowProps = (rowProps, _ref) => {
|
|
12
|
-
let {
|
|
13
|
-
rowsStylesheet
|
|
14
|
-
} = _ref;
|
|
15
|
-
rowProps.className = "".concat(rowsStylesheet.getRowClassName(), "-header");
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { useRef } from "react";
|
|
3
|
+
import { cx } from "@elliemae/ds-utilities";
|
|
4
|
+
import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
|
|
5
|
+
import { useStylesheetHelpers } from "./useStylesheetHelpers";
|
|
6
|
+
import { useColumnSizeService } from "./useColumnSizeService";
|
|
7
|
+
import { getTableProps } from "./ext-points/getTableProps";
|
|
8
|
+
import { decorateColumn } from "./ext-points/decorateColumn";
|
|
9
|
+
const getHeaderRowProps = (rowProps, { rowsStylesheet }) => {
|
|
10
|
+
rowProps.className = `${rowsStylesheet.getRowClassName()}-header`;
|
|
16
11
|
return rowProps;
|
|
17
12
|
};
|
|
18
|
-
|
|
19
|
-
const getRowProps = (rowProps, _ref2) => {
|
|
20
|
-
let {
|
|
21
|
-
rowsStylesheet
|
|
22
|
-
} = _ref2;
|
|
13
|
+
const getRowProps = (rowProps, { rowsStylesheet }) => {
|
|
23
14
|
rowProps.className = cx(rowProps.className, rowsStylesheet.getRowClassName());
|
|
24
15
|
return rowProps;
|
|
25
16
|
};
|
|
26
|
-
|
|
27
17
|
const decorateColumns = (columns, grid) => grid.columnsStylesheet.decorateColumns(columns, grid);
|
|
28
|
-
|
|
29
|
-
const decorateGrid = grid => {
|
|
18
|
+
const decorateGrid = (grid) => {
|
|
30
19
|
const isDragging = useRef(false);
|
|
31
20
|
const tableRef = useRef();
|
|
32
21
|
const resizedColumns = useRef({});
|
|
@@ -34,27 +23,20 @@ const decorateGrid = grid => {
|
|
|
34
23
|
const bodyWidth = useRef();
|
|
35
24
|
const allColumnsHaveBeenFixed = useRef(false);
|
|
36
25
|
const columnSizeService = useColumnSizeService(grid);
|
|
37
|
-
const {
|
|
38
|
-
|
|
39
|
-
rowsStylesheet
|
|
40
|
-
} = useStylesheetHelpers(grid); // row size side-effect
|
|
41
|
-
|
|
42
|
-
const updateRowWidth = width => {
|
|
26
|
+
const { columnsStylesheet, rowsStylesheet } = useStylesheetHelpers(grid);
|
|
27
|
+
const updateRowWidth = (width) => {
|
|
43
28
|
const gridWidth = width || tableRef.current.offsetWidth;
|
|
44
29
|
const columnsTotalSize = columnSizeService.computeColumnsTotalSize();
|
|
45
|
-
|
|
46
30
|
if (columnsTotalSize > gridWidth + 5) {
|
|
47
31
|
if (!allColumnsHaveBeenFixed.current && isDragging.current) {
|
|
48
32
|
columnSizeService.setActualColumnsSizesFixed();
|
|
49
33
|
allColumnsHaveBeenFixed.current = true;
|
|
50
34
|
}
|
|
51
|
-
|
|
52
35
|
rowsStylesheet.update(columnsTotalSize);
|
|
53
36
|
} else {
|
|
54
|
-
rowsStylesheet.update(
|
|
37
|
+
rowsStylesheet.update(void 0);
|
|
55
38
|
}
|
|
56
39
|
};
|
|
57
|
-
|
|
58
40
|
return {
|
|
59
41
|
isDragging,
|
|
60
42
|
tableRef,
|
|
@@ -67,8 +49,7 @@ const decorateGrid = grid => {
|
|
|
67
49
|
updateRowWidth
|
|
68
50
|
};
|
|
69
51
|
};
|
|
70
|
-
|
|
71
|
-
const ColumnSizingPlugin = createInstancePlugin('column-sizing', {
|
|
52
|
+
const ColumnSizingPlugin = createInstancePlugin("column-sizing", {
|
|
72
53
|
decorateGrid,
|
|
73
54
|
decorateColumn,
|
|
74
55
|
getRowProps,
|
|
@@ -76,5 +57,7 @@ const ColumnSizingPlugin = createInstancePlugin('column-sizing', {
|
|
|
76
57
|
getTableProps,
|
|
77
58
|
decorateColumns
|
|
78
59
|
});
|
|
79
|
-
|
|
80
|
-
|
|
60
|
+
export {
|
|
61
|
+
ColumnSizingPlugin
|
|
62
|
+
};
|
|
63
|
+
//# sourceMappingURL=ColumnSizingPlugin.js.map
|