@dxos/plugin-deck 0.6.14-main.8b352a0 → 0.6.14-staging.54a8bab

package/dist/lib/browser/chunk-NIRHDTX4.mjs

@@ -0,0 +1,17 @@
+// packages/plugins/plugin-deck/src/types.ts
+var NewPlankPositions = [
+  "start",
+  "end"
+];
+var OverscrollOptions = [
+  "none",
+  "centering"
+];
+var parsePanelPlugin = (plugin) => Array.isArray(plugin?.provides.complementary?.panels) ? plugin : void 0;
+
+export {
+  NewPlankPositions,
+  OverscrollOptions,
+  parsePanelPlugin
+};
+//# sourceMappingURL=chunk-NIRHDTX4.mjs.map

package/dist/lib/browser/chunk-NIRHDTX4.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/types.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport type {\n  Plugin,\n  GraphBuilderProvides,\n  IntentResolverProvides,\n  LayoutProvides,\n  LocationProvides,\n  SettingsProvides,\n  SurfaceProvides,\n  TranslationsProvides,\n} from '@dxos/app-framework';\nimport { type Label } from '@dxos/react-ui';\n\n// TODO(Zan): In the future we should consider adding new planks adjacent to the attended plank.\nexport const NewPlankPositions = ['start', 'end'] as const;\nexport type NewPlankPositioning = (typeof NewPlankPositions)[number];\n\nexport const OverscrollOptions = ['none', 'centering'] as const;\nexport type Overscroll = (typeof OverscrollOptions)[number];\n\n// TODO(wittjosiah): Include a predicate for whether the panel is visible for the current subject.\nexport type Panel = { id: string; label: Label; icon: string };\n\n// TODO(wittjosiah): Is this generic enough to be in the app framework?\nexport type PanelProvides = {\n  complementary: {\n    panels: Panel[];\n  };\n};\n\nexport const parsePanelPlugin = (plugin?: Plugin) =>\n  Array.isArray((plugin?.provides as any).complementary?.panels) ? (plugin as Plugin<PanelProvides>) : undefined;\n\nexport type DeckSettingsProps = {\n  showHints: boolean;\n  customSlots: boolean;\n  flatDeck: boolean;\n  enableNativeRedirect: boolean;\n  disableDeck: boolean;\n  newPlankPositioning: NewPlankPositioning;\n  overscroll: Overscroll;\n};\n\nexport type DeckPluginProvides = SurfaceProvides &\n  IntentResolverProvides &\n  GraphBuilderProvides &\n  TranslationsProvides &\n  SettingsProvides<DeckSettingsProps> &\n  LayoutProvides &\n  LocationProvides;\n"],
+  "mappings": ";AAiBO,IAAMA,oBAAoB;EAAC;EAAS;;AAGpC,IAAMC,oBAAoB;EAAC;EAAQ;;AAanC,IAAMC,mBAAmB,CAACC,WAC/BC,MAAMC,QAASF,QAAQG,SAAiBC,eAAeC,MAAAA,IAAWL,SAAmCM;",
+  "names": ["NewPlankPositions", "OverscrollOptions", "parsePanelPlugin", "plugin", "Array", "isArray", "provides", "complementary", "panels", "undefined"]
+}

package/dist/lib/browser/index.mjs

@@ -2,12 +2,17 @@ import {
   DECK_PLUGIN,
   meta_default
 } from "./chunk-GVOGPULO.mjs";
+import {
+  NewPlankPositions,
+  OverscrollOptions,
+  parsePanelPlugin
+} from "./chunk-NIRHDTX4.mjs";
 
 // packages/plugins/plugin-deck/src/DeckPlugin.tsx
 import { batch } from "@preact/signals-core";
 import { setAutoFreeze } from "immer";
 import React15 from "react";
-import { IntentAction, LayoutAction as LayoutAction3, NavigationAction as NavigationAction4, parseGraphPlugin, parseIntentPlugin, resolvePlugin, Toast as ToastSchema, SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR4, isLayoutParts, isLayoutAdjustment, isLayoutMode, openIds as openIds2 } from "@dxos/app-framework";
+import { IntentAction, LayoutAction as LayoutAction3, NavigationAction as NavigationAction4, parseGraphPlugin, parseIntentPlugin, resolvePlugin, Toast as ToastSchema, SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR4, isLayoutParts, isLayoutAdjustment, isLayoutMode, openIds as openIds2, filterPlugins } from "@dxos/app-framework";
 import { create, getTypename, isReactiveObject } from "@dxos/echo-schema";
 import { scheduledEffect } from "@dxos/echo-signals/core";
 import { LocalStorageStore } from "@dxos/local-storage";
@@ -318,38 +323,16 @@ var LayoutContext = createContext(null);
 var useLayout = () => useContext(LayoutContext) ?? raise(new Error("Missing LayoutContext"));
 
 // packages/plugins/plugin-deck/src/components/DeckLayout/ComplementarySidebar.tsx
-var panels = [
-  {
-    id: "settings",
-    icon: "ph--gear--regular"
-  },
-  {
-    id: "comments",
-    icon: "ph--chat-text--regular"
-  },
-  {
-    id: "automation",
-    icon: "ph--atom--regular"
-  },
-  {
-    id: "debug",
-    icon: "ph--bug--regular"
-  }
-];
-var getPanel = (id) => {
-  const panel = panels.find((p) => p.id === id) ?? panels[0];
-  return panel.id;
-};
-var ComplementarySidebar = ({ panel, flatDeck }) => {
+var ComplementarySidebar = ({ panels, current, flatDeck }) => {
   const { popoverAnchorId } = useLayout();
   const attended = useAttended2();
-  const part = getPanel(panel);
-  const id = attended[0] ? `${attended[0]}${SLUG_PATH_SEPARATOR2}${part}` : void 0;
+  const panel = (panels.find((p) => p.id === current) ?? panels[0])?.id;
+  const id = attended[0] ? `${attended[0]}${SLUG_PATH_SEPARATOR2}${panel}` : void 0;
   const { graph } = useGraph3();
   const node = useNode(graph, id);
   const dispatch = useIntentDispatcher2();
   useNodeActionExpander(node);
-  const actions = useMemo2(() => panels.map(({ id: id2, icon }) => ({
+  const actions = useMemo2(() => panels.map(({ id: id2, label, icon }) => ({
     id: `complementary-${id2}`,
     data: () => {
       void dispatch({
@@ -362,18 +345,13 @@ var ComplementarySidebar = ({ panel, flatDeck }) => {
       });
     },
     properties: {
-      label: [
-        `open ${id2} label`,
-        {
-          ns: DECK_PLUGIN
-        }
-      ],
+      label,
       icon,
       menuItemType: "toggle",
-      isChecked: part === id2
+      isChecked: panel === id2
     }
   })), [
-    part
+    panel
   ]);
   const coordinate = useMemo2(() => ({
     entryId: id ?? "unknown",
@@ -394,7 +372,8 @@ var ComplementarySidebar = ({ panel, flatDeck }) => {
     className: "row-span-2 divide-y divide-separator overflow-x-hidden overflow-y-scroll"
   }, node && /* @__PURE__ */ React5.createElement(Surface3, {
     key: id,
-    role: `complementary--${part}`,
+    role: `complementary--${panel}`,
+    limit: 1,
     data: {
       id,
       subject: node.properties.object ?? node.properties.space,
@@ -478,39 +457,38 @@ var DeckContext = createContext2(null);
 var useDeckContext = () => useContext2(DeckContext) ?? raise2(new Error("Missing DeckContext"));
 
 // packages/plugins/plugin-deck/src/components/DeckLayout/Plank.tsx
+var UNKNOWN_ID = "unknown_id";
 var Plank = /* @__PURE__ */ memo2(({ entry, layoutParts, part, flatDeck, searchEnabled, layoutMode }) => {
   const { t } = useTranslation4(DECK_PLUGIN);
   const dispatch = useIntentDispatcher3();
-  const { popoverAnchorId, scrollIntoView } = useLayout();
-  const { plankSizing } = useDeckContext();
-  const { graph } = useGraph5();
-  const node = useNode(graph, entry.id);
-  const rootElement = useRef(null);
-  const resizeable = layoutMode === "deck";
-  const attendableAttrs = useAttendableAttributes(entry.id);
   const coordinate = useMemo3(() => ({
     part,
-    entryId: entry.id
+    entryId: entry?.id ?? UNKNOWN_ID
   }), [
-    entry.id,
+    entry?.id,
     part
   ]);
+  const { popoverAnchorId, scrollIntoView } = useLayout();
+  const { plankSizing } = useDeckContext();
+  const { graph } = useGraph5();
+  const node = useNode(graph, entry?.id);
+  const rootElement = useRef(null);
+  const resizeable = layoutMode === "deck";
+  const attendableAttrs = useAttendableAttributes(coordinate.entryId);
   const index = indexInPart(layoutParts, coordinate);
   const length = partLength(layoutParts, part);
   const canIncrementStart = part === "main" && index !== void 0 && index > 0 && length !== void 0 && length > 1;
   const canIncrementEnd = part === "main" && index !== void 0 && index < length - 1 && length !== void 0;
-  const size = plankSizing?.[entry.id];
-  const setSize = useCallback(debounce((newSize) => {
-    void dispatch({
-      action: DeckAction.UPDATE_PLANK_SIZE,
-      data: {
-        id: entry.id,
-        size: newSize
-      }
-    });
-  }, 200), [
+  const size = plankSizing?.[coordinate.entryId];
+  const setSize = useCallback(debounce((newSize) => dispatch({
+    action: DeckAction.UPDATE_PLANK_SIZE,
+    data: {
+      id: coordinate.entryId,
+      size: newSize
+    }
+  }), 200), [
     dispatch,
-    entry.id
+    coordinate.entryId
   ]);
   const handleKeyDown = useCallback((event) => {
     if (event.target === event.currentTarget && event.key === "Escape") {
@@ -518,7 +496,7 @@ var Plank = /* @__PURE__ */ memo2(({ entry, layoutParts, part, flatDeck, searchE
     }
   }, []);
   useLayoutEffect(() => {
-    if (scrollIntoView === entry.id) {
+    if (scrollIntoView === coordinate.entryId) {
       rootElement.current?.focus({
         preventScroll: true
       });
@@ -528,14 +506,15 @@ var Plank = /* @__PURE__ */ memo2(({ entry, layoutParts, part, flatDeck, searchE
       });
     }
   }, [
+    coordinate.entryId,
     scrollIntoView,
     layoutMode
   ]);
   const isSolo = layoutMode === "solo" && part === "solo";
-  const isSuppressed = layoutMode === "solo" && part !== "solo" || layoutMode === "deck" && part === "solo";
+  const isSuppressed = layoutMode === "solo" && part !== "solo" || layoutMode === "deck" && part === "solo" || coordinate.entryId === UNKNOWN_ID;
   const sizeAttrs = useMainSize();
   const data = useMemo3(() => node && {
-    ...entry.path ? {
+    ...entry?.path ? {
       subject: node.data,
       path: entry.path
     } : {
@@ -544,7 +523,11 @@ var Plank = /* @__PURE__ */ memo2(({ entry, layoutParts, part, flatDeck, searchE
     coordinate,
     popoverAnchorId
   }, [
-    node
+    node,
+    node?.data,
+    entry?.path,
+    coordinate,
+    popoverAnchorId
   ]);
   const placeholder = useMemo3(() => /* @__PURE__ */ React9.createElement(PlankLoading, null), []);
   return /* @__PURE__ */ React9.createElement(NaturalPlank.Root, {
@@ -754,7 +737,7 @@ var calculateOverscroll = (planks, plankSizing, sidebarOpen, complementarySideba
 };
 
 // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
-var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHints, slots, onDismissToast }) => {
+var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHints, slots, panels, onDismissToast }) => {
   const context = useLayout();
   const { layoutMode, sidebarOpen, complementarySidebarOpen, dialogOpen, dialogContent, dialogBlockAlign, popoverOpen, popoverContent, popoverAnchorId } = context;
   const { t } = useTranslation5(DECK_PLUGIN);
@@ -858,7 +841,8 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHints, slots,
   })), /* @__PURE__ */ React13.createElement(Sidebar, {
     layoutParts
   }), /* @__PURE__ */ React13.createElement(ComplementarySidebar, {
-    panel: layoutParts.complementary?.[0].id,
+    panels,
+    current: layoutParts.complementary?.[0].id,
     flatDeck
   }), /* @__PURE__ */ React13.createElement(Main3.Overlay, null), isEmpty && /* @__PURE__ */ React13.createElement(Main3.Content, {
     handlesFocus: true
@@ -881,9 +865,7 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHints, slots,
     onScroll: handleScroll,
     ref: deckRef
   }, /* @__PURE__ */ React13.createElement(Plank, {
-    entry: layoutParts.solo?.[0] ?? {
-      id: "unknown-solo"
-    },
+    entry: layoutParts.solo?.[0],
     layoutParts,
     part: "solo",
     layoutMode,
@@ -931,23 +913,11 @@ var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHints, slots,
 // packages/plugins/plugin-deck/src/components/LayoutSettings.tsx
 import React14 from "react";
 import { Input, Select, useTranslation as useTranslation6 } from "@dxos/react-ui";
-import { FormInput } from "@dxos/react-ui-data";
-
-// packages/plugins/plugin-deck/src/types.ts
-var NewPlankPositions = [
-  "start",
-  "end"
-];
-var OverscrollOptions = [
-  "none",
-  "centering"
-];
-
-// packages/plugins/plugin-deck/src/components/LayoutSettings.tsx
+import { DeprecatedFormInput } from "@dxos/react-ui-data";
 var isSocket = !!globalThis.__args;
 var LayoutSettings = ({ settings }) => {
   const { t } = useTranslation6(DECK_PLUGIN);
-  return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(FormInput, {
+  return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(DeprecatedFormInput, {
     label: t("select new plank positioning label")
   }, /* @__PURE__ */ React14.createElement(Select.Root, {
     value: settings.newPlankPositioning ?? "start",
@@ -957,7 +927,7 @@ var LayoutSettings = ({ settings }) => {
   }), /* @__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__ */ React14.createElement(FormInput, {
+  }, t(`settings new plank position ${position} label`)))))))), /* @__PURE__ */ React14.createElement(DeprecatedFormInput, {
     label: t("settings overscroll label")
   }, /* @__PURE__ */ React14.createElement(Select.Root, {
     value: settings.overscroll ?? "none",
@@ -967,22 +937,22 @@ var LayoutSettings = ({ settings }) => {
   }), /* @__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__ */ React14.createElement(FormInput, {
+  }, t(`settings overscroll ${option} label`)))))))), /* @__PURE__ */ React14.createElement(DeprecatedFormInput, {
     label: t("settings show hints label")
   }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.showHints,
     onCheckedChange: (checked) => settings.showHints = checked
-  })), !isSocket && /* @__PURE__ */ React14.createElement(FormInput, {
+  })), !isSocket && /* @__PURE__ */ React14.createElement(DeprecatedFormInput, {
     label: t("settings native redirect label")
   }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.enableNativeRedirect,
     onCheckedChange: (checked) => settings.enableNativeRedirect = checked
-  })), /* @__PURE__ */ React14.createElement(FormInput, {
+  })), /* @__PURE__ */ React14.createElement(DeprecatedFormInput, {
     label: t("settings custom slots")
   }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.customSlots,
     onCheckedChange: (checked) => settings.customSlots = checked
-  })), /* @__PURE__ */ React14.createElement(FormInput, {
+  })), /* @__PURE__ */ React14.createElement(DeprecatedFormInput, {
     label: t("settings flat deck")
   }, /* @__PURE__ */ React14.createElement(Input.Switch, {
     checked: settings.flatDeck,
@@ -1170,12 +1140,7 @@ var translations_default = [
         "select overscroll placeholder": "Select plank overscrolling behavior",
         "settings overscroll centering label": "Centering",
         "settings overscroll none label": "None",
-        "settings flat deck": "Flatten deck appearance",
-        // ComplementarySidebar
-        "open settings label": "Show settings",
-        "open comments label": "Show Comments",
-        "open automation label": "Show Automation",
-        "open debug label": "Show Debug"
+        "settings flat deck": "Flatten deck appearance"
       }
     }
   }
@@ -1204,6 +1169,7 @@ var DeckPlugin = ({ observability } = {}) => {
   const unsubscriptionCallbacks = [];
   let currentUndoId;
   let handleNavigation;
+  const panels = [];
   const settings = new LocalStorageStore("dxos.org/settings/layout", {
     showHints: false,
     customSlots: false,
@@ -1334,6 +1300,7 @@ var DeckPlugin = ({ observability } = {}) => {
         key: "closed",
         type: LocalStorageStore.json()
       });
+      panels.push(...filterPlugins(plugins, parsePanelPlugin).flatMap((plugin) => plugin.provides.complementary.panels));
       unsubscriptionCallbacks.push(clientPlugin?.provides.client.shell.onReset(() => {
         layout.expunge();
         location.expunge();
@@ -1460,6 +1427,7 @@ var DeckPlugin = ({ observability } = {}) => {
           flatDeck: settings.values.flatDeck,
           slots: settings.values.customSlots ? customSlots : void 0,
           toasts: layout.values.toasts,
+          panels,
           onDismissToast: (id) => {
             const index = layout.values.toasts.findIndex((toast) => toast.id === id);
             if (index !== -1) {
@@ -1507,7 +1475,7 @@ var DeckPlugin = ({ observability } = {}) => {
                 } else {
                   log.warn("Invalid layout mode", intent?.data?.layoutMode, {
                     F: __dxlog_file,
-                    L: 392,
+                    L: 406,
                     S: void 0,
                     C: (f, a) => f(...a)
                   });