@dxos/react-ui-table 0.8.4-main.3c1ae3b → 0.8.4-main.3fbcb4aa9b

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 (151) hide show
  1. package/dist/lib/browser/{chunk-CJQ6T4LL.mjs → chunk-FBURZBPH.mjs} +19 -26
  2. package/dist/lib/browser/chunk-FBURZBPH.mjs.map +7 -0
  3. package/dist/lib/browser/chunk-J5LGTIGS.mjs +10 -0
  4. package/dist/lib/browser/chunk-J5LGTIGS.mjs.map +7 -0
  5. package/dist/lib/browser/{chunk-V7A7ZA5E.mjs → chunk-YGC7LZJN.mjs} +611 -699
  6. package/dist/lib/browser/chunk-YGC7LZJN.mjs.map +7 -0
  7. package/dist/lib/browser/index.mjs +1105 -1032
  8. package/dist/lib/browser/index.mjs.map +4 -4
  9. package/dist/lib/browser/meta.json +1 -1
  10. package/dist/lib/browser/testing/index.mjs +23 -18
  11. package/dist/lib/browser/testing/index.mjs.map +3 -3
  12. package/dist/lib/browser/translations.mjs +36 -0
  13. package/dist/lib/browser/translations.mjs.map +7 -0
  14. package/dist/lib/browser/types/index.mjs +2 -1
  15. package/dist/lib/node-esm/{chunk-T6PXZQ6W.mjs → chunk-DKKMSVKP.mjs} +19 -26
  16. package/dist/lib/node-esm/chunk-DKKMSVKP.mjs.map +7 -0
  17. package/dist/lib/node-esm/{chunk-P73ALX3N.mjs → chunk-GKIWDEZ7.mjs} +611 -698
  18. package/dist/lib/node-esm/chunk-GKIWDEZ7.mjs.map +7 -0
  19. package/dist/lib/node-esm/chunk-HSLMI22Q.mjs +11 -0
  20. package/dist/lib/node-esm/chunk-HSLMI22Q.mjs.map +7 -0
  21. package/dist/lib/node-esm/index.mjs +1105 -1032
  22. package/dist/lib/node-esm/index.mjs.map +4 -4
  23. package/dist/lib/node-esm/meta.json +1 -1
  24. package/dist/lib/node-esm/testing/index.mjs +23 -18
  25. package/dist/lib/node-esm/testing/index.mjs.map +3 -3
  26. package/dist/lib/node-esm/translations.mjs +37 -0
  27. package/dist/lib/node-esm/translations.mjs.map +7 -0
  28. package/dist/lib/node-esm/types/index.mjs +2 -1
  29. package/dist/types/src/components/Table/ColumnActionsMenu.d.ts.map +1 -1
  30. package/dist/types/src/components/Table/ColumnSettings.d.ts.map +1 -1
  31. package/dist/types/src/components/Table/DynamicTable.d.ts +5 -4
  32. package/dist/types/src/components/Table/DynamicTable.d.ts.map +1 -1
  33. package/dist/types/src/components/Table/DynamicTable.stories.d.ts +21 -23
  34. package/dist/types/src/components/Table/DynamicTable.stories.d.ts.map +1 -1
  35. package/dist/types/src/components/Table/Relations.stories.d.ts +84 -84
  36. package/dist/types/src/components/Table/Relations.stories.d.ts.map +1 -1
  37. package/dist/types/src/components/Table/RowActionsMenu.d.ts.map +1 -1
  38. package/dist/types/src/components/Table/Table.d.ts +20 -21
  39. package/dist/types/src/components/Table/Table.d.ts.map +1 -1
  40. package/dist/types/src/components/Table/Table.stories.d.ts +86 -86
  41. package/dist/types/src/components/Table/Table.stories.d.ts.map +1 -1
  42. package/dist/types/src/components/Table/TableContent.d.ts +17 -0
  43. package/dist/types/src/components/Table/TableContent.d.ts.map +1 -0
  44. package/dist/types/src/components/Table/TableToolbar.d.ts +21 -0
  45. package/dist/types/src/components/Table/TableToolbar.d.ts.map +1 -0
  46. package/dist/types/src/components/TableCellEditor/CellValidationMessage.d.ts.map +1 -1
  47. package/dist/types/src/components/TableCellEditor/FormCellEditor.d.ts +3 -4
  48. package/dist/types/src/components/TableCellEditor/FormCellEditor.d.ts.map +1 -1
  49. package/dist/types/src/components/TableCellEditor/TableCellEditor.d.ts +2 -2
  50. package/dist/types/src/components/TableCellEditor/TableCellEditor.d.ts.map +1 -1
  51. package/dist/types/src/components/TableCellEditor/TableCellEditor.stories.d.ts +23 -25
  52. package/dist/types/src/components/TableCellEditor/TableCellEditor.stories.d.ts.map +1 -1
  53. package/dist/types/src/components/index.d.ts +0 -1
  54. package/dist/types/src/components/index.d.ts.map +1 -1
  55. package/dist/types/src/components/testing.d.ts +22 -13
  56. package/dist/types/src/components/testing.d.ts.map +1 -1
  57. package/dist/types/src/hooks/useAddRow.d.ts +5 -6
  58. package/dist/types/src/hooks/useAddRow.d.ts.map +1 -1
  59. package/dist/types/src/hooks/useProjectionModel.d.ts +2 -1
  60. package/dist/types/src/hooks/useProjectionModel.d.ts.map +1 -1
  61. package/dist/types/src/hooks/useTableModel.d.ts +6 -5
  62. package/dist/types/src/hooks/useTableModel.d.ts.map +1 -1
  63. package/dist/types/src/index.d.ts +0 -2
  64. package/dist/types/src/index.d.ts.map +1 -1
  65. package/dist/types/src/model/modal-controller.d.ts +5 -1
  66. package/dist/types/src/model/modal-controller.d.ts.map +1 -1
  67. package/dist/types/src/model/selection-model.d.ts +18 -9
  68. package/dist/types/src/model/selection-model.d.ts.map +1 -1
  69. package/dist/types/src/model/table-model.d.ts +100 -18
  70. package/dist/types/src/model/table-model.d.ts.map +1 -1
  71. package/dist/types/src/model/table-presentation.d.ts +3 -1
  72. package/dist/types/src/model/table-presentation.d.ts.map +1 -1
  73. package/dist/types/src/playwright/TableManager.d.ts +2 -1
  74. package/dist/types/src/playwright/TableManager.d.ts.map +1 -1
  75. package/dist/types/src/playwright/playwright.config.d.ts.map +1 -1
  76. package/dist/types/src/testing/useTestTableModel.d.ts +4 -5
  77. package/dist/types/src/testing/useTestTableModel.d.ts.map +1 -1
  78. package/dist/types/src/translations.d.ts +21 -23
  79. package/dist/types/src/translations.d.ts.map +1 -1
  80. package/dist/types/src/types/Table.d.ts +13 -15
  81. package/dist/types/src/types/Table.d.ts.map +1 -1
  82. package/dist/types/src/util/dynamic-table.d.ts +11 -8
  83. package/dist/types/src/util/dynamic-table.d.ts.map +1 -1
  84. package/dist/types/src/util/dynamic-table.test.d.ts +2 -0
  85. package/dist/types/src/util/dynamic-table.test.d.ts.map +1 -0
  86. package/dist/types/src/util/index.d.ts +2 -0
  87. package/dist/types/src/util/index.d.ts.map +1 -1
  88. package/dist/types/src/util/query-ast.d.ts +7 -0
  89. package/dist/types/src/util/query-ast.d.ts.map +1 -0
  90. package/dist/types/src/util/schema.d.ts.map +1 -1
  91. package/dist/types/src/util/signals.d.ts.map +1 -1
  92. package/dist/types/src/util/sort.d.ts +12 -0
  93. package/dist/types/src/util/sort.d.ts.map +1 -0
  94. package/dist/types/src/util/table-buttons.d.ts +20 -20
  95. package/dist/types/src/util/table-buttons.d.ts.map +1 -1
  96. package/dist/types/src/util/table-controls.d.ts +4 -4
  97. package/dist/types/src/util/table-controls.d.ts.map +1 -1
  98. package/dist/types/src/util/tag.d.ts.map +1 -1
  99. package/dist/types/tsconfig.tsbuildinfo +1 -1
  100. package/package.json +66 -76
  101. package/src/components/Table/ColumnActionsMenu.tsx +13 -11
  102. package/src/components/Table/ColumnSettings.tsx +7 -7
  103. package/src/components/Table/DynamicTable.stories.tsx +24 -22
  104. package/src/components/Table/DynamicTable.tsx +28 -36
  105. package/src/components/Table/Relations.stories.tsx +95 -47
  106. package/src/components/Table/RowActionsMenu.tsx +6 -4
  107. package/src/components/Table/Table.stories.tsx +87 -64
  108. package/src/components/Table/Table.tsx +42 -419
  109. package/src/components/Table/TableContent.tsx +421 -0
  110. package/src/components/{TableToolbar → Table}/TableToolbar.tsx +44 -45
  111. package/src/components/TableCellEditor/CellValidationMessage.tsx +4 -5
  112. package/src/components/TableCellEditor/FormCellEditor.tsx +61 -70
  113. package/src/components/TableCellEditor/TableCellEditor.stories.tsx +14 -13
  114. package/src/components/TableCellEditor/TableCellEditor.tsx +14 -12
  115. package/src/components/index.ts +0 -1
  116. package/src/components/testing.ts +42 -16
  117. package/src/hooks/useAddRow.ts +8 -10
  118. package/src/hooks/useProjectionModel.ts +29 -9
  119. package/src/hooks/useTableModel.ts +27 -23
  120. package/src/index.ts +0 -4
  121. package/src/model/modal-controller.ts +23 -12
  122. package/src/model/selection-model.ts +75 -44
  123. package/src/model/table-model.test.ts +81 -54
  124. package/src/model/table-model.ts +411 -139
  125. package/src/model/table-presentation.test.ts +58 -49
  126. package/src/model/table-presentation.ts +34 -29
  127. package/src/playwright/TableManager.ts +10 -3
  128. package/src/playwright/playwright.config.ts +1 -1
  129. package/src/playwright/smoke.spec.ts +51 -7
  130. package/src/testing/useTestTableModel.ts +25 -22
  131. package/src/translations.ts +20 -22
  132. package/src/types/Table.ts +19 -30
  133. package/src/util/dynamic-table.test.ts +70 -0
  134. package/src/util/dynamic-table.ts +36 -17
  135. package/src/util/index.ts +2 -0
  136. package/src/util/query-ast.ts +22 -0
  137. package/src/util/sort.ts +90 -0
  138. package/src/util/table-buttons.ts +1 -1
  139. package/src/util/table-controls.ts +2 -2
  140. package/dist/lib/browser/chunk-CJQ6T4LL.mjs.map +0 -7
  141. package/dist/lib/browser/chunk-V7A7ZA5E.mjs.map +0 -7
  142. package/dist/lib/node-esm/chunk-P73ALX3N.mjs.map +0 -7
  143. package/dist/lib/node-esm/chunk-T6PXZQ6W.mjs.map +0 -7
  144. package/dist/types/src/components/TableToolbar/TableToolbar.d.ts +0 -21
  145. package/dist/types/src/components/TableToolbar/TableToolbar.d.ts.map +0 -1
  146. package/dist/types/src/components/TableToolbar/index.d.ts +0 -2
  147. package/dist/types/src/components/TableToolbar/index.d.ts.map +0 -1
  148. package/dist/types/src/model/table-sorting.d.ts +0 -56
  149. package/dist/types/src/model/table-sorting.d.ts.map +0 -1
  150. package/src/components/TableToolbar/index.ts +0 -5
  151. package/src/model/table-sorting.ts +0 -234
@@ -4,33 +4,31 @@
4
4
 
5
5
  import { type Resource } from '@dxos/react-ui';
6
6
 
7
- export const translationKey = 'react-ui-table';
7
+ export const translationKey = '@dxos/react-ui-table';
8
8
 
9
9
  export const translations = [
10
10
  {
11
11
  'en-US': {
12
12
  [translationKey]: {
13
- 'object placeholder': 'New table',
14
- 'create object label': 'Create table',
15
- 'table name placeholder': 'Table name',
16
- 'settings title': 'Table settings',
17
- 'table schema label': 'Type',
18
- 'new schema': 'New type',
19
- 'continue label': 'Continue',
20
- 'create stack section label': 'Create table',
21
- 'add row label': 'Add row',
22
- 'create comment': 'Create thread',
23
- 'column action sort descending': 'Sort Descending',
24
- 'column action sort ascending': 'Sort Ascending',
25
- 'column action clear sorting': 'Clear Sorting',
26
- 'column action settings': 'Column Settings',
27
- 'column action delete': 'Delete Column',
28
- 'delete row label': 'Delete row',
29
- 'bulk delete row label': 'Delete selected rows',
30
- 'column deleted label': 'Column deleted',
31
- 'new column button label': 'Create column',
32
- 'create new object label': 'Create new object “{{text}}”',
33
- 'save view label': 'Save changes to view',
13
+ 'object.placeholder': 'New table',
14
+ 'create-object.label': 'Create table',
15
+ 'table-name.placeholder': 'Table name',
16
+ 'settings.title': 'Table settings',
17
+ 'table-schema.label': 'Type',
18
+ 'continue.label': 'Continue',
19
+ 'create-stack-section.label': 'Create table',
20
+ 'add-row.label': 'Add row',
21
+ 'column-action-sort-descending.menu': 'Sort Descending',
22
+ 'column-action-sort-ascending.menu': 'Sort Ascending',
23
+ 'column-action-clear-sorting.menu': 'Clear Sorting',
24
+ 'column-action-settings.menu': 'Column Settings',
25
+ 'column-action-delete.menu': 'Delete Column',
26
+ 'delete-row.label': 'Delete row',
27
+ 'bulk-delete-row.label': 'Delete selected rows',
28
+ 'column-deleted.label': 'Column deleted',
29
+ 'new-column-button.label': 'Create column',
30
+ 'create-new-object.label': 'Create new object “{{text}}”',
31
+ 'save-view.label': 'Save changes to view',
34
32
  },
35
33
  },
36
34
  },
@@ -6,14 +6,15 @@ import * as Match from 'effect/Match';
6
6
  import * as Schema from 'effect/Schema';
7
7
  import * as SchemaAST from 'effect/SchemaAST';
8
8
 
9
- import { Obj, Ref, Type } from '@dxos/echo';
9
+ import { Annotation, JsonSchema, Obj, Ref, Type } from '@dxos/echo';
10
+ import { View } from '@dxos/echo';
10
11
  import { FormInputAnnotation, type JsonPath, type JsonSchemaType, LabelAnnotation } from '@dxos/echo/internal';
11
- import { View, ViewAnnotation } from '@dxos/schema';
12
+ import { ViewAnnotation } from '@dxos/schema';
12
13
 
13
- const TableSchema = Schema.Struct({
14
+ export const Table = Schema.Struct({
14
15
  name: Schema.String.pipe(Schema.optional),
15
16
 
16
- view: Type.Ref(View.View).pipe(FormInputAnnotation.set(false)),
17
+ view: Ref.Ref(View.View).pipe(FormInputAnnotation.set(false)),
17
18
 
18
19
  sizes: Schema.Record({
19
20
  // TODO(wittjosiah): Should be JsonPath.
@@ -21,19 +22,23 @@ const TableSchema = Schema.Struct({
21
22
  value: Schema.Number,
22
23
  }).pipe(Schema.mutable, FormInputAnnotation.set(false)),
23
24
  }).pipe(
24
- Type.Obj({
25
- typename: 'dxos.org/type/Table',
26
- version: '0.2.0',
25
+ Type.object({
26
+ typename: 'org.dxos.type.table',
27
+ version: '0.1.0',
27
28
  }),
28
29
  LabelAnnotation.set(['name']),
29
- ViewAnnotation.set(true),
30
+ ViewAnnotation.set(['view']),
31
+ Annotation.IconAnnotation.set({
32
+ icon: 'ph--table--regular',
33
+ hue: 'green',
34
+ }),
30
35
  );
31
36
 
32
- export interface Table extends Schema.Schema.Type<typeof TableSchema> {}
33
- export interface TableEncoded extends Schema.Schema.Encoded<typeof TableSchema> {}
34
- export const Table: Schema.Schema<Table, TableEncoded> = TableSchema;
37
+ export interface Table extends Schema.Schema.Type<typeof Table> {}
35
38
 
36
- type MakeProps = Omit<Partial<Obj.MakeProps<typeof Table>>, 'view'> & {
39
+ type MakeProps = {
40
+ name?: string;
41
+ sizes?: Record<string, number>;
37
42
  view: View.View;
38
43
  /** Required to auto-size columns. */
39
44
  jsonSchema?: JsonSchemaType;
@@ -43,11 +48,11 @@ type MakeProps = Omit<Partial<Obj.MakeProps<typeof Table>>, 'view'> & {
43
48
  * Make a table as a view of a data set.
44
49
  */
45
50
  export const make = ({ name, sizes = {}, view, jsonSchema }: MakeProps): Table => {
46
- const table = Obj.make(Table, { name, view: Ref.make(view), sizes });
51
+ const table = Obj.make(Table, { name, view: Ref.make(view), sizes } as Obj.MakeProps<typeof Table>);
47
52
 
48
53
  // Preset sizes.
49
54
  if (jsonSchema) {
50
- const schema = Type.toEffectSchema(jsonSchema);
55
+ const schema = JsonSchema.toEffectSchema(jsonSchema);
51
56
  const properties = SchemaAST.getPropertySignatures(schema.ast);
52
57
  for (const property of properties) {
53
58
  const name = property.name.toString() as JsonPath;
@@ -72,19 +77,3 @@ export const make = ({ name, sizes = {}, view, jsonSchema }: MakeProps): Table =
72
77
 
73
78
  return table;
74
79
  };
75
-
76
- //
77
- // V1
78
- //
79
-
80
- export const TableV1 = Schema.Struct({
81
- sizes: Schema.Record({
82
- key: Schema.String,
83
- value: Schema.Number,
84
- }).pipe(Schema.mutable),
85
- }).pipe(
86
- Type.Obj({
87
- typename: 'dxos.org/type/Table',
88
- version: '0.1.0',
89
- }),
90
- );
@@ -0,0 +1,70 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Registry } from '@effect-atom/atom-react';
6
+ import { describe, expect, test } from 'vitest';
7
+
8
+ import { Format } from '@dxos/echo';
9
+
10
+ import { type TablePropertyDefinition, getBaseSchema, makeDynamicTable } from './dynamic-table';
11
+
12
+ describe('makeDynamicTable', () => {
13
+ /**
14
+ * Base case: plain jsonSchema (not from Echo / JsonSchema.toJsonSchema). Does not exercise the path
15
+ * where projection or schema are reactive, so this does not reproduce the Obj.update regression.
16
+ * Confirms makeDynamicTable + setProperties (title) works with plain objects.
17
+ */
18
+ test('makeDynamicTable with plain jsonSchema and properties with title does not throw', () => {
19
+ const registry = Registry.make();
20
+ const jsonSchema = {
21
+ type: 'object' as const,
22
+ properties: {
23
+ id: { type: 'string' as const },
24
+ name: { type: 'string' as const },
25
+ },
26
+ required: ['id'],
27
+ };
28
+ const properties: TablePropertyDefinition[] = [
29
+ { name: 'id', format: Format.TypeFormat.String },
30
+ { name: 'name', format: Format.TypeFormat.String, title: 'Name' },
31
+ ];
32
+
33
+ expect(() => {
34
+ const { projection, object } = makeDynamicTable({
35
+ registry,
36
+ jsonSchema,
37
+ properties,
38
+ });
39
+ expect(projection).toBeDefined();
40
+ expect(object).toBeDefined();
41
+ expect(projection.getFields().length).toBeGreaterThan(0);
42
+ }).not.toThrow();
43
+ });
44
+
45
+ /**
46
+ * Regression test for the path where jsonSchema comes from getBaseSchema(typename, properties).
47
+ * That path uses Echo (ViewModel.make, JsonSchema.toJsonSchema); mutations must run inside Obj.update and on a
48
+ * cloned schema. This test ensures that flow does not throw.
49
+ */
50
+ test('makeDynamicTable with jsonSchema from getBaseSchema(typename, properties) and properties with title does not throw', () => {
51
+ const registry = Registry.make();
52
+ const typename = 'com.example.type.dynamicTableTest';
53
+ const properties: TablePropertyDefinition[] = [
54
+ { name: 'id', format: Format.TypeFormat.String },
55
+ { name: 'name', format: Format.TypeFormat.String, title: 'Name' },
56
+ ];
57
+ const { jsonSchema } = getBaseSchema({ typename, properties });
58
+
59
+ expect(() => {
60
+ const { projection, object } = makeDynamicTable({
61
+ registry,
62
+ jsonSchema,
63
+ properties,
64
+ });
65
+ expect(projection).toBeDefined();
66
+ expect(object).toBeDefined();
67
+ expect(projection.getFields().length).toBeGreaterThan(0);
68
+ }).not.toThrow();
69
+ });
70
+ });
@@ -2,12 +2,16 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
4
 
5
- import { Filter, type JsonSchema, Obj, Query, Ref, Type } from '@dxos/echo';
5
+ import { type Registry } from '@effect-atom/atom-react';
6
+ import type * as Types from 'effect/Types';
7
+
8
+ import { Filter, JsonSchema, Obj, Order, Query, type QueryAST, Ref, Type } from '@dxos/echo';
9
+ import { type View } from '@dxos/echo';
6
10
  import {
7
11
  ProjectionModel,
8
12
  type SchemaPropertyDefinition,
9
- type SortDirectionType,
10
- View,
13
+ ViewModel,
14
+ createEchoChangeCallback,
11
15
  getSchemaFromPropertyDefinitions,
12
16
  } from '@dxos/schema';
13
17
 
@@ -17,7 +21,7 @@ import { Table } from '../types';
17
21
  type PropertyDisplayProps = {
18
22
  size: number;
19
23
  title: string;
20
- sort: SortDirectionType;
24
+ sort: QueryAST.OrderDirection;
21
25
  };
22
26
 
23
27
  export type TablePropertyDefinition = SchemaPropertyDefinition & Partial<PropertyDisplayProps>;
@@ -32,16 +36,16 @@ export const getBaseSchema = ({
32
36
  properties,
33
37
  jsonSchema,
34
38
  }: {
35
- schema?: Type.Entity.Any;
39
+ schema?: Type.AnyEntity;
36
40
  typename?: string;
37
41
  properties?: TablePropertyDefinition[];
38
- jsonSchema?: JsonSchema.JsonSchema;
39
- }): { typename: string; jsonSchema: JsonSchema.JsonSchema } => {
42
+ jsonSchema?: Types.DeepMutable<JsonSchema.JsonSchema>;
43
+ }): { typename: string; jsonSchema: Types.DeepMutable<JsonSchema.JsonSchema> } => {
40
44
  if (typename && properties) {
41
45
  const schema = getSchemaFromPropertyDefinitions(typename, properties);
42
- return { typename: schema.typename, jsonSchema: schema.jsonSchema };
46
+ return { typename: schema.typename, jsonSchema: JsonSchema.toJsonSchema(schema) };
43
47
  } else if (schema) {
44
- return { typename: Type.getTypename(schema)!, jsonSchema: Type.toJsonSchema(schema) };
48
+ return { typename: Type.getTypename(schema)!, jsonSchema: JsonSchema.toJsonSchema(schema) };
45
49
  } else if (typename && jsonSchema) {
46
50
  return { typename, jsonSchema };
47
51
  } else {
@@ -50,22 +54,29 @@ export const getBaseSchema = ({
50
54
  };
51
55
 
52
56
  export const makeDynamicTable = ({
57
+ registry,
53
58
  jsonSchema,
54
59
  properties,
55
60
  }: {
56
- jsonSchema: JsonSchema.JsonSchema;
61
+ registry: Registry.Registry;
62
+ jsonSchema: Types.DeepMutable<JsonSchema.JsonSchema>;
57
63
  properties?: TablePropertyDefinition[];
58
64
  }): { projection: ProjectionModel; object: Table.Table } => {
59
- const view = View.make({
65
+ const view = ViewModel.make({
60
66
  query: Query.select(Filter.everything()),
61
67
  jsonSchema,
62
68
  ...(properties && { fields: properties.map((property) => property.name) }),
63
69
  });
64
70
  const object = Obj.make(Table.Table, { view: Ref.make(view), sizes: {} });
65
71
 
66
- const projection = new ProjectionModel(jsonSchema, view.projection);
72
+ const projection = new ProjectionModel({
73
+ registry,
74
+ view,
75
+ baseSchema: jsonSchema,
76
+ change: createEchoChangeCallback(view, jsonSchema),
77
+ });
67
78
  projection.normalizeView();
68
- if (properties && projection.fields) {
79
+ if (properties && projection.getFields()) {
69
80
  setProperties(view, projection, object, properties);
70
81
  }
71
82
 
@@ -79,10 +90,12 @@ const setProperties = (
79
90
  properties: TablePropertyDefinition[],
80
91
  ) => {
81
92
  for (const property of properties) {
82
- const field = projection.fields.find((field) => field.path === property.name);
93
+ const field = projection.getFields().find((field) => field.path === property.name);
83
94
  if (field) {
84
95
  if (property.size !== undefined) {
85
- table.sizes[field.path] = property.size;
96
+ Obj.update(table, (table) => {
97
+ table.sizes[field.path] = property.size!;
98
+ });
86
99
  }
87
100
 
88
101
  if (property.title !== undefined) {
@@ -94,8 +107,14 @@ const setProperties = (
94
107
  }
95
108
 
96
109
  if (property.sort) {
97
- const fieldId = field.id;
98
- view.sort = [{ fieldId, direction: property.sort }];
110
+ // Apply sort to query instead of deprecated view.sort
111
+ const currentQuery = Query.fromAst(Obj.getSnapshot(view).query.ast);
112
+ // Use any type parameter since we're working with dynamic field paths
113
+ const newQuery = currentQuery.orderBy(Order.property<any>(field.path as string, property.sort));
114
+ Obj.update(view, (view) => {
115
+ // Type assertion needed because Query AST types have some variance issues.
116
+ view.query.ast = newQuery.ast as typeof view.query.ast;
117
+ });
99
118
  }
100
119
  }
101
120
  }
package/src/util/index.ts CHANGED
@@ -3,7 +3,9 @@
3
3
  //
4
4
 
5
5
  export * from './dynamic-table';
6
+ export * from './query-ast';
6
7
  export * from './signals';
8
+ export * from './sort';
7
9
  export * from './table-buttons';
8
10
  export * from './table-controls';
9
11
  export * from './schema';
@@ -0,0 +1,22 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { type QueryAST } from '@dxos/echo';
6
+
7
+ /**
8
+ * Extracts order clauses from a query AST.
9
+ * Handles nested structures (options, order, etc.).
10
+ */
11
+ export const extractOrder = (queryAst: QueryAST.Query): readonly QueryAST.Order[] | undefined => {
12
+ if (queryAst.type === 'order') {
13
+ return queryAst.order;
14
+ }
15
+ if (queryAst.type === 'options') {
16
+ return extractOrder(queryAst.query);
17
+ }
18
+ if (queryAst.type === 'from') {
19
+ return extractOrder(queryAst.query);
20
+ }
21
+ return undefined;
22
+ };
@@ -0,0 +1,90 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Format, type QueryAST } from '@dxos/echo';
6
+
7
+ /**
8
+ * Gets a normalized sort value for a given value and format.
9
+ * This ensures consistent sorting behavior across different data types.
10
+ */
11
+ export const getSortValue = (value: any, format: Format.TypeFormat): any => {
12
+ // Handle null/undefined
13
+ if (value === undefined || value === null) {
14
+ return null;
15
+ }
16
+
17
+ // Handle dates chronologically if schema indicates date format
18
+ const isDateFormat = format === Format.TypeFormat.DateTime || format === Format.TypeFormat.Date;
19
+ if (isDateFormat) {
20
+ const date = new Date(value);
21
+ if (!isNaN(date.getTime())) {
22
+ return date.getTime();
23
+ }
24
+ // Fallback to string if date parsing fails
25
+ return String(value);
26
+ }
27
+
28
+ // Handle numbers if schema indicates number format
29
+ if (
30
+ format === Format.TypeFormat.Number ||
31
+ format === Format.TypeFormat.Integer ||
32
+ format === Format.TypeFormat.Currency ||
33
+ format === Format.TypeFormat.Percent ||
34
+ format === Format.TypeFormat.Duration
35
+ ) {
36
+ const num = typeof value === 'number' ? value : Number(value);
37
+ if (!isNaN(num)) {
38
+ return num;
39
+ }
40
+ // Fallback to string if number parsing fails
41
+ return String(value);
42
+ }
43
+
44
+ // Default to string comparison
45
+ if (typeof value === 'string') {
46
+ return value;
47
+ }
48
+ if (typeof value === 'number') {
49
+ return value;
50
+ }
51
+
52
+ // Fallback to string representation
53
+ return String(value);
54
+ };
55
+
56
+ /**
57
+ * Compares two values for sorting based on the field format.
58
+ * Handles dates, numbers, and strings appropriately.
59
+ */
60
+ export const compareValues = (
61
+ aValue: any,
62
+ bValue: any,
63
+ format: Format.TypeFormat,
64
+ direction: QueryAST.OrderDirection,
65
+ ): number => {
66
+ // Handle null/undefined values - nulls sort to the end
67
+ if (aValue === undefined || aValue === null) {
68
+ return bValue === undefined || bValue === null ? 0 : 1;
69
+ }
70
+ if (bValue === undefined || bValue === null) {
71
+ return -1;
72
+ }
73
+
74
+ // Get normalized sort values
75
+ const aSortValue = getSortValue(aValue, format);
76
+ const bSortValue = getSortValue(bValue, format);
77
+
78
+ // Compare based on type
79
+ let comparison = 0;
80
+ if (typeof aSortValue === 'number' && typeof bSortValue === 'number') {
81
+ comparison = aSortValue - bSortValue;
82
+ } else if (typeof aSortValue === 'string' && typeof bSortValue === 'string') {
83
+ comparison = aSortValue.localeCompare(bSortValue);
84
+ } else {
85
+ // Mixed types - convert both to strings
86
+ comparison = String(aSortValue).localeCompare(String(bSortValue));
87
+ }
88
+
89
+ return direction === 'desc' ? -comparison : comparison;
90
+ };
@@ -39,7 +39,7 @@ const createButton = ({
39
39
  .map(([k, v]) => `${k}="${v}"`)
40
40
  .join(' ');
41
41
 
42
- return `<button ${attr} data-testid="${testId}" class="dx-button is-6 aspect-square pli-0.5 min-bs-0" ${dataAttrs} ${disabled ? 'disabled' : ''} data-dx-grid-action="accessory"><svg data-size="4"><use href="/icons.svg#${icon}"/></svg></button>`;
42
+ return `<button ${attr} data-testid="${testId}" class="dx-button w-6 aspect-square px-0.5 min-h-0" ${dataAttrs} ${disabled ? 'disabled' : ''} data-dx-grid-action="accessory"><svg data-size="4"><use href="/icons.svg#${icon}"/></svg></button>`;
43
43
  };
44
44
 
45
45
  const addColumnButton = {
@@ -25,8 +25,8 @@ export const CONTROL_IDENTIFIERS = {
25
25
  } as const;
26
26
 
27
27
  const BASE_CLASSES = {
28
- checkbox: 'absolute inset-block-[.375rem] inline-end-[.375rem] dx-checkbox',
29
- switch: 'absolute inset-block-[.25rem] inline-end-[.25rem] dx-checkbox--switch',
28
+ checkbox: 'absolute inset-y-[.375rem] end-[.375rem] dx-checkbox',
29
+ switch: 'absolute inset-y-[.25rem] end-[.25rem] dx-checkbox--switch',
30
30
  } as const;
31
31
 
32
32
  const renderAttributes = (data: Record<string, string>) => {
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/types/Table.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Match from 'effect/Match';\nimport * as Schema from 'effect/Schema';\nimport * as SchemaAST from 'effect/SchemaAST';\n\nimport { Obj, Ref, Type } from '@dxos/echo';\nimport { FormInputAnnotation, type JsonPath, type JsonSchemaType, LabelAnnotation } from '@dxos/echo/internal';\nimport { View, ViewAnnotation } from '@dxos/schema';\n\nconst TableSchema = Schema.Struct({\n name: Schema.String.pipe(Schema.optional),\n\n view: Type.Ref(View.View).pipe(FormInputAnnotation.set(false)),\n\n sizes: Schema.Record({\n // TODO(wittjosiah): Should be JsonPath.\n key: Schema.String,\n value: Schema.Number,\n }).pipe(Schema.mutable, FormInputAnnotation.set(false)),\n}).pipe(\n Type.Obj({\n typename: 'dxos.org/type/Table',\n version: '0.2.0',\n }),\n LabelAnnotation.set(['name']),\n ViewAnnotation.set(true),\n);\n\nexport interface Table extends Schema.Schema.Type<typeof TableSchema> {}\nexport interface TableEncoded extends Schema.Schema.Encoded<typeof TableSchema> {}\nexport const Table: Schema.Schema<Table, TableEncoded> = TableSchema;\n\ntype MakeProps = Omit<Partial<Obj.MakeProps<typeof Table>>, 'view'> & {\n view: View.View;\n /** Required to auto-size columns. */\n jsonSchema?: JsonSchemaType;\n};\n\n/**\n * Make a table as a view of a data set.\n */\nexport const make = ({ name, sizes = {}, view, jsonSchema }: MakeProps): Table => {\n const table = Obj.make(Table, { name, view: Ref.make(view), sizes });\n\n // Preset sizes.\n if (jsonSchema) {\n const schema = Type.toEffectSchema(jsonSchema);\n const properties = SchemaAST.getPropertySignatures(schema.ast);\n for (const property of properties) {\n const name = property.name.toString() as JsonPath;\n if (sizes?.[name]) {\n table.sizes[name] = sizes[name];\n continue;\n }\n\n Match.type<SchemaAST.AST>().pipe(\n Match.when({ _tag: 'BooleanKeyword' }, () => {\n table.sizes[name] = 100;\n }),\n Match.when({ _tag: 'NumberKeyword' }, () => {\n table.sizes[name] = 100;\n }),\n Match.orElse(() => {\n // Noop.\n }),\n )(property.type);\n }\n }\n\n return table;\n};\n\n//\n// V1\n//\n\nexport const TableV1 = Schema.Struct({\n sizes: Schema.Record({\n key: Schema.String,\n value: Schema.Number,\n }).pipe(Schema.mutable),\n}).pipe(\n Type.Obj({\n typename: 'dxos.org/type/Table',\n version: '0.1.0',\n }),\n);\n"],
5
- "mappings": ";;;;;;;AAAA;;;;;;AAIA,YAAYA,WAAW;AACvB,YAAYC,YAAY;AACxB,YAAYC,eAAe;AAE3B,SAASC,KAAKC,KAAKC,YAAY;AAC/B,SAASC,qBAAyDC,uBAAuB;AACzF,SAASC,MAAMC,sBAAsB;AAErC,IAAMC,cAAqBC,cAAO;EAChCC,MAAaC,cAAOC,KAAYC,eAAQ;EAExCC,MAAMC,KAAKC,IAAIC,KAAKA,IAAI,EAAEL,KAAKM,oBAAoBC,IAAI,KAAA,CAAA;EAEvDC,OAAcC,cAAO;;IAEnBC,KAAYX;IACZY,OAAcC;EAChB,CAAA,EAAGZ,KAAYa,gBAASP,oBAAoBC,IAAI,KAAA,CAAA;AAClD,CAAA,EAAGP,KACDG,KAAKW,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,GACAC,gBAAgBV,IAAI;EAAC;CAAO,GAC5BW,eAAeX,IAAI,IAAA,CAAA;AAKd,IAAMY,QAA4CvB;AAWlD,IAAMwB,OAAO,CAAC,EAAEtB,MAAMU,QAAQ,CAAC,GAAGN,MAAMmB,WAAU,MAAa;AACpE,QAAMC,QAAQR,IAAIM,KAAKD,OAAO;IAAErB;IAAMI,MAAME,IAAIgB,KAAKlB,IAAAA;IAAOM;EAAM,CAAA;AAGlE,MAAIa,YAAY;AACd,UAAME,SAASpB,KAAKqB,eAAeH,UAAAA;AACnC,UAAMI,aAAuBC,gCAAsBH,OAAOI,GAAG;AAC7D,eAAWC,YAAYH,YAAY;AACjC,YAAM3B,QAAO8B,SAAS9B,KAAK+B,SAAQ;AACnC,UAAIrB,QAAQV,KAAAA,GAAO;AACjBwB,cAAMd,MAAMV,KAAAA,IAAQU,MAAMV,KAAAA;AAC1B;MACF;AAEAgC,MAAMC,WAAI,EAAkB/B,KACpBgC,WAAK;QAAEC,MAAM;MAAiB,GAAG,MAAA;AACrCX,cAAMd,MAAMV,KAAAA,IAAQ;MACtB,CAAA,GACMkC,WAAK;QAAEC,MAAM;MAAgB,GAAG,MAAA;AACpCX,cAAMd,MAAMV,KAAAA,IAAQ;MACtB,CAAA,GACMoC,aAAO,MAAA;MAEb,CAAA,CAAA,EACAN,SAASG,IAAI;IACjB;EACF;AAEA,SAAOT;AACT;AAMO,IAAMa,UAAiBtC,cAAO;EACnCW,OAAcC,cAAO;IACnBC,KAAYX;IACZY,OAAcC;EAChB,CAAA,EAAGZ,KAAYa,cAAO;AACxB,CAAA,EAAGb,KACDG,KAAKW,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,CAAA;",
6
- "names": ["Match", "Schema", "SchemaAST", "Obj", "Ref", "Type", "FormInputAnnotation", "LabelAnnotation", "View", "ViewAnnotation", "TableSchema", "Struct", "name", "String", "pipe", "optional", "view", "Type", "Ref", "View", "FormInputAnnotation", "set", "sizes", "Record", "key", "value", "Number", "mutable", "Obj", "typename", "version", "LabelAnnotation", "ViewAnnotation", "Table", "make", "jsonSchema", "table", "schema", "toEffectSchema", "properties", "getPropertySignatures", "ast", "property", "toString", "Match", "type", "when", "_tag", "orElse", "TableV1"]
7
- }