@dxos/react-ui-table 0.4.7 → 0.4.8-main.00e6f19

package/dist/types/src/components/Cell/CellCombobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CellCombobox.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/CellCombobox.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAOrD,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAG1D,MAAM,MAAM,iBAAiB,CAAC,KAAK,SAAS,OAAO,IAAI,MAAM,CAAC,MAAM,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC;AAStG,eAAO,MAAM,YAAY;;;qCAOU,IAAI;iBAuEtC,CAAC"}
+{"version":3,"file":"CellCombobox.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/CellCombobox.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAOrD,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAG1D,MAAM,MAAM,iBAAiB,CAAC,KAAK,SAAS,OAAO,IAAI,MAAM,CAAC,MAAM,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC;AAStG,eAAO,MAAM,YAAY;;;qCAOU,IAAI;iBAuEtC,CAAC"}

package/dist/types/src/components/ColumnMenu.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type HeaderContext, type RowData } from '@tanstack/react-table';
 import { type TableDef, type ColumnProps } from '../schema';
 export type ColumnMenuProps<TData extends RowData, TValue> = {

package/dist/types/src/components/ColumnMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/ColumnMenu.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAOzE,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,WAAW,EAAmB,MAAM,WAAW,CAAC;AAG7E,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,sGAYtB,CAAC;AAQF,eAAO,MAAM,WAAW,+IAkMvB,CAAC"}
+{"version":3,"file":"ColumnMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/ColumnMenu.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAOzE,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,WAAW,EAAmB,MAAM,WAAW,CAAC;AAG7E,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,sGAYtB,CAAC;AAQF,eAAO,MAAM,WAAW,+IAkMvB,CAAC"}

package/dist/types/src/components/ColumnMenu.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import '@dxosTheme';
 import { type ColumnProps } from '../schema';
 declare const _default: {

package/dist/types/src/components/ColumnMenu.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnMenu.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ColumnMenu.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAOpB,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;;;;;;AAE7C,wBAIE;AAEF,eAAO,MAAM,OAAO;;;;yBAQR,GAAG;;;;CAWd,CAAC"}
+{"version":3,"file":"ColumnMenu.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ColumnMenu.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAOpB,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;;;;;;AAE7C,wBAIE;AAEF,eAAO,MAAM,OAAO;;;;yBAQR,GAAG;;;;CAWd,CAAC"}

package/dist/types/src/components/Table/Table.d.ts

@@ -1,4 +1,5 @@
-/// <reference types="react" />
+import { type VirtualizerOptions } from '@tanstack/react-virtual';
 import { type TableProps } from './props';
 export declare const Table: <TData extends unknown>(props: TableProps<TData>) => JSX.Element;
+export declare const MemoizedVirtualisedTableContent: ({ getScrollElement, }: Pick<VirtualizerOptions<Element, Element>, 'getScrollElement'>) => JSX.Element;
 //# sourceMappingURL=Table.d.ts.map

package/dist/types/src/components/Table/Table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/Table.tsx"],"names":[],"mappings":";AAyBA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,eAAO,MAAM,KAAK,kEAgJjB,CAAC"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAWlF,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,eAAO,MAAM,KAAK,kEAoIjB,CAAC;AA0FF,eAAO,MAAM,+BAA+B,0BAzCzC,KAAK,mBAAmB,OAAO,EAAE,OAAO,CAAC,EAAE,kBAAkB,CAAC,gBAyCmD,CAAC"}

package/dist/types/src/components/Table/Table.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import '@dxosTheme';
 import { PublicKey } from '@dxos/keys';
 import { type TableColumnDef } from '../../types';

package/dist/types/src/components/Table/Table.stories.d.ts.map

@@ -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;;;;;;4BAwGsB,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAL5B,wBAkDE;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;;CAgCnB,CAAC;AAEF,eAAO,MAAM,QAAQ;;CAwBpB,CAAC;AAEF,eAAO,MAAM,SAAS;;CAuBrB,CAAC;AAEF,eAAO,MAAM,eAAe;;CAyB3B,CAAC"}
+{"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,SAAS;;CAyBrB,CAAC;AAEF,eAAO,MAAM,eAAe;;CA4B3B,CAAC"}

package/dist/types/src/components/Table/TableBody.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type Row, type RowData } from '@tanstack/react-table';
 type TableBodyProps<TData extends RowData> = {
     rows: Row<TData>[];

package/dist/types/src/components/Table/TableBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/TableBody.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAc,KAAK,GAAG,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAS3E,KAAK,cAAc,CAAC,KAAK,SAAS,OAAO,IAAI;IAC3C,IAAI,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,SAAS;;;CA8Cd,CAAC;AAIF,OAAO,EAAE,SAAS,EAAE,CAAC;AAErB,YAAY,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/TableBody.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAc,KAAK,GAAG,EAAE,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAS3E,KAAK,cAAc,CAAC,KAAK,SAAS,OAAO,IAAI;IAC3C,IAAI,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,SAAS;;;CA8Cd,CAAC;AAIF,OAAO,EAAE,SAAS,EAAE,CAAC;AAErB,YAAY,EAAE,cAAc,EAAE,CAAC"}

package/dist/types/src/components/Table/TableFooter.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type TableFooterProps = {};
 declare const TableFooter: {
     <TData extends unknown>(props: TableFooterProps): JSX.Element;

package/dist/types/src/components/Table/TableFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableFooter.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/TableFooter.tsx"],"names":[],"mappings":";AAUA,KAAK,gBAAgB,GAAG,EAAE,CAAC;AAI3B,QAAA,MAAM,WAAW;mCAAkC,gBAAgB;;CAwBlE,CAAC;AAIF,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,YAAY,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"TableFooter.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/TableFooter.tsx"],"names":[],"mappings":"AAUA,KAAK,gBAAgB,GAAG,EAAE,CAAC;AAI3B,QAAA,MAAM,WAAW;mCAAkC,gBAAgB;;CAwBlE,CAAC;AAIF,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,YAAY,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/types/src/components/Table/TableHead.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type TableHeadProps = {};
 declare const TableHead: {
     <TData extends unknown>(_props: TableHeadProps): JSX.Element;

package/dist/types/src/components/Table/TableHead.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableHead.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/TableHead.tsx"],"names":[],"mappings":";AAcA,KAAK,cAAc,GAAG,EAAE,CAAC;AAEzB,QAAA,MAAM,SAAS;oCAAmC,cAAc;;CA0D/D,CAAC;AAIF,OAAO,EAAE,SAAS,EAAE,CAAC;AAErB,YAAY,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"TableHead.d.ts","sourceRoot":"","sources":["../../../../../src/components/Table/TableHead.tsx"],"names":[],"mappings":"AAcA,KAAK,cAAc,GAAG,EAAE,CAAC;AAEzB,QAAA,MAAM,SAAS;oCAAmC,cAAc;;CA0D/D,CAAC;AAIF,OAAO,EAAE,SAAS,EAAE,CAAC;AAErB,YAAY,EAAE,cAAc,EAAE,CAAC"}

package/dist/types/src/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/helpers.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/helpers.tsx"],"names":[],"mappings":"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"}

package/dist/types/src/theme.d.ts

@@ -6,7 +6,7 @@ export declare const selectedRow = "!bg-primary-100 dark:!bg-primary-700";
 export declare const flushPadding = "pli-0 plb-0";
 export declare const textPadding = "pli-2 plb-0.5";
 export declare const headPadding = "pli-2 plb-1.5";
-export declare const gridCellFocusRing = "focus:z-[11] focus:outline outline-2 outline-primary-500 dark:outline-primary-400";
+export declare const gridCellFocusRing = "focus-within:z-[11] focus-within:outline outline-2 outline-primary-500 dark:outline-primary-400";
 export type TableStyleProps = Partial<TableContextValue<any>>;
 export declare const tableRoot: ComponentFunction<TableStyleProps>;
 export declare const groupTh: ComponentFunction<TableStyleProps>;

package/dist/types/src/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/theme.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAWzD,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,OAAO,EAAE,KAAK,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAEvE,eAAO,MAAM,UAAU,wCAAwC,CAAC;AAChE,eAAO,MAAM,WAAW,yCAAyC,CAAC;AAClE,eAAO,MAAM,YAAY,gBAAgB,CAAC;AAC1C,eAAO,MAAM,WAAW,kBAAkB,CAAC;AAC3C,eAAO,MAAM,WAAW,kBAAkB,CAAC;AAE3C,eAAO,MAAM,iBAAiB,sFAAsF,CAAC;AAMrH,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC;AAE9D,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CACN,CAAC;AAEpD,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CACH,CAAC;AAMrD,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AAElD,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CAC4D,CAAC;AAEtH,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAA2C,CAAC;AAEnG,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAOpD,CAAC;AAEJ,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,eAAe,CAI5D,CAAC;AAEJ,eAAO,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,eAAe,CACQ,CAAC;AAMzE,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC;AAC9D,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CAAkC,CAAC;AAE5F,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,YAAY,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC,CAAC;AACpE,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,iBAAiB,CAOtD,CAAC;AAMJ,eAAO,MAAM,MAAM,EAAE,iBAAiB,CAAC,eAAe,CACwD,CAAC;AAC/G,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,WAAW,CAAC,GAAG,EAAE,GAAG,CAAC,CAAkC,CAAC;AAMlG,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC;AAE9D,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CACJ,CAAC;AAEtD,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAAkC,CAAC;AAE1F,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CACO,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/theme.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAWzD,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,OAAO,EAAE,KAAK,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAEvE,eAAO,MAAM,UAAU,wCAAwC,CAAC;AAChE,eAAO,MAAM,WAAW,yCAAyC,CAAC;AAClE,eAAO,MAAM,YAAY,gBAAgB,CAAC;AAC1C,eAAO,MAAM,WAAW,kBAAkB,CAAC;AAC3C,eAAO,MAAM,WAAW,kBAAkB,CAAC;AAE3C,eAAO,MAAM,iBAAiB,oGACqE,CAAC;AAMpG,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC;AAE9D,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CACN,CAAC;AAEpD,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CACH,CAAC;AAMrD,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AAElD,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CAC4D,CAAC;AAEtH,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAA2C,CAAC;AAEnG,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAOpD,CAAC;AAEJ,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,eAAe,CAI5D,CAAC;AAEJ,eAAO,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,eAAe,CACQ,CAAC;AAMzE,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC;AAC9D,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CAAkC,CAAC;AAE5F,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,YAAY,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC,CAAC;AACpE,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,iBAAiB,CAOtD,CAAC;AAMJ,eAAO,MAAM,MAAM,EAAE,iBAAiB,CAAC,eAAe,CACwD,CAAC;AAE/G,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,WAAW,CAAC,GAAG,EAAE,GAAG,CAAC,CAAkC,CAAC;AAMlG,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC;AAE9D,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,eAAe,CACJ,CAAC;AAEtD,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAAkC,CAAC;AAE1F,eAAO,MAAM,OAAO,EAAE,iBAAiB,CAAC,eAAe,CACO,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-table",
-  "version": "0.4.7",
+  "version": "0.4.8-main.00e6f19",
   "description": "A table component.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -22,28 +22,28 @@
     "@tanstack/react-table": "^8.9.3",
     "@tanstack/react-virtual": "^3.0.1",
     "date-fns": "^3.3.1",
-    "@dxos/keys": "0.4.7",
-    "@dxos/async": "0.4.7",
-    "@dxos/log": "0.4.7",
-    "@dxos/invariant": "0.4.7",
-    "@dxos/react-ui-searchlist": "0.4.7",
-    "@dxos/react-ui-theme": "0.4.7",
-    "@dxos/react-ui": "0.4.7",
-    "@dxos/util": "0.4.7",
-    "@dxos/react-ui-types": "0.4.7"
+    "@dxos/async": "0.4.8-main.00e6f19",
+    "@dxos/invariant": "0.4.8-main.00e6f19",
+    "@dxos/log": "0.4.8-main.00e6f19",
+    "@dxos/react-ui": "0.4.8-main.00e6f19",
+    "@dxos/keys": "0.4.8-main.00e6f19",
+    "@dxos/react-ui-theme": "0.4.8-main.00e6f19",
+    "@dxos/react-ui-searchlist": "0.4.8-main.00e6f19",
+    "@dxos/react-ui-types": "0.4.8-main.00e6f19",
+    "@dxos/util": "0.4.8-main.00e6f19"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.0.5",
     "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
-    "deepsignal": "^1.5.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "vite": "^5.1.5",
     "vite-plugin-turbosnap": "^1.0.2",
-    "@dxos/random": "0.4.7",
-    "@dxos/react-ui-theme": "0.4.7",
-    "@dxos/storybook-utils": "0.4.7"
+    "@dxos/echo-schema": "0.4.8-main.00e6f19",
+    "@dxos/storybook-utils": "0.4.8-main.00e6f19",
+    "@dxos/random": "0.4.8-main.00e6f19",
+    "@dxos/react-ui-theme": "0.4.8-main.00e6f19"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.0.5",

package/src/components/Cell/Cell.tsx

@@ -18,8 +18,11 @@ const CELL_NAME = 'Cell';
 const FocusableCell = <TData extends RowData, TValue>({ cell, children }: CellProps<TData, TValue>) => {
   const tableContext = useTableContext(CELL_NAME);
   const domAttributes = useFocusableGroup({ tabBehavior: 'limited' });
+
+  const className = tdRoot(tableContext, cell.column.columnDef.meta?.cell?.classNames);
+
   return (
-    <td tabIndex={0} {...domAttributes} className={tdRoot(tableContext, cell.column.columnDef.meta?.cell?.classNames)}>
+    <td tabIndex={0} {...domAttributes} className={className}>
       {children}
     </td>
   );

package/src/components/Table/Table.stories.tsx

@@ -5,12 +5,12 @@
 import '@dxosTheme';
 
 import { Plugs, PlugsConnected } from '@phosphor-icons/react';
-import { deepSignal } from 'deepsignal/react';
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
+import * as E from '@dxos/echo-schema/schema';
 import { PublicKey } from '@dxos/keys';
 import { faker } from '@dxos/random';
-import { DensityProvider, AnchoredOverflow } from '@dxos/react-ui';
+import { AnchoredOverflow, DensityProvider } from '@dxos/react-ui';
 import { withTheme } from '@dxos/storybook-utils';
 import { range } from '@dxos/util';
 
@@ -35,7 +35,7 @@ faker.seed(911);
 const createItems = (count: number) =>
   range(count).map(
     () =>
-      deepSignal<Item>({
+      E.object<Item>({
         publicKey: PublicKey.random(),
         name: faker.commerce.productName(),
         count: faker.datatype.boolean({ probability: 0.9 }) ? faker.number.int({ min: 0, max: 10_000 }) : undefined,
@@ -72,7 +72,7 @@ const tableStorySelectModel: SearchListQueryModel<Item> = {
 
 const { helper, builder } = createColumnBuilder<Item>();
 
-const columns = (onUpdate?: ValueUpdater<Item, any>): TableColumnDef<Item, any>[] => [
+const makeColumns = (onUpdate?: ValueUpdater<Item, any>): TableColumnDef<Item, any>[] => [
   helper.display(builder.selectRow()),
   helper.accessor((item) => item.publicKey, { id: 'key', ...builder.key({ tooltip: true }) }),
   helper.accessor(
@@ -90,26 +90,14 @@ const columns = (onUpdate?: ValueUpdater<Item, any>): TableColumnDef<Item, any>[
     builder.number({
       label: 'Count',
       meta: { resizable: true },
-      // TODO(burdon): Sorting.
-      getGroupingValue: (row) => (row.count ? (row.count < 2_000 ? 'A' : row.count < 5_000 ? 'B' : 'C') : 'D'),
-    }),
-  ),
-  helper.accessor(
-    'company',
-    builder.combobox({
-      label: 'Company',
-      model: tableStorySelectModel,
       onUpdate,
+      getGroupingValue: (row) => (row.count ? (row.count < 2000 ? 'A' : row.count < 5000 ? 'B' : 'C') : 'D'),
     }),
   ),
+  helper.accessor('company', builder.combobox({ label: 'Company', model: tableStorySelectModel, onUpdate })),
   helper.accessor(
     'complete',
-    builder.switch({
-      // enableGrouping: true,
-      getGroupingValue: (row) => row.complete === true,
-      label: '',
-      onUpdate,
-    }),
+    builder.switch({ getGroupingValue: (row) => row.complete === true, label: '', onUpdate }),
   ),
   helper.accessor('complete', builder.icon({ id: 'done', label: '' })),
   helper.accessor(
@@ -135,18 +123,10 @@ export default {
     keyAccessor: (item: Item) => item.publicKey.toHex(),
   },
   argTypes: {
-    header: {
-      control: 'boolean',
-    },
-    footer: {
-      control: 'boolean',
-    },
-    border: {
-      control: 'boolean',
-    },
-    fullWidth: {
-      control: 'boolean',
-    },
+    header: { control: 'boolean' },
+    footer: { control: 'boolean' },
+    border: { control: 'boolean' },
+    fullWidth: { control: 'boolean' },
     grouping: {
       control: 'select',
       options: ['none', 'complete', 'count'],
@@ -164,10 +144,7 @@ export default {
         limited: { key: false, started: false },
       },
     },
-    rowsSelectable: {
-      control: 'select',
-      options: [false, true, 'multi'],
-    },
+    rowsSelectable: { control: 'select', options: [false, true, 'multi'] },
   },
   decorators: [
     withTheme,
@@ -181,21 +158,21 @@ export default {
 
 export const Default = {
   args: {
-    columns: columns(),
+    columns: makeColumns(),
     data: createItems(20),
   },
 };
 
 export const Scrolling = {
   args: {
-    columns: columns(),
+    columns: makeColumns(),
     data: createItems(200),
   },
 };
 
 export const Visibility = {
   args: {
-    columns: columns(),
+    columns: makeColumns(),
     data: createItems(10),
     columnVisibility: { key: false, started: false },
   },
@@ -203,7 +180,7 @@ export const Visibility = {
 
 export const Empty = {
   args: {
-    columns: columns(),
+    columns: makeColumns(),
   },
 };
 
@@ -211,6 +188,7 @@ export const Dynamic = {
   render: () => {
     const containerRef = useRef<HTMLDivElement | null>(null);
     const [items, setItems] = useState<Item[]>(createItems(50));
+
     useEffect(() => {
       const interval = setInterval(() => {
         setItems((items) => {
@@ -223,12 +201,14 @@ export const Dynamic = {
       return () => clearInterval(interval);
     }, []);
 
+    const columns = useMemo(() => makeColumns(), []);
+
     return (
       <AnchoredOverflow.Root classNames='max-bs-[80dvh]' ref={containerRef}>
         <Table<Item>
           rowsSelectable='multi'
           keyAccessor={(row) => row.publicKey.toHex()}
-          columns={columns()}
+          columns={columns}
           data={items}
           fullWidth
           footer
@@ -245,9 +225,13 @@ export const Editable = {
   render: () => {
     const containerRef = useRef<HTMLDivElement | null>(null);
     const [items, setItems] = useState<Item[]>(createItems(200));
-    const onUpdate: ValueUpdater<Item, any> = (item, prop, value) => {
-      setItems((items) => updateItems(items, item.publicKey, prop, value));
-    };
+
+    const onUpdate: ValueUpdater<Item, any> = useCallback(
+      (item, prop, value) => setItems((items) => updateItems(items, item.publicKey, prop, value)),
+      [setItems],
+    );
+
+    const columns = useMemo(() => makeColumns(onUpdate), [onUpdate]);
 
     return (
       <div ref={containerRef} className='fixed inset-0 overflow-auto'>
@@ -255,7 +239,7 @@ export const Editable = {
           role='grid'
           rowsSelectable='multi'
           keyAccessor={(row) => row.publicKey.toHex()}
-          columns={columns(onUpdate)}
+          columns={columns}
           data={items}
           fullWidth
           stickyHeader
@@ -269,25 +253,27 @@ export const Editable = {
 
 export const Resizable = {
   render: () => {
+    const containerRef = useRef<HTMLDivElement | null>(null);
     const [items, setItems] = useState<Item[]>(createItems(10));
-    const onUpdate: ValueUpdater<Item, any> = (item, prop, value) => {
-      setItems((items) => updateItems(items, item.publicKey, prop, value));
-    };
 
-    // const handleColumnResize = (state) => {
-    //   console.log('resize', state);
-    // };
+    const onUpdate: ValueUpdater<Item, any> = useCallback(
+      (item, prop, value) => setItems((items) => updateItems(items, item.publicKey, prop, value)),
+      [setItems],
+    );
 
     return (
-      <Table<Item>
-        rowsSelectable='multi'
-        keyAccessor={(row) => row.publicKey.toHex()}
-        columns={columns(onUpdate)}
-        data={items}
-        fullWidth
-        stickyHeader
-        // onColumnResize={handleColumnResize}
-      />
+      <div ref={containerRef} className='fixed inset-0 overflow-auto'>
+        <Table<Item>
+          rowsSelectable='multi'
+          keyAccessor={(row) => row.publicKey.toHex()}
+          columns={makeColumns(onUpdate)}
+          data={items}
+          fullWidth
+          stickyHeader
+          getScrollElement={() => containerRef.current}
+          // onColumnResize={handleColumnResize}
+        />
+      </div>
     );
   },
 };
@@ -297,9 +283,12 @@ export const TenThousandRows = {
     const containerRef = useRef<HTMLDivElement | null>(null);
     const [items, setItems] = useState<Item[]>(createItems(10000));
 
-    const onUpdate: ValueUpdater<Item, any> = (item, prop, value) => {
-      setItems((items) => updateItems(items, item.publicKey, prop, value));
-    };
+    const onUpdate: ValueUpdater<Item, any> = useCallback(
+      (item, prop, value) => setItems((items) => updateItems(items, item.publicKey, prop, value)),
+      [setItems],
+    );
+
+    const columns = useMemo(() => makeColumns(onUpdate), [onUpdate]);
 
     return (
       <div ref={containerRef} className='fixed inset-0 overflow-auto'>
@@ -307,7 +296,7 @@ export const TenThousandRows = {
           role='grid'
           rowsSelectable='multi'
           keyAccessor={(row) => row.publicKey.toHex()}
-          columns={columns(onUpdate)}
+          columns={columns}
           data={items}
           fullWidth
           stickyHeader

package/src/components/Table/Table.tsx

@@ -18,6 +18,7 @@ import React, { Fragment, useCallback, useEffect, useState } from 'react';
 
 import { debounce } from '@dxos/async';
 import { log } from '@dxos/log';
+import { useDefaultValue } from '@dxos/react-ui';
 
 import { TableBody } from './TableBody';
 import { TableProvider as UntypedTableProvider, type TypedTableProvider, useTableContext } from './TableContext';
@@ -29,8 +30,6 @@ import { groupTh, tableRoot } from '../../theme';
 export const Table = <TData extends RowData>(props: TableProps<TData>) => {
   const {
     role,
-    data = [],
-    columns = [],
     onColumnResize,
     columnVisibility,
     header = true,
@@ -40,16 +39,14 @@ export const Table = <TData extends RowData>(props: TableProps<TData>) => {
     getScrollElement,
   } = props;
 
-  const TableProvider = UntypedTableProvider as TypedTableProvider<TData>;
+  const columns = useDefaultValue(props.columns, []);
+  const data = useDefaultValue(props.data, []);
 
-  //
-  // Column resizing
-  //
+  const TableProvider = UntypedTableProvider as TypedTableProvider<TData>;
 
   const [columnSizing, setColumnSizing] = useState<ColumnSizingState>({});
 
   useEffect(() => {
-    // Set initial state.
     setColumnSizing(
       columns
         .filter((column) => !!column.size && (column as any).prop !== undefined)
@@ -58,31 +55,16 @@ export const Table = <TData extends RowData>(props: TableProps<TData>) => {
           return state;
         }, {}),
     );
-  }, [columns]);
+  }, [columns, setColumnSizing]);
 
   const [columnSizingInfo, setColumnSizingInfo] = useState<ColumnSizingInfoState>({} as ColumnSizingInfoState);
 
-  const onColumnResizeDebounced = onColumnResize && debounce<ColumnSizingState>(onColumnResize, 1_000);
-  useEffect(() => {
-    if (columnSizingInfo.columnSizingStart?.length === 0) {
-      onColumnResizeDebounced?.(table.getState().columnSizing);
-    }
-  }, [columnSizingInfo]);
-
-  //
-  // Row selection
-  //
-
   const [rowSelection = {}, setRowSelection] = useControllableState({
     prop: props.rowSelection,
     onChange: props.onRowSelectionChange,
     defaultProp: props.defaultRowSelection,
   });
 
-  useEffect(() => {
-    onDataSelectionChange?.(Object.keys(rowSelection).map((id) => table.getRowModel().rowsById[id].original));
-  }, [onDataSelectionChange, rowSelection]);
-
   // TODO(thure): Does @tanstack/react-table really need this intervention? It did seem necessary to enforce single-selection...
   const handleRowSelectionChange = useCallback<OnChangeFn<RowSelectionState>>(
     (updaterOrValue) => {
@@ -96,15 +78,11 @@ export const Table = <TData extends RowData>(props: TableProps<TData>) => {
         setRowSelection({});
       }
     },
-    [rowSelection, setRowSelection],
+    [rowsSelectable, setRowSelection, rowSelection],
   );
 
-  //
-  // Row grouping
-  //
-
   const [grouping, handleGroupingChange] = useState<GroupingState>(props.grouping ?? []);
-  useEffect(() => handleGroupingChange(props.grouping ?? []), [props.grouping]);
+  useEffect(() => handleGroupingChange(props.grouping ?? []), [handleGroupingChange, props.grouping]);
 
   const table = useReactTable({
     // Data
@@ -140,18 +118,29 @@ export const Table = <TData extends RowData>(props: TableProps<TData>) => {
     getGroupedRowModel: grouping.length > 1 ? getGroupedRowModel() : undefined,
     onGroupingChange: handleGroupingChange,
 
-    // Selection
-    ...(rowsSelectable === 'multi'
-      ? { enableMultiRowSelection: true }
-      : rowsSelectable
-        ? { enableRowSelection: true }
-        : {}),
+    enableMultiRowSelection: rowsSelectable === 'multi' ? true : undefined,
+    enableRowSelection: rowsSelectable === true ? true : undefined,
+
     onRowSelectionChange: handleRowSelectionChange,
 
     // Debug
     debugTable: debug,
   });
 
+  const onColumnResizeDebounced = onColumnResize && debounce(onColumnResize, 1_000);
+
+  useEffect(() => {
+    onDataSelectionChange?.(Object.keys(rowSelection).map((id) => table.getRowModel().rowsById[id].original));
+  }, [onDataSelectionChange, rowSelection, table]);
+
+  useEffect(() => {
+    const shouldTriggerResize = columnSizingInfo.columnSizingStart?.length === 0;
+
+    if (shouldTriggerResize) {
+      onColumnResizeDebounced?.(table.getState().columnSizing);
+    }
+  }, [columnSizingInfo, onColumnResizeDebounced, table]);
+
   // Create additional expansion column if all columns have fixed width.
   const expand = false; // columns.map((column) => column.size).filter(Boolean).length === columns?.length;
 
@@ -188,6 +177,8 @@ const TableImpl = <TData extends RowData>(props: TableProps<TData>) => {
     );
   }
 
+  const isResizingColumn = table.getState().columnSizingInfo.isResizingColumn;
+
   return (
     <table
       role={role}
@@ -198,7 +189,11 @@ const TableImpl = <TData extends RowData>(props: TableProps<TData>) => {
 
       {grouping?.length !== 0 ? (
         getScrollElement ? (
-          <VirtualizedTableContent getScrollElement={getScrollElement} />
+          isResizingColumn ? (
+            <MemoizedVirtualisedTableContent getScrollElement={getScrollElement} />
+          ) : (
+            <VirtualizedTableContent getScrollElement={getScrollElement} />
+          )
         ) : (
           <TableBody rows={rows} />
         )
@@ -217,6 +212,7 @@ const VirtualizedTableContent = ({
   const {
     table: { getRowModel },
   } = useTableContext('VirtualizedTableContent');
+
   const rows = getRowModel().rows;
 
   const { getTotalSize, getVirtualItems } = useVirtualizer({
@@ -225,6 +221,7 @@ const VirtualizedTableContent = ({
     overscan: 4,
     estimateSize: () => 33,
   });
+
   const virtualRows = getVirtualItems();
   const totalSize = getTotalSize();
 
@@ -252,6 +249,8 @@ const VirtualizedTableContent = ({
   );
 };
 
+export const MemoizedVirtualisedTableContent = React.memo(VirtualizedTableContent) as typeof VirtualizedTableContent;
+
 const GroupedTableContent = () => {
   const {
     table: { getGroupedRowModel, getHeaderGroups, getState },