@dxos/plugin-navtree 0.7.5-main.ff8607b → 0.7.5-staging.2ff1350

package/dist/lib/browser/{chunk-EO6JEADO.mjs → chunk-7OKF4GP3.mjs}

@@ -187,7 +187,7 @@ var NotchStart = () => {
 
 // packages/plugins/plugin-navtree/src/util.ts
 import { ACTION_TYPE, ACTION_GROUP_TYPE, isAction as isAction2, isActionLike } from "@dxos/app-graph";
-import { nonNullable } from "@dxos/util";
+import { isNonNullable } from "@dxos/util";
 var getParent = (graph, node, path) => {
   const parentId = path[path.length - 2];
   return graph.nodes(node, {
@@ -239,7 +239,7 @@ var getChildren = (graph, node, filter, path = []) => {
       node.id
     ];
     return nextPath.includes(n.id) ? void 0 : n;
-  }).filter(nonNullable);
+  }).filter(isNonNullable);
 };
 var getActions = (graph, node) => {
   return graph.actions(node).reduce((acc, arg) => {
@@ -313,13 +313,13 @@ var getFirstTwoRenderableChars = (label) => {
 import { monitorForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
 import { extractInstruction } from "@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item";
 import { untracked } from "@preact/signals-core";
-import React10, { memo as memo2, useCallback as useCallback2, useEffect as useEffect2, useMemo as useMemo5 } from "react";
+import React10, { memo as memo2, useCallback as useCallback2, useEffect as useEffect3, useMemo as useMemo5 } from "react";
 import { createIntent as createIntent5, LayoutAction as LayoutAction4, Surface, useAppGraph as useAppGraph2, useCapability, useIntentDispatcher as useIntentDispatcher5, useLayout as useLayout2 } from "@dxos/app-framework";
 import { isAction as isAction4, isActionLike as isActionLike2 } from "@dxos/app-graph";
 import { isEchoObject, isSpace } from "@dxos/react-client/echo";
 import { useMediaQuery as useMediaQuery2 } from "@dxos/react-ui";
 import { isTreeData } from "@dxos/react-ui-list";
-import { mx as mx5 } from "@dxos/react-ui-theme";
+import { mx as mx6 } from "@dxos/react-ui-theme";
 import { arrayMove } from "@dxos/util";
 
 // packages/plugins/plugin-navtree/src/components/NavTree.tsx
@@ -330,7 +330,7 @@ import { byPosition } from "@dxos/util";
 // packages/plugins/plugin-navtree/src/components/L0Menu.tsx
 import React5, { useCallback, useMemo as useMemo2 } from "react";
 import { createIntent as createIntent4, LayoutAction as LayoutAction3, useIntentDispatcher as useIntentDispatcher4 } from "@dxos/app-framework";
-import { Icon as Icon2, toLocalizedString as toLocalizedString2, Tooltip, useMediaQuery, useSidebars, useTranslation as useTranslation3 } from "@dxos/react-ui";
+import { Icon as Icon2, Popover, ScrollArea, toLocalizedString as toLocalizedString3, Tooltip, useMediaQuery, useSidebars, useTranslation as useTranslation4 } from "@dxos/react-ui";
 import { Tabs } from "@dxos/react-ui-tabs";
 import { mx as mx3 } from "@dxos/react-ui-theme";
 
@@ -341,10 +341,27 @@ var NavTreeContext = /* @__PURE__ */ createContext(null);
 var useNavTreeContext = () => useContext(NavTreeContext) ?? raise(new Error("NavTreeContext not found"));
 
 // packages/plugins/plugin-navtree/src/hooks.ts
+import { useEffect as useEffect2 } from "react";
+
+// packages/plugins/plugin-navtree/src/components/NavTreeDocumentTitle.tsx
 import { useEffect } from "react";
+import { toLocalizedString as toLocalizedString2, useTranslation as useTranslation3 } from "@dxos/react-ui";
+var NavTreeDocumentTitle = ({ node }) => {
+  const { t } = useTranslation3(NAVTREE_PLUGIN);
+  useEffect(() => {
+    document.title = node ? toLocalizedString2(node.properties.label, t) : t("current app name", {
+      ns: "appkit"
+    });
+  }, [
+    node?.properties?.label
+  ]);
+  return null;
+};
+
+// packages/plugins/plugin-navtree/src/hooks.ts
 var useLoadDescendents = (root) => {
   const { loadDescendents } = useNavTreeContext();
-  useEffect(() => {
+  useEffect2(() => {
     const frame = requestAnimationFrame(() => {
       if (root) {
         void loadDescendents?.(root);
@@ -407,7 +424,7 @@ var l0Breakpoints = {
   lg: "hidden lg:grid"
 };
 var L0Item = ({ item, parent, path, pinned }) => {
-  const { t } = useTranslation3(NAVTREE_PLUGIN);
+  const { t } = useTranslation4(NAVTREE_PLUGIN);
   const type = l0ItemType(item);
   const itemPath = useMemo2(() => [
     ...path,
@@ -416,7 +433,7 @@ var L0Item = ({ item, parent, path, pinned }) => {
     item.id,
     path
   ]);
-  const { getProps } = useNavTreeContext();
+  const { getProps, popoverAnchorId } = useNavTreeContext();
   const { id, testId } = getProps?.(item, path) ?? {};
   const Root = type === "collection" ? "h2" : type === "tab" ? Tabs.TabPrimitive : "button";
   const handleClick = useL0ItemClick({
@@ -437,37 +454,58 @@ var L0Item = ({ item, parent, path, pinned }) => {
   } : {
     onClick: handleClick
   };
-  const localizedString = toLocalizedString2(item.properties.label, t);
-  const avatarValue = useMemo2(() => type === "tab" ? getFirstTwoRenderableChars(localizedString).join("") : [], [
+  const localizedString = toLocalizedString3(item.properties.label, t);
+  const hue = item.properties.hue ?? null;
+  const avatarValue = useMemo2(() => type === "tab" ? getFirstTwoRenderableChars(localizedString).join("").toUpperCase() : [], [
     type,
     item.properties.label,
     t
   ]);
-  return /* @__PURE__ */ React5.createElement(Tooltip.Root, {
-    delayDuration: 0
-  }, /* @__PURE__ */ React5.createElement(Tooltip.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React5.createElement(Root, {
+  const hueFgStyle = hue && {
+    style: {
+      color: `var(--dx-${hue}SurfaceText)`
+    }
+  };
+  const l0ItemTrigger = /* @__PURE__ */ React5.createElement(Root, {
     ...rootProps,
     "data-type": type,
     className: mx3('group/l0i dx-focus-ring-group grid overflow-hidden relative data[type!="collection"]:cursor-pointer app-no-drag', l0Breakpoints[item.properties.l0Breakpoint])
   }, type !== "collection" && /* @__PURE__ */ React5.createElement("div", {
     role: "none",
-    className: mx3("absolute -z-[1] group-hover/l0i:bg-input dx-focus-ring-group-indicator transition-colors", type === "tab" || pinned ? "rounded" : "rounded-full", pinned ? "bg-transparent inset-inline-3 inset-block-0" : "bg-input inset-inline-3 inset-block-2")
+    className: mx3("absolute -z-[1] dx-focus-ring-group-indicator transition-colors", type === "tab" || pinned ? "rounded" : "rounded-full", pinned ? "bg-transparent group-hover/l0i:bg-groupSurface inset-inline-3 inset-block-0.5" : "bg-groupSurface inset-inline-3 inset-block-2"),
+    ...hue && {
+      style: {
+        background: `var(--dx-${hue}Surface)`
+      }
+    }
   }), /* @__PURE__ */ React5.createElement("div", {
     role: "none",
     className: "hidden group-aria-selected/l0i:block absolute inline-start-0 inset-block-4 is-1 bg-accentSurface rounded-ie"
-  }), type === "tab" && item.properties.disposition !== "pin-end" ? /* @__PURE__ */ React5.createElement("span", {
+  }), item.properties.icon && /* @__PURE__ */ React5.createElement(Icon2, {
+    icon: item.properties.icon,
+    size: pinned ? 5 : 7,
+    classNames: "place-self-center",
+    ...hueFgStyle
+  }) || (type === "tab" && item.properties.disposition !== "pin-end" ? /* @__PURE__ */ React5.createElement("span", {
     role: "img",
-    className: "place-self-center text-3xl font-light"
+    className: "place-self-center text-3xl font-light",
+    ...hueFgStyle
   }, avatarValue) : item.properties.icon && /* @__PURE__ */ React5.createElement(Icon2, {
-    icon: item.properties.icon,
+    icon: "ph--planet--regular",
     size: pinned ? 5 : 7,
-    classNames: "place-self-center"
-  }), /* @__PURE__ */ React5.createElement("span", {
+    classNames: "place-self-center",
+    ...hueFgStyle
+  })), /* @__PURE__ */ React5.createElement("span", {
     id: `${item.id}__label`,
     className: "sr-only"
-  }, localizedString))), /* @__PURE__ */ React5.createElement(Tooltip.Portal, null, /* @__PURE__ */ React5.createElement(Tooltip.Content, {
+  }, localizedString));
+  return popoverAnchorId === id ? /* @__PURE__ */ React5.createElement(Popover.Anchor, {
+    asChild: true
+  }, l0ItemTrigger) : /* @__PURE__ */ React5.createElement(Tooltip.Root, {
+    delayDuration: 0
+  }, /* @__PURE__ */ React5.createElement(Tooltip.Trigger, {
+    asChild: true
+  }, l0ItemTrigger), /* @__PURE__ */ React5.createElement(Tooltip.Portal, null, /* @__PURE__ */ React5.createElement(Tooltip.Content, {
     side: "right"
   }, localizedString, /* @__PURE__ */ React5.createElement(Tooltip.Arrow, null))));
 };
@@ -489,11 +527,7 @@ var L0Collection = ({ item, path, parent }) => {
     "aria-labelledby": `${item.id}__label`,
     "data-itemid": id,
     "data-testid": testId
-  }, /* @__PURE__ */ React5.createElement(L0Item, {
-    item,
-    parent,
-    path: groupPath
-  }), collectionItems.map((collectionItem) => /* @__PURE__ */ React5.createElement(L0Item, {
+  }, collectionItems.map((collectionItem) => /* @__PURE__ */ React5.createElement(L0Item, {
     key: collectionItem.id,
     item: collectionItem,
     parent: item,
@@ -502,10 +536,10 @@ var L0Collection = ({ item, path, parent }) => {
 };
 var L0Menu = ({ topLevelItems, pinnedItems, parent, path }) => {
   return /* @__PURE__ */ React5.createElement(Tabs.Tablist, {
-    classNames: "group/l0 absolute z-[1] inset-block-0 inline-start-0 rounded-is-lg grid grid-cols-[var(--l0-size)] grid-rows-[1fr_min-content_var(--l0-size)] contain-layout !is-[--l0-size] bg-baseSurface border-ie border-separator app-drag"
-  }, /* @__PURE__ */ React5.createElement("div", {
+    classNames: "group/l0 absolute z-[1] inset-block-0 inline-start-0 rounded-is-lg grid grid-cols-[var(--l0-size)] grid-rows-[1fr_min-content_var(--l0-size)] contain-layout !is-[--l0-size] bg-baseSurface border-ie border-separator app-drag  pbe-[env(safe-area-inset-bottom)]"
+  }, /* @__PURE__ */ React5.createElement(ScrollArea.Root, null, /* @__PURE__ */ React5.createElement(ScrollArea.Viewport, null, /* @__PURE__ */ React5.createElement("div", {
     role: "none",
-    className: 'grid auto-rows-[calc(var(--l0-size)-.5rem)] min-bs-0 !overflow-y-auto plb-1 [body[data-platform="darwin"]_&]:pbs-[calc(30px+0.25rem)]'
+    className: 'grid auto-rows-[calc(var(--l0-size)-.5rem)] plb-1 [body[data-platform="darwin"]_&]:pbs-[calc(30px+0.25rem)] [body[data-platform="ios"]_&]:pbs-[max(env(safe-area-inset-top),0.25rem)]'
   }, topLevelItems.map((item) => {
     if (l0ItemType(item) === "collection") {
       return /* @__PURE__ */ React5.createElement(L0Collection, {
@@ -522,7 +556,9 @@ var L0Menu = ({ topLevelItems, pinnedItems, parent, path }) => {
         path
       });
     }
-  })), /* @__PURE__ */ React5.createElement("div", {
+  })), /* @__PURE__ */ React5.createElement(ScrollArea.Scrollbar, {
+    orientation: "vertical"
+  }, /* @__PURE__ */ React5.createElement(ScrollArea.Thumb, null)))), /* @__PURE__ */ React5.createElement("div", {
     role: "none",
     className: "grid grid-cols-1 auto-rows-[--rail-action] pbs-2"
   }, pinnedItems.filter((item) => l0ItemType(item) !== "collection").map((item) => /* @__PURE__ */ React5.createElement(L0Item, {
@@ -546,18 +582,19 @@ var L0Menu = ({ topLevelItems, pinnedItems, parent, path }) => {
 // packages/plugins/plugin-navtree/src/components/L1Panels.tsx
 import React8, { useMemo as useMemo3 } from "react";
 import { useLayout } from "@dxos/app-framework";
-import { toLocalizedString as toLocalizedString5, useTranslation as useTranslation6 } from "@dxos/react-ui";
+import { IconButton as IconButton2, toLocalizedString as toLocalizedString6, useTranslation as useTranslation7 } from "@dxos/react-ui";
 import { Tree } from "@dxos/react-ui-list";
 import { Tabs as Tabs2 } from "@dxos/react-ui-tabs";
+import { hoverableControlItem as hoverableControlItem2, hoverableOpenControlItem as hoverableOpenControlItem2, mx as mx5 } from "@dxos/react-ui-theme";
 
 // packages/plugins/plugin-navtree/src/components/NavTreeItemColumns.tsx
 import React7, { Fragment, memo } from "react";
 import { isAction as isAction3 } from "@dxos/app-graph";
-import { Popover, toLocalizedString as toLocalizedString4, Treegrid, useTranslation as useTranslation5 } from "@dxos/react-ui";
+import { Popover as Popover2, toLocalizedString as toLocalizedString5, Treegrid, useTranslation as useTranslation6 } from "@dxos/react-ui";
 
 // packages/plugins/plugin-navtree/src/components/NavTreeItemAction.tsx
 import React6, { useRef } from "react";
-import { useTranslation as useTranslation4, toLocalizedString as toLocalizedString3, IconButton } from "@dxos/react-ui";
+import { useTranslation as useTranslation5, toLocalizedString as toLocalizedString4, IconButton } from "@dxos/react-ui";
 import { DropdownMenu, MenuProvider } from "@dxos/react-ui-menu";
 import { hoverableControlItem, hoverableOpenControlItem, mx as mx4 } from "@dxos/react-ui-theme";
 var fallbackIcon = "ph--placeholder--regular";
@@ -566,7 +603,7 @@ var actionButtonProps = {
   density: "fine"
 };
 var NavTreeItemActionDropdownMenu = ({ label, icon, testId, menuActions, onAction }) => {
-  const { t } = useTranslation4(NAVTREE_PLUGIN);
+  const { t } = useTranslation5(NAVTREE_PLUGIN);
   const suppressNextTooltip = useRef(false);
   return /* @__PURE__ */ React6.createElement(MenuProvider, {
     onAction
@@ -581,7 +618,7 @@ var NavTreeItemActionDropdownMenu = ({ label, icon, testId, menuActions, onActio
     variant: "ghost",
     icon: icon ?? fallbackIcon,
     iconOnly: true,
-    label: toLocalizedString3(label, t),
+    label: toLocalizedString4(label, t),
     "data-testid": testId,
     suppressNextTooltip
   }))));
@@ -613,9 +650,9 @@ var NavTreeItemMonolithicAction = ({ parent, properties: { disabled, caller, tes
   });
 };
 var NavTreeItemAction = ({ monolithic, menuActions, parent: node, ...props }) => {
-  const { t } = useTranslation4(NAVTREE_PLUGIN);
+  const { t } = useTranslation5(NAVTREE_PLUGIN);
   const monolithicAction = menuActions?.length === 1 && menuActions[0];
-  const baseLabel = toLocalizedString3(monolithicAction ? monolithicAction.properties.label : props.label, t);
+  const baseLabel = toLocalizedString4(monolithicAction ? monolithicAction.properties.label : props.label, t);
   return monolithic && menuActions?.length === 1 ? /* @__PURE__ */ React6.createElement(NavTreeItemMonolithicAction, {
     baseLabel,
     parent: node,
@@ -636,7 +673,7 @@ var NavTreeItemAction = ({ monolithic, menuActions, parent: node, ...props }) =>
 
 // packages/plugins/plugin-navtree/src/components/NavTreeItemColumns.tsx
 var NavTreeItemColumns = /* @__PURE__ */ memo(({ path, item, open }) => {
-  const { t } = useTranslation5(NAVTREE_PLUGIN);
+  const { t } = useTranslation6(NAVTREE_PLUGIN);
   const { getActions: getActions2, renderItemEnd: ItemEnd, popoverAnchorId } = useNavTreeContext();
   const level = path.length - 2;
   const { actions: _actions, groupedActions } = getActions2(item);
@@ -644,7 +681,7 @@ var NavTreeItemColumns = /* @__PURE__ */ memo(({ path, item, open }) => {
   const actions = (primaryAction?.properties?.disposition === "toolbar" ? secondaryActions : _actions).flatMap((action) => isAction3(action) ? [
     action
   ] : []).filter((action) => !action.properties?.hidden);
-  const ActionRoot = popoverAnchorId === `dxos.org/ui/${NAV_TREE_ITEM}/${item.id}` ? Popover.Anchor : Fragment;
+  const ActionRoot = popoverAnchorId === `dxos.org/ui/${NAV_TREE_ITEM}/${item.id}` ? Popover2.Anchor : Fragment;
   useLoadDescendents(item);
   useLoadDescendents(primaryAction && !isAction3(primaryAction) ? primaryAction : void 0);
   return /* @__PURE__ */ React7.createElement("div", {
@@ -652,7 +689,7 @@ var NavTreeItemColumns = /* @__PURE__ */ memo(({ path, item, open }) => {
     className: "contents app-no-drag"
   }, primaryAction?.properties?.disposition === "toolbar" && !primaryAction?.properties?.disabled ? /* @__PURE__ */ React7.createElement(NavTreeItemAction, {
     testId: primaryAction.properties?.testId,
-    label: toLocalizedString4(primaryAction.properties?.label, t),
+    label: toLocalizedString5(primaryAction.properties?.label, t),
     icon: primaryAction.properties?.icon ?? "ph--placeholder--regular",
     parent: item,
     monolithic: isAction3(primaryAction),
@@ -676,15 +713,15 @@ var NavTreeItemColumns = /* @__PURE__ */ memo(({ path, item, open }) => {
 });
 
 // packages/plugins/plugin-navtree/src/components/L1Panels.tsx
-var L1Panel = ({ item, path, currentItemId }) => {
+var L1Panel = ({ item, path, currentItemId, onBack }) => {
   const layout = useLayout();
   const navTreeContext = useNavTreeContext();
-  const { t } = useTranslation6(NAVTREE_PLUGIN);
+  const { t } = useTranslation7(NAVTREE_PLUGIN);
   return /* @__PURE__ */ React8.createElement(Tabs2.Tabpanel, {
     key: item.id,
     value: item.id,
     classNames: [
-      "absolute inset-block-0 inline-end-0 is-[calc(100%-var(--l0-size))] lg:is-[--l1-size] grid-cols-1 grid-rows-[var(--rail-size)_1fr]",
+      "absolute inset-block-0 inline-end-0 is-[calc(100%-var(--l0-size))] lg:is-[--l1-size] grid-cols-1 grid-rows-[var(--rail-size)_1fr] pbs-[env(safe-area-inset-top)]",
       item.id === currentItemId && "grid"
     ],
     tabIndex: -1,
@@ -693,9 +730,18 @@ var L1Panel = ({ item, path, currentItemId }) => {
     }
   }, item.id === currentItemId && /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement("h2", {
     className: "flex items-center border-be border-separator pis-4 app-drag"
-  }, /* @__PURE__ */ React8.createElement("span", {
+  }, item.properties.disposition === "pin-end" && /* @__PURE__ */ React8.createElement(IconButton2, {
+    label: t("back label"),
+    iconOnly: true,
+    icon: "ph--caret-left--regular",
+    size: 5,
+    density: "fine",
+    variant: "ghost",
+    classNames: mx5("shrink-0 mie-2", "pli-2 pointer-fine:pli-1", hoverableControlItem2, hoverableOpenControlItem2),
+    onClick: onBack
+  }), /* @__PURE__ */ React8.createElement("span", {
     className: "flex-1 truncate cursor-default"
-  }, toLocalizedString5(item.properties.label, t)), /* @__PURE__ */ React8.createElement(NavTreeItemColumns, {
+  }, toLocalizedString6(item.properties.label, t)), /* @__PURE__ */ React8.createElement(NavTreeItemColumns, {
     path,
     item,
     open: true
@@ -731,7 +777,7 @@ var L1PanelCollection = ({ item, path, currentItemId }) => {
     currentItemId
   })));
 };
-var L1Panels = ({ topLevelItems, path, currentItemId }) => {
+var L1Panels = ({ topLevelItems, path, currentItemId, onBack }) => {
   return /* @__PURE__ */ React8.createElement(React8.Fragment, null, topLevelItems.map((item) => {
     const type = l0ItemType(item);
     switch (type) {
@@ -747,7 +793,8 @@ var L1Panels = ({ topLevelItems, path, currentItemId }) => {
           key: item.id,
           item,
           path,
-          currentItemId
+          currentItemId,
+          onBack
         });
       default:
         return null;
@@ -758,8 +805,8 @@ var L1Panels = ({ topLevelItems, path, currentItemId }) => {
 // packages/plugins/plugin-navtree/src/components/NavTree.tsx
 var NAV_TREE_ITEM = "NavTreeItem";
 var NavTree = ({ id, root }) => {
-  const { getItems, tab } = useNavTreeContext();
-  const topLevelActions = getItems(root, "item");
+  const { tab, getItems, onBack } = useNavTreeContext();
+  const topLevelActions = getItems(root, "item").toSorted((a, b) => byPosition(a.properties, b.properties));
   const topLevelCollections = getItems(root, "collection");
   const topLevelWorkspaces = getItems(root, "workspace");
   const topLevelNavigation = getItems(root, "navigation");
@@ -803,7 +850,8 @@ var NavTree = ({ id, root }) => {
     }), /* @__PURE__ */ React9.createElement(L1Panels, {
       topLevelItems,
       path,
-      currentItemId: tab
+      currentItemId: tab,
+      onBack
     }))
   );
 };
@@ -813,8 +861,8 @@ import { lazy } from "@dxos/app-framework";
 var AppGraphBuilder = lazy(() => import("./app-graph-builder-BL7LRXCM.mjs"));
 var IntentResolver = lazy(() => import("./intent-resolver-U25VBFH3.mjs"));
 var Keyboard2 = lazy(() => import("./keyboard-MUBRTPI5.mjs"));
-var ReactSurface = lazy(() => import("./react-surface-6ZP5XUTS.mjs"));
-var State = lazy(() => import("./state-65TQKYX7.mjs"));
+var ReactSurface = lazy(() => import("./react-surface-SIEGT4YS.mjs"));
+var State = lazy(() => import("./state-IEFQTUPG.mjs"));
 
 // packages/plugins/plugin-navtree/src/components/NavTreeContainer.tsx
 var NODE_TYPE = "dxos/app-graph/node";
@@ -842,7 +890,7 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
     return graph.nodes(node ?? graph.root, {
       filter: (node2) => {
         return untracked(() => {
-          const action = isActionLike2(node2);
+          const action = isAction4(node2);
           if (!disposition) {
             return !action || node2.properties.disposition === "item";
           }
@@ -862,7 +910,7 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
       parentOf,
       icon: node.properties.icon,
       disabled: node.properties.disabled,
-      className: mx5(node.properties.modified && "italic", node.properties.className),
+      className: mx6(node.properties.modified && "italic", node.properties.className),
       headingClassName: node.properties.headingClassName,
       testId: node.properties.testId
     };
@@ -899,7 +947,7 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
     }));
     if (layout.active.length === 0) {
       const [item] = getItems(node).filter((node2) => !isActionLike2(node2));
-      if (item) {
+      if (item && item.data) {
         await dispatch(createIntent5(LayoutAction4.Open, {
           part: "main",
           subject: [
@@ -982,7 +1030,15 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
     isCurrent,
     isLg
   ]);
-  useEffect2(() => {
+  const onBack = useCallback2(() => dispatch(createIntent5(LayoutAction4.RevertWorkspace, {
+    part: "workspace",
+    options: {
+      revert: true
+    }
+  })), [
+    dispatch
+  ]);
+  useEffect3(() => {
     return monitorForElements({
       canMonitor: ({ source }) => isTreeData(source.data),
       onDrop: ({ location, source }) => {
@@ -1035,6 +1091,7 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
   const navTreeContextValue = useMemo5(() => ({
     tab,
     onTabChange,
+    onBack,
     getActions: getActions2,
     loadDescendents,
     renderItemEnd,
@@ -1050,6 +1107,7 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
   }), [
     tab,
     onTabChange,
+    onBack,
     getActions2,
     loadDescendents,
     renderItemEnd,
@@ -1071,21 +1129,6 @@ var NavTreeContainer = /* @__PURE__ */ memo2(({ tab, popoverAnchorId, topbar })
   }));
 });
 
-// packages/plugins/plugin-navtree/src/components/NavTreeDocumentTitle.tsx
-import { useEffect as useEffect3 } from "react";
-import { toLocalizedString as toLocalizedString6, useTranslation as useTranslation7 } from "@dxos/react-ui";
-var NavTreeDocumentTitle = ({ node }) => {
-  const { t } = useTranslation7(NAVTREE_PLUGIN);
-  useEffect3(() => {
-    document.title = node ? toLocalizedString6(node.properties.label, t) : t("current app name", {
-      ns: "appkit"
-    });
-  }, [
-    node?.properties?.label
-  ]);
-  return null;
-};
-
 export {
   CommandsDialogContent,
   CommandsTrigger,
@@ -1110,4 +1153,4 @@ export {
   ReactSurface,
   State
 };
-//# sourceMappingURL=chunk-EO6JEADO.mjs.map
+//# sourceMappingURL=chunk-7OKF4GP3.mjs.map