@dxos/react-ui-table 0.6.12-staging.e11e696 → 0.6.13-main.548ca8d

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 (59) hide show
  1. package/dist/lib/browser/index.mjs +40 -124
  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 +6 -3
  5. package/dist/types/src/components/ColumnMenu/ColumnMenu.d.ts.map +1 -1
  6. package/dist/types/src/components/ColumnMenu/ColumnMenu.stories.d.ts +3 -3
  7. package/dist/types/src/components/ColumnMenu/ColumnMenu.stories.d.ts.map +1 -1
  8. package/dist/types/src/components/ColumnMenu/ColumnSettings.d.ts +15 -0
  9. package/dist/types/src/components/ColumnMenu/ColumnSettings.d.ts.map +1 -0
  10. package/dist/types/src/components/ColumnMenu/ColumnSettings.stories.d.ts +84 -0
  11. package/dist/types/src/components/ColumnMenu/ColumnSettings.stories.d.ts.map +1 -0
  12. package/dist/types/src/components/ColumnMenu/index.d.ts +1 -1
  13. package/dist/types/src/components/ColumnMenu/index.d.ts.map +1 -1
  14. package/dist/types/src/components/Table/Table.d.ts.map +1 -1
  15. package/dist/types/src/components/Table/Table.stories.d.ts +21 -9
  16. package/dist/types/src/components/Table/Table.stories.d.ts.map +1 -1
  17. package/dist/types/src/components/Table/TableContext.d.ts +2 -4
  18. package/dist/types/src/components/Table/TableContext.d.ts.map +1 -1
  19. package/dist/types/src/components/Table/index.d.ts +2 -1
  20. package/dist/types/src/components/Table/index.d.ts.map +1 -1
  21. package/dist/types/src/helpers.d.ts +1 -1
  22. package/dist/types/src/helpers.d.ts.map +1 -1
  23. package/dist/types/src/schema/{SchemaToTable.stories.d.ts → Schema.stories.d.ts} +2 -3
  24. package/dist/types/src/schema/Schema.stories.d.ts.map +1 -0
  25. package/dist/types/src/schema/{schemaToColumns.d.ts → column-utils.d.ts} +1 -1
  26. package/dist/types/src/schema/column-utils.d.ts.map +1 -0
  27. package/dist/types/src/schema/index.d.ts +1 -1
  28. package/dist/types/src/schema/index.d.ts.map +1 -1
  29. package/dist/types/src/schema/types.d.ts +10 -4
  30. package/dist/types/src/schema/types.d.ts.map +1 -1
  31. package/package.json +18 -15
  32. package/src/components/ColumnMenu/ColumnMenu.stories.tsx +13 -12
  33. package/src/components/ColumnMenu/ColumnMenu.tsx +8 -5
  34. package/src/components/ColumnMenu/{ColumnSettingsForm.stories.tsx → ColumnSettings.stories.tsx} +27 -23
  35. package/src/components/ColumnMenu/{ColumnSettingsForm.tsx → ColumnSettings.tsx} +43 -43
  36. package/src/components/ColumnMenu/index.ts +1 -1
  37. package/src/components/Table/Table.stories.tsx +97 -85
  38. package/src/components/Table/Table.tsx +5 -6
  39. package/src/components/Table/TableContext.tsx +13 -7
  40. package/src/components/Table/index.ts +2 -1
  41. package/src/components/Table/props.ts +4 -4
  42. package/src/helpers.tsx +4 -6
  43. package/src/schema/{SchemaToTable.stories.tsx → Schema.stories.tsx} +10 -22
  44. package/src/schema/{schemaToColumns.ts → column-utils.ts} +8 -8
  45. package/src/schema/index.ts +1 -1
  46. package/src/schema/types.ts +14 -6
  47. package/src/translations.ts +1 -1
  48. package/dist/types/src/components/ColumnMenu/ColumnSettingsForm.d.ts +0 -12
  49. package/dist/types/src/components/ColumnMenu/ColumnSettingsForm.d.ts.map +0 -1
  50. package/dist/types/src/components/ColumnMenu/ColumnSettingsForm.stories.d.ts +0 -63
  51. package/dist/types/src/components/ColumnMenu/ColumnSettingsForm.stories.d.ts.map +0 -1
  52. package/dist/types/src/schema/SchemaToTable.stories.d.ts.map +0 -1
  53. package/dist/types/src/schema/schema.d.ts +0 -5
  54. package/dist/types/src/schema/schema.d.ts.map +0 -1
  55. package/dist/types/src/schema/schema.test.d.ts +0 -2
  56. package/dist/types/src/schema/schema.test.d.ts.map +0 -1
  57. package/dist/types/src/schema/schemaToColumns.d.ts.map +0 -1
  58. package/src/schema/schema.test.ts +0 -146
  59. package/src/schema/schema.ts +0 -92
@@ -3,26 +3,32 @@
3
3
  //
4
4
 
5
5
  import { type RowData } from '@tanstack/react-table';
6
- import React, { useContext, createContext, type JSX, type ReactNode, type FC, type Context } from 'react';
6
+ import React, {
7
+ useContext,
8
+ createContext,
9
+ type Context,
10
+ type JSX,
11
+ type PropsWithChildren,
12
+ type ReactNode,
13
+ } from 'react';
14
+
15
+ import { raise } from '@dxos/debug';
7
16
 
8
17
  import { type TableContextValue } from './props';
9
18
 
10
19
  export const TABLE_NAME = 'Table';
11
20
 
12
- // Create the context without a default value.
13
- // The expectation is that the provider will always supply a value, so no need to define a default here.
14
- const TableContext = createContext<TableContextValue<RowData>>({} as TableContextValue<RowData>);
21
+ const TableContext = createContext<TableContextValue<RowData> | undefined>(undefined);
15
22
 
16
23
  export type TypedTableProvider<TData extends RowData> = {
17
24
  (props: TableContextValue<TData> & { children: ReactNode }): JSX.Element;
18
25
  displayName: string;
19
26
  };
20
27
 
21
- export const TableProvider: FC<TableContextValue<RowData> & { children: ReactNode }> = ({ children, ...value }) => {
28
+ export const TableProvider = ({ children, ...value }: PropsWithChildren<TableContextValue<RowData>>) => {
22
29
  return <TableContext.Provider value={value}>{children}</TableContext.Provider>;
23
30
  };
24
31
 
25
- // Create a custom hook to consume the context.
26
32
  export const useTableContext = <TData extends RowData>(): TableContextValue<TData> => {
27
- return useContext(TableContext as Context<TableContextValue<TData>>);
33
+ return useContext(TableContext as Context<TableContextValue<TData>>) ?? raise(new Error('Missing TableContext'));
28
34
  };
@@ -2,6 +2,7 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- export * from './Table';
6
5
  export * from './props';
6
+ export * from './Table';
7
+ export * from './TableContext';
7
8
  export * from './TableRootContext';
@@ -25,7 +25,7 @@ export type TableFlags = Partial<{
25
25
  * This is ‘current’ in the `aria-current` sense.
26
26
  */
27
27
  export type TableCurrent<TData extends RowData> = Partial<{
28
- // App state
28
+ // App state.
29
29
  currentDatum: TData;
30
30
  onDatumClick: (datum: TData) => void;
31
31
  }>;
@@ -39,13 +39,13 @@ export type TableProps<TData extends RowData> = TableFlags &
39
39
  onColumnResize: (state: Record<string, number>) => void;
40
40
  onColumnReorder: (columnId: string, direction: 'left' | 'right') => void;
41
41
  columnVisibility: VisibilityState;
42
- // Controllable row selection
42
+ // Controllable row selection.
43
43
  rowSelection: RowSelectionState;
44
44
  defaultRowSelection: RowSelectionState;
45
45
  onRowSelectionChange: (rowSelection: RowSelectionState) => void;
46
- // Derived from row selection
46
+ // Derived from row selection.
47
47
  onDataSelectionChange: (dataSelection: TData[]) => void;
48
- // `table` element props
48
+ // `table` element props.
49
49
  classNames: ClassNameValue;
50
50
  pinLastRow: boolean;
51
51
  }>;
package/src/helpers.tsx CHANGED
@@ -21,8 +21,7 @@ import { log } from '@dxos/log';
21
21
  import { type ClassNameValue, Input, Tooltip } from '@dxos/react-ui';
22
22
  import { getSize, mx } from '@dxos/react-ui-theme';
23
23
 
24
- import { CellCombobox } from './components';
25
- import { useTableContext } from './components/Table/TableContext';
24
+ import { CellCombobox, useTableContext } from './components';
26
25
  import { textPadding } from './theme';
27
26
 
28
27
  export type ValueUpdater<TData extends RowData, TValue> = (row: TData, id: string, value: TValue) => void;
@@ -470,7 +469,7 @@ export class ColumnBuilder<TData extends RowData> {
470
469
  size: 50,
471
470
  minSize: 50,
472
471
  header: (column) => label ?? column.header.id,
473
- // TODO(zan): Implement sort algorithm
472
+ // TODO(zan): Implement sort algorithm.
474
473
  enableSorting: true,
475
474
  cell: SwitchBuilderCell,
476
475
  ...props,
@@ -486,7 +485,7 @@ export class ColumnBuilder<TData extends RowData> {
486
485
  const IconOff = off?.Icon ?? X;
487
486
  return {
488
487
  size: size ?? 32,
489
- // TODO(zan): Implement sort algorithm
488
+ // TODO(zan): Implement sort algorithm.
490
489
  enableSorting: false,
491
490
  header: (column) => <div className={'justify-center'}>{label ?? column.header.id}</div>,
492
491
  cell: (cell) => {
@@ -506,14 +505,13 @@ export class ColumnBuilder<TData extends RowData> {
506
505
  /**
507
506
  * This display column type is for nested/unhandled data to appear as JSON.
508
507
  */
509
- display({ label, classNames, ...props }: KeyColumnOptions<TData> = {}): Partial<ColumnDef<TData, PublicKey>> {
508
+ json({ label, classNames, ...props }: KeyColumnOptions<TData> = {}): Partial<ColumnDef<TData, PublicKey>> {
510
509
  return {
511
510
  size: 120,
512
511
  minSize: 120,
513
512
  header: (cell) => label ?? cell.header.id,
514
513
  cell: (cell) => {
515
514
  const value = cell.getValue();
516
-
517
515
  return (
518
516
  <div className='overflow-scroll'>
519
517
  <code className='text-xs'>{JSON.stringify(value)}</code>
@@ -9,26 +9,17 @@ import * as fc from 'fast-check';
9
9
  import React from 'react';
10
10
 
11
11
  import { S } from '@dxos/echo-schema';
12
- import { DensityProvider } from '@dxos/react-ui';
13
- import { withTheme } from '@dxos/storybook-utils';
12
+ import { withTheme, withLayout } from '@dxos/storybook-utils';
14
13
 
15
- import { schemaToColumnDefs } from './schemaToColumns';
14
+ import { schemaToColumnDefs } from './column-utils';
16
15
  import { Table } from '../components';
17
16
 
18
17
  export default {
19
- title: 'react-ui-table/SchemaTable',
20
- args: {},
21
- decorators: [
22
- withTheme,
23
- (Story: any) => (
24
- <DensityProvider density='fine'>
25
- <Story />
26
- </DensityProvider>
27
- ),
28
- ],
18
+ title: 'react-ui-table/Schema',
19
+ decorators: [withTheme, withLayout()],
29
20
  };
30
21
 
31
- const exampleSchema = S.Struct({
22
+ const TestSchema = S.Struct({
32
23
  field1: S.String,
33
24
  field2: S.Number,
34
25
  field3: S.Date,
@@ -41,20 +32,17 @@ const exampleSchema = S.Struct({
41
32
  ),
42
33
  });
43
34
 
44
- type ExampleSchema = S.Schema.Type<typeof exampleSchema>;
35
+ type TestType = S.Schema.Type<typeof TestSchema>;
45
36
 
46
- const columns = schemaToColumnDefs(exampleSchema);
37
+ const columns = schemaToColumnDefs(TestSchema);
38
+ const items = fc.sample(Arbitrary.make(TestSchema), 10);
47
39
 
48
- const exampleSchemaArbitrary = Arbitrary.make(exampleSchema);
49
-
50
- const items = fc.sample(exampleSchemaArbitrary, 10);
51
-
52
- export const SchemaTable = {
40
+ export const Default = {
53
41
  render: () => {
54
42
  return (
55
43
  <Table.Root>
56
44
  <Table.Viewport classNames='fixed inset-0'>
57
- <Table.Main<ExampleSchema>
45
+ <Table.Main<TestType>
58
46
  role='grid'
59
47
  rowsSelectable='multi'
60
48
  keyAccessor={(row) => JSON.stringify(row)}
@@ -5,37 +5,37 @@
5
5
  import { type ColumnDef } from '@tanstack/react-table';
6
6
 
7
7
  import { type S } from '@dxos/echo-schema';
8
+ import { FieldValueType, mapSchemaToFields } from '@dxos/schema';
8
9
 
9
- import { classifySchemaProperties } from './schema';
10
10
  import { createColumnBuilder } from '../helpers';
11
11
 
12
12
  export const schemaToColumnDefs = <T>(schema: S.Schema<T, any>): ColumnDef<T, any>[] => {
13
13
  const { helper, builder } = createColumnBuilder<T>();
14
14
 
15
- const classified = classifySchemaProperties(schema);
15
+ const classified = mapSchemaToFields(schema);
16
16
  return classified.map(([name, type]) => {
17
17
  const propertyKey = name.toString();
18
18
 
19
19
  let column: Partial<ColumnDef<any, any>> | undefined;
20
20
  switch (type) {
21
- case 'string': {
21
+ case FieldValueType.String: {
22
22
  column = builder.string({ label: propertyKey });
23
23
  break;
24
24
  }
25
- case 'number': {
25
+ case FieldValueType.Number: {
26
26
  column = builder.number({ label: propertyKey });
27
27
  break;
28
28
  }
29
- case 'boolean': {
29
+ case FieldValueType.Boolean: {
30
30
  column = builder.switch({ label: propertyKey });
31
31
  break;
32
32
  }
33
- case 'date': {
33
+ case FieldValueType.Date: {
34
34
  column = builder.date({ label: propertyKey });
35
35
  break;
36
36
  }
37
- case 'display': {
38
- column = builder.display({ label: propertyKey, id: propertyKey });
37
+ case FieldValueType.JSON: {
38
+ column = builder.json({ label: propertyKey, id: propertyKey });
39
39
  break;
40
40
  }
41
41
  default: {
@@ -2,5 +2,5 @@
2
2
  // Copyright 2024 DXOS.org
3
3
  //
4
4
 
5
- export * from './schemaToColumns';
5
+ export * from './column-utils';
6
6
  export * from './types';
@@ -2,18 +2,26 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
+ import { type FieldValueType } from '@dxos/schema';
6
+
7
+ /**
8
+ * @deprecated
9
+ */
10
+ // TODO(burdon): Reconcile with @dxos/schema/View.
5
11
  export type TableDef = {
6
12
  id: string;
7
- name?: string; // TODO(burdon): Required?
8
- columns: ColumnProps[];
13
+ name?: string;
14
+ columns: ColumnDef[];
9
15
  };
10
16
 
11
- export type ColumnType = 'number' | 'boolean' | 'date' | 'string' | 'ref';
12
-
13
- export type ColumnProps = {
17
+ /**
18
+ * @deprecated
19
+ */
20
+ // TODO(burdon): Reconcile with @dxos/schema/Field.
21
+ export type ColumnDef = {
14
22
  id: string;
15
23
  prop: string;
16
- type: ColumnType;
24
+ type: FieldValueType;
17
25
  size?: number;
18
26
  label?: string;
19
27
 
@@ -10,7 +10,7 @@ export default [
10
10
  [translationKey]: {
11
11
  'no selection label': ' ',
12
12
  'number column type label': 'Number',
13
- 'boolean column type label': 'Toggle',
13
+ 'boolean column type label': 'Boolean',
14
14
  'date column type label': 'Date',
15
15
  'string column type label': 'Text',
16
16
  'ref column type label': 'Reference',
@@ -1,12 +0,0 @@
1
- import React from 'react';
2
- import { type TableDef, type ColumnProps } from '../../schema';
3
- export type ColumnSettingsFormProps = {
4
- column: ColumnProps;
5
- tableDef: TableDef;
6
- tablesToReference: TableDef[];
7
- onUpdate?: ((id: string, column: ColumnProps) => void) | undefined;
8
- onDelete?: ((id: string) => void) | undefined;
9
- onClose?: () => void;
10
- };
11
- export declare const ColumnSettingsForm: ({ column, tableDef, tablesToReference, onUpdate, onDelete, onClose, }: ColumnSettingsFormProps) => React.JSX.Element;
12
- //# sourceMappingURL=ColumnSettingsForm.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColumnSettingsForm.d.ts","sourceRoot":"","sources":["../../../../../src/components/ColumnMenu/ColumnSettingsForm.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,WAAW,EAAmB,MAAM,cAAc,CAAC;AAGhF,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,QAAQ,CAAC;IACnB,iBAAiB,EAAE,QAAQ,EAAE,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACnE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC9C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,kBAAkB,0EAO5B,uBAAuB,sBAkLzB,CAAC"}
@@ -1,63 +0,0 @@
1
- import '@dxos-theme';
2
- import React from 'react';
3
- import { type ColumnSettingsFormProps } from './ColumnSettingsForm';
4
- import { type TableDef } from '../../schema';
5
- declare const _default: {
6
- title: string;
7
- component: ({ column, tableDef, tablesToReference, onUpdate, onDelete, onClose, }: ColumnSettingsFormProps) => React.JSX.Element;
8
- decorators: import("@storybook/react/*").Decorator[];
9
- };
10
- export default _default;
11
- export declare const Default: {
12
- args: ColumnSettingsFormProps;
13
- };
14
- export declare const NumberColumn: {
15
- args: {
16
- column: {
17
- id: string;
18
- prop: string;
19
- type: string;
20
- label: string;
21
- digits: number;
22
- };
23
- tableDef: TableDef;
24
- tablesToReference: TableDef[];
25
- onUpdate?: ((id: string, column: import("../../schema").ColumnProps) => void) | undefined;
26
- onDelete?: ((id: string) => void) | undefined;
27
- onClose?: () => void;
28
- };
29
- };
30
- export declare const ReferenceColumn: {
31
- args: {
32
- column: {
33
- id: string;
34
- prop: string;
35
- type: string;
36
- label: string;
37
- refTable: string;
38
- refProp: string;
39
- };
40
- tableDef: TableDef;
41
- tablesToReference: TableDef[];
42
- onUpdate?: ((id: string, column: import("../../schema").ColumnProps) => void) | undefined;
43
- onDelete?: ((id: string) => void) | undefined;
44
- onClose?: () => void;
45
- };
46
- };
47
- export declare const NewColumn: {
48
- args: {
49
- column: {
50
- id: string;
51
- prop: string;
52
- type: string;
53
- label: string;
54
- };
55
- tableDef: TableDef;
56
- tablesToReference: TableDef[];
57
- onUpdate?: ((id: string, column: import("../../schema").ColumnProps) => void) | undefined;
58
- onDelete?: ((id: string) => void) | undefined;
59
- onClose?: () => void;
60
- };
61
- };
62
- export declare const Interactive: (args: ColumnSettingsFormProps) => React.JSX.Element;
63
- //# sourceMappingURL=ColumnSettingsForm.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColumnSettingsForm.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/ColumnMenu/ColumnSettingsForm.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AACrB,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAsB,KAAK,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACxF,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,cAAc,CAAC;;;;;;AAE7C,wBAIE;AAqCF,eAAO,MAAM,OAAO;;CAEnB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;CAWxB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;CAY3B,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;CAUrB,CAAC;AAQF,eAAO,MAAM,WAAW,SANA,uBAAuB,sBAMH,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"SchemaToTable.stories.d.ts","sourceRoot":"","sources":["../../../../src/schema/SchemaToTable.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAIrB,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AAS1B,wBAWE;AAuBF,eAAO,MAAM,WAAW;;CAmBvB,CAAC"}
@@ -1,5 +0,0 @@
1
- import { type S } from '@dxos/echo-schema';
2
- import { type ColumnType } from './types';
3
- export type ClassifiedColumnType = ColumnType | 'display';
4
- export declare const classifySchemaProperties: (schema: S.Schema<any, any>) => [string, ClassifiedColumnType][];
5
- //# sourceMappingURL=schema.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../../src/schema/schema.ts"],"names":[],"mappings":"AAIA,OAAO,EAAO,KAAK,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,MAAM,MAAM,oBAAoB,GAAG,UAAU,GAAG,SAAS,CAAC;AAG1D,eAAO,MAAM,wBAAwB,WAAY,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,KAAG,CAAC,MAAM,EAAE,oBAAoB,CAAC,EAwBnG,CAAC"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=schema.test.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"schema.test.d.ts","sourceRoot":"","sources":["../../../../src/schema/schema.test.ts"],"names":[],"mappings":""}
@@ -1 +0,0 @@
1
- {"version":3,"file":"schemaToColumns.d.ts","sourceRoot":"","sources":["../../../../src/schema/schemaToColumns.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,KAAK,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAK3C,eAAO,MAAM,kBAAkB,GAAI,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,KAAG,SAAS,CAAC,CAAC,EAAE,GAAG,CAAC,EAoCjF,CAAC"}
@@ -1,146 +0,0 @@
1
- //
2
- // Copyright 2024 DXOS.org
3
- //
4
-
5
- import { Schema as S } from '@effect/schema';
6
- import { describe, expect, test } from 'vitest';
7
-
8
- import { classifySchemaProperties } from './schema';
9
-
10
- describe('schema->column-type', () => {
11
- test('basic', () => {
12
- const simpleSchema = S.Struct({
13
- field1: S.String,
14
- field2: S.Number,
15
- });
16
-
17
- const columns = classifySchemaProperties(simpleSchema);
18
-
19
- expect(columns).to.deep.equal([
20
- ['field1', 'string'],
21
- ['field2', 'number'],
22
- ]);
23
- });
24
-
25
- test('optional properties', () => {
26
- const simpleSchema = S.Struct({
27
- field1: S.optional(S.String),
28
- field2: S.optional(S.Number),
29
- });
30
-
31
- const columns = classifySchemaProperties(simpleSchema);
32
-
33
- expect(columns).to.deep.equal([
34
- ['field1', 'string'],
35
- ['field2', 'number'],
36
- ]);
37
- });
38
-
39
- test('dates', () => {
40
- const simpleSchema = S.Struct({
41
- field1: S.Date,
42
- field2: S.optional(S.Date),
43
- });
44
-
45
- const columns = classifySchemaProperties(simpleSchema);
46
-
47
- expect(columns).to.deep.equal([
48
- ['field1', 'date'],
49
- ['field2', 'date'],
50
- ]);
51
- });
52
-
53
- test('Piped validators', () => {
54
- const simpleSchema = S.Struct({
55
- name: S.optional(S.String.pipe(S.nonEmpty(), S.maxLength(10))),
56
- age: S.Number.pipe(S.negative()),
57
- });
58
-
59
- const columns = classifySchemaProperties(simpleSchema);
60
-
61
- expect(columns).to.deep.equal([
62
- ['name', 'string'],
63
- ['age', 'number'],
64
- ]);
65
- });
66
-
67
- test('nested schema', () => {
68
- const simpleSchema = S.Struct({
69
- name: S.String,
70
- nested: S.Struct({
71
- age: S.Number,
72
- }),
73
- someUnion: S.Union(S.String, S.Number),
74
- });
75
-
76
- const columns = classifySchemaProperties(simpleSchema);
77
-
78
- expect(columns).to.deep.equal([
79
- ['name', 'string'],
80
- ['nested.age', 'number'],
81
- ['someUnion', 'display'],
82
- ]);
83
- });
84
-
85
- test('deeply nested schema', () => {
86
- const simpleSchema = S.Struct({
87
- name: S.String,
88
- nested: S.Struct({
89
- age: S.Number,
90
- deeplyNested: S.Struct({
91
- height: S.Number,
92
- }),
93
- }),
94
- });
95
-
96
- const columns = classifySchemaProperties(simpleSchema);
97
-
98
- expect(columns).to.deep.equal([
99
- ['name', 'string'],
100
- ['nested.age', 'number'],
101
- ['nested.deeplyNested.height', 'number'],
102
- ]);
103
- });
104
-
105
- test('even more deeply nested schema with optionals', () => {
106
- const simpleSchema = S.Struct({
107
- name: S.String,
108
- nested: S.Struct({
109
- age: S.Number,
110
- deeplyNested: S.optional(
111
- S.Struct({
112
- height: S.optional(S.Number),
113
- }),
114
- ),
115
- }),
116
- });
117
-
118
- const columns = classifySchemaProperties(simpleSchema);
119
-
120
- expect(columns).to.deep.equal([
121
- ['name', 'string'],
122
- ['nested.age', 'number'],
123
- ['nested.deeplyNested.height', 'number'],
124
- ]);
125
- });
126
-
127
- test('multiple-nested schemata as sibblings', () => {
128
- const simpleSchema = S.Struct({
129
- name: S.String,
130
- nested: S.Struct({
131
- age: S.Number,
132
- }),
133
- nested2: S.Struct({
134
- height: S.Number,
135
- }),
136
- });
137
-
138
- const columns = classifySchemaProperties(simpleSchema);
139
-
140
- expect(columns).to.deep.equal([
141
- ['name', 'string'],
142
- ['nested.age', 'number'],
143
- ['nested2.height', 'number'],
144
- ]);
145
- });
146
- });
@@ -1,92 +0,0 @@
1
- //
2
- // Copyright 2024 DXOS.org
3
- //
4
-
5
- import { AST, type S } from '@dxos/echo-schema';
6
-
7
- import { type ColumnType } from './types';
8
-
9
- // TODO(burdon): Reconcile with react-ui-table.
10
- export type ClassifiedColumnType = ColumnType | 'display';
11
-
12
- // TODO(burdon): Rename getX? and return typed array?
13
- export const classifySchemaProperties = (schema: S.Schema<any, any>): [string, ClassifiedColumnType][] => {
14
- const recurse = (node: AST.AST, path: string[], acc: [string, ClassifiedColumnType][]) => {
15
- const properties = AST.getPropertySignatures(node);
16
- properties.forEach((prop) => {
17
- const propName = prop.name.toString();
18
-
19
- if (prop.isOptional) {
20
- const unwrappedAst = unwrapOptionProperty(prop);
21
- if (isStruct(unwrappedAst)) {
22
- return recurse(unwrappedAst, [...path, propName], acc);
23
- }
24
- }
25
-
26
- if (isStruct(prop.type)) {
27
- recurse(prop.type, [...path, propName], acc);
28
- } else {
29
- acc.push([path.concat(propName).join('.'), propertyToColumn(prop)]);
30
- }
31
- });
32
-
33
- return acc;
34
- };
35
-
36
- return recurse(schema.ast, [], []);
37
- };
38
-
39
- const isStruct = (node: AST.AST) => AST.isTypeLiteral(node);
40
-
41
- const isOptionalUnion = (prop: AST.PropertySignature) => AST.isUnion(prop.type) && prop.isOptional;
42
-
43
- const unwrapOptionProperty = (prop: AST.PropertySignature) => {
44
- if (!isOptionalUnion(prop)) {
45
- throw new Error(`Not an optional property: ${String(prop.name)}`);
46
- }
47
-
48
- if (!AST.isUnion(prop.type)) {
49
- throw new Error(`Not a union type: ${String(prop.name)}`);
50
- }
51
-
52
- const [type, _undefinedCase] = prop.type.types;
53
- return type;
54
- };
55
-
56
- const typeToColumn = (type: AST.AST): ClassifiedColumnType => {
57
- if (AST.isStringKeyword(type)) {
58
- return 'string';
59
- } else if (AST.isNumberKeyword(type)) {
60
- return 'number';
61
- } else if (AST.isBooleanKeyword(type)) {
62
- return 'boolean';
63
- }
64
-
65
- if (AST.isRefinement(type)) {
66
- return typeToColumn(type.from);
67
- }
68
-
69
- // TODO(zan): How should we be thinking about transformations?
70
- // - Which of these are we storing in the database?
71
- // - For types that aren't the 'DateFromString' transformation, should we be using the 'from' or 'to' type?
72
-
73
- if (AST.isTransformation(type)) {
74
- const identifier = AST.getIdentifierAnnotation(type);
75
- if (identifier._tag === 'Some') {
76
- if (identifier.value === 'DateFromString') {
77
- return 'date';
78
- }
79
- }
80
- }
81
-
82
- return 'display';
83
- };
84
-
85
- const propertyToColumn = (prop: AST.PropertySignature): ClassifiedColumnType => {
86
- let type = prop.type;
87
- if (prop.isOptional) {
88
- type = unwrapOptionProperty(prop);
89
- }
90
-
91
- return typeToColumn(type);
92
- };