@dxos/plugin-deck 0.8.2-staging.7ac8446 → 0.8.2

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 (155) hide show
  1. package/dist/lib/browser/{app-graph-builder-VYZ4IWI3.mjs → app-graph-builder-M5BT34YG.mjs} +17 -16
  2. package/dist/lib/browser/app-graph-builder-M5BT34YG.mjs.map +7 -0
  3. package/dist/lib/browser/{check-app-scheme-SEYECDHI.mjs → check-app-scheme-7AXGR6UT.mjs} +2 -3
  4. package/dist/lib/browser/check-app-scheme-7AXGR6UT.mjs.map +7 -0
  5. package/dist/lib/browser/{state-7TN26M42.mjs → chunk-FX44YX3G.mjs} +11 -8
  6. package/dist/lib/browser/chunk-FX44YX3G.mjs.map +7 -0
  7. package/dist/lib/browser/chunk-JE2ARGEB.mjs +1487 -0
  8. package/dist/lib/browser/chunk-JE2ARGEB.mjs.map +7 -0
  9. package/dist/lib/browser/{chunk-XMCG42ID.mjs → chunk-KLN73CM3.mjs} +2 -2
  10. package/dist/lib/browser/{chunk-XMCG42ID.mjs.map → chunk-KLN73CM3.mjs.map} +1 -1
  11. package/dist/lib/browser/chunk-SLQNOATN.mjs +127 -0
  12. package/dist/lib/browser/chunk-SLQNOATN.mjs.map +7 -0
  13. package/dist/lib/browser/chunk-TRFYUEBA.mjs +145 -0
  14. package/dist/lib/browser/chunk-TRFYUEBA.mjs.map +7 -0
  15. package/dist/lib/browser/chunk-YN5OZEGS.mjs +162 -0
  16. package/dist/lib/browser/chunk-YN5OZEGS.mjs.map +7 -0
  17. package/dist/lib/browser/index.mjs +8 -8
  18. package/dist/lib/browser/index.mjs.map +2 -2
  19. package/dist/lib/browser/{intent-resolver-UDYKO2QW.mjs → intent-resolver-3GAC57UA.mjs} +135 -92
  20. package/dist/lib/browser/intent-resolver-3GAC57UA.mjs.map +7 -0
  21. package/dist/lib/browser/meta.json +1 -1
  22. package/dist/lib/browser/{react-root-XLXN2VEW.mjs → react-root-ISFFOJZX.mjs} +7 -7
  23. package/dist/lib/browser/{react-surface-WNGMZL7I.mjs → react-surface-A63RQB5N.mjs} +7 -7
  24. package/dist/lib/browser/{settings-HMDGSBGO.mjs → settings-X7GDEXU3.mjs} +6 -6
  25. package/dist/lib/browser/settings-X7GDEXU3.mjs.map +7 -0
  26. package/dist/lib/browser/state-VJ6E3ADY.mjs +10 -0
  27. package/dist/lib/browser/state-VJ6E3ADY.mjs.map +7 -0
  28. package/dist/lib/browser/{tools-SC6QEN7R.mjs → tools-N57NQ2LH.mjs} +28 -18
  29. package/dist/lib/browser/tools-N57NQ2LH.mjs.map +7 -0
  30. package/dist/lib/browser/types.mjs +1 -1
  31. package/dist/lib/browser/{url-handler-ODG4B6NX.mjs → url-handler-BUGI6XRE.mjs} +5 -5
  32. package/dist/lib/browser/url-handler-BUGI6XRE.mjs.map +7 -0
  33. package/dist/types/src/capabilities/app-graph-builder.d.ts +2 -179
  34. package/dist/types/src/capabilities/app-graph-builder.d.ts.map +1 -1
  35. package/dist/types/src/capabilities/capabilities.d.ts +18 -8
  36. package/dist/types/src/capabilities/capabilities.d.ts.map +1 -1
  37. package/dist/types/src/capabilities/check-app-scheme.d.ts +2 -2
  38. package/dist/types/src/capabilities/check-app-scheme.d.ts.map +1 -1
  39. package/dist/types/src/capabilities/index.d.ts +8 -183
  40. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  41. package/dist/types/src/capabilities/intent-resolver.d.ts +2 -2
  42. package/dist/types/src/capabilities/intent-resolver.d.ts.map +1 -1
  43. package/dist/types/src/capabilities/state.d.ts +12 -7
  44. package/dist/types/src/capabilities/state.d.ts.map +1 -1
  45. package/dist/types/src/capabilities/tools.d.ts +1 -1
  46. package/dist/types/src/capabilities/tools.d.ts.map +1 -1
  47. package/dist/types/src/capabilities/url-handler.d.ts +2 -2
  48. package/dist/types/src/capabilities/url-handler.d.ts.map +1 -1
  49. package/dist/types/src/components/DeckLayout/Banner.d.ts.map +1 -1
  50. package/dist/types/src/components/DeckLayout/ContentEmpty.d.ts.map +1 -1
  51. package/dist/types/src/components/DeckLayout/DeckLayout.d.ts.map +1 -1
  52. package/dist/types/src/components/DeckLayout/Dialog.d.ts +3 -0
  53. package/dist/types/src/components/DeckLayout/Dialog.d.ts.map +1 -0
  54. package/dist/types/src/components/DeckLayout/Popover.d.ts +5 -0
  55. package/dist/types/src/components/DeckLayout/Popover.d.ts.map +1 -0
  56. package/dist/types/src/components/DeckLayout/StatusBar.d.ts.map +1 -1
  57. package/dist/types/src/components/DeckLayout/Toast.d.ts.map +1 -1
  58. package/dist/types/src/components/DeckSettings/DeckSettings.d.ts.map +1 -1
  59. package/dist/types/src/components/Plank/Plank.d.ts +18 -5
  60. package/dist/types/src/components/Plank/Plank.d.ts.map +1 -1
  61. package/dist/types/src/components/Plank/Plank.stories.d.ts +3 -3
  62. package/dist/types/src/components/Plank/Plank.stories.d.ts.map +1 -1
  63. package/dist/types/src/components/Plank/PlankControls.d.ts +3 -2
  64. package/dist/types/src/components/Plank/PlankControls.d.ts.map +1 -1
  65. package/dist/types/src/components/Plank/PlankError.d.ts.map +1 -1
  66. package/dist/types/src/components/Plank/PlankHeading.d.ts +3 -2
  67. package/dist/types/src/components/Plank/PlankHeading.d.ts.map +1 -1
  68. package/dist/types/src/components/Sidebar/ComplementarySidebar.d.ts.map +1 -1
  69. package/dist/types/src/components/Sidebar/Sidebar.d.ts.map +1 -1
  70. package/dist/types/src/components/Sidebar/SidebarButton.d.ts +2 -1
  71. package/dist/types/src/components/Sidebar/SidebarButton.d.ts.map +1 -1
  72. package/dist/types/src/hooks/index.d.ts +5 -1
  73. package/dist/types/src/hooks/index.d.ts.map +1 -1
  74. package/dist/types/src/hooks/useBreakpoints.d.ts.map +1 -0
  75. package/dist/types/src/hooks/useCompanions.d.ts.map +1 -0
  76. package/dist/types/src/hooks/useDeckCompanions.d.ts +13 -0
  77. package/dist/types/src/hooks/useDeckCompanions.d.ts.map +1 -0
  78. package/dist/types/src/hooks/useHoistStatusbar.d.ts +3 -0
  79. package/dist/types/src/hooks/useHoistStatusbar.d.ts.map +1 -0
  80. package/dist/types/src/hooks/useNodeActionExpander.d.ts.map +1 -1
  81. package/dist/types/src/index.d.ts +1 -1
  82. package/dist/types/src/index.d.ts.map +1 -1
  83. package/dist/types/src/layout.d.ts.map +1 -1
  84. package/dist/types/src/translations.d.ts +2 -1
  85. package/dist/types/src/translations.d.ts.map +1 -1
  86. package/dist/types/src/types.d.ts +108 -104
  87. package/dist/types/src/types.d.ts.map +1 -1
  88. package/dist/types/src/util/index.d.ts +1 -4
  89. package/dist/types/src/util/index.d.ts.map +1 -1
  90. package/dist/types/src/util/layoutAppliesTopbar.d.ts +2 -1
  91. package/dist/types/src/util/layoutAppliesTopbar.d.ts.map +1 -1
  92. package/dist/types/src/util/overscroll.d.ts.map +1 -1
  93. package/dist/types/src/util/set-active.d.ts.map +1 -1
  94. package/dist/types/tsconfig.tsbuildinfo +1 -1
  95. package/package.json +39 -30
  96. package/src/capabilities/app-graph-builder.ts +120 -92
  97. package/src/capabilities/check-app-scheme.ts +3 -7
  98. package/src/capabilities/index.ts +3 -2
  99. package/src/capabilities/intent-resolver.ts +181 -135
  100. package/src/capabilities/settings.ts +4 -4
  101. package/src/capabilities/state.ts +7 -4
  102. package/src/capabilities/tools.ts +15 -12
  103. package/src/capabilities/url-handler.ts +4 -4
  104. package/src/components/DeckLayout/ContentEmpty.tsx +9 -4
  105. package/src/components/DeckLayout/DeckLayout.tsx +123 -188
  106. package/src/components/DeckLayout/Dialog.tsx +36 -0
  107. package/src/components/DeckLayout/Popover.tsx +104 -0
  108. package/src/components/Plank/Plank.stories.tsx +20 -8
  109. package/src/components/Plank/Plank.tsx +105 -69
  110. package/src/components/Plank/PlankControls.tsx +53 -57
  111. package/src/components/Plank/PlankError.tsx +2 -6
  112. package/src/components/Plank/PlankHeading.tsx +31 -12
  113. package/src/components/Sidebar/ComplementarySidebar.tsx +36 -57
  114. package/src/components/Sidebar/Sidebar.tsx +7 -4
  115. package/src/components/Sidebar/SidebarButton.tsx +26 -7
  116. package/src/components/fragments.ts +1 -1
  117. package/src/hooks/index.ts +5 -1
  118. package/src/{util → hooks}/useCompanions.ts +3 -3
  119. package/src/hooks/useDeckCompanions.ts +33 -0
  120. package/src/{util → hooks}/useHoistStatusbar.ts +9 -4
  121. package/src/hooks/useNodeActionExpander.ts +3 -8
  122. package/src/index.ts +1 -1
  123. package/src/translations.ts +2 -1
  124. package/src/types.ts +77 -71
  125. package/src/util/index.ts +1 -4
  126. package/src/util/layoutAppliesTopbar.ts +8 -2
  127. package/dist/lib/browser/app-graph-builder-VYZ4IWI3.mjs.map +0 -7
  128. package/dist/lib/browser/check-app-scheme-SEYECDHI.mjs.map +0 -7
  129. package/dist/lib/browser/chunk-6ZSOFCPP.mjs +0 -117
  130. package/dist/lib/browser/chunk-6ZSOFCPP.mjs.map +0 -7
  131. package/dist/lib/browser/chunk-B4LOJUWW.mjs +0 -24
  132. package/dist/lib/browser/chunk-B4LOJUWW.mjs.map +0 -7
  133. package/dist/lib/browser/chunk-FJBMNSUC.mjs +0 -1289
  134. package/dist/lib/browser/chunk-FJBMNSUC.mjs.map +0 -7
  135. package/dist/lib/browser/chunk-FLOVGNYB.mjs +0 -81
  136. package/dist/lib/browser/chunk-FLOVGNYB.mjs.map +0 -7
  137. package/dist/lib/browser/chunk-RJNCG4ND.mjs +0 -154
  138. package/dist/lib/browser/chunk-RJNCG4ND.mjs.map +0 -7
  139. package/dist/lib/browser/intent-resolver-UDYKO2QW.mjs.map +0 -7
  140. package/dist/lib/browser/settings-HMDGSBGO.mjs.map +0 -7
  141. package/dist/lib/browser/state-7TN26M42.mjs.map +0 -7
  142. package/dist/lib/browser/tools-SC6QEN7R.mjs.map +0 -7
  143. package/dist/lib/browser/url-handler-ODG4B6NX.mjs.map +0 -7
  144. package/dist/types/src/components/DeckLayout/Fullscreen.d.ts +0 -5
  145. package/dist/types/src/components/DeckLayout/Fullscreen.d.ts.map +0 -1
  146. package/dist/types/src/util/useBreakpoints.d.ts.map +0 -1
  147. package/dist/types/src/util/useCompanions.d.ts.map +0 -1
  148. package/dist/types/src/util/useHoistStatusbar.d.ts +0 -2
  149. package/dist/types/src/util/useHoistStatusbar.d.ts.map +0 -1
  150. package/src/components/DeckLayout/Fullscreen.tsx +0 -31
  151. /package/dist/lib/browser/{react-root-XLXN2VEW.mjs.map → react-root-ISFFOJZX.mjs.map} +0 -0
  152. /package/dist/lib/browser/{react-surface-WNGMZL7I.mjs.map → react-surface-A63RQB5N.mjs.map} +0 -0
  153. /package/dist/types/src/{util → hooks}/useBreakpoints.d.ts +0 -0
  154. /package/dist/types/src/{util → hooks}/useCompanions.d.ts +0 -0
  155. /package/src/{util → hooks}/useBreakpoints.ts +0 -0
@@ -1,1289 +0,0 @@
1
- import {
2
- parseEntryId
3
- } from "./chunk-FLOVGNYB.mjs";
4
- import {
5
- calculateOverscroll,
6
- layoutAppliesTopbar,
7
- useBreakpoints,
8
- useCompanions,
9
- useHoistStatusbar
10
- } from "./chunk-6ZSOFCPP.mjs";
11
- import {
12
- DeckCapabilities
13
- } from "./chunk-XMCG42ID.mjs";
14
- import {
15
- ATTENDABLE_PATH_SEPARATOR,
16
- DECK_COMPANION_TYPE,
17
- DeckAction,
18
- NewPlankPositions,
19
- OverscrollOptions,
20
- PLANK_COMPANION_TYPE,
21
- getMode
22
- } from "./chunk-RJNCG4ND.mjs";
23
- import {
24
- DECK_PLUGIN
25
- } from "./chunk-NSATFAEE.mjs";
26
-
27
- // packages/plugins/plugin-deck/src/components/DeckLayout/Banner.tsx
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";
39
-
40
- // packages/plugins/plugin-deck/src/components/Sidebar/SidebarButton.tsx
41
- import React from "react";
42
- import { useCapability } from "@dxos/app-framework";
43
- import { IconButton, useTranslation } from "@dxos/react-ui";
44
- var ToggleSidebarButton = ({ classNames, variant = "ghost" }) => {
45
- const layoutContext = useCapability(DeckCapabilities.MutableDeckState);
46
- const { t } = useTranslation(DECK_PLUGIN);
47
- return /* @__PURE__ */ React.createElement(IconButton, {
48
- variant,
49
- iconOnly: true,
50
- icon: "ph--sidebar--regular",
51
- size: 4,
52
- label: t("open navigation sidebar label"),
53
- onClick: () => layoutContext.sidebarState = layoutContext.sidebarState === "expanded" ? "collapsed" : "expanded",
54
- classNames
55
- });
56
- };
57
- var CloseSidebarButton = () => {
58
- const layoutContext = useCapability(DeckCapabilities.MutableDeckState);
59
- const { t } = useTranslation(DECK_PLUGIN);
60
- return /* @__PURE__ */ React.createElement(IconButton, {
61
- variant: "ghost",
62
- iconOnly: true,
63
- icon: "ph--caret-line-left--regular",
64
- size: 4,
65
- label: t("close navigation sidebar label"),
66
- onClick: () => layoutContext.sidebarState = "collapsed",
67
- classNames: "rounded-none pli-1 dx-focus-ring-inset pie-[max(.5rem,env(safe-area-inset-left))]"
68
- });
69
- };
70
- var ToggleComplementarySidebarButton = ({ inR0, classNames }) => {
71
- const layoutContext = useCapability(DeckCapabilities.MutableDeckState);
72
- const { t } = useTranslation(DECK_PLUGIN);
73
- return /* @__PURE__ */ React.createElement(IconButton, {
74
- iconOnly: true,
75
- onClick: () => layoutContext.complementarySidebarState = layoutContext.complementarySidebarState === "expanded" ? "collapsed" : "expanded",
76
- variant: "ghost",
77
- label: t("open complementary sidebar label"),
78
- classNames: [
79
- "[&>svg]:-scale-x-100",
80
- classNames
81
- ],
82
- icon: "ph--sidebar-simple--regular",
83
- size: inR0 ? 5 : 4,
84
- tooltipSide: inR0 ? "left" : void 0
85
- });
86
- };
87
-
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";
96
-
97
- // packages/plugins/plugin-deck/src/components/Plank/PlankError.tsx
98
- import React5, { useEffect as useEffect2, useState } from "react";
99
- import { useTranslation as useTranslation4 } from "@dxos/react-ui";
100
- import { descriptionText, mx as mx2 } from "@dxos/react-ui-theme";
101
-
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";
106
- import { StackItem } from "@dxos/react-ui-stack";
107
- import { TextTooltip } from "@dxos/react-ui-text-tooltip";
108
-
109
- // packages/plugins/plugin-deck/src/components/Plank/PlankControls.tsx
110
- import React2, { forwardRef, useCallback } from "react";
111
- import { createIntent, useIntentDispatcher } from "@dxos/app-framework";
112
- import { invariant } from "@dxos/invariant";
113
- import { Button, ButtonGroup, Icon, Tooltip, useTranslation as useTranslation2 } from "@dxos/react-ui";
114
- var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-deck/src/components/Plank/PlankControls.tsx";
115
- var PlankControl = ({ icon, label: label3, ...props }) => {
116
- return /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
117
- asChild: true
118
- }, /* @__PURE__ */ React2.createElement(Button, {
119
- variant: "ghost",
120
- ...props
121
- }, /* @__PURE__ */ React2.createElement("span", {
122
- className: "sr-only"
123
- }, label3), /* @__PURE__ */ React2.createElement(Icon, {
124
- icon,
125
- size: 5
126
- }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, {
127
- side: "bottom"
128
- }, label3)));
129
- };
130
- var plankControlSpacing = "pli-2 plb-3";
131
- var PlankCompanionControls = /* @__PURE__ */ forwardRef(({ primary }, forwardedRef) => {
132
- const { t } = useTranslation2(DECK_PLUGIN);
133
- const { dispatchPromise: dispatch } = useIntentDispatcher();
134
- const handleCloseCompanion = useCallback(() => {
135
- invariant(primary, void 0, {
136
- F: __dxlog_file,
137
- L: 68,
138
- S: void 0,
139
- A: [
140
- "primary",
141
- ""
142
- ]
143
- });
144
- return dispatch(createIntent(DeckAction.ChangeCompanion, {
145
- primary,
146
- companion: null
147
- }));
148
- }, []);
149
- return /* @__PURE__ */ React2.createElement("div", {
150
- ref: forwardedRef,
151
- className: "contents app-no-drag"
152
- }, /* @__PURE__ */ React2.createElement(PlankControl, {
153
- label: t("close companion label"),
154
- variant: "ghost",
155
- // icon='ph--minus--regular'
156
- icon: "ph--caret-left--regular",
157
- onClick: handleCloseCompanion,
158
- classNames: plankControlSpacing
159
- }));
160
- });
161
- var PlankControls = /* @__PURE__ */ forwardRef(({ children, classNames, variant = "default", capabilities, isSolo, pin, close = false, onClick, ...props }, forwardedRef) => {
162
- const { t } = useTranslation2(DECK_PLUGIN);
163
- const buttonClassNames = variant === "hide-disabled" ? `disabled:hidden ${plankControlSpacing}` : plankControlSpacing;
164
- return /* @__PURE__ */ React2.createElement(ButtonGroup, {
165
- ...props,
166
- classNames: [
167
- "app-no-drag",
168
- classNames
169
- ],
170
- ref: forwardedRef
171
- }, capabilities.deck && capabilities.solo && /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(PlankControl, {
172
- label: isSolo ? t("show deck plank label") : t("show solo plank label"),
173
- classNames: buttonClassNames,
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, {
177
- label: t("increment start label"),
178
- disabled: !capabilities.incrementStart,
179
- classNames: buttonClassNames,
180
- icon: "ph--caret-left--regular",
181
- onClick: () => onClick?.("increment-start")
182
- }), /* @__PURE__ */ React2.createElement(PlankControl, {
183
- label: t("increment end label"),
184
- disabled: !capabilities.incrementEnd,
185
- classNames: buttonClassNames,
186
- icon: "ph--caret-right--regular",
187
- onClick: () => onClick?.("increment-end")
188
- }))), close && !isSolo && /* @__PURE__ */ React2.createElement(PlankControl, {
189
- label: t(`${typeof close === "string" ? "minify" : "close"} label`),
190
- classNames: buttonClassNames,
191
- "data-testid": "plankHeading.close",
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")
200
- }), children);
201
- });
202
-
203
- // packages/plugins/plugin-deck/src/components/fragments.ts
204
- import { mx } from "@dxos/react-ui-theme";
205
- var soloInlinePadding = "pis-[calc(env(safe-area-inset-left)+.25rem)] pie-[calc(env(safe-area-inset-left)+.25rem)]";
206
- var sidebarToggleStyles = "bs-[--rail-item] is-[--rail-item] absolute block-end-2 z-[1] !bg-deck lg:hidden";
207
- var fixedSidebarToggleStyles = mx(sidebarToggleStyles, "inline-start-2");
208
- var fixedComplementarySidebarToggleStyles = mx(sidebarToggleStyles, "inline-end-2");
209
-
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 = [] }) => {
212
- const { t } = useTranslation3(DECK_PLUGIN);
213
- const { dispatchPromise: dispatch } = useIntentDispatcher2();
214
- const { graph } = useAppGraph();
215
- const breakpoint = useBreakpoints();
216
- const icon = node?.properties?.icon ?? "ph--placeholder--regular";
217
- const label3 = pending ? t("pending heading") : toLocalizedString(node?.properties?.label ?? [
218
- "plank heading fallback label",
219
- {
220
- ns: DECK_PLUGIN
221
- }
222
- ], t);
223
- const isCompanionNode = node?.type === PLANK_COMPANION_TYPE;
224
- useEffect(() => {
225
- const frame = requestAnimationFrame(() => {
226
- node && graph.actions(node);
227
- });
228
- return () => cancelAnimationFrame(frame);
229
- }, [
230
- node
231
- ]);
232
- const attendableId = primaryId ?? id;
233
- const capabilities = useMemo(() => ({
234
- deck: deckEnabled ?? true,
235
- solo: breakpoint !== "mobile" && (part === "solo" || part === "deck"),
236
- incrementStart: canIncrementStart,
237
- incrementEnd: canIncrementEnd,
238
- companion: !isCompanionNode && companions && companions.length > 0
239
- }), [
240
- breakpoint,
241
- part,
242
- companions,
243
- canIncrementStart,
244
- canIncrementEnd,
245
- isCompanionNode,
246
- deckEnabled
247
- ]);
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
- }, [
261
- actions,
262
- node,
263
- variant,
264
- graph
265
- ]);
266
- const handleAction = useCallback2((action) => {
267
- typeof action.data === "function" && action.data?.({
268
- node: action,
269
- caller: DECK_PLUGIN
270
- });
271
- }, []);
272
- const handlePlankAction = useCallback2((eventType) => {
273
- if (eventType === "solo") {
274
- return dispatch(createIntent2(DeckAction.Adjust, {
275
- type: eventType,
276
- id
277
- }));
278
- } else if (eventType === "close") {
279
- if (part === "complementary") {
280
- return dispatch(createIntent2(LayoutAction.UpdateComplementary, {
281
- part: "complementary",
282
- options: {
283
- state: "collapsed"
284
- }
285
- }));
286
- } else {
287
- return dispatch(createIntent2(LayoutAction.Close, {
288
- part: "main",
289
- subject: [
290
- id
291
- ],
292
- options: {
293
- state: false
294
- }
295
- }));
296
- }
297
- } else {
298
- return dispatch(createIntent2(DeckAction.Adjust, {
299
- type: eventType,
300
- id
301
- }));
302
- }
303
- }, [
304
- dispatch,
305
- id,
306
- part
307
- ]);
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, {
322
- classNames: [
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"
325
- ]
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, {
339
- icon,
340
- related: part === "complementary",
341
- attendableId,
342
- triggerLabel: t("actions menu label"),
343
- actions: sigilActions,
344
- onAction: handleAction
345
- }, /* @__PURE__ */ React3.createElement(Surface, {
346
- role: "menu-footer",
347
- data: {
348
- subject: node.data
349
- }
350
- })) : /* @__PURE__ */ React3.createElement(StackItem.SigilButton, null, /* @__PURE__ */ React3.createElement("span", {
351
- className: "sr-only"
352
- }, label3), /* @__PURE__ */ React3.createElement(Icon2, {
353
- icon,
354
- size: 5
355
- }))), /* @__PURE__ */ React3.createElement(TextTooltip, {
356
- text: label3,
357
- onlyWhenTruncating: true
358
- }, /* @__PURE__ */ React3.createElement(StackItem.HeadingLabel, {
359
- attendableId,
360
- related: part === "complementary",
361
- ...pending && {
362
- classNames: "text-description"
363
- }
364
- }, label3))), node && part !== "complementary" && /* @__PURE__ */ React3.createElement(Surface, {
365
- role: "navbar-end",
366
- data: {
367
- subject: node.data
368
- }
369
- }), companioned === "companion" ? /* @__PURE__ */ React3.createElement(PlankCompanionControls, {
370
- primary: primaryId
371
- }) : /* @__PURE__ */ React3.createElement(PlankControls, {
372
- capabilities,
373
- isSolo: part === "solo",
374
- close: part === "complementary" ? "minify-end" : true,
375
- onClick: handlePlankAction
376
- }));
377
- });
378
-
379
- // packages/plugins/plugin-deck/src/components/Plank/PlankLoading.tsx
380
- import React4 from "react";
381
- var PlankLoading = () => {
382
- return /* @__PURE__ */ React4.createElement("div", {
383
- role: "none",
384
- className: "grid place-items-center attention-surface"
385
- });
386
- };
387
-
388
- // packages/plugins/plugin-deck/src/components/Plank/PlankError.tsx
389
- var PlankContentError = ({ error }) => {
390
- const { t } = useTranslation4(DECK_PLUGIN);
391
- const errorString = error?.toString() ?? "";
392
- return /* @__PURE__ */ React5.createElement("div", {
393
- role: "none",
394
- className: "overflow-auto p-8 attention-surface grid place-items-center"
395
- }, /* @__PURE__ */ React5.createElement("p", {
396
- role: "alert",
397
- className: mx2(descriptionText, "break-words border border-dashed border-separator rounded-lg p-8", errorString.length < 256 && "text-lg")
398
- }, error ? errorString : t("error fallback message")));
399
- };
400
- var PlankError = ({ id, part, node, error }) => {
401
- const [timedOut, setTimedOut] = useState(false);
402
- useEffect2(() => {
403
- setTimeout(() => setTimedOut(true), 5e3);
404
- }, []);
405
- return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(PlankHeading, {
406
- id,
407
- part,
408
- node,
409
- pending: !timedOut
410
- }), timedOut ? /* @__PURE__ */ React5.createElement(PlankContentError, {
411
- error
412
- }) : /* @__PURE__ */ React5.createElement(PlankLoading, null));
413
- };
414
-
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);
430
- }
431
- }, [
432
- node
433
- ]);
434
- };
435
-
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
- };
444
- };
445
-
446
- // packages/plugins/plugin-deck/src/components/Plank/Plank.tsx
447
- var UNKNOWN_ID = "unknown_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);
451
- const rootElement = useRef(null);
452
- const canResize = layoutMode === "deck";
453
- const Root = part.startsWith("solo") ? "article" : StackItem2.Root;
454
- const attendableAttrs = useAttendableAttributes(primary?.id ?? id);
455
- const index = active ? active.findIndex((entryId) => entryId === id) : 0;
456
- const length = active?.length ?? 1;
457
- const canIncrementStart = active && index !== void 0 && index > 0 && length !== void 0 && length > 1;
458
- const canIncrementEnd = active && index !== void 0 && index < length - 1 && length !== void 0;
459
- const { variant } = parseEntryId(id);
460
- const sizeKey = `${id.split("+")[0]}${variant ? `${ATTENDABLE_PATH_SEPARATOR2}${variant}` : ""}`;
461
- const size = deck.plankSizing[sizeKey];
462
- const setSize = useCallback3(debounce((nextSize) => {
463
- return dispatch(createIntent3(DeckAction.UpdatePlankSize, {
464
- id: sizeKey,
465
- size: nextSize
466
- }));
467
- }, 200), [
468
- dispatch,
469
- sizeKey
470
- ]);
471
- const handleKeyDown = useCallback3((event) => {
472
- if (event.target === event.currentTarget && event.key === "Escape") {
473
- rootElement.current?.closest("main")?.focus();
474
- }
475
- }, []);
476
- useLayoutEffect(() => {
477
- if (scrollIntoView === id) {
478
- const focusable = rootElement.current?.querySelector("button") || rootElement.current;
479
- focusable?.focus({
480
- preventScroll: true
481
- });
482
- layoutMode === "deck" && focusable?.scrollIntoView({
483
- behavior: "smooth",
484
- inline: "center"
485
- });
486
- void dispatch(createIntent3(LayoutAction2.ScrollIntoView, {
487
- part: "current",
488
- subject: void 0
489
- }));
490
- }
491
- }, [
492
- id,
493
- scrollIntoView,
494
- layoutMode
495
- ]);
496
- const isSolo = layoutMode === "solo" && part === "solo";
497
- const isAttendable = layoutMode === "solo" && part.startsWith("solo") || layoutMode === "deck" && part === "deck";
498
- const sizeAttrs = useMainSize();
499
- const data = useMemo2(() => node && {
500
- subject: node.data,
501
- companionTo: primary?.data,
502
- variant,
503
- path,
504
- popoverAnchorId
505
- }, [
506
- node,
507
- node?.data,
508
- path,
509
- popoverAnchorId,
510
- primary?.data
511
- ]);
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, {
515
- ref: rootElement,
516
- "data-testid": "deck.plank",
517
- tabIndex: 0,
518
- ...part.startsWith("solo") ? {
519
- ...sizeAttrs,
520
- className
521
- } : {
522
- item: {
523
- id
524
- },
525
- size,
526
- onSizeChange: setSize,
527
- classNames: className,
528
- order,
529
- role: "article"
530
- },
531
- ...isAttendable ? attendableAttrs : {},
532
- onKeyDown: handleKeyDown
533
- }, node ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(PlankHeading, {
534
- id,
535
- part: part.startsWith("solo-") ? "solo" : part,
536
- node,
537
- deckEnabled: settings?.enableDeck,
538
- canIncrementStart,
539
- canIncrementEnd,
540
- popoverAnchorId,
541
- primaryId: primary?.id,
542
- companioned,
543
- companions
544
- }), /* @__PURE__ */ React6.createElement(Surface2, {
545
- key: node.id,
546
- role: "article",
547
- data,
548
- limit: 1,
549
- fallback: PlankContentError,
550
- placeholder
551
- })) : /* @__PURE__ */ React6.createElement(PlankError, {
552
- id,
553
- part
554
- }), canResize && /* @__PURE__ */ React6.createElement(StackItem2.ResizeHandle, null));
555
- });
556
- var SplitFrame = ({ children }) => {
557
- const sizeAttrs = useMainSize();
558
- return /* @__PURE__ */ React6.createElement("div", {
559
- role: "none",
560
- className: mx3("grid grid-cols-[1fr_1fr] absolute inset-0", railGridHorizontal, mainIntrinsicSize),
561
- ...sizeAttrs
562
- }, children);
563
- };
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);
569
- if (props.companionId) {
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",
575
- ...props,
576
- ...props.part === "solo" ? {
577
- part: "solo-primary"
578
- } : {}
579
- }), /* @__PURE__ */ React6.createElement(PlankImpl, {
580
- id: props.companionId,
581
- node: currentCompanion,
582
- companioned: "companion",
583
- primary: node,
584
- companions,
585
- ...props,
586
- ...props.part === "solo" ? {
587
- part: "solo-companion"
588
- } : {
589
- order: props.order + 1
590
- }
591
- }));
592
- } else {
593
- return /* @__PURE__ */ React6.createElement(PlankImpl, {
594
- id,
595
- node,
596
- companions,
597
- ...props
598
- });
599
- }
600
- };
601
-
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";
742
- import { Main as Main2 } from "@dxos/react-ui";
743
- var label2 = [
744
- "sidebar title",
745
- {
746
- ns: DECK_PLUGIN
747
- }
748
- ];
749
- var Sidebar = () => {
750
- const { popoverAnchorId, activeDeck: current } = useCapability4(DeckCapabilities.DeckState);
751
- const breakpoint = useBreakpoints();
752
- const topbar = layoutAppliesTopbar(breakpoint);
753
- const hoistStatusbar = useHoistStatusbar(breakpoint);
754
- const navigationData = useMemo4(() => ({
755
- popoverAnchorId,
756
- topbar,
757
- hoistStatusbar,
758
- current
759
- }), [
760
- popoverAnchorId,
761
- topbar,
762
- hoistStatusbar,
763
- current
764
- ]);
765
- return /* @__PURE__ */ React8.createElement(Main2.NavigationSidebar, {
766
- label: label2,
767
- classNames: [
768
- "grid",
769
- topbar && "block-start-[calc(env(safe-area-inset-top)+var(--rail-size))]",
770
- hoistStatusbar && "block-end-[--statusbar-size]"
771
- ]
772
- }, /* @__PURE__ */ React8.createElement(Surface4, {
773
- role: "navigation",
774
- data: navigationData,
775
- limit: 1
776
- }));
777
- };
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
-
900
- // packages/plugins/plugin-deck/src/components/DeckLayout/StatusBar.tsx
901
- import React14 from "react";
902
- import { Surface as Surface9 } from "@dxos/app-framework";
903
- import { useLandmarkMover } from "@dxos/react-ui";
904
- var StatusBar = ({ showHints }) => {
905
- const mover = useLandmarkMover(void 0, "3");
906
- return /* @__PURE__ */ React14.createElement("div", {
907
- role: "contentinfo",
908
- className: "fixed block-end-0 inset-inline-0 bs-[--statusbar-size] border-bs border-separator z-[2] flex text-description",
909
- ...mover
910
- }, showHints && /* @__PURE__ */ React14.createElement(Surface9, {
911
- role: "hints",
912
- limit: 1
913
- }), /* @__PURE__ */ React14.createElement(Surface9, {
914
- role: "status-bar",
915
- limit: 1
916
- }));
917
- };
918
-
919
- // packages/plugins/plugin-deck/src/components/DeckLayout/Toast.tsx
920
- import React15 from "react";
921
- import { Button as Button2, Icon as Icon3, Toast as NaturalToast, toLocalizedString as toLocalizedString3, useTranslation as useTranslation8 } from "@dxos/react-ui";
922
- var Toast = ({ id, title, description, icon, duration, actionLabel, actionAlt, closeLabel, onAction, onOpenChange }) => {
923
- const { t } = useTranslation8(DECK_PLUGIN);
924
- return /* @__PURE__ */ React15.createElement(NaturalToast.Root, {
925
- "data-testid": id,
926
- defaultOpen: true,
927
- duration,
928
- onOpenChange
929
- }, /* @__PURE__ */ React15.createElement(NaturalToast.Body, null, /* @__PURE__ */ React15.createElement(NaturalToast.Title, {
930
- classNames: "items-center"
931
- }, icon && /* @__PURE__ */ React15.createElement(Icon3, {
932
- icon,
933
- size: 5,
934
- classNames: "inline mr-1"
935
- }), title && /* @__PURE__ */ React15.createElement("span", null, toLocalizedString3(title, t))), description && /* @__PURE__ */ React15.createElement(NaturalToast.Description, null, description && toLocalizedString3(description, t))), /* @__PURE__ */ React15.createElement(NaturalToast.Actions, null, onAction && actionAlt && actionLabel && /* @__PURE__ */ React15.createElement(NaturalToast.Action, {
936
- altText: toLocalizedString3(actionAlt, t),
937
- asChild: true
938
- }, /* @__PURE__ */ React15.createElement(Button2, {
939
- "data-testid": "toast.action",
940
- variant: "primary",
941
- onClick: () => onAction?.()
942
- }, toLocalizedString3(actionLabel, t))), closeLabel && /* @__PURE__ */ React15.createElement(NaturalToast.Close, {
943
- asChild: true
944
- }, /* @__PURE__ */ React15.createElement(Button2, {
945
- "data-testid": "toast.close"
946
- }, toLocalizedString3(closeLabel, t)))));
947
- };
948
-
949
- // packages/plugins/plugin-deck/src/components/DeckLayout/Topbar.tsx
950
- import React16 from "react";
951
- var Topbar = () => {
952
- return /* @__PURE__ */ React16.createElement(Banner, {
953
- variant: "topbar"
954
- });
955
- };
956
-
957
- // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
958
- var PlankSeparator = ({ order }) => order > 0 ? /* @__PURE__ */ React17.createElement("span", {
959
- role: "separator",
960
- className: "row-span-2 bg-deck is-4",
961
- style: {
962
- gridColumn: order
963
- }
964
- }) : null;
965
- var DeckLayout = ({ onDismissToast }) => {
966
- const { dispatchPromise: dispatch } = useIntentDispatcher5();
967
- const settings = useCapability5(Capabilities.SettingsStore).getStore(DECK_PLUGIN).value;
968
- const context = useCapability5(DeckCapabilities.MutableDeckState);
969
- const { sidebarState, complementarySidebarState, complementarySidebarPanel, dialogOpen, dialogContent, dialogBlockAlign, dialogType, popoverOpen, popoverContent, popoverAnchorId, deck, toasts } = context;
970
- const { active, activeCompanions, fullscreen, solo, plankSizing } = deck;
971
- const breakpoint = useBreakpoints();
972
- const topbar = layoutAppliesTopbar(breakpoint);
973
- const hoistStatusbar = useHoistStatusbar(breakpoint);
974
- const pluginManager = usePluginManager();
975
- const scrollLeftRef = useRef2();
976
- const deckRef = useRef2(null);
977
- const [delayedPopoverVisibility, setDelayedPopoverVisibility] = useState3(false);
978
- useEffect5(() => {
979
- popoverOpen ? setTimeout(() => setDelayedPopoverVisibility(true), 40) : setDelayedPopoverVisibility(false);
980
- }, [
981
- popoverOpen
982
- ]);
983
- useEffect5(() => {
984
- const attended = untracked(() => {
985
- const attention = pluginManager.context.requestCapability(AttentionCapabilities.Attention);
986
- return attention.current;
987
- });
988
- const firstId = solo ?? active[0];
989
- if (attended.length === 0 && firstId) {
990
- document.querySelector(`article[data-attendable-id="${firstId}"] button`)?.focus();
991
- }
992
- }, []);
993
- const [isNotMobile] = useMediaQuery("md", {
994
- ssr: false
995
- });
996
- const shouldRevert = useRef2(false);
997
- useEffect5(() => {
998
- if (!isNotMobile && getMode(deck) === "deck") {
999
- const attended = untracked(() => {
1000
- const attention = pluginManager.context.requestCapability(AttentionCapabilities.Attention);
1001
- return attention.current;
1002
- });
1003
- shouldRevert.current = true;
1004
- void dispatch(createIntent5(LayoutAction4.SetLayoutMode, {
1005
- part: "mode",
1006
- subject: attended[0],
1007
- options: {
1008
- mode: "solo"
1009
- }
1010
- }));
1011
- } else if (isNotMobile && getMode(deck) === "solo" && shouldRevert.current) {
1012
- void dispatch(createIntent5(LayoutAction4.SetLayoutMode, {
1013
- part: "mode",
1014
- options: {
1015
- revert: true
1016
- }
1017
- }));
1018
- }
1019
- }, [
1020
- isNotMobile,
1021
- deck,
1022
- dispatch
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
- ]);
1039
- const handleResize = useCallback5(() => {
1040
- scrollLeftRef.current = null;
1041
- }, []);
1042
- useEffect5(() => {
1043
- window.addEventListener("resize", handleResize);
1044
- return () => window.removeEventListener("resize", handleResize);
1045
- }, [
1046
- handleResize
1047
- ]);
1048
- const restoreScroll = useCallback5(() => {
1049
- if (deckRef.current && scrollLeftRef.current != null) {
1050
- deckRef.current.scrollLeft = scrollLeftRef.current;
1051
- }
1052
- }, []);
1053
- const layoutMode = getMode(deck);
1054
- useOnTransition(layoutMode, (mode) => mode !== "deck", "deck", restoreScroll);
1055
- const handleScroll = useCallback5((event) => {
1056
- if (!solo && event.currentTarget === event.target) {
1057
- scrollLeftRef.current = event.target.scrollLeft;
1058
- }
1059
- }, [
1060
- solo
1061
- ]);
1062
- const isEmpty = !solo && active.length === 0;
1063
- const padding = useMemo5(() => {
1064
- if (!solo && settings.overscroll === "centering") {
1065
- return calculateOverscroll(active.length);
1066
- }
1067
- return {};
1068
- }, [
1069
- solo,
1070
- settings.overscroll,
1071
- deck
1072
- ]);
1073
- const mainPosition = useMemo5(() => [
1074
- "grid !block-start-[env(safe-area-inset-top)]",
1075
- topbar && "!block-start-[calc(env(safe-area-inset-top)+var(--rail-size))]",
1076
- hoistStatusbar && "lg:block-end-[--statusbar-size]"
1077
- ], [
1078
- topbar,
1079
- hoistStatusbar
1080
- ]);
1081
- const Dialog = dialogType === "alert" ? AlertDialog : NaturalDialog;
1082
- const handlePopoverOpenChange = useCallback5((nextOpen) => {
1083
- if (nextOpen && popoverAnchorId) {
1084
- context.popoverOpen = true;
1085
- } else {
1086
- context.popoverOpen = false;
1087
- context.popoverAnchorId = void 0;
1088
- context.popoverSide = void 0;
1089
- }
1090
- }, [
1091
- context
1092
- ]);
1093
- const handlePopoverClose = useCallback5(() => handlePopoverOpenChange(false), [
1094
- handlePopoverOpenChange
1095
- ]);
1096
- const { order, itemsCount } = useMemo5(() => {
1097
- return active.reduce((acc, entryId) => {
1098
- acc.order[entryId] = acc.itemsCount + 1;
1099
- acc.itemsCount += activeCompanions?.[entryId] ? 3 : 2;
1100
- return acc;
1101
- }, {
1102
- order: {},
1103
- itemsCount: 0
1104
- });
1105
- }, [
1106
- active,
1107
- activeCompanions
1108
- ]);
1109
- return /* @__PURE__ */ React17.createElement(Popover2.Root, {
1110
- modal: true,
1111
- open: !!(popoverAnchorId && delayedPopoverVisibility),
1112
- onOpenChange: handlePopoverOpenChange
1113
- }, /* @__PURE__ */ React17.createElement(ActiveNode, null), fullscreen && /* @__PURE__ */ React17.createElement(Fullscreen, {
1114
- id: solo
1115
- }), !fullscreen && /* @__PURE__ */ React17.createElement(Main3.Root, {
1116
- navigationSidebarState: context.sidebarState,
1117
- onNavigationSidebarStateChange: (next) => context.sidebarState = next,
1118
- complementarySidebarState: context.complementarySidebarState,
1119
- onComplementarySidebarStateChange: (next) => context.complementarySidebarState = next
1120
- }, /* @__PURE__ */ React17.createElement(Sidebar, null), /* @__PURE__ */ React17.createElement(ComplementarySidebar, {
1121
- current: complementarySidebarPanel
1122
- }), /* @__PURE__ */ React17.createElement(Main3.Overlay, null), isEmpty && /* @__PURE__ */ React17.createElement(Main3.Content, {
1123
- bounce: true,
1124
- handlesFocus: true,
1125
- classNames: mainPosition
1126
- }, /* @__PURE__ */ React17.createElement(ContentEmpty, null)), !isEmpty && /* @__PURE__ */ React17.createElement(Main3.Content, {
1127
- bounce: true,
1128
- classNames: mainPosition,
1129
- handlesFocus: true,
1130
- style: {
1131
- "--dx-main-sidebarWidth": sidebarState === "expanded" ? "var(--nav-sidebar-size)" : sidebarState === "collapsed" ? "var(--l0-size)" : "0",
1132
- "--dx-main-complementaryWidth": complementarySidebarState === "expanded" ? "var(--complementary-sidebar-size)" : complementarySidebarState === "collapsed" ? "var(--rail-size)" : "0",
1133
- "--dx-main-contentFirstWidth": `${plankSizing[active[0] ?? "never"] ?? DEFAULT_HORIZONTAL_SIZE}rem`,
1134
- "--dx-main-contentLastWidth": `${plankSizing[active[(active.length ?? 1) - 1] ?? "never"] ?? DEFAULT_HORIZONTAL_SIZE}rem`
1135
- }
1136
- }, /* @__PURE__ */ React17.createElement("div", {
1137
- role: "none",
1138
- className: !solo ? "relative bg-deck overflow-hidden" : "sr-only",
1139
- ...solo && {
1140
- inert: ""
1141
- }
1142
- }, !topbar && /* @__PURE__ */ React17.createElement(ToggleSidebarButton, {
1143
- classNames: fixedSidebarToggleStyles
1144
- }), !topbar && /* @__PURE__ */ React17.createElement(ToggleComplementarySidebarButton, {
1145
- classNames: fixedComplementarySidebarToggleStyles
1146
- }), /* @__PURE__ */ React17.createElement(Stack, {
1147
- ref: deckRef,
1148
- orientation: "horizontal",
1149
- size: "contain",
1150
- classNames: [
1151
- "absolute inset-block-0 -inset-inline-px",
1152
- mainPaddingTransitions
1153
- ],
1154
- itemsCount: itemsCount - 1,
1155
- style: padding,
1156
- onScroll: handleScroll
1157
- }, active.map((entryId) => /* @__PURE__ */ React17.createElement(Fragment4, {
1158
- key: entryId
1159
- }, /* @__PURE__ */ React17.createElement(PlankSeparator, {
1160
- order: order[entryId] - 1
1161
- }), /* @__PURE__ */ React17.createElement(Plank, {
1162
- id: entryId,
1163
- companionId: activeCompanions?.[entryId],
1164
- part: "deck",
1165
- order: order[entryId],
1166
- active,
1167
- layoutMode,
1168
- settings
1169
- }))))), /* @__PURE__ */ React17.createElement("div", {
1170
- role: "none",
1171
- className: solo ? "relative bg-deck overflow-hidden" : "sr-only",
1172
- ...!solo && {
1173
- inert: ""
1174
- }
1175
- }, !topbar && /* @__PURE__ */ React17.createElement(ToggleSidebarButton, {
1176
- classNames: fixedSidebarToggleStyles
1177
- }), !topbar && /* @__PURE__ */ React17.createElement(ToggleComplementarySidebarButton, {
1178
- classNames: fixedComplementarySidebarToggleStyles
1179
- }), /* @__PURE__ */ React17.createElement(StackContext.Provider, {
1180
- value: {
1181
- size: "contain",
1182
- orientation: "horizontal",
1183
- rail: true
1184
- }
1185
- }, /* @__PURE__ */ React17.createElement(Plank, {
1186
- id: solo,
1187
- companionId: solo ? activeCompanions?.[solo] : void 0,
1188
- part: "solo",
1189
- layoutMode,
1190
- settings
1191
- })))), topbar && /* @__PURE__ */ React17.createElement(Topbar, null), hoistStatusbar && /* @__PURE__ */ React17.createElement(StatusBar, {
1192
- showHints: settings.showHints
1193
- })), /* @__PURE__ */ React17.createElement(Popover2.Portal, null, /* @__PURE__ */ React17.createElement(Popover2.Content, {
1194
- side: context.popoverSide,
1195
- onEscapeKeyDown: handlePopoverClose
1196
- }, /* @__PURE__ */ React17.createElement(Popover2.Viewport, null, /* @__PURE__ */ React17.createElement(Surface10, {
1197
- role: "popover",
1198
- data: popoverContent,
1199
- limit: 1
1200
- })), /* @__PURE__ */ React17.createElement(Popover2.Arrow, null))), /* @__PURE__ */ React17.createElement(Dialog.Root, {
1201
- modal: dialogBlockAlign !== "end",
1202
- open: dialogOpen,
1203
- onOpenChange: (nextOpen) => context.dialogOpen = nextOpen
1204
- }, dialogBlockAlign === "end" ? (
1205
- // TODO(burdon): Placeholder creates a suspense boundary; replace with defaults.
1206
- /* @__PURE__ */ React17.createElement(Surface10, {
1207
- role: "dialog",
1208
- data: dialogContent,
1209
- limit: 1,
1210
- fallback: PlankContentError,
1211
- placeholder: /* @__PURE__ */ React17.createElement("div", null)
1212
- })
1213
- ) : /* @__PURE__ */ React17.createElement(Dialog.Overlay, {
1214
- blockAlign: dialogBlockAlign
1215
- }, /* @__PURE__ */ React17.createElement(Surface10, {
1216
- role: "dialog",
1217
- data: dialogContent,
1218
- limit: 1,
1219
- fallback: PlankContentError
1220
- }))), toasts?.map((toast) => /* @__PURE__ */ React17.createElement(Toast, {
1221
- ...toast,
1222
- key: toast.id,
1223
- onOpenChange: (open) => {
1224
- if (!open) {
1225
- onDismissToast(toast.id);
1226
- }
1227
- return open;
1228
- }
1229
- })));
1230
- };
1231
-
1232
- // packages/plugins/plugin-deck/src/components/DeckSettings/DeckSettings.tsx
1233
- import React18 from "react";
1234
- import { Input, Select, useTranslation as useTranslation9 } from "@dxos/react-ui";
1235
- import { DeprecatedFormContainer, DeprecatedFormInput } from "@dxos/react-ui-form";
1236
- var isSocket = !!globalThis.__args;
1237
- var DeckSettings = ({ settings }) => {
1238
- const { t } = useTranslation9(DECK_PLUGIN);
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, {
1245
- label: t("select new plank positioning label")
1246
- }, /* @__PURE__ */ React18.createElement(Select.Root, {
1247
- disabled: !settings.enableDeck,
1248
- value: settings.newPlankPositioning ?? "start",
1249
- onValueChange: (value) => settings.newPlankPositioning = value
1250
- }, /* @__PURE__ */ React18.createElement(Select.TriggerButton, {
1251
- placeholder: t("select new plank positioning placeholder")
1252
- }), /* @__PURE__ */ React18.createElement(Select.Portal, null, /* @__PURE__ */ React18.createElement(Select.Content, null, /* @__PURE__ */ React18.createElement(Select.Viewport, null, NewPlankPositions.map((position) => /* @__PURE__ */ React18.createElement(Select.Option, {
1253
- key: position,
1254
- value: position
1255
- }, t(`settings new plank position ${position} label`)))))))), /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1256
- label: t("settings overscroll label")
1257
- }, /* @__PURE__ */ React18.createElement(Select.Root, {
1258
- disabled: !settings.enableDeck,
1259
- value: settings.overscroll ?? "none",
1260
- onValueChange: (value) => settings.overscroll = value
1261
- }, /* @__PURE__ */ React18.createElement(Select.TriggerButton, {
1262
- placeholder: t("select overscroll placeholder")
1263
- }), /* @__PURE__ */ React18.createElement(Select.Portal, null, /* @__PURE__ */ React18.createElement(Select.Content, null, /* @__PURE__ */ React18.createElement(Select.Viewport, null, OverscrollOptions.map((option) => /* @__PURE__ */ React18.createElement(Select.Option, {
1264
- key: option,
1265
- value: option
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, {
1272
- label: t("settings show hints label")
1273
- }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1274
- checked: settings.showHints,
1275
- onCheckedChange: (checked) => settings.showHints = checked
1276
- })), !isSocket && /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
1277
- label: t("settings native redirect label")
1278
- }, /* @__PURE__ */ React18.createElement(Input.Switch, {
1279
- checked: settings.enableNativeRedirect,
1280
- onCheckedChange: (checked) => settings.enableNativeRedirect = checked
1281
- })));
1282
- };
1283
-
1284
- export {
1285
- Banner,
1286
- DeckLayout,
1287
- DeckSettings
1288
- };
1289
- //# sourceMappingURL=chunk-FJBMNSUC.mjs.map