@dxos/plugin-deck 0.6.9-staging.8e43e2a → 0.6.10-main.bbdfaa4

package/dist/lib/browser/index.mjs

@@ -7,7 +7,7 @@ import {
 import { ArrowsOut } from "@phosphor-icons/react";
 import { batch, effect } from "@preact/signals-core";
 import { setAutoFreeze } from "immer";
-import React14 from "react";
+import React15 from "react";
 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";
 import { create, getTypename, isReactiveObject } from "@dxos/echo-schema";
 import { LocalStorageStore } from "@dxos/local-storage";
@@ -26,8 +26,8 @@ var SURFACE_PREFIX = "surface:";
 
 // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
 import { Sidebar as MenuIcon } from "@phosphor-icons/react";
-import React12, { useEffect as useEffect5, useMemo as useMemo2, useRef as useRef2 } from "react";
-import { SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR3, Surface as Surface8, firstIdInPart, usePlugin } from "@dxos/app-framework";
+import React13, { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef2, useState as useState3, useLayoutEffect as useLayoutEffect2 } from "react";
+import { SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR3, Surface as Surface9, firstIdInPart, usePlugin } from "@dxos/app-framework";
 import { Button as Button3, Dialog, Main as Main3, Popover as Popover2, useTranslation as useTranslation5 } from "@dxos/react-ui";
 import { Deck } from "@dxos/react-ui-deck";
 import { getSize } from "@dxos/react-ui-theme";
@@ -85,6 +85,16 @@ var useNodeActionExpander = (node) => {
   ]);
 };
 
+// packages/plugins/plugin-deck/src/hooks/useMainSize.ts
+import { useMainContext } from "@dxos/react-ui";
+var useMainSize = () => {
+  const { navigationSidebarOpen, complementarySidebarOpen } = useMainContext("DeckPluginPlank");
+  return {
+    "data-sidebar-inline-start-state": navigationSidebarOpen ? "open" : "closed",
+    "data-sidebar-inline-end-state": complementarySidebarOpen ? "open" : "closed"
+  };
+};
+
 // packages/plugins/plugin-deck/src/components/DeckLayout/ActiveNode.tsx
 var ActiveNode = ({ id }) => {
   const { graph } = useGraph();
@@ -160,7 +170,7 @@ var NodePlankHeading = ({
   const canIncrementStart = layoutPart === "main" && index !== void 0 && index > 0 && length !== void 0 && length > 1;
   const canIncrementEnd = layoutPart === "main" && index !== void 0 && index < length - 1 && length !== void 0;
   return /* @__PURE__ */ React2.createElement(PlankHeading.Root, (layoutPart !== "main" || !flatDeck) && {
-    classNames: "pie-1 border-b separator-separator"
+    classNames: "pie-1 border-b border-separator"
   }, /* @__PURE__ */ React2.createElement(ActionRoot, null, node ? /* @__PURE__ */ React2.createElement(PlankHeading.ActionsMenu, {
     Icon,
     attendableId,
@@ -183,7 +193,7 @@ var NodePlankHeading = ({
   }, /* @__PURE__ */ React2.createElement(PlankHeading.Label, {
     attendableId: node?.id,
     ...pending && {
-      classNames: "fg-description"
+      classNames: "text-description"
     }
   }, label)), node && layoutPart !== "complementary" && // TODO(Zan): What are we doing with layout coordinate here?
   /* @__PURE__ */ React2.createElement(Surface2, {
@@ -397,6 +407,7 @@ import { useGraph as useGraph5 } from "@dxos/plugin-graph";
 import { Button, Tooltip, useTranslation as useTranslation4 } from "@dxos/react-ui";
 import { createAttendableAttributes as createAttendableAttributes2 } from "@dxos/react-ui-attention";
 import { Plank as NaturalPlank } from "@dxos/react-ui-deck";
+import { mainIntrinsicSize } from "@dxos/react-ui-theme";
 
 // packages/plugins/plugin-deck/src/components/DeckContext.ts
 import { createContext as createContext2, useContext as useContext2 } from "react";
@@ -405,7 +416,7 @@ var DeckContext = createContext2(null);
 var useDeckContext = () => useContext2(DeckContext) ?? raise2(new Error("Missing DeckContext"));
 
 // packages/plugins/plugin-deck/src/components/DeckLayout/Plank.tsx
-var Plank = ({ entry, layoutParts, part, resizeable, flatDeck, searchEnabled, classNames }) => {
+var Plank = ({ entry, layoutParts, part, flatDeck, searchEnabled, layoutMode }) => {
   const { t } = useTranslation4(DECK_PLUGIN);
   const dispatch = useIntentDispatcher2();
   const { popoverAnchorId, scrollIntoView } = useLayout();
@@ -413,6 +424,7 @@ var Plank = ({ entry, layoutParts, part, resizeable, flatDeck, searchEnabled, cl
   const { graph } = useGraph5();
   const node = useNode(graph, entry.id);
   const rootElement = useRef(null);
+  const resizeable = layoutMode === "deck";
   const attendableAttrs = createAttendableAttributes2(entry.id);
   const coordinate = {
     part,
@@ -438,25 +450,42 @@ var Plank = ({ entry, layoutParts, part, resizeable, flatDeck, searchEnabled, cl
   }, []);
   useLayoutEffect(() => {
     if (scrollIntoView === entry.id) {
-      rootElement.current?.scrollIntoView({
+      rootElement.current?.focus({
+        preventScroll: true
+      });
+      layoutMode === "deck" && rootElement.current?.scrollIntoView({
         behavior: "smooth",
         inline: "center"
       });
     }
   }, [
-    scrollIntoView
+    scrollIntoView,
+    layoutMode
   ]);
+  const isSolo = layoutMode === "solo" && part === "solo";
+  const isSuppressed = layoutMode === "solo" && part !== "solo";
+  const sizeAttrs = useMainSize();
   return /* @__PURE__ */ React9.createElement(NaturalPlank.Root, {
     size,
     setSize,
-    classNames,
+    classNames: [
+      isSuppressed && "!sr-only"
+    ],
     ...attendableAttrs,
+    ...isSuppressed && {
+      inert: ""
+    },
     onKeyDown: handleKeyDown,
     ref: rootElement
   }, /* @__PURE__ */ React9.createElement(NaturalPlank.Content, {
+    ...isSolo && sizeAttrs,
     classNames: [
-      !flatDeck && "surface-base"
-    ]
+      isSolo && mainIntrinsicSize,
+      !flatDeck && "bg-base"
+    ],
+    style: isSolo ? {
+      inlineSize: ""
+    } : {}
   }, node ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(NodePlankHeading, {
     id: entry.id,
     node,
@@ -554,27 +583,43 @@ var Sidebar = ({ attention, layoutParts }) => {
   }));
 };
 
-// packages/plugins/plugin-deck/src/components/DeckLayout/Toast.tsx
+// packages/plugins/plugin-deck/src/components/DeckLayout/StatusBar.tsx
 import React11 from "react";
+import { Surface as Surface8 } from "@dxos/app-framework";
+import { mainPadding, mx as mx4 } from "@dxos/react-ui-theme";
+var StatusBar = () => {
+  const sizeAttrs = useMainSize();
+  return /* @__PURE__ */ React11.createElement("div", {
+    role: "none",
+    ...sizeAttrs,
+    className: mx4("fixed block-end-0 inset-inline-0 z-[2]", mainPadding)
+  }, /* @__PURE__ */ React11.createElement(Surface8, {
+    role: "status-bar",
+    limit: 1
+  }));
+};
+
+// packages/plugins/plugin-deck/src/components/DeckLayout/Toast.tsx
+import React12 from "react";
 import { Button as Button2, Toast as NaturalToast } from "@dxos/react-ui";
 var Toast = ({ id, title, description, icon, duration, actionLabel, actionAlt, closeLabel, onAction, onOpenChange }) => {
-  return /* @__PURE__ */ React11.createElement(NaturalToast.Root, {
+  return /* @__PURE__ */ React12.createElement(NaturalToast.Root, {
     "data-testid": id,
     defaultOpen: true,
     duration,
     onOpenChange
-  }, /* @__PURE__ */ React11.createElement(NaturalToast.Body, null, /* @__PURE__ */ React11.createElement(NaturalToast.Title, null, icon?.({
+  }, /* @__PURE__ */ React12.createElement(NaturalToast.Body, null, /* @__PURE__ */ React12.createElement(NaturalToast.Title, null, icon?.({
     className: "inline mr-1"
-  }), /* @__PURE__ */ React11.createElement("span", null, title)), description && /* @__PURE__ */ React11.createElement(NaturalToast.Description, null, description)), /* @__PURE__ */ React11.createElement(NaturalToast.Actions, null, onAction && actionAlt && actionLabel && /* @__PURE__ */ React11.createElement(NaturalToast.Action, {
+  }), /* @__PURE__ */ React12.createElement("span", null, title)), description && /* @__PURE__ */ React12.createElement(NaturalToast.Description, null, description)), /* @__PURE__ */ React12.createElement(NaturalToast.Actions, null, onAction && actionAlt && actionLabel && /* @__PURE__ */ React12.createElement(NaturalToast.Action, {
     altText: actionAlt,
     asChild: true
-  }, /* @__PURE__ */ React11.createElement(Button2, {
+  }, /* @__PURE__ */ React12.createElement(Button2, {
     "data-testid": "toast.action",
     variant: "primary",
     onClick: () => onAction?.()
-  }, actionLabel)), closeLabel && /* @__PURE__ */ React11.createElement(NaturalToast.Close, {
+  }, actionLabel)), closeLabel && /* @__PURE__ */ React12.createElement(NaturalToast.Close, {
     asChild: true
-  }, /* @__PURE__ */ React11.createElement(Button2, {
+  }, /* @__PURE__ */ React12.createElement(Button2, {
     "data-testid": "toast.close"
   }, closeLabel))));
 };
@@ -636,6 +681,37 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
   const fullScreenSlug = useMemo2(() => firstIdInPart(layoutParts, "fullScreen"), [
     layoutParts
   ]);
+  const [scrollLeft, setScrollLeft] = useState3(null);
+  const deckRef = useRef2(null);
+  const restoreScrollRef = useRef2(false);
+  const handleResize = useCallback2(() => {
+    setScrollLeft(null);
+  }, []);
+  useEffect5(() => {
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [
+    handleResize
+  ]);
+  useLayoutEffect2(() => {
+    if (layoutMode !== "deck") {
+      restoreScrollRef.current = true;
+    } else if (restoreScrollRef.current && deckRef.current && scrollLeft) {
+      deckRef.current.scrollLeft = scrollLeft;
+      restoreScrollRef.current = false;
+    }
+  }, [
+    layoutMode,
+    deckRef.current,
+    scrollLeft
+  ]);
+  const handleScroll = useCallback2((event) => {
+    if (layoutMode === "deck" && event.currentTarget === event.target) {
+      setScrollLeft(event.target.scrollLeft);
+    }
+  }, [
+    layoutMode
+  ]);
   const complementarySlug = useMemo2(() => {
     const entry = layoutParts.complementary?.at(0);
     if (entry) {
@@ -644,16 +720,15 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
   }, [
     layoutParts
   ]);
-  const activeId = useMemo2(() => Array.from(attention.attended ?? [])[0], [
+  const firstAttendedId = useMemo2(() => Array.from(attention.attended ?? [])[0], [
     attention.attended
   ]);
-  const deckRef = useRef2(null);
   useEffect5(() => {
-    if (layoutMode === "deck" && activeId) {
+    if (layoutMode === "deck" && firstAttendedId) {
     }
   }, [
     layoutMode,
-    activeId
+    firstAttendedId
   ]);
   const parts = useMemo2(() => {
     const parts2 = [
@@ -669,16 +744,13 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
     layoutParts.main,
     layoutParts.solo
   ]);
-  const showPlank = (part) => {
-    return layoutMode === "deck" || layoutParts.solo?.find((entry) => entry.id === part.id);
-  };
   const padding = layoutMode === "deck" && overscroll === "centering" ? calculateOverscroll(layoutParts.main, plankSizing, sidebarOpen, complementarySidebarOpen) : {};
   if (layoutMode === "fullscreen") {
-    return /* @__PURE__ */ React12.createElement(Fullscreen, {
+    return /* @__PURE__ */ React13.createElement(Fullscreen, {
       id: fullScreenSlug
     });
   }
-  return /* @__PURE__ */ React12.createElement(Popover2.Root, {
+  return /* @__PURE__ */ React13.createElement(Popover2.Root, {
     modal: true,
     open: !!(popoverAnchorId && popoverOpen),
     onOpenChange: (nextOpen) => {
@@ -689,9 +761,9 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
         context.popoverAnchorId = void 0;
       }
     }
-  }, /* @__PURE__ */ React12.createElement(ActiveNode, {
-    id: activeId
-  }), /* @__PURE__ */ React12.createElement(Main3.Root, {
+  }, /* @__PURE__ */ React13.createElement(ActiveNode, {
+    id: firstAttendedId
+  }), /* @__PURE__ */ React13.createElement(Main3.Root, {
     navigationSidebarOpen: context.sidebarOpen,
     onNavigationSidebarOpenChange: (next) => context.sidebarOpen = next,
     ...complementarySidebarOpen !== null && {
@@ -701,99 +773,89 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
       ),
       onComplementarySidebarOpenChange: (next) => context.complementarySidebarOpen = next
     }
-  }, /* @__PURE__ */ React12.createElement(Main3.Notch, {
+  }, /* @__PURE__ */ React13.createElement(Main3.Notch, {
     classNames: "z-[21]"
-  }, /* @__PURE__ */ React12.createElement(Surface8, {
+  }, /* @__PURE__ */ React13.createElement(Surface9, {
     role: "notch-start"
-  }), /* @__PURE__ */ React12.createElement(Button3, {
+  }), /* @__PURE__ */ React13.createElement(Button3, {
     // disabled={!sidebarAvailable}
     onClick: () => context.sidebarOpen = !context.sidebarOpen,
     variant: "ghost",
     classNames: "p-1"
-  }, /* @__PURE__ */ React12.createElement("span", {
+  }, /* @__PURE__ */ React13.createElement("span", {
     className: "sr-only"
-  }, t("open navigation sidebar label")), /* @__PURE__ */ React12.createElement(MenuIcon, {
+  }, t("open navigation sidebar label")), /* @__PURE__ */ React13.createElement(MenuIcon, {
     weight: "light",
     className: getSize(5)
-  })), /* @__PURE__ */ React12.createElement(Button3, {
+  })), /* @__PURE__ */ React13.createElement(Button3, {
     // disabled={!complementaryAvailable}
     onClick: () => context.complementarySidebarOpen = !context.complementarySidebarOpen,
     variant: "ghost",
     classNames: "p-1"
-  }, /* @__PURE__ */ React12.createElement("span", {
+  }, /* @__PURE__ */ React13.createElement("span", {
     className: "sr-only"
-  }, t("open complementary sidebar label")), /* @__PURE__ */ React12.createElement(MenuIcon, {
+  }, t("open complementary sidebar label")), /* @__PURE__ */ React13.createElement(MenuIcon, {
     mirrored: true,
     weight: "light",
     className: getSize(5)
-  })), /* @__PURE__ */ React12.createElement(Surface8, {
+  })), /* @__PURE__ */ React13.createElement(Surface9, {
     role: "notch-end"
-  })), /* @__PURE__ */ React12.createElement(Sidebar, {
+  })), /* @__PURE__ */ React13.createElement(Sidebar, {
     attention,
     layoutParts
-  }), /* @__PURE__ */ React12.createElement(ComplementarySidebar, {
+  }), /* @__PURE__ */ React13.createElement(ComplementarySidebar, {
     id: complementarySlug,
     layoutParts,
     flatDeck
-  }), /* @__PURE__ */ React12.createElement(Main3.Overlay, null), parts.length === 0 && /* @__PURE__ */ React12.createElement(Main3.Content, {
+  }), /* @__PURE__ */ React13.createElement(Main3.Overlay, null), parts.length === 0 && /* @__PURE__ */ React13.createElement(Main3.Content, {
     handlesFocus: true
-  }, /* @__PURE__ */ React12.createElement(ContentEmpty, null)), parts.length !== 0 && /* @__PURE__ */ React12.createElement(Main3.Content, {
+  }, /* @__PURE__ */ React13.createElement(ContentEmpty, null)), parts.length !== 0 && /* @__PURE__ */ React13.createElement(Main3.Content, {
     bounce: true,
     classNames: "grid block-end-[--statusbar-size]",
     handlesFocus: true
-  }, /* @__PURE__ */ React12.createElement("div", {
+  }, /* @__PURE__ */ React13.createElement("div", {
     role: "none",
-    className: layoutMode === "solo" ? "contents" : "relative"
-  }, /* @__PURE__ */ React12.createElement(Deck.Root, {
-    ref: deckRef,
-    solo: layoutMode === "solo",
+    className: "relative"
+  }, /* @__PURE__ */ React13.createElement(Deck.Root, {
     style: padding,
     classNames: [
-      !flatDeck && "surface-deck",
-      layoutMode === "deck" && [
-        "absolute inset-0",
-        "transition-[padding] duration-200 ease-in-out",
-        slots?.wallpaper?.classNames
-      ]
-    ]
-  }, parts.map((layoutEntry) => /* @__PURE__ */ React12.createElement(Plank, {
+      !flatDeck && "bg-deck",
+      "absolute inset-0",
+      slots?.wallpaper?.classNames
+    ],
+    onScroll: handleScroll,
+    ref: deckRef
+  }, parts.map((layoutEntry) => /* @__PURE__ */ React13.createElement(Plank, {
     key: layoutEntry.id,
     entry: layoutEntry,
     layoutParts,
-    part: layoutMode === "solo" && layoutEntry.id === activeId ? "solo" : "main",
+    part: layoutMode === "solo" && layoutEntry.id === layoutParts.solo?.[0]?.id ? "solo" : "main",
+    layoutMode,
     flatDeck,
-    searchEnabled: !!searchPlugin,
-    resizeable: layoutMode === "deck",
-    classNames: showPlank(layoutEntry) ? "" : "hidden"
-  }))))), /* @__PURE__ */ React12.createElement(Main3.Content, {
-    role: "none",
-    classNames: "fixed inset-inline-0 block-end-0 z-[2]"
-  }, /* @__PURE__ */ React12.createElement(Surface8, {
-    role: "status-bar",
-    limit: 1
-  })), showHintsFooter && /* @__PURE__ */ React12.createElement("div", {
+    searchEnabled: !!searchPlugin
+  }))))), /* @__PURE__ */ React13.createElement(StatusBar, null), showHintsFooter && /* @__PURE__ */ React13.createElement("div", {
     className: "fixed bottom-0 left-0 right-0 h-[32px] z-[1] flex justify-center"
-  }, /* @__PURE__ */ React12.createElement(Surface8, {
+  }, /* @__PURE__ */ React13.createElement(Surface9, {
     role: "hints",
     limit: 1
-  })), /* @__PURE__ */ React12.createElement(Popover2.Portal, null, /* @__PURE__ */ React12.createElement(Popover2.Content, {
+  })), /* @__PURE__ */ React13.createElement(Popover2.Portal, null, /* @__PURE__ */ React13.createElement(Popover2.Content, {
     classNames: "z-[60]",
     onEscapeKeyDown: () => {
       context.popoverOpen = false;
       context.popoverAnchorId = void 0;
     }
-  }, /* @__PURE__ */ React12.createElement(Popover2.Viewport, null, /* @__PURE__ */ React12.createElement(Surface8, {
+  }, /* @__PURE__ */ React13.createElement(Popover2.Viewport, null, /* @__PURE__ */ React13.createElement(Surface9, {
     role: "popover",
     data: popoverContent
-  })), /* @__PURE__ */ React12.createElement(Popover2.Arrow, null))), /* @__PURE__ */ React12.createElement(Dialog.Root, {
+  })), /* @__PURE__ */ React13.createElement(Popover2.Arrow, null))), /* @__PURE__ */ React13.createElement(Dialog.Root, {
     open: dialogOpen,
     onOpenChange: (nextOpen) => context.dialogOpen = nextOpen
-  }, /* @__PURE__ */ React12.createElement(Dialog.Overlay, {
+  }, /* @__PURE__ */ React13.createElement(Dialog.Overlay, {
     blockAlign: dialogBlockAlign
-  }, /* @__PURE__ */ React12.createElement(Surface8, {
+  }, /* @__PURE__ */ React13.createElement(Surface9, {
     role: "dialog",
     data: dialogContent
-  }))), toasts?.map((toast) => /* @__PURE__ */ React12.createElement(Toast, {
+  }))), toasts?.map((toast) => /* @__PURE__ */ React13.createElement(Toast, {
     ...toast,
     key: toast.id,
     onOpenChange: (open) => {
@@ -806,7 +868,7 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
 };
 
 // packages/plugins/plugin-deck/src/components/LayoutSettings.tsx
-import React13 from "react";
+import React14 from "react";
 import { SettingsValue } from "@dxos/plugin-settings";
 import { Input, Select, useTranslation as useTranslation6 } from "@dxos/react-ui";
 
@@ -824,44 +886,44 @@ var OverscrollOptions = [
 var isSocket = !!globalThis.__args;
 var LayoutSettings = ({ settings }) => {
   const { t } = useTranslation6(DECK_PLUGIN);
-  return /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(SettingsValue, {
+  return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(SettingsValue, {
     label: t("select new plank positioning label")
-  }, /* @__PURE__ */ React13.createElement(Select.Root, {
+  }, /* @__PURE__ */ React14.createElement(Select.Root, {
     value: settings.newPlankPositioning ?? "start",
     onValueChange: (value) => settings.newPlankPositioning = value
-  }, /* @__PURE__ */ React13.createElement(Select.TriggerButton, {
+  }, /* @__PURE__ */ React14.createElement(Select.TriggerButton, {
     placeholder: t("select new plank positioning placeholder")
-  }), /* @__PURE__ */ React13.createElement(Select.Portal, null, /* @__PURE__ */ React13.createElement(Select.Content, null, /* @__PURE__ */ React13.createElement(Select.Viewport, null, NewPlankPositions.map((position) => /* @__PURE__ */ React13.createElement(Select.Option, {
+  }), /* @__PURE__ */ React14.createElement(Select.Portal, null, /* @__PURE__ */ React14.createElement(Select.Content, null, /* @__PURE__ */ React14.createElement(Select.Viewport, null, NewPlankPositions.map((position) => /* @__PURE__ */ React14.createElement(Select.Option, {
     key: position,
     value: position
-  }, t(`settings new plank position ${position} label`)))))))), /* @__PURE__ */ React13.createElement(SettingsValue, {
+  }, t(`settings new plank position ${position} label`)))))))), /* @__PURE__ */ React14.createElement(SettingsValue, {
     label: t("settings overscroll label")
-  }, /* @__PURE__ */ React13.createElement(Select.Root, {
+  }, /* @__PURE__ */ React14.createElement(Select.Root, {
     value: settings.overscroll ?? "none",
     onValueChange: (value) => settings.overscroll = value
-  }, /* @__PURE__ */ React13.createElement(Select.TriggerButton, {
+  }, /* @__PURE__ */ React14.createElement(Select.TriggerButton, {
     placeholder: t("select overscroll placeholder")
-  }), /* @__PURE__ */ React13.createElement(Select.Portal, null, /* @__PURE__ */ React13.createElement(Select.Content, null, /* @__PURE__ */ React13.createElement(Select.Viewport, null, OverscrollOptions.map((option) => /* @__PURE__ */ React13.createElement(Select.Option, {
+  }), /* @__PURE__ */ React14.createElement(Select.Portal, null, /* @__PURE__ */ React14.createElement(Select.Content, null, /* @__PURE__ */ React14.createElement(Select.Viewport, null, OverscrollOptions.map((option) => /* @__PURE__ */ React14.createElement(Select.Option, {
     key: option,
     value: option
-  }, t(`settings overscroll ${option} label`)))))))), /* @__PURE__ */ React13.createElement(SettingsValue, {
+  }, t(`settings overscroll ${option} label`)))))))), /* @__PURE__ */ React14.createElement(SettingsValue, {
     label: t("settings show footer label")
-  }, /* @__PURE__ */ React13.createElement(Input.Switch, {
+  }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.showFooter,
     onCheckedChange: (checked) => settings.showFooter = !!checked
-  })), !isSocket && /* @__PURE__ */ React13.createElement(SettingsValue, {
+  })), !isSocket && /* @__PURE__ */ React14.createElement(SettingsValue, {
     label: t("settings native redirect label")
-  }, /* @__PURE__ */ React13.createElement(Input.Switch, {
+  }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.enableNativeRedirect,
     onCheckedChange: (checked) => settings.enableNativeRedirect = !!checked
-  })), /* @__PURE__ */ React13.createElement(SettingsValue, {
+  })), /* @__PURE__ */ React14.createElement(SettingsValue, {
     label: t("settings custom slots")
-  }, /* @__PURE__ */ React13.createElement(Input.Switch, {
+  }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.customSlots,
     onCheckedChange: (checked) => settings.customSlots = !!checked
-  })), /* @__PURE__ */ React13.createElement(SettingsValue, {
+  })), /* @__PURE__ */ React14.createElement(SettingsValue, {
     label: t("settings flat deck")
-  }, /* @__PURE__ */ React13.createElement(Input.Switch, {
+  }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.flatDeck,
     onCheckedChange: (checked) => settings.flatDeck = !!checked
   })));
@@ -1317,7 +1379,7 @@ var DeckPlugin = ({ observability } = {}) => {
                       ns: DECK_PLUGIN
                     }
                   ],
-                  icon: (props) => /* @__PURE__ */ React14.createElement(ArrowsOut, props),
+                  icon: (props) => /* @__PURE__ */ React15.createElement(ArrowsOut, props),
                   iconSymbol: "ph--arrows-out--regular",
                   keyBinding: {
                     macos: "ctrl+meta+f",
@@ -1329,13 +1391,13 @@ var DeckPlugin = ({ observability } = {}) => {
           });
         }
       },
-      context: (props) => /* @__PURE__ */ React14.createElement(LayoutContext.Provider, {
+      context: (props) => /* @__PURE__ */ React15.createElement(LayoutContext.Provider, {
         value: layout.values
-      }, /* @__PURE__ */ React14.createElement(DeckContext.Provider, {
+      }, /* @__PURE__ */ React15.createElement(DeckContext.Provider, {
         value: deck.values
       }, props.children)),
       root: () => {
-        return /* @__PURE__ */ React14.createElement(Mosaic.Root, null, /* @__PURE__ */ React14.createElement(DeckLayout, {
+        return /* @__PURE__ */ React15.createElement(Mosaic.Root, null, /* @__PURE__ */ React15.createElement(DeckLayout, {
           attention: attentionPlugin?.provides.attention ?? {
             attended: /* @__PURE__ */ new Set()
           },
@@ -1356,13 +1418,13 @@ var DeckPlugin = ({ observability } = {}) => {
               }, 1e3);
             }
           }
-        }), /* @__PURE__ */ React14.createElement(Mosaic.DragOverlay, null));
+        }), /* @__PURE__ */ React15.createElement(Mosaic.DragOverlay, null));
       },
       surface: {
         component: ({ data, role }) => {
           switch (role) {
             case "settings":
-              return data.plugin === meta_default.id ? /* @__PURE__ */ React14.createElement(LayoutSettings, {
+              return data.plugin === meta_default.id ? /* @__PURE__ */ React15.createElement(LayoutSettings, {
                 settings: settings.values
               }) : null;
           }