@dxos/react-ui-table 0.4.10-main.4c7b3fa → 0.4.10-main.4d48ccf

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (22) hide show
  1. package/dist/lib/browser/index.mjs +119 -76
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/types/src/components/ColumnMenu/ColumnMenu.d.ts.map +1 -1
  5. package/dist/types/src/components/Table/Table.d.ts.map +1 -1
  6. package/dist/types/src/components/Table/Table.stories.d.ts +28 -0
  7. package/dist/types/src/components/Table/Table.stories.d.ts.map +1 -1
  8. package/dist/types/src/helpers.d.ts.map +1 -1
  9. package/dist/types/src/hooks/index.d.ts +2 -0
  10. package/dist/types/src/hooks/index.d.ts.map +1 -1
  11. package/dist/types/src/hooks/useColumnSizing.d.ts +12 -0
  12. package/dist/types/src/hooks/useColumnSizing.d.ts.map +1 -0
  13. package/dist/types/src/hooks/useRowSelection.d.ts +7 -0
  14. package/dist/types/src/hooks/useRowSelection.d.ts.map +1 -0
  15. package/package.json +15 -14
  16. package/src/components/ColumnMenu/ColumnMenu.tsx +34 -32
  17. package/src/components/Table/Table.stories.tsx +105 -1
  18. package/src/components/Table/Table.tsx +12 -52
  19. package/src/helpers.tsx +9 -7
  20. package/src/hooks/index.ts +2 -0
  21. package/src/hooks/useColumnSizing.ts +45 -0
  22. package/src/hooks/useRowSelection.ts +39 -0
package/dist/lib/browser/meta.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"packages/ui/react-ui-table/src/translations.ts":{"bytes":2343,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/components/Cell/CellCombobox.tsx":{"bytes":11696,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-searchlist","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Cell/index.ts":{"bytes":494,"imports":[{"path":"packages/ui/react-ui-table/src/components/Cell/CellCombobox.tsx","kind":"import-statement","original":"./CellCombobox"}],"format":"esm"},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx":{"bytes":24959,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/useColumnSorting.ts":{"bytes":5069,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/usePinLastRow.ts":{"bytes":5948,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/index.ts":{"bytes":597,"imports":[{"path":"packages/ui/react-ui-table/src/hooks/useColumnSorting.ts","kind":"import-statement","original":"./useColumnSorting"},{"path":"packages/ui/react-ui-table/src/hooks/usePinLastRow.ts","kind":"import-statement","original":"./usePinLastRow"}],"format":"esm"},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnMenu.tsx":{"bytes":18591,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx","kind":"import-statement","original":"./ColumnSettingsForm"},{"path":"packages/ui/react-ui-table/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"}],"format":"esm"},"packages/ui/react-ui-table/src/components/ColumnMenu/index.ts":{"bytes":608,"imports":[{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnMenu.tsx","kind":"import-statement","original":"./ColumnMenu"},{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx","kind":"import-statement","original":"./ColumnSettingsForm"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableContext.tsx":{"bytes":3140,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/theme.ts":{"bytes":10262,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/components/Cell/Cell.tsx":{"bytes":4842,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"../Table/TableContext"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableBody.tsx":{"bytes":8051,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"},{"path":"packages/ui/react-ui-table/src/components/Cell/Cell.tsx","kind":"import-statement","original":"../Cell/Cell"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableFooter.tsx":{"bytes":4638,"imports":[{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableHead.tsx":{"bytes":7863,"imports":[{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/Table.tsx":{"bytes":33669,"imports":[{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"@tanstack/react-virtual","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableBody.tsx","kind":"import-statement","original":"./TableBody"},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/components/Table/TableFooter.tsx","kind":"import-statement","original":"./TableFooter"},{"path":"packages/ui/react-ui-table/src/components/Table/TableHead.tsx","kind":"import-statement","original":"./TableHead"},{"path":"packages/ui/react-ui-table/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/props.ts":{"bytes":3075,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/index.ts":{"bytes":557,"imports":[{"path":"packages/ui/react-ui-table/src/components/Table/Table.tsx","kind":"import-statement","original":"./Table"},{"path":"packages/ui/react-ui-table/src/components/Table/props.ts","kind":"import-statement","original":"./props"}],"format":"esm"},"packages/ui/react-ui-table/src/components/index.ts":{"bytes":644,"imports":[{"path":"packages/ui/react-ui-table/src/components/Cell/index.ts","kind":"import-statement","original":"./Cell"},{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/index.ts","kind":"import-statement","original":"./ColumnMenu"},{"path":"packages/ui/react-ui-table/src/components/Table/index.ts","kind":"import-statement","original":"./Table"}],"format":"esm"},"packages/ui/react-ui-table/src/helpers.tsx":{"bytes":54314,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"date-fns/format","kind":"import-statement","external":true},{"path":"date-fns/formatDistanceToNow","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./components/Table/TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"},"packages/ui/react-ui-table/src/schema/schema.ts":{"bytes":9419,"imports":[{"path":"@effect/schema/AST","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/schema/schemaToColumns.ts":{"bytes":5160,"imports":[{"path":"packages/ui/react-ui-table/src/schema/schema.ts","kind":"import-statement","original":"./schema"},{"path":"packages/ui/react-ui-table/src/helpers.tsx","kind":"import-statement","original":"../helpers"}],"format":"esm"},"packages/ui/react-ui-table/src/schema/types.ts":{"bytes":1117,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/schema/index.ts":{"bytes":573,"imports":[{"path":"packages/ui/react-ui-table/src/schema/schemaToColumns.ts","kind":"import-statement","original":"./schemaToColumns"},{"path":"packages/ui/react-ui-table/src/schema/types.ts","kind":"import-statement","original":"./types"}],"format":"esm"},"packages/ui/react-ui-table/src/types.ts":{"bytes":1830,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/index.ts":{"bytes":1102,"imports":[{"path":"packages/ui/react-ui-table/src/translations.ts","kind":"import-statement","original":"./translations"},{"path":"packages/ui/react-ui-table/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-table/src/helpers.tsx","kind":"import-statement","original":"./helpers"},{"path":"packages/ui/react-ui-table/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-table/src/schema/index.ts","kind":"import-statement","original":"./schema"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"./theme"},{"path":"packages/ui/react-ui-table/src/types.ts","kind":"import-statement","original":"./types"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-table/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":109927},"packages/ui/react-ui-table/dist/lib/browser/index.mjs":{"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-searchlist","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"@tanstack/react-virtual","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"date-fns/format","kind":"import-statement","external":true},{"path":"date-fns/formatDistanceToNow","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@effect/schema/AST","kind":"import-statement","external":true}],"exports":["CellCombobox","ColumnBuilder","ColumnMenu","ColumnSettingsForm","ColumnSettingsPanel","MemoizedVirtualisedTableContent","SortIndicator","Table","createColumnBuilder","currentRow","flushPadding","gridCellFocusRing","groupTh","headPadding","schemaToColumnDefs","selectedRow","tableRoot","tbodyRoot","tbodyTr","tdContent","tdRoot","textPadding","tfootRoot","tfootTh","tfootTr","theadResizeRoot","theadRoot","theadTh","theadTr","translations","useColumnSorting","usePinLastRow"],"entryPoint":"packages/ui/react-ui-table/src/index.ts","inputs":{"packages/ui/react-ui-table/src/translations.ts":{"bytesInOutput":611},"packages/ui/react-ui-table/src/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/Cell/CellCombobox.tsx":{"bytesInOutput":2989},"packages/ui/react-ui-table/src/components/Cell/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnMenu.tsx":{"bytesInOutput":5354},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx":{"bytesInOutput":6917},"packages/ui/react-ui-table/src/hooks/useColumnSorting.ts":{"bytesInOutput":1082},"packages/ui/react-ui-table/src/hooks/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/hooks/usePinLastRow.ts":{"bytesInOutput":1318},"packages/ui/react-ui-table/src/components/ColumnMenu/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/Table/Table.tsx":{"bytesInOutput":8534},"packages/ui/react-ui-table/src/components/Table/TableBody.tsx":{"bytesInOutput":1825},"packages/ui/react-ui-table/src/components/Table/TableContext.tsx":{"bytesInOutput":358},"packages/ui/react-ui-table/src/theme.ts":{"bytesInOutput":2205},"packages/ui/react-ui-table/src/components/Cell/Cell.tsx":{"bytesInOutput":973},"packages/ui/react-ui-table/src/components/Table/TableFooter.tsx":{"bytesInOutput":1015},"packages/ui/react-ui-table/src/components/Table/TableHead.tsx":{"bytesInOutput":1739},"packages/ui/react-ui-table/src/components/Table/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/helpers.tsx":{"bytesInOutput":13425},"packages/ui/react-ui-table/src/schema/schema.ts":{"bytesInOutput":1957},"packages/ui/react-ui-table/src/schema/schemaToColumns.ts":{"bytesInOutput":1047},"packages/ui/react-ui-table/src/schema/index.ts":{"bytesInOutput":0}},"bytes":53110}}}
1
+ {"inputs":{"packages/ui/react-ui-table/src/translations.ts":{"bytes":2343,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/components/Cell/CellCombobox.tsx":{"bytes":11696,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-searchlist","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Cell/index.ts":{"bytes":494,"imports":[{"path":"packages/ui/react-ui-table/src/components/Cell/CellCombobox.tsx","kind":"import-statement","original":"./CellCombobox"}],"format":"esm"},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx":{"bytes":24959,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/useColumnSizing.ts":{"bytes":5013,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/useColumnSorting.ts":{"bytes":5069,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/usePinLastRow.ts":{"bytes":5948,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/useRowSelection.ts":{"bytes":5030,"imports":[{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/hooks/index.ts":{"bytes":811,"imports":[{"path":"packages/ui/react-ui-table/src/hooks/useColumnSizing.ts","kind":"import-statement","original":"./useColumnSizing"},{"path":"packages/ui/react-ui-table/src/hooks/useColumnSorting.ts","kind":"import-statement","original":"./useColumnSorting"},{"path":"packages/ui/react-ui-table/src/hooks/usePinLastRow.ts","kind":"import-statement","original":"./usePinLastRow"},{"path":"packages/ui/react-ui-table/src/hooks/useRowSelection.ts","kind":"import-statement","original":"./useRowSelection"}],"format":"esm"},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnMenu.tsx":{"bytes":18877,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx","kind":"import-statement","original":"./ColumnSettingsForm"},{"path":"packages/ui/react-ui-table/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"}],"format":"esm"},"packages/ui/react-ui-table/src/components/ColumnMenu/index.ts":{"bytes":608,"imports":[{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnMenu.tsx","kind":"import-statement","original":"./ColumnMenu"},{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx","kind":"import-statement","original":"./ColumnSettingsForm"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableContext.tsx":{"bytes":3140,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/theme.ts":{"bytes":10262,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/components/Cell/Cell.tsx":{"bytes":4842,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"../Table/TableContext"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableBody.tsx":{"bytes":8051,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"},{"path":"packages/ui/react-ui-table/src/components/Cell/Cell.tsx","kind":"import-statement","original":"../Cell/Cell"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableFooter.tsx":{"bytes":4638,"imports":[{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/TableHead.tsx":{"bytes":7863,"imports":[{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/Table.tsx":{"bytes":28891,"imports":[{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"@tanstack/react-virtual","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/Table/TableBody.tsx","kind":"import-statement","original":"./TableBody"},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./TableContext"},{"path":"packages/ui/react-ui-table/src/components/Table/TableFooter.tsx","kind":"import-statement","original":"./TableFooter"},{"path":"packages/ui/react-ui-table/src/components/Table/TableHead.tsx","kind":"import-statement","original":"./TableHead"},{"path":"packages/ui/react-ui-table/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"../../theme"}],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/props.ts":{"bytes":3075,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/components/Table/index.ts":{"bytes":557,"imports":[{"path":"packages/ui/react-ui-table/src/components/Table/Table.tsx","kind":"import-statement","original":"./Table"},{"path":"packages/ui/react-ui-table/src/components/Table/props.ts","kind":"import-statement","original":"./props"}],"format":"esm"},"packages/ui/react-ui-table/src/components/index.ts":{"bytes":644,"imports":[{"path":"packages/ui/react-ui-table/src/components/Cell/index.ts","kind":"import-statement","original":"./Cell"},{"path":"packages/ui/react-ui-table/src/components/ColumnMenu/index.ts","kind":"import-statement","original":"./ColumnMenu"},{"path":"packages/ui/react-ui-table/src/components/Table/index.ts","kind":"import-statement","original":"./Table"}],"format":"esm"},"packages/ui/react-ui-table/src/helpers.tsx":{"bytes":54890,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"date-fns/format","kind":"import-statement","external":true},{"path":"date-fns/formatDistanceToNow","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-table/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-table/src/components/Table/TableContext.tsx","kind":"import-statement","original":"./components/Table/TableContext"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"},"packages/ui/react-ui-table/src/schema/schema.ts":{"bytes":9419,"imports":[{"path":"@effect/schema/AST","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-table/src/schema/schemaToColumns.ts":{"bytes":5160,"imports":[{"path":"packages/ui/react-ui-table/src/schema/schema.ts","kind":"import-statement","original":"./schema"},{"path":"packages/ui/react-ui-table/src/helpers.tsx","kind":"import-statement","original":"../helpers"}],"format":"esm"},"packages/ui/react-ui-table/src/schema/types.ts":{"bytes":1117,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/schema/index.ts":{"bytes":573,"imports":[{"path":"packages/ui/react-ui-table/src/schema/schemaToColumns.ts","kind":"import-statement","original":"./schemaToColumns"},{"path":"packages/ui/react-ui-table/src/schema/types.ts","kind":"import-statement","original":"./types"}],"format":"esm"},"packages/ui/react-ui-table/src/types.ts":{"bytes":1830,"imports":[],"format":"esm"},"packages/ui/react-ui-table/src/index.ts":{"bytes":1102,"imports":[{"path":"packages/ui/react-ui-table/src/translations.ts","kind":"import-statement","original":"./translations"},{"path":"packages/ui/react-ui-table/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-table/src/helpers.tsx","kind":"import-statement","original":"./helpers"},{"path":"packages/ui/react-ui-table/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-table/src/schema/index.ts","kind":"import-statement","original":"./schema"},{"path":"packages/ui/react-ui-table/src/theme.ts","kind":"import-statement","original":"./theme"},{"path":"packages/ui/react-ui-table/src/types.ts","kind":"import-statement","original":"./types"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-table/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":113101},"packages/ui/react-ui-table/dist/lib/browser/index.mjs":{"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-searchlist","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"@tanstack/react-virtual","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"@tanstack/react-table","kind":"import-statement","external":true},{"path":"date-fns/format","kind":"import-statement","external":true},{"path":"date-fns/formatDistanceToNow","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@effect/schema/AST","kind":"import-statement","external":true}],"exports":["CellCombobox","ColumnBuilder","ColumnMenu","ColumnSettingsForm","ColumnSettingsPanel","MemoizedVirtualisedTableContent","SortIndicator","Table","createColumnBuilder","currentRow","flushPadding","gridCellFocusRing","groupTh","headPadding","schemaToColumnDefs","selectedRow","tableRoot","tbodyRoot","tbodyTr","tdContent","tdRoot","textPadding","tfootRoot","tfootTh","tfootTr","theadResizeRoot","theadRoot","theadTh","theadTr","translations","useColumnResizing","useColumnSorting","usePinLastRow","useRowSelection"],"entryPoint":"packages/ui/react-ui-table/src/index.ts","inputs":{"packages/ui/react-ui-table/src/translations.ts":{"bytesInOutput":611},"packages/ui/react-ui-table/src/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/Cell/CellCombobox.tsx":{"bytesInOutput":2989},"packages/ui/react-ui-table/src/components/Cell/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnMenu.tsx":{"bytesInOutput":5419},"packages/ui/react-ui-table/src/components/ColumnMenu/ColumnSettingsForm.tsx":{"bytesInOutput":6917},"packages/ui/react-ui-table/src/hooks/useColumnSizing.ts":{"bytesInOutput":1068},"packages/ui/react-ui-table/src/hooks/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/hooks/useColumnSorting.ts":{"bytesInOutput":1082},"packages/ui/react-ui-table/src/hooks/usePinLastRow.ts":{"bytesInOutput":1333},"packages/ui/react-ui-table/src/hooks/useRowSelection.ts":{"bytesInOutput":1055},"packages/ui/react-ui-table/src/components/ColumnMenu/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/components/Table/Table.tsx":{"bytesInOutput":7349},"packages/ui/react-ui-table/src/components/Table/TableBody.tsx":{"bytesInOutput":1825},"packages/ui/react-ui-table/src/components/Table/TableContext.tsx":{"bytesInOutput":358},"packages/ui/react-ui-table/src/theme.ts":{"bytesInOutput":2205},"packages/ui/react-ui-table/src/components/Cell/Cell.tsx":{"bytesInOutput":973},"packages/ui/react-ui-table/src/components/Table/TableFooter.tsx":{"bytesInOutput":1015},"packages/ui/react-ui-table/src/components/Table/TableHead.tsx":{"bytesInOutput":1739},"packages/ui/react-ui-table/src/components/Table/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-table/src/helpers.tsx":{"bytesInOutput":13561},"packages/ui/react-ui-table/src/schema/schema.ts":{"bytesInOutput":1957},"packages/ui/react-ui-table/src/schema/schemaToColumns.ts":{"bytesInOutput":1047},"packages/ui/react-ui-table/src/schema/index.ts":{"bytesInOutput":0}},"bytes":54424}}}
package/dist/types/src/components/ColumnMenu/ColumnMenu.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ColumnMenu.d.ts","sourceRoot":"","sources":["../../../../../src/components/ColumnMenu/ColumnMenu.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,aAAa,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAQ7F,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAE/D,MAAM,MAAM,eAAe,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM,IAAI;IAC3D,OAAO,EAAE,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IACtC,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACrD,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,UAAU,sGAqFtB,CAAC;AAEF,eAAO,MAAM,mBAAmB;aAOe,MAAM,IAAI;iBAkBxD,CAAC;AAEF,eAAO,MAAM,aAAa;eAIb,aAAa,GAAG,KAAK;iBACnB,GAAG,KAAK,IAAI;wBAsB1B,CAAC"}
1
+ {"version":3,"file":"ColumnMenu.d.ts","sourceRoot":"","sources":["../../../../../src/components/ColumnMenu/ColumnMenu.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,aAAa,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAQ7F,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAE/D,MAAM,MAAM,eAAe,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM,IAAI;IAC3D,OAAO,EAAE,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IACtC,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACrD,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,UAAU,sGAuFtB,CAAC;AAEF,eAAO,MAAM,mBAAmB;aAOe,MAAM,IAAI;iBAkBxD,CAAC;AAEF,eAAO,MAAM,aAAa;eAIb,aAAa,GAAG,KAAK;iBACnB,GAAG,KAAK,IAAI;wBAsB1B,CAAC"}
package/dist/types/src/components/Table/Table.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAClF,OAAO,KAAqD,MAAM,OAAO,CAAC;AAS1E,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAI1C,eAAO,MAAM,KAAK,kEA6IjB,CAAC;AA8GF,eAAO,MAAM,+BAA+B,oDAlDzC,KAAK,mBAAmB,OAAO,EAAE,OAAO,CAAC,EAAE,kBAAkB,CAAC,iBAkDiB,CAAC"}
1
+ {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAClF,OAAO,KAAqD,MAAM,OAAO,CAAC;AAS1E,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAI1C,eAAO,MAAM,KAAK,kEA0GjB,CAAC;AA8GF,eAAO,MAAM,+BAA+B,oDAlDzC,KAAK,mBAAmB,OAAO,EAAE,OAAO,CAAC,EAAE,kBAAkB,CAAC,iBAkDiB,CAAC"}
package/dist/types/src/components/Table/Table.stories.d.ts CHANGED
@@ -102,4 +102,32 @@ export declare const Resizable: {
102
102
  export declare const TenThousandRows: {
103
103
  render: () => JSX.Element;
104
104
  };
105
+ export declare const RealTimeUpdates: {
106
+ args: {
107
+ periodicMutations: boolean;
108
+ mutationInterval: number;
109
+ periodicDeletions: boolean;
110
+ deletionInterval: number;
111
+ periodicInsertions: boolean;
112
+ insertionInterval: number;
113
+ };
114
+ argTypes: {
115
+ mutationInterval: {
116
+ control: string;
117
+ };
118
+ periodicDeletions: {
119
+ control: string;
120
+ };
121
+ deletionInterval: {
122
+ control: string;
123
+ };
124
+ periodicInsertions: {
125
+ control: string;
126
+ };
127
+ insertionInterval: {
128
+ control: string;
129
+ };
130
+ };
131
+ render: ({ periodicMutations, mutationInterval, periodicDeletions, deletionInterval, periodicInsertions, insertionInterval, }: any) => JSX.Element;
132
+ };
105
133
  //# sourceMappingURL=Table.stories.d.ts.map
package/dist/types/src/components/Table/Table.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Table.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/Table.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAMpB,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAQvC,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAKlD,KAAK,IAAI,GAAG;IACV,SAAS,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;;;4BA4FsB,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAL5B,wBAuCE;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;CAKrB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;CAMtB,CAAC;AAEF,eAAO,MAAM,KAAK;;;;CAIjB,CAAC;AAEF,eAAO,MAAM,OAAO;;CAmCnB,CAAC;AAEF,eAAO,MAAM,QAAQ;;CA4BpB,CAAC;AAEF,eAAO,MAAM,aAAa;;CA6BzB,CAAC;AAEF,eAAO,MAAM,YAAY;;CAqDxB,CAAC;AAEF,eAAO,MAAM,SAAS;;CAyBrB,CAAC;AAEF,eAAO,MAAM,eAAe;;CA4B3B,CAAC"}
1
+ {"version":3,"file":"Table.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/Table.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAOpB,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAQvC,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAKlD,KAAK,IAAI,GAAG;IACV,SAAS,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;;;4BA4FsB,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAL5B,wBAuCE;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;CAKrB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;CAMtB,CAAC;AAEF,eAAO,MAAM,KAAK;;;;CAIjB,CAAC;AAEF,eAAO,MAAM,OAAO;;CAmCnB,CAAC;AAEF,eAAO,MAAM,QAAQ;;CA4BpB,CAAC;AAEF,eAAO,MAAM,aAAa;;CA6BzB,CAAC;AAEF,eAAO,MAAM,YAAY;;CAqDxB,CAAC;AAEF,eAAO,MAAM,SAAS;;CAyBrB,CAAC;AAEF,eAAO,MAAM,eAAe;;CA4B3B,CAAC;AAKF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;mIAuBvB,GAAG;CA2EP,CAAC"}
package/dist/types/src/helpers.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/helpers.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAwB,KAAK,IAAI,EAAK,MAAM,uBAAuB,CAAC;AAC3E,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,UAAU,EACf,KAAK,OAAO,EACZ,KAAK,YAAY,EAElB,MAAM,uBAAuB,CAAC;AAK/B,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,OAAO,EAAE,KAAK,cAAc,EAAkB,MAAM,gBAAgB,CAAC;AAOrE,MAAM,MAAM,YAAY,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;AAE1G,eAAO,MAAM,mBAAmB;;;CAG9B,CAAC;AAGH;;GAEG;AACH,MAAM,MAAM,iBAAiB,CAAC,KAAK,EAAE,MAAM,IAAI,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,GAAG;IACjF,IAAI,CAAC,EAAE,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,QAAQ,CAAC,EAAE,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;CACpD,CAAC;AAGF,MAAM,MAAM,oBAAoB,CAAC,KAAK,SAAS,OAAO,IAAI;IACxD,KAAK,CAAC,MAAM,EAAE,KAAK,GAAG,MAAM,CAAC;IAC7B,OAAO,CAAC,MAAM,EAAE,KAAK,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG;IACzF,KAAK,EAAE,oBAAoB,CAAC,KAAK,CAAC,CAAC;CACpC,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,EAAE,CAAC;AAC/F,MAAM,MAAM,sBAAsB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,EAAE,CAAC;AAElG,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG;IAC1F,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,SAAS,CAAC,GAAG;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,iBAAiB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG;IACtF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,EAAE,CAAC;AAEhG,MAAM,MAAM,iBAAiB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG;IACzF,EAAE,CAAC,EAAE;QACH,IAAI,CAAC,EAAE,IAAI,CAAC;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,GAAG,CAAC,EAAE;QACJ,IAAI,CAAC,EAAE,IAAI,CAAC;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;CACH,CAAC;AA+KF;;GAEG;AACH,qBAAa,aAAa,CAAC,KAAK,SAAS,OAAO;IAC9C;;OAEG;IACH,QAAQ,CAAC,EACP,KAAK,EACL,UAAU,EACV,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,qBAAqB,CAAC,KAAK,CAAC,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAuBhE;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,GAAE,mBAAmB,CAAC,KAAK,CAAM,GAAG,OAAO,CACzF,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CACzB;IA2BD;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,GAAE,mBAAmB,CAAC,KAAK,CAAM,GAAG,OAAO,CAC1G,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CACzB;IAiBD;;OAEG;IAEH,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAE,iBAAiB,CAAC,KAAK,CAAM,GAAG,OAAO,CACzG,SAAS,CAAC,KAAK,EAAE,IAAI,CAAC,CACvB;IA4BD;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAE,gBAAgB,CAAC,KAAK,CAAM,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAyCjH;;OAEG;IACH,SAAS,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAgB,EAAE,GAAE,sBAAsB,CAAC,KAAK,CAAM,GAAG,UAAU,CACnG,YAAY,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAC/B,CAAC,CAAC,CAAC;IA2BJ;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,GAAE,mBAAmB,CAAC,KAAK,CAAM,GAAG,OAAO,CACzF,SAAS,CAAC,KAAK,EAAE,OAAO,CAAC,CAC1B;IAaD;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,GAAE,iBAAiB,CAAC,KAAK,CAAM,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAsB3G;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAE,gBAAgB,CAAC,KAAK,CAAM,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;CAkB7G"}
1
+ {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/helpers.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAwB,KAAK,IAAI,EAAK,MAAM,uBAAuB,CAAC;AAC3E,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,UAAU,EACf,KAAK,OAAO,EACZ,KAAK,YAAY,EAElB,MAAM,uBAAuB,CAAC;AAK/B,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,OAAO,EAAE,KAAK,cAAc,EAAkB,MAAM,gBAAgB,CAAC;AAOrE,MAAM,MAAM,YAAY,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;AAE1G,eAAO,MAAM,mBAAmB;;;CAG9B,CAAC;AAGH;;GAEG;AACH,MAAM,MAAM,iBAAiB,CAAC,KAAK,EAAE,MAAM,IAAI,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,GAAG;IACjF,IAAI,CAAC,EAAE,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,QAAQ,CAAC,EAAE,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;CACpD,CAAC;AAGF,MAAM,MAAM,oBAAoB,CAAC,KAAK,SAAS,OAAO,IAAI;IACxD,KAAK,CAAC,MAAM,EAAE,KAAK,GAAG,MAAM,CAAC;IAC7B,OAAO,CAAC,MAAM,EAAE,KAAK,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG;IACzF,KAAK,EAAE,oBAAoB,CAAC,KAAK,CAAC,CAAC;CACpC,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,EAAE,CAAC;AAC/F,MAAM,MAAM,sBAAsB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,EAAE,CAAC;AAElG,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG;IAC1F,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,SAAS,CAAC,GAAG;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,iBAAiB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG;IACtF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,EAAE,CAAC;AAEhG,MAAM,MAAM,iBAAiB,CAAC,KAAK,SAAS,OAAO,IAAI,iBAAiB,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG;IACzF,EAAE,CAAC,EAAE;QACH,IAAI,CAAC,EAAE,IAAI,CAAC;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,GAAG,CAAC,EAAE;QACJ,IAAI,CAAC,EAAE,IAAI,CAAC;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;CACH,CAAC;AAiLF;;GAEG;AACH,qBAAa,aAAa,CAAC,KAAK,SAAS,OAAO;IAC9C;;OAEG;IACH,QAAQ,CAAC,EACP,KAAK,EACL,UAAU,EACV,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,qBAAqB,CAAC,KAAK,CAAC,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAuBhE;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,GAAE,mBAAmB,CAAC,KAAK,CAAM,GAAG,OAAO,CACzF,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CACzB;IA2BD;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,GAAE,mBAAmB,CAAC,KAAK,CAAM,GAAG,OAAO,CAC1G,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CACzB;IAiBD;;OAEG;IAEH,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAE,iBAAiB,CAAC,KAAK,CAAM,GAAG,OAAO,CACzG,SAAS,CAAC,KAAK,EAAE,IAAI,CAAC,CACvB;IA4BD;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAE,gBAAgB,CAAC,KAAK,CAAM,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAyCjH;;OAEG;IACH,SAAS,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAgB,EAAE,GAAE,sBAAsB,CAAC,KAAK,CAAM,GAAG,UAAU,CACnG,YAAY,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAC/B,CAAC,CAAC,CAAC;IA2BJ;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,GAAE,mBAAmB,CAAC,KAAK,CAAM,GAAG,OAAO,CACzF,SAAS,CAAC,KAAK,EAAE,OAAO,CAAC,CAC1B;IAaD;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,GAAE,iBAAiB,CAAC,KAAK,CAAM,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAsB3G;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,GAAE,gBAAgB,CAAC,KAAK,CAAM,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;CAkB7G"}
package/dist/types/src/hooks/index.d.ts CHANGED
@@ -1,3 +1,5 @@
1
+ export * from './useColumnSizing';
1
2
  export * from './useColumnSorting';
2
3
  export * from './usePinLastRow';
4
+ export * from './useRowSelection';
3
5
  //# sourceMappingURL=index.d.ts.map
package/dist/types/src/hooks/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAIA,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAIA,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC"}
package/dist/types/src/hooks/useColumnSizing.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ import { type ColumnSizingInfoState, type ColumnSizingState } from '@tanstack/react-table';
2
+ import { type TableColumnDef } from '../components/Table';
3
+ export declare const useColumnResizing: ({ columns, onColumnResize, }: {
4
+ columns: TableColumnDef<any>[];
5
+ onColumnResize: ((state: Record<string, number>) => void) | undefined;
6
+ }) => {
7
+ columnSizing: ColumnSizingState;
8
+ columnSizingInfo: ColumnSizingInfoState;
9
+ setColumnSizing: import("react").Dispatch<import("react").SetStateAction<ColumnSizingState>>;
10
+ setColumnSizingInfo: import("react").Dispatch<import("react").SetStateAction<ColumnSizingInfoState>>;
11
+ };
12
+ //# sourceMappingURL=useColumnSizing.d.ts.map
package/dist/types/src/hooks/useColumnSizing.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useColumnSizing.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useColumnSizing.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,qBAAqB,EAAE,KAAK,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAK3F,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE1D,eAAO,MAAM,iBAAiB;aAInB,eAAe,GAAG,CAAC,EAAE;6BACL,OAAO,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI;;;;;;CA6BzD,CAAC"}
package/dist/types/src/hooks/useRowSelection.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ import { type OnChangeFn, type RowSelectionState } from '@tanstack/react-table';
2
+ import { type TableProps } from '../components/Table';
3
+ export declare const useRowSelection: (props: Pick<TableProps<any>, 'rowsSelectable' | 'defaultRowSelection' | 'rowSelection' | 'onRowSelectionChange' | 'rowsSelectable'>) => {
4
+ rowSelection: RowSelectionState;
5
+ handleRowSelectionChange: OnChangeFn<RowSelectionState>;
6
+ };
7
+ //# sourceMappingURL=useRowSelection.d.ts.map
package/dist/types/src/hooks/useRowSelection.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useRowSelection.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useRowSelection.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAGhF,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEtD,eAAO,MAAM,eAAe,UACnB,KACL,WAAW,GAAG,CAAC,EACf,gBAAgB,GAAG,qBAAqB,GAAG,cAAc,GAAG,sBAAsB,GAAG,gBAAgB,CACtG;;;CAyBF,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dxos/react-ui-table",
3
- "version": "0.4.10-main.4c7b3fa",
3
+ "version": "0.4.10-main.4d48ccf",
4
4
  "description": "A table component.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
@@ -24,15 +24,15 @@
24
24
  "@tanstack/react-virtual": "^3.0.1",
25
25
  "date-fns": "^3.3.1",
26
26
  "effect": "2.4.9",
27
- "@dxos/keys": "0.4.10-main.4c7b3fa",
28
- "@dxos/async": "0.4.10-main.4c7b3fa",
29
- "@dxos/invariant": "0.4.10-main.4c7b3fa",
30
- "@dxos/log": "0.4.10-main.4c7b3fa",
31
- "@dxos/react-ui": "0.4.10-main.4c7b3fa",
32
- "@dxos/react-ui-searchlist": "0.4.10-main.4c7b3fa",
33
- "@dxos/react-ui-theme": "0.4.10-main.4c7b3fa",
34
- "@dxos/util": "0.4.10-main.4c7b3fa",
35
- "@dxos/react-ui-types": "0.4.10-main.4c7b3fa"
27
+ "@dxos/async": "0.4.10-main.4d48ccf",
28
+ "@dxos/invariant": "0.4.10-main.4d48ccf",
29
+ "@dxos/log": "0.4.10-main.4d48ccf",
30
+ "@dxos/react-ui": "0.4.10-main.4d48ccf",
31
+ "@dxos/keys": "0.4.10-main.4d48ccf",
32
+ "@dxos/react-ui-searchlist": "0.4.10-main.4d48ccf",
33
+ "@dxos/react-ui-theme": "0.4.10-main.4d48ccf",
34
+ "@dxos/util": "0.4.10-main.4d48ccf",
35
+ "@dxos/react-ui-types": "0.4.10-main.4d48ccf"
36
36
  },
37
37
  "devDependencies": {
38
38
  "@phosphor-icons/react": "^2.1.5",
@@ -43,10 +43,11 @@
43
43
  "react-dom": "^18.2.0",
44
44
  "vite": "^5.2.9",
45
45
  "vite-plugin-turbosnap": "^1.0.2",
46
- "@dxos/echo-schema": "0.4.10-main.4c7b3fa",
47
- "@dxos/random": "0.4.10-main.4c7b3fa",
48
- "@dxos/react-ui-theme": "0.4.10-main.4c7b3fa",
49
- "@dxos/storybook-utils": "0.4.10-main.4c7b3fa"
46
+ "@dxos/echo-schema": "0.4.10-main.4d48ccf",
47
+ "@dxos/echo-signals": "0.4.10-main.4d48ccf",
48
+ "@dxos/random": "0.4.10-main.4d48ccf",
49
+ "@dxos/react-ui-theme": "0.4.10-main.4d48ccf",
50
+ "@dxos/storybook-utils": "0.4.10-main.4d48ccf"
50
51
  },
51
52
  "peerDependencies": {
52
53
  "@phosphor-icons/react": "^2.0.5",
package/src/components/ColumnMenu/ColumnMenu.tsx CHANGED
@@ -66,41 +66,43 @@ export const ColumnMenu = <TData extends RowData, TValue>({ column, ...props }:
66
66
  </Popover.Anchor>
67
67
  </DropdownMenu.Trigger>
68
68
 
69
- <DropdownMenu.Content onCloseAutoFocus={onDropdownCloseAutoFocus} sideOffset={4} collisionPadding={8}>
70
- <DropdownMenu.Viewport>
71
- {canSort && (
72
- <>
73
- <DropdownMenu.Item onClick={() => onSelectSort('asc')}>
74
- <span className='grow'>Sort ascending</span>
75
- <span className='opacity-50'>
76
- <ArrowUp className={getSize(4)} />
77
- </span>
78
- </DropdownMenu.Item>
79
- <DropdownMenu.Item onClick={() => onSelectSort('desc')}>
80
- <span className='grow'>Sort descending</span>
81
- <span className='opacity-50'>
82
- <ArrowDown className={getSize(4)} />
83
- </span>
84
- </DropdownMenu.Item>
85
- {sortDirection !== false && (
86
- <DropdownMenu.Item onClick={onClearSort}>
87
- <span className='grow'>Clear sort</span>
69
+ <DropdownMenu.Portal>
70
+ <DropdownMenu.Content onCloseAutoFocus={onDropdownCloseAutoFocus} sideOffset={4} collisionPadding={8}>
71
+ <DropdownMenu.Viewport>
72
+ {canSort && (
73
+ <>
74
+ <DropdownMenu.Item onClick={() => onSelectSort('asc')}>
75
+ <span className='grow'>Sort ascending</span>
88
76
  <span className='opacity-50'>
89
- <X className={getSize(4)} />
77
+ <ArrowUp className={getSize(4)} />
90
78
  </span>
91
79
  </DropdownMenu.Item>
92
- )}
93
- </>
94
- )}
95
- <DropdownMenu.Item onClick={onOpenColumnSettings}>
96
- <span className='grow'>Column settings</span>
97
- <span className='opacity-50'>
98
- <GearSix className={mx(getSize(4), 'rotate-90')} />
99
- </span>
100
- </DropdownMenu.Item>
101
- </DropdownMenu.Viewport>
102
- <DropdownMenu.Arrow />
103
- </DropdownMenu.Content>
80
+ <DropdownMenu.Item onClick={() => onSelectSort('desc')}>
81
+ <span className='grow'>Sort descending</span>
82
+ <span className='opacity-50'>
83
+ <ArrowDown className={getSize(4)} />
84
+ </span>
85
+ </DropdownMenu.Item>
86
+ {sortDirection !== false && (
87
+ <DropdownMenu.Item onClick={onClearSort}>
88
+ <span className='grow'>Clear sort</span>
89
+ <span className='opacity-50'>
90
+ <X className={getSize(4)} />
91
+ </span>
92
+ </DropdownMenu.Item>
93
+ )}
94
+ </>
95
+ )}
96
+ <DropdownMenu.Item onClick={onOpenColumnSettings}>
97
+ <span className='grow'>Column settings</span>
98
+ <span className='opacity-50'>
99
+ <GearSix className={mx(getSize(4), 'rotate-90')} />
100
+ </span>
101
+ </DropdownMenu.Item>
102
+ </DropdownMenu.Viewport>
103
+ <DropdownMenu.Arrow />
104
+ </DropdownMenu.Content>
105
+ </DropdownMenu.Portal>
104
106
 
105
107
  <ColumnSettingsPanel {...props} column={column} onClose={() => setIsColumnSettingsOpen(false)} />
106
108
  </Popover.Root>
package/src/components/Table/Table.stories.tsx CHANGED
@@ -7,7 +7,8 @@ import '@dxosTheme';
7
7
  import { Plugs, PlugsConnected } from '@phosphor-icons/react';
8
8
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
9
9
 
10
- import { create } from '@dxos/echo-schema/schema';
10
+ import { create } from '@dxos/echo-schema';
11
+ import { registerSignalRuntime } from '@dxos/echo-signals/react';
11
12
  import { PublicKey } from '@dxos/keys';
12
13
  import { faker } from '@dxos/random';
13
14
  import { AnchoredOverflow, Button, DensityProvider } from '@dxos/react-ui';
@@ -393,3 +394,106 @@ export const TenThousandRows = {
393
394
  );
394
395
  },
395
396
  };
397
+
398
+ registerSignalRuntime();
399
+ const state = create({ items: createItems(10) });
400
+
401
+ export const RealTimeUpdates = {
402
+ args: {
403
+ periodicMutations: true,
404
+ mutationInterval: 1000,
405
+ periodicDeletions: false,
406
+ deletionInterval: 5000,
407
+ periodicInsertions: false,
408
+ insertionInterval: 3000,
409
+ },
410
+ argTypes: {
411
+ mutationInterval: { control: 'number' },
412
+ periodicDeletions: { control: 'boolean' },
413
+ deletionInterval: { control: 'number' },
414
+ periodicInsertions: { control: 'boolean' },
415
+ insertionInterval: { control: 'number' },
416
+ },
417
+ render: ({
418
+ periodicMutations,
419
+ mutationInterval,
420
+ periodicDeletions,
421
+ deletionInterval,
422
+ periodicInsertions,
423
+ insertionInterval,
424
+ }: any) => {
425
+ useEffect(() => {
426
+ if (!periodicMutations) {
427
+ return;
428
+ }
429
+
430
+ const interval = setInterval(() => {
431
+ if (state.items.length === 0) {
432
+ return;
433
+ }
434
+
435
+ const randomIndex = Math.floor(Math.random() * state.items.length);
436
+ console.log('Mutating row', randomIndex);
437
+ state.items[randomIndex].name = faker.commerce.productName();
438
+ state.items[randomIndex].count = Math.floor(Math.random() * 1000);
439
+ state.items[randomIndex].started = new Date();
440
+ }, mutationInterval);
441
+
442
+ return () => clearInterval(interval);
443
+ }, [periodicMutations, mutationInterval, state.items]);
444
+
445
+ useEffect(() => {
446
+ if (!periodicInsertions) {
447
+ return;
448
+ }
449
+
450
+ const interval = setInterval(() => {
451
+ console.log('Inserting...');
452
+ state.items.push(createItems(1)[0]);
453
+ }, insertionInterval);
454
+
455
+ return () => clearInterval(interval);
456
+ }, [periodicInsertions, insertionInterval, state.items]);
457
+
458
+ useEffect(() => {
459
+ if (!periodicDeletions) {
460
+ return;
461
+ }
462
+
463
+ const interval = setInterval(() => {
464
+ if (state.items.length === 0) {
465
+ return;
466
+ }
467
+
468
+ console.log('Deleting');
469
+
470
+ // Randomly delete a row from state.items
471
+ const randomIndex = Math.floor(Math.random() * state.items.length);
472
+ state.items.splice(randomIndex, 1);
473
+ }, deletionInterval);
474
+
475
+ return () => clearInterval(interval);
476
+ }, [periodicDeletions, deletionInterval, state.items]);
477
+
478
+ const containerRef = useRef<HTMLDivElement | null>(null);
479
+
480
+ const onUpdate = useCallback((...args: any[]) => {}, []);
481
+ const columns = useMemo(() => makeColumns(onUpdate), []);
482
+
483
+ return (
484
+ <div ref={containerRef} className='fixed inset-0 overflow-auto'>
485
+ <Table<Item>
486
+ role='grid'
487
+ rowsSelectable='multi'
488
+ keyAccessor={(row) => row.publicKey.toHex()}
489
+ columns={columns}
490
+ data={state.items}
491
+ fullWidth
492
+ stickyHeader
493
+ border
494
+ getScrollElement={() => containerRef.current}
495
+ />
496
+ </div>
497
+ );
498
+ },
499
+ };
package/src/components/Table/Table.tsx CHANGED
@@ -1,17 +1,12 @@
1
1
  //
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
- import { useControllableState } from '@radix-ui/react-use-controllable-state';
5
4
  import {
6
5
  getCoreRowModel,
7
6
  getSortedRowModel,
8
7
  useReactTable,
9
- type ColumnSizingInfoState,
10
8
  type GroupingState,
11
9
  type RowData,
12
- type ColumnSizingState,
13
- type OnChangeFn,
14
- type RowSelectionState,
15
10
  getGroupedRowModel,
16
11
  getExpandedRowModel,
17
12
  type Row,
@@ -20,14 +15,14 @@ import { useVirtualizer, type VirtualizerOptions } from '@tanstack/react-virtual
20
15
  import React, { Fragment, useCallback, useEffect, useState } from 'react';
21
16
 
22
17
  import { log } from '@dxos/log';
23
- import { useDefaultValue, useOnTransition } from '@dxos/react-ui';
18
+ import { useDefaultValue } from '@dxos/react-ui';
24
19
 
25
20
  import { TableBody } from './TableBody';
26
21
  import { type TypedTableProvider, TableProvider as UntypedTableProvider, useTableContext } from './TableContext';
27
22
  import { TableFooter } from './TableFooter';
28
23
  import { TableHead } from './TableHead';
29
24
  import { type TableProps } from './props';
30
- import { usePinLastRow } from '../../hooks';
25
+ import { useColumnResizing, usePinLastRow, useRowSelection } from '../../hooks';
31
26
  import { groupTh, tableRoot } from '../../theme';
32
27
 
33
28
  export const Table = <TData extends RowData>(props: TableProps<TData>) => {
@@ -44,57 +39,22 @@ export const Table = <TData extends RowData>(props: TableProps<TData>) => {
44
39
  } = props;
45
40
 
46
41
  const columns = useDefaultValue(props.columns, []);
47
- const data = useDefaultValue(props.data, []);
42
+ const incomingData = useDefaultValue(props.data, []);
48
43
 
49
- const TableProvider = UntypedTableProvider as TypedTableProvider<TData>;
50
-
51
- const [columnsInitialised, setColumnsInitialised] = useState(false);
52
- const [columnSizing, setColumnSizing] = useState<ColumnSizingState>({});
53
-
54
- useEffect(() => {
55
- if (columnsInitialised) {
56
- return;
57
- }
58
-
59
- setColumnSizing(
60
- columns
61
- .filter((column) => !!column.size && (column as any).prop !== undefined)
62
- .reduce<ColumnSizingState>((state, column) => {
63
- state[(column as any).prop] = column.size!;
64
- return state;
65
- }, {}),
66
- );
67
-
68
- setColumnsInitialised(true);
69
- }, [columns, setColumnSizing]);
44
+ const [data, setData] = useState([...incomingData]);
70
45
 
71
- const [columnSizingInfo, setColumnSizingInfo] = useState<ColumnSizingInfoState>({} as ColumnSizingInfoState);
46
+ // Reactivity workaround: https://github.com/dxos/dxos/issues/6376.
47
+ const forceUpdate = useCallback(() => setData([...incomingData]), [incomingData]);
48
+ useEffect(() => forceUpdate(), [JSON.stringify(incomingData), forceUpdate]);
72
49
 
73
- // Notify on column resize.
74
- const notifyColumnResize = useCallback(() => onColumnResize?.(columnSizing), [onColumnResize, columnSizing]);
75
- useOnTransition(columnSizingInfo.isResizingColumn, (v) => typeof v === 'string', false, notifyColumnResize);
50
+ const TableProvider = UntypedTableProvider as TypedTableProvider<TData>;
76
51
 
77
- const [rowSelection = {}, setRowSelection] = useControllableState({
78
- prop: props.rowSelection,
79
- onChange: props.onRowSelectionChange,
80
- defaultProp: props.defaultRowSelection,
52
+ const { columnSizing, setColumnSizing, columnSizingInfo, setColumnSizingInfo } = useColumnResizing({
53
+ columns,
54
+ onColumnResize,
81
55
  });
82
56
 
83
- // TODO(thure): Does @tanstack/react-table really need this intervention? It did seem necessary to enforce single-selection...
84
- const handleRowSelectionChange = useCallback<OnChangeFn<RowSelectionState>>(
85
- (updaterOrValue) => {
86
- const nextRowSelection = typeof updaterOrValue === 'function' ? updaterOrValue(rowSelection) : updaterOrValue;
87
- if (rowsSelectable === 'multi') {
88
- setRowSelection(nextRowSelection);
89
- } else if (rowsSelectable) {
90
- const nextRowSelectionKey = Object.keys(nextRowSelection).filter((id) => !rowSelection[id])[0];
91
- setRowSelection(nextRowSelectionKey ? { [nextRowSelectionKey]: true } : {});
92
- } else {
93
- setRowSelection({});
94
- }
95
- },
96
- [rowsSelectable, setRowSelection, rowSelection],
97
- );
57
+ const { rowSelection, handleRowSelectionChange } = useRowSelection(props);
98
58
 
99
59
  const [grouping, handleGroupingChange] = useState<GroupingState>(props.grouping ?? []);
100
60
  useEffect(() => handleGroupingChange(props.grouping ?? []), [handleGroupingChange, props.grouping]);
package/src/helpers.tsx CHANGED
@@ -14,7 +14,7 @@ import {
14
14
  } from '@tanstack/react-table';
15
15
  import { format } from 'date-fns/format';
16
16
  import { formatDistanceToNow } from 'date-fns/formatDistanceToNow';
17
- import React, { useEffect, useRef, useState } from 'react';
17
+ import React, { useCallback, useEffect, useRef, useState } from 'react';
18
18
 
19
19
  import { type PublicKey } from '@dxos/keys';
20
20
  import { log } from '@dxos/log';
@@ -102,14 +102,16 @@ const StringBuilderCell = <TData extends RowData>(cellContext: CellContext<TData
102
102
 
103
103
  // https://tanstack.com/table/v8/docs/examples/react/editable-data
104
104
  const initialValue = cellContext.getValue();
105
- const [value, setValue] = useState(() => {
105
+
106
+ const getInitialValue = useCallback(() => {
106
107
  // TODO(burdon): Temporary shim for automerge.
107
- if ((initialValue as any)?.content) {
108
- return (initialValue as any)?.content;
109
- }
108
+ return (initialValue as any)?.content ?? initialValue;
109
+ }, [initialValue]);
110
+
111
+ const [value, setValue] = useState(getInitialValue);
110
112
 
111
- return initialValue;
112
- });
113
+ // Update value if initialValue changes externally (cell reactivity).
114
+ useEffect(() => setValue(getInitialValue()), [getInitialValue]);
113
115
 
114
116
  const handleSave = () => {
115
117
  ref.current && document.activeElement === ref.current && findPrevFocusable(ref.current)?.focus();