@dxos/plugin-board 0.8.4-main.fd6878d → 0.8.4-staging.60fe92afc8

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 (114) hide show
  1. package/LICENSE +102 -5
  2. package/PLUGIN.mdl +337 -0
  3. package/README.md +1 -1
  4. package/dist/lib/neutral/BoardArticle-H65K4YGV.mjs +167 -0
  5. package/dist/lib/neutral/BoardArticle-H65K4YGV.mjs.map +7 -0
  6. package/dist/lib/neutral/BoardPlugin.mjs +42 -0
  7. package/dist/lib/neutral/BoardPlugin.mjs.map +7 -0
  8. package/dist/lib/neutral/capabilities/index.mjs +11 -0
  9. package/dist/lib/neutral/capabilities/index.mjs.map +7 -0
  10. package/dist/lib/neutral/chunk-HUBZKCPA.mjs +32 -0
  11. package/dist/lib/neutral/chunk-HUBZKCPA.mjs.map +7 -0
  12. package/dist/lib/neutral/chunk-J5LGTIGS.mjs +10 -0
  13. package/dist/lib/neutral/chunk-RDP4SXIW.mjs +34 -0
  14. package/dist/lib/neutral/chunk-RDP4SXIW.mjs.map +7 -0
  15. package/dist/lib/neutral/components/index.mjs +1 -0
  16. package/dist/lib/neutral/containers/index.mjs +9 -0
  17. package/dist/lib/neutral/containers/index.mjs.map +7 -0
  18. package/dist/lib/neutral/create-object-BRISOU7F.mjs +28 -0
  19. package/dist/lib/neutral/create-object-BRISOU7F.mjs.map +7 -0
  20. package/dist/lib/neutral/index.mjs +12 -0
  21. package/dist/lib/neutral/index.mjs.map +7 -0
  22. package/dist/lib/neutral/meta.json +1 -0
  23. package/dist/lib/neutral/meta.mjs +8 -0
  24. package/dist/lib/neutral/meta.mjs.map +7 -0
  25. package/dist/lib/neutral/plugin.mjs +12 -0
  26. package/dist/lib/neutral/plugin.mjs.map +7 -0
  27. package/dist/lib/neutral/react-surface-M5JHK3ZQ.mjs +26 -0
  28. package/dist/lib/neutral/react-surface-M5JHK3ZQ.mjs.map +7 -0
  29. package/dist/lib/neutral/translations.mjs +30 -0
  30. package/dist/lib/neutral/translations.mjs.map +7 -0
  31. package/dist/lib/{browser → neutral}/types/index.mjs +2 -1
  32. package/dist/lib/neutral/types/index.mjs.map +7 -0
  33. package/dist/types/src/BoardPlugin.d.ts +3 -1
  34. package/dist/types/src/BoardPlugin.d.ts.map +1 -1
  35. package/dist/types/src/BoardPlugin.test.d.ts +2 -0
  36. package/dist/types/src/BoardPlugin.test.d.ts.map +1 -0
  37. package/dist/types/src/capabilities/create-object.d.ts +11 -0
  38. package/dist/types/src/capabilities/create-object.d.ts.map +1 -0
  39. package/dist/types/src/capabilities/index.d.ts +8 -2
  40. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  41. package/dist/types/src/capabilities/react-surface.d.ts +3 -2
  42. package/dist/types/src/capabilities/react-surface.d.ts.map +1 -1
  43. package/dist/types/src/components/index.d.ts +0 -1
  44. package/dist/types/src/components/index.d.ts.map +1 -1
  45. package/dist/types/src/containers/BoardArticle/BoardArticle.d.ts +6 -0
  46. package/dist/types/src/containers/BoardArticle/BoardArticle.d.ts.map +1 -0
  47. package/dist/types/src/containers/BoardArticle/BoardArticle.stories.d.ts +54 -0
  48. package/dist/types/src/containers/BoardArticle/BoardArticle.stories.d.ts.map +1 -0
  49. package/dist/types/src/containers/BoardArticle/index.d.ts +2 -0
  50. package/dist/types/src/containers/BoardArticle/index.d.ts.map +1 -0
  51. package/dist/types/src/containers/index.d.ts +3 -0
  52. package/dist/types/src/containers/index.d.ts.map +1 -0
  53. package/dist/types/src/index.d.ts +0 -2
  54. package/dist/types/src/index.d.ts.map +1 -1
  55. package/dist/types/src/meta.d.ts +2 -2
  56. package/dist/types/src/meta.d.ts.map +1 -1
  57. package/dist/types/src/plugin.d.ts +3 -0
  58. package/dist/types/src/plugin.d.ts.map +1 -0
  59. package/dist/types/src/translations.d.ts +22 -13
  60. package/dist/types/src/translations.d.ts.map +1 -1
  61. package/dist/types/src/types/Board.d.ts +28 -71
  62. package/dist/types/src/types/Board.d.ts.map +1 -1
  63. package/dist/types/tsconfig.tsbuildinfo +1 -1
  64. package/package.json +95 -60
  65. package/src/BoardPlugin.test.ts +27 -0
  66. package/src/BoardPlugin.tsx +22 -52
  67. package/src/capabilities/create-object.ts +31 -0
  68. package/src/capabilities/index.ts +3 -3
  69. package/src/capabilities/react-surface.tsx +23 -14
  70. package/src/components/index.ts +0 -2
  71. package/src/containers/BoardArticle/BoardArticle.stories.tsx +122 -0
  72. package/src/containers/BoardArticle/BoardArticle.tsx +185 -0
  73. package/src/containers/BoardArticle/index.ts +5 -0
  74. package/src/containers/index.ts +7 -0
  75. package/src/index.ts +0 -3
  76. package/src/meta.ts +20 -6
  77. package/src/plugin.ts +9 -0
  78. package/src/translations.ts +14 -11
  79. package/src/types/Board.ts +9 -25
  80. package/src/vite-env.d.ts +10 -0
  81. package/dist/lib/browser/chunk-2AR36W5A.mjs +0 -119
  82. package/dist/lib/browser/chunk-2AR36W5A.mjs.map +0 -7
  83. package/dist/lib/browser/chunk-V67SBM4U.mjs +0 -59
  84. package/dist/lib/browser/chunk-V67SBM4U.mjs.map +0 -7
  85. package/dist/lib/browser/index.mjs +0 -91
  86. package/dist/lib/browser/index.mjs.map +0 -7
  87. package/dist/lib/browser/intent-resolver-6NM32ZSV.mjs +0 -33
  88. package/dist/lib/browser/intent-resolver-6NM32ZSV.mjs.map +0 -7
  89. package/dist/lib/browser/meta.json +0 -1
  90. package/dist/lib/browser/react-surface-S7H45RGL.mjs +0 -30
  91. package/dist/lib/browser/react-surface-S7H45RGL.mjs.map +0 -7
  92. package/dist/lib/node-esm/chunk-AWGKINO6.mjs +0 -121
  93. package/dist/lib/node-esm/chunk-AWGKINO6.mjs.map +0 -7
  94. package/dist/lib/node-esm/chunk-XCGDC6OV.mjs +0 -60
  95. package/dist/lib/node-esm/chunk-XCGDC6OV.mjs.map +0 -7
  96. package/dist/lib/node-esm/index.mjs +0 -92
  97. package/dist/lib/node-esm/index.mjs.map +0 -7
  98. package/dist/lib/node-esm/intent-resolver-5DQ5PPTT.mjs +0 -34
  99. package/dist/lib/node-esm/intent-resolver-5DQ5PPTT.mjs.map +0 -7
  100. package/dist/lib/node-esm/meta.json +0 -1
  101. package/dist/lib/node-esm/react-surface-UGBLNFXL.mjs +0 -31
  102. package/dist/lib/node-esm/react-surface-UGBLNFXL.mjs.map +0 -7
  103. package/dist/lib/node-esm/types/index.mjs +0 -8
  104. package/dist/types/src/capabilities/intent-resolver.d.ts +0 -4
  105. package/dist/types/src/capabilities/intent-resolver.d.ts.map +0 -1
  106. package/dist/types/src/components/BoardContainer.d.ts +0 -8
  107. package/dist/types/src/components/BoardContainer.d.ts.map +0 -1
  108. package/dist/types/src/components/BoardContainer.stories.d.ts +0 -8
  109. package/dist/types/src/components/BoardContainer.stories.d.ts.map +0 -1
  110. package/src/capabilities/intent-resolver.ts +0 -34
  111. package/src/components/BoardContainer.stories.tsx +0 -143
  112. package/src/components/BoardContainer.tsx +0 -104
  113. /package/dist/lib/{browser/types/index.mjs.map → neutral/chunk-J5LGTIGS.mjs.map} +0 -0
  114. /package/dist/lib/{node-esm/types → neutral/components}/index.mjs.map +0 -0
@@ -0,0 +1,185 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { useAtomValue } from '@effect-atom/atom-react';
6
+ import * as Atom from '@effect-atom/atom/Atom';
7
+ import React, { useCallback, useMemo, useRef, useState } from 'react';
8
+
9
+ import { Surface } from '@dxos/app-framework/ui';
10
+ import { AppSurface } from '@dxos/app-toolkit/ui';
11
+ import { Filter, Obj, Ref } from '@dxos/echo';
12
+ import { useObject } from '@dxos/echo-react';
13
+ import { invariant } from '@dxos/invariant';
14
+ import { EID } from '@dxos/keys';
15
+ import { Markdown } from '@dxos/plugin-markdown';
16
+ import { useQuery } from '@dxos/react-client/echo';
17
+ import { Panel } from '@dxos/react-ui';
18
+ import { useAttention } from '@dxos/react-ui-attention';
19
+ import { Board, type BoardController, type BoardRootProps, type Position } from '@dxos/react-ui-board';
20
+ import { ObjectPicker, type ObjectPickerContentProps } from '@dxos/react-ui-form';
21
+ import { isNonNullable } from '@dxos/util';
22
+
23
+ import { type Board as BoardType } from '#types';
24
+
25
+ const DEFAULT_POSITION = { x: 0, y: 0 } satisfies Position;
26
+
27
+ type PickerState = {
28
+ position: Position;
29
+ };
30
+
31
+ export type BoardArticleProps = AppSurface.ObjectArticleProps<BoardType.Board>;
32
+
33
+ export const BoardArticle = ({ role, subject: board, attendableId }: BoardArticleProps) => {
34
+ const { hasAttention } = useAttention(attendableId);
35
+ const db = Obj.getDatabase(board);
36
+ const [boardItems] = useObject(board, 'items');
37
+ const itemsAtom = useMemo(
38
+ () =>
39
+ Atom.make((get) => {
40
+ const result: Obj.Unknown[] = [];
41
+ for (const ref of boardItems ?? []) {
42
+ const obj = get(Obj.atomReactive(ref));
43
+ if (obj) {
44
+ result.push(obj);
45
+ }
46
+ }
47
+ return result;
48
+ }),
49
+ [boardItems],
50
+ );
51
+ const items = useAtomValue(itemsAtom);
52
+
53
+ const controller = useRef<BoardController>(null);
54
+ const addTriggerRef = useRef<HTMLButtonElement | null>(null);
55
+ const [pickerState, setPickerState] = useState<PickerState | null>(null);
56
+
57
+ // TODO(burdon): Use search.
58
+ const objects = useQuery(db, Filter.everything());
59
+ const options = useMemo<ObjectPickerContentProps['options']>(
60
+ () =>
61
+ objects
62
+ .filter((obj) => obj.id !== board.id)
63
+ .map((obj) => {
64
+ const label = Obj.getLabel(obj);
65
+ if (label) {
66
+ return {
67
+ id: obj.id,
68
+ label,
69
+ hue: 'neutral' as const,
70
+ };
71
+ }
72
+ })
73
+ .filter(isNonNullable)
74
+ .sort(({ label: a }, { label: b }) => a.toLocaleLowerCase().localeCompare(b.toLocaleLowerCase())),
75
+ [objects],
76
+ );
77
+
78
+ const handleAdd = useCallback<NonNullable<BoardRootProps['onAdd']>>(
79
+ async (anchor, position) => {
80
+ const db = Obj.getDatabase(board);
81
+ invariant(db);
82
+ // Grid backdrop "+" supplies a position → create a new Markdown document directly.
83
+ // Toolbar "+" omits position → fall back to the picker over existing objects.
84
+ if (position) {
85
+ const doc = db.add(Markdown.make());
86
+ Obj.update(board, (board) => {
87
+ board.items.push(Ref.make(doc));
88
+ board.layout.cells[doc.id.toString()] = position;
89
+ });
90
+ return;
91
+ }
92
+
93
+ addTriggerRef.current = anchor;
94
+ setPickerState({ position: DEFAULT_POSITION });
95
+ },
96
+ [board],
97
+ );
98
+
99
+ // TODO(burdon): Use intents so can be undone.
100
+ const handleDelete = useCallback<NonNullable<BoardRootProps['onDelete']>>(
101
+ (id) => {
102
+ // TODO(burdon): Impl. DXN.equals and pass in DXN from `id`.
103
+ const idx = board.items.findIndex((ref) => {
104
+ const echoUri = EID.tryParse(ref.uri);
105
+ return (echoUri ? EID.getEntityId(echoUri) : undefined) === id;
106
+ });
107
+ Obj.update(board, (board) => {
108
+ if (idx !== -1) {
109
+ board.items.splice(idx, 1);
110
+ }
111
+ delete board.layout.cells[id];
112
+ });
113
+ },
114
+ [board],
115
+ );
116
+
117
+ const handleMove = useCallback<NonNullable<BoardRootProps['onMove']>>(
118
+ (id, position) => {
119
+ const layout = board.layout.cells[id];
120
+ Obj.update(board, (board) => {
121
+ board.layout.cells[id] = { ...layout, ...position };
122
+ });
123
+ },
124
+ [board],
125
+ );
126
+
127
+ const handleSelect = useCallback<NonNullable<ObjectPickerContentProps['onSelect']>>(
128
+ (id) => {
129
+ if (!pickerState) {
130
+ return;
131
+ }
132
+
133
+ // Find the selected object by id from the space.
134
+ const selectedObject = objects.find((obj) => obj.id === id);
135
+ if (!Obj.isObject(selectedObject)) {
136
+ return;
137
+ }
138
+
139
+ // Create a reference to the selected object and add it to the board.
140
+ Obj.update(board, (board) => {
141
+ board.items.push(Ref.make(selectedObject));
142
+
143
+ // Set the layout position for the new item.
144
+ board.layout.cells[selectedObject.id.toString()] = pickerState.position;
145
+ });
146
+
147
+ // Close the picker.
148
+ setPickerState(null);
149
+ },
150
+ [pickerState, objects, board],
151
+ );
152
+
153
+ return (
154
+ <Board.Root ref={controller} layout={board.layout} onAdd={handleAdd} onDelete={handleDelete} onMove={handleMove}>
155
+ <ObjectPicker.Root
156
+ open={!!pickerState}
157
+ onOpenChange={(nextOpen: boolean) => {
158
+ setPickerState(nextOpen ? { position: DEFAULT_POSITION } : null);
159
+ }}
160
+ >
161
+ <Panel.Root role={role}>
162
+ <Panel.Toolbar asChild>
163
+ <Board.Toolbar disabled={!hasAttention} />
164
+ </Panel.Toolbar>
165
+ <Panel.Content asChild>
166
+ <Board.Container>
167
+ <Board.Viewport classNames='border-none'>
168
+ <Board.Backdrop />
169
+ <Board.Content>
170
+ {items?.map((item, index) => (
171
+ <Board.Cell item={item} key={index} layout={board.layout?.cells[item.id] ?? { x: 0, y: 0 }}>
172
+ <Surface.Surface type={AppSurface.Card} data={{ subject: item, editable: true }} limit={1} />
173
+ </Board.Cell>
174
+ ))}
175
+ </Board.Content>
176
+ </Board.Viewport>
177
+ </Board.Container>
178
+ </Panel.Content>
179
+ </Panel.Root>
180
+ <ObjectPicker.Content options={options} onSelect={handleSelect} classNames='dx-card-popover-width' />
181
+ <ObjectPicker.VirtualTrigger virtualRef={addTriggerRef} />
182
+ </ObjectPicker.Root>
183
+ </Board.Root>
184
+ );
185
+ };
@@ -0,0 +1,5 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ export { BoardArticle as default } from './BoardArticle';
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { type ComponentType, lazy } from 'react';
6
+
7
+ export const BoardArticle: ComponentType<any> = lazy(() => import('./BoardArticle'));
package/src/index.ts CHANGED
@@ -2,8 +2,5 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
4
 
5
- export * from './components';
6
5
  export * from './meta';
7
6
  export * from './types';
8
-
9
- export * from './BoardPlugin';
package/src/meta.ts CHANGED
@@ -2,14 +2,28 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { type PluginMeta } from '@dxos/app-framework';
5
+ import { Plugin } from '@dxos/app-framework';
6
+ import { DXN } from '@dxos/keys';
7
+ import { trim } from '@dxos/util';
6
8
 
7
- export const meta: PluginMeta = {
8
- id: 'dxos.org/plugin/board',
9
+ export const meta = Plugin.makeMeta({
10
+ key: DXN.make('org.dxos.plugin.board'),
9
11
  name: 'Board',
10
- description:
11
- 'A spatial, infinite canvas app combining notes, media, and whiteboarding in a tactile, visual interface.',
12
+ author: 'DXOS',
13
+ description: trim`
14
+ Board is an infinite spatial canvas that lets you place any ECHO object — documents, tasks, notes, or rich media — anywhere on a two-dimensional grid.
15
+ Items are arranged by dragging, resized freely, and removed from the canvas without deleting the underlying data, so the same object can appear on multiple boards simultaneously.
16
+
17
+ Each board is itself an ECHO object, making it fully collaborative and conflict-free: all participants see live updates as peers add, move, or remove items in real time.
18
+ The canvas scales to any resolution, supports nested surfaces through the Composer slot system, and integrates naturally with other plugins via the shared ObjectPicker.
19
+
20
+ Board is designed as a lightweight composition layer: it imposes no schema on the objects it hosts and delegates rendering to each object's own Card surface, so every plugin contributes its own card representation automatically.
21
+ This makes it ideal for dashboards, mood boards, project overviews, or any context where spatial relationships between heterogeneous objects carry meaning.
22
+ `,
12
23
  icon: 'ph--squares-four--regular',
24
+ iconHue: 'green',
13
25
  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-board',
26
+ spec: 'PLUGIN.mdl',
14
27
  screenshots: [],
15
- };
28
+ tags: ['labs'],
29
+ });
package/src/plugin.ts ADDED
@@ -0,0 +1,9 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Plugin } from '@dxos/app-framework';
6
+
7
+ import { meta } from './meta';
8
+
9
+ export const BoardPlugin = Plugin.lazy(meta, () => import('#plugin'));
@@ -2,25 +2,28 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
+ import { Type } from '@dxos/echo';
5
6
  import { type Resource } from '@dxos/react-ui';
6
7
 
7
- import { meta } from './meta';
8
- import { Board } from './types';
8
+ import { meta } from '#meta';
9
+ import { Board } from '#types';
9
10
 
10
11
  export const translations = [
11
12
  {
12
13
  'en-US': {
13
- [Board.Board.typename]: {
14
- 'typename label': 'Board',
15
- 'typename label_zero': 'Boards',
16
- 'typename label_one': 'Board',
17
- 'typename label_other': 'Boards',
18
- 'object name placeholder': 'New board',
19
- 'rename object label': 'Rename board',
20
- 'delete object label': 'Delete board',
14
+ [Type.getTypename(Board.Board)]: {
15
+ 'typename.label': 'Board',
16
+ 'typename.label_zero': 'Boards',
17
+ 'typename.label_one': 'Board',
18
+ 'typename.label_other': 'Boards',
19
+ 'object-name.placeholder': 'New board',
20
+ 'add-object.label': 'Add board',
21
+ 'rename-object.label': 'Rename board',
22
+ 'delete-object.label': 'Delete board',
23
+ 'object-deleted.label': 'Board deleted',
21
24
  },
22
25
  [meta.id]: {
23
- 'plugin name': 'Board',
26
+ 'plugin.name': 'Board',
24
27
  },
25
28
  },
26
29
  },
@@ -2,30 +2,26 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
4
 
5
- import { Schema } from 'effect';
5
+ import * as Schema from 'effect/Schema';
6
6
 
7
- import { Obj, Type } from '@dxos/echo';
8
- import { LabelAnnotation } from '@dxos/echo-schema';
7
+ import { DXN, Annotation, Obj, Ref, Type } from '@dxos/echo';
8
+ import { FormInputAnnotation, LabelAnnotation } from '@dxos/echo/Annotation';
9
9
  import { BoardLayout, defaultLayout } from '@dxos/react-ui-board';
10
10
 
11
- import { meta } from '../meta';
12
-
13
11
  /**
14
12
  * Board and layout.
15
13
  */
16
14
  export const Board = Schema.Struct({
17
- name: Schema.optional(Schema.String),
18
- items: Schema.mutable(Schema.Array(Type.Ref(Type.Expando))),
19
- layout: Schema.mutable(BoardLayout),
15
+ name: Schema.String.pipe(Schema.optional),
16
+ items: Ref.Ref(Obj.Unknown).pipe(Schema.Array, FormInputAnnotation.set(false)),
17
+ layout: BoardLayout.pipe(FormInputAnnotation.set(false)),
20
18
  }).pipe(
21
- Type.Obj({
22
- typename: 'dxos.org/type/Board',
23
- version: '0.1.0',
24
- }),
25
19
  LabelAnnotation.set(['name']),
20
+ Annotation.IconAnnotation.set({ icon: 'ph--squares-four--regular', hue: 'green' }),
21
+ Type.makeObject(DXN.make('org.dxos.type.board', '0.1.0')),
26
22
  );
27
23
 
28
- export interface Board extends Schema.Schema.Type<typeof Board> {}
24
+ export type Board = Type.InstanceType<typeof Board>;
29
25
 
30
26
  export const makeBoard = (props: Partial<Obj.MakeProps<typeof Board>> = {}) =>
31
27
  Obj.make(Board, {
@@ -33,15 +29,3 @@ export const makeBoard = (props: Partial<Obj.MakeProps<typeof Board>> = {}) =>
33
29
  layout: defaultLayout,
34
30
  ...props,
35
31
  });
36
-
37
- /**
38
- * Create board.
39
- */
40
- export class Create extends Schema.TaggedClass<Create>()(`${meta.id}/action/create`, {
41
- input: Schema.Struct({
42
- name: Schema.optional(Schema.String),
43
- }),
44
- output: Schema.Struct({
45
- object: Board,
46
- }),
47
- }) {}
@@ -0,0 +1,10 @@
1
+ /// <reference types="vite/client" />
2
+
3
+ //
4
+ // Copyright 2026 DXOS.org
5
+ //
6
+
7
+ declare module '*.mdl?raw' {
8
+ const content: string;
9
+ export default content;
10
+ }
@@ -1,119 +0,0 @@
1
- // src/components/BoardContainer.tsx
2
- import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
3
- import { effect } from "@preact/signals-react";
4
- import React, { useCallback, useEffect, useRef, useState } from "react";
5
- import { Surface, createIntent, useIntentDispatcher } from "@dxos/app-framework";
6
- import { getSpace } from "@dxos/client/echo";
7
- import { Ref } from "@dxos/echo";
8
- import { invariant } from "@dxos/invariant";
9
- import { SpaceAction } from "@dxos/plugin-space/types";
10
- import { Board } from "@dxos/react-ui-board";
11
- import { StackItem } from "@dxos/react-ui-stack";
12
- import { isNonNullable } from "@dxos/util";
13
- var __dxlog_file = "/__w/dxos/dxos/packages/plugins/plugin-board/src/components/BoardContainer.tsx";
14
- var BoardContainer = ({ role, board }) => {
15
- var _effect = _useSignals();
16
- try {
17
- const { dispatchPromise: dispatch } = useIntentDispatcher();
18
- const controller = useRef(null);
19
- const [items, setItems] = useState([]);
20
- useEffect(() => {
21
- let t;
22
- effect(() => {
23
- const refs = [
24
- ...board.items
25
- ];
26
- t = setTimeout(async () => {
27
- const items2 = await Ref.Array.loadAll(refs);
28
- setItems(items2.filter(isNonNullable));
29
- });
30
- });
31
- return () => clearTimeout(t);
32
- }, [
33
- board.items
34
- ]);
35
- const handleAdd = useCallback(async (position = {
36
- x: 0,
37
- y: 0
38
- }) => {
39
- const space = getSpace(board);
40
- invariant(space, void 0, {
41
- F: __dxlog_file,
42
- L: 47,
43
- S: void 0,
44
- A: [
45
- "space",
46
- ""
47
- ]
48
- });
49
- await dispatch(createIntent(SpaceAction.OpenCreateObject, {
50
- target: space,
51
- navigable: false,
52
- onCreateObject: (object) => {
53
- board.items.push(Ref.make(object));
54
- board.layout.cells[object.id] = {
55
- ...position,
56
- width: 1,
57
- height: 1
58
- };
59
- controller.current?.center(position);
60
- }
61
- }));
62
- }, [
63
- board,
64
- controller,
65
- dispatch
66
- ]);
67
- const handleDelete = useCallback((id) => {
68
- const idx = board.items.findIndex((ref) => ref.dxn.asEchoDXN()?.echoId === id);
69
- if (idx !== -1) {
70
- board.items.splice(idx, 1);
71
- }
72
- delete board.layout.cells[id];
73
- setItems((items2) => items2.filter((item) => item.id !== id));
74
- }, [
75
- board
76
- ]);
77
- const handleMove = useCallback((id, position) => {
78
- const layout = board.layout.cells[id];
79
- board.layout.cells[id] = {
80
- ...layout,
81
- ...position
82
- };
83
- }, [
84
- board
85
- ]);
86
- return /* @__PURE__ */ React.createElement(Board.Root, {
87
- ref: controller,
88
- layout: board.layout,
89
- onAdd: handleAdd,
90
- onDelete: handleDelete,
91
- onMove: handleMove
92
- }, /* @__PURE__ */ React.createElement(StackItem.Content, {
93
- toolbar: true,
94
- classNames: "overflow-hidden"
95
- }, /* @__PURE__ */ React.createElement(Board.Toolbar, null), /* @__PURE__ */ React.createElement(Board.Container, null, /* @__PURE__ */ React.createElement(Board.Viewport, {
96
- classNames: "border-none"
97
- }, /* @__PURE__ */ React.createElement(Board.Backdrop, null), /* @__PURE__ */ React.createElement(Board.Content, null, items?.map((item, index) => /* @__PURE__ */ React.createElement(Board.Cell, {
98
- item,
99
- key: index,
100
- layout: board.layout?.cells[item.id] ?? {
101
- x: 0,
102
- y: 0
103
- }
104
- }, /* @__PURE__ */ React.createElement(Surface, {
105
- role: "card--extrinsic",
106
- data: {
107
- subject: item
108
- },
109
- limit: 1
110
- }))))))));
111
- } finally {
112
- _effect.f();
113
- }
114
- };
115
-
116
- export {
117
- BoardContainer
118
- };
119
- //# sourceMappingURL=chunk-2AR36W5A.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/components/BoardContainer.tsx"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { effect } from '@preact/signals-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Surface, createIntent, useIntentDispatcher } from '@dxos/app-framework';\nimport { getSpace } from '@dxos/client/echo';\nimport { type Obj, Ref, type Type } from '@dxos/echo';\nimport { invariant } from '@dxos/invariant';\nimport { SpaceAction } from '@dxos/plugin-space/types';\nimport { Board, type BoardController, type BoardRootProps } from '@dxos/react-ui-board';\nimport { StackItem } from '@dxos/react-ui-stack';\nimport { isNonNullable } from '@dxos/util';\n\n// TODO(thure): There is debate about having to rename either the type or the React component. A best practice should be chosen and either Board or Kanban (or both) should be refactored to apply it.\nimport { type Board as BoardType } from '../types';\n\nexport type BoardContainerProps = {\n role?: string;\n board: BoardType.Board;\n};\n\nexport const BoardContainer = ({ role, board }: BoardContainerProps) => {\n const { dispatchPromise: dispatch } = useIntentDispatcher();\n const controller = useRef<BoardController>(null);\n\n // TODO(burdon): Create effect utility for reactive arrays.\n const [items, setItems] = useState<Type.Expando[]>([]);\n useEffect(() => {\n let t: NodeJS.Timeout;\n effect(() => {\n const refs = [...board.items];\n t = setTimeout(async () => {\n const items = await Ref.Array.loadAll(refs);\n setItems(items.filter(isNonNullable));\n });\n });\n\n return () => clearTimeout(t);\n }, [board.items]);\n\n const handleAdd = useCallback<NonNullable<BoardRootProps['onAdd']>>(\n async (position = { x: 0, y: 0 }) => {\n const space = getSpace(board);\n invariant(space);\n await dispatch(\n createIntent(SpaceAction.OpenCreateObject, {\n target: space,\n navigable: false,\n onCreateObject: (object: Obj.Any) => {\n board.items.push(Ref.make(object));\n board.layout.cells[object.id] = { ...position, width: 1, height: 1 };\n controller.current?.center(position);\n },\n }),\n );\n },\n [board, controller, dispatch],\n );\n\n // TODO(burdon): Use intents so can be undone.\n const handleDelete = useCallback<NonNullable<BoardRootProps['onDelete']>>(\n (id) => {\n // TODO(burdon): Impl. DXN.equals and pass in DXN from `id`.\n const idx = board.items.findIndex((ref) => ref.dxn.asEchoDXN()?.echoId === id);\n if (idx !== -1) {\n board.items.splice(idx, 1);\n }\n delete board.layout.cells[id];\n setItems((items) => items.filter((item) => item.id !== id));\n },\n [board],\n );\n\n const handleMove = useCallback<NonNullable<BoardRootProps['onMove']>>(\n (id, position) => {\n const layout = board.layout.cells[id];\n board.layout.cells[id] = { ...layout, ...position };\n },\n [board],\n );\n\n return (\n <Board.Root ref={controller} layout={board.layout} onAdd={handleAdd} onDelete={handleDelete} onMove={handleMove}>\n <StackItem.Content toolbar classNames='overflow-hidden'>\n <Board.Toolbar />\n <Board.Container>\n <Board.Viewport classNames='border-none'>\n <Board.Backdrop />\n <Board.Content>\n {items?.map((item, index) => (\n <Board.Cell item={item} key={index} layout={board.layout?.cells[item.id] ?? { x: 0, y: 0 }}>\n <Surface role='card--extrinsic' data={{ subject: item }} limit={1} />\n </Board.Cell>\n ))}\n </Board.Content>\n </Board.Viewport>\n </Board.Container>\n </StackItem.Content>\n </Board.Root>\n );\n};\n"],
5
- "mappings": "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",
6
- "names": ["effect", "React", "useCallback", "useEffect", "useRef", "useState", "Surface", "createIntent", "useIntentDispatcher", "getSpace", "Ref", "invariant", "SpaceAction", "Board", "StackItem", "isNonNullable", "BoardContainer", "role", "board", "dispatchPromise", "dispatch", "controller", "items", "setItems", "t", "refs", "setTimeout", "Array", "loadAll", "filter", "clearTimeout", "handleAdd", "position", "x", "y", "space", "OpenCreateObject", "target", "navigable", "onCreateObject", "object", "push", "make", "layout", "cells", "id", "width", "height", "current", "center", "handleDelete", "idx", "findIndex", "ref", "dxn", "asEchoDXN", "echoId", "splice", "item", "handleMove", "Root", "onAdd", "onDelete", "onMove", "Content", "toolbar", "classNames", "Toolbar", "Container", "Viewport", "Backdrop", "map", "index", "Cell", "key", "data", "subject", "limit"]
7
- }
@@ -1,59 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __export = (target, all) => {
3
- for (var name in all)
4
- __defProp(target, name, { get: all[name], enumerable: true });
5
- };
6
-
7
- // src/types/Board.ts
8
- var Board_exports = {};
9
- __export(Board_exports, {
10
- Board: () => Board,
11
- Create: () => Create,
12
- makeBoard: () => makeBoard
13
- });
14
- import { Schema } from "effect";
15
- import { Obj, Type } from "@dxos/echo";
16
- import { LabelAnnotation } from "@dxos/echo-schema";
17
- import { BoardLayout, defaultLayout } from "@dxos/react-ui-board";
18
-
19
- // src/meta.ts
20
- var meta = {
21
- id: "dxos.org/plugin/board",
22
- name: "Board",
23
- description: "A spatial, infinite canvas app combining notes, media, and whiteboarding in a tactile, visual interface.",
24
- icon: "ph--squares-four--regular",
25
- source: "https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-board",
26
- screenshots: []
27
- };
28
-
29
- // src/types/Board.ts
30
- var Board = Schema.Struct({
31
- name: Schema.optional(Schema.String),
32
- items: Schema.mutable(Schema.Array(Type.Ref(Type.Expando))),
33
- layout: Schema.mutable(BoardLayout)
34
- }).pipe(Type.Obj({
35
- typename: "dxos.org/type/Board",
36
- version: "0.1.0"
37
- }), LabelAnnotation.set([
38
- "name"
39
- ]));
40
- var makeBoard = (props = {}) => Obj.make(Board, {
41
- items: [],
42
- layout: defaultLayout,
43
- ...props
44
- });
45
- var Create = class extends Schema.TaggedClass()(`${meta.id}/action/create`, {
46
- input: Schema.Struct({
47
- name: Schema.optional(Schema.String)
48
- }),
49
- output: Schema.Struct({
50
- object: Board
51
- })
52
- }) {
53
- };
54
-
55
- export {
56
- meta,
57
- Board_exports
58
- };
59
- //# sourceMappingURL=chunk-V67SBM4U.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/types/Board.ts", "../../../src/meta.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { Obj, Type } from '@dxos/echo';\nimport { LabelAnnotation } from '@dxos/echo-schema';\nimport { BoardLayout, defaultLayout } from '@dxos/react-ui-board';\n\nimport { meta } from '../meta';\n\n/**\n * Board and layout.\n */\nexport const Board = Schema.Struct({\n name: Schema.optional(Schema.String),\n items: Schema.mutable(Schema.Array(Type.Ref(Type.Expando))),\n layout: Schema.mutable(BoardLayout),\n}).pipe(\n Type.Obj({\n typename: 'dxos.org/type/Board',\n version: '0.1.0',\n }),\n LabelAnnotation.set(['name']),\n);\n\nexport interface Board extends Schema.Schema.Type<typeof Board> {}\n\nexport const makeBoard = (props: Partial<Obj.MakeProps<typeof Board>> = {}) =>\n Obj.make(Board, {\n items: [],\n layout: defaultLayout,\n ...props,\n });\n\n/**\n * Create board.\n */\nexport class Create extends Schema.TaggedClass<Create>()(`${meta.id}/action/create`, {\n input: Schema.Struct({\n name: Schema.optional(Schema.String),\n }),\n output: Schema.Struct({\n object: Board,\n }),\n}) {}\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const meta: PluginMeta = {\n id: 'dxos.org/plugin/board',\n name: 'Board',\n description:\n 'A spatial, infinite canvas app combining notes, media, and whiteboarding in a tactile, visual interface.',\n icon: 'ph--squares-four--regular',\n source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-board',\n screenshots: [],\n};\n"],
5
- "mappings": ";;;;;;;AAAA;;;;;;AAIA,SAASA,cAAc;AAEvB,SAASC,KAAKC,YAAY;AAC1B,SAASC,uBAAuB;AAChC,SAASC,aAAaC,qBAAqB;;;ACFpC,IAAMC,OAAmB;EAC9BC,IAAI;EACJC,MAAM;EACNC,aACE;EACFC,MAAM;EACNC,QAAQ;EACRC,aAAa,CAAA;AACf;;;ADCO,IAAMC,QAAQC,OAAOC,OAAO;EACjCC,MAAMF,OAAOG,SAASH,OAAOI,MAAM;EACnCC,OAAOL,OAAOM,QAAQN,OAAOO,MAAMC,KAAKC,IAAID,KAAKE,OAAO,CAAA,CAAA;EACxDC,QAAQX,OAAOM,QAAQM,WAAAA;AACzB,CAAA,EAAGC,KACDL,KAAKM,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,GACAC,gBAAgBC,IAAI;EAAC;CAAO,CAAA;AAKvB,IAAMC,YAAY,CAACC,QAA8C,CAAC,MACvEN,IAAIO,KAAKtB,OAAO;EACdM,OAAO,CAAA;EACPM,QAAQW;EACR,GAAGF;AACL,CAAA;AAKK,IAAMG,SAAN,cAAqBvB,OAAOwB,YAAW,EAAW,GAAGC,KAAKC,EAAE,kBAAkB;EACnFC,OAAO3B,OAAOC,OAAO;IACnBC,MAAMF,OAAOG,SAASH,OAAOI,MAAM;EACrC,CAAA;EACAwB,QAAQ5B,OAAOC,OAAO;IACpB4B,QAAQ9B;EACV,CAAA;AACF,CAAA,EAAA;AAAI;",
6
- "names": ["Schema", "Obj", "Type", "LabelAnnotation", "BoardLayout", "defaultLayout", "meta", "id", "name", "description", "icon", "source", "screenshots", "Board", "Schema", "Struct", "name", "optional", "String", "items", "mutable", "Array", "Type", "Ref", "Expando", "layout", "BoardLayout", "pipe", "Obj", "typename", "version", "LabelAnnotation", "set", "makeBoard", "props", "make", "defaultLayout", "Create", "TaggedClass", "meta", "id", "input", "output", "object"]
7
- }
@@ -1,91 +0,0 @@
1
- import {
2
- BoardContainer
3
- } from "./chunk-2AR36W5A.mjs";
4
- import {
5
- Board_exports,
6
- meta
7
- } from "./chunk-V67SBM4U.mjs";
8
-
9
- // src/BoardPlugin.tsx
10
- import { Capabilities, Events, contributes, createIntent, defineModule, definePlugin } from "@dxos/app-framework";
11
- import { ClientEvents } from "@dxos/plugin-client";
12
- import { SpaceCapabilities } from "@dxos/plugin-space";
13
- import { defineObjectForm } from "@dxos/plugin-space/types";
14
- import { translations as boardTranslations } from "@dxos/react-ui-board";
15
-
16
- // src/capabilities/index.ts
17
- import { lazy } from "@dxos/app-framework";
18
- var IntentResolver = lazy(() => import("./intent-resolver-6NM32ZSV.mjs"));
19
- var ReactSurface = lazy(() => import("./react-surface-S7H45RGL.mjs"));
20
-
21
- // src/translations.ts
22
- var translations = [
23
- {
24
- "en-US": {
25
- [Board_exports.Board.typename]: {
26
- "typename label": "Board",
27
- "typename label_zero": "Boards",
28
- "typename label_one": "Board",
29
- "typename label_other": "Boards",
30
- "object name placeholder": "New board",
31
- "rename object label": "Rename board",
32
- "delete object label": "Delete board"
33
- },
34
- [meta.id]: {
35
- "plugin name": "Board"
36
- }
37
- }
38
- }
39
- ];
40
-
41
- // src/BoardPlugin.tsx
42
- var BoardPlugin = () => {
43
- return definePlugin(meta, [
44
- defineModule({
45
- id: `${meta.id}/module/translations`,
46
- activatesOn: Events.SetupTranslations,
47
- activate: () => contributes(Capabilities.Translations, [
48
- ...translations,
49
- ...boardTranslations
50
- ])
51
- }),
52
- defineModule({
53
- id: `${meta.id}/module/metadata`,
54
- activatesOn: Events.SetupMetadata,
55
- activate: () => (
56
- // TODO(burdon): "Metadata" here seems non-descriptive; is this specifically for the type? ObjectMetadata?
57
- contributes(Capabilities.Metadata, {
58
- id: Board_exports.Board.typename,
59
- metadata: {
60
- icon: "ph--squares-four--regular"
61
- }
62
- })
63
- )
64
- }),
65
- defineModule({
66
- id: `${meta.id}/module/object-form`,
67
- activatesOn: ClientEvents.SetupSchema,
68
- activate: () => contributes(SpaceCapabilities.ObjectForm, defineObjectForm({
69
- objectSchema: Board_exports.Board,
70
- getIntent: () => createIntent(Board_exports.Create)
71
- }))
72
- }),
73
- defineModule({
74
- id: `${meta.id}/module/react-surface`,
75
- activatesOn: Events.SetupReactSurface,
76
- activate: ReactSurface
77
- }),
78
- defineModule({
79
- id: `${meta.id}/module/intent-resolver`,
80
- activatesOn: Events.SetupIntentResolver,
81
- activate: IntentResolver
82
- })
83
- ]);
84
- };
85
- export {
86
- Board_exports as Board,
87
- BoardContainer,
88
- BoardPlugin,
89
- meta
90
- };
91
- //# sourceMappingURL=index.mjs.map