@dxos/plugin-deck 0.8.1-staging.5be625a → 0.8.1-staging.9eaf14f

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 (161) hide show
  1. package/dist/lib/browser/{app-graph-builder-K4KVSHNT.mjs → app-graph-builder-VYZ4IWI3.mjs} +3 -3
  2. package/dist/lib/browser/{check-app-scheme-6SS6I3RN.mjs → check-app-scheme-SEYECDHI.mjs} +2 -2
  3. package/dist/lib/browser/{chunk-RZLH5F56.mjs → chunk-6ZSOFCPP.mjs} +26 -6
  4. package/dist/lib/browser/chunk-6ZSOFCPP.mjs.map +7 -0
  5. package/dist/lib/browser/chunk-B4LOJUWW.mjs +24 -0
  6. package/dist/lib/browser/{chunk-MWUT66KV.mjs → chunk-FJBMNSUC.mjs} +547 -493
  7. package/dist/lib/browser/chunk-FJBMNSUC.mjs.map +7 -0
  8. package/dist/lib/browser/chunk-FLOVGNYB.mjs +81 -0
  9. package/dist/lib/browser/chunk-FLOVGNYB.mjs.map +7 -0
  10. package/dist/lib/browser/{chunk-2WTHB3TG.mjs → chunk-NSATFAEE.mjs} +3 -3
  11. package/dist/lib/browser/{chunk-2WTHB3TG.mjs.map → chunk-NSATFAEE.mjs.map} +1 -1
  12. package/dist/lib/browser/{chunk-7X43JKZG.mjs → chunk-RJNCG4ND.mjs} +41 -45
  13. package/dist/lib/browser/chunk-RJNCG4ND.mjs.map +7 -0
  14. package/dist/lib/browser/{chunk-WCNPMAR4.mjs → chunk-XMCG42ID.mjs} +2 -3
  15. package/dist/lib/browser/chunk-XMCG42ID.mjs.map +7 -0
  16. package/dist/lib/browser/index.mjs +12 -8
  17. package/dist/lib/browser/index.mjs.map +3 -3
  18. package/dist/lib/browser/{intent-resolver-MEBOMCYI.mjs → intent-resolver-UDYKO2QW.mjs} +39 -78
  19. package/dist/lib/browser/intent-resolver-UDYKO2QW.mjs.map +7 -0
  20. package/dist/lib/browser/meta.json +1 -1
  21. package/dist/lib/browser/{react-root-USUAHDML.mjs → react-root-XLXN2VEW.mjs} +8 -10
  22. package/dist/lib/browser/react-root-XLXN2VEW.mjs.map +7 -0
  23. package/dist/lib/browser/{react-surface-TQG4YYES.mjs → react-surface-WNGMZL7I.mjs} +11 -10
  24. package/dist/lib/browser/react-surface-WNGMZL7I.mjs.map +7 -0
  25. package/dist/lib/browser/{settings-DYS3FFMN.mjs → settings-HMDGSBGO.mjs} +5 -4
  26. package/dist/lib/browser/settings-HMDGSBGO.mjs.map +7 -0
  27. package/dist/lib/browser/{state-DRRCGMU2.mjs → state-7TN26M42.mjs} +4 -4
  28. package/dist/lib/browser/{state-DRRCGMU2.mjs.map → state-7TN26M42.mjs.map} +2 -2
  29. package/dist/lib/browser/{tools-NDEUSO4R.mjs → tools-SC6QEN7R.mjs} +3 -3
  30. package/dist/lib/browser/types.mjs +12 -12
  31. package/dist/lib/browser/{url-handler-4BCN7AYC.mjs → url-handler-ODG4B6NX.mjs} +4 -4
  32. package/dist/types/src/DeckPlugin.d.ts.map +1 -1
  33. package/dist/types/src/capabilities/capabilities.d.ts +10 -12
  34. package/dist/types/src/capabilities/capabilities.d.ts.map +1 -1
  35. package/dist/types/src/capabilities/intent-resolver.d.ts.map +1 -1
  36. package/dist/types/src/capabilities/react-root.d.ts.map +1 -1
  37. package/dist/types/src/capabilities/react-surface.d.ts.map +1 -1
  38. package/dist/types/src/capabilities/settings.d.ts.map +1 -1
  39. package/dist/types/src/capabilities/state.d.ts +5 -5
  40. package/dist/types/src/components/DeckLayout/ActiveNode.d.ts.map +1 -1
  41. package/dist/types/src/components/DeckLayout/Banner.d.ts.map +1 -1
  42. package/dist/types/src/components/DeckLayout/DeckLayout.d.ts +1 -4
  43. package/dist/types/src/components/DeckLayout/DeckLayout.d.ts.map +1 -1
  44. package/dist/types/src/components/DeckLayout/Toast.d.ts.map +1 -1
  45. package/dist/types/src/components/DeckLayout/index.d.ts +1 -0
  46. package/dist/types/src/components/DeckLayout/index.d.ts.map +1 -1
  47. package/dist/types/src/components/DeckSettings/DeckSettings.d.ts +6 -0
  48. package/dist/types/src/components/DeckSettings/DeckSettings.d.ts.map +1 -0
  49. package/dist/types/src/components/DeckSettings/index.d.ts +2 -0
  50. package/dist/types/src/components/DeckSettings/index.d.ts.map +1 -0
  51. package/dist/types/src/components/Plank/Plank.d.ts +14 -0
  52. package/dist/types/src/components/Plank/Plank.d.ts.map +1 -0
  53. package/dist/types/src/components/Plank/Plank.stories.d.ts +8 -0
  54. package/dist/types/src/components/Plank/Plank.stories.d.ts.map +1 -0
  55. package/dist/types/src/components/{DeckLayout → Plank}/PlankControls.d.ts +2 -0
  56. package/dist/types/src/components/Plank/PlankControls.d.ts.map +1 -0
  57. package/dist/types/src/components/{DeckLayout → Plank}/PlankError.d.ts +2 -2
  58. package/dist/types/src/components/Plank/PlankError.d.ts.map +1 -0
  59. package/dist/types/src/components/{DeckLayout/NodePlankHeading.d.ts → Plank/PlankHeading.d.ts} +7 -6
  60. package/dist/types/src/components/Plank/PlankHeading.d.ts.map +1 -0
  61. package/dist/types/src/components/Plank/PlankLoading.d.ts.map +1 -0
  62. package/dist/types/src/components/Plank/index.d.ts +6 -0
  63. package/dist/types/src/components/Plank/index.d.ts.map +1 -0
  64. package/dist/types/src/components/Sidebar/ComplementarySidebar.d.ts.map +1 -0
  65. package/dist/types/src/components/Sidebar/Sidebar.d.ts.map +1 -0
  66. package/dist/types/src/components/Sidebar/SidebarButton.d.ts.map +1 -0
  67. package/dist/types/src/components/Sidebar/index.d.ts +4 -0
  68. package/dist/types/src/components/Sidebar/index.d.ts.map +1 -0
  69. package/dist/types/src/components/index.d.ts +1 -1
  70. package/dist/types/src/components/index.d.ts.map +1 -1
  71. package/dist/types/src/events.d.ts +0 -1
  72. package/dist/types/src/events.d.ts.map +1 -1
  73. package/dist/types/src/hooks/index.d.ts +0 -1
  74. package/dist/types/src/hooks/index.d.ts.map +1 -1
  75. package/dist/types/src/index.d.ts +1 -0
  76. package/dist/types/src/index.d.ts.map +1 -1
  77. package/dist/types/src/layout.d.ts +7 -1
  78. package/dist/types/src/layout.d.ts.map +1 -1
  79. package/dist/types/src/translations.d.ts +3 -0
  80. package/dist/types/src/translations.d.ts.map +1 -1
  81. package/dist/types/src/types.d.ts +31 -60
  82. package/dist/types/src/types.d.ts.map +1 -1
  83. package/dist/types/src/util/index.d.ts +1 -0
  84. package/dist/types/src/util/index.d.ts.map +1 -1
  85. package/dist/types/src/util/set-active.d.ts +2 -2
  86. package/dist/types/src/util/set-active.d.ts.map +1 -1
  87. package/dist/types/src/util/useCompanions.d.ts +8 -0
  88. package/dist/types/src/util/useCompanions.d.ts.map +1 -0
  89. package/dist/types/src/util/useHoistStatusbar.d.ts.map +1 -1
  90. package/package.json +28 -29
  91. package/src/DeckPlugin.ts +0 -1
  92. package/src/capabilities/capabilities.ts +3 -4
  93. package/src/capabilities/intent-resolver.ts +35 -7
  94. package/src/capabilities/react-root.tsx +1 -9
  95. package/src/capabilities/react-surface.tsx +3 -4
  96. package/src/capabilities/settings.ts +7 -2
  97. package/src/capabilities/state.ts +3 -3
  98. package/src/components/DeckLayout/ActiveNode.tsx +2 -1
  99. package/src/components/DeckLayout/Banner.tsx +5 -3
  100. package/src/components/DeckLayout/ContentEmpty.tsx +1 -1
  101. package/src/components/DeckLayout/DeckLayout.tsx +27 -16
  102. package/src/components/DeckLayout/Fullscreen.tsx +1 -1
  103. package/src/components/DeckLayout/Toast.tsx +1 -1
  104. package/src/components/DeckLayout/index.ts +2 -0
  105. package/src/components/{LayoutSettings.tsx → DeckSettings/DeckSettings.tsx} +15 -10
  106. package/src/components/DeckSettings/index.ts +5 -0
  107. package/src/components/Plank/Plank.stories.tsx +43 -0
  108. package/src/components/{DeckLayout → Plank}/Plank.tsx +46 -37
  109. package/src/components/{DeckLayout → Plank}/PlankControls.tsx +40 -25
  110. package/src/components/{DeckLayout → Plank}/PlankError.tsx +3 -3
  111. package/src/components/{DeckLayout/NodePlankHeading.tsx → Plank/PlankHeading.tsx} +98 -59
  112. package/src/components/Plank/index.ts +9 -0
  113. package/src/components/{DeckLayout → Sidebar}/ComplementarySidebar.tsx +65 -81
  114. package/src/components/Sidebar/index.ts +7 -0
  115. package/src/components/index.ts +1 -1
  116. package/src/events.ts +0 -1
  117. package/src/hooks/index.ts +0 -1
  118. package/src/index.ts +1 -0
  119. package/src/layout.ts +19 -2
  120. package/src/meta.ts +2 -2
  121. package/src/translations.ts +3 -0
  122. package/src/types.ts +59 -86
  123. package/src/util/index.ts +1 -0
  124. package/src/util/set-active.ts +2 -2
  125. package/src/util/useCompanions.ts +18 -0
  126. package/src/util/useHoistStatusbar.ts +2 -2
  127. package/dist/lib/browser/chunk-7X43JKZG.mjs.map +0 -7
  128. package/dist/lib/browser/chunk-MWUT66KV.mjs.map +0 -7
  129. package/dist/lib/browser/chunk-NSNAYFAX.mjs +0 -24
  130. package/dist/lib/browser/chunk-RZLH5F56.mjs.map +0 -7
  131. package/dist/lib/browser/chunk-WCNPMAR4.mjs.map +0 -7
  132. package/dist/lib/browser/intent-resolver-MEBOMCYI.mjs.map +0 -7
  133. package/dist/lib/browser/react-root-USUAHDML.mjs.map +0 -7
  134. package/dist/lib/browser/react-surface-TQG4YYES.mjs.map +0 -7
  135. package/dist/lib/browser/settings-DYS3FFMN.mjs.map +0 -7
  136. package/dist/types/src/components/DeckLayout/ComplementarySidebar.d.ts.map +0 -1
  137. package/dist/types/src/components/DeckLayout/NodePlankHeading.d.ts.map +0 -1
  138. package/dist/types/src/components/DeckLayout/Plank.d.ts +0 -13
  139. package/dist/types/src/components/DeckLayout/Plank.d.ts.map +0 -1
  140. package/dist/types/src/components/DeckLayout/PlankControls.d.ts.map +0 -1
  141. package/dist/types/src/components/DeckLayout/PlankError.d.ts.map +0 -1
  142. package/dist/types/src/components/DeckLayout/PlankLoading.d.ts.map +0 -1
  143. package/dist/types/src/components/DeckLayout/Sidebar.d.ts.map +0 -1
  144. package/dist/types/src/components/DeckLayout/SidebarButton.d.ts.map +0 -1
  145. package/dist/types/src/components/LayoutSettings.d.ts +0 -6
  146. package/dist/types/src/components/LayoutSettings.d.ts.map +0 -1
  147. package/dist/types/src/hooks/useNode.d.ts +0 -11
  148. package/dist/types/src/hooks/useNode.d.ts.map +0 -1
  149. package/src/hooks/useNode.ts +0 -46
  150. /package/dist/lib/browser/{app-graph-builder-K4KVSHNT.mjs.map → app-graph-builder-VYZ4IWI3.mjs.map} +0 -0
  151. /package/dist/lib/browser/{check-app-scheme-6SS6I3RN.mjs.map → check-app-scheme-SEYECDHI.mjs.map} +0 -0
  152. /package/dist/lib/browser/{chunk-NSNAYFAX.mjs.map → chunk-B4LOJUWW.mjs.map} +0 -0
  153. /package/dist/lib/browser/{tools-NDEUSO4R.mjs.map → tools-SC6QEN7R.mjs.map} +0 -0
  154. /package/dist/lib/browser/{url-handler-4BCN7AYC.mjs.map → url-handler-ODG4B6NX.mjs.map} +0 -0
  155. /package/dist/types/src/components/{DeckLayout → Plank}/PlankLoading.d.ts +0 -0
  156. /package/dist/types/src/components/{DeckLayout → Sidebar}/ComplementarySidebar.d.ts +0 -0
  157. /package/dist/types/src/components/{DeckLayout → Sidebar}/Sidebar.d.ts +0 -0
  158. /package/dist/types/src/components/{DeckLayout → Sidebar}/SidebarButton.d.ts +0 -0
  159. /package/src/components/{DeckLayout → Plank}/PlankLoading.tsx +0 -0
  160. /package/src/components/{DeckLayout → Sidebar}/Sidebar.tsx +0 -0
  161. /package/src/components/{DeckLayout → Sidebar}/SidebarButton.tsx +0 -0
@@ -1,30 +1,43 @@
1
+ import {
2
+ parseEntryId
3
+ } from "./chunk-FLOVGNYB.mjs";
1
4
  import {
2
5
  calculateOverscroll,
3
6
  layoutAppliesTopbar,
4
7
  useBreakpoints,
8
+ useCompanions,
5
9
  useHoistStatusbar
6
- } from "./chunk-RZLH5F56.mjs";
10
+ } from "./chunk-6ZSOFCPP.mjs";
7
11
  import {
8
12
  DeckCapabilities
9
- } from "./chunk-WCNPMAR4.mjs";
13
+ } from "./chunk-XMCG42ID.mjs";
10
14
  import {
15
+ ATTENDABLE_PATH_SEPARATOR,
16
+ DECK_COMPANION_TYPE,
11
17
  DeckAction,
12
18
  NewPlankPositions,
13
19
  OverscrollOptions,
14
- SLUG_PATH_SEPARATOR,
15
- getMode,
16
- surfaceVariantSeparator
17
- } from "./chunk-7X43JKZG.mjs";
20
+ PLANK_COMPANION_TYPE,
21
+ getMode
22
+ } from "./chunk-RJNCG4ND.mjs";
18
23
  import {
19
24
  DECK_PLUGIN
20
- } from "./chunk-2WTHB3TG.mjs";
25
+ } from "./chunk-NSATFAEE.mjs";
21
26
 
22
27
  // packages/plugins/plugin-deck/src/components/DeckLayout/Banner.tsx
23
- import React2 from "react";
24
- import { Surface } from "@dxos/app-framework";
25
- import { mx } from "@dxos/react-ui-theme";
28
+ import React9 from "react";
29
+ import { Surface as Surface5 } from "@dxos/app-framework";
30
+ import { useTranslation as useTranslation6 } from "@dxos/react-ui";
31
+ import { mx as mx4 } from "@dxos/react-ui-theme";
32
+
33
+ // packages/plugins/plugin-deck/src/components/Sidebar/ComplementarySidebar.tsx
34
+ import React7, { Fragment as Fragment3, useCallback as useCallback4, useEffect as useEffect4, useMemo as useMemo3, useState as useState2 } from "react";
35
+ import { LayoutAction as LayoutAction3, Surface as Surface3, createIntent as createIntent4, useAppGraph as useAppGraph3, useCapability as useCapability3, useIntentDispatcher as useIntentDispatcher4 } from "@dxos/app-framework";
36
+ import { Main, useTranslation as useTranslation5, toLocalizedString as toLocalizedString2, IconButton as IconButton3 } from "@dxos/react-ui";
37
+ import { Tabs } from "@dxos/react-ui-tabs";
38
+ import { byPosition } from "@dxos/util";
26
39
 
27
- // packages/plugins/plugin-deck/src/components/DeckLayout/SidebarButton.tsx
40
+ // packages/plugins/plugin-deck/src/components/Sidebar/SidebarButton.tsx
28
41
  import React from "react";
29
42
  import { useCapability } from "@dxos/app-framework";
30
43
  import { IconButton, useTranslation } from "@dxos/react-ui";
@@ -72,164 +85,45 @@ var ToggleComplementarySidebarButton = ({ inR0, classNames }) => {
72
85
  });
73
86
  };
74
87
 
75
- // packages/plugins/plugin-deck/src/components/DeckLayout/Banner.tsx
76
- var Banner = ({ variant, classNames }) => {
77
- return /* @__PURE__ */ React2.createElement("header", {
78
- className: mx("flex items-stretch relative plb-1 pis-1 pie-2", variant === "topbar" && "fixed inset-inline-0 block-start-[env(safe-area-inset-top)] bs-[--rail-size] border-be border-separator", classNames)
79
- }, variant === "sidebar" ? /* @__PURE__ */ React2.createElement(CloseSidebarButton, null) : /* @__PURE__ */ React2.createElement(ToggleSidebarButton, null), /* @__PURE__ */ React2.createElement("span", {
80
- className: "self-center grow mis-1"
81
- }, "Composer"), variant === "topbar" && /* @__PURE__ */ React2.createElement("div", {
82
- role: "none",
83
- className: "absolute inset-0 pointer-events-none"
84
- }, /* @__PURE__ */ React2.createElement("div", {
85
- role: "none",
86
- className: "grid bs-full pointer-fine:p-1 max-is-md mli-auto pointer-events-auto"
87
- }, /* @__PURE__ */ React2.createElement(Surface, {
88
- role: "search-input",
89
- limit: 1
90
- }))), /* @__PURE__ */ React2.createElement("span", {
91
- role: "none",
92
- className: "grow"
93
- }), /* @__PURE__ */ React2.createElement(Surface, {
94
- role: "header-end",
95
- limit: 1
96
- }), /* @__PURE__ */ React2.createElement(Surface, {
97
- role: "notch-start",
98
- limit: 1
99
- }));
100
- };
101
-
102
- // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
103
- import { untracked } from "@preact/signals-core";
104
- import React17, { useCallback as useCallback5, useEffect as useEffect6, useMemo as useMemo5, useRef as useRef2, Fragment as Fragment4, useState as useState4 } from "react";
105
- import { LayoutAction as LayoutAction4, createIntent as createIntent5, Surface as Surface10, useCapability as useCapability5, useIntentDispatcher as useIntentDispatcher5, usePluginManager } from "@dxos/app-framework";
106
- import { AttentionCapabilities } from "@dxos/plugin-attention";
107
- import { AlertDialog, Dialog as NaturalDialog, Main as Main3, Popover as Popover2, useMediaQuery, useOnTransition } from "@dxos/react-ui";
108
- import { Stack, StackContext, DEFAULT_HORIZONTAL_SIZE } from "@dxos/react-ui-stack";
109
- import { mainPaddingTransitions } from "@dxos/react-ui-theme";
110
-
111
- // packages/plugins/plugin-deck/src/components/DeckLayout/ActiveNode.tsx
112
- import React3 from "react";
113
- import { Surface as Surface2, useAppGraph } from "@dxos/app-framework";
114
- import { useAttended } from "@dxos/react-ui-attention";
115
-
116
- // packages/plugins/plugin-deck/src/hooks/useNode.ts
117
- import { useEffect, useState } from "react";
118
- var useNode = (graph, id, timeout) => {
119
- const [nodeState, setNodeState] = useState(id ? graph.findNode(id, false) : void 0);
120
- useEffect(() => {
121
- if (!id && nodeState) {
122
- setNodeState(void 0);
123
- }
124
- if (nodeState?.id === id || !id) {
125
- return;
126
- }
127
- const frame = requestAnimationFrame(async () => {
128
- try {
129
- const node = await graph.waitForNode(id, timeout);
130
- if (node) {
131
- setNodeState(node);
132
- }
133
- } catch {
134
- }
135
- });
136
- return () => cancelAnimationFrame(frame);
137
- }, [
138
- graph,
139
- id,
140
- timeout,
141
- nodeState?.id
142
- ]);
143
- return nodeState;
144
- };
145
-
146
- // packages/plugins/plugin-deck/src/hooks/useNodeActionExpander.ts
147
- import { useEffect as useEffect2 } from "react";
148
- import { ACTION_GROUP_TYPE, ACTION_TYPE, getGraph } from "@dxos/plugin-graph";
149
- var expandNodeActions = async (node) => {
150
- const graph = getGraph(node);
151
- await graph.expand(node, "outbound", ACTION_GROUP_TYPE);
152
- await graph.expand(node, "outbound", ACTION_TYPE);
153
- };
154
- var useNodeActionExpander = (node) => {
155
- useEffect2(() => {
156
- if (node) {
157
- const frame = requestAnimationFrame(() => {
158
- void expandNodeActions(node);
159
- });
160
- return () => cancelAnimationFrame(frame);
161
- }
162
- }, [
163
- node
164
- ]);
165
- };
166
-
167
- // packages/plugins/plugin-deck/src/hooks/useMainSize.ts
168
- import { useMainContext } from "@dxos/react-ui";
169
- var useMainSize = () => {
170
- const { navigationSidebarState, complementarySidebarState } = useMainContext("DeckPluginPlank");
171
- return {
172
- "data-sidebar-inline-start-state": navigationSidebarState,
173
- "data-sidebar-inline-end-state": complementarySidebarState
174
- };
175
- };
176
-
177
- // packages/plugins/plugin-deck/src/components/DeckLayout/ActiveNode.tsx
178
- var ActiveNode = () => {
179
- const [id] = useAttended();
180
- const { graph } = useAppGraph();
181
- const activeNode = useNode(graph, id);
182
- useNodeActionExpander(activeNode);
183
- return /* @__PURE__ */ React3.createElement("div", {
184
- role: "none",
185
- className: "sr-only"
186
- }, /* @__PURE__ */ React3.createElement(Surface2, {
187
- role: "document-title",
188
- data: {
189
- subject: activeNode
190
- },
191
- limit: 1
192
- }));
193
- };
194
-
195
- // packages/plugins/plugin-deck/src/components/DeckLayout/ComplementarySidebar.tsx
196
- import React8, { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo2, useState as useState3, Fragment as Fragment2 } from "react";
197
- import { createIntent as createIntent3, LayoutAction as LayoutAction2, Surface as Surface4, useAppGraph as useAppGraph3, useCapabilities, useCapability as useCapability2, useIntentDispatcher as useIntentDispatcher3 } from "@dxos/app-framework";
198
- import { Main, useTranslation as useTranslation5, toLocalizedString as toLocalizedString2, IconButton as IconButton2, ScrollArea as NaturalScrollArea } from "@dxos/react-ui";
199
- import { useAttended as useAttended2 } from "@dxos/react-ui-attention";
200
- import { Tabs } from "@dxos/react-ui-tabs";
201
- import { byPosition } from "@dxos/util";
88
+ // packages/plugins/plugin-deck/src/components/Plank/Plank.tsx
89
+ import React6, { Fragment as Fragment2, memo as memo2, useCallback as useCallback3, useLayoutEffect, useMemo as useMemo2, useRef } from "react";
90
+ import { LayoutAction as LayoutAction2, Surface as Surface2, createIntent as createIntent3, useCapability as useCapability2, useAppGraph as useAppGraph2, useIntentDispatcher as useIntentDispatcher3 } from "@dxos/app-framework";
91
+ import { debounce } from "@dxos/async";
92
+ import { useNode } from "@dxos/plugin-graph";
93
+ import { ATTENDABLE_PATH_SEPARATOR as ATTENDABLE_PATH_SEPARATOR2, useAttendableAttributes } from "@dxos/react-ui-attention";
94
+ import { StackItem as StackItem2, railGridHorizontal } from "@dxos/react-ui-stack";
95
+ import { mainIntrinsicSize, mx as mx3 } from "@dxos/react-ui-theme";
202
96
 
203
- // packages/plugins/plugin-deck/src/components/DeckLayout/PlankError.tsx
204
- import React7, { useEffect as useEffect4, useState as useState2 } from "react";
97
+ // packages/plugins/plugin-deck/src/components/Plank/PlankError.tsx
98
+ import React5, { useEffect as useEffect2, useState } from "react";
205
99
  import { useTranslation as useTranslation4 } from "@dxos/react-ui";
206
- import { descriptionText, mx as mx3 } from "@dxos/react-ui-theme";
100
+ import { descriptionText, mx as mx2 } from "@dxos/react-ui-theme";
207
101
 
208
- // packages/plugins/plugin-deck/src/components/DeckLayout/NodePlankHeading.tsx
209
- import React5, { Fragment, memo, useCallback as useCallback2, useEffect as useEffect3, useMemo } from "react";
210
- import { createIntent as createIntent2, LayoutAction, Surface as Surface3, useAppGraph as useAppGraph2, useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
211
- import { Icon as Icon2, Popover, toLocalizedString, useTranslation as useTranslation3 } from "@dxos/react-ui";
102
+ // packages/plugins/plugin-deck/src/components/Plank/PlankHeading.tsx
103
+ import React3, { Fragment, memo, useCallback as useCallback2, useEffect, useMemo } from "react";
104
+ import { createIntent as createIntent2, LayoutAction, Surface, useAppGraph, useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
105
+ import { Icon as Icon2, IconButton as IconButton2, Popover, toLocalizedString, useTranslation as useTranslation3 } from "@dxos/react-ui";
212
106
  import { StackItem } from "@dxos/react-ui-stack";
213
107
  import { TextTooltip } from "@dxos/react-ui-text-tooltip";
214
108
 
215
- // packages/plugins/plugin-deck/src/components/DeckLayout/PlankControls.tsx
216
- import React4, { forwardRef, useCallback } from "react";
109
+ // packages/plugins/plugin-deck/src/components/Plank/PlankControls.tsx
110
+ import React2, { forwardRef, useCallback } from "react";
217
111
  import { createIntent, useIntentDispatcher } from "@dxos/app-framework";
218
112
  import { invariant } from "@dxos/invariant";
219
113
  import { Button, ButtonGroup, Icon, Tooltip, useTranslation as useTranslation2 } from "@dxos/react-ui";
220
- var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-deck/src/components/DeckLayout/PlankControls.tsx";
114
+ var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-deck/src/components/Plank/PlankControls.tsx";
221
115
  var PlankControl = ({ icon, label: label3, ...props }) => {
222
- return /* @__PURE__ */ React4.createElement(Tooltip.Root, null, /* @__PURE__ */ React4.createElement(Tooltip.Trigger, {
116
+ return /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
223
117
  asChild: true
224
- }, /* @__PURE__ */ React4.createElement(Button, {
118
+ }, /* @__PURE__ */ React2.createElement(Button, {
225
119
  variant: "ghost",
226
120
  ...props
227
- }, /* @__PURE__ */ React4.createElement("span", {
121
+ }, /* @__PURE__ */ React2.createElement("span", {
228
122
  className: "sr-only"
229
- }, label3), /* @__PURE__ */ React4.createElement(Icon, {
123
+ }, label3), /* @__PURE__ */ React2.createElement(Icon, {
230
124
  icon,
231
125
  size: 5
232
- }))), /* @__PURE__ */ React4.createElement(Tooltip.Portal, null, /* @__PURE__ */ React4.createElement(Tooltip.Content, {
126
+ }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, {
233
127
  side: "bottom"
234
128
  }, label3)));
235
129
  };
@@ -240,7 +134,7 @@ var PlankCompanionControls = /* @__PURE__ */ forwardRef(({ primary }, forwardedR
240
134
  const handleCloseCompanion = useCallback(() => {
241
135
  invariant(primary, void 0, {
242
136
  F: __dxlog_file,
243
- L: 66,
137
+ L: 68,
244
138
  S: void 0,
245
139
  A: [
246
140
  "primary",
@@ -252,83 +146,82 @@ var PlankCompanionControls = /* @__PURE__ */ forwardRef(({ primary }, forwardedR
252
146
  companion: null
253
147
  }));
254
148
  }, []);
255
- return /* @__PURE__ */ React4.createElement("div", {
149
+ return /* @__PURE__ */ React2.createElement("div", {
256
150
  ref: forwardedRef,
257
151
  className: "contents app-no-drag"
258
- }, /* @__PURE__ */ React4.createElement(PlankControl, {
152
+ }, /* @__PURE__ */ React2.createElement(PlankControl, {
259
153
  label: t("close companion label"),
260
154
  variant: "ghost",
261
- icon: "ph--minus--regular",
155
+ // icon='ph--minus--regular'
156
+ icon: "ph--caret-left--regular",
262
157
  onClick: handleCloseCompanion,
263
158
  classNames: plankControlSpacing
264
159
  }));
265
160
  });
266
- var PlankControls = /* @__PURE__ */ forwardRef(({ onClick, variant = "default", capabilities: can, isSolo, pin, close = false, children, classNames, ...props }, forwardedRef) => {
161
+ var PlankControls = /* @__PURE__ */ forwardRef(({ children, classNames, variant = "default", capabilities, isSolo, pin, close = false, onClick, ...props }, forwardedRef) => {
267
162
  const { t } = useTranslation2(DECK_PLUGIN);
268
163
  const buttonClassNames = variant === "hide-disabled" ? `disabled:hidden ${plankControlSpacing}` : plankControlSpacing;
269
- return /* @__PURE__ */ React4.createElement(ButtonGroup, {
164
+ return /* @__PURE__ */ React2.createElement(ButtonGroup, {
270
165
  ...props,
271
166
  classNames: [
272
167
  "app-no-drag",
273
168
  classNames
274
169
  ],
275
170
  ref: forwardedRef
276
- }, can.solo && /* @__PURE__ */ React4.createElement(PlankControl, {
171
+ }, capabilities.deck && capabilities.solo && /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(PlankControl, {
277
172
  label: isSolo ? t("show deck plank label") : t("show solo plank label"),
278
173
  classNames: buttonClassNames,
279
- onClick: () => onClick?.("solo"),
280
- icon: isSolo ? "ph--corners-in--regular" : "ph--corners-out--regular"
281
- }), !isSolo && can.solo && /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(PlankControl, {
174
+ icon: isSolo ? "ph--corners-in--regular" : "ph--corners-out--regular",
175
+ onClick: () => onClick?.("solo")
176
+ }), !isSolo && /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(PlankControl, {
282
177
  label: t("increment start label"),
283
- disabled: !can.incrementStart,
178
+ disabled: !capabilities.incrementStart,
284
179
  classNames: buttonClassNames,
285
- onClick: () => onClick?.("increment-start"),
286
- icon: "ph--caret-left--regular"
287
- }), /* @__PURE__ */ React4.createElement(PlankControl, {
180
+ icon: "ph--caret-left--regular",
181
+ onClick: () => onClick?.("increment-start")
182
+ }), /* @__PURE__ */ React2.createElement(PlankControl, {
288
183
  label: t("increment end label"),
289
- disabled: !can.incrementEnd,
184
+ disabled: !capabilities.incrementEnd,
290
185
  classNames: buttonClassNames,
291
- onClick: () => onClick?.("increment-end"),
292
- icon: "ph--caret-right--regular"
293
- })), close && !isSolo && /* @__PURE__ */ React4.createElement(PlankControl, {
186
+ icon: "ph--caret-right--regular",
187
+ onClick: () => onClick?.("increment-end")
188
+ }))), close && !isSolo && /* @__PURE__ */ React2.createElement(PlankControl, {
294
189
  label: t(`${typeof close === "string" ? "minify" : "close"} label`),
295
190
  classNames: buttonClassNames,
296
- onClick: () => onClick?.("close"),
297
191
  "data-testid": "plankHeading.close",
298
- icon: close === "minify-start" ? "ph--caret-line-left--regular" : close === "minify-end" ? "ph--caret-line-right--regular" : "ph--x--regular"
192
+ icon: close === "minify-start" ? "ph--caret-line-left--regular" : close === "minify-end" ? "ph--caret-line-right--regular" : "ph--x--regular",
193
+ onClick: () => onClick?.("close")
194
+ }), capabilities.companion && /* @__PURE__ */ React2.createElement(PlankControl, {
195
+ label: t("open companion label"),
196
+ classNames: buttonClassNames,
197
+ "data-testid": "plankHeading.companion",
198
+ icon: "ph--square-split-horizontal--regular",
199
+ onClick: () => onClick?.("companion")
299
200
  }), children);
300
201
  });
301
202
 
302
203
  // packages/plugins/plugin-deck/src/components/fragments.ts
303
- import { mx as mx2 } from "@dxos/react-ui-theme";
204
+ import { mx } from "@dxos/react-ui-theme";
304
205
  var soloInlinePadding = "pis-[calc(env(safe-area-inset-left)+.25rem)] pie-[calc(env(safe-area-inset-left)+.25rem)]";
305
206
  var sidebarToggleStyles = "bs-[--rail-item] is-[--rail-item] absolute block-end-2 z-[1] !bg-deck lg:hidden";
306
- var fixedSidebarToggleStyles = mx2(sidebarToggleStyles, "inline-start-2");
307
- var fixedComplementarySidebarToggleStyles = mx2(sidebarToggleStyles, "inline-end-2");
207
+ var fixedSidebarToggleStyles = mx(sidebarToggleStyles, "inline-start-2");
208
+ var fixedComplementarySidebarToggleStyles = mx(sidebarToggleStyles, "inline-end-2");
308
209
 
309
- // packages/plugins/plugin-deck/src/components/DeckLayout/NodePlankHeading.tsx
310
- var NodePlankHeading = /* @__PURE__ */ memo(({ id, part, node, canIncrementStart, canIncrementEnd, popoverAnchorId, pending, actions = [], companioned, primaryId, surfaceVariant }) => {
210
+ // packages/plugins/plugin-deck/src/components/Plank/PlankHeading.tsx
211
+ var PlankHeading = /* @__PURE__ */ memo(({ id, part, node, deckEnabled, canIncrementStart, canIncrementEnd, popoverAnchorId, primaryId, pending, companioned, companions, actions = [] }) => {
311
212
  const { t } = useTranslation3(DECK_PLUGIN);
312
- const { graph } = useAppGraph2();
213
+ const { dispatchPromise: dispatch } = useIntentDispatcher2();
214
+ const { graph } = useAppGraph();
313
215
  const breakpoint = useBreakpoints();
314
216
  const icon = node?.properties?.icon ?? "ph--placeholder--regular";
315
- const label3 = pending ? t("pending heading") : toLocalizedString((surfaceVariant ? Array.isArray(node?.properties?.label) ? [
316
- `${surfaceVariant} plank heading`,
317
- node.properties.label[1]
318
- ] : [
319
- "companion plank heading fallback label",
320
- {
321
- ns: DECK_PLUGIN
322
- }
323
- ] : node?.properties?.label) ?? [
217
+ const label3 = pending ? t("pending heading") : toLocalizedString(node?.properties?.label ?? [
324
218
  "plank heading fallback label",
325
219
  {
326
220
  ns: DECK_PLUGIN
327
221
  }
328
222
  ], t);
329
- const { dispatchPromise: dispatch } = useIntentDispatcher2();
330
- const ActionRoot = node && popoverAnchorId === `dxos.org/ui/${DECK_PLUGIN}/${node.id}` ? Popover.Anchor : Fragment;
331
- useEffect3(() => {
223
+ const isCompanionNode = node?.type === PLANK_COMPANION_TYPE;
224
+ useEffect(() => {
332
225
  const frame = requestAnimationFrame(() => {
333
226
  node && graph.actions(node);
334
227
  });
@@ -336,23 +229,38 @@ var NodePlankHeading = /* @__PURE__ */ memo(({ id, part, node, canIncrementStart
336
229
  }, [
337
230
  node
338
231
  ]);
339
- const attendableId = id.split(SLUG_PATH_SEPARATOR).at(0);
232
+ const attendableId = primaryId ?? id;
340
233
  const capabilities = useMemo(() => ({
234
+ deck: deckEnabled ?? true,
341
235
  solo: breakpoint !== "mobile" && (part === "solo" || part === "deck"),
342
236
  incrementStart: canIncrementStart,
343
- incrementEnd: canIncrementEnd
237
+ incrementEnd: canIncrementEnd,
238
+ companion: !isCompanionNode && companions && companions.length > 0
344
239
  }), [
345
240
  breakpoint,
346
241
  part,
242
+ companions,
347
243
  canIncrementStart,
348
- canIncrementEnd
244
+ canIncrementEnd,
245
+ isCompanionNode,
246
+ deckEnabled
349
247
  ]);
350
- const sigilActions = useMemo(() => node && [
351
- actions,
352
- graph.actions(node)
353
- ].filter((a) => a.length > 0), [
248
+ const { variant } = parseEntryId(id);
249
+ const sigilActions = useMemo(() => {
250
+ if (!node) {
251
+ return void 0;
252
+ } else if (variant) {
253
+ return [];
254
+ } else {
255
+ return [
256
+ actions,
257
+ graph.actions(node)
258
+ ].filter((a) => a.length > 0);
259
+ }
260
+ }, [
354
261
  actions,
355
262
  node,
263
+ variant,
356
264
  graph
357
265
  ]);
358
266
  const handleAction = useCallback2((action) => {
@@ -397,310 +305,162 @@ var NodePlankHeading = /* @__PURE__ */ memo(({ id, part, node, canIncrementStart
397
305
  id,
398
306
  part
399
307
  ]);
400
- return /* @__PURE__ */ React5.createElement(StackItem.Heading, {
308
+ const ActionRoot = node && popoverAnchorId === `dxos.org/ui/${DECK_PLUGIN}/${node.id}` ? Popover.Anchor : Fragment;
309
+ const handleTabClick = useCallback2((event) => {
310
+ const target = event.target.closest("[data-id]");
311
+ const tabId = target?.dataset?.id;
312
+ if (primaryId && tabId) {
313
+ void dispatch(createIntent2(DeckAction.ChangeCompanion, {
314
+ primary: primaryId,
315
+ companion: tabId
316
+ }));
317
+ }
318
+ }, [
319
+ primaryId
320
+ ]);
321
+ return /* @__PURE__ */ React3.createElement(StackItem.Heading, {
401
322
  classNames: [
402
- "plb-1 border-be border-separator items-stretch gap-1 sticky inline-start-12 app-drag",
403
- part === "solo" ? soloInlinePadding : "pli-1",
404
- surfaceVariant && "pis-3"
323
+ "plb-1 border-be border-separator items-stretch gap-1 sticky inline-start-12 app-drag min-is-0 layout-contain",
324
+ part === "solo" ? soloInlinePadding : "pli-1"
405
325
  ]
406
- }, !surfaceVariant && /* @__PURE__ */ React5.createElement(ActionRoot, null, node && sigilActions ? /* @__PURE__ */ React5.createElement(StackItem.Sigil, {
326
+ }, companions && isCompanionNode ? /* @__PURE__ */ React3.createElement("div", {
327
+ role: "none",
328
+ className: "flex-1 min-is-0 overflow-x-auto scrollbar-thin flex gap-1"
329
+ }, companions.map(({ id: id2, properties: { icon: icon2, label: label4 } }) => /* @__PURE__ */ React3.createElement(IconButton2, {
330
+ key: id2,
331
+ "data-id": id2,
332
+ icon: icon2,
333
+ iconOnly: node?.id !== id2,
334
+ label: toLocalizedString(label4, t),
335
+ size: 5,
336
+ variant: node?.id === id2 ? "primary" : "default",
337
+ onClick: handleTabClick
338
+ }))) : /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(ActionRoot, null, node && sigilActions ? /* @__PURE__ */ React3.createElement(StackItem.Sigil, {
407
339
  icon,
408
340
  related: part === "complementary",
409
341
  attendableId,
410
342
  triggerLabel: t("actions menu label"),
411
343
  actions: sigilActions,
412
344
  onAction: handleAction
413
- }, /* @__PURE__ */ React5.createElement(Surface3, {
345
+ }, /* @__PURE__ */ React3.createElement(Surface, {
414
346
  role: "menu-footer",
415
347
  data: {
416
348
  subject: node.data
417
349
  }
418
- })) : /* @__PURE__ */ React5.createElement(StackItem.SigilButton, null, /* @__PURE__ */ React5.createElement("span", {
350
+ })) : /* @__PURE__ */ React3.createElement(StackItem.SigilButton, null, /* @__PURE__ */ React3.createElement("span", {
419
351
  className: "sr-only"
420
- }, label3), /* @__PURE__ */ React5.createElement(Icon2, {
352
+ }, label3), /* @__PURE__ */ React3.createElement(Icon2, {
421
353
  icon,
422
354
  size: 5
423
- }))), /* @__PURE__ */ React5.createElement(TextTooltip, {
355
+ }))), /* @__PURE__ */ React3.createElement(TextTooltip, {
424
356
  text: label3,
425
357
  onlyWhenTruncating: true
426
- }, /* @__PURE__ */ React5.createElement(StackItem.HeadingLabel, {
358
+ }, /* @__PURE__ */ React3.createElement(StackItem.HeadingLabel, {
427
359
  attendableId,
428
360
  related: part === "complementary",
429
361
  ...pending && {
430
362
  classNames: "text-description"
431
363
  }
432
- }, label3)), node && part !== "complementary" && /* @__PURE__ */ React5.createElement(Surface3, {
364
+ }, label3))), node && part !== "complementary" && /* @__PURE__ */ React3.createElement(Surface, {
433
365
  role: "navbar-end",
434
366
  data: {
435
367
  subject: node.data
436
368
  }
437
- }), companioned === "companion" ? /* @__PURE__ */ React5.createElement(PlankCompanionControls, {
438
- primary: surfaceVariant ? id : primaryId
439
- }) : /* @__PURE__ */ React5.createElement(PlankControls, {
369
+ }), companioned === "companion" ? /* @__PURE__ */ React3.createElement(PlankCompanionControls, {
370
+ primary: primaryId
371
+ }) : /* @__PURE__ */ React3.createElement(PlankControls, {
440
372
  capabilities,
441
373
  isSolo: part === "solo",
442
- onClick: handlePlankAction,
443
- close: part === "complementary" ? "minify-end" : true
374
+ close: part === "complementary" ? "minify-end" : true,
375
+ onClick: handlePlankAction
444
376
  }));
445
377
  });
446
378
 
447
- // packages/plugins/plugin-deck/src/components/DeckLayout/PlankLoading.tsx
448
- import React6 from "react";
379
+ // packages/plugins/plugin-deck/src/components/Plank/PlankLoading.tsx
380
+ import React4 from "react";
449
381
  var PlankLoading = () => {
450
- return /* @__PURE__ */ React6.createElement("div", {
382
+ return /* @__PURE__ */ React4.createElement("div", {
451
383
  role: "none",
452
384
  className: "grid place-items-center attention-surface"
453
385
  });
454
386
  };
455
387
 
456
- // packages/plugins/plugin-deck/src/components/DeckLayout/PlankError.tsx
388
+ // packages/plugins/plugin-deck/src/components/Plank/PlankError.tsx
457
389
  var PlankContentError = ({ error }) => {
458
390
  const { t } = useTranslation4(DECK_PLUGIN);
459
391
  const errorString = error?.toString() ?? "";
460
- return /* @__PURE__ */ React7.createElement("div", {
392
+ return /* @__PURE__ */ React5.createElement("div", {
461
393
  role: "none",
462
394
  className: "overflow-auto p-8 attention-surface grid place-items-center"
463
- }, /* @__PURE__ */ React7.createElement("p", {
395
+ }, /* @__PURE__ */ React5.createElement("p", {
464
396
  role: "alert",
465
- className: mx3(descriptionText, "break-words border border-dashed border-separator rounded-lg p-8", errorString.length < 256 && "text-lg")
397
+ className: mx2(descriptionText, "break-words border border-dashed border-separator rounded-lg p-8", errorString.length < 256 && "text-lg")
466
398
  }, error ? errorString : t("error fallback message")));
467
399
  };
468
400
  var PlankError = ({ id, part, node, error }) => {
469
- const [timedOut, setTimedOut] = useState2(false);
470
- useEffect4(() => {
401
+ const [timedOut, setTimedOut] = useState(false);
402
+ useEffect2(() => {
471
403
  setTimeout(() => setTimedOut(true), 5e3);
472
404
  }, []);
473
- return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(NodePlankHeading, {
405
+ return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(PlankHeading, {
474
406
  id,
475
407
  part,
476
408
  node,
477
409
  pending: !timedOut
478
- }), timedOut ? /* @__PURE__ */ React7.createElement(PlankContentError, {
410
+ }), timedOut ? /* @__PURE__ */ React5.createElement(PlankContentError, {
479
411
  error
480
- }) : /* @__PURE__ */ React7.createElement(PlankLoading, null));
412
+ }) : /* @__PURE__ */ React5.createElement(PlankLoading, null));
481
413
  };
482
414
 
483
- // packages/plugins/plugin-deck/src/components/DeckLayout/ComplementarySidebar.tsx
484
- var label = [
485
- "complementary sidebar title",
486
- {
487
- ns: DECK_PLUGIN
488
- }
489
- ];
490
- var ComplementarySidebar = ({ current }) => {
491
- const { t } = useTranslation5(DECK_PLUGIN);
492
- const { dispatchPromise: dispatch } = useIntentDispatcher3();
493
- const layout = useCapability2(DeckCapabilities.MutableDeckState);
494
- const attended = useAttended2();
495
- const { graph } = useAppGraph3();
496
- const node = useNode(graph, attended[0]);
497
- const breakpoint = useBreakpoints();
498
- const topbar = layoutAppliesTopbar(breakpoint);
499
- const hoistStatusbar = useHoistStatusbar(breakpoint);
500
- const panels = useCapabilities(DeckCapabilities.ComplementaryPanel);
501
- const availablePanels = panels.filter((panel) => {
502
- if (!node || !panel.filter) {
503
- return true;
504
- }
505
- return panel.filter(node);
506
- }).toSorted(byPosition);
507
- const activePanelId = availablePanels.find((panel) => panel.id === current)?.id ?? availablePanels[0]?.id;
508
- const [internalValue, setInternalValue] = useState3(activePanelId);
509
- useEffect5(() => {
510
- setInternalValue(activePanelId);
511
- }, [
512
- activePanelId
513
- ]);
514
- const handleTabClick = useCallback3((event) => {
515
- const nextValue = event.currentTarget.getAttribute("data-value");
516
- if (nextValue === activePanelId) {
517
- layout.complementarySidebarState = layout.complementarySidebarState === "expanded" ? "collapsed" : "expanded";
518
- } else {
519
- setInternalValue(nextValue);
520
- layout.complementarySidebarState = "expanded";
521
- void dispatch(createIntent3(LayoutAction2.UpdateComplementary, {
522
- part: "complementary",
523
- subject: nextValue
524
- }));
415
+ // packages/plugins/plugin-deck/src/hooks/useNodeActionExpander.ts
416
+ import { useEffect as useEffect3 } from "react";
417
+ import { ACTION_GROUP_TYPE, ACTION_TYPE, getGraph } from "@dxos/plugin-graph";
418
+ var expandNodeActions = async (node) => {
419
+ const graph = getGraph(node);
420
+ await graph.expand(node, "outbound", ACTION_GROUP_TYPE);
421
+ await graph.expand(node, "outbound", ACTION_TYPE);
422
+ };
423
+ var useNodeActionExpander = (node) => {
424
+ useEffect3(() => {
425
+ if (node) {
426
+ const frame = requestAnimationFrame(() => {
427
+ void expandNodeActions(node);
428
+ });
429
+ return () => cancelAnimationFrame(frame);
525
430
  }
526
431
  }, [
527
- layout,
528
- activePanelId,
529
- dispatch
530
- ]);
531
- const data = useMemo2(() => node && {
532
- id: node.id,
533
- subject: node.data,
534
- workspace: layout.activeDeck,
535
- popoverAnchorId: layout.popoverAnchorId
536
- }, [
537
- node,
538
- layout.popoverAnchorId
432
+ node
539
433
  ]);
540
- return /* @__PURE__ */ React8.createElement(Main.ComplementarySidebar, {
541
- label,
542
- classNames: [
543
- topbar && "block-start-[calc(env(safe-area-inset-top)+var(--rail-size))]",
544
- hoistStatusbar && "block-end-[--statusbar-size]"
545
- ]
546
- }, /* @__PURE__ */ React8.createElement(Tabs.Root, {
547
- orientation: "vertical",
548
- verticalVariant: "stateless",
549
- value: internalValue,
550
- attendableId: attended[0],
551
- classNames: "contents"
552
- }, /* @__PURE__ */ React8.createElement("div", {
553
- role: "none",
554
- className: "absolute z-[1] inset-block-0 inline-end-0 !is-[--r0-size] pbs-[env(safe-area-inset-top)] pbe-[env(safe-area-inset-bottom)] border-is border-separator grid grid-cols-1 grid-rows-[1fr_min-content] bg-baseSurface contain-layout app-drag"
555
- }, /* @__PURE__ */ React8.createElement(Tabs.Tablist, {
556
- classNames: "grid grid-cols-1 auto-rows-[--rail-action] p-1 gap-1 !overflow-y-auto"
557
- }, availablePanels.map((panel) => /* @__PURE__ */ React8.createElement(Tabs.Tab, {
558
- key: panel.id,
559
- value: panel.id,
560
- asChild: true
561
- }, /* @__PURE__ */ React8.createElement(IconButton2, {
562
- label: toLocalizedString2(panel.label, t),
563
- icon: panel.icon,
564
- size: 5,
565
- iconOnly: true,
566
- tooltipSide: "left",
567
- "data-value": panel.id,
568
- variant: activePanelId === panel.id ? layout.complementarySidebarState === "expanded" ? "primary" : "default" : "ghost",
569
- onClick: handleTabClick
570
- })))), !hoistStatusbar && /* @__PURE__ */ React8.createElement("div", {
571
- role: "none",
572
- className: "grid grid-cols-1 auto-rows-[--rail-item] p-1 overflow-y-auto"
573
- }, /* @__PURE__ */ React8.createElement(Surface4, {
574
- role: "status-bar--r0-footer",
575
- limit: 1
576
- })), /* @__PURE__ */ React8.createElement("div", {
577
- role: "none",
578
- className: "hidden lg:grid grid-cols-1 auto-rows-[--rail-action] p-1"
579
- }, /* @__PURE__ */ React8.createElement(ToggleComplementarySidebarButton, null))), availablePanels.map((panel) => /* @__PURE__ */ React8.createElement(Tabs.Tabpanel, {
580
- key: panel.id,
581
- value: panel.id,
582
- classNames: 'absolute data-[state="inactive"]:-z-[1] inset-block-0 inline-start-0 is-[calc(100%-var(--r0-size))] lg:is-[--r1-size] grid grid-cols-1 grid-rows-[var(--rail-size)_1fr_min-content] pbs-[env(safe-area-inset-top)]',
583
- ...layout.complementarySidebarState !== "expanded" && {
584
- inert: "true"
585
- }
586
- }, /* @__PURE__ */ React8.createElement(ComplementarySidebarPanel, {
587
- panel,
588
- activePanelId,
589
- data,
590
- hoistStatusbar
591
- })))));
592
- };
593
- var ScrollArea = ({ children }) => {
594
- return /* @__PURE__ */ React8.createElement(NaturalScrollArea.Root, null, /* @__PURE__ */ React8.createElement(NaturalScrollArea.Viewport, null, children), /* @__PURE__ */ React8.createElement(NaturalScrollArea.Scrollbar, {
595
- orientation: "vertical"
596
- }, /* @__PURE__ */ React8.createElement(NaturalScrollArea.Thumb, null)));
597
- };
598
- var ComplementarySidebarPanel = ({ panel, activePanelId, data, hoistStatusbar }) => {
599
- const { t } = useTranslation5(DECK_PLUGIN);
600
- if (panel.id !== activePanelId || !data) {
601
- return null;
602
- }
603
- const Wrapper = panel.fixed ? Fragment2 : ScrollArea;
604
- return /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement("h2", {
605
- className: "flex items-center pli-2 border-separator border-be font-medium"
606
- }, toLocalizedString2(panel.label, t)), /* @__PURE__ */ React8.createElement(Wrapper, null, /* @__PURE__ */ React8.createElement(Surface4, {
607
- role: `complementary--${activePanelId}`,
608
- data,
609
- fallback: PlankContentError,
610
- placeholder: /* @__PURE__ */ React8.createElement(PlankLoading, null)
611
- })), !hoistStatusbar && /* @__PURE__ */ React8.createElement("div", {
612
- role: "contentinfo",
613
- className: "flex flex-wrap justify-center items-center border-bs border-separator pbs-1 pbe-[max(env(safe-area-inset-bottom),0.25rem)]"
614
- }, /* @__PURE__ */ React8.createElement(Surface4, {
615
- role: "status-bar--r1-footer",
616
- limit: 1
617
- })));
618
- };
619
-
620
- // packages/plugins/plugin-deck/src/components/DeckLayout/ContentEmpty.tsx
621
- import React9 from "react";
622
- import { Surface as Surface5 } from "@dxos/app-framework";
623
- var ContentEmpty = () => {
624
- const breakpoint = useBreakpoints();
625
- const topbar = layoutAppliesTopbar(breakpoint);
626
- return /* @__PURE__ */ React9.createElement("div", {
627
- role: "none",
628
- className: "grid place-items-center p-8 relative bg-deck",
629
- "data-testid": "layoutPlugin.firstRunMessage"
630
- }, /* @__PURE__ */ React9.createElement(Surface5, {
631
- role: "keyshortcuts"
632
- }), !topbar && /* @__PURE__ */ React9.createElement(ToggleSidebarButton, {
633
- variant: "default",
634
- classNames: fixedSidebarToggleStyles
635
- }));
636
- };
637
-
638
- // packages/plugins/plugin-deck/src/components/DeckLayout/Fullscreen.tsx
639
- import React11 from "react";
640
- import { Surface as Surface6, useAppGraph as useAppGraph4 } from "@dxos/app-framework";
641
- import { fixedInsetFlexLayout } from "@dxos/react-ui-theme";
642
-
643
- // packages/plugins/plugin-deck/src/components/DeckLayout/Fallback.tsx
644
- import React10 from "react";
645
- import { useTranslation as useTranslation6 } from "@dxos/react-ui";
646
- import { errorText, mx as mx4 } from "@dxos/react-ui-theme";
647
- var Fallback = () => {
648
- const { t } = useTranslation6(DECK_PLUGIN);
649
- return /* @__PURE__ */ React10.createElement("div", {
650
- role: "none",
651
- className: "min-bs-screen is-full flex items-center justify-center p-8"
652
- }, /* @__PURE__ */ React10.createElement("p", {
653
- role: "alert",
654
- className: mx4(errorText, "border border-error-400/50 rounded-lg flex items-center justify-center p-8 font-normal text-lg")
655
- }, t("plugin error message")));
656
434
  };
657
435
 
658
- // packages/plugins/plugin-deck/src/components/DeckLayout/constants.ts
659
- var SURFACE_PREFIX = "surface:";
660
-
661
- // packages/plugins/plugin-deck/src/components/DeckLayout/Fullscreen.tsx
662
- var Fullscreen = ({ id }) => {
663
- const { graph } = useAppGraph4();
664
- const fullScreenNode = useNode(graph, id);
665
- return /* @__PURE__ */ React11.createElement("div", {
666
- role: "none",
667
- className: fixedInsetFlexLayout
668
- }, /* @__PURE__ */ React11.createElement(Surface6, {
669
- role: "main",
670
- limit: 1,
671
- fallback: Fallback,
672
- data: {
673
- subject: fullScreenNode?.data,
674
- component: id?.startsWith(SURFACE_PREFIX) ? id.slice(SURFACE_PREFIX.length) : void 0
675
- }
676
- }));
436
+ // packages/plugins/plugin-deck/src/hooks/useMainSize.ts
437
+ import { useMainContext } from "@dxos/react-ui";
438
+ var useMainSize = () => {
439
+ const { navigationSidebarState, complementarySidebarState } = useMainContext("DeckPluginPlank");
440
+ return {
441
+ "data-sidebar-inline-start-state": navigationSidebarState,
442
+ "data-sidebar-inline-end-state": complementarySidebarState
443
+ };
677
444
  };
678
445
 
679
- // packages/plugins/plugin-deck/src/components/DeckLayout/Plank.tsx
680
- import React12, { Fragment as Fragment3, memo as memo2, useCallback as useCallback4, useLayoutEffect, useMemo as useMemo3, useRef } from "react";
681
- import { createIntent as createIntent4, LayoutAction as LayoutAction3, Surface as Surface7, useCapability as useCapability3, useAppGraph as useAppGraph5, useIntentDispatcher as useIntentDispatcher4 } from "@dxos/app-framework";
682
- import { debounce } from "@dxos/async";
683
- import { useAttendableAttributes } from "@dxos/react-ui-attention";
684
- import { StackItem as StackItem2, railGridHorizontal } from "@dxos/react-ui-stack";
685
- import { mainIntrinsicSize, mx as mx5 } from "@dxos/react-ui-theme";
446
+ // packages/plugins/plugin-deck/src/components/Plank/Plank.tsx
686
447
  var UNKNOWN_ID = "unknown_id";
687
- var PlankImpl = /* @__PURE__ */ memo2(({ id = UNKNOWN_ID, part, path, order, active, layoutMode, surfaceVariant, companioned, primaryId }) => {
688
- const { dispatchPromise: dispatch } = useIntentDispatcher4();
689
- const { deck, popoverAnchorId, scrollIntoView } = useCapability3(DeckCapabilities.DeckState);
690
- const { graph } = useAppGraph5();
691
- const node = useNode(graph, id);
448
+ var PlankImpl = /* @__PURE__ */ memo2(({ id, node, part, path, order, active, layoutMode, companioned, primary, companions, settings }) => {
449
+ const { dispatchPromise: dispatch } = useIntentDispatcher3();
450
+ const { deck, popoverAnchorId, scrollIntoView } = useCapability2(DeckCapabilities.DeckState);
692
451
  const rootElement = useRef(null);
693
452
  const canResize = layoutMode === "deck";
694
453
  const Root = part.startsWith("solo") ? "article" : StackItem2.Root;
695
- const attendableAttrs = useAttendableAttributes(id);
454
+ const attendableAttrs = useAttendableAttributes(primary?.id ?? id);
696
455
  const index = active ? active.findIndex((entryId) => entryId === id) : 0;
697
456
  const length = active?.length ?? 1;
698
457
  const canIncrementStart = active && index !== void 0 && index > 0 && length !== void 0 && length > 1;
699
458
  const canIncrementEnd = active && index !== void 0 && index < length - 1 && length !== void 0;
700
- const sizeKey = `${id.split("+")[0]}${surfaceVariant ? `${surfaceVariantSeparator}${surfaceVariant}` : ""}`;
459
+ const { variant } = parseEntryId(id);
460
+ const sizeKey = `${id.split("+")[0]}${variant ? `${ATTENDABLE_PATH_SEPARATOR2}${variant}` : ""}`;
701
461
  const size = deck.plankSizing[sizeKey];
702
- const setSize = useCallback4(debounce((nextSize) => {
703
- return dispatch(createIntent4(DeckAction.UpdatePlankSize, {
462
+ const setSize = useCallback3(debounce((nextSize) => {
463
+ return dispatch(createIntent3(DeckAction.UpdatePlankSize, {
704
464
  id: sizeKey,
705
465
  size: nextSize
706
466
  }));
@@ -708,7 +468,7 @@ var PlankImpl = /* @__PURE__ */ memo2(({ id = UNKNOWN_ID, part, path, order, act
708
468
  dispatch,
709
469
  sizeKey
710
470
  ]);
711
- const handleKeyDown = useCallback4((event) => {
471
+ const handleKeyDown = useCallback3((event) => {
712
472
  if (event.target === event.currentTarget && event.key === "Escape") {
713
473
  rootElement.current?.closest("main")?.focus();
714
474
  }
@@ -723,7 +483,7 @@ var PlankImpl = /* @__PURE__ */ memo2(({ id = UNKNOWN_ID, part, path, order, act
723
483
  behavior: "smooth",
724
484
  inline: "center"
725
485
  });
726
- void dispatch(createIntent4(LayoutAction3.ScrollIntoView, {
486
+ void dispatch(createIntent3(LayoutAction2.ScrollIntoView, {
727
487
  part: "current",
728
488
  subject: void 0
729
489
  }));
@@ -736,9 +496,10 @@ var PlankImpl = /* @__PURE__ */ memo2(({ id = UNKNOWN_ID, part, path, order, act
736
496
  const isSolo = layoutMode === "solo" && part === "solo";
737
497
  const isAttendable = layoutMode === "solo" && part.startsWith("solo") || layoutMode === "deck" && part === "deck";
738
498
  const sizeAttrs = useMainSize();
739
- const data = useMemo3(() => node && {
499
+ const data = useMemo2(() => node && {
740
500
  subject: node.data,
741
- variant: surfaceVariant,
501
+ companionTo: primary?.data,
502
+ variant,
742
503
  path,
743
504
  popoverAnchorId
744
505
  }, [
@@ -746,11 +507,11 @@ var PlankImpl = /* @__PURE__ */ memo2(({ id = UNKNOWN_ID, part, path, order, act
746
507
  node?.data,
747
508
  path,
748
509
  popoverAnchorId,
749
- surfaceVariant
510
+ primary?.data
750
511
  ]);
751
- const placeholder = useMemo3(() => /* @__PURE__ */ React12.createElement(PlankLoading, null), []);
752
- const className = mx5("attention-surface relative", isSolo && mainIntrinsicSize, isSolo && railGridHorizontal, isSolo && "absolute inset-0", part.startsWith("solo") && "grid", part === "deck" && (companioned === "companion" ? "!border-separator border-ie" : "!border-separator border-li"), part.startsWith("solo-") && "row-span-2 min-is-0", part === "solo-companion" && "!border-separator border-is");
753
- return /* @__PURE__ */ React12.createElement(Root, {
512
+ const placeholder = useMemo2(() => /* @__PURE__ */ React6.createElement(PlankLoading, null), []);
513
+ const className = mx3("attention-surface relative", isSolo && mainIntrinsicSize, isSolo && railGridHorizontal, isSolo && "absolute inset-0", part.startsWith("solo") && "grid", part === "deck" && (companioned === "companion" ? "!border-separator border-ie" : "!border-separator border-li"), part.startsWith("solo-") && "row-span-2 grid-rows-subgrid min-is-0", part === "solo-companion" && "!border-separator border-is");
514
+ return /* @__PURE__ */ React6.createElement(Root, {
754
515
  ref: rootElement,
755
516
  "data-testid": "deck.plank",
756
517
  tabIndex: 0,
@@ -769,68 +530,215 @@ var PlankImpl = /* @__PURE__ */ memo2(({ id = UNKNOWN_ID, part, path, order, act
769
530
  },
770
531
  ...isAttendable ? attendableAttrs : {},
771
532
  onKeyDown: handleKeyDown
772
- }, node ? /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(NodePlankHeading, {
533
+ }, node ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(PlankHeading, {
773
534
  id,
774
535
  part: part.startsWith("solo-") ? "solo" : part,
775
536
  node,
537
+ deckEnabled: settings?.enableDeck,
776
538
  canIncrementStart,
777
539
  canIncrementEnd,
778
540
  popoverAnchorId,
541
+ primaryId: primary?.id,
779
542
  companioned,
780
- primaryId,
781
- surfaceVariant
782
- }), /* @__PURE__ */ React12.createElement(Surface7, {
543
+ companions
544
+ }), /* @__PURE__ */ React6.createElement(Surface2, {
783
545
  key: node.id,
784
546
  role: "article",
785
547
  data,
786
548
  limit: 1,
787
549
  fallback: PlankContentError,
788
550
  placeholder
789
- })) : /* @__PURE__ */ React12.createElement(PlankError, {
551
+ })) : /* @__PURE__ */ React6.createElement(PlankError, {
790
552
  id,
791
553
  part
792
- }), canResize && /* @__PURE__ */ React12.createElement(StackItem2.ResizeHandle, null));
554
+ }), canResize && /* @__PURE__ */ React6.createElement(StackItem2.ResizeHandle, null));
793
555
  });
794
556
  var SplitFrame = ({ children }) => {
795
557
  const sizeAttrs = useMainSize();
796
- return /* @__PURE__ */ React12.createElement("div", {
558
+ return /* @__PURE__ */ React6.createElement("div", {
797
559
  role: "none",
798
- className: mx5("grid grid-cols-[1fr_1fr] absolute inset-0", railGridHorizontal, mainIntrinsicSize),
560
+ className: mx3("grid grid-cols-[1fr_1fr] absolute inset-0", railGridHorizontal, mainIntrinsicSize),
799
561
  ...sizeAttrs
800
562
  }, children);
801
563
  };
802
- var Plank = (props) => {
564
+ var Plank = ({ id = UNKNOWN_ID, ...props }) => {
565
+ const { graph } = useAppGraph2();
566
+ const node = useNode(graph, id);
567
+ const companions = useCompanions(id);
568
+ const currentCompanion = companions.find(({ id: id2 }) => id2 === props.companionId);
803
569
  if (props.companionId) {
804
- const Root = props.part === "solo" ? SplitFrame : Fragment3;
805
- return /* @__PURE__ */ React12.createElement(Root, null, /* @__PURE__ */ React12.createElement(PlankImpl, {
570
+ const Root = props.part === "solo" ? SplitFrame : Fragment2;
571
+ return /* @__PURE__ */ React6.createElement(Root, null, /* @__PURE__ */ React6.createElement(PlankImpl, {
572
+ id,
573
+ node,
574
+ companioned: "primary",
806
575
  ...props,
807
576
  ...props.part === "solo" ? {
808
577
  part: "solo-primary"
809
- } : {},
810
- companioned: "primary"
811
- }), /* @__PURE__ */ React12.createElement(PlankImpl, {
578
+ } : {}
579
+ }), /* @__PURE__ */ React6.createElement(PlankImpl, {
580
+ id: props.companionId,
581
+ node: currentCompanion,
582
+ companioned: "companion",
583
+ primary: node,
584
+ companions,
812
585
  ...props,
813
- ...props.companionId.startsWith(surfaceVariantSeparator) ? {
814
- surfaceVariant: props.companionId.substring(2)
815
- } : {
816
- id: props.companionId,
817
- primaryId: props.id
818
- },
819
586
  ...props.part === "solo" ? {
820
587
  part: "solo-companion"
821
588
  } : {
822
589
  order: props.order + 1
823
- },
824
- companioned: "companion"
590
+ }
825
591
  }));
826
592
  } else {
827
- return /* @__PURE__ */ React12.createElement(PlankImpl, props);
593
+ return /* @__PURE__ */ React6.createElement(PlankImpl, {
594
+ id,
595
+ node,
596
+ companions,
597
+ ...props
598
+ });
828
599
  }
829
600
  };
830
601
 
831
- // packages/plugins/plugin-deck/src/components/DeckLayout/Sidebar.tsx
832
- import React13, { useMemo as useMemo4 } from "react";
833
- import { Surface as Surface8, useCapability as useCapability4 } from "@dxos/app-framework";
602
+ // packages/plugins/plugin-deck/src/components/Sidebar/ComplementarySidebar.tsx
603
+ var label = [
604
+ "complementary sidebar title",
605
+ {
606
+ ns: DECK_PLUGIN
607
+ }
608
+ ];
609
+ var getCompanionId = (id) => {
610
+ const [_, companionId] = id.split(ATTENDABLE_PATH_SEPARATOR);
611
+ return companionId ?? "never";
612
+ };
613
+ var useDeckCompanions = () => {
614
+ const { graph } = useAppGraph3();
615
+ const companions = graph.nodes(graph.root, {
616
+ type: DECK_COMPANION_TYPE
617
+ });
618
+ return companions.toSorted((a, b) => byPosition(a.properties, b.properties));
619
+ };
620
+ var ComplementarySidebar = ({ current }) => {
621
+ const { t } = useTranslation5(DECK_PLUGIN);
622
+ const { dispatchPromise: dispatch } = useIntentDispatcher4();
623
+ const layout = useCapability3(DeckCapabilities.MutableDeckState);
624
+ const breakpoint = useBreakpoints();
625
+ const topbar = layoutAppliesTopbar(breakpoint);
626
+ const hoistStatusbar = useHoistStatusbar(breakpoint);
627
+ const companions = useDeckCompanions();
628
+ const activeCompanion = companions.find((companion) => getCompanionId(companion.id) === current) ?? companions.at(0);
629
+ const activeId = getCompanionId(activeCompanion?.id ?? "never");
630
+ const [internalValue, setInternalValue] = useState2(activeId);
631
+ useEffect4(() => {
632
+ setInternalValue(activeId);
633
+ }, [
634
+ activeId
635
+ ]);
636
+ const handleTabClick = useCallback4((event) => {
637
+ const nextValue = event.currentTarget.getAttribute("data-value");
638
+ if (nextValue === activeId) {
639
+ layout.complementarySidebarState = layout.complementarySidebarState === "expanded" ? "collapsed" : "expanded";
640
+ } else {
641
+ setInternalValue(nextValue);
642
+ layout.complementarySidebarState = "expanded";
643
+ void dispatch(createIntent4(LayoutAction3.UpdateComplementary, {
644
+ part: "complementary",
645
+ subject: nextValue
646
+ }));
647
+ }
648
+ }, [
649
+ layout,
650
+ activeId,
651
+ dispatch
652
+ ]);
653
+ const data = useMemo3(() => activeCompanion && {
654
+ id: activeCompanion.id,
655
+ subject: activeCompanion.data
656
+ }, [
657
+ activeCompanion?.id,
658
+ activeCompanion?.data
659
+ ]);
660
+ return /* @__PURE__ */ React7.createElement(Main.ComplementarySidebar, {
661
+ label,
662
+ classNames: [
663
+ topbar && "block-start-[calc(env(safe-area-inset-top)+var(--rail-size))]",
664
+ hoistStatusbar && "block-end-[--statusbar-size]"
665
+ ]
666
+ }, /* @__PURE__ */ React7.createElement(Tabs.Root, {
667
+ orientation: "vertical",
668
+ verticalVariant: "stateless",
669
+ value: internalValue,
670
+ classNames: "contents"
671
+ }, /* @__PURE__ */ React7.createElement("div", {
672
+ role: "none",
673
+ className: "absolute z-[1] inset-block-0 inline-end-0 !is-[--r0-size] pbs-[env(safe-area-inset-top)] pbe-[env(safe-area-inset-bottom)] border-is border-separator grid grid-cols-1 grid-rows-[1fr_min-content] bg-baseSurface contain-layout app-drag"
674
+ }, /* @__PURE__ */ React7.createElement(Tabs.Tablist, {
675
+ classNames: "grid grid-cols-1 auto-rows-[--rail-action] p-1 gap-1 !overflow-y-auto"
676
+ }, companions.map((companion) => /* @__PURE__ */ React7.createElement(Tabs.Tab, {
677
+ key: getCompanionId(companion.id),
678
+ value: getCompanionId(companion.id),
679
+ asChild: true
680
+ }, /* @__PURE__ */ React7.createElement(IconButton3, {
681
+ label: toLocalizedString2(companion.properties.label, t),
682
+ icon: companion.properties.icon,
683
+ size: 5,
684
+ iconOnly: true,
685
+ tooltipSide: "left",
686
+ "data-value": getCompanionId(companion.id),
687
+ variant: activeId === getCompanionId(companion.id) ? layout.complementarySidebarState === "expanded" ? "primary" : "default" : "ghost",
688
+ onClick: handleTabClick
689
+ })))), !hoistStatusbar && /* @__PURE__ */ React7.createElement("div", {
690
+ role: "none",
691
+ className: "grid grid-cols-1 auto-rows-[--rail-item] p-1 overflow-y-auto"
692
+ }, /* @__PURE__ */ React7.createElement(Surface3, {
693
+ role: "status-bar--r0-footer",
694
+ limit: 1
695
+ })), /* @__PURE__ */ React7.createElement("div", {
696
+ role: "none",
697
+ className: "hidden lg:grid grid-cols-1 auto-rows-[--rail-action] p-1"
698
+ }, /* @__PURE__ */ React7.createElement(ToggleComplementarySidebarButton, null))), companions.map((companion) => /* @__PURE__ */ React7.createElement(Tabs.Tabpanel, {
699
+ key: getCompanionId(companion.id),
700
+ value: getCompanionId(companion.id),
701
+ classNames: 'absolute data-[state="inactive"]:-z-[1] inset-block-0 inline-start-0 is-[calc(100%-var(--r0-size))] lg:is-[--r1-size] grid grid-cols-1 grid-rows-[var(--rail-size)_1fr_min-content] pbs-[env(safe-area-inset-top)]',
702
+ ...layout.complementarySidebarState !== "expanded" && {
703
+ inert: "true"
704
+ }
705
+ }, /* @__PURE__ */ React7.createElement(ComplementarySidebarPanel, {
706
+ companion,
707
+ activeId,
708
+ data,
709
+ hoistStatusbar
710
+ })))));
711
+ };
712
+ var ScrollArea = ({ children }) => {
713
+ return /* @__PURE__ */ React7.createElement("div", {
714
+ className: "flex flex-col grow overflow-x-hidden overflow-y-auto scrollbar-thin"
715
+ }, children);
716
+ };
717
+ var ComplementarySidebarPanel = ({ companion, activeId, data, hoistStatusbar }) => {
718
+ const { t } = useTranslation5(DECK_PLUGIN);
719
+ if (getCompanionId(companion.id) !== activeId && !data) {
720
+ return null;
721
+ }
722
+ const Wrapper = companion.properties.fixed ? Fragment3 : ScrollArea;
723
+ return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement("h2", {
724
+ className: "flex items-center pli-2 border-separator border-be font-medium"
725
+ }, toLocalizedString2(companion.properties.label, t)), /* @__PURE__ */ React7.createElement(Wrapper, null, /* @__PURE__ */ React7.createElement(Surface3, {
726
+ role: `deck-companion--${getCompanionId(companion.id)}`,
727
+ data,
728
+ fallback: PlankContentError,
729
+ placeholder: /* @__PURE__ */ React7.createElement(PlankLoading, null)
730
+ })), !hoistStatusbar && /* @__PURE__ */ React7.createElement("div", {
731
+ role: "contentinfo",
732
+ className: "flex flex-wrap justify-center items-center border-bs border-separator pbs-1 pbe-[max(env(safe-area-inset-bottom),0.25rem)]"
733
+ }, /* @__PURE__ */ React7.createElement(Surface3, {
734
+ role: "status-bar--r1-footer",
735
+ limit: 1
736
+ })));
737
+ };
738
+
739
+ // packages/plugins/plugin-deck/src/components/Sidebar/Sidebar.tsx
740
+ import React8, { useMemo as useMemo4 } from "react";
741
+ import { Surface as Surface4, useCapability as useCapability4 } from "@dxos/app-framework";
834
742
  import { Main as Main2 } from "@dxos/react-ui";
835
743
  var label2 = [
836
744
  "sidebar title",
@@ -854,20 +762,141 @@ var Sidebar = () => {
854
762
  hoistStatusbar,
855
763
  current
856
764
  ]);
857
- return /* @__PURE__ */ React13.createElement(Main2.NavigationSidebar, {
765
+ return /* @__PURE__ */ React8.createElement(Main2.NavigationSidebar, {
858
766
  label: label2,
859
767
  classNames: [
860
768
  "grid",
861
769
  topbar && "block-start-[calc(env(safe-area-inset-top)+var(--rail-size))]",
862
770
  hoistStatusbar && "block-end-[--statusbar-size]"
863
771
  ]
864
- }, /* @__PURE__ */ React13.createElement(Surface8, {
772
+ }, /* @__PURE__ */ React8.createElement(Surface4, {
865
773
  role: "navigation",
866
774
  data: navigationData,
867
775
  limit: 1
868
776
  }));
869
777
  };
870
778
 
779
+ // packages/plugins/plugin-deck/src/components/DeckLayout/Banner.tsx
780
+ var Banner = ({ variant, classNames }) => {
781
+ const { t } = useTranslation6(DECK_PLUGIN);
782
+ return /* @__PURE__ */ React9.createElement("header", {
783
+ className: mx4("flex items-stretch relative plb-1 pis-1 pie-2", variant === "topbar" && "fixed inset-inline-0 block-start-[env(safe-area-inset-top)] bs-[--rail-size] border-be border-separator", classNames)
784
+ }, variant === "sidebar" ? /* @__PURE__ */ React9.createElement(CloseSidebarButton, null) : /* @__PURE__ */ React9.createElement(ToggleSidebarButton, null), /* @__PURE__ */ React9.createElement("span", {
785
+ className: "self-center grow mis-1"
786
+ }, t("current app name", {
787
+ ns: "appkit"
788
+ })), variant === "topbar" && /* @__PURE__ */ React9.createElement("div", {
789
+ role: "none",
790
+ className: "absolute inset-0 pointer-events-none"
791
+ }, /* @__PURE__ */ React9.createElement("div", {
792
+ role: "none",
793
+ className: "grid bs-full pointer-fine:p-1 max-is-md mli-auto pointer-events-auto"
794
+ }, /* @__PURE__ */ React9.createElement(Surface5, {
795
+ role: "search-input",
796
+ limit: 1
797
+ }))), /* @__PURE__ */ React9.createElement("span", {
798
+ role: "none",
799
+ className: "grow"
800
+ }), /* @__PURE__ */ React9.createElement(Surface5, {
801
+ role: "header-end",
802
+ limit: 1
803
+ }), /* @__PURE__ */ React9.createElement(Surface5, {
804
+ role: "notch-start",
805
+ limit: 1
806
+ }));
807
+ };
808
+
809
+ // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
810
+ import { untracked } from "@preact/signals-core";
811
+ import React17, { useCallback as useCallback5, useEffect as useEffect5, useMemo as useMemo5, useRef as useRef2, Fragment as Fragment4, useState as useState3 } from "react";
812
+ import { Capabilities, LayoutAction as LayoutAction4, Surface as Surface10, createIntent as createIntent5, useCapability as useCapability5, useIntentDispatcher as useIntentDispatcher5, usePluginManager } from "@dxos/app-framework";
813
+ import { AttentionCapabilities } from "@dxos/plugin-attention";
814
+ import { AlertDialog, Dialog as NaturalDialog, Main as Main3, Popover as Popover2, useMediaQuery, useOnTransition } from "@dxos/react-ui";
815
+ import { Stack, StackContext, DEFAULT_HORIZONTAL_SIZE } from "@dxos/react-ui-stack";
816
+ import { mainPaddingTransitions } from "@dxos/react-ui-theme";
817
+
818
+ // packages/plugins/plugin-deck/src/components/DeckLayout/ActiveNode.tsx
819
+ import React10 from "react";
820
+ import { Surface as Surface6, useAppGraph as useAppGraph4 } from "@dxos/app-framework";
821
+ import { useNode as useNode2 } from "@dxos/plugin-graph";
822
+ import { useAttended } from "@dxos/react-ui-attention";
823
+ var ActiveNode = () => {
824
+ const [id] = useAttended();
825
+ const { graph } = useAppGraph4();
826
+ const activeNode = useNode2(graph, id);
827
+ useNodeActionExpander(activeNode);
828
+ return /* @__PURE__ */ React10.createElement("div", {
829
+ role: "none",
830
+ className: "sr-only"
831
+ }, /* @__PURE__ */ React10.createElement(Surface6, {
832
+ role: "document-title",
833
+ data: {
834
+ subject: activeNode
835
+ },
836
+ limit: 1
837
+ }));
838
+ };
839
+
840
+ // packages/plugins/plugin-deck/src/components/DeckLayout/ContentEmpty.tsx
841
+ import React11 from "react";
842
+ import { Surface as Surface7 } from "@dxos/app-framework";
843
+ var ContentEmpty = () => {
844
+ const breakpoint = useBreakpoints();
845
+ const topbar = layoutAppliesTopbar(breakpoint);
846
+ return /* @__PURE__ */ React11.createElement("div", {
847
+ role: "none",
848
+ className: "grid place-items-center p-8 relative bg-deck",
849
+ "data-testid": "layoutPlugin.firstRunMessage"
850
+ }, /* @__PURE__ */ React11.createElement(Surface7, {
851
+ role: "keyshortcuts"
852
+ }), !topbar && /* @__PURE__ */ React11.createElement(ToggleSidebarButton, {
853
+ variant: "default",
854
+ classNames: fixedSidebarToggleStyles
855
+ }));
856
+ };
857
+
858
+ // packages/plugins/plugin-deck/src/components/DeckLayout/Fullscreen.tsx
859
+ import React13 from "react";
860
+ import { Surface as Surface8, useAppGraph as useAppGraph5 } from "@dxos/app-framework";
861
+ import { useNode as useNode3 } from "@dxos/plugin-graph";
862
+ import { fixedInsetFlexLayout } from "@dxos/react-ui-theme";
863
+
864
+ // packages/plugins/plugin-deck/src/components/DeckLayout/Fallback.tsx
865
+ import React12 from "react";
866
+ import { useTranslation as useTranslation7 } from "@dxos/react-ui";
867
+ import { errorText, mx as mx5 } from "@dxos/react-ui-theme";
868
+ var Fallback = () => {
869
+ const { t } = useTranslation7(DECK_PLUGIN);
870
+ return /* @__PURE__ */ React12.createElement("div", {
871
+ role: "none",
872
+ className: "min-bs-screen is-full flex items-center justify-center p-8"
873
+ }, /* @__PURE__ */ React12.createElement("p", {
874
+ role: "alert",
875
+ className: mx5(errorText, "border border-error-400/50 rounded-lg flex items-center justify-center p-8 font-normal text-lg")
876
+ }, t("plugin error message")));
877
+ };
878
+
879
+ // packages/plugins/plugin-deck/src/components/DeckLayout/constants.ts
880
+ var SURFACE_PREFIX = "surface:";
881
+
882
+ // packages/plugins/plugin-deck/src/components/DeckLayout/Fullscreen.tsx
883
+ var Fullscreen = ({ id }) => {
884
+ const { graph } = useAppGraph5();
885
+ const fullScreenNode = useNode3(graph, id);
886
+ return /* @__PURE__ */ React13.createElement("div", {
887
+ role: "none",
888
+ className: fixedInsetFlexLayout
889
+ }, /* @__PURE__ */ React13.createElement(Surface8, {
890
+ role: "main",
891
+ limit: 1,
892
+ fallback: Fallback,
893
+ data: {
894
+ subject: fullScreenNode?.data,
895
+ component: id?.startsWith(SURFACE_PREFIX) ? id.slice(SURFACE_PREFIX.length) : void 0
896
+ }
897
+ }));
898
+ };
899
+
871
900
  // packages/plugins/plugin-deck/src/components/DeckLayout/StatusBar.tsx
872
901
  import React14 from "react";
873
902
  import { Surface as Surface9 } from "@dxos/app-framework";
@@ -889,9 +918,9 @@ var StatusBar = ({ showHints }) => {
889
918
 
890
919
  // packages/plugins/plugin-deck/src/components/DeckLayout/Toast.tsx
891
920
  import React15 from "react";
892
- import { Button as Button2, Icon as Icon3, Toast as NaturalToast, toLocalizedString as toLocalizedString3, useTranslation as useTranslation7 } from "@dxos/react-ui";
921
+ import { Button as Button2, Icon as Icon3, Toast as NaturalToast, toLocalizedString as toLocalizedString3, useTranslation as useTranslation8 } from "@dxos/react-ui";
893
922
  var Toast = ({ id, title, description, icon, duration, actionLabel, actionAlt, closeLabel, onAction, onOpenChange }) => {
894
- const { t } = useTranslation7(DECK_PLUGIN);
923
+ const { t } = useTranslation8(DECK_PLUGIN);
895
924
  return /* @__PURE__ */ React15.createElement(NaturalToast.Root, {
896
925
  "data-testid": id,
897
926
  defaultOpen: true,
@@ -933,8 +962,9 @@ var PlankSeparator = ({ order }) => order > 0 ? /* @__PURE__ */ React17.createEl
933
962
  gridColumn: order
934
963
  }
935
964
  }) : null;
936
- var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
965
+ var DeckLayout = ({ onDismissToast }) => {
937
966
  const { dispatchPromise: dispatch } = useIntentDispatcher5();
967
+ const settings = useCapability5(Capabilities.SettingsStore).getStore(DECK_PLUGIN).value;
938
968
  const context = useCapability5(DeckCapabilities.MutableDeckState);
939
969
  const { sidebarState, complementarySidebarState, complementarySidebarPanel, dialogOpen, dialogContent, dialogBlockAlign, dialogType, popoverOpen, popoverContent, popoverAnchorId, deck, toasts } = context;
940
970
  const { active, activeCompanions, fullscreen, solo, plankSizing } = deck;
@@ -944,13 +974,13 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
944
974
  const pluginManager = usePluginManager();
945
975
  const scrollLeftRef = useRef2();
946
976
  const deckRef = useRef2(null);
947
- const [delayedPopoverVisibility, setDelayedPopoverVisibility] = useState4(false);
948
- useEffect6(() => {
977
+ const [delayedPopoverVisibility, setDelayedPopoverVisibility] = useState3(false);
978
+ useEffect5(() => {
949
979
  popoverOpen ? setTimeout(() => setDelayedPopoverVisibility(true), 40) : setDelayedPopoverVisibility(false);
950
980
  }, [
951
981
  popoverOpen
952
982
  ]);
953
- useEffect6(() => {
983
+ useEffect5(() => {
954
984
  const attended = untracked(() => {
955
985
  const attention = pluginManager.context.requestCapability(AttentionCapabilities.Attention);
956
986
  return attention.current;
@@ -964,7 +994,7 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
964
994
  ssr: false
965
995
  });
966
996
  const shouldRevert = useRef2(false);
967
- useEffect6(() => {
997
+ useEffect5(() => {
968
998
  if (!isNotMobile && getMode(deck) === "deck") {
969
999
  const attended = untracked(() => {
970
1000
  const attention = pluginManager.context.requestCapability(AttentionCapabilities.Attention);
@@ -991,10 +1021,25 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
991
1021
  deck,
992
1022
  dispatch
993
1023
  ]);
1024
+ useEffect5(() => {
1025
+ if (!settings.enableDeck) {
1026
+ void dispatch(createIntent5(LayoutAction4.SetLayoutMode, {
1027
+ part: "mode",
1028
+ subject: active[0],
1029
+ options: {
1030
+ mode: "solo"
1031
+ }
1032
+ }));
1033
+ }
1034
+ }, [
1035
+ settings.enableDeck,
1036
+ dispatch,
1037
+ active
1038
+ ]);
994
1039
  const handleResize = useCallback5(() => {
995
1040
  scrollLeftRef.current = null;
996
1041
  }, []);
997
- useEffect6(() => {
1042
+ useEffect5(() => {
998
1043
  window.addEventListener("resize", handleResize);
999
1044
  return () => window.removeEventListener("resize", handleResize);
1000
1045
  }, [
@@ -1016,13 +1061,13 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
1016
1061
  ]);
1017
1062
  const isEmpty = !solo && active.length === 0;
1018
1063
  const padding = useMemo5(() => {
1019
- if (!solo && overscroll === "centering") {
1064
+ if (!solo && settings.overscroll === "centering") {
1020
1065
  return calculateOverscroll(active.length);
1021
1066
  }
1022
1067
  return {};
1023
1068
  }, [
1024
1069
  solo,
1025
- overscroll,
1070
+ settings.overscroll,
1026
1071
  deck
1027
1072
  ]);
1028
1073
  const mainPosition = useMemo5(() => [
@@ -1099,16 +1144,16 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
1099
1144
  }), !topbar && /* @__PURE__ */ React17.createElement(ToggleComplementarySidebarButton, {
1100
1145
  classNames: fixedComplementarySidebarToggleStyles
1101
1146
  }), /* @__PURE__ */ React17.createElement(Stack, {
1147
+ ref: deckRef,
1102
1148
  orientation: "horizontal",
1103
1149
  size: "contain",
1104
1150
  classNames: [
1105
1151
  "absolute inset-block-0 -inset-inline-px",
1106
1152
  mainPaddingTransitions
1107
1153
  ],
1108
- onScroll: handleScroll,
1109
1154
  itemsCount: itemsCount - 1,
1110
1155
  style: padding,
1111
- ref: deckRef
1156
+ onScroll: handleScroll
1112
1157
  }, active.map((entryId) => /* @__PURE__ */ React17.createElement(Fragment4, {
1113
1158
  key: entryId
1114
1159
  }, /* @__PURE__ */ React17.createElement(PlankSeparator, {
@@ -1119,7 +1164,8 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
1119
1164
  part: "deck",
1120
1165
  order: order[entryId],
1121
1166
  active,
1122
- layoutMode
1167
+ layoutMode,
1168
+ settings
1123
1169
  }))))), /* @__PURE__ */ React17.createElement("div", {
1124
1170
  role: "none",
1125
1171
  className: solo ? "relative bg-deck overflow-hidden" : "sr-only",
@@ -1140,9 +1186,10 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
1140
1186
  id: solo,
1141
1187
  companionId: solo ? activeCompanions?.[solo] : void 0,
1142
1188
  part: "solo",
1143
- layoutMode
1189
+ layoutMode,
1190
+ settings
1144
1191
  })))), topbar && /* @__PURE__ */ React17.createElement(Topbar, null), hoistStatusbar && /* @__PURE__ */ React17.createElement(StatusBar, {
1145
- showHints
1192
+ showHints: settings.showHints
1146
1193
  })), /* @__PURE__ */ React17.createElement(Popover2.Portal, null, /* @__PURE__ */ React17.createElement(Popover2.Content, {
1147
1194
  side: context.popoverSide,
1148
1195
  onEscapeKeyDown: handlePopoverClose
@@ -1182,16 +1229,22 @@ var DeckLayout = ({ overscroll, showHints, onDismissToast }) => {
1182
1229
  })));
1183
1230
  };
1184
1231
 
1185
- // packages/plugins/plugin-deck/src/components/LayoutSettings.tsx
1232
+ // packages/plugins/plugin-deck/src/components/DeckSettings/DeckSettings.tsx
1186
1233
  import React18 from "react";
1187
- import { Input, Select, useTranslation as useTranslation8 } from "@dxos/react-ui";
1234
+ import { Input, Select, useTranslation as useTranslation9 } from "@dxos/react-ui";
1188
1235
  import { DeprecatedFormContainer, DeprecatedFormInput } from "@dxos/react-ui-form";
1189
1236
  var isSocket = !!globalThis.__args;
1190
- var LayoutSettings = ({ settings }) => {
1191
- const { t } = useTranslation8(DECK_PLUGIN);
1237
+ var DeckSettings = ({ settings }) => {
1238
+ const { t } = useTranslation9(DECK_PLUGIN);
1192
1239
  return /* @__PURE__ */ React18.createElement(DeprecatedFormContainer, null, /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1240
+ label: t("settings enable deck label")
1241
+ }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1242
+ checked: settings.enableDeck,
1243
+ onCheckedChange: (checked) => settings.enableDeck = checked
1244
+ })), /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1193
1245
  label: t("select new plank positioning label")
1194
1246
  }, /* @__PURE__ */ React18.createElement(Select.Root, {
1247
+ disabled: !settings.enableDeck,
1195
1248
  value: settings.newPlankPositioning ?? "start",
1196
1249
  onValueChange: (value) => settings.newPlankPositioning = value
1197
1250
  }, /* @__PURE__ */ React18.createElement(Select.TriggerButton, {
@@ -1202,6 +1255,7 @@ var LayoutSettings = ({ settings }) => {
1202
1255
  }, t(`settings new plank position ${position} label`)))))))), /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1203
1256
  label: t("settings overscroll label")
1204
1257
  }, /* @__PURE__ */ React18.createElement(Select.Root, {
1258
+ disabled: !settings.enableDeck,
1205
1259
  value: settings.overscroll ?? "none",
1206
1260
  onValueChange: (value) => settings.overscroll = value
1207
1261
  }, /* @__PURE__ */ React18.createElement(Select.TriggerButton, {
@@ -1210,6 +1264,11 @@ var LayoutSettings = ({ settings }) => {
1210
1264
  key: option,
1211
1265
  value: option
1212
1266
  }, t(`settings overscroll ${option} label`)))))))), /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1267
+ label: t("settings enable statusbar label")
1268
+ }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1269
+ checked: settings.enableStatusbar,
1270
+ onCheckedChange: (checked) => settings.enableStatusbar = checked
1271
+ })), /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1213
1272
  label: t("settings show hints label")
1214
1273
  }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1215
1274
  checked: settings.showHints,
@@ -1219,17 +1278,12 @@ var LayoutSettings = ({ settings }) => {
1219
1278
  }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1220
1279
  checked: settings.enableNativeRedirect,
1221
1280
  onCheckedChange: (checked) => settings.enableNativeRedirect = checked
1222
- })), /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1223
- label: t("settings enable statusbar label")
1224
- }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1225
- checked: settings.enableStatusbar,
1226
- onCheckedChange: (checked) => settings.enableStatusbar = checked
1227
1281
  })));
1228
1282
  };
1229
1283
 
1230
1284
  export {
1231
1285
  Banner,
1232
1286
  DeckLayout,
1233
- LayoutSettings
1287
+ DeckSettings
1234
1288
  };
1235
- //# sourceMappingURL=chunk-MWUT66KV.mjs.map
1289
+ //# sourceMappingURL=chunk-FJBMNSUC.mjs.map