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

package/dist/lib/browser/index.mjs

@@ -27,6 +27,7 @@ import { Sidebar as MenuIcon } from "@phosphor-icons/react";
 import React13, { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef2 } from "react";
 import { Surface as Surface9, firstIdInPart, usePlugin } from "@dxos/app-framework";
 import { Button as Button3, Dialog, Main as Main3, Popover as Popover2, useOnTransition, useTranslation as useTranslation5 } from "@dxos/react-ui";
+import { useAttended as useAttended3 } from "@dxos/react-ui-attention";
 import { Deck } from "@dxos/react-ui-deck";
 import { getSize } from "@dxos/react-ui-theme";
 
@@ -118,7 +119,7 @@ import React5 from "react";
 import { SLUG_PATH_SEPARATOR as SLUG_PATH_SEPARATOR2, Surface as Surface3 } from "@dxos/app-framework";
 import { useGraph as useGraph3 } from "@dxos/plugin-graph";
 import { Main } from "@dxos/react-ui";
-import { createAttendableAttributes, useAttendedIds } from "@dxos/react-ui-attention";
+import { useAttended } from "@dxos/react-ui-attention";
 import { deckGrid } from "@dxos/react-ui-deck";
 import { mx as mx2 } from "@dxos/react-ui-theme";
 
@@ -129,17 +130,7 @@ import { useGraph as useGraph2 } from "@dxos/plugin-graph";
 import { Icon, Popover, toLocalizedString, useMediaQuery, useTranslation } from "@dxos/react-ui";
 import { PlankHeading } from "@dxos/react-ui-deck";
 import { TextTooltip } from "@dxos/react-ui-text-tooltip";
-var NodePlankHeading = ({
-  node,
-  id,
-  layoutParts,
-  layoutPart,
-  // TODO(wittjosiah): Unused?
-  layoutEntry,
-  popoverAnchorId,
-  pending,
-  flatDeck
-}) => {
+var NodePlankHeading = ({ node, id, layoutParts, layoutPart, popoverAnchorId, pending, flatDeck }) => {
   const { t } = useTranslation(DECK_PLUGIN);
   const { graph } = useGraph2();
   const icon = node?.properties?.icon ?? "ph--placeholder--regular";
@@ -173,6 +164,7 @@ var NodePlankHeading = ({
     classNames: "pie-1 border-b border-separator"
   }, /* @__PURE__ */ React2.createElement(ActionRoot, null, node ? /* @__PURE__ */ React2.createElement(PlankHeading.ActionsMenu, {
     icon,
+    related: layoutPart === "complementary",
     attendableId,
     triggerLabel: t("actions menu label"),
     actions: graph.actions(node),
@@ -194,7 +186,8 @@ var NodePlankHeading = ({
     text: label,
     onlyWhenTruncating: true
   }, /* @__PURE__ */ React2.createElement(PlankHeading.Label, {
-    attendableId: node?.id,
+    attendableId,
+    related: layoutPart === "complementary",
     ...pending && {
       classNames: "text-description"
     }
@@ -316,13 +309,12 @@ var useLayout = () => useContext(LayoutContext) ?? raise(new Error("Missing Layo
 // packages/plugins/plugin-deck/src/components/DeckLayout/ComplementarySidebar.tsx
 var ComplementarySidebar = ({ context, layoutParts, flatDeck }) => {
   const { popoverAnchorId } = useLayout();
-  const attended = useAttendedIds();
+  const attended = useAttended();
   const id = attended[0] ? `${attended[0]}${SLUG_PATH_SEPARATOR2}${context}` : void 0;
   const { graph } = useGraph3();
   const node = useNode(graph, id);
-  const complementaryAttrs = createAttendableAttributes(id?.split(SLUG_PATH_SEPARATOR2)[0] ?? "never");
   useNodeActionExpander(node);
-  return /* @__PURE__ */ React5.createElement(Main.ComplementarySidebar, complementaryAttrs, /* @__PURE__ */ React5.createElement("div", {
+  return /* @__PURE__ */ React5.createElement(Main.ComplementarySidebar, null, /* @__PURE__ */ React5.createElement("div", {
     role: "none",
     className: mx2(deckGrid, "grid-cols-1 bs-full")
   }, /* @__PURE__ */ React5.createElement(NodePlankHeading, {
@@ -335,7 +327,7 @@ var ComplementarySidebar = ({ context, layoutParts, flatDeck }) => {
   }), node && /* @__PURE__ */ React5.createElement(Surface3, {
     role: "article",
     data: {
-      subject: node.data,
+      subject: node.properties.object,
       part: "complementary",
       popoverAnchorId
     },
@@ -407,7 +399,7 @@ import { LayoutAction as LayoutAction2, NavigationAction as NavigationAction2, S
 import { debounce } from "@dxos/async";
 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 { useAttendableAttributes } from "@dxos/react-ui-attention";
 import { Plank as NaturalPlank } from "@dxos/react-ui-deck";
 import { mainIntrinsicSize } from "@dxos/react-ui-theme";
 
@@ -427,7 +419,7 @@ var Plank = ({ entry, layoutParts, part, flatDeck, searchEnabled, layoutMode })
   const node = useNode(graph, entry.id);
   const rootElement = useRef(null);
   const resizeable = layoutMode === "deck";
-  const attendableAttrs = createAttendableAttributes2(entry.id);
+  const attendableAttrs = useAttendableAttributes(entry.id);
   const coordinate = {
     part,
     entryId: entry.id
@@ -554,8 +546,10 @@ var Plank = ({ entry, layoutParts, part, flatDeck, searchEnabled, layoutMode })
 import React10, { useMemo } from "react";
 import { openIds, Surface as Surface7 } from "@dxos/app-framework";
 import { Main as Main2 } from "@dxos/react-ui";
-var Sidebar = ({ attention, layoutParts }) => {
+import { useAttended as useAttended2 } from "@dxos/react-ui-attention";
+var Sidebar = ({ layoutParts }) => {
   const { layoutMode, popoverAnchorId } = useLayout();
+  const attended = useAttended2();
   const activeIds = useMemo(() => {
     if (layoutMode === "solo") {
       return new Set(layoutParts?.solo?.map((e) => e.id) ?? []);
@@ -570,11 +564,11 @@ var Sidebar = ({ attention, layoutParts }) => {
   const navigationData = useMemo(() => ({
     popoverAnchorId,
     activeIds,
-    attended: attention.attended
+    attended
   }), [
     popoverAnchorId,
     activeIds,
-    attention.attended
+    attended
   ]);
   return /* @__PURE__ */ React10.createElement(Main2.NavigationSidebar, null, /* @__PURE__ */ React10.createElement(Surface7, {
     role: "navigation",
@@ -674,11 +668,12 @@ var calculateOverscroll = (planks, plankSizing, sidebarOpen, complementarySideba
 };
 
 // packages/plugins/plugin-deck/src/components/DeckLayout/DeckLayout.tsx
-var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHintsFooter, slots, onDismissToast }) => {
+var DeckLayout = ({ layoutParts, toasts, flatDeck, overscroll, showHintsFooter, slots, onDismissToast }) => {
   const context = useLayout();
   const { layoutMode, sidebarOpen, complementarySidebarOpen, dialogOpen, dialogContent, dialogBlockAlign, popoverOpen, popoverContent, popoverAnchorId } = context;
   const { t } = useTranslation5(DECK_PLUGIN);
   const { plankSizing } = useDeckContext();
+  const attended = useAttended3();
   const searchPlugin = usePlugin("dxos.org/plugin/search");
   const fullScreenSlug = useMemo2(() => firstIdInPart(layoutParts, "fullScreen"), [
     layoutParts
@@ -687,7 +682,7 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
   const deckRef = useRef2(null);
   useEffect5(() => {
     const firstId = layoutMode === "solo" ? firstIdInPart(layoutParts, "solo") : firstIdInPart(layoutParts, "main");
-    if (attention.attended.size === 0 && firstId) {
+    if (attended.length === 0 && firstId) {
       document.querySelector(`article[data-attendable-id="${firstId}"] button`)?.focus();
     }
   }, []);
@@ -713,9 +708,7 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
   }, [
     layoutMode
   ]);
-  const firstAttendedId = useMemo2(() => Array.from(attention.attended ?? [])[0], [
-    attention.attended
-  ]);
+  const firstAttendedId = attended[0];
   useEffect5(() => {
     if (layoutMode === "deck" && firstAttendedId) {
     }
@@ -799,7 +792,6 @@ var DeckLayout = ({ layoutParts, attention, toasts, flatDeck, overscroll, showHi
   })), /* @__PURE__ */ React13.createElement(Surface9, {
     role: "notch-end"
   })), /* @__PURE__ */ React13.createElement(Sidebar, {
-    attention,
     layoutParts
   }), /* @__PURE__ */ React13.createElement(ComplementarySidebar, {
     context: "comments",
@@ -1410,9 +1402,6 @@ var DeckPlugin = ({ observability } = {}) => {
       }, props.children)),
       root: () => {
         return /* @__PURE__ */ React15.createElement(DeckLayout, {
-          attention: attentionPlugin?.provides.attention ?? {
-            attended: /* @__PURE__ */ new Set()
-          },
           layoutParts: location.values.active,
           showHintsFooter: settings.values.showFooter,
           overscroll: settings.values.overscroll,
@@ -1466,7 +1455,7 @@ var DeckPlugin = ({ observability } = {}) => {
                 } else {
                   log.warn("Invalid layout mode", intent?.data?.layoutMode, {
                     F: __dxlog_file,
-                    L: 411,
+                    L: 410,
                     S: void 0,
                     C: (f, a) => f(...a)
                   });