@dxos/plugin-preview 0.8.4-main.74a063c4e0 → 0.8.4-main.765dc60934
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/LICENSE +102 -5
- package/dist/lib/neutral/PreviewPlugin.mjs +9 -0
- package/dist/lib/neutral/PreviewPlugin.mjs.map +7 -0
- package/dist/lib/neutral/PreviewPlugin.node.mjs +17 -0
- package/dist/lib/neutral/PreviewPlugin.node.mjs.map +7 -0
- package/dist/lib/neutral/capabilities/index.mjs +9 -0
- package/dist/lib/neutral/capabilities/index.mjs.map +7 -0
- package/dist/lib/neutral/chunk-3SWUVHXJ.mjs +28 -0
- package/dist/lib/neutral/chunk-3SWUVHXJ.mjs.map +7 -0
- package/dist/lib/neutral/chunk-52UEVZSF.mjs +17 -0
- package/dist/lib/neutral/chunk-52UEVZSF.mjs.map +7 -0
- package/dist/lib/neutral/index.mjs +7 -0
- package/dist/lib/neutral/index.mjs.map +7 -0
- package/dist/lib/neutral/meta.json +1 -0
- package/dist/lib/neutral/meta.mjs +7 -0
- package/dist/lib/neutral/meta.mjs.map +7 -0
- package/dist/lib/neutral/plugin.mjs +11 -0
- package/dist/lib/neutral/plugin.mjs.map +7 -0
- package/dist/lib/neutral/preview-popover-MPPEMUIA.mjs +78 -0
- package/dist/lib/neutral/preview-popover-MPPEMUIA.mjs.map +7 -0
- package/dist/lib/neutral/react-surface-YFFJXXPQ.mjs +348 -0
- package/dist/lib/neutral/react-surface-YFFJXXPQ.mjs.map +7 -0
- package/dist/lib/neutral/testing.mjs +7 -0
- package/dist/lib/neutral/testing.mjs.map +7 -0
- package/dist/lib/neutral/translations.mjs +21 -0
- package/dist/lib/neutral/translations.mjs.map +7 -0
- package/dist/types/src/PreviewPlugin.d.ts +1 -0
- package/dist/types/src/PreviewPlugin.d.ts.map +1 -1
- package/dist/types/src/PreviewPlugin.node.d.ts +4 -0
- package/dist/types/src/PreviewPlugin.node.d.ts.map +1 -0
- package/dist/types/src/PreviewPlugin.test.d.ts +2 -0
- package/dist/types/src/PreviewPlugin.test.d.ts.map +1 -0
- package/dist/types/src/capabilities/preview-popover.d.ts.map +1 -1
- package/dist/types/src/capabilities/react-surface.d.ts.map +1 -1
- package/dist/types/src/cards/ExpandoCard.d.ts +4 -0
- package/dist/types/src/cards/ExpandoCard.d.ts.map +1 -0
- package/dist/types/src/cards/FormCard.d.ts.map +1 -1
- package/dist/types/src/cards/JsonCard.d.ts.map +1 -1
- package/dist/types/src/cards/OrganizationCard.d.ts.map +1 -1
- package/dist/types/src/cards/PersonCard.d.ts.map +1 -1
- package/dist/types/src/cards/ProjectCard.d.ts.map +1 -1
- package/dist/types/src/cards/TaskCard.d.ts.map +1 -1
- package/dist/types/src/cards/index.d.ts +1 -0
- package/dist/types/src/cards/index.d.ts.map +1 -1
- package/dist/types/src/index.d.ts +0 -1
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/plugin.d.ts +3 -0
- package/dist/types/src/plugin.d.ts.map +1 -0
- package/dist/types/src/stories/Card.stories.d.ts +10 -8
- package/dist/types/src/stories/Card.stories.d.ts.map +1 -1
- package/dist/types/src/stories/testing.d.ts +2 -0
- package/dist/types/src/stories/testing.d.ts.map +1 -1
- package/dist/types/src/testing.d.ts +2 -0
- package/dist/types/src/testing.d.ts.map +1 -0
- package/dist/types/src/translations.d.ts +8 -9
- package/dist/types/src/translations.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +75 -41
- package/src/PreviewPlugin.node.ts +16 -0
- package/src/PreviewPlugin.test.ts +25 -0
- package/src/PreviewPlugin.tsx +4 -3
- package/src/capabilities/preview-popover.ts +6 -3
- package/src/capabilities/react-surface.tsx +19 -17
- package/src/cards/ExpandoCard.tsx +76 -0
- package/src/cards/FormCard.tsx +1 -1
- package/src/cards/JsonCard.tsx +5 -2
- package/src/cards/index.ts +1 -0
- package/src/index.ts +0 -2
- package/src/plugin.ts +9 -0
- package/src/stories/Card.stories.tsx +18 -4
- package/src/stories/testing.tsx +10 -0
- package/src/testing.ts +7 -0
- package/dist/lib/browser/index.mjs +0 -59
- package/dist/lib/browser/index.mjs.map +0 -7
- package/dist/lib/browser/meta.json +0 -1
- package/dist/lib/node-esm/index.mjs +0 -61
- package/dist/lib/node-esm/index.mjs.map +0 -7
- package/dist/lib/node-esm/meta.json +0 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/plugin-preview",
|
|
3
|
-
"version": "0.8.4-main.
|
|
3
|
+
"version": "0.8.4-main.765dc60934",
|
|
4
4
|
"description": "Preview plugin",
|
|
5
5
|
"homepage": "https://dxos.org",
|
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
|
@@ -8,69 +8,103 @@
|
|
|
8
8
|
"type": "git",
|
|
9
9
|
"url": "https://github.com/dxos/dxos"
|
|
10
10
|
},
|
|
11
|
-
"license": "
|
|
11
|
+
"license": "FSL-1.1-Apache-2.0",
|
|
12
12
|
"author": "DXOS.org",
|
|
13
13
|
"sideEffects": true,
|
|
14
14
|
"type": "module",
|
|
15
15
|
"imports": {
|
|
16
|
-
"#capabilities":
|
|
17
|
-
|
|
16
|
+
"#capabilities": {
|
|
17
|
+
"source": "./src/capabilities/index.ts",
|
|
18
|
+
"types": "./dist/types/src/capabilities/index.d.ts",
|
|
19
|
+
"default": "./dist/lib/neutral/capabilities/index.mjs"
|
|
20
|
+
},
|
|
21
|
+
"#meta": {
|
|
22
|
+
"source": "./src/meta.ts",
|
|
23
|
+
"types": "./dist/types/src/meta.d.ts",
|
|
24
|
+
"default": "./dist/lib/neutral/meta.mjs"
|
|
25
|
+
},
|
|
26
|
+
"#plugin": {
|
|
27
|
+
"source": {
|
|
28
|
+
"node": "./src/PreviewPlugin.node.ts",
|
|
29
|
+
"default": "./src/PreviewPlugin.tsx"
|
|
30
|
+
},
|
|
31
|
+
"types": "./dist/types/src/PreviewPlugin.d.ts",
|
|
32
|
+
"node": "./dist/lib/neutral/PreviewPlugin.node.mjs",
|
|
33
|
+
"default": "./dist/lib/neutral/PreviewPlugin.mjs"
|
|
34
|
+
},
|
|
35
|
+
"#translations": {
|
|
36
|
+
"source": "./src/translations.ts",
|
|
37
|
+
"types": "./dist/types/src/translations.d.ts",
|
|
38
|
+
"default": "./dist/lib/neutral/translations.mjs"
|
|
39
|
+
}
|
|
18
40
|
},
|
|
19
41
|
"exports": {
|
|
20
42
|
".": {
|
|
21
43
|
"source": "./src/index.ts",
|
|
22
44
|
"types": "./dist/types/src/index.d.ts",
|
|
23
|
-
"
|
|
45
|
+
"default": "./dist/lib/neutral/index.mjs"
|
|
46
|
+
},
|
|
47
|
+
"./plugin": {
|
|
48
|
+
"source": "./src/plugin.ts",
|
|
49
|
+
"types": "./dist/types/src/plugin.d.ts",
|
|
50
|
+
"default": "./dist/lib/neutral/plugin.mjs"
|
|
51
|
+
},
|
|
52
|
+
"./testing": {
|
|
53
|
+
"source": "./src/testing.ts",
|
|
54
|
+
"types": "./dist/types/src/testing.d.ts",
|
|
55
|
+
"default": "./dist/lib/neutral/testing.mjs"
|
|
56
|
+
},
|
|
57
|
+
"./translations": {
|
|
58
|
+
"source": "./src/translations.ts",
|
|
59
|
+
"types": "./dist/types/src/translations.d.ts",
|
|
60
|
+
"default": "./dist/lib/neutral/translations.mjs"
|
|
24
61
|
}
|
|
25
62
|
},
|
|
26
63
|
"types": "dist/types/src/index.d.ts",
|
|
27
|
-
"typesVersions": {
|
|
28
|
-
"*": {}
|
|
29
|
-
},
|
|
30
64
|
"files": [
|
|
31
65
|
"dist",
|
|
32
66
|
"src"
|
|
33
67
|
],
|
|
34
68
|
"dependencies": {
|
|
35
69
|
"@effect-atom/atom-react": "^0.5.0",
|
|
36
|
-
"@dxos/app-
|
|
37
|
-
"@dxos/app-
|
|
38
|
-
"@dxos/app-
|
|
39
|
-
"@dxos/
|
|
40
|
-
"@dxos/
|
|
41
|
-
"@dxos/
|
|
42
|
-
"@dxos/
|
|
43
|
-
"@dxos/keys": "0.8.4-main.
|
|
44
|
-
"@dxos/
|
|
45
|
-
"@dxos/
|
|
46
|
-
"@dxos/
|
|
47
|
-
"@dxos/plugin-attention": "0.8.4-main.
|
|
48
|
-
"@dxos/plugin-client": "0.8.4-main.
|
|
49
|
-
"@dxos/plugin-deck": "0.8.4-main.
|
|
50
|
-
"@dxos/react-
|
|
51
|
-
"@dxos/react-ui": "0.8.4-main.
|
|
52
|
-
"@dxos/react-
|
|
53
|
-
"@dxos/react-ui-
|
|
54
|
-
"@dxos/react-ui-
|
|
55
|
-
"@dxos/react-ui-
|
|
56
|
-
"@dxos/react-ui-table": "0.8.4-main.
|
|
57
|
-
"@dxos/
|
|
58
|
-
"@dxos/
|
|
59
|
-
"@dxos/
|
|
60
|
-
"@dxos/ui-editor": "0.8.4-main.
|
|
61
|
-
"@dxos/ui-
|
|
62
|
-
"@dxos/util": "0.8.4-main.
|
|
70
|
+
"@dxos/app-graph": "0.8.4-main.765dc60934",
|
|
71
|
+
"@dxos/app-framework": "0.8.4-main.765dc60934",
|
|
72
|
+
"@dxos/app-toolkit": "0.8.4-main.765dc60934",
|
|
73
|
+
"@dxos/client": "0.8.4-main.765dc60934",
|
|
74
|
+
"@dxos/async": "0.8.4-main.765dc60934",
|
|
75
|
+
"@dxos/echo": "0.8.4-main.765dc60934",
|
|
76
|
+
"@dxos/effect": "0.8.4-main.765dc60934",
|
|
77
|
+
"@dxos/keys": "0.8.4-main.765dc60934",
|
|
78
|
+
"@dxos/log": "0.8.4-main.765dc60934",
|
|
79
|
+
"@dxos/operation": "0.8.4-main.765dc60934",
|
|
80
|
+
"@dxos/lit-ui": "0.8.4-main.765dc60934",
|
|
81
|
+
"@dxos/plugin-attention": "0.8.4-main.765dc60934",
|
|
82
|
+
"@dxos/plugin-client": "0.8.4-main.765dc60934",
|
|
83
|
+
"@dxos/plugin-deck": "0.8.4-main.765dc60934",
|
|
84
|
+
"@dxos/react-ui-form": "0.8.4-main.765dc60934",
|
|
85
|
+
"@dxos/react-ui": "0.8.4-main.765dc60934",
|
|
86
|
+
"@dxos/react-client": "0.8.4-main.765dc60934",
|
|
87
|
+
"@dxos/react-ui-menu": "0.8.4-main.765dc60934",
|
|
88
|
+
"@dxos/react-ui-syntax-highlighter": "0.8.4-main.765dc60934",
|
|
89
|
+
"@dxos/react-ui-mosaic": "0.8.4-main.765dc60934",
|
|
90
|
+
"@dxos/react-ui-table": "0.8.4-main.765dc60934",
|
|
91
|
+
"@dxos/schema": "0.8.4-main.765dc60934",
|
|
92
|
+
"@dxos/types": "0.8.4-main.765dc60934",
|
|
93
|
+
"@dxos/ui-theme": "0.8.4-main.765dc60934",
|
|
94
|
+
"@dxos/ui-editor": "0.8.4-main.765dc60934",
|
|
95
|
+
"@dxos/react-ui-editor": "0.8.4-main.765dc60934",
|
|
96
|
+
"@dxos/util": "0.8.4-main.765dc60934"
|
|
63
97
|
},
|
|
64
98
|
"devDependencies": {
|
|
65
99
|
"effect": "3.20.0",
|
|
66
100
|
"react": "~19.2.3",
|
|
67
101
|
"react-dom": "~19.2.3",
|
|
68
|
-
"vite": "^
|
|
69
|
-
"@dxos/echo-db": "0.8.4-main.
|
|
70
|
-
"@dxos/
|
|
71
|
-
"@dxos/
|
|
72
|
-
"@dxos/
|
|
73
|
-
"@dxos/
|
|
102
|
+
"vite": "^8.0.13",
|
|
103
|
+
"@dxos/echo-db": "0.8.4-main.765dc60934",
|
|
104
|
+
"@dxos/random": "0.8.4-main.765dc60934",
|
|
105
|
+
"@dxos/plugin-testing": "0.8.4-main.765dc60934",
|
|
106
|
+
"@dxos/storybook-utils": "0.8.4-main.765dc60934",
|
|
107
|
+
"@dxos/react-ui-components": "0.8.4-main.765dc60934"
|
|
74
108
|
},
|
|
75
109
|
"peerDependencies": {
|
|
76
110
|
"effect": "3.20.0",
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright 2023 DXOS.org
|
|
3
|
+
//
|
|
4
|
+
|
|
5
|
+
import { Plugin } from '@dxos/app-framework';
|
|
6
|
+
import { AppPlugin } from '@dxos/app-toolkit';
|
|
7
|
+
import { Organization, Person } from '@dxos/types';
|
|
8
|
+
|
|
9
|
+
import { meta } from '#meta';
|
|
10
|
+
|
|
11
|
+
export const PreviewPlugin = Plugin.define(meta).pipe(
|
|
12
|
+
AppPlugin.addSchemaModule({ schema: [Person.Person, Organization.Organization] }),
|
|
13
|
+
Plugin.make,
|
|
14
|
+
);
|
|
15
|
+
|
|
16
|
+
export default PreviewPlugin;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright 2026 DXOS.org
|
|
3
|
+
//
|
|
4
|
+
|
|
5
|
+
import { describe, test } from 'vitest';
|
|
6
|
+
|
|
7
|
+
import { ClientPlugin } from '@dxos/plugin-client/plugin';
|
|
8
|
+
import { createComposerTestApp } from '@dxos/plugin-testing/harness';
|
|
9
|
+
|
|
10
|
+
import { PreviewPlugin } from '#plugin';
|
|
11
|
+
|
|
12
|
+
import { meta } from './meta';
|
|
13
|
+
|
|
14
|
+
const moduleId = (name: string) => `${meta.id}.module.${name}`;
|
|
15
|
+
|
|
16
|
+
describe('PreviewPlugin', () => {
|
|
17
|
+
test('modules activate on the expected events', { timeout: 10_000 }, async ({ expect }) => {
|
|
18
|
+
await using harness = await createComposerTestApp({
|
|
19
|
+
plugins: [ClientPlugin({}), PreviewPlugin()],
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
// After autoStart: schema auto-cascades from ClientPlugin.
|
|
23
|
+
expect(harness.manager.getActive()).toContain(moduleId('schema'));
|
|
24
|
+
});
|
|
25
|
+
});
|
package/src/PreviewPlugin.tsx
CHANGED
|
@@ -8,11 +8,10 @@ import { Organization, Person } from '@dxos/types';
|
|
|
8
8
|
|
|
9
9
|
import { PreviewPopover, ReactSurface } from '#capabilities';
|
|
10
10
|
import { meta } from '#meta';
|
|
11
|
-
|
|
12
|
-
import { translations } from './translations';
|
|
11
|
+
import { translations } from '#translations';
|
|
13
12
|
|
|
14
13
|
export const PreviewPlugin = Plugin.define(meta).pipe(
|
|
15
|
-
AppPlugin.addSchemaModule({ schema: [Person.Person, Organization.Organization]
|
|
14
|
+
AppPlugin.addSchemaModule({ schema: [Person.Person, Organization.Organization] }),
|
|
16
15
|
AppPlugin.addSurfaceModule({ activate: ReactSurface }),
|
|
17
16
|
AppPlugin.addTranslationsModule({ translations }),
|
|
18
17
|
Plugin.addModule({
|
|
@@ -22,3 +21,5 @@ export const PreviewPlugin = Plugin.define(meta).pipe(
|
|
|
22
21
|
}),
|
|
23
22
|
Plugin.make,
|
|
24
23
|
);
|
|
24
|
+
|
|
25
|
+
export default PreviewPlugin;
|
|
@@ -12,7 +12,7 @@ import { type Space } from '@dxos/client/echo';
|
|
|
12
12
|
import { Obj } from '@dxos/echo';
|
|
13
13
|
import { DXN } from '@dxos/keys';
|
|
14
14
|
import { log } from '@dxos/log';
|
|
15
|
-
import { ClientCapabilities } from '@dxos/plugin-client
|
|
15
|
+
import { ClientCapabilities } from '@dxos/plugin-client';
|
|
16
16
|
import { DX_ANCHOR_ACTIVATE, type DxAnchorActivate } from '@dxos/react-ui';
|
|
17
17
|
import { type PreviewLinkRef, type PreviewLinkTarget } from '@dxos/ui-editor';
|
|
18
18
|
|
|
@@ -49,9 +49,12 @@ export default Capability.makeModule(
|
|
|
49
49
|
const { invokePromise } = capabilities.get(Capabilities.OperationInvoker);
|
|
50
50
|
const client = capabilities.get(ClientCapabilities.Client);
|
|
51
51
|
const registry = capabilities.get(Capabilities.AtomRegistry);
|
|
52
|
+
// Layout is optional: in standalone harnesses (Storybook, tests) no plugin contributes
|
|
53
|
+
// `AppCapabilities.Layout`, and `getAll` returns an empty array. Reading `registry.get(undefined)`
|
|
54
|
+
// would crash inside Atom's identity check (`'~atom/Serializable' in undefined`). When layout
|
|
55
|
+
// isn't available, fall through to the personal-space default.
|
|
52
56
|
const [layoutAtom] = capabilities.getAll(AppCapabilities.Layout);
|
|
53
|
-
const
|
|
54
|
-
const spaceId = getSpaceIdFromPath(layout.workspace);
|
|
57
|
+
const spaceId = layoutAtom && getSpaceIdFromPath(registry.get(layoutAtom).workspace);
|
|
55
58
|
const space = (spaceId && client.spaces.get(spaceId)) ?? getPersonalSpace(client);
|
|
56
59
|
if (!space) {
|
|
57
60
|
return;
|
|
@@ -10,10 +10,10 @@ import { Surface } from '@dxos/app-framework/ui';
|
|
|
10
10
|
import { AppSurface } from '@dxos/app-toolkit/ui';
|
|
11
11
|
import { Obj } from '@dxos/echo';
|
|
12
12
|
import { Card } from '@dxos/react-ui';
|
|
13
|
-
import { type ProjectionModel } from '@dxos/schema';
|
|
13
|
+
import { Expando, type ProjectionModel } from '@dxos/schema';
|
|
14
14
|
import { Organization, Person, Pipeline, Task } from '@dxos/types';
|
|
15
15
|
|
|
16
|
-
import { FormCard, JsonCard, OrganizationCard, PersonCard, ProjectCard, TaskCard } from '../cards';
|
|
16
|
+
import { ExpandoCard, FormCard, JsonCard, OrganizationCard, PersonCard, ProjectCard, TaskCard } from '../cards';
|
|
17
17
|
|
|
18
18
|
export default Capability.makeModule(() =>
|
|
19
19
|
Effect.succeed(
|
|
@@ -25,50 +25,53 @@ export default Capability.makeModule(() =>
|
|
|
25
25
|
|
|
26
26
|
Surface.create<{ subject: Person.Person }>({
|
|
27
27
|
id: 'schema-popover--contact',
|
|
28
|
-
role: 'card--content',
|
|
29
28
|
position: 'hoist',
|
|
30
|
-
filter: AppSurface.
|
|
29
|
+
filter: AppSurface.object(AppSurface.Card, Person.Person),
|
|
31
30
|
component: ({ data, role }) => {
|
|
32
31
|
return (
|
|
33
32
|
<>
|
|
34
33
|
<PersonCard role={role} subject={data.subject} />
|
|
35
|
-
<Surface.Surface
|
|
34
|
+
<Surface.Surface type={AppSurface.Related} data={data} limit={1} />
|
|
36
35
|
</>
|
|
37
36
|
);
|
|
38
37
|
},
|
|
39
38
|
}),
|
|
40
39
|
Surface.create({
|
|
41
40
|
id: 'schema-popover--organization',
|
|
42
|
-
role: 'card--content',
|
|
43
41
|
position: 'hoist',
|
|
44
|
-
filter: AppSurface.
|
|
42
|
+
filter: AppSurface.object(AppSurface.Card, Organization.Organization),
|
|
45
43
|
component: ({ data, role }) => {
|
|
46
44
|
return (
|
|
47
45
|
<>
|
|
48
46
|
<OrganizationCard role={role} subject={data.subject} />
|
|
49
|
-
<Surface.Surface
|
|
47
|
+
<Surface.Surface type={AppSurface.Related} data={data} limit={1} />
|
|
50
48
|
</>
|
|
51
49
|
);
|
|
52
50
|
},
|
|
53
51
|
}),
|
|
54
52
|
Surface.create({
|
|
55
53
|
id: 'schema-popover--project',
|
|
56
|
-
role: 'card--content',
|
|
57
54
|
position: 'hoist',
|
|
58
|
-
filter: AppSurface.
|
|
55
|
+
filter: AppSurface.object(AppSurface.Card, Pipeline.Pipeline),
|
|
59
56
|
component: ({ data, role }) => {
|
|
60
57
|
return <ProjectCard role={role} subject={data.subject} />;
|
|
61
58
|
},
|
|
62
59
|
}),
|
|
63
60
|
Surface.create({
|
|
64
61
|
id: 'schema-popover--task',
|
|
65
|
-
role: 'card--content',
|
|
66
62
|
position: 'hoist',
|
|
67
|
-
filter: AppSurface.
|
|
63
|
+
filter: AppSurface.object(AppSurface.Card, Task.Task),
|
|
68
64
|
component: ({ data, role }) => {
|
|
69
65
|
return <TaskCard role={role} subject={data.subject} />;
|
|
70
66
|
},
|
|
71
67
|
}),
|
|
68
|
+
Surface.create<AppSurface.ObjectCardData<Expando.Expando>>({
|
|
69
|
+
id: 'schema-popover--expando',
|
|
70
|
+
filter: AppSurface.object(AppSurface.Card, Expando.Expando),
|
|
71
|
+
component: ({ data, role }) => {
|
|
72
|
+
return <ExpandoCard role={role} subject={data.subject} ignorePaths={data.ignorePaths} />;
|
|
73
|
+
},
|
|
74
|
+
}),
|
|
72
75
|
|
|
73
76
|
//
|
|
74
77
|
// Fallback for any object.
|
|
@@ -96,15 +99,14 @@ export default Capability.makeModule(() =>
|
|
|
96
99
|
|
|
97
100
|
Surface.create({
|
|
98
101
|
id: 'section',
|
|
99
|
-
role: ['section'],
|
|
100
102
|
position: 'fallback',
|
|
101
|
-
filter: AppSurface.
|
|
103
|
+
filter: AppSurface.subject(AppSurface.Section, Obj.isObject),
|
|
102
104
|
component: ({ data }) => {
|
|
103
105
|
return (
|
|
104
|
-
<div
|
|
105
|
-
<div
|
|
106
|
+
<div className='flex w-full justify-center'>
|
|
107
|
+
<div className='py-2 dx-card-min-width dx-card-max-width'>
|
|
106
108
|
<Card.Root>
|
|
107
|
-
<Surface.Surface
|
|
109
|
+
<Surface.Surface type={AppSurface.Card} data={data} limit={1} />
|
|
108
110
|
</Card.Root>
|
|
109
111
|
</div>
|
|
110
112
|
</div>
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright 2026 DXOS.org
|
|
3
|
+
//
|
|
4
|
+
|
|
5
|
+
import * as Schema from 'effect/Schema';
|
|
6
|
+
import React, { useCallback, useMemo } from 'react';
|
|
7
|
+
|
|
8
|
+
import { type AppSurface } from '@dxos/app-toolkit/ui';
|
|
9
|
+
import { Obj } from '@dxos/echo';
|
|
10
|
+
import { type JsonPath, splitJsonPath } from '@dxos/effect';
|
|
11
|
+
import { Card } from '@dxos/react-ui';
|
|
12
|
+
import { Form } from '@dxos/react-ui-form';
|
|
13
|
+
|
|
14
|
+
const schemaForValue = (value: unknown): Schema.Schema.AnyNoContext | undefined => {
|
|
15
|
+
switch (typeof value) {
|
|
16
|
+
case 'string':
|
|
17
|
+
return Schema.String;
|
|
18
|
+
case 'number':
|
|
19
|
+
return Schema.Number;
|
|
20
|
+
case 'boolean':
|
|
21
|
+
return Schema.Boolean;
|
|
22
|
+
default:
|
|
23
|
+
return undefined;
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Reserved keys: `id`, plus any `~`-prefixed key (ECHO uses `~`-prefixed
|
|
29
|
+
* string keys to brand entity instances and schemas — KindId,
|
|
30
|
+
* SchemaKindId, SnapshotKindId, etc. — and the `~` namespace is reserved
|
|
31
|
+
* for that purpose). They show up in `Object.keys` but aren't user data.
|
|
32
|
+
*/
|
|
33
|
+
const isInternalKey = (key: string) => key === 'id' || key.startsWith('~');
|
|
34
|
+
|
|
35
|
+
export const ExpandoCard = ({ subject, ignorePaths }: AppSurface.ObjectCardProps) => {
|
|
36
|
+
const schema = useMemo(() => {
|
|
37
|
+
const ignored = new Set(ignorePaths ?? []);
|
|
38
|
+
const fields: Record<string, Schema.Schema.AnyNoContext> = {};
|
|
39
|
+
for (const key of Object.keys(subject)) {
|
|
40
|
+
if (isInternalKey(key) || ignored.has(key)) {
|
|
41
|
+
continue;
|
|
42
|
+
}
|
|
43
|
+
const fieldSchema = schemaForValue((subject as any)[key]);
|
|
44
|
+
if (fieldSchema) {
|
|
45
|
+
fields[key] = fieldSchema;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
return Schema.Struct(fields);
|
|
49
|
+
}, [subject, ignorePaths]);
|
|
50
|
+
|
|
51
|
+
const handleSave = useCallback(
|
|
52
|
+
(values: any, { changed }: { changed: Record<string, boolean> }) => {
|
|
53
|
+
const paths = Object.keys(changed).filter((path) => changed[path]);
|
|
54
|
+
Obj.update(subject, () => {
|
|
55
|
+
for (const path of paths) {
|
|
56
|
+
const value = values[path];
|
|
57
|
+
const parts = splitJsonPath(path as JsonPath);
|
|
58
|
+
Obj.setValue(subject, parts, value);
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
},
|
|
62
|
+
[subject],
|
|
63
|
+
);
|
|
64
|
+
|
|
65
|
+
return (
|
|
66
|
+
<Card.Content>
|
|
67
|
+
<Form.Root schema={schema} values={subject} autoSave onSave={handleSave}>
|
|
68
|
+
<Form.Viewport>
|
|
69
|
+
<Form.Content>
|
|
70
|
+
<Form.FieldSet />
|
|
71
|
+
</Form.Content>
|
|
72
|
+
</Form.Viewport>
|
|
73
|
+
</Form.Root>
|
|
74
|
+
</Card.Content>
|
|
75
|
+
);
|
|
76
|
+
};
|
package/src/cards/FormCard.tsx
CHANGED
|
@@ -21,7 +21,7 @@ export const FormCard = ({ subject, projection }: AppSurface.ObjectCardProps & {
|
|
|
21
21
|
|
|
22
22
|
const handleSave = useCallback((values: any, { changed }: { changed: Record<string, boolean> }) => {
|
|
23
23
|
const paths = Object.keys(changed).filter((path) => changed[path]);
|
|
24
|
-
Obj.
|
|
24
|
+
Obj.update(subject, () => {
|
|
25
25
|
for (const path of paths) {
|
|
26
26
|
const value = values[path];
|
|
27
27
|
const parts = splitJsonPath(path as JsonPath);
|
package/src/cards/JsonCard.tsx
CHANGED
|
@@ -5,12 +5,15 @@
|
|
|
5
5
|
import React from 'react';
|
|
6
6
|
|
|
7
7
|
import { Card } from '@dxos/react-ui';
|
|
8
|
-
import {
|
|
8
|
+
import { JsonHighlighter } from '@dxos/react-ui-syntax-highlighter';
|
|
9
9
|
|
|
10
10
|
export const JsonCard = ({ data }: { data: unknown }) => {
|
|
11
11
|
return (
|
|
12
12
|
<Card.Content>
|
|
13
|
-
<
|
|
13
|
+
<span />
|
|
14
|
+
{/* TODO(wittjosiah): Span whole row. */}
|
|
15
|
+
<JsonHighlighter data={data} />
|
|
16
|
+
<span />
|
|
14
17
|
</Card.Content>
|
|
15
18
|
);
|
|
16
19
|
};
|
package/src/cards/index.ts
CHANGED
package/src/index.ts
CHANGED
package/src/plugin.ts
ADDED
|
@@ -9,12 +9,14 @@ import { withPluginManager } from '@dxos/app-framework/testing';
|
|
|
9
9
|
import { corePlugins } from '@dxos/plugin-testing';
|
|
10
10
|
import { random } from '@dxos/random';
|
|
11
11
|
import { Card } from '@dxos/react-ui';
|
|
12
|
-
import { withLayout } from '@dxos/react-ui/testing';
|
|
12
|
+
import { withLayout, withTheme } from '@dxos/react-ui/testing';
|
|
13
|
+
import { type Expando } from '@dxos/schema';
|
|
13
14
|
import { type Organization, type Person, type Pipeline, type Task } from '@dxos/types';
|
|
14
15
|
|
|
15
|
-
import {
|
|
16
|
-
|
|
17
|
-
import {
|
|
16
|
+
import { translations } from '#translations';
|
|
17
|
+
|
|
18
|
+
import { ExpandoCard, FormCard, JsonCard, OrganizationCard, PersonCard, ProjectCard, TaskCard } from '../cards';
|
|
19
|
+
import { DefaultStory, createExpando, createOrganization, createPerson, createProject, createTask } from './testing';
|
|
18
20
|
|
|
19
21
|
random.seed(999);
|
|
20
22
|
|
|
@@ -22,6 +24,11 @@ const meta = {
|
|
|
22
24
|
title: 'plugins/plugin-preview/cards/Card',
|
|
23
25
|
render: DefaultStory,
|
|
24
26
|
decorators: [
|
|
27
|
+
// `Card` and its descendants in `@dxos/react-ui` consume `ThemeContext`
|
|
28
|
+
// for tx-token resolution; without this the stories trip the surface's
|
|
29
|
+
// `ErrorBoundary` with "Missing ThemeContext" and the storybook test
|
|
30
|
+
// assert-no-error fails.
|
|
31
|
+
withTheme(),
|
|
25
32
|
withLayout({ layout: 'fullscreen' }),
|
|
26
33
|
// TODO(wittjosiah): Try to write story which does not depend on plugin manager.
|
|
27
34
|
withPluginManager({ plugins: corePlugins() }),
|
|
@@ -75,6 +82,13 @@ export const _Task: StoryObj<typeof DefaultStory<Task.Task>> = {
|
|
|
75
82
|
},
|
|
76
83
|
};
|
|
77
84
|
|
|
85
|
+
export const _Expando: StoryObj<typeof DefaultStory<Expando.Expando>> = {
|
|
86
|
+
args: {
|
|
87
|
+
Component: ExpandoCard,
|
|
88
|
+
createObject: createExpando,
|
|
89
|
+
},
|
|
90
|
+
};
|
|
91
|
+
|
|
78
92
|
export const _Json = {
|
|
79
93
|
render: () => {
|
|
80
94
|
const data = {
|
package/src/stories/testing.tsx
CHANGED
|
@@ -9,6 +9,7 @@ import { Obj, Ref } from '@dxos/echo';
|
|
|
9
9
|
import { random } from '@dxos/random';
|
|
10
10
|
import { Card } from '@dxos/react-ui';
|
|
11
11
|
import { CardContainer, type CardContainerProps } from '@dxos/react-ui-mosaic/testing';
|
|
12
|
+
import { Expando } from '@dxos/schema';
|
|
12
13
|
import { Organization, Person, Pipeline, Task } from '@dxos/types';
|
|
13
14
|
|
|
14
15
|
export type DefaultStoryProps<T extends Obj.Any> = {
|
|
@@ -89,3 +90,12 @@ export const createTask = (): Task.Task => {
|
|
|
89
90
|
status: random.helpers.arrayElement(['todo', 'in-progress', 'done'] as const),
|
|
90
91
|
});
|
|
91
92
|
};
|
|
93
|
+
|
|
94
|
+
export const createExpando = (): Expando.Expando => {
|
|
95
|
+
return Expando.make({
|
|
96
|
+
name: random.person.fullName(),
|
|
97
|
+
email: random.internet.email(),
|
|
98
|
+
age: random.number.int({ min: 18, max: 80 }),
|
|
99
|
+
active: random.datatype.boolean(),
|
|
100
|
+
});
|
|
101
|
+
};
|
package/src/testing.ts
ADDED
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
// src/meta.ts
|
|
2
|
-
import { trim } from "@dxos/util";
|
|
3
|
-
var meta = {
|
|
4
|
-
id: "org.dxos.plugin.preview",
|
|
5
|
-
name: "Preview",
|
|
6
|
-
description: trim`
|
|
7
|
-
Rich preview panel for viewing object content without opening full editors.
|
|
8
|
-
Quick peek at documents, images, and data with inline rendering.
|
|
9
|
-
`,
|
|
10
|
-
icon: "ph--eye--regular",
|
|
11
|
-
source: "https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-preview"
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
// src/PreviewPlugin.tsx
|
|
15
|
-
import { ActivationEvents, Plugin } from "@dxos/app-framework";
|
|
16
|
-
import { AppPlugin } from "@dxos/app-toolkit";
|
|
17
|
-
import { Organization, Person } from "@dxos/types";
|
|
18
|
-
import { PreviewPopover, ReactSurface } from "#capabilities";
|
|
19
|
-
import { meta as meta3 } from "#meta";
|
|
20
|
-
|
|
21
|
-
// src/translations.ts
|
|
22
|
-
import { meta as meta2 } from "#meta";
|
|
23
|
-
var translations = [
|
|
24
|
-
{
|
|
25
|
-
"en-US": {
|
|
26
|
-
[meta2.id]: {
|
|
27
|
-
"unable-to-create-preview.message": "No preview",
|
|
28
|
-
"todo.label": "To do",
|
|
29
|
-
"in-progress.label": "In progress",
|
|
30
|
-
"done.label": "Done",
|
|
31
|
-
"open-object.label": "Open",
|
|
32
|
-
"add-object-to-space.label": "Add to space",
|
|
33
|
-
"more-options.label": "More options"
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
];
|
|
38
|
-
|
|
39
|
-
// src/PreviewPlugin.tsx
|
|
40
|
-
var PreviewPlugin = Plugin.define(meta3).pipe(AppPlugin.addSchemaModule({
|
|
41
|
-
schema: [
|
|
42
|
-
Person.Person,
|
|
43
|
-
Organization.Organization
|
|
44
|
-
],
|
|
45
|
-
id: "schema"
|
|
46
|
-
}), AppPlugin.addSurfaceModule({
|
|
47
|
-
activate: ReactSurface
|
|
48
|
-
}), AppPlugin.addTranslationsModule({
|
|
49
|
-
translations
|
|
50
|
-
}), Plugin.addModule({
|
|
51
|
-
id: "preview-popover",
|
|
52
|
-
activatesOn: ActivationEvents.Startup,
|
|
53
|
-
activate: PreviewPopover
|
|
54
|
-
}), Plugin.make);
|
|
55
|
-
export {
|
|
56
|
-
PreviewPlugin,
|
|
57
|
-
meta
|
|
58
|
-
};
|
|
59
|
-
//# sourceMappingURL=index.mjs.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/meta.ts", "../../../src/PreviewPlugin.tsx", "../../../src/translations.ts"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Plugin } from '@dxos/app-framework';\nimport { trim } from '@dxos/util';\n\nexport const meta: Plugin.Meta = {\n id: 'org.dxos.plugin.preview',\n name: 'Preview',\n description: trim`\n Rich preview panel for viewing object content without opening full editors.\n Quick peek at documents, images, and data with inline rendering.\n `,\n icon: 'ph--eye--regular',\n source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-preview',\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { ActivationEvents, Plugin } from '@dxos/app-framework';\nimport { AppPlugin } from '@dxos/app-toolkit';\nimport { Organization, Person } from '@dxos/types';\n\nimport { PreviewPopover, ReactSurface } from '#capabilities';\nimport { meta } from '#meta';\n\nimport { translations } from './translations';\n\nexport const PreviewPlugin = Plugin.define(meta).pipe(\n AppPlugin.addSchemaModule({ schema: [Person.Person, Organization.Organization], id: 'schema' }),\n AppPlugin.addSurfaceModule({ activate: ReactSurface }),\n AppPlugin.addTranslationsModule({ translations }),\n Plugin.addModule({\n id: 'preview-popover',\n activatesOn: ActivationEvents.Startup,\n activate: PreviewPopover,\n }),\n Plugin.make,\n);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nimport { meta } from '#meta';\n\nexport const translations = [\n {\n 'en-US': {\n [meta.id]: {\n 'unable-to-create-preview.message': 'No preview',\n 'todo.label': 'To do',\n 'in-progress.label': 'In progress',\n 'done.label': 'Done',\n 'open-object.label': 'Open',\n 'add-object-to-space.label': 'Add to space',\n 'more-options.label': 'More options',\n },\n },\n },\n] as const satisfies Resource[];\n"],
|
|
5
|
-
"mappings": ";AAKA,SAASA,YAAY;AAEd,IAAMC,OAAoB;EAC/BC,IAAI;EACJC,MAAM;EACNC,aAAaC;;;;EAIbC,MAAM;EACNC,QAAQ;AACV;;;ACZA,SAASC,kBAAkBC,cAAc;AACzC,SAASC,iBAAiB;AAC1B,SAASC,cAAcC,cAAc;AAErC,SAASC,gBAAgBC,oBAAoB;AAC7C,SAASC,QAAAA,aAAY;;;ACHrB,SAASC,QAAAA,aAAY;AAEd,IAAMC,eAAe;EAC1B;IACE,SAAS;MACP,CAACC,MAAKC,EAAE,GAAG;QACT,oCAAoC;QACpC,cAAc;QACd,qBAAqB;QACrB,cAAc;QACd,qBAAqB;QACrB,6BAA6B;QAC7B,sBAAsB;MACxB;IACF;EACF;;;;ADRK,IAAMC,gBAAgBC,OAAOC,OAAOC,KAAAA,EAAMC,KAC/CC,UAAUC,gBAAgB;EAAEC,QAAQ;IAACC,OAAOA;IAAQC,aAAaA;;EAAeC,IAAI;AAAS,CAAA,GAC7FL,UAAUM,iBAAiB;EAAEC,UAAUC;AAAa,CAAA,GACpDR,UAAUS,sBAAsB;EAAEC;AAAa,CAAA,GAC/Cd,OAAOe,UAAU;EACfN,IAAI;EACJO,aAAaC,iBAAiBC;EAC9BP,UAAUQ;AACZ,CAAA,GACAnB,OAAOoB,IAAI;",
|
|
6
|
-
"names": ["trim", "meta", "id", "name", "description", "trim", "icon", "source", "ActivationEvents", "Plugin", "AppPlugin", "Organization", "Person", "PreviewPopover", "ReactSurface", "meta", "meta", "translations", "meta", "id", "PreviewPlugin", "Plugin", "define", "meta", "pipe", "AppPlugin", "addSchemaModule", "schema", "Person", "Organization", "id", "addSurfaceModule", "activate", "ReactSurface", "addTranslationsModule", "translations", "addModule", "activatesOn", "ActivationEvents", "Startup", "PreviewPopover", "make"]
|
|
7
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"inputs":{"src/meta.ts":{"bytes":1673,"imports":[{"path":"@dxos/util","kind":"import-statement","external":true}],"format":"esm"},"src/translations.ts":{"bytes":1898,"imports":[{"path":"#meta","kind":"import-statement","external":true}],"format":"esm"},"src/PreviewPlugin.tsx":{"bytes":3181,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-toolkit","kind":"import-statement","external":true},{"path":"@dxos/types","kind":"import-statement","external":true},{"path":"#capabilities","kind":"import-statement","external":true},{"path":"#meta","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"./translations"}],"format":"esm"},"src/index.ts":{"bytes":555,"imports":[{"path":"src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"src/PreviewPlugin.tsx","kind":"import-statement","original":"./PreviewPlugin"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3249},"dist/lib/browser/index.mjs":{"imports":[{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-toolkit","kind":"import-statement","external":true},{"path":"@dxos/types","kind":"import-statement","external":true},{"path":"#capabilities","kind":"import-statement","external":true},{"path":"#meta","kind":"import-statement","external":true},{"path":"#meta","kind":"import-statement","external":true}],"exports":["PreviewPlugin","meta"],"entryPoint":"src/index.ts","inputs":{"src/meta.ts":{"bytesInOutput":389},"src/index.ts":{"bytesInOutput":0},"src/PreviewPlugin.tsx":{"bytesInOutput":664},"src/translations.ts":{"bytesInOutput":418}},"bytes":1633}}}
|