@dxos/plugin-deck 0.6.12-staging.e11e696 → 0.6.12

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.
@@ -4,10 +4,11 @@ import {
4
4
  } from "./chunk-YVHGFQQR.mjs";
5
5
 
6
6
  // packages/plugins/plugin-deck/src/DeckPlugin.tsx
7
+ import { ArrowsOut } from "@phosphor-icons/react";
7
8
  import { batch, effect } from "@preact/signals-core";
8
9
  import { setAutoFreeze } from "immer";
9
10
  import React15 from "react";
10
- import { IntentAction, LayoutAction as LayoutAction3, NavigationAction as NavigationAction3, parseGraphPlugin, parseIntentPlugin, resolvePlugin, Toast as ToastSchema, SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR4, isLayoutParts, isLayoutAdjustment, isLayoutMode, openIds as openIds2 } from "@dxos/app-framework";
11
+ import { IntentAction, LayoutAction as LayoutAction3, NavigationAction as NavigationAction3, parseGraphPlugin, parseIntentPlugin, resolvePlugin, Toast as ToastSchema, SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR5, isLayoutParts, isLayoutAdjustment, isLayoutMode, openIds as openIds2 } from "@dxos/app-framework";
11
12
  import { create, getTypename, isReactiveObject } from "@dxos/echo-schema";
12
13
  import { LocalStorageStore } from "@dxos/local-storage";
13
14
  import { log } from "@dxos/log";
@@ -17,6 +18,7 @@ import { createExtension } from "@dxos/plugin-graph";
17
18
  import { ObservabilityAction } from "@dxos/plugin-observability/meta";
18
19
  import { fullyQualifiedId } from "@dxos/react-client/echo";
19
20
  import { translations as deckTranslations } from "@dxos/react-ui-deck";
21
+ import { Mosaic } from "@dxos/react-ui-mosaic";
20
22
 
21
23
  // packages/plugins/plugin-deck/src/components/DeckLayout/constants.ts
22
24
  var NAV_ID = "NavTree";
@@ -24,10 +26,9 @@ var SURFACE_PREFIX = "surface:";
24
26
 
25
27
  // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
26
28
  import { Sidebar as MenuIcon } from "@phosphor-icons/react";
27
- import React13, { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef2 } from "react";
28
- import { Surface as Surface9, firstIdInPart, usePlugin } from "@dxos/app-framework";
29
- import { Button as Button3, Dialog, Main as Main3, Popover as Popover2, useOnTransition, useTranslation as useTranslation5 } from "@dxos/react-ui";
30
- import { useAttended as useAttended3 } from "@dxos/react-ui-attention";
29
+ import React13, { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef2, useState as useState3, useLayoutEffect as useLayoutEffect2 } from "react";
30
+ import { SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR3, Surface as Surface9, firstIdInPart, usePlugin } from "@dxos/app-framework";
31
+ import { Button as Button3, Dialog, Main as Main3, Popover as Popover2, useTranslation as useTranslation5 } from "@dxos/react-ui";
31
32
  import { Deck } from "@dxos/react-ui-deck";
32
33
  import { getSize } from "@dxos/react-ui-theme";
33
34
 
@@ -39,11 +40,8 @@ import { useGraph } from "@dxos/plugin-graph";
39
40
  // packages/plugins/plugin-deck/src/hooks/useNode.ts
40
41
  import { useEffect, useState } from "react";
41
42
  var useNode = (graph, id, timeout) => {
42
- const [nodeState, setNodeState] = useState(id ? graph.findNode(id, false) : void 0);
43
+ const [nodeState, setNodeState] = useState(id ? graph.findNode(id) : void 0);
43
44
  useEffect(() => {
44
- if (!id && nodeState) {
45
- setNodeState(void 0);
46
- }
47
45
  if (nodeState?.id === id || !id) {
48
46
  return;
49
47
  }
@@ -119,21 +117,32 @@ import React5 from "react";
119
117
  import { SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR2, Surface as Surface3 } from "@dxos/app-framework";
120
118
  import { useGraph as useGraph3 } from "@dxos/plugin-graph";
121
119
  import { Main } from "@dxos/react-ui";
122
- import { useAttended } from "@dxos/react-ui-attention";
120
+ import { createAttendableAttributes } from "@dxos/react-ui-attention";
123
121
  import { deckGrid } from "@dxos/react-ui-deck";
124
122
  import { mx as mx2 } from "@dxos/react-ui-theme";
125
123
 
126
124
  // packages/plugins/plugin-deck/src/components/DeckLayout/NodePlankHeading.tsx
125
+ import { Placeholder } from "@phosphor-icons/react";
127
126
  import React2, { Fragment, useEffect as useEffect3 } from "react";
128
- import { LayoutAction, NavigationAction, SLUG_PATH_SEPARATOR, Surface as Surface2, useIntentDispatcher, indexInPart, partLength } from "@dxos/app-framework";
127
+ import { LayoutAction, NavigationAction, SLUG_COLLECTION_INDICATOR, SLUG_PATH_SEPARATOR, Surface as Surface2, useIntentDispatcher, indexInPart, partLength } from "@dxos/app-framework";
129
128
  import { useGraph as useGraph2 } from "@dxos/plugin-graph";
130
- import { Icon, Popover, toLocalizedString, useMediaQuery, useTranslation } from "@dxos/react-ui";
131
- import { PlankHeading } from "@dxos/react-ui-deck";
129
+ import { Popover, toLocalizedString, useMediaQuery, useTranslation } from "@dxos/react-ui";
130
+ import { PlankHeading, plankHeadingIconProps } from "@dxos/react-ui-deck";
132
131
  import { TextTooltip } from "@dxos/react-ui-text-tooltip";
133
- var NodePlankHeading = ({ node, id, layoutParts, layoutPart, popoverAnchorId, pending, flatDeck }) => {
132
+ var NodePlankHeading = ({
133
+ node,
134
+ id,
135
+ layoutParts,
136
+ layoutPart,
137
+ // TODO(wittjosiah): Unused?
138
+ layoutEntry,
139
+ popoverAnchorId,
140
+ pending,
141
+ flatDeck
142
+ }) => {
134
143
  const { t } = useTranslation(DECK_PLUGIN);
135
144
  const { graph } = useGraph2();
136
- const icon = node?.properties?.icon ?? "ph--placeholder--regular";
145
+ const Icon = node?.properties?.icon ?? Placeholder;
137
146
  const label = pending ? t("pending heading") : toLocalizedString(node?.properties?.label ?? [
138
147
  "plank heading fallback label",
139
148
  {
@@ -163,8 +172,7 @@ var NodePlankHeading = ({ node, id, layoutParts, layoutPart, popoverAnchorId, pe
163
172
  return /* @__PURE__ */ React2.createElement(PlankHeading.Root, (layoutPart !== "main" || !flatDeck) && {
164
173
  classNames: "pie-1 border-b border-separator"
165
174
  }, /* @__PURE__ */ React2.createElement(ActionRoot, null, node ? /* @__PURE__ */ React2.createElement(PlankHeading.ActionsMenu, {
166
- icon,
167
- related: layoutPart === "complementary",
175
+ Icon,
168
176
  attendableId,
169
177
  triggerLabel: t("actions menu label"),
170
178
  actions: graph.actions(node),
@@ -179,15 +187,11 @@ var NodePlankHeading = ({ node, id, layoutParts, layoutPart, popoverAnchorId, pe
179
187
  }
180
188
  })) : /* @__PURE__ */ React2.createElement(PlankHeading.Button, null, /* @__PURE__ */ React2.createElement("span", {
181
189
  className: "sr-only"
182
- }, label), /* @__PURE__ */ React2.createElement(Icon, {
183
- icon,
184
- size: 5
185
- }))), /* @__PURE__ */ React2.createElement(TextTooltip, {
190
+ }, label), /* @__PURE__ */ React2.createElement(Icon, plankHeadingIconProps))), /* @__PURE__ */ React2.createElement(TextTooltip, {
186
191
  text: label,
187
192
  onlyWhenTruncating: true
188
193
  }, /* @__PURE__ */ React2.createElement(PlankHeading.Label, {
189
- attendableId,
190
- related: layoutPart === "complementary",
194
+ attendableId: node?.id,
191
195
  ...pending && {
192
196
  classNames: "text-description"
193
197
  }
@@ -233,6 +237,9 @@ var NodePlankHeading = ({ node, id, layoutParts, layoutPart, popoverAnchorId, pe
233
237
  action: NavigationAction.CLOSE,
234
238
  data: {
235
239
  activeParts: {
240
+ complementary: [
241
+ `${id}${SLUG_PATH_SEPARATOR}comments${SLUG_COLLECTION_INDICATOR}`
242
+ ],
236
243
  [layoutPart]: [
237
244
  id
238
245
  ]
@@ -246,7 +253,7 @@ var NodePlankHeading = ({ node, id, layoutParts, layoutPart, popoverAnchorId, pe
246
253
  }
247
254
  });
248
255
  },
249
- close: layoutPart === "complementary" ? "minify-end" : true
256
+ close: layoutCoordinate?.part === "complementary" ? "minify-end" : true
250
257
  }));
251
258
  };
252
259
 
@@ -307,14 +314,13 @@ var LayoutContext = createContext(null);
307
314
  var useLayout = () => useContext(LayoutContext) ?? raise(new Error("Missing LayoutContext"));
308
315
 
309
316
  // packages/plugins/plugin-deck/src/components/DeckLayout/ComplementarySidebar.tsx
310
- var ComplementarySidebar = ({ context, layoutParts, flatDeck }) => {
317
+ var ComplementarySidebar = ({ id, layoutParts, flatDeck }) => {
311
318
  const { popoverAnchorId } = useLayout();
312
- const attended = useAttended();
313
- const id = attended[0] ? `${attended[0]}${SLUG_PATH_SEPARATOR2}${context}` : void 0;
314
319
  const { graph } = useGraph3();
315
320
  const node = useNode(graph, id);
321
+ const complementaryAttrs = createAttendableAttributes(id?.split(SLUG_PATH_SEPARATOR2)[0] ?? "never");
316
322
  useNodeActionExpander(node);
317
- return /* @__PURE__ */ React5.createElement(Main.ComplementarySidebar, null, /* @__PURE__ */ React5.createElement("div", {
323
+ return /* @__PURE__ */ React5.createElement(Main.ComplementarySidebar, complementaryAttrs, node ? /* @__PURE__ */ React5.createElement("div", {
318
324
  role: "none",
319
325
  className: mx2(deckGrid, "grid-cols-1 bs-full")
320
326
  }, /* @__PURE__ */ React5.createElement(NodePlankHeading, {
@@ -324,17 +330,17 @@ var ComplementarySidebar = ({ context, layoutParts, flatDeck }) => {
324
330
  layoutPart: "complementary",
325
331
  popoverAnchorId,
326
332
  flatDeck
327
- }), node && /* @__PURE__ */ React5.createElement(Surface3, {
333
+ }), /* @__PURE__ */ React5.createElement(Surface3, {
328
334
  role: "article",
329
335
  data: {
330
- subject: node.properties.object,
336
+ subject: node.data,
331
337
  part: "complementary",
332
338
  popoverAnchorId
333
339
  },
334
340
  limit: 1,
335
341
  fallback: PlankContentError,
336
342
  placeholder: /* @__PURE__ */ React5.createElement(PlankLoading, null)
337
- })));
343
+ })) : null);
338
344
  };
339
345
 
340
346
  // packages/plugins/plugin-deck/src/components/DeckLayout/ContentEmpty.tsx
@@ -399,7 +405,7 @@ import { LayoutAction as LayoutAction2, NavigationAction as NavigationAction2, S
399
405
  import { debounce } from "@dxos/async";
400
406
  import { useGraph as useGraph5 } from "@dxos/plugin-graph";
401
407
  import { Button, Tooltip, useTranslation as useTranslation4 } from "@dxos/react-ui";
402
- import { useAttendableAttributes } from "@dxos/react-ui-attention";
408
+ import { createAttendableAttributes as createAttendableAttributes2 } from "@dxos/react-ui-attention";
403
409
  import { Plank as NaturalPlank } from "@dxos/react-ui-deck";
404
410
  import { mainIntrinsicSize } from "@dxos/react-ui-theme";
405
411
 
@@ -419,7 +425,7 @@ var Plank = ({ entry, layoutParts, part, flatDeck, searchEnabled, layoutMode })
419
425
  const node = useNode(graph, entry.id);
420
426
  const rootElement = useRef(null);
421
427
  const resizeable = layoutMode === "deck";
422
- const attendableAttrs = useAttendableAttributes(entry.id);
428
+ const attendableAttrs = createAttendableAttributes2(entry.id);
423
429
  const coordinate = {
424
430
  part,
425
431
  entryId: entry.id
@@ -546,10 +552,8 @@ var Plank = ({ entry, layoutParts, part, flatDeck, searchEnabled, layoutMode })
546
552
  import React10, { useMemo } from "react";
547
553
  import { openIds, Surface as Surface7 } from "@dxos/app-framework";
548
554
  import { Main as Main2 } from "@dxos/react-ui";
549
- import { useAttended as useAttended2 } from "@dxos/react-ui-attention";
550
- var Sidebar = ({ layoutParts }) => {
555
+ var Sidebar = ({ attention, layoutParts }) => {
551
556
  const { layoutMode, popoverAnchorId } = useLayout();
552
- const attended = useAttended2();
553
557
  const activeIds = useMemo(() => {
554
558
  if (layoutMode === "solo") {
555
559
  return new Set(layoutParts?.solo?.map((e) => e.id) ?? []);
@@ -564,11 +568,11 @@ var Sidebar = ({ layoutParts }) => {
564
568
  const navigationData = useMemo(() => ({
565
569
  popoverAnchorId,
566
570
  activeIds,
567
- attended
571
+ attended: attention.attended
568
572
  }), [
569
573
  popoverAnchorId,
570
574
  activeIds,
571
- attended
575
+ attention.attended
572
576
  ]);
573
577
  return /* @__PURE__ */ React10.createElement(Main2.NavigationSidebar, null, /* @__PURE__ */ React10.createElement(Surface7, {
574
578
  role: "navigation",
@@ -668,26 +672,20 @@ var calculateOverscroll = (planks, plankSizing, sidebarOpen, complementarySideba
668
672
  };
669
673
 
670
674
  // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
671
- var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter, slots, onDismissToast }) => {
675
+ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHintsFooter, slots, onDismissToast }) => {
672
676
  const context = useLayout();
673
677
  const { layoutMode, sidebarOpen, complementarySidebarOpen, dialogOpen, dialogContent, dialogBlockAlign, popoverOpen, popoverContent, popoverAnchorId } = context;
674
678
  const { t } = useTranslation5(DECK_PLUGIN);
675
679
  const { plankSizing } = useDeckContext();
676
- const attended = useAttended3();
677
680
  const searchPlugin = usePlugin("dxos.org/plugin/search");
678
681
  const fullScreenSlug = useMemo2(() => firstIdInPart(layoutParts, "fullScreen"), [
679
682
  layoutParts
680
683
  ]);
681
- const scrollLeftRef = useRef2();
684
+ const [scrollLeft, setScrollLeft] = useState3(null);
682
685
  const deckRef = useRef2(null);
683
- useEffect5(() => {
684
- const firstId = layoutMode === "solo" ? firstIdInPart(layoutParts, "solo") : firstIdInPart(layoutParts, "main");
685
- if (attended.length === 0 && firstId) {
686
- document.querySelector(`article[data-attendable-id="${firstId}"] button`)?.focus();
687
- }
688
- }, []);
686
+ const restoreScrollRef = useRef2(false);
689
687
  const handleResize = useCallback2(() => {
690
- scrollLeftRef.current = null;
688
+ setScrollLeft(null);
691
689
  }, []);
692
690
  useEffect5(() => {
693
691
  window.addEventListener("resize", handleResize);
@@ -695,20 +693,36 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter,
695
693
  }, [
696
694
  handleResize
697
695
  ]);
698
- const restoreScroll = useCallback2(() => {
699
- if (deckRef.current && scrollLeftRef.current != null) {
700
- deckRef.current.scrollLeft = scrollLeftRef.current;
696
+ useLayoutEffect2(() => {
697
+ if (layoutMode !== "deck") {
698
+ restoreScrollRef.current = true;
699
+ } else if (restoreScrollRef.current && deckRef.current && scrollLeft) {
700
+ deckRef.current.scrollLeft = scrollLeft;
701
+ restoreScrollRef.current = false;
701
702
  }
702
- }, []);
703
- useOnTransition(layoutMode, (mode) => mode !== "deck", "deck", restoreScroll);
703
+ }, [
704
+ layoutMode,
705
+ deckRef.current,
706
+ scrollLeft
707
+ ]);
704
708
  const handleScroll = useCallback2((event) => {
705
709
  if (layoutMode === "deck" && event.currentTarget === event.target) {
706
- scrollLeftRef.current = event.target.scrollLeft;
710
+ setScrollLeft(event.target.scrollLeft);
707
711
  }
708
712
  }, [
709
713
  layoutMode
710
714
  ]);
711
- const firstAttendedId = attended[0];
715
+ const complementarySlug = useMemo2(() => {
716
+ const entry = layoutParts.complementary?.at(0);
717
+ if (entry) {
718
+ return entry.path ? `${entry.id}${SLUG_PATH_SEPARATOR3}${entry.path}` : entry.id;
719
+ }
720
+ }, [
721
+ layoutParts
722
+ ]);
723
+ const firstAttendedId = useMemo2(() => Array.from(attention.attended ?? [])[0], [
724
+ attention.attended
725
+ ]);
712
726
  useEffect5(() => {
713
727
  if (layoutMode === "deck" && firstAttendedId) {
714
728
  }
@@ -730,19 +744,7 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter,
730
744
  layoutParts.main,
731
745
  layoutParts.solo
732
746
  ]);
733
- const padding = useMemo2(() => {
734
- if (layoutMode === "deck" && overscroll === "centering") {
735
- return calculateOverscroll(layoutParts.main, plankSizing, sidebarOpen, complementarySidebarOpen);
736
- }
737
- return {};
738
- }, [
739
- layoutMode,
740
- overscroll,
741
- layoutParts.main,
742
- plankSizing,
743
- sidebarOpen,
744
- complementarySidebarOpen
745
- ]);
747
+ const padding = layoutMode === "deck" && overscroll === "centering" ? calculateOverscroll(layoutParts.main, plankSizing, sidebarOpen, complementarySidebarOpen) : {};
746
748
  if (layoutMode === "fullscreen") {
747
749
  return /* @__PURE__ */ React13.createElement(Fullscreen, {
748
750
  id: fullScreenSlug
@@ -764,13 +766,19 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter,
764
766
  }), /* @__PURE__ */ React13.createElement(Main3.Root, {
765
767
  navigationSidebarOpen: context.sidebarOpen,
766
768
  onNavigationSidebarOpenChange: (next) => context.sidebarOpen = next,
767
- complementarySidebarOpen: context.complementarySidebarOpen,
768
- onComplementarySidebarOpenChange: (next) => context.complementarySidebarOpen = next
769
+ ...complementarySidebarOpen !== null && {
770
+ complementarySidebarOpen: (
771
+ /* complementaryAvailable && */
772
+ context.complementarySidebarOpen
773
+ ),
774
+ onComplementarySidebarOpenChange: (next) => context.complementarySidebarOpen = next
775
+ }
769
776
  }, /* @__PURE__ */ React13.createElement(Main3.Notch, {
770
777
  classNames: "z-[21]"
771
778
  }, /* @__PURE__ */ React13.createElement(Surface9, {
772
779
  role: "notch-start"
773
780
  }), /* @__PURE__ */ React13.createElement(Button3, {
781
+ // disabled={!sidebarAvailable}
774
782
  onClick: () => context.sidebarOpen = !context.sidebarOpen,
775
783
  variant: "ghost",
776
784
  classNames: "p-1"
@@ -780,6 +788,7 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter,
780
788
  weight: "light",
781
789
  className: getSize(5)
782
790
  })), /* @__PURE__ */ React13.createElement(Button3, {
791
+ // disabled={!complementaryAvailable}
783
792
  onClick: () => context.complementarySidebarOpen = !context.complementarySidebarOpen,
784
793
  variant: "ghost",
785
794
  classNames: "p-1"
@@ -792,9 +801,10 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter,
792
801
  })), /* @__PURE__ */ React13.createElement(Surface9, {
793
802
  role: "notch-end"
794
803
  })), /* @__PURE__ */ React13.createElement(Sidebar, {
804
+ attention,
795
805
  layoutParts
796
806
  }), /* @__PURE__ */ React13.createElement(ComplementarySidebar, {
797
- context: "comments",
807
+ id: complementarySlug,
798
808
  layoutParts,
799
809
  flatDeck
800
810
  }), /* @__PURE__ */ React13.createElement(Main3.Overlay, null), parts.length === 0 && /* @__PURE__ */ React13.createElement(Main3.Content, {
@@ -922,7 +932,7 @@ var LayoutSettings = ({ settings }) => {
922
932
 
923
933
  // packages/plugins/plugin-deck/src/layout.ts
924
934
  import { produce } from "immer";
925
- import { SLUG_ENTRY_SEPARATOR, SLUG_KEY_VALUE_SEPARATOR, SLUG_LIST_SEPARATOR, SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR3 } from "@dxos/app-framework";
935
+ import { SLUG_ENTRY_SEPARATOR, SLUG_KEY_VALUE_SEPARATOR, SLUG_LIST_SEPARATOR, SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR4 } from "@dxos/app-framework";
926
936
  var partsThatSupportIncrement = [
927
937
  "main"
928
938
  ];
@@ -1035,7 +1045,7 @@ var mergeLayoutParts = (...layoutParts) => {
1035
1045
  }), {});
1036
1046
  };
1037
1047
  var parseLayoutEntry = (itemString) => {
1038
- const [id, path] = itemString.split(SLUG_PATH_SEPARATOR3);
1048
+ const [id, path] = itemString.split(SLUG_PATH_SEPARATOR4);
1039
1049
  const entry = {
1040
1050
  id
1041
1051
  };
@@ -1062,7 +1072,7 @@ var soloPartToUri = (layout) => {
1062
1072
  return "";
1063
1073
  }
1064
1074
  const entry = soloPart[0];
1065
- return `${entry.id}${entry.path ? SLUG_PATH_SEPARATOR3 + entry.path : ""}`;
1075
+ return `${entry.id}${entry.path ? SLUG_PATH_SEPARATOR4 + entry.path : ""}`;
1066
1076
  };
1067
1077
 
1068
1078
  // packages/plugins/plugin-deck/src/translations.ts
@@ -1217,20 +1227,6 @@ var DeckPlugin = ({ observability } = {}) => {
1217
1227
  }
1218
1228
  }
1219
1229
  };
1220
- const handleSetLocation = (next) => {
1221
- if (attentionPlugin) {
1222
- const attended = attentionPlugin.provides.attention.attended;
1223
- const [attendedId] = Array.from(attended);
1224
- const ids = (layout.values.layoutMode === "deck" ? next.main : next.solo)?.map(({ id }) => id) ?? [];
1225
- const isAttendedAvailable = !!attendedId && ids.includes(attendedId);
1226
- if (!isAttendedAvailable) {
1227
- const nextAttended = next.main?.[0]?.id;
1228
- const article = document.querySelector(`article[data-attendable-id="${nextAttended}"]`);
1229
- article?.focus();
1230
- }
1231
- }
1232
- location.values.active = next;
1233
- };
1234
1230
  return {
1235
1231
  meta: meta_default,
1236
1232
  ready: async (plugins) => {
@@ -1305,13 +1301,13 @@ var DeckPlugin = ({ observability } = {}) => {
1305
1301
  handleNavigation = async () => {
1306
1302
  const pathname = window.location.pathname;
1307
1303
  if (pathname === "/reset") {
1308
- handleSetLocation({
1304
+ location.values.active = {
1309
1305
  sidebar: [
1310
1306
  {
1311
1307
  id: NAV_ID
1312
1308
  }
1313
1309
  ]
1314
- });
1310
+ };
1315
1311
  location.values.closed = [];
1316
1312
  layout.values.layoutMode = "solo";
1317
1313
  window.location.pathname = "/";
@@ -1322,7 +1318,7 @@ var DeckPlugin = ({ observability } = {}) => {
1322
1318
  return;
1323
1319
  }
1324
1320
  const startingLayout = removePart(location.values.active, "solo");
1325
- handleSetLocation(mergeLayoutParts(layoutFromUri, startingLayout));
1321
+ location.values.active = mergeLayoutParts(layoutFromUri, startingLayout);
1326
1322
  layout.values.layoutMode = "solo";
1327
1323
  };
1328
1324
  await handleNavigation();
@@ -1384,7 +1380,8 @@ var DeckPlugin = ({ observability } = {}) => {
1384
1380
  ns: DECK_PLUGIN
1385
1381
  }
1386
1382
  ],
1387
- icon: "ph--arrows-out--regular",
1383
+ icon: (props) => /* @__PURE__ */ React15.createElement(ArrowsOut, props),
1384
+ iconSymbol: "ph--arrows-out--regular",
1388
1385
  keyBinding: {
1389
1386
  macos: "ctrl+meta+f",
1390
1387
  windows: "shift+ctrl+f"
@@ -1401,7 +1398,10 @@ var DeckPlugin = ({ observability } = {}) => {
1401
1398
  value: deck.values
1402
1399
  }, props.children)),
1403
1400
  root: () => {
1404
- return /* @__PURE__ */ React15.createElement(DeckLayout, {
1401
+ return /* @__PURE__ */ React15.createElement(Mosaic.Root, null, /* @__PURE__ */ React15.createElement(DeckLayout, {
1402
+ attention: attentionPlugin?.provides.attention ?? {
1403
+ attended: /* @__PURE__ */ new Set()
1404
+ },
1405
1405
  layoutParts: location.values.active,
1406
1406
  showHintsFooter: settings.values.showFooter,
1407
1407
  overscroll: settings.values.overscroll,
@@ -1419,7 +1419,7 @@ var DeckPlugin = ({ observability } = {}) => {
1419
1419
  }, 1e3);
1420
1420
  }
1421
1421
  }
1422
- });
1422
+ }), /* @__PURE__ */ React15.createElement(Mosaic.DragOverlay, null));
1423
1423
  },
1424
1424
  surface: {
1425
1425
  component: ({ data, role }) => {
@@ -1455,7 +1455,7 @@ var DeckPlugin = ({ observability } = {}) => {
1455
1455
  } else {
1456
1456
  log.warn("Invalid layout mode", intent?.data?.layoutMode, {
1457
1457
  F: __dxlog_file,
1458
- L: 410,
1458
+ L: 390,
1459
1459
  S: void 0,
1460
1460
  C: (f, a) => f(...a)
1461
1461
  });
@@ -1510,7 +1510,7 @@ var DeckPlugin = ({ observability } = {}) => {
1510
1510
  }
1511
1511
  const processLayoutEntry = (partName, entryString, currentLayout) => {
1512
1512
  const toggle = true;
1513
- const [id, path] = entryString.split(SLUG_PATH_SEPARATOR4);
1513
+ const [id, path] = entryString.split(SLUG_PATH_SEPARATOR5);
1514
1514
  const layoutEntry = {
1515
1515
  id,
1516
1516
  ...path ? {
@@ -1539,7 +1539,7 @@ var DeckPlugin = ({ observability } = {}) => {
1539
1539
  newLayout = processLayoutEntry(partName, layoutEntries, newLayout);
1540
1540
  }
1541
1541
  });
1542
- handleSetLocation(newLayout);
1542
+ location.values.active = newLayout;
1543
1543
  });
1544
1544
  const ids = openIds2(location.values.active);
1545
1545
  const newlyOpen = ids.filter((i) => !previouslyOpenIds.has(i));
@@ -1587,10 +1587,10 @@ var DeckPlugin = ({ observability } = {}) => {
1587
1587
  id: data.id
1588
1588
  };
1589
1589
  const effectivePart = getEffectivePart(data.part, layout.values.layoutMode);
1590
- handleSetLocation(openEntry(location.values.active, effectivePart, layoutEntry, {
1590
+ location.values.active = openEntry(location.values.active, effectivePart, layoutEntry, {
1591
1591
  positioning: data.positioning ?? settings.values.newPlankPositioning,
1592
1592
  pivotId: data.pivotId
1593
- }));
1593
+ });
1594
1594
  const intents = [];
1595
1595
  if (data.scrollIntoView && layout.values.layoutMode === "deck") {
1596
1596
  intents.push([
@@ -1632,7 +1632,7 @@ var DeckPlugin = ({ observability } = {}) => {
1632
1632
  });
1633
1633
  }
1634
1634
  });
1635
- handleSetLocation(newLayout);
1635
+ location.values.active = newLayout;
1636
1636
  return {
1637
1637
  data: true
1638
1638
  };
@@ -1642,7 +1642,7 @@ var DeckPlugin = ({ observability } = {}) => {
1642
1642
  case NavigationAction3.SET: {
1643
1643
  return batch(() => {
1644
1644
  if (isLayoutParts(intent.data?.activeParts)) {
1645
- handleSetLocation(intent.data.activeParts);
1645
+ location.values.active = intent.data.activeParts;
1646
1646
  }
1647
1647
  return {
1648
1648
  data: true
@@ -1654,10 +1654,10 @@ var DeckPlugin = ({ observability } = {}) => {
1654
1654
  if (isLayoutAdjustment(intent.data)) {
1655
1655
  const adjustment = intent.data;
1656
1656
  if (adjustment.type === "increment-end" || adjustment.type === "increment-start") {
1657
- handleSetLocation(incrementPlank(location.values.active, {
1657
+ location.values.active = incrementPlank(location.values.active, {
1658
1658
  type: adjustment.type,
1659
1659
  layoutCoordinate: adjustment.layoutCoordinate
1660
- }));
1660
+ });
1661
1661
  }
1662
1662
  if (adjustment.type === "solo") {
1663
1663
  const entryId = adjustment.layoutCoordinate.entryId;