@dxos/plugin-stack 0.7.4 → 0.7.5-main.9d26e3a

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 (43) hide show
  1. package/dist/lib/browser/StackMain-HSYQ5B3Y.mjs +295 -0
  2. package/dist/lib/browser/StackMain-HSYQ5B3Y.mjs.map +7 -0
  3. package/dist/lib/browser/index.mjs +28 -163
  4. package/dist/lib/browser/index.mjs.map +4 -4
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/node/StackMain-AWN5MFZK.cjs +309 -0
  7. package/dist/lib/node/StackMain-AWN5MFZK.cjs.map +7 -0
  8. package/dist/lib/node/index.cjs +28 -161
  9. package/dist/lib/node/index.cjs.map +4 -4
  10. package/dist/lib/node/meta.json +1 -1
  11. package/dist/lib/node-esm/StackMain-EFCZCMIJ.mjs +296 -0
  12. package/dist/lib/node-esm/StackMain-EFCZCMIJ.mjs.map +7 -0
  13. package/dist/lib/node-esm/index.mjs +28 -163
  14. package/dist/lib/node-esm/index.mjs.map +4 -4
  15. package/dist/lib/node-esm/meta.json +1 -1
  16. package/dist/types/src/StackPlugin.d.ts.map +1 -1
  17. package/dist/types/src/components/StackMain.d.ts.map +1 -1
  18. package/dist/types/src/components/StackSection.d.ts.map +1 -1
  19. package/dist/types/src/components/index.d.ts +0 -1
  20. package/dist/types/src/components/index.d.ts.map +1 -1
  21. package/dist/types/src/types/stack.d.ts +6 -12
  22. package/dist/types/src/types/stack.d.ts.map +1 -1
  23. package/dist/types/src/types/types.d.ts +4 -16
  24. package/dist/types/src/types/types.d.ts.map +1 -1
  25. package/dist/types/tsconfig.tsbuildinfo +1 -0
  26. package/package.json +23 -23
  27. package/src/StackPlugin.tsx +26 -47
  28. package/src/components/StackMain.tsx +60 -69
  29. package/src/components/StackSection.tsx +2 -4
  30. package/src/components/index.ts +0 -1
  31. package/src/types/types.ts +3 -19
  32. package/dist/lib/browser/StackMain-4D4J4IRK.mjs +0 -391
  33. package/dist/lib/browser/StackMain-4D4J4IRK.mjs.map +0 -7
  34. package/dist/lib/node/StackMain-V7C55NCF.cjs +0 -403
  35. package/dist/lib/node/StackMain-V7C55NCF.cjs.map +0 -7
  36. package/dist/lib/node-esm/StackMain-5I43UWGF.mjs +0 -392
  37. package/dist/lib/node-esm/StackMain-5I43UWGF.mjs.map +0 -7
  38. package/dist/types/src/components/AddSection.d.ts +0 -6
  39. package/dist/types/src/components/AddSection.d.ts.map +0 -1
  40. package/dist/types/src/components/AddSectionDialog.d.ts +0 -14
  41. package/dist/types/src/components/AddSectionDialog.d.ts.map +0 -1
  42. package/src/components/AddSection.tsx +0 -102
  43. package/src/components/AddSectionDialog.tsx +0 -128
@@ -0,0 +1,296 @@
1
+ import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
+ import {
3
+ STACK_PLUGIN
4
+ } from "./chunk-JEQMG2E2.mjs";
5
+ import {
6
+ StackViewType
7
+ } from "./chunk-3ZYHKSIS.mjs";
8
+
9
+ // packages/plugins/plugin-stack/src/components/StackMain.tsx
10
+ import { Plus } from "@phosphor-icons/react";
11
+ import React3, { useCallback, useEffect, useMemo, useState as useState2 } from "react";
12
+ import { createIntent, LayoutAction, NavigationAction, parseMetadataResolverPlugin, useIntentDispatcher, useResolvePlugin } from "@dxos/app-framework";
13
+ import { create, getType, fullyQualifiedId, isReactiveObject, makeRef } from "@dxos/client/echo";
14
+ import { useGraph } from "@dxos/plugin-graph";
15
+ import { SpaceAction } from "@dxos/plugin-space";
16
+ import { Button, toLocalizedString, useTranslation as useTranslation2 } from "@dxos/react-ui";
17
+ import { AttentionProvider } from "@dxos/react-ui-attention";
18
+ import { Stack } from "@dxos/react-ui-stack";
19
+ import { nonNullable } from "@dxos/util";
20
+
21
+ // packages/plugins/plugin-stack/src/components/StackContext.tsx
22
+ import { createContext, useContext } from "react";
23
+ var StackContext = /* @__PURE__ */ createContext({
24
+ onCollapse: () => {
25
+ },
26
+ onNavigate: async () => {
27
+ },
28
+ onDelete: async () => {
29
+ },
30
+ onAdd: () => {
31
+ }
32
+ });
33
+ var useStack = () => useContext(StackContext);
34
+
35
+ // packages/plugins/plugin-stack/src/components/StackSection.tsx
36
+ import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
37
+ import React2, { useState } from "react";
38
+ import { Surface } from "@dxos/app-framework";
39
+ import { DropdownMenu, Icon, useTranslation, IconButton } from "@dxos/react-ui";
40
+ import { useAttendableAttributes } from "@dxos/react-ui-attention";
41
+ import { StackItem } from "@dxos/react-ui-stack";
42
+ import { mx, getSize, textBlockWidth } from "@dxos/react-ui-theme";
43
+
44
+ // packages/plugins/plugin-stack/src/components/CaretDownUp.tsx
45
+ import React from "react";
46
+ var CaretDownUp = ({ children, ...props }) => {
47
+ return /* @__PURE__ */ React.createElement("svg", {
48
+ xmlns: "http://www.w3.org/2000/svg",
49
+ viewBox: "0 0 256 256",
50
+ ...props
51
+ }, /* @__PURE__ */ React.createElement("rect", {
52
+ width: "256",
53
+ height: "256",
54
+ fill: "none"
55
+ }), /* @__PURE__ */ React.createElement("polyline", {
56
+ points: "80 224 128 176 176 224",
57
+ fill: "none",
58
+ stroke: "currentColor",
59
+ strokeLinecap: "round",
60
+ strokeLinejoin: "round",
61
+ strokeWidth: "16"
62
+ }), /* @__PURE__ */ React.createElement("polyline", {
63
+ points: "80 32 128 80 176 32",
64
+ fill: "none",
65
+ stroke: "currentColor",
66
+ strokeLinecap: "round",
67
+ strokeLinejoin: "round",
68
+ strokeWidth: "16"
69
+ }), children);
70
+ };
71
+
72
+ // packages/plugins/plugin-stack/src/components/StackSection.tsx
73
+ var sectionActionDimensions = "m-1 p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min";
74
+ var StackSection = ({ id, view, object, metadata: { icon = "ph--placeholder--regular" } }) => {
75
+ const { t } = useTranslation(STACK_PLUGIN);
76
+ const { onNavigate, onAdd, onCollapse, onDelete } = useStack();
77
+ const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);
78
+ const attendableAttrs = useAttendableAttributes(id);
79
+ return /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Root, {
80
+ asChild: true,
81
+ open: !view.collapsed,
82
+ onOpenChange: (nextOpen) => onCollapse?.(id, !nextOpen)
83
+ }, /* @__PURE__ */ React2.createElement(StackItem.Root, {
84
+ item: {
85
+ id
86
+ },
87
+ role: "section",
88
+ ...attendableAttrs,
89
+ classNames: "border-be border-separator"
90
+ }, /* @__PURE__ */ React2.createElement(StackItem.Heading, {
91
+ classNames: "attention-surface border-ie !border-separator"
92
+ }, /* @__PURE__ */ React2.createElement("span", {
93
+ className: "sr-only"
94
+ }, view.title), /* @__PURE__ */ React2.createElement("div", {
95
+ role: "none",
96
+ className: "sticky -block-start-px bg-[--sticky-bg]"
97
+ }, /* @__PURE__ */ React2.createElement(DropdownMenu.Root, {
98
+ open: optionsMenuOpen,
99
+ onOpenChange: setOptionsMenuOpen
100
+ }, /* @__PURE__ */ React2.createElement(DropdownMenu.Trigger, {
101
+ asChild: true
102
+ }, /* @__PURE__ */ React2.createElement(StackItem.SigilButton, null, /* @__PURE__ */ React2.createElement(Icon, {
103
+ icon,
104
+ size: 5,
105
+ classNames: "transition-opacity"
106
+ }))), /* @__PURE__ */ React2.createElement(DropdownMenu.Portal, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React2.createElement(DropdownMenu.Viewport, null, view.collapsed ? /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
107
+ onClick: () => onNavigate(id),
108
+ "data-testid": "section.navigate-to"
109
+ }, /* @__PURE__ */ React2.createElement(Icon, {
110
+ icon: "ph--arrow-square-out--regular",
111
+ size: 5
112
+ }), /* @__PURE__ */ React2.createElement("span", {
113
+ className: "mis-2 grow"
114
+ }, t("navigate to section label"))) : /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Trigger, {
115
+ asChild: true
116
+ }, /* @__PURE__ */ React2.createElement(DropdownMenu.Item, null, /* @__PURE__ */ React2.createElement(CaretDownUp, {
117
+ className: getSize(5)
118
+ }), /* @__PURE__ */ React2.createElement("span", {
119
+ className: "mis-2 grow"
120
+ }, t("collapse label")))), /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
121
+ onClick: () => onAdd(id, "before"),
122
+ "data-testid": "section.add-before"
123
+ }, /* @__PURE__ */ React2.createElement(Icon, {
124
+ icon: "ph--arrow-line-up--regular",
125
+ size: 5
126
+ }), /* @__PURE__ */ React2.createElement("span", {
127
+ className: "mis-2 grow"
128
+ }, t("add section before label"))), /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
129
+ onClick: () => onAdd(id, "after"),
130
+ "data-testid": "section.add-after"
131
+ }, /* @__PURE__ */ React2.createElement(Icon, {
132
+ icon: "ph--arrow-line-down--regular",
133
+ size: 5
134
+ }), /* @__PURE__ */ React2.createElement("span", {
135
+ className: "mis-2 grow"
136
+ }, t("add section after label"))), /* @__PURE__ */ React2.createElement(DropdownMenu.Item, {
137
+ onClick: () => onDelete(id),
138
+ "data-testid": "section.remove"
139
+ }, /* @__PURE__ */ React2.createElement(Icon, {
140
+ icon: "ph--trash--regular",
141
+ size: 5
142
+ }), /* @__PURE__ */ React2.createElement("span", {
143
+ className: "mis-2 grow"
144
+ }, t("remove section label")))), /* @__PURE__ */ React2.createElement(DropdownMenu.Arrow, null)))), view.collapsed ? /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Trigger, {
145
+ asChild: true
146
+ }, /* @__PURE__ */ React2.createElement(IconButton, {
147
+ iconOnly: true,
148
+ variant: "ghost",
149
+ label: t("expand label"),
150
+ icon: "ph--caret-up-down--regular",
151
+ classNames: sectionActionDimensions
152
+ })) : /* @__PURE__ */ React2.createElement(IconButton, {
153
+ iconOnly: true,
154
+ variant: "ghost",
155
+ onClick: () => onNavigate(id),
156
+ label: t("navigate to section label"),
157
+ icon: "ph--arrow-square-out--regular",
158
+ "data-testid": "section.navigate-to",
159
+ classNames: sectionActionDimensions
160
+ }))), /* @__PURE__ */ React2.createElement(CollapsiblePrimitive.Content, null, /* @__PURE__ */ React2.createElement(Surface, {
161
+ role: "section",
162
+ data: {
163
+ subject: object
164
+ },
165
+ limit: 1,
166
+ placeholder: /* @__PURE__ */ React2.createElement(React2.Fragment, null)
167
+ })), view.collapsed && /* @__PURE__ */ React2.createElement(StackItem.Content, {
168
+ toolbar: false,
169
+ classNames: "attention-surface"
170
+ }, /* @__PURE__ */ React2.createElement("h2", {
171
+ className: mx("flex items-center p-4 font-medium is-full", textBlockWidth)
172
+ }, view.title))));
173
+ };
174
+
175
+ // packages/plugins/plugin-stack/src/components/StackMain.tsx
176
+ var StackMain = ({ id, collection }) => {
177
+ const { dispatchPromise: dispatch } = useIntentDispatcher();
178
+ const { graph } = useGraph();
179
+ const { t } = useTranslation2(STACK_PLUGIN);
180
+ const metadataPlugin = useResolvePlugin(parseMetadataResolverPlugin);
181
+ const defaultStack = useMemo(() => create(StackViewType, {
182
+ sections: {}
183
+ }), [
184
+ collection
185
+ ]);
186
+ const stack = collection.views[StackViewType.typename]?.target ?? defaultStack;
187
+ const [collapsedSections, setCollapsedSections] = useState2({});
188
+ useEffect(() => {
189
+ if (!collection.views[StackViewType.typename]) {
190
+ collection.views[StackViewType.typename] = makeRef(stack);
191
+ }
192
+ }, [
193
+ collection,
194
+ stack
195
+ ]);
196
+ const items = collection.objects.map((object) => object.target).filter(nonNullable).map((object) => {
197
+ const metadata = metadataPlugin?.provides.metadata.resolver(getType(object)?.objectId ?? "never");
198
+ const view = {
199
+ ...stack.sections[object.id],
200
+ collapsed: collapsedSections[fullyQualifiedId(object)],
201
+ title: object?.title ?? toLocalizedString(graph.findNode(fullyQualifiedId(object))?.properties.label, t)
202
+ };
203
+ return {
204
+ id: fullyQualifiedId(object),
205
+ object,
206
+ metadata,
207
+ view
208
+ };
209
+ }) ?? [];
210
+ const handleDelete = useCallback(async (id2) => {
211
+ const index = collection.objects.map((object2) => object2.target).filter(nonNullable).findIndex((section) => fullyQualifiedId(section) === id2);
212
+ const object = collection.objects[index].target;
213
+ if (isReactiveObject(object)) {
214
+ await dispatch(createIntent(SpaceAction.RemoveObjects, {
215
+ objects: [
216
+ object
217
+ ],
218
+ target: collection
219
+ }));
220
+ }
221
+ }, [
222
+ collection,
223
+ dispatch
224
+ ]);
225
+ const handleAdd = useCallback(async (id2, position) => {
226
+ await dispatch?.(createIntent(LayoutAction.SetLayout, {
227
+ element: "dialog",
228
+ component: `${STACK_PLUGIN}/AddSectionDialog`,
229
+ subject: {
230
+ path: id2,
231
+ position,
232
+ collection
233
+ }
234
+ }));
235
+ }, [
236
+ collection,
237
+ dispatch
238
+ ]);
239
+ const handleNavigate = useCallback(async (id2) => {
240
+ await dispatch(createIntent(NavigationAction.Open, {
241
+ activeParts: {
242
+ main: [
243
+ id2
244
+ ]
245
+ }
246
+ }));
247
+ await dispatch(createIntent(LayoutAction.ScrollIntoView, {
248
+ id: id2
249
+ }));
250
+ }, [
251
+ dispatch
252
+ ]);
253
+ const handleCollapse = useCallback((id2, collapsed) => setCollapsedSections((prev) => ({
254
+ ...prev,
255
+ [id2]: collapsed
256
+ })), []);
257
+ const handleAddSection = useCallback(() => dispatch?.(createIntent(SpaceAction.OpenCreateObject, {
258
+ target: collection,
259
+ navigable: false
260
+ })), [
261
+ collection,
262
+ dispatch
263
+ ]);
264
+ return /* @__PURE__ */ React3.createElement(AttentionProvider, {
265
+ id
266
+ }, /* @__PURE__ */ React3.createElement(StackContext.Provider, {
267
+ value: {
268
+ onCollapse: handleCollapse,
269
+ onNavigate: handleNavigate,
270
+ onDelete: handleDelete,
271
+ onAdd: handleAdd
272
+ }
273
+ }, /* @__PURE__ */ React3.createElement(Stack, {
274
+ orientation: "vertical",
275
+ size: "intrinsic",
276
+ id,
277
+ "data-testid": "main.stack"
278
+ }, items.map((item) => /* @__PURE__ */ React3.createElement(StackSection, {
279
+ key: item.id,
280
+ ...item
281
+ }))), /* @__PURE__ */ React3.createElement("div", {
282
+ role: "none",
283
+ className: "flex mlb-2 pli-2 justify-center"
284
+ }, /* @__PURE__ */ React3.createElement(Button, {
285
+ "data-testid": "stack.createSection",
286
+ classNames: "gap-2",
287
+ onClick: handleAddSection
288
+ }, /* @__PURE__ */ React3.createElement(Plus, null), /* @__PURE__ */ React3.createElement("span", {
289
+ className: "sr-only"
290
+ }, t("add section label"))))));
291
+ };
292
+ var StackMain_default = StackMain;
293
+ export {
294
+ StackMain_default as default
295
+ };
296
+ //# sourceMappingURL=StackMain-EFCZCMIJ.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/components/StackMain.tsx", "../../../src/components/StackContext.tsx", "../../../src/components/StackSection.tsx", "../../../src/components/CaretDownUp.tsx"],
4
+ "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Plus } from '@phosphor-icons/react';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport {\n createIntent,\n LayoutAction,\n NavigationAction,\n parseMetadataResolverPlugin,\n useIntentDispatcher,\n useResolvePlugin,\n} from '@dxos/app-framework';\nimport { create, getType, fullyQualifiedId, isReactiveObject, makeRef } from '@dxos/client/echo';\nimport { useGraph } from '@dxos/plugin-graph';\nimport { SpaceAction } from '@dxos/plugin-space';\nimport { type CollectionType } from '@dxos/plugin-space/types';\nimport { Button, toLocalizedString, useTranslation } from '@dxos/react-ui';\nimport { AttentionProvider } from '@dxos/react-ui-attention';\nimport { Stack } from '@dxos/react-ui-stack';\nimport { nonNullable } from '@dxos/util';\n\nimport { StackContext } from './StackContext';\nimport { StackSection } from './StackSection';\nimport { STACK_PLUGIN } from '../meta';\nimport {\n StackViewType,\n type CollapsedSections,\n type StackSectionMetadata,\n type StackSectionView,\n type StackSectionItem,\n type AddSectionPosition,\n} from '../types';\n\ntype StackMainProps = {\n id: string;\n collection: CollectionType;\n};\n\nconst StackMain = ({ id, collection }: StackMainProps) => {\n const { dispatchPromise: dispatch } = useIntentDispatcher();\n const { graph } = useGraph();\n const { t } = useTranslation(STACK_PLUGIN);\n const metadataPlugin = useResolvePlugin(parseMetadataResolverPlugin);\n const defaultStack = useMemo(() => create(StackViewType, { sections: {} }), [collection]);\n const stack = (collection.views[StackViewType.typename]?.target as StackViewType | undefined) ?? defaultStack;\n const [collapsedSections, setCollapsedSections] = useState<CollapsedSections>({});\n\n useEffect(() => {\n if (!collection.views[StackViewType.typename]) {\n collection.views[StackViewType.typename] = makeRef(stack);\n }\n }, [collection, stack]);\n\n const items =\n collection.objects\n // TODO(wittjosiah): Should the database handle this differently?\n // TODO(wittjosiah): Render placeholders for missing objects so they can be removed from the stack?\n .map((object) => object.target)\n .filter(nonNullable)\n .map((object) => {\n const metadata = metadataPlugin?.provides.metadata.resolver(\n getType(object)?.objectId ?? 'never',\n ) as StackSectionMetadata;\n const view = {\n ...stack.sections[object.id],\n collapsed: collapsedSections[fullyQualifiedId(object)],\n title:\n (object as any)?.title ?? toLocalizedString(graph.findNode(fullyQualifiedId(object))?.properties.label, t),\n } as StackSectionView;\n return { id: fullyQualifiedId(object), object, metadata, view } satisfies StackSectionItem;\n }) ?? [];\n\n const handleDelete = useCallback(\n async (id: string) => {\n const index = collection.objects\n .map((object) => object.target)\n .filter(nonNullable)\n .findIndex((section) => fullyQualifiedId(section) === id);\n const object = collection.objects[index].target;\n if (isReactiveObject(object)) {\n await dispatch(createIntent(SpaceAction.RemoveObjects, { objects: [object], target: collection }));\n\n // TODO(wittjosiah): The section should also be removed, but needs to be restored if the action is undone.\n // delete stack.sections[Path.last(path)];\n }\n },\n [collection, dispatch],\n );\n\n const handleAdd = useCallback(\n async (id: string, position: AddSectionPosition) => {\n await dispatch?.(\n createIntent(LayoutAction.SetLayout, {\n element: 'dialog',\n component: `${STACK_PLUGIN}/AddSectionDialog`,\n subject: { path: id, position, collection },\n }),\n );\n },\n [collection, dispatch],\n );\n\n const handleNavigate = useCallback(\n async (id: string) => {\n await dispatch(createIntent(NavigationAction.Open, { activeParts: { main: [id] } }));\n await dispatch(createIntent(LayoutAction.ScrollIntoView, { id }));\n },\n [dispatch],\n );\n\n const handleCollapse = useCallback(\n (id: string, collapsed: boolean) => setCollapsedSections((prev) => ({ ...prev, [id]: collapsed })),\n [],\n );\n\n const handleAddSection = useCallback(\n () => dispatch?.(createIntent(SpaceAction.OpenCreateObject, { target: collection, navigable: false })),\n [collection, dispatch],\n );\n\n return (\n <AttentionProvider id={id}>\n <StackContext.Provider\n value={{\n onCollapse: handleCollapse,\n onNavigate: handleNavigate,\n onDelete: handleDelete,\n onAdd: handleAdd,\n }}\n >\n <Stack orientation='vertical' size='intrinsic' id={id} data-testid='main.stack'>\n {items.map((item) => (\n <StackSection key={item.id} {...item} />\n ))}\n </Stack>\n\n <div role='none' className='flex mlb-2 pli-2 justify-center'>\n <Button data-testid='stack.createSection' classNames='gap-2' onClick={handleAddSection}>\n <Plus />\n <span className='sr-only'>{t('add section label')}</span>\n </Button>\n </div>\n </StackContext.Provider>\n </AttentionProvider>\n );\n};\n\nexport default StackMain;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { createContext, useContext } from 'react';\n\nimport { type AddSectionPosition } from '../types';\n\nexport type StackContextValue = {\n onCollapse: (id: string, collapsed: boolean) => void;\n onNavigate: (id: string) => Promise<void>;\n onDelete: (id: string) => Promise<void>;\n onAdd: (id: string, position: AddSectionPosition) => void;\n};\n\nexport const StackContext = createContext<StackContextValue>({\n onCollapse: () => {},\n onNavigate: async () => {},\n onDelete: async () => {},\n onAdd: () => {},\n});\n\nexport const useStack = () => useContext(StackContext);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport React, { useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework';\nimport { DropdownMenu, Icon, useTranslation, IconButton } from '@dxos/react-ui';\nimport { useAttendableAttributes } from '@dxos/react-ui-attention';\nimport { StackItem } from '@dxos/react-ui-stack';\nimport { mx, getSize, textBlockWidth } from '@dxos/react-ui-theme';\n\nimport { CaretDownUp } from './CaretDownUp';\nimport { useStack } from './StackContext';\nimport { STACK_PLUGIN } from '../meta';\nimport { type StackSectionItem } from '../types';\n\nconst sectionActionDimensions = 'm-1 p-1 shrink-0 min-bs-0 is-[--rail-action] bs-min';\n\nexport const StackSection = ({\n id,\n view,\n object,\n metadata: { icon = 'ph--placeholder--regular' },\n}: StackSectionItem) => {\n const { t } = useTranslation(STACK_PLUGIN);\n const { onNavigate, onAdd, onCollapse, onDelete } = useStack();\n const [optionsMenuOpen, setOptionsMenuOpen] = useState(false);\n const attendableAttrs = useAttendableAttributes(id);\n\n return (\n <CollapsiblePrimitive.Root asChild open={!view.collapsed} onOpenChange={(nextOpen) => onCollapse?.(id, !nextOpen)}>\n <StackItem.Root item={{ id }} role='section' {...attendableAttrs} classNames='border-be border-separator'>\n <StackItem.Heading classNames='attention-surface border-ie !border-separator'>\n <span className='sr-only'>{view.title}</span>\n <div role='none' className='sticky -block-start-px bg-[--sticky-bg]'>\n <DropdownMenu.Root\n {...{\n open: optionsMenuOpen,\n onOpenChange: setOptionsMenuOpen,\n }}\n >\n <DropdownMenu.Trigger asChild>\n <StackItem.SigilButton>\n <Icon icon={icon} size={5} classNames='transition-opacity' />\n </StackItem.SigilButton>\n </DropdownMenu.Trigger>\n <DropdownMenu.Portal>\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>\n {view.collapsed ? (\n <DropdownMenu.Item onClick={() => onNavigate(id)} data-testid='section.navigate-to'>\n <Icon icon='ph--arrow-square-out--regular' size={5} />\n <span className='mis-2 grow'>{t('navigate to section label')}</span>\n </DropdownMenu.Item>\n ) : (\n <CollapsiblePrimitive.Trigger asChild>\n <DropdownMenu.Item>\n <CaretDownUp className={getSize(5)} />\n <span className='mis-2 grow'>{t('collapse label')}</span>\n </DropdownMenu.Item>\n </CollapsiblePrimitive.Trigger>\n )}\n <DropdownMenu.Item onClick={() => onAdd(id, 'before')} data-testid='section.add-before'>\n <Icon icon='ph--arrow-line-up--regular' size={5} />\n <span className='mis-2 grow'>{t('add section before label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={() => onAdd(id, 'after')} data-testid='section.add-after'>\n <Icon icon='ph--arrow-line-down--regular' size={5} />\n <span className='mis-2 grow'>{t('add section after label')}</span>\n </DropdownMenu.Item>\n <DropdownMenu.Item onClick={() => onDelete(id)} data-testid='section.remove'>\n <Icon icon='ph--trash--regular' size={5} />\n <span className='mis-2 grow'>{t('remove section label')}</span>\n </DropdownMenu.Item>\n </DropdownMenu.Viewport>\n <DropdownMenu.Arrow />\n </DropdownMenu.Content>\n </DropdownMenu.Portal>\n </DropdownMenu.Root>\n {view.collapsed ? (\n <CollapsiblePrimitive.Trigger asChild>\n <IconButton\n iconOnly\n variant='ghost'\n label={t('expand label')}\n icon='ph--caret-up-down--regular'\n classNames={sectionActionDimensions}\n />\n </CollapsiblePrimitive.Trigger>\n ) : (\n <IconButton\n iconOnly\n variant='ghost'\n onClick={() => onNavigate(id)}\n label={t('navigate to section label')}\n icon='ph--arrow-square-out--regular'\n data-testid='section.navigate-to'\n classNames={sectionActionDimensions}\n />\n )}\n </div>\n </StackItem.Heading>\n <CollapsiblePrimitive.Content>\n <Surface role='section' data={{ subject: object }} limit={1} placeholder={<></>} />\n </CollapsiblePrimitive.Content>\n {view.collapsed && (\n <StackItem.Content toolbar={false} classNames='attention-surface'>\n <h2 className={mx('flex items-center p-4 font-medium is-full', textBlockWidth)}>{view.title}</h2>\n </StackItem.Content>\n )}\n </StackItem.Root>\n </CollapsiblePrimitive.Root>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type ComponentPropsWithoutRef } from 'react';\n\nexport const CaretDownUp = ({ children, ...props }: ComponentPropsWithoutRef<'svg'>) => {\n return (\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' {...props}>\n <rect width='256' height='256' fill='none' />\n <polyline\n points='80 224 128 176 176 224'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n <polyline\n points='80 32 128 80 176 32'\n fill='none'\n stroke='currentColor'\n strokeLinecap='round'\n strokeLinejoin='round'\n strokeWidth='16'\n />\n {children}\n </svg>\n );\n};\n"],
5
+ "mappings": "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",
6
+ "names": ["Plus", "React", "useCallback", "useEffect", "useMemo", "useState", "createIntent", "LayoutAction", "NavigationAction", "parseMetadataResolverPlugin", "useIntentDispatcher", "useResolvePlugin", "create", "getType", "fullyQualifiedId", "isReactiveObject", "makeRef", "useGraph", "SpaceAction", "Button", "toLocalizedString", "useTranslation", "AttentionProvider", "Stack", "nonNullable", "createContext", "useContext", "StackContext", "createContext", "onCollapse", "onNavigate", "onDelete", "onAdd", "useStack", "useContext", "CollapsiblePrimitive", "React", "useState", "Surface", "DropdownMenu", "Icon", "useTranslation", "IconButton", "useAttendableAttributes", "StackItem", "mx", "getSize", "textBlockWidth", "React", "CaretDownUp", "children", "props", "svg", "xmlns", "viewBox", "rect", "width", "height", "fill", "polyline", "points", "stroke", "strokeLinecap", "strokeLinejoin", "strokeWidth", "sectionActionDimensions", "StackSection", "id", "view", "object", "metadata", "icon", "t", "useTranslation", "STACK_PLUGIN", "onNavigate", "onAdd", "onCollapse", "onDelete", "useStack", "optionsMenuOpen", "setOptionsMenuOpen", "useState", "attendableAttrs", "useAttendableAttributes", "React", "Root", "asChild", "open", "collapsed", "onOpenChange", "nextOpen", "StackItem", "item", "role", "classNames", "Heading", "span", "className", "title", "div", "DropdownMenu", "Trigger", "SigilButton", "Icon", "size", "Portal", "Content", "Viewport", "Item", "onClick", "data-testid", "CaretDownUp", "getSize", "Arrow", "IconButton", "iconOnly", "variant", "label", "Surface", "data", "subject", "limit", "placeholder", "toolbar", "h2", "mx", "textBlockWidth", "StackMain", "id", "collection", "dispatchPromise", "dispatch", "useIntentDispatcher", "graph", "useGraph", "t", "useTranslation", "STACK_PLUGIN", "metadataPlugin", "useResolvePlugin", "parseMetadataResolverPlugin", "defaultStack", "useMemo", "create", "StackViewType", "sections", "stack", "views", "typename", "target", "collapsedSections", "setCollapsedSections", "useState", "useEffect", "makeRef", "items", "objects", "map", "object", "filter", "nonNullable", "metadata", "provides", "resolver", "getType", "objectId", "view", "collapsed", "fullyQualifiedId", "title", "toLocalizedString", "findNode", "properties", "label", "handleDelete", "useCallback", "index", "findIndex", "section", "isReactiveObject", "createIntent", "SpaceAction", "RemoveObjects", "handleAdd", "position", "LayoutAction", "SetLayout", "element", "component", "subject", "path", "handleNavigate", "NavigationAction", "Open", "activeParts", "main", "ScrollIntoView", "handleCollapse", "prev", "handleAddSection", "OpenCreateObject", "navigable", "React", "AttentionProvider", "StackContext", "Provider", "value", "onCollapse", "onNavigate", "onDelete", "onAdd", "Stack", "orientation", "size", "data-testid", "item", "StackSection", "key", "div", "role", "className", "Button", "classNames", "onClick", "Plus", "span"]
7
+ }
@@ -10,12 +10,11 @@ import {
10
10
  } from "./chunk-3ZYHKSIS.mjs";
11
11
 
12
12
  // packages/plugins/plugin-stack/src/StackPlugin.tsx
13
- import React3 from "react";
14
- import { create as create2, fullyQualifiedId } from "@dxos/client/echo";
13
+ import React2 from "react";
14
+ import { createSurface } from "@dxos/app-framework";
15
+ import { fullyQualifiedId } from "@dxos/client/echo";
15
16
  import { LocalStorageStore } from "@dxos/local-storage";
16
17
  import { CollectionType } from "@dxos/plugin-space/types";
17
- import { Main } from "@dxos/react-ui";
18
- import { baseSurface, topbarBlockPaddingStart, bottombarBlockPaddingEnd } from "@dxos/react-ui-theme";
19
18
 
20
19
  // packages/plugins/plugin-stack/src/components/index.ts
21
20
  import { lazy } from "react";
@@ -34,118 +33,8 @@ var StackSettings = ({ settings }) => {
34
33
  })));
35
34
  };
36
35
 
37
- // packages/plugins/plugin-stack/src/components/AddSectionDialog.tsx
38
- import { FilePlus } from "@phosphor-icons/react";
39
- import React2, { useCallback, useRef, useState } from "react";
40
- import { usePlugin, useIntent, LayoutAction, useResolvePlugin, parseFileManagerPlugin } from "@dxos/app-framework";
41
- import { create, getSpace } from "@dxos/client/echo";
42
- import { FileType } from "@dxos/plugin-ipfs/types";
43
- import { Dialog, toLocalizedString, useTranslation as useTranslation2 } from "@dxos/react-ui";
44
- import { Path } from "@dxos/react-ui-mosaic";
45
- import { SearchList } from "@dxos/react-ui-searchlist";
46
- import { getSize, mx } from "@dxos/react-ui-theme";
47
- import { nonNullable } from "@dxos/util";
48
- var dataHasAddSectionDialogProps = (data) => {
49
- return "subject" in data && typeof data.subject === "object" && !!data.subject && "position" in data.subject && typeof data.subject.position === "string" && "collection" in data.subject;
50
- };
51
- var AddSectionDialog = ({ path, position, collection }) => {
52
- const { t } = useTranslation2(STACK_PLUGIN);
53
- const stackPlugin = usePlugin(STACK_PLUGIN);
54
- const fileManagerPlugin = useResolvePlugin(parseFileManagerPlugin);
55
- const fileRef = useRef(null);
56
- const { dispatch } = useIntent();
57
- const space = getSpace(collection);
58
- const [pending, setPending] = useState(false);
59
- const [uploadError, setUploadError] = useState();
60
- const handleAdd = useCallback((sectionObject) => {
61
- const index = position === "beforeAll" ? 0 : position === "afterAll" ? collection.objects.length : collection.objects.filter(nonNullable).findIndex((section) => section.id === Path.last(path));
62
- collection.objects.splice(index + (position === "after" ? 1 : 0), 0, sectionObject);
63
- const stack = collection.views[StackViewType.typename];
64
- if (stack) {
65
- stack.sections[sectionObject.id] = {};
66
- }
67
- setPending(false);
68
- void dispatch?.({
69
- action: LayoutAction.SET_LAYOUT,
70
- data: {
71
- element: "dialog",
72
- state: false
73
- }
74
- });
75
- }, [
76
- collection,
77
- path,
78
- position,
79
- dispatch
80
- ]);
81
- const handleFileUpload = fileManagerPlugin?.provides.file.upload && space ? async (file) => {
82
- const filename = file.name.split(".")[0];
83
- try {
84
- const info = await fileManagerPlugin.provides.file.upload?.(file, space);
85
- if (info) {
86
- const obj = create(FileType, {
87
- type: file.type,
88
- name: filename,
89
- filename,
90
- cid: info.cid
91
- });
92
- handleAdd(obj);
93
- }
94
- } catch (err) {
95
- setUploadError(err);
96
- }
97
- } : void 0;
98
- return /* @__PURE__ */ React2.createElement(Dialog.Content, null, /* @__PURE__ */ React2.createElement(Dialog.Title, null, t(`add section ${position} dialog title`)), /* @__PURE__ */ React2.createElement(SearchList.Root, {
99
- label: t("add section input placeholder")
100
- }, /* @__PURE__ */ React2.createElement(SearchList.Input, {
101
- placeholder: t("add section input placeholder"),
102
- classNames: "pli-3",
103
- disabled: pending
104
- }), /* @__PURE__ */ React2.createElement(SearchList.Content, {
105
- classNames: "min-bs-24 bs-fit max-bs-64 overflow-auto",
106
- ...pending && {
107
- inert: "true"
108
- }
109
- }, stackPlugin?.provides?.stack.creators?.map(({ id, icon: Icon, label: propsLabel, testId, intent }) => {
110
- const label = toLocalizedString(propsLabel, t);
111
- return /* @__PURE__ */ React2.createElement(SearchList.Item, {
112
- value: label,
113
- key: id,
114
- onSelect: async () => {
115
- setPending(true);
116
- const { data: nextSection } = await dispatch({
117
- ...intent,
118
- data: {
119
- space
120
- }
121
- }) ?? {};
122
- handleAdd(nextSection);
123
- },
124
- classNames: "flex items-center gap-2 pli-2",
125
- "data-testid": testId
126
- }, Icon && /* @__PURE__ */ React2.createElement(Icon, {
127
- className: mx(getSize(4), "shrink-0")
128
- }), /* @__PURE__ */ React2.createElement("span", {
129
- className: "grow truncate"
130
- }, label));
131
- }), handleFileUpload && /* @__PURE__ */ React2.createElement(SearchList.Item, {
132
- value: t("upload file label"),
133
- classNames: "flex items-center gap-2 pli-2",
134
- onSelect: () => fileRef.current?.click()
135
- }, /* @__PURE__ */ React2.createElement(FilePlus, null), /* @__PURE__ */ React2.createElement("span", {
136
- className: "grow truncate"
137
- }, t("upload file label"))), uploadError && /* @__PURE__ */ React2.createElement("div", {
138
- className: "text-error-500"
139
- }, uploadError.message))), handleFileUpload && /* @__PURE__ */ React2.createElement("input", {
140
- type: "file",
141
- className: "sr-only",
142
- ref: fileRef,
143
- onChange: ({ target: { files } }) => files && handleFileUpload(files[0])
144
- }));
145
- };
146
-
147
36
  // packages/plugins/plugin-stack/src/components/index.ts
148
- var StackMain = lazy(() => import("./StackMain-5I43UWGF.mjs"));
37
+ var StackMain = lazy(() => import("./StackMain-EFCZCMIJ.mjs"));
149
38
 
150
39
  // packages/plugins/plugin-stack/src/translations.ts
151
40
  import { translations as stackTranslations } from "@dxos/react-ui-stack";
@@ -182,24 +71,13 @@ var StackPlugin = () => {
182
71
  const settings = new LocalStorageStore(STACK_PLUGIN, {
183
72
  separation: true
184
73
  });
185
- const stackState = create2({
186
- creators: []
187
- });
188
74
  return {
189
75
  meta: meta_default,
190
- ready: async (plugins) => {
76
+ ready: async () => {
191
77
  settings.prop({
192
78
  key: "separation",
193
79
  type: LocalStorageStore.bool()
194
80
  });
195
- for (const plugin of plugins) {
196
- if (plugin.meta.id === STACK_PLUGIN) {
197
- continue;
198
- }
199
- if (Array.isArray(plugin.provides?.stack?.creators)) {
200
- stackState.creators.push(...plugin.provides.stack.creators ?? []);
201
- }
202
- }
203
81
  },
204
82
  provides: {
205
83
  settings: settings.values,
@@ -239,48 +117,35 @@ var StackPlugin = () => {
239
117
  ]
240
118
  },
241
119
  surface: {
242
- component: ({ data, role }) => {
243
- switch (data.component) {
244
- case `${STACK_PLUGIN}/AddSectionDialog`:
245
- return dataHasAddSectionDialogProps(data) ? /* @__PURE__ */ React3.createElement(AddSectionDialog, data.subject) : null;
246
- }
247
- const primary = data.active ?? data.object;
248
- const id = typeof data.id === "string" ? data.id : void 0;
249
- switch (role) {
250
- case "main":
251
- return primary instanceof CollectionType ? /* @__PURE__ */ React3.createElement(Main.Content, {
252
- bounce: true,
253
- classNames: [
254
- baseSurface,
255
- topbarBlockPaddingStart,
256
- bottombarBlockPaddingEnd
257
- ]
258
- }, /* @__PURE__ */ React3.createElement(StackMain, {
259
- id: id ?? fullyQualifiedId(primary),
260
- collection: primary
261
- })) : null;
262
- case "article":
263
- return primary instanceof CollectionType ? /* @__PURE__ */ React3.createElement("div", {
120
+ definitions: () => [
121
+ createSurface({
122
+ id: `${STACK_PLUGIN}/article`,
123
+ role: "article",
124
+ filter: (data) => data.subject instanceof CollectionType,
125
+ component: ({ data }) => {
126
+ const id = typeof data.id === "string" ? data.id : void 0;
127
+ return /* @__PURE__ */ React2.createElement("div", {
264
128
  role: "none",
265
129
  className: "overflow-auto",
266
130
  style: {
267
131
  contain: "layout"
268
132
  }
269
- }, /* @__PURE__ */ React3.createElement(StackMain, {
270
- id: id ?? fullyQualifiedId(primary),
271
- collection: primary
272
- })) : null;
273
- case "settings": {
274
- return data.plugin === meta_default.id ? /* @__PURE__ */ React3.createElement(StackSettings, {
275
- settings: settings.values
276
- }) : null;
133
+ }, /* @__PURE__ */ React2.createElement(StackMain, {
134
+ id: id ?? fullyQualifiedId(data.subject),
135
+ collection: data.subject
136
+ }));
277
137
  }
278
- default:
279
- return null;
280
- }
281
- }
282
- },
283
- stack: stackState
138
+ }),
139
+ createSurface({
140
+ id: `${STACK_PLUGIN}/settings`,
141
+ role: "settings",
142
+ filter: (data) => data.plugin === meta_default.id,
143
+ component: () => /* @__PURE__ */ React2.createElement(StackSettings, {
144
+ settings: settings.values
145
+ })
146
+ })
147
+ ]
148
+ }
284
149
  }
285
150
  };
286
151
  };