@dxos/react-ui-table 0.8.2-main.2f9c567 → 0.8.2-main.36232bc
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/browser/chunk-YWNRUF4J.mjs +26 -0
- package/dist/lib/browser/chunk-YWNRUF4J.mjs.map +7 -0
- package/dist/lib/browser/index.mjs +107 -40
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/browser/types/index.mjs +1 -1
- package/dist/lib/node/{chunk-2QLLIPZK.cjs → chunk-TGG6OZ54.cjs} +11 -13
- package/dist/lib/node/chunk-TGG6OZ54.cjs.map +7 -0
- package/dist/lib/node/index.cjs +173 -108
- package/dist/lib/node/index.cjs.map +4 -4
- package/dist/lib/node/meta.json +1 -1
- package/dist/lib/node/types/index.cjs +3 -3
- package/dist/lib/node/types/index.cjs.map +1 -1
- package/dist/lib/node-esm/{chunk-N2RRVR7F.mjs → chunk-KKLP54L3.mjs} +9 -11
- package/dist/lib/node-esm/chunk-KKLP54L3.mjs.map +7 -0
- package/dist/lib/node-esm/index.mjs +107 -40
- package/dist/lib/node-esm/index.mjs.map +4 -4
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/lib/node-esm/types/index.mjs +1 -1
- package/dist/types/src/components/Table/CreateRefPanel.d.ts.map +1 -1
- package/dist/types/src/components/Table/RefPanel.d.ts +9 -0
- package/dist/types/src/components/Table/RefPanel.d.ts.map +1 -0
- package/dist/types/src/components/Table/Table.d.ts.map +1 -1
- package/dist/types/src/components/Table/Table.stories.d.ts.map +1 -1
- package/dist/types/src/components/Table/relations.stories.d.ts.map +1 -1
- package/dist/types/src/components/testing.d.ts +39 -39
- package/dist/types/src/components/testing.d.ts.map +1 -1
- package/dist/types/src/model/table-presentation.d.ts.map +1 -1
- package/dist/types/src/types/table.d.ts +43 -43
- package/dist/types/src/types/table.d.ts.map +1 -1
- package/dist/types/src/util/table-buttons.d.ts +14 -0
- package/dist/types/src/util/table-buttons.d.ts.map +1 -1
- package/dist/types/src/util/table.d.ts +2 -2
- package/dist/types/src/util/table.d.ts.map +1 -1
- package/package.json +33 -35
- package/src/components/Table/CreateRefPanel.tsx +3 -3
- package/src/components/Table/RefPanel.tsx +52 -0
- package/src/components/Table/Table.stories.tsx +2 -1
- package/src/components/Table/Table.tsx +6 -0
- package/src/components/Table/relations.stories.tsx +9 -10
- package/src/components/testing.ts +6 -7
- package/src/model/table-model.test.ts +3 -4
- package/src/model/table-presentation.test.ts +3 -4
- package/src/model/table-presentation.ts +5 -3
- package/src/types/table.ts +8 -16
- package/src/util/table-buttons.ts +23 -0
- package/src/util/table.ts +7 -7
- package/dist/lib/browser/chunk-UGGYKLOH.mjs +0 -28
- package/dist/lib/browser/chunk-UGGYKLOH.mjs.map +0 -7
- package/dist/lib/node/chunk-2QLLIPZK.cjs.map +0 -7
- package/dist/lib/node-esm/chunk-N2RRVR7F.mjs.map +0 -7
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/react-ui-table",
|
|
3
|
-
"version": "0.8.2-main.
|
|
3
|
+
"version": "0.8.2-main.36232bc",
|
|
4
4
|
"description": "A table component.",
|
|
5
5
|
"homepage": "https://dxos.org",
|
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
|
@@ -51,33 +51,31 @@
|
|
|
51
51
|
"@radix-ui/react-slot": "1.1.2",
|
|
52
52
|
"@radix-ui/react-use-controllable-state": "1.1.0",
|
|
53
53
|
"date-fns": "^3.3.1",
|
|
54
|
-
"effect": "3.14.21",
|
|
55
54
|
"lodash.orderby": "^4.6.0",
|
|
56
|
-
"@dxos/
|
|
57
|
-
"@dxos/echo-schema": "0.8.2-main.
|
|
58
|
-
"@dxos/
|
|
59
|
-
"@dxos/
|
|
60
|
-
"@dxos/
|
|
61
|
-
"@dxos/
|
|
62
|
-
"@dxos/
|
|
63
|
-
"@dxos/keys": "0.8.2-main.
|
|
64
|
-
"@dxos/
|
|
65
|
-
"@dxos/
|
|
66
|
-
"@dxos/plugin-
|
|
67
|
-
"@dxos/
|
|
68
|
-
"@dxos/react-client": "0.8.2-main.
|
|
69
|
-
"@dxos/react-ui-
|
|
70
|
-
"@dxos/react-ui-
|
|
71
|
-
"@dxos/react-ui-
|
|
72
|
-
"@dxos/react-ui-
|
|
73
|
-
"@dxos/react-ui-
|
|
74
|
-
"@dxos/react-ui-
|
|
75
|
-
"@dxos/react-ui-
|
|
76
|
-
"@dxos/react-ui-
|
|
77
|
-
"@dxos/
|
|
78
|
-
"@dxos/
|
|
79
|
-
"@dxos/
|
|
80
|
-
"@dxos/util": "0.8.2-main.2f9c567"
|
|
55
|
+
"@dxos/context": "0.8.2-main.36232bc",
|
|
56
|
+
"@dxos/echo-schema": "0.8.2-main.36232bc",
|
|
57
|
+
"@dxos/invariant": "0.8.2-main.36232bc",
|
|
58
|
+
"@dxos/effect": "0.8.2-main.36232bc",
|
|
59
|
+
"@dxos/lit-grid": "0.8.2-main.36232bc",
|
|
60
|
+
"@dxos/debug": "0.8.2-main.36232bc",
|
|
61
|
+
"@dxos/live-object": "0.8.2-main.36232bc",
|
|
62
|
+
"@dxos/keys": "0.8.2-main.36232bc",
|
|
63
|
+
"@dxos/log": "0.8.2-main.36232bc",
|
|
64
|
+
"@dxos/plugin-search": "0.8.2-main.36232bc",
|
|
65
|
+
"@dxos/plugin-space": "0.8.2-main.36232bc",
|
|
66
|
+
"@dxos/react-ui-attention": "0.8.2-main.36232bc",
|
|
67
|
+
"@dxos/react-client": "0.8.2-main.36232bc",
|
|
68
|
+
"@dxos/react-ui-editor": "0.8.2-main.36232bc",
|
|
69
|
+
"@dxos/react-ui-form": "0.8.2-main.36232bc",
|
|
70
|
+
"@dxos/react-ui-grid": "0.8.2-main.36232bc",
|
|
71
|
+
"@dxos/react-ui-searchlist": "0.8.2-main.36232bc",
|
|
72
|
+
"@dxos/react-ui-stack": "0.8.2-main.36232bc",
|
|
73
|
+
"@dxos/react-ui-menu": "0.8.2-main.36232bc",
|
|
74
|
+
"@dxos/react-ui-syntax-highlighter": "0.8.2-main.36232bc",
|
|
75
|
+
"@dxos/react-ui-types": "0.8.2-main.36232bc",
|
|
76
|
+
"@dxos/schema": "0.8.2-main.36232bc",
|
|
77
|
+
"@dxos/util": "0.8.2-main.36232bc",
|
|
78
|
+
"@dxos/react-ui-tag-picker": "0.8.2-main.36232bc"
|
|
81
79
|
},
|
|
82
80
|
"devDependencies": {
|
|
83
81
|
"@phosphor-icons/react": "^2.1.5",
|
|
@@ -88,19 +86,19 @@
|
|
|
88
86
|
"react": "~18.2.0",
|
|
89
87
|
"react-dom": "~18.2.0",
|
|
90
88
|
"vite": "5.4.7",
|
|
91
|
-
"@dxos/echo-signals": "0.8.2-main.
|
|
92
|
-
"@dxos/random": "0.8.2-main.
|
|
93
|
-
"@dxos/react-ui": "0.8.2-main.
|
|
94
|
-
"@dxos/react-ui-theme": "0.8.2-main.
|
|
95
|
-
"@dxos/storybook-utils": "0.8.2-main.
|
|
96
|
-
"@dxos/test-utils": "0.8.2-main.
|
|
89
|
+
"@dxos/echo-signals": "0.8.2-main.36232bc",
|
|
90
|
+
"@dxos/random": "0.8.2-main.36232bc",
|
|
91
|
+
"@dxos/react-ui": "0.8.2-main.36232bc",
|
|
92
|
+
"@dxos/react-ui-theme": "0.8.2-main.36232bc",
|
|
93
|
+
"@dxos/storybook-utils": "0.8.2-main.36232bc",
|
|
94
|
+
"@dxos/test-utils": "0.8.2-main.36232bc"
|
|
97
95
|
},
|
|
98
96
|
"peerDependencies": {
|
|
99
97
|
"@phosphor-icons/react": "^2.1.5",
|
|
100
98
|
"react": "~18.2.0",
|
|
101
99
|
"react-dom": "~18.2.0",
|
|
102
|
-
"@dxos/react-ui": "0.8.2-main.
|
|
103
|
-
"@dxos/react-ui-theme": "0.8.2-main.
|
|
100
|
+
"@dxos/react-ui": "0.8.2-main.36232bc",
|
|
101
|
+
"@dxos/react-ui-theme": "0.8.2-main.36232bc"
|
|
104
102
|
},
|
|
105
103
|
"publishConfig": {
|
|
106
104
|
"access": "public"
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
// Copyright 2024 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import { Schema } from 'effect';
|
|
6
5
|
import React, { useCallback, useMemo } from 'react';
|
|
7
6
|
|
|
7
|
+
import { S } from '@dxos/echo-schema';
|
|
8
8
|
import { live } from '@dxos/react-client/echo';
|
|
9
9
|
import { Popover } from '@dxos/react-ui';
|
|
10
10
|
import { Form } from '@dxos/react-ui-form';
|
|
@@ -20,14 +20,14 @@ export const CreateRefPanel = ({ model, modals, __gridScope }: GridScopedProps<C
|
|
|
20
20
|
const space = model?.space;
|
|
21
21
|
const state = modals.state.value;
|
|
22
22
|
|
|
23
|
-
const schema = useMemo<
|
|
23
|
+
const schema = useMemo<S.Schema<any> | undefined>(() => {
|
|
24
24
|
if (!space || state?.type !== 'createRefPanel') {
|
|
25
25
|
return;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
28
|
const [schema] = space.db.schemaRegistry.query({ typename: state.typename }).runSync();
|
|
29
29
|
if (schema) {
|
|
30
|
-
const omit =
|
|
30
|
+
const omit = S.omit<any, any, ['id']>('id');
|
|
31
31
|
return omit(schema);
|
|
32
32
|
}
|
|
33
33
|
}, [space, state]);
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright 2024 DXOS.org
|
|
3
|
+
//
|
|
4
|
+
|
|
5
|
+
import React from 'react';
|
|
6
|
+
|
|
7
|
+
import { type Space } from '@dxos/react-client/echo';
|
|
8
|
+
import { Popover } from '@dxos/react-ui';
|
|
9
|
+
import { Form } from '@dxos/react-ui-form';
|
|
10
|
+
|
|
11
|
+
import { type TableModel, type ModalController } from '../../model';
|
|
12
|
+
|
|
13
|
+
type RefPanelProps = { model: TableModel; modals: ModalController };
|
|
14
|
+
|
|
15
|
+
const getRefTargetObj = (space?: Space, id?: string) => {
|
|
16
|
+
if (space && id) {
|
|
17
|
+
return space?.db.getObjectById(id);
|
|
18
|
+
} else {
|
|
19
|
+
return undefined;
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
export const RefPanel = ({ model, modals }: RefPanelProps) => {
|
|
24
|
+
const state = modals.state.value;
|
|
25
|
+
const space = model?.space;
|
|
26
|
+
const targetObj = getRefTargetObj(space, state?.type === 'refPanel' ? state.targetId : undefined);
|
|
27
|
+
const schema = space && state?.type === 'refPanel' ? space.db.schemaRegistry.getSchema(state.typename) : undefined;
|
|
28
|
+
|
|
29
|
+
if (!model.view || !model.projection) {
|
|
30
|
+
return null;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
return (
|
|
34
|
+
<Popover.Root
|
|
35
|
+
modal={false}
|
|
36
|
+
open={state?.type === 'refPanel' && !!targetObj && !!schema}
|
|
37
|
+
onOpenChange={(nextOpen) => {
|
|
38
|
+
if (!nextOpen) {
|
|
39
|
+
return modals.close();
|
|
40
|
+
}
|
|
41
|
+
}}
|
|
42
|
+
>
|
|
43
|
+
<Popover.VirtualTrigger virtualRef={modals.trigger} />
|
|
44
|
+
<Popover.Portal>
|
|
45
|
+
<Popover.Content classNames='md:is-64'>
|
|
46
|
+
{targetObj && schema && <Form readonly values={targetObj} schema={schema} />}
|
|
47
|
+
<Popover.Arrow />
|
|
48
|
+
</Popover.Content>
|
|
49
|
+
</Popover.Portal>
|
|
50
|
+
</Popover.Root>
|
|
51
|
+
);
|
|
52
|
+
};
|
|
@@ -28,7 +28,8 @@ import { TableType } from '../../types';
|
|
|
28
28
|
import { initializeTable } from '../../util';
|
|
29
29
|
import { TableToolbar } from '../TableToolbar';
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
// NOTE(ZaymonFC): We rely on this seed being 0 in the smoke tests.
|
|
32
|
+
faker.seed(0);
|
|
32
33
|
|
|
33
34
|
/**
|
|
34
35
|
* Custom hook to create and manage a test table model for storybook demonstrations.
|
|
@@ -36,6 +36,7 @@ import { isNotFalsy, safeParseInt } from '@dxos/util';
|
|
|
36
36
|
import { ColumnActionsMenu } from './ColumnActionsMenu';
|
|
37
37
|
import { ColumnSettings } from './ColumnSettings';
|
|
38
38
|
import { CreateRefPanel } from './CreateRefPanel';
|
|
39
|
+
import { RefPanel } from './RefPanel';
|
|
39
40
|
import { RowActionsMenu } from './RowActionsMenu';
|
|
40
41
|
import { ModalController, type TableModel, type TablePresentation } from '../../model';
|
|
41
42
|
import { translationKey } from '../../translations';
|
|
@@ -180,6 +181,10 @@ const TableMain = forwardRef<TableController, TableMainProps>(
|
|
|
180
181
|
modals.showColumnCreator();
|
|
181
182
|
break;
|
|
182
183
|
}
|
|
184
|
+
case 'referencedCell': {
|
|
185
|
+
modals.showReferencePanel(data.targetId, data.schemaId);
|
|
186
|
+
break;
|
|
187
|
+
}
|
|
183
188
|
case 'sort': {
|
|
184
189
|
model?.sorting?.toggleSort(data.fieldId);
|
|
185
190
|
break;
|
|
@@ -368,6 +373,7 @@ const TableMain = forwardRef<TableController, TableMainProps>(
|
|
|
368
373
|
<ColumnActionsMenu model={model} modals={modals} />
|
|
369
374
|
<ColumnSettings model={model} modals={modals} onNewColumn={handleNewColumn} />
|
|
370
375
|
<CreateRefPanel model={model} modals={modals} />
|
|
376
|
+
<RefPanel model={model} modals={modals} />
|
|
371
377
|
</Grid.Root>
|
|
372
378
|
);
|
|
373
379
|
},
|
|
@@ -5,15 +5,14 @@
|
|
|
5
5
|
import '@dxos-theme';
|
|
6
6
|
|
|
7
7
|
import { type StoryObj, type Meta } from '@storybook/react';
|
|
8
|
-
import { SchemaAST } from 'effect';
|
|
9
8
|
import React, { useEffect, useMemo } from 'react';
|
|
10
9
|
|
|
11
|
-
import { type BaseObject, ImmutableSchema, type BaseSchema, type HasId } from '@dxos/echo-schema';
|
|
10
|
+
import { AST, type BaseObject, ImmutableSchema, type BaseSchema, type HasId } from '@dxos/echo-schema';
|
|
12
11
|
import { getAnnotation } from '@dxos/effect';
|
|
13
12
|
import { faker } from '@dxos/random';
|
|
14
13
|
import { live, makeRef } from '@dxos/react-client/echo';
|
|
15
14
|
import { useClientProvider, withClientProvider } from '@dxos/react-client/testing';
|
|
16
|
-
import {
|
|
15
|
+
import { Contact, createView, Organization, ViewProjection, ViewType } from '@dxos/schema';
|
|
17
16
|
import { createAsyncGenerator, type ValueGenerator } from '@dxos/schema/testing';
|
|
18
17
|
import { withLayout, withTheme } from '@dxos/storybook-utils';
|
|
19
18
|
|
|
@@ -34,9 +33,9 @@ const useTestModel = <T extends BaseObject & HasId>(schema: BaseSchema<T>, count
|
|
|
34
33
|
const { space } = useClientProvider();
|
|
35
34
|
|
|
36
35
|
const table = useMemo(() => {
|
|
37
|
-
// const { typename } = pipe(schema.ast,
|
|
36
|
+
// const { typename } = pipe(schema.ast, AST.getAnnotation<TypeAnnotation>(TypeAnnotationId), Option.getOrThrow);
|
|
38
37
|
const typename = schema.typename;
|
|
39
|
-
const name = getAnnotation<string>(
|
|
38
|
+
const name = getAnnotation<string>(AST.TitleAnnotationId)(schema.ast) ?? typename;
|
|
40
39
|
const view = createView({ name, typename, jsonSchema: schema.jsonSchema });
|
|
41
40
|
return live(TableType, { view: makeRef(view) });
|
|
42
41
|
}, [schema]);
|
|
@@ -82,12 +81,12 @@ const useTestModel = <T extends BaseObject & HasId>(schema: BaseSchema<T>, count
|
|
|
82
81
|
|
|
83
82
|
const DefaultStory = () => {
|
|
84
83
|
// TODO(burdon): Remove need for ImmutableSchema wrapper at API-level.
|
|
85
|
-
const orgSchema = useMemo(() => new ImmutableSchema(
|
|
86
|
-
const { model: orgModel, presentation: orgPresentation } = useTestModel<
|
|
84
|
+
const orgSchema = useMemo(() => new ImmutableSchema(Organization), []);
|
|
85
|
+
const { model: orgModel, presentation: orgPresentation } = useTestModel<Organization>(orgSchema, 50);
|
|
87
86
|
|
|
88
87
|
// TODO(burdon): Generate links with references.
|
|
89
|
-
const contactSchema = useMemo(() => new ImmutableSchema(
|
|
90
|
-
const { model: contactModel, presentation: contactPresentation } = useTestModel<
|
|
88
|
+
const contactSchema = useMemo(() => new ImmutableSchema(Contact), []);
|
|
89
|
+
const { model: contactModel, presentation: contactPresentation } = useTestModel<Contact>(contactSchema, 50);
|
|
91
90
|
|
|
92
91
|
return (
|
|
93
92
|
<div className='is-full bs-full grid grid-cols-2 divide-x divide-separator'>
|
|
@@ -107,7 +106,7 @@ const meta: Meta<typeof DefaultStory> = {
|
|
|
107
106
|
parameters: { translations },
|
|
108
107
|
decorators: [
|
|
109
108
|
withClientProvider({
|
|
110
|
-
types: [TableType, ViewType,
|
|
109
|
+
types: [TableType, ViewType, Organization, Contact],
|
|
111
110
|
createIdentity: true,
|
|
112
111
|
createSpace: true,
|
|
113
112
|
}),
|
|
@@ -2,10 +2,9 @@
|
|
|
2
2
|
// Copyright 2024 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import { Schema } from 'effect';
|
|
6
5
|
import { useEffect } from 'react';
|
|
7
6
|
|
|
8
|
-
import { setValue, toJsonSchema, TypeEnum, TypedObject, FormatEnum
|
|
7
|
+
import { setValue, toJsonSchema, S, TypeEnum, TypedObject, FormatEnum } from '@dxos/echo-schema';
|
|
9
8
|
import { faker } from '@dxos/random';
|
|
10
9
|
import { live, makeRef } from '@dxos/react-client/echo';
|
|
11
10
|
import { createView, type ViewProjection } from '@dxos/schema';
|
|
@@ -13,11 +12,11 @@ import { createView, type ViewProjection } from '@dxos/schema';
|
|
|
13
12
|
import { TableType } from '../types';
|
|
14
13
|
|
|
15
14
|
export const TestSchema = TypedObject({ typename: 'example.com/type/Test', version: '0.1.0' })({
|
|
16
|
-
id:
|
|
17
|
-
name:
|
|
18
|
-
age:
|
|
19
|
-
active:
|
|
20
|
-
netWorth:
|
|
15
|
+
id: S.String,
|
|
16
|
+
name: S.optional(S.String),
|
|
17
|
+
age: S.optional(S.Number),
|
|
18
|
+
active: S.optional(S.Boolean),
|
|
19
|
+
netWorth: S.optional(S.Number),
|
|
21
20
|
});
|
|
22
21
|
|
|
23
22
|
export const createTable = (schema = TestSchema) => {
|
|
@@ -3,10 +3,9 @@
|
|
|
3
3
|
//
|
|
4
4
|
|
|
5
5
|
import { computed } from '@preact/signals-core';
|
|
6
|
-
import { Schema } from 'effect';
|
|
7
6
|
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
8
7
|
|
|
9
|
-
import { TypedObject } from '@dxos/echo-schema';
|
|
8
|
+
import { S, TypedObject } from '@dxos/echo-schema';
|
|
10
9
|
import { updateCounter } from '@dxos/echo-schema/testing';
|
|
11
10
|
import { registerSignalsRuntime } from '@dxos/echo-signals';
|
|
12
11
|
import { createEchoSchema } from '@dxos/live-object/testing';
|
|
@@ -100,8 +99,8 @@ describe('TableModel', () => {
|
|
|
100
99
|
});
|
|
101
100
|
|
|
102
101
|
class Test extends TypedObject({ typename: 'example.com/type/Test', version: '0.1.0' })({
|
|
103
|
-
title:
|
|
104
|
-
completed:
|
|
102
|
+
title: S.String,
|
|
103
|
+
completed: S.Boolean,
|
|
105
104
|
}) {}
|
|
106
105
|
|
|
107
106
|
const createTableModel = (props: Partial<TableModelProps> = {}): TableModel => {
|
|
@@ -2,10 +2,9 @@
|
|
|
2
2
|
// Copyright 2024 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import { Schema } from 'effect';
|
|
6
5
|
import { describe, expect, it, beforeEach } from 'vitest';
|
|
7
6
|
|
|
8
|
-
import { TypedObject } from '@dxos/echo-schema';
|
|
7
|
+
import { S, TypedObject } from '@dxos/echo-schema';
|
|
9
8
|
import { live, makeRef } from '@dxos/live-object';
|
|
10
9
|
import { createEchoSchema } from '@dxos/live-object/testing';
|
|
11
10
|
import { createView, ViewProjection } from '@dxos/schema';
|
|
@@ -90,8 +89,8 @@ describe('TablePresentation', () => {
|
|
|
90
89
|
});
|
|
91
90
|
|
|
92
91
|
class Test extends TypedObject({ typename: 'example.com/type/Test', version: '0.1.0' })({
|
|
93
|
-
title:
|
|
94
|
-
completed:
|
|
92
|
+
title: S.String,
|
|
93
|
+
completed: S.Boolean,
|
|
95
94
|
}) {}
|
|
96
95
|
|
|
97
96
|
const createTableModel = (props: Partial<TableModelProps> = {}): TableModel => {
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
import { signal } from '@preact/signals-core';
|
|
6
6
|
|
|
7
|
-
import { FormatEnum,
|
|
7
|
+
import { FormatEnum, getValue } from '@dxos/echo-schema';
|
|
8
8
|
import { cellClassesForFieldType, formatForDisplay } from '@dxos/react-ui-form';
|
|
9
9
|
import {
|
|
10
10
|
type DxGridPlane,
|
|
@@ -124,8 +124,10 @@ export class TablePresentation<T extends TableRow = TableRow> {
|
|
|
124
124
|
if (props.format === FormatEnum.Ref && props.referenceSchema) {
|
|
125
125
|
const targetObj = getValue(obj, field.path)?.target;
|
|
126
126
|
if (targetObj) {
|
|
127
|
-
|
|
128
|
-
|
|
127
|
+
cell.accessoryHtml = tableButtons.referencedCell.render({
|
|
128
|
+
targetId: targetObj.id as any as string,
|
|
129
|
+
schemaId: props.referenceSchema,
|
|
130
|
+
});
|
|
129
131
|
}
|
|
130
132
|
}
|
|
131
133
|
|
package/src/types/table.ts
CHANGED
|
@@ -2,28 +2,20 @@
|
|
|
2
2
|
// Copyright 2024 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
import { Type } from '@dxos/echo';
|
|
5
|
+
import { EchoObject, Expando, LabelAnnotationId, ObjectId, Ref, S } from '@dxos/echo-schema';
|
|
8
6
|
// import { ThreadType } from '@dxos/plugin-space/types';
|
|
9
|
-
import { LabelAnnotationId } from '@dxos/echo-schema';
|
|
10
7
|
import { ViewType } from '@dxos/schema';
|
|
11
8
|
|
|
12
|
-
export const TableSchema =
|
|
13
|
-
id:
|
|
14
|
-
name:
|
|
15
|
-
view:
|
|
9
|
+
export const TableSchema = S.Struct({
|
|
10
|
+
id: ObjectId,
|
|
11
|
+
name: S.optional(S.String),
|
|
12
|
+
view: S.optional(Ref(ViewType)),
|
|
16
13
|
// TODO(burdon): Document why threads is included here?
|
|
17
|
-
threads:
|
|
14
|
+
threads: S.optional(S.Array(Ref(Expando /* ThreadType */))),
|
|
18
15
|
}).annotations({
|
|
19
16
|
// TODO(burdon): Move annotation to property.
|
|
20
17
|
[LabelAnnotationId]: 'name',
|
|
21
18
|
});
|
|
22
19
|
|
|
23
|
-
export const TableType = TableSchema.pipe(
|
|
24
|
-
|
|
25
|
-
typename: 'dxos.org/type/Table',
|
|
26
|
-
version: '0.1.0',
|
|
27
|
-
}),
|
|
28
|
-
);
|
|
29
|
-
export interface TableType extends Schema.Schema.Type<typeof TableType> {}
|
|
20
|
+
export const TableType = TableSchema.pipe(EchoObject({ typename: 'dxos.org/type/Table', version: '0.1.0' }));
|
|
21
|
+
export interface TableType extends S.Schema.Type<typeof TableType> {}
|
|
@@ -15,6 +15,7 @@ export const BUTTON_IDENTIFIERS: { [K in TableButton]: string } = {
|
|
|
15
15
|
type ButtonData =
|
|
16
16
|
| { type: 'columnSettings'; fieldId: string }
|
|
17
17
|
| { type: 'newColumn'; disabled?: boolean }
|
|
18
|
+
| { type: 'referencedCell'; schemaId: string; targetId: string }
|
|
18
19
|
| { type: 'rowMenu'; rowIndex: number }
|
|
19
20
|
| { type: 'sort'; fieldId: string; direction?: 'asc' | 'desc' };
|
|
20
21
|
|
|
@@ -75,6 +76,27 @@ const columnSettingsButton = {
|
|
|
75
76
|
}),
|
|
76
77
|
} as const;
|
|
77
78
|
|
|
79
|
+
const referencedCellButton = {
|
|
80
|
+
attr: BUTTON_IDENTIFIERS.referencedCell,
|
|
81
|
+
icon: 'ph--link-simple-horizontal--regular',
|
|
82
|
+
render: ({ targetId, schemaId }: Omit<Extract<ButtonData, { type: 'referencedCell' }>, 'type'>) => {
|
|
83
|
+
return createButton({
|
|
84
|
+
attr: BUTTON_IDENTIFIERS.referencedCell,
|
|
85
|
+
icon: referencedCellButton.icon,
|
|
86
|
+
data: {
|
|
87
|
+
'data-target-id': targetId,
|
|
88
|
+
'data-schema-id': schemaId,
|
|
89
|
+
},
|
|
90
|
+
testId: 'table-ref-cell-button',
|
|
91
|
+
});
|
|
92
|
+
},
|
|
93
|
+
getData: (el: HTMLElement): Extract<ButtonData, { type: 'referencedCell' }> => ({
|
|
94
|
+
type: 'referencedCell',
|
|
95
|
+
targetId: el.getAttribute('data-target-id')!,
|
|
96
|
+
schemaId: el.getAttribute('data-schema-id')!,
|
|
97
|
+
}),
|
|
98
|
+
} as const;
|
|
99
|
+
|
|
78
100
|
const rowMenuButton = {
|
|
79
101
|
attr: BUTTON_IDENTIFIERS.rowMenu,
|
|
80
102
|
icon: 'ph--dots-three--regular',
|
|
@@ -121,6 +143,7 @@ const sortButton = {
|
|
|
121
143
|
export const tableButtons = {
|
|
122
144
|
addColumn: addColumnButton,
|
|
123
145
|
columnSettings: columnSettingsButton,
|
|
146
|
+
referencedCell: referencedCellButton,
|
|
124
147
|
rowMenu: rowMenuButton,
|
|
125
148
|
sort: sortButton,
|
|
126
149
|
} as const;
|
package/src/util/table.ts
CHANGED
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
// Copyright 2024 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import { Schema, SchemaAST } from 'effect';
|
|
6
|
-
|
|
7
5
|
import {
|
|
6
|
+
AST,
|
|
8
7
|
type EchoSchema,
|
|
9
8
|
Format,
|
|
10
9
|
FormatEnum,
|
|
11
10
|
type JsonPath,
|
|
12
11
|
type JsonProp,
|
|
12
|
+
S,
|
|
13
13
|
TypedObject,
|
|
14
14
|
TypeEnum,
|
|
15
15
|
} from '@dxos/echo-schema';
|
|
@@ -34,7 +34,7 @@ export const initializeTable = async ({
|
|
|
34
34
|
table,
|
|
35
35
|
typename,
|
|
36
36
|
initialRow = true,
|
|
37
|
-
}: InitialiseTableProps): Promise<
|
|
37
|
+
}: InitialiseTableProps): Promise<S.Schema.AnyNoContext> => {
|
|
38
38
|
if (typename) {
|
|
39
39
|
const schema = await space.db.graph.getSchemaByTypename(typename, space.db);
|
|
40
40
|
if (!schema) {
|
|
@@ -82,10 +82,10 @@ const ContactSchema = TypedObject({
|
|
|
82
82
|
typename: `example.com/type/${PublicKey.random().truncate()}`,
|
|
83
83
|
version: '0.1.0',
|
|
84
84
|
})({
|
|
85
|
-
name:
|
|
86
|
-
active:
|
|
87
|
-
email:
|
|
88
|
-
salary:
|
|
85
|
+
name: S.optional(S.String).annotations({ [AST.TitleAnnotationId]: 'Name' }),
|
|
86
|
+
active: S.optional(S.Boolean),
|
|
87
|
+
email: S.optional(Format.Email),
|
|
88
|
+
salary: S.optional(Format.Currency()).annotations({ [AST.TitleAnnotationId]: 'Salary' }),
|
|
89
89
|
});
|
|
90
90
|
|
|
91
91
|
const ContactFields = ['name', 'email', 'salary', 'active'];
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
// packages/ui/react-ui-table/src/types/table.ts
|
|
2
|
-
import { Schema } from "effect";
|
|
3
|
-
import { Type } from "@dxos/echo";
|
|
4
|
-
import { LabelAnnotationId } from "@dxos/echo-schema";
|
|
5
|
-
import { ViewType } from "@dxos/schema";
|
|
6
|
-
var TableSchema = Schema.Struct({
|
|
7
|
-
id: Type.ObjectId,
|
|
8
|
-
name: Schema.optional(Schema.String),
|
|
9
|
-
view: Schema.optional(Type.Ref(ViewType)),
|
|
10
|
-
// TODO(burdon): Document why threads is included here?
|
|
11
|
-
threads: Schema.optional(Schema.Array(Type.Ref(
|
|
12
|
-
Type.Expando
|
|
13
|
-
/* ThreadType */
|
|
14
|
-
)))
|
|
15
|
-
}).annotations({
|
|
16
|
-
// TODO(burdon): Move annotation to property.
|
|
17
|
-
[LabelAnnotationId]: "name"
|
|
18
|
-
});
|
|
19
|
-
var TableType = TableSchema.pipe(Type.def({
|
|
20
|
-
typename: "dxos.org/type/Table",
|
|
21
|
-
version: "0.1.0"
|
|
22
|
-
}));
|
|
23
|
-
|
|
24
|
-
export {
|
|
25
|
-
TableSchema,
|
|
26
|
-
TableType
|
|
27
|
-
};
|
|
28
|
-
//# sourceMappingURL=chunk-UGGYKLOH.mjs.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/types/table.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { Type } from '@dxos/echo';\n// import { ThreadType } from '@dxos/plugin-space/types';\nimport { LabelAnnotationId } from '@dxos/echo-schema';\nimport { ViewType } from '@dxos/schema';\n\nexport const TableSchema = Schema.Struct({\n id: Type.ObjectId,\n name: Schema.optional(Schema.String),\n view: Schema.optional(Type.Ref(ViewType)),\n // TODO(burdon): Document why threads is included here?\n threads: Schema.optional(Schema.Array(Type.Ref(Type.Expando /* ThreadType */))),\n}).annotations({\n // TODO(burdon): Move annotation to property.\n [LabelAnnotationId]: 'name',\n});\n\nexport const TableType = TableSchema.pipe(\n Type.def({\n typename: 'dxos.org/type/Table',\n version: '0.1.0',\n }),\n);\nexport interface TableType extends Schema.Schema.Type<typeof TableType> {}\n"],
|
|
5
|
-
"mappings": ";AAIA,SAASA,cAAc;AAEvB,SAASC,YAAY;AAErB,SAASC,yBAAyB;AAClC,SAASC,gBAAgB;AAElB,IAAMC,cAAcC,OAAOC,OAAO;EACvCC,IAAIC,KAAKC;EACTC,MAAML,OAAOM,SAASN,OAAOO,MAAM;EACnCC,MAAMR,OAAOM,SAASH,KAAKM,IAAIC,QAAAA,CAAAA;;EAE/BC,SAASX,OAAOM,SAASN,OAAOY,MAAMT,KAAKM;IAAIN,KAAKU;;EAAsB,CAAA,CAAA;AAC5E,CAAA,EAAGC,YAAY;;EAEb,CAACC,iBAAAA,GAAoB;AACvB,CAAA;AAEO,IAAMC,YAAYjB,YAAYkB,KACnCd,KAAKe,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,CAAA;",
|
|
6
|
-
"names": ["Schema", "Type", "LabelAnnotationId", "ViewType", "TableSchema", "Schema", "Struct", "id", "Type", "ObjectId", "name", "optional", "String", "view", "Ref", "ViewType", "threads", "Array", "Expando", "annotations", "LabelAnnotationId", "TableType", "pipe", "def", "typename", "version"]
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/types/table.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { Type } from '@dxos/echo';\n// import { ThreadType } from '@dxos/plugin-space/types';\nimport { LabelAnnotationId } from '@dxos/echo-schema';\nimport { ViewType } from '@dxos/schema';\n\nexport const TableSchema = Schema.Struct({\n id: Type.ObjectId,\n name: Schema.optional(Schema.String),\n view: Schema.optional(Type.Ref(ViewType)),\n // TODO(burdon): Document why threads is included here?\n threads: Schema.optional(Schema.Array(Type.Ref(Type.Expando /* ThreadType */))),\n}).annotations({\n // TODO(burdon): Move annotation to property.\n [LabelAnnotationId]: 'name',\n});\n\nexport const TableType = TableSchema.pipe(\n Type.def({\n typename: 'dxos.org/type/Table',\n version: '0.1.0',\n }),\n);\nexport interface TableType extends Schema.Schema.Type<typeof TableType> {}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAIA,oBAAuB;AAEvB,kBAAqB;AAErB,yBAAkC;AAClC,oBAAyB;AAElB,IAAMA,cAAcC,qBAAOC,OAAO;EACvCC,IAAIC,iBAAKC;EACTC,MAAML,qBAAOM,SAASN,qBAAOO,MAAM;EACnCC,MAAMR,qBAAOM,SAASH,iBAAKM,IAAIC,sBAAAA,CAAAA;;EAE/BC,SAASX,qBAAOM,SAASN,qBAAOY,MAAMT,iBAAKM;IAAIN,iBAAKU;;EAAsB,CAAA,CAAA;AAC5E,CAAA,EAAGC,YAAY;;EAEb,CAACC,oCAAAA,GAAoB;AACvB,CAAA;AAEO,IAAMC,YAAYjB,YAAYkB,KACnCd,iBAAKe,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,CAAA;",
|
|
6
|
-
"names": ["TableSchema", "Schema", "Struct", "id", "Type", "ObjectId", "name", "optional", "String", "view", "Ref", "ViewType", "threads", "Array", "Expando", "annotations", "LabelAnnotationId", "TableType", "pipe", "def", "typename", "version"]
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/types/table.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { Type } from '@dxos/echo';\n// import { ThreadType } from '@dxos/plugin-space/types';\nimport { LabelAnnotationId } from '@dxos/echo-schema';\nimport { ViewType } from '@dxos/schema';\n\nexport const TableSchema = Schema.Struct({\n id: Type.ObjectId,\n name: Schema.optional(Schema.String),\n view: Schema.optional(Type.Ref(ViewType)),\n // TODO(burdon): Document why threads is included here?\n threads: Schema.optional(Schema.Array(Type.Ref(Type.Expando /* ThreadType */))),\n}).annotations({\n // TODO(burdon): Move annotation to property.\n [LabelAnnotationId]: 'name',\n});\n\nexport const TableType = TableSchema.pipe(\n Type.def({\n typename: 'dxos.org/type/Table',\n version: '0.1.0',\n }),\n);\nexport interface TableType extends Schema.Schema.Type<typeof TableType> {}\n"],
|
|
5
|
-
"mappings": ";;;AAIA,SAASA,cAAc;AAEvB,SAASC,YAAY;AAErB,SAASC,yBAAyB;AAClC,SAASC,gBAAgB;AAElB,IAAMC,cAAcC,OAAOC,OAAO;EACvCC,IAAIC,KAAKC;EACTC,MAAML,OAAOM,SAASN,OAAOO,MAAM;EACnCC,MAAMR,OAAOM,SAASH,KAAKM,IAAIC,QAAAA,CAAAA;;EAE/BC,SAASX,OAAOM,SAASN,OAAOY,MAAMT,KAAKM;IAAIN,KAAKU;;EAAsB,CAAA,CAAA;AAC5E,CAAA,EAAGC,YAAY;;EAEb,CAACC,iBAAAA,GAAoB;AACvB,CAAA;AAEO,IAAMC,YAAYjB,YAAYkB,KACnCd,KAAKe,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,CAAA;",
|
|
6
|
-
"names": ["Schema", "Type", "LabelAnnotationId", "ViewType", "TableSchema", "Schema", "Struct", "id", "Type", "ObjectId", "name", "optional", "String", "view", "Ref", "ViewType", "threads", "Array", "Expando", "annotations", "LabelAnnotationId", "TableType", "pipe", "def", "typename", "version"]
|
|
7
|
-
}
|