@dxos/plugin-board 0.8.4-main.c4373fc → 0.8.4-main.c85a9c8dae

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 (96) hide show
  1. package/dist/lib/browser/BoardContainer-QVVN3MXA.mjs +150 -0
  2. package/dist/lib/browser/BoardContainer-QVVN3MXA.mjs.map +7 -0
  3. package/dist/lib/browser/chunk-DX5POLPL.mjs +19 -0
  4. package/dist/lib/browser/chunk-DX5POLPL.mjs.map +7 -0
  5. package/dist/lib/browser/chunk-J5LGTIGS.mjs +10 -0
  6. package/dist/lib/browser/chunk-J5LGTIGS.mjs.map +7 -0
  7. package/dist/lib/browser/chunk-KO5FZQGF.mjs +34 -0
  8. package/dist/lib/browser/chunk-KO5FZQGF.mjs.map +7 -0
  9. package/dist/lib/browser/index.mjs +35 -56
  10. package/dist/lib/browser/index.mjs.map +4 -4
  11. package/dist/lib/browser/meta.json +1 -1
  12. package/dist/lib/browser/react-surface-DBUDXBXD.mjs +38 -0
  13. package/dist/lib/browser/react-surface-DBUDXBXD.mjs.map +7 -0
  14. package/dist/lib/browser/types/index.mjs +2 -1
  15. package/dist/lib/node-esm/BoardContainer-U2P3DS4B.mjs +151 -0
  16. package/dist/lib/node-esm/BoardContainer-U2P3DS4B.mjs.map +7 -0
  17. package/dist/lib/node-esm/chunk-4C3UI73P.mjs +35 -0
  18. package/dist/lib/node-esm/chunk-4C3UI73P.mjs.map +7 -0
  19. package/dist/lib/node-esm/chunk-BKJL6RLQ.mjs +21 -0
  20. package/dist/lib/node-esm/chunk-BKJL6RLQ.mjs.map +7 -0
  21. package/dist/lib/node-esm/chunk-HSLMI22Q.mjs +11 -0
  22. package/dist/lib/node-esm/chunk-HSLMI22Q.mjs.map +7 -0
  23. package/dist/lib/node-esm/index.mjs +35 -56
  24. package/dist/lib/node-esm/index.mjs.map +4 -4
  25. package/dist/lib/node-esm/meta.json +1 -1
  26. package/dist/lib/node-esm/react-surface-SFB3GP7U.mjs +39 -0
  27. package/dist/lib/node-esm/react-surface-SFB3GP7U.mjs.map +7 -0
  28. package/dist/lib/node-esm/types/index.mjs +2 -1
  29. package/dist/types/src/BoardPlugin.d.ts +2 -1
  30. package/dist/types/src/BoardPlugin.d.ts.map +1 -1
  31. package/dist/types/src/capabilities/index.d.ts +1 -2
  32. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  33. package/dist/types/src/capabilities/react-surface/index.d.ts +3 -0
  34. package/dist/types/src/capabilities/react-surface/index.d.ts.map +1 -0
  35. package/dist/types/src/capabilities/react-surface/react-surface.d.ts +5 -0
  36. package/dist/types/src/capabilities/react-surface/react-surface.d.ts.map +1 -0
  37. package/dist/types/src/components/index.d.ts +0 -1
  38. package/dist/types/src/components/index.d.ts.map +1 -1
  39. package/dist/types/src/containers/BoardContainer/BoardContainer.d.ts +6 -0
  40. package/dist/types/src/containers/BoardContainer/BoardContainer.d.ts.map +1 -0
  41. package/dist/types/src/{components → containers/BoardContainer}/BoardContainer.stories.d.ts +4 -4
  42. package/dist/types/src/containers/BoardContainer/BoardContainer.stories.d.ts.map +1 -0
  43. package/dist/types/src/containers/BoardContainer/index.d.ts +3 -0
  44. package/dist/types/src/containers/BoardContainer/index.d.ts.map +1 -0
  45. package/dist/types/src/containers/index.d.ts +3 -0
  46. package/dist/types/src/containers/index.d.ts.map +1 -0
  47. package/dist/types/src/index.d.ts +0 -1
  48. package/dist/types/src/index.d.ts.map +1 -1
  49. package/dist/types/src/meta.d.ts +2 -2
  50. package/dist/types/src/meta.d.ts.map +1 -1
  51. package/dist/types/src/translations.d.ts +1 -0
  52. package/dist/types/src/translations.d.ts.map +1 -1
  53. package/dist/types/src/types/Board.d.ts +25 -67
  54. package/dist/types/src/types/Board.d.ts.map +1 -1
  55. package/dist/types/tsconfig.tsbuildinfo +1 -1
  56. package/package.json +55 -47
  57. package/src/BoardPlugin.tsx +22 -45
  58. package/src/capabilities/index.ts +1 -4
  59. package/src/capabilities/react-surface/index.ts +7 -0
  60. package/src/capabilities/react-surface/react-surface.tsx +27 -0
  61. package/src/components/index.ts +0 -2
  62. package/src/containers/BoardContainer/BoardContainer.stories.tsx +122 -0
  63. package/src/containers/BoardContainer/BoardContainer.tsx +155 -0
  64. package/src/containers/BoardContainer/index.ts +7 -0
  65. package/src/containers/index.ts +7 -0
  66. package/src/index.ts +0 -1
  67. package/src/meta.ts +8 -4
  68. package/src/translations.ts +1 -0
  69. package/src/types/Board.ts +6 -20
  70. package/dist/lib/browser/chunk-RHMZXTJ7.mjs +0 -129
  71. package/dist/lib/browser/chunk-RHMZXTJ7.mjs.map +0 -7
  72. package/dist/lib/browser/chunk-Z6L4ZVCB.mjs +0 -59
  73. package/dist/lib/browser/chunk-Z6L4ZVCB.mjs.map +0 -7
  74. package/dist/lib/browser/intent-resolver-H6OF7V77.mjs +0 -33
  75. package/dist/lib/browser/intent-resolver-H6OF7V77.mjs.map +0 -7
  76. package/dist/lib/browser/react-surface-37LEVBKY.mjs +0 -30
  77. package/dist/lib/browser/react-surface-37LEVBKY.mjs.map +0 -7
  78. package/dist/lib/node-esm/chunk-AWLY252W.mjs +0 -60
  79. package/dist/lib/node-esm/chunk-AWLY252W.mjs.map +0 -7
  80. package/dist/lib/node-esm/chunk-XZA5WICX.mjs +0 -131
  81. package/dist/lib/node-esm/chunk-XZA5WICX.mjs.map +0 -7
  82. package/dist/lib/node-esm/intent-resolver-L534P6FM.mjs +0 -34
  83. package/dist/lib/node-esm/intent-resolver-L534P6FM.mjs.map +0 -7
  84. package/dist/lib/node-esm/react-surface-GVHSH2W2.mjs +0 -31
  85. package/dist/lib/node-esm/react-surface-GVHSH2W2.mjs.map +0 -7
  86. package/dist/types/src/capabilities/intent-resolver.d.ts +0 -4
  87. package/dist/types/src/capabilities/intent-resolver.d.ts.map +0 -1
  88. package/dist/types/src/capabilities/react-surface.d.ts +0 -4
  89. package/dist/types/src/capabilities/react-surface.d.ts.map +0 -1
  90. package/dist/types/src/components/BoardContainer.d.ts +0 -8
  91. package/dist/types/src/components/BoardContainer.d.ts.map +0 -1
  92. package/dist/types/src/components/BoardContainer.stories.d.ts.map +0 -1
  93. package/src/capabilities/intent-resolver.ts +0 -34
  94. package/src/capabilities/react-surface.tsx +0 -22
  95. package/src/components/BoardContainer.stories.tsx +0 -125
  96. package/src/components/BoardContainer.tsx +0 -136
@@ -1 +0,0 @@
1
- {"version":3,"file":"react-surface.d.ts","sourceRoot":"","sources":["../../../../src/capabilities/react-surface.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,YAAY,EAAE,KAAK,aAAa,EAA8B,MAAM,qBAAqB,CAAC;yBAOnF,SAAS,aAAa;AAAtC,wBAQK"}
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { type Board as BoardType } from '../types';
3
- export type BoardContainerProps = {
4
- role?: string;
5
- board: BoardType.Board;
6
- };
7
- export declare const BoardContainer: ({ board }: BoardContainerProps) => React.JSX.Element;
8
- //# sourceMappingURL=BoardContainer.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BoardContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/BoardContainer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAYtE,OAAO,EAAE,KAAK,KAAK,IAAI,SAAS,EAAE,MAAM,UAAU,CAAC;AAEnD,MAAM,MAAM,mBAAmB,GAAG;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC;CACxB,CAAC;AAQF,eAAO,MAAM,cAAc,GAAI,WAAW,mBAAmB,sBA0G5D,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"BoardContainer.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/BoardContainer.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,KAA8B,MAAM,OAAO,CAAC;AAkBnD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAkDjC,QAAA,MAAM,IAAI;;;;;;;;yBAlE4C,CAAQ,KAAK;qBACnE,KAAK,CAAE,QAAO,CAAC;;;;;;;;;yBAMf,CAAS,IAAG,CAAC,EAAE,CAAC;;;;;;;;;;;;;;;;;;;CAwGf,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}
@@ -1,34 +0,0 @@
1
- //
2
- // Copyright 2025 DXOS.org
3
- //
4
-
5
- import { Capabilities, contributes, createResolver } from '@dxos/app-framework';
6
- import { Obj } from '@dxos/echo';
7
-
8
- import { Board } from '../types';
9
-
10
- export default () => [
11
- contributes(
12
- Capabilities.IntentResolver,
13
- createResolver({
14
- intent: Board.Create,
15
- resolve: ({ name }) => {
16
- return {
17
- data: {
18
- object: Obj.make(Board.Board, {
19
- name,
20
- items: [],
21
- layout: {
22
- size: {
23
- width: 5,
24
- height: 5,
25
- },
26
- cells: {},
27
- },
28
- }),
29
- },
30
- };
31
- },
32
- }),
33
- ),
34
- ];
@@ -1,22 +0,0 @@
1
- //
2
- // Copyright 2025 DXOS.org
3
- //
4
-
5
- import React from 'react';
6
-
7
- import { Capabilities, type PluginContext, contributes, createSurface } from '@dxos/app-framework';
8
- import { Obj } from '@dxos/echo';
9
-
10
- import { BoardContainer } from '../components';
11
- import { meta } from '../meta';
12
- import { Board } from '../types';
13
-
14
- export default (context: PluginContext) =>
15
- contributes(Capabilities.ReactSurface, [
16
- createSurface({
17
- id: meta.id,
18
- role: ['article', 'section'],
19
- filter: (data): data is { subject: Board.Board } => Obj.instanceOf(Board.Board, data.subject),
20
- component: ({ data, role }) => <BoardContainer board={data.subject} role={role} />,
21
- }),
22
- ]);
@@ -1,125 +0,0 @@
1
- //
2
- // Copyright 2024 DXOS.org
3
- //
4
-
5
- import { type StoryObj } from '@storybook/react-vite';
6
- import React, { useEffect, useState } from 'react';
7
-
8
- import { IntentPlugin, SettingsPlugin } from '@dxos/app-framework';
9
- import { withPluginManager } from '@dxos/app-framework/testing';
10
- import { Obj } from '@dxos/echo';
11
- import { ClientPlugin } from '@dxos/plugin-client';
12
- import { PreviewPlugin } from '@dxos/plugin-preview';
13
- import { SpacePlugin } from '@dxos/plugin-space';
14
- import { StorybookLayoutPlugin } from '@dxos/plugin-storybook-layout';
15
- import { ThemePlugin } from '@dxos/plugin-theme';
16
- import { faker } from '@dxos/random';
17
- import { Filter, Ref, useQuery, useSpaces } from '@dxos/react-client/echo';
18
- import { withTheme } from '@dxos/react-ui/testing';
19
- import { translations as stackTranslations } from '@dxos/react-ui-stack';
20
- import { defaultTx } from '@dxos/react-ui-theme';
21
- import { DataType } from '@dxos/schema';
22
-
23
- import { translations } from '../translations';
24
- import { Board } from '../types';
25
-
26
- import { BoardContainer } from './BoardContainer';
27
-
28
- faker.seed(0);
29
-
30
- const createBoard = () =>
31
- Obj.make(Board.Board, {
32
- name: 'Test Board',
33
- items: [],
34
- layout: {
35
- size: { width: 7, height: 5 },
36
- cells: {},
37
- },
38
- });
39
-
40
- const createOrg = () =>
41
- Obj.make(DataType.Organization, {
42
- name: faker.commerce.productName(),
43
- description: faker.lorem.paragraph(),
44
- image: faker.image.url(),
45
- website: faker.internet.url(),
46
- // TODO(burdon): Fix.
47
- // status: faker.helpers.arrayElement(DataType.OrganizationStatusOptions).id,
48
- });
49
-
50
- const DefaultStory = () => {
51
- const spaces = useSpaces();
52
- const space = spaces[spaces.length - 1];
53
- const boards = useQuery(space, Filter.type(Board.Board));
54
- const [board, setBoard] = useState<Board.Board>();
55
-
56
- useEffect(() => {
57
- if (boards.length && !board) {
58
- const board = boards[0];
59
- setBoard(board);
60
- }
61
- }, [boards]);
62
-
63
- if (!board) {
64
- return null;
65
- }
66
-
67
- return <BoardContainer role='board' board={board} />;
68
- };
69
-
70
- //
71
- // Story definitions
72
- //
73
-
74
- const meta = {
75
- title: 'plugins/plugin-board/Board',
76
- render: DefaultStory,
77
- decorators: [
78
- withTheme,
79
- withPluginManager({
80
- plugins: [
81
- ClientPlugin({
82
- types: [DataType.Organization, DataType.Person, Board.Board],
83
- onClientInitialized: async ({ client }) => {
84
- await client.halo.createIdentity();
85
- const space = await client.spaces.create();
86
- await space.waitUntilReady();
87
- const board = space.db.add(createBoard());
88
-
89
- // Add some sample items
90
- Array.from({ length: 10 }).map(() => {
91
- const org = createOrg();
92
- space.db.add(org);
93
- board.items.push(Ref.make(org));
94
- board.layout.cells[org.id] = {
95
- x: Math.floor(Math.random() * 5) - 2,
96
- y: Math.floor(Math.random() * 5) - 2,
97
- width: 1,
98
- height: 1,
99
- };
100
- return org;
101
- });
102
- },
103
- }),
104
- SpacePlugin({}),
105
- IntentPlugin(),
106
- SettingsPlugin(),
107
-
108
- // UI
109
- ThemePlugin({ tx: defaultTx }),
110
- PreviewPlugin(),
111
- StorybookLayoutPlugin({}),
112
- ],
113
- }),
114
- ],
115
- parameters: {
116
- layout: 'fullscreen',
117
- translations: [...translations, ...stackTranslations],
118
- },
119
- };
120
-
121
- export default meta;
122
-
123
- type Story = StoryObj<typeof meta>;
124
-
125
- export const Default: Story = {};
@@ -1,136 +0,0 @@
1
- //
2
- // Copyright 2025 DXOS.org
3
- //
4
-
5
- import React, { useCallback, useMemo, useRef, useState } from 'react';
6
-
7
- import { Surface } from '@dxos/app-framework';
8
- import { Filter, Ref, getSpace } from '@dxos/client/echo';
9
- import { invariant } from '@dxos/invariant';
10
- import { useQuery } from '@dxos/react-client/echo';
11
- import { useSignalsMemo } from '@dxos/react-ui';
12
- import { Board, type BoardController, type BoardRootProps, type Position } from '@dxos/react-ui-board';
13
- import { ObjectPicker } from '@dxos/react-ui-form';
14
- import { StackItem } from '@dxos/react-ui-stack';
15
- import { isNonNullable } from '@dxos/util';
16
-
17
- import { type Board as BoardType } from '../types';
18
-
19
- export type BoardContainerProps = {
20
- role?: string;
21
- board: BoardType.Board;
22
- };
23
-
24
- const DEFAULT_POSITION = { x: 0, y: 0 } satisfies Position;
25
-
26
- type PickerState = {
27
- position: Position;
28
- };
29
-
30
- export const BoardContainer = ({ board }: BoardContainerProps) => {
31
- const controller = useRef<BoardController>(null);
32
- const items = useSignalsMemo(() => board.items.map((ref) => ref.target).filter(isNonNullable), [board]);
33
- const addTriggerRef = useRef<HTMLButtonElement | null>(null);
34
- const [pickerState, setPickerState] = useState<PickerState | null>(null);
35
-
36
- // Memoize options for ObjectPicker containing all ECHO objects in the same space as the Board.
37
- const allObjects = useQuery(getSpace(board), Filter.everything());
38
- const options = useMemo(
39
- () =>
40
- allObjects.map((obj) => ({
41
- id: obj.id,
42
- label: obj.name || obj.title || obj.id,
43
- hue: 'neutral' as const,
44
- })),
45
- [allObjects],
46
- );
47
-
48
- const handleAdd = useCallback<NonNullable<BoardRootProps['onAdd']>>(
49
- async (anchor, position = DEFAULT_POSITION) => {
50
- const space = getSpace(board);
51
- invariant(space);
52
- addTriggerRef.current = anchor;
53
- setPickerState({
54
- position,
55
- });
56
- },
57
- [board],
58
- );
59
-
60
- const handleSelect = useCallback(
61
- (id: string) => {
62
- if (!pickerState) return;
63
-
64
- // Find the selected object by id from the space.
65
- const selectedObject = allObjects.find((obj) => obj.id === id);
66
- if (!selectedObject) return;
67
-
68
- // Create a reference to the selected object and add it to the board.
69
- const ref = Ref.make(selectedObject);
70
- board.items.push(ref);
71
-
72
- // Set the layout position for the new item.
73
- board.layout.cells[selectedObject.id.toString()] = pickerState.position;
74
-
75
- // Close the picker.
76
- setPickerState(null);
77
- },
78
- [pickerState, allObjects, board],
79
- );
80
-
81
- // TODO(burdon): Use intents so can be undone.
82
- const handleDelete = useCallback<NonNullable<BoardRootProps['onDelete']>>(
83
- (id) => {
84
- // TODO(burdon): Impl. DXN.equals and pass in DXN from `id`.
85
- const idx = board.items.findIndex((ref) => ref.dxn.asEchoDXN()?.echoId === id);
86
- if (idx !== -1) {
87
- board.items.splice(idx, 1);
88
- }
89
- delete board.layout.cells[id];
90
- },
91
- [board],
92
- );
93
-
94
- const handleMove = useCallback<NonNullable<BoardRootProps['onMove']>>(
95
- (id, position) => {
96
- const layout = board.layout.cells[id];
97
- board.layout.cells[id] = { ...layout, ...position };
98
- },
99
- [board],
100
- );
101
-
102
- return (
103
- <Board.Root ref={controller} layout={board.layout} onAdd={handleAdd} onDelete={handleDelete} onMove={handleMove}>
104
- <ObjectPicker.Root
105
- open={!!pickerState}
106
- onOpenChange={(nextOpen: boolean) => {
107
- setPickerState(
108
- nextOpen
109
- ? {
110
- position: DEFAULT_POSITION,
111
- }
112
- : null,
113
- );
114
- }}
115
- >
116
- <StackItem.Content toolbar>
117
- <Board.Toolbar />
118
- <Board.Container>
119
- <Board.Viewport classNames='border-none'>
120
- <Board.Backdrop />
121
- <Board.Content>
122
- {items?.map((item, index) => (
123
- <Board.Cell item={item} key={index} layout={board.layout?.cells[item.id] ?? { x: 0, y: 0 }}>
124
- <Surface role='card--extrinsic' data={{ subject: item }} limit={1} />
125
- </Board.Cell>
126
- ))}
127
- </Board.Content>
128
- </Board.Viewport>
129
- </Board.Container>
130
- </StackItem.Content>
131
- <ObjectPicker.Content options={options} onSelect={handleSelect} classNames='popover-card-width' />
132
- <ObjectPicker.VirtualTrigger virtualRef={addTriggerRef} />
133
- </ObjectPicker.Root>
134
- </Board.Root>
135
- );
136
- };