@dxos/plugin-space 0.7.5-labs.a279d8c → 0.7.5-labs.c0e040f

package/dist/lib/node/{chunk-VCPICVIE.cjs → chunk-4AZ2DD4G.cjs}

@@ -26,8 +26,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var chunk_VCPICVIE_exports = {};
-__export(chunk_VCPICVIE_exports, {
+var chunk_4AZ2DD4G_exports = {};
+__export(chunk_4AZ2DD4G_exports, {
   AdvancedObjectSettings: () => AdvancedObjectSettings,
   AppGraphBuilder: () => AppGraphBuilder,
   AppGraphSerializer: () => AppGraphSerializer,
@@ -69,11 +69,11 @@ __export(chunk_VCPICVIE_exports, {
   SyncStatusDetail: () => SyncStatusDetail,
   SyncStatusIndicator: () => SyncStatusIndicator
 });
-module.exports = __toCommonJS(chunk_VCPICVIE_exports);
-var import_chunk_56NGXG2A = require("./chunk-56NGXG2A.cjs");
-var import_chunk_Z34MTEU7 = require("./chunk-Z34MTEU7.cjs");
-var import_chunk_DDZYVNVP = require("./chunk-DDZYVNVP.cjs");
-var import_chunk_AO4EW2RX = require("./chunk-AO4EW2RX.cjs");
+module.exports = __toCommonJS(chunk_4AZ2DD4G_exports);
+var import_chunk_UX3U4RU2 = require("./chunk-UX3U4RU2.cjs");
+var import_chunk_SYVPVU3K = require("./chunk-SYVPVU3K.cjs");
+var import_chunk_6MEOP3DH = require("./chunk-6MEOP3DH.cjs");
+var import_chunk_WZR6OAN3 = require("./chunk-WZR6OAN3.cjs");
 var import_react = __toESM(require("react"));
 var import_echo_schema = require("@dxos/echo-schema");
 var import_echo = require("@dxos/react-client/echo");
@@ -99,39 +99,40 @@ var import_react_ui5 = require("@dxos/react-ui");
 var import_react7 = __toESM(require("react"));
 var import_app_framework3 = require("@dxos/app-framework");
 var import_echo_schema2 = require("@dxos/echo-schema");
-var import_echo4 = require("@dxos/react-client/echo");
 var import_react_ui6 = require("@dxos/react-ui");
 var import_react_ui_form2 = require("@dxos/react-ui-form");
 var import_react_ui_searchlist = require("@dxos/react-ui-searchlist");
+var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_util = require("@dxos/util");
+var import_effect2 = require("effect");
 var import_react8 = __toESM(require("react"));
 var import_app_framework4 = require("@dxos/app-framework");
 var import_react_ui7 = require("@dxos/react-ui");
 var import_react_ui_form3 = require("@dxos/react-ui-form");
 var import_react9 = __toESM(require("react"));
 var import_react_ui8 = require("@dxos/react-ui");
-var import_react_ui_theme2 = require("@dxos/react-ui-theme");
+var import_react_ui_theme3 = require("@dxos/react-ui-theme");
 var import_react10 = __toESM(require("react"));
 var import_react_ui9 = require("@dxos/react-ui");
 var import_react11 = __toESM(require("react"));
 var import_app_framework5 = require("@dxos/app-framework");
-var import_plugin_graph = require("@dxos/plugin-graph");
+var import_log = require("@dxos/log");
 var import_types = require("@dxos/plugin-observability/types");
-var import_echo5 = require("@dxos/react-client/echo");
+var import_react_client3 = require("@dxos/react-client");
 var import_react_ui10 = require("@dxos/react-ui");
 var import_react12 = require("@dxos/shell/react");
 var import_react13 = require("@phosphor-icons/react");
 var import_react14 = __toESM(require("react"));
-var import_echo6 = require("@dxos/client/echo");
-var import_react_client3 = require("@dxos/react-client");
+var import_echo4 = require("@dxos/client/echo");
+var import_react_client4 = require("@dxos/react-client");
 var import_react_ui11 = require("@dxos/react-ui");
 var import_react15 = require("@phosphor-icons/react");
 var import_react16 = __toESM(require("react"));
 var import_async = require("@dxos/async");
 var import_react_ui12 = require("@dxos/react-ui");
-var import_react_ui_theme3 = require("@dxos/react-ui-theme");
+var import_react_ui_theme4 = require("@dxos/react-ui-theme");
 var import_react17 = __toESM(require("react"));
-var import_log = require("@dxos/log");
+var import_log2 = require("@dxos/log");
 var import_react_ui13 = require("@dxos/react-ui");
 var import_react18 = __toESM(require("react"));
 var import_react_ui14 = require("@dxos/react-ui");
@@ -141,9 +142,8 @@ var import_react_ui15 = require("@dxos/react-ui");
 var import_react20 = __toESM(require("react"));
 var import_app_framework7 = require("@dxos/app-framework");
 var import_display_name = require("@dxos/display-name");
-var import_plugin_graph2 = require("@dxos/plugin-graph");
-var import_react_client4 = require("@dxos/react-client");
-var import_echo7 = require("@dxos/react-client/echo");
+var import_react_client5 = require("@dxos/react-client");
+var import_echo5 = require("@dxos/react-client/echo");
 var import_halo = require("@dxos/react-client/halo");
 var import_react_ui16 = require("@dxos/react-ui");
 var import_react_ui_attention = require("@dxos/react-ui-attention");
@@ -154,37 +154,38 @@ var import_react22 = __toESM(require("react"));
 var import_react_ui17 = require("@dxos/react-ui");
 var import_react_ui_form4 = require("@dxos/react-ui-form");
 var import_react23 = __toESM(require("react"));
-var import_log2 = require("@dxos/log");
+var import_log3 = require("@dxos/log");
 var import_metadata = require("@dxos/protocols/proto/dxos/echo/metadata");
-var import_react_client5 = require("@dxos/react-client");
+var import_react_client6 = require("@dxos/react-client");
 var import_react_ui18 = require("@dxos/react-ui");
 var import_react_ui_form5 = require("@dxos/react-ui-form");
-var import_react_ui_theme4 = require("@dxos/react-ui-theme");
+var import_react_ui_pickers = require("@dxos/react-ui-pickers");
 var import_react24 = __toESM(require("react"));
-var import_react_client6 = require("@dxos/react-client");
+var import_app_framework9 = require("@dxos/app-framework");
+var import_react_client7 = require("@dxos/react-client");
 var import_react_ui19 = require("@dxos/react-ui");
 var import_react_ui_tabs = require("@dxos/react-ui-tabs");
 var import_react25 = require("@dxos/shell/react");
 var import_react26 = __toESM(require("react"));
-var import_plugin_graph3 = require("@dxos/plugin-graph");
+var import_app_framework10 = require("@dxos/app-framework");
 var import_services = require("@dxos/protocols/proto/dxos/client/services");
 var import_metadata2 = require("@dxos/protocols/proto/dxos/echo/metadata");
-var import_react_client7 = require("@dxos/react-client");
+var import_react_client8 = require("@dxos/react-client");
 var import_react_ui20 = require("@dxos/react-ui");
 var import_react_ui_attention2 = require("@dxos/react-ui-attention");
 var import_react27 = require("react");
 var import_context = require("@dxos/context");
 var import_protocols = require("@dxos/protocols");
-var import_react_client8 = require("@dxos/react-client");
+var import_react_client9 = require("@dxos/react-client");
 var import_react28 = __toESM(require("react"));
 var import_plugin_status_bar = require("@dxos/plugin-status-bar");
-var import_react_client9 = require("@dxos/react-client");
+var import_react_client10 = require("@dxos/react-client");
 var import_react_ui21 = require("@dxos/react-ui");
 var import_react_ui_syntax_highlighter = require("@dxos/react-ui-syntax-highlighter");
 var import_react_ui_theme5 = require("@dxos/react-ui-theme");
 var import_react29 = __toESM(require("react"));
-var import_react_client10 = require("@dxos/react-client");
-var import_echo8 = require("@dxos/react-client/echo");
+var import_react_client11 = require("@dxos/react-client");
+var import_echo6 = require("@dxos/react-client/echo");
 var import_react_ui22 = require("@dxos/react-ui");
 var import_react_ui_theme6 = require("@dxos/react-ui-theme");
 var import_context2 = require("@dxos/context");
@@ -198,7 +199,7 @@ var ForeignKeys = ({ keys, onDelete }) => {
   })));
 };
 var KeyItem = ({ forignKey, onDelete }) => {
-  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const handleDelete = (0, import_react2.useCallback)(() => {
     onDelete?.(forignKey);
   }, [
@@ -224,7 +225,7 @@ var initialValues = {
   id: ""
 };
 var AdvancedObjectSettings = ({ object }) => {
-  const { t } = (0, import_react_ui.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const [adding, setAdding] = (0, import_react.useState)(false);
   const keys = (0, import_echo.getMeta)(object).keys;
   const handleNew = (0, import_react.useCallback)(() => setAdding(true), []);
@@ -275,9 +276,9 @@ var AwaitingObject = ({ id }) => {
   const [open, setOpen] = (0, import_react4.useState)(true);
   const [waiting, setWaiting] = (0, import_react4.useState)(true);
   const [found, setFound] = (0, import_react4.useState)(false);
-  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const { dispatchPromise: dispatch } = (0, import_app_framework.useIntentDispatcher)();
-  const location = (0, import_app_framework.useCapability)(import_app_framework.Capabilities.Location);
+  const layout = (0, import_app_framework.useLayout)();
   const client = (0, import_react_client.useClient)();
   const objects = (0, import_echo2.useQuery)(client.spaces, import_echo2.Filter.all());
   (0, import_react4.useEffect)(() => {
@@ -294,27 +295,26 @@ var AwaitingObject = ({ id }) => {
   (0, import_react4.useEffect)(() => {
     if (objects.findIndex((object) => (0, import_echo2.fullyQualifiedId)(object) === id) > -1) {
       setFound(true);
-      if (location.active.solo?.[0].id === id) {
+      if (layout.active.includes(id)) {
         setOpen(false);
       }
     }
   }, [
     id,
     objects,
-    location
+    layout
   ]);
-  const handleClose = (0, import_react4.useCallback)(async () => dispatch((0, import_app_framework.createIntent)(import_chunk_DDZYVNVP.SpaceAction.WaitForObject, {
+  const handleClose = (0, import_react4.useCallback)(async () => dispatch((0, import_app_framework.createIntent)(import_chunk_6MEOP3DH.SpaceAction.WaitForObject, {
     id: void 0
   })), [
     dispatch
   ]);
   const handleNavigate = (0, import_react4.useCallback)(() => {
-    void dispatch((0, import_app_framework.createIntent)(import_app_framework.NavigationAction.Open, {
-      activeParts: {
-        main: [
-          id
-        ]
-      }
+    void dispatch((0, import_app_framework.createIntent)(import_app_framework.LayoutAction.Open, {
+      part: "main",
+      subject: [
+        id
+      ]
     }));
     void handleClose();
   }, [
@@ -355,15 +355,22 @@ var AwaitingObject = ({ id }) => {
   })))));
 };
 var BaseObjectSettings = ({ object }) => {
-  const { t } = (0, import_react_ui4.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui4.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const inputRef = import_react5.default.useRef(null);
   return /* @__PURE__ */ import_react5.default.createElement("div", {
     role: "form",
     className: "flex flex-col w-full p-2 gap-1"
   }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui4.Input.Root, null, /* @__PURE__ */ import_react5.default.createElement(import_react_ui4.Input.Label, null, t("name label")), /* @__PURE__ */ import_react5.default.createElement(import_react_ui4.Input.TextInput, {
+    ref: inputRef,
     placeholder: t("name placeholder"),
     value: object.name ?? "",
     onChange: (event) => {
       object.name = event.target.value;
+    },
+    onKeyDown: (event) => {
+      if (event.key === "Enter") {
+        inputRef.current?.blur();
+      }
     }
   })));
 };
@@ -391,14 +398,22 @@ var useInputSurfaceLookup = (baseData) => {
     baseData
   ]);
 };
-var CreateObjectPanel = ({ schemas, spaces, typename: initialTypename, target: initialTarget, name: initialName, defaultSpaceId, resolve, onCreateObject }) => {
-  const { t } = (0, import_react_ui6.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+var CreateObjectPanel = ({ classNames, schemas, spaces, typename: initialTypename, target: initialTarget, name: initialName, defaultSpaceId, resolve, onCreateObject }) => {
+  const { t } = (0, import_react_ui6.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const [typename, setTypename] = (0, import_react7.useState)(initialTypename);
   const [target, setTarget] = (0, import_react7.useState)(initialTarget);
   const schema = schemas.find((schema2) => (0, import_echo_schema2.getObjectAnnotation)(schema2)?.typename === typename);
-  const options = schemas.map(import_echo_schema2.getObjectAnnotation).filter(import_util.nonNullable);
-  const handleClearSchema = (0, import_react7.useCallback)(() => setTypename(void 0), []);
-  const handleClearTarget = (0, import_react7.useCallback)(() => setTarget(void 0), []);
+  const options = schemas.map(import_echo_schema2.getObjectAnnotation).filter(import_util.isNonNullable).sort((a, b) => {
+    const nameA = t("typename label", {
+      ns: a.typename,
+      defaultValue: a.typename
+    });
+    const nameB = t("typename label", {
+      ns: b.typename,
+      defaultValue: b.typename
+    });
+    return nameA.localeCompare(nameB);
+  });
   const handleCreateObject = (0, import_react7.useCallback)(async (props) => {
     if (!schema || !target) {
       return;
@@ -422,55 +437,6 @@ var CreateObjectPanel = ({ schemas, spaces, typename: initialTypename, target: i
     resolve,
     typename
   ]);
-  const schemaInput = /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Root, {
-    label: t("schema input label"),
-    classNames: "flex flex-col grow overflow-hidden"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Input, {
-    autoFocus: true,
-    "data-testid": "create-object-form.schema-input",
-    placeholder: t("schema input placeholder"),
-    classNames: "px-1 my-2"
-  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Content, {
-    classNames: "max-bs-[24rem] overflow-auto"
-  }, options.map((option) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Item, {
-    key: option.typename,
-    value: t("typename label", {
-      ns: option.typename,
-      defaultValue: option.typename
-    }),
-    onSelect: () => setTypename(option.typename),
-    classNames: "flex items-center gap-2"
-  }, /* @__PURE__ */ import_react7.default.createElement("span", {
-    className: "flex gap-2 items-center grow truncate"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Icon, {
-    icon: resolve?.(option.typename).icon ?? "ph--placeholder--regular",
-    size: 5
-  }), t("typename label", {
-    ns: option.typename,
-    defaultValue: option.typename
-  }))))));
-  const spaceInput = /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Root, {
-    label: t("space input label"),
-    classNames: "flex flex-col grow overflow-hidden"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Input, {
-    autoFocus: true,
-    "data-testid": "create-object-form.space-input",
-    placeholder: t("space input placeholder"),
-    classNames: "px-1 my-2"
-  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Content, {
-    classNames: "max-bs-[24rem] overflow-auto"
-  }, spaces.map((space) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Item, {
-    key: space.id,
-    value: (0, import_react_ui6.toLocalizedString)((0, import_chunk_Z34MTEU7.getSpaceDisplayName)(space, {
-      personal: space.id === defaultSpaceId
-    }), t),
-    onSelect: () => setTarget(space),
-    classNames: "flex items-center gap-2"
-  }, /* @__PURE__ */ import_react7.default.createElement("span", {
-    className: "grow truncate"
-  }, (0, import_react_ui6.toLocalizedString)((0, import_chunk_Z34MTEU7.getSpaceDisplayName)(space, {
-    personal: space.id === defaultSpaceId
-  }), t))))));
   const inputSurfaceLookup = useInputSurfaceLookup({
     target
   });
@@ -479,6 +445,7 @@ var CreateObjectPanel = ({ schemas, spaces, typename: initialTypename, target: i
       name: import_echo_schema2.S.optional(import_echo_schema2.S.String)
     });
     return /* @__PURE__ */ import_react7.default.createElement(import_react_ui_form2.Form, {
+      classNames: "!p-0",
       autoFocus: true,
       values: {
         name: initialName
@@ -495,49 +462,89 @@ var CreateObjectPanel = ({ schemas, spaces, typename: initialTypename, target: i
   ]);
   return /* @__PURE__ */ import_react7.default.createElement("div", {
     role: "form",
-    className: "flex flex-col gap-2"
-  }, target && /* @__PURE__ */ import_react7.default.createElement("div", {
-    role: "none"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Input.Root, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_form2.InputHeader, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Input.Label, null, t((0, import_echo4.isSpace)(target) ? "creating in space label" : "creating in collection label"))), /* @__PURE__ */ import_react7.default.createElement("div", {
-    role: "none",
-    className: "flex gap-2"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Input.TextInput, {
-    disabled: true,
-    value: (0, import_echo4.isSpace)(target) ? (0, import_react_ui6.toLocalizedString)((0, import_chunk_Z34MTEU7.getSpaceDisplayName)(target, {
-      personal: target.id === defaultSpaceId
-    }), t) : target.name || t("unnamed collection label")
-  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.IconButton, {
-    iconOnly: true,
-    icon: "ph--x--regular",
-    label: t("clear input label"),
-    onClick: handleClearTarget
-  })))), schema && /* @__PURE__ */ import_react7.default.createElement("div", {
-    role: "none"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Input.Root, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_form2.InputHeader, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Input.Label, null, t("creating object type label"))), /* @__PURE__ */ import_react7.default.createElement("div", {
-    role: "none",
-    className: "flex gap-2"
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Input.TextInput, {
-    disabled: true,
+    className: (0, import_react_ui_theme2.mx)("flex flex-col gap-2", classNames)
+  }, !schema ? /* @__PURE__ */ import_react7.default.createElement(SelectSchema, {
+    options,
+    resolve,
+    onChange: setTypename
+  }) : !target ? /* @__PURE__ */ import_react7.default.createElement(SelectSpace, {
+    spaces,
+    defaultSpaceId,
+    onChange: setTarget
+  }) : form);
+};
+var SelectSpace = ({ spaces, defaultSpaceId, onChange }) => {
+  const { t } = (0, import_react_ui6.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  return /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Root, {
+    label: t("space input label"),
+    classNames: "flex flex-col grow overflow-hidden"
+  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Input, {
+    autoFocus: true,
+    "data-testid": "create-object-form.space-input",
+    placeholder: t("space input placeholder"),
+    classNames: "px-1 my-2"
+  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Content, {
+    classNames: "max-bs-[24rem] overflow-auto"
+  }, spaces.sort((a, b) => {
+    const aName = (0, import_react_ui6.toLocalizedString)((0, import_chunk_SYVPVU3K.getSpaceDisplayName)(a, {
+      personal: a.id === defaultSpaceId
+    }), t);
+    const bName = (0, import_react_ui6.toLocalizedString)((0, import_chunk_SYVPVU3K.getSpaceDisplayName)(b, {
+      personal: b.id === defaultSpaceId
+    }), t);
+    return aName.localeCompare(bName);
+  }).map((space) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Item, {
+    key: space.id,
+    value: (0, import_react_ui6.toLocalizedString)((0, import_chunk_SYVPVU3K.getSpaceDisplayName)(space, {
+      personal: space.id === defaultSpaceId
+    }), t),
+    onSelect: () => onChange(space),
+    classNames: "flex items-center gap-2"
+  }, /* @__PURE__ */ import_react7.default.createElement("span", {
+    className: "grow truncate"
+  }, (0, import_react_ui6.toLocalizedString)((0, import_chunk_SYVPVU3K.getSpaceDisplayName)(space, {
+    personal: space.id === defaultSpaceId
+  }), t))))));
+};
+var SelectSchema = ({ options, resolve, onChange }) => {
+  const { t } = (0, import_react_ui6.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  return /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Root, {
+    label: t("schema input label"),
+    classNames: "flex flex-col grow overflow-hidden"
+  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Input, {
+    autoFocus: true,
+    "data-testid": "create-object-form.schema-input",
+    placeholder: t("schema input placeholder"),
+    classNames: "px-1 my-2"
+  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Content, {
+    classNames: "max-bs-[24rem] overflow-auto"
+  }, options.map((option) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui_searchlist.SearchList.Item, {
+    key: option.typename,
     value: t("typename label", {
-      ns: schema.typename,
-      defaultValue: schema.typename
-    })
-  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.IconButton, {
-    iconOnly: true,
-    icon: "ph--x--regular",
-    label: t("clear input label"),
-    onClick: handleClearSchema
-  })))), !schema ? schemaInput : !target ? spaceInput : form);
+      ns: option.typename,
+      defaultValue: option.typename
+    }),
+    onSelect: () => onChange(option.typename),
+    classNames: "flex items-center gap-2"
+  }, /* @__PURE__ */ import_react7.default.createElement("span", {
+    className: "flex gap-2 items-center grow truncate"
+  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui6.Icon, {
+    icon: resolve?.(option.typename).icon ?? "ph--placeholder--regular",
+    size: 5
+  }), t("typename label", {
+    ns: option.typename,
+    defaultValue: option.typename
+  }))))));
 };
-var CREATE_OBJECT_DIALOG = `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/CreateObjectDialog`;
+var CREATE_OBJECT_DIALOG = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/CreateObjectDialog`;
 var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _shouldNavigate, resolve }) => {
   const closeRef = (0, import_react6.useRef)(null);
-  const { t } = (0, import_react_ui5.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui5.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const client = (0, import_react_client2.useClient)();
   const spaces = (0, import_echo3.useSpaces)();
   const { dispatchPromise: dispatch } = (0, import_app_framework2.useIntentDispatcher)();
   const handleCreateObject = (0, import_react6.useCallback)(async ({ schema, target: _target, data }) => {
-    const target2 = (0, import_echo3.isSpace)(_target) ? _target.properties[import_chunk_DDZYVNVP.CollectionType.typename]?.target : _target;
+    const target2 = (0, import_echo3.isSpace)(_target) ? _target.properties[import_chunk_6MEOP3DH.CollectionType.typename]?.target : _target;
     const createObjectIntent = resolve?.(schema.typename)?.createObject;
     if (!createObjectIntent || !target2) {
       return;
@@ -549,13 +556,15 @@ var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _sh
     }));
     const object = result.data?.object;
     if ((0, import_echo3.isReactiveObject)(object)) {
-      const addObjectIntent = (0, import_app_framework2.createIntent)(import_chunk_DDZYVNVP.SpaceAction.AddObject, {
+      const addObjectIntent = (0, import_app_framework2.createIntent)(import_chunk_6MEOP3DH.SpaceAction.AddObject, {
         target: target2,
         object
       });
       const shouldNavigate = _shouldNavigate ?? (() => true);
       if (shouldNavigate(object)) {
-        await dispatch((0, import_effect.pipe)(addObjectIntent, (0, import_app_framework2.chain)(import_app_framework2.NavigationAction.Open, {})));
+        await dispatch((0, import_effect.pipe)(addObjectIntent, (0, import_app_framework2.chain)(import_app_framework2.LayoutAction.Open, {
+          part: "main"
+        })));
       } else {
         await dispatch(addObjectIntent);
       }
@@ -568,7 +577,7 @@ var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _sh
     // TODO(wittjosiah): The tablist dialog pattern is copied from @dxos/plugin-manager.
     //  Consider factoring it out to the tabs package.
     /* @__PURE__ */ import_react6.default.createElement(import_react_ui5.Dialog.Content, {
-      classNames: "p-0 bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
+      classNames: "p-0 bs-content max-bs-full md:max-is-[40rem] overflow-hidden"
     }, /* @__PURE__ */ import_react6.default.createElement("div", {
       role: "none",
       className: "flex justify-between pbs-2 pis-2 pie-2 @md:pbs-4 @md:pis-4 @md:pie-4"
@@ -582,9 +591,8 @@ var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _sh
     }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui5.Icon, {
       icon: "ph--x--regular",
       size: 4
-    })))), /* @__PURE__ */ import_react6.default.createElement("div", {
-      className: "p-4"
-    }, /* @__PURE__ */ import_react6.default.createElement(CreateObjectPanel, {
+    })))), /* @__PURE__ */ import_react6.default.createElement(CreateObjectPanel, {
+      classNames: "p-4",
       schemas,
       spaces,
       target,
@@ -593,25 +601,29 @@ var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _sh
       defaultSpaceId: client.spaces.default.id,
       resolve,
       onCreateObject: handleCreateObject
-    })))
+    }))
   );
 };
-var CREATE_SPACE_DIALOG = `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/CreateSpaceDialog`;
+var CREATE_SPACE_DIALOG = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/CreateSpaceDialog`;
 var initialValues2 = {
   edgeReplication: true
 };
 var CreateSpaceDialog = () => {
   const closeRef = (0, import_react8.useRef)(null);
-  const { t } = (0, import_react_ui7.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
-  const { dispatchPromise: dispatch } = (0, import_app_framework4.useIntentDispatcher)();
+  const { t } = (0, import_react_ui7.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const { dispatch } = (0, import_app_framework4.useIntentDispatcher)();
   const handleCreateSpace = (0, import_react8.useCallback)(async (data) => {
-    const result = await dispatch((0, import_app_framework4.createIntent)(import_chunk_DDZYVNVP.SpaceAction.Create, data));
-    const target = result.data?.space;
-    if (target) {
-      await dispatch((0, import_app_framework4.createIntent)(import_chunk_DDZYVNVP.SpaceAction.OpenCreateObject, {
-        target
+    const program = import_effect2.Effect.gen(function* () {
+      const { space } = yield* dispatch((0, import_app_framework4.createIntent)(import_chunk_6MEOP3DH.SpaceAction.Create, data));
+      yield* dispatch((0, import_app_framework4.createIntent)(import_app_framework4.LayoutAction.SwitchWorkspace, {
+        part: "workspace",
+        subject: space.id
       }));
-    }
+      yield* dispatch((0, import_app_framework4.createIntent)(import_chunk_6MEOP3DH.SpaceAction.OpenCreateObject, {
+        target: space
+      }));
+    });
+    await import_effect2.Effect.runPromise(program);
   }, [
     dispatch
   ]);
@@ -619,7 +631,7 @@ var CreateSpaceDialog = () => {
     // TODO(wittjosiah): The tablist dialog pattern is copied from @dxos/plugin-manager.
     //  Consider factoring it out to the tabs package.
     /* @__PURE__ */ import_react8.default.createElement(import_react_ui7.Dialog.Content, {
-      classNames: "p-0 bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
+      classNames: "p-0 bs-content min-bs-[16rem] max-bs-full md:max-is-[32rem] overflow-hidden"
     }, /* @__PURE__ */ import_react8.default.createElement("div", {
       role: "none",
       className: "flex justify-between pbs-2 pis-2 pie-2 @md:pbs-4 @md:pis-4 @md:pie-4"
@@ -637,56 +649,83 @@ var CreateSpaceDialog = () => {
       className: "p-4"
     }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui_form3.Form, {
       testId: "create-space-form",
+      classNames: "!p-0",
+      autoFocus: true,
       values: initialValues2,
-      schema: import_chunk_DDZYVNVP.SpaceForm,
+      schema: import_chunk_6MEOP3DH.SpaceForm,
       onSave: handleCreateSpace
     })))
   );
 };
 var CollectionMain = ({ collection }) => {
-  const { t } = (0, import_react_ui8.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui8.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   return /* @__PURE__ */ import_react9.default.createElement("div", {
     role: "none",
-    className: (0, import_react_ui_theme2.mx)(import_react_ui_theme2.baseSurface, "min-bs-screen is-full flex items-center justify-center p-8"),
+    className: (0, import_react_ui_theme3.mx)(import_react_ui_theme3.baseSurface, "min-bs-screen is-full flex items-center justify-center p-8"),
     "data-testid": "composer.firstRunMessage"
   }, /* @__PURE__ */ import_react9.default.createElement("p", {
     role: "alert",
-    className: (0, import_react_ui_theme2.mx)(import_react_ui_theme2.descriptionText, "border border-dashed border-neutral-400/50 rounded-lg p-8 font-normal text-lg max-is-[24rem] break-words")
+    className: (0, import_react_ui_theme3.mx)(import_react_ui_theme3.descriptionText, "border border-dashed border-neutral-400/50 rounded-lg p-8 font-normal text-lg max-is-[24rem] break-words")
   }, collection.name ?? t("unnamed collection label")));
 };
 var CollectionSection = ({ collection }) => {
-  const { t } = (0, import_react_ui9.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui9.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   return /* @__PURE__ */ import_react10.default.createElement("div", {
     className: "min-bs-[3.5rem] grid grid-rows-subgrid grid-cols-subgrid items-center"
   }, /* @__PURE__ */ import_react10.default.createElement("span", {
     className: "truncate"
   }, collection.name ?? t("unnamed collection label")));
 };
-var JOIN_DIALOG = `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/JoinDialog`;
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/JoinDialog.tsx";
+var JOIN_DIALOG = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/JoinDialog`;
 var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
-  const { t } = (0, import_react_ui10.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
   const { dispatchPromise: dispatch } = (0, import_app_framework5.useIntentDispatcher)();
-  const spaces = (0, import_echo5.useSpaces)();
-  const { graph } = (0, import_plugin_graph.useGraph)();
+  const client = (0, import_react_client3.useClient)();
+  const { graph } = (0, import_app_framework5.useAppGraph)();
   const handleDone = (0, import_react11.useCallback)(async (result) => {
     if (result?.spaceKey) {
       await Promise.all([
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.SetLayout, {
-          element: "toast",
+        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.AddToast, {
+          part: "toast",
           subject: {
-            id: `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/join-success`,
+            id: `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/join-success`,
             duration: 5e3,
-            title: t("join success label"),
-            closeLabel: t("dismiss label")
+            title: [
+              "join success label",
+              {
+                ns: import_chunk_WZR6OAN3.SPACE_PLUGIN
+              }
+            ],
+            closeLabel: [
+              "dismiss label",
+              {
+                ns: import_chunk_WZR6OAN3.SPACE_PLUGIN
+              }
+            ]
           }
         })),
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.SetLayout, {
-          element: "dialog",
-          state: false
+        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.UpdateDialog, {
+          part: "dialog",
+          options: {
+            state: false
+          }
         }))
       ]);
     }
-    const space = spaces.find(({ key }) => result?.spaceKey?.equals(key));
+    const space = result?.spaceKey ? client.spaces.get(result.spaceKey) : void 0;
+    if (!space) {
+      import_log.log.warn("Space not found", result?.spaceKey, {
+        F: __dxlog_file,
+        L: 56,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+      return;
+    }
+    await dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.SwitchWorkspace, {
+      part: "workspace",
+      subject: space.id
+    }));
     const target = result?.target || (navigableCollections ? space?.id : void 0);
     if (target) {
       await graph.waitForPath({
@@ -694,15 +733,15 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
       }).catch(() => {
       });
       await Promise.all([
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.NavigationAction.Open, {
-          activeParts: {
-            main: [
-              target
-            ]
-          }
+        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.Open, {
+          part: "main",
+          subject: [
+            target
+          ]
         })),
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.NavigationAction.Expose, {
-          id: target
+        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.Expose, {
+          part: "navigation",
+          subject: target
         }))
       ]);
     }
@@ -717,7 +756,8 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
     }
   }, [
     dispatch,
-    spaces
+    client,
+    graph
   ]);
   return /* @__PURE__ */ import_react11.default.createElement(import_react_ui10.Dialog.Content, null, /* @__PURE__ */ import_react11.default.createElement(import_react12.JoinPanel, {
     ...props,
@@ -731,10 +771,10 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
   }));
 };
 var MenuFooter = ({ object }) => {
-  const { t } = (0, import_react_ui11.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
-  const client = (0, import_react_client3.useClient)();
-  const space = (0, import_echo6.getSpace)(object);
-  const spaceName = space ? (0, import_chunk_Z34MTEU7.getSpaceDisplayName)(space, {
+  const { t } = (0, import_react_ui11.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const client = (0, import_react_client4.useClient)();
+  const space = (0, import_echo4.getSpace)(object);
+  const spaceName = space ? (0, import_chunk_SYVPVU3K.getSpaceDisplayName)(space, {
     personal: client.spaces.default === space
   }) : "";
   return space ? /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(import_react_ui11.DropdownMenu.Separator, null), /* @__PURE__ */ import_react14.default.createElement(import_react_ui11.DropdownMenu.GroupLabel, null, t("menu footer label")), /* @__PURE__ */ import_react14.default.createElement("dl", {
@@ -754,7 +794,7 @@ var Status;
   Status2[Status2["ERROR"] = 2] = "ERROR";
 })(Status || (Status = {}));
 var PersistenceStatus = ({ db }) => {
-  const { t } = (0, import_react_ui12.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui12.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const [displayMessage, setDisplayMessage] = (0, import_react16.useState)(false);
   const [status, naturalSetStatus] = (0, import_react16.useState)(0);
   const [prevStatus, setPrevStatus] = (0, import_react16.useState)(0);
@@ -774,17 +814,17 @@ var PersistenceStatus = ({ db }) => {
       return /* @__PURE__ */ import_react16.default.createElement("div", {
         className: "flex items-center"
       }, /* @__PURE__ */ import_react16.default.createElement(import_react15.Warning, {
-        className: (0, import_react_ui_theme3.mx)((0, import_react_ui_theme3.getSize)(4), "me-1")
+        className: (0, import_react_ui_theme4.mx)((0, import_react_ui_theme4.getSize)(4), "me-1")
       }), /* @__PURE__ */ import_react16.default.createElement("span", {
-        className: (0, import_react_ui_theme3.mx)("text-sm", import_react_ui_theme3.warningText)
+        className: (0, import_react_ui_theme4.mx)("text-sm", import_react_ui_theme4.warningText)
       }, t("persistence error label")));
     case 1:
       return /* @__PURE__ */ import_react16.default.createElement("div", {
         className: "flex items-center"
       }, /* @__PURE__ */ import_react16.default.createElement(import_react15.ArrowsCounterClockwise, {
-        className: (0, import_react_ui_theme3.mx)((0, import_react_ui_theme3.getSize)(4), "me-1")
+        className: (0, import_react_ui_theme4.mx)((0, import_react_ui_theme4.getSize)(4), "me-1")
       }), /* @__PURE__ */ import_react16.default.createElement("span", {
-        className: (0, import_react_ui_theme3.mx)("text-sm", import_react_ui_theme3.staticPlaceholderText)
+        className: (0, import_react_ui_theme4.mx)("text-sm", import_react_ui_theme4.staticPlaceholderText)
       }, t("persistence pending label")));
     case 0:
     default:
@@ -794,16 +834,16 @@ var PersistenceStatus = ({ db }) => {
         role: "status",
         className: "flex items-center"
       }, /* @__PURE__ */ import_react16.default.createElement(import_react15.CheckCircle, {
-        className: (0, import_react_ui_theme3.mx)((0, import_react_ui_theme3.getSize)(4), "me-1")
+        className: (0, import_react_ui_theme4.mx)((0, import_react_ui_theme4.getSize)(4), "me-1")
       }), displayMessage && /* @__PURE__ */ import_react16.default.createElement("span", {
-        className: (0, import_react_ui_theme3.mx)("text-sm", import_react_ui_theme3.staticPlaceholderText)
+        className: (0, import_react_ui_theme4.mx)("text-sm", import_react_ui_theme4.staticPlaceholderText)
       }, t("persisted locally label"))), /* @__PURE__ */ import_react16.default.createElement(import_react_ui12.Tooltip.Portal, null, /* @__PURE__ */ import_react16.default.createElement(import_react_ui12.Tooltip.Content, null, t("persisted locally message"), /* @__PURE__ */ import_react16.default.createElement(import_react_ui12.Tooltip.Arrow, null))));
   }
 };
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx";
-var POPOVER_RENAME_OBJECT = `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/PopoverRenameObject`;
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx";
+var POPOVER_RENAME_OBJECT = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/PopoverRenameObject`;
 var PopoverRenameObject = ({ object: obj }) => {
-  const { t } = (0, import_react_ui13.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui13.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const doneButton = (0, import_react17.useRef)(null);
   const object = obj;
   const [name, setName] = (0, import_react17.useState)(object.name || object.title || "");
@@ -814,10 +854,10 @@ var PopoverRenameObject = ({ object: obj }) => {
       try {
         object.title = name;
       } catch (err) {
-        import_log.log.error("Failed to rename object", {
+        import_log2.log.error("Failed to rename object", {
           err
         }, {
-          F: __dxlog_file,
+          F: __dxlog_file2,
           L: 30,
           S: void 0,
           C: (f, a) => f(...a)
@@ -852,9 +892,9 @@ var PopoverRenameObject = ({ object: obj }) => {
     ns: "os"
   }))));
 };
-var POPOVER_RENAME_SPACE = `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/PopoverRenameSpace`;
+var POPOVER_RENAME_SPACE = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/PopoverRenameSpace`;
 var PopoverRenameSpace = ({ space }) => {
-  const { t } = (0, import_react_ui14.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui14.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const doneButton = (0, import_react18.useRef)(null);
   const [name, setName] = (0, import_react18.useState)(space.properties.name ?? "");
   const handleDone = (0, import_react18.useCallback)(() => {
@@ -891,13 +931,13 @@ var PopoverRenameSpace = ({ space }) => {
 var ShareSpaceButton = ({ space }) => {
   const { dispatchPromise: dispatch } = (0, import_app_framework6.useIntentDispatcher)();
   return /* @__PURE__ */ import_react19.default.createElement(ShareSpaceButtonImpl, {
-    onClick: () => dispatch((0, import_app_framework6.createIntent)(import_chunk_DDZYVNVP.SpaceAction.Share, {
+    onClick: () => dispatch((0, import_app_framework6.createIntent)(import_chunk_6MEOP3DH.SpaceAction.Share, {
       space
     }))
   });
 };
 var ShareSpaceButtonImpl = ({ onClick }) => {
-  const { t } = (0, import_react_ui15.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui15.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   return /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.IconButton, {
     "data-testid": "spacePlugin.shareSpaceButton",
     icon: "ph--users--regular",
@@ -905,15 +945,15 @@ var ShareSpaceButtonImpl = ({ onClick }) => {
     onClick
   });
 };
-var AppGraphBuilder = (0, import_app_framework8.lazy)(() => import("./app-graph-builder-ZQ5S62YR.cjs"));
-var AppGraphSerializer = (0, import_app_framework8.lazy)(() => import("./app-graph-serializer-72S7P33H.cjs"));
-var IdentityCreated = (0, import_app_framework8.lazy)(() => import("./identity-created-IMDS4A6A.cjs"));
-var IntentResolver = (0, import_app_framework8.lazy)(() => import("./intent-resolver-MUGCKZPN.cjs"));
-var ReactRoot = (0, import_app_framework8.lazy)(() => import("./react-root-TCHYZQY3.cjs"));
-var ReactSurface = (0, import_app_framework8.lazy)(() => import("./react-surface-TFPR6QAQ.cjs"));
-var SpaceSettings = (0, import_app_framework8.lazy)(() => import("./settings-QLCKAUHK.cjs"));
-var SpaceState = (0, import_app_framework8.lazy)(() => import("./state-4UIOUKLJ.cjs"));
-var SpacesReady = (0, import_app_framework8.lazy)(() => import("./spaces-ready-RZTKEXOL.cjs"));
+var AppGraphBuilder = (0, import_app_framework8.lazy)(() => import("./app-graph-builder-V3RCGDV7.cjs"));
+var AppGraphSerializer = (0, import_app_framework8.lazy)(() => import("./app-graph-serializer-H4UACG57.cjs"));
+var IdentityCreated = (0, import_app_framework8.lazy)(() => import("./identity-created-7G5U7R36.cjs"));
+var IntentResolver = (0, import_app_framework8.lazy)(() => import("./intent-resolver-CDE4M3TW.cjs"));
+var ReactRoot = (0, import_app_framework8.lazy)(() => import("./react-root-JN6AIHMS.cjs"));
+var ReactSurface = (0, import_app_framework8.lazy)(() => import("./react-surface-XSK2QEQV.cjs"));
+var SpaceSettings = (0, import_app_framework8.lazy)(() => import("./settings-TEELGWS4.cjs"));
+var SpaceState = (0, import_app_framework8.lazy)(() => import("./state-WPZC4JXB.cjs"));
+var SpacesReady = (0, import_app_framework8.lazy)(() => import("./spaces-ready-L4MJTFQ6.cjs"));
 var usePath = (graph, id, timeout) => {
   const [pathState, setPathState] = (0, import_react21.useState)(id ? graph.getPath({
     target: id
@@ -949,14 +989,14 @@ var usePath = (graph, id, timeout) => {
 };
 var REFRESH_INTERVAL = 5e3;
 var ACTIVITY_DURATION = 3e4;
-var noViewers = new import_util2.ComplexMap(import_react_client4.PublicKey.hash);
+var noViewers = new import_util2.ComplexMap(import_react_client5.PublicKey.hash);
 var getName = (identity) => identity.profile?.displayName ?? (0, import_display_name.generateName)(identity.identityKey.toHex());
 var SpacePresence = ({ object, spaceKey }) => {
-  const spaceState = (0, import_app_framework7.useCapability)(import_chunk_56NGXG2A.SpaceCapabilities.MutableState);
-  const client = (0, import_react_client4.useClient)();
+  const spaceState = (0, import_app_framework7.useCapability)(import_chunk_UX3U4RU2.SpaceCapabilities.MutableState);
+  const client = (0, import_react_client5.useClient)();
   const identity = (0, import_halo.useIdentity)();
-  const space = spaceKey ? client.spaces.get(spaceKey) : (0, import_echo7.getSpace)(object);
-  const spaceMembers = (0, import_echo7.useMembers)(space?.key);
+  const space = spaceKey ? client.spaces.get(spaceKey) : (0, import_echo5.getSpace)(object);
+  const spaceMembers = (0, import_echo5.useMembers)(space?.key);
   const [_moment, setMoment] = (0, import_react20.useState)(Date.now());
   (0, import_react20.useEffect)(() => {
     const interval = setInterval(() => setMoment(Date.now()), REFRESH_INTERVAL);
@@ -969,7 +1009,7 @@ var SpacePresence = ({ object, spaceKey }) => {
   if (!identity || !spaceState || !space) {
     return null;
   }
-  const currentObjectViewers = spaceState.viewersByObject[(0, import_echo7.fullyQualifiedId)(object)] ?? noViewers;
+  const currentObjectViewers = spaceState.viewersByObject[(0, import_echo5.fullyQualifiedId)(object)] ?? noViewers;
   const membersForObject = spaceMembers.filter((member) => memberOnline(member) && memberIsNotSelf(member)).filter((member) => currentObjectViewers.has(member.identity.identityKey)).map((member) => {
     const objectView = currentObjectViewers.get(member.identity.identityKey);
     const lastSeen = objectView?.lastSeen ?? -Infinity;
@@ -1052,7 +1092,7 @@ var PrensenceAvatar = ({ identity, showName, match, group, index, onClick }) =>
 var SmallPresenceLive = ({ id, open, viewers }) => {
   const { hasAttention, isAncestor, isRelated } = (0, import_react_ui_attention.useAttention)(id);
   const isAttended = hasAttention || isAncestor || isRelated;
-  const { graph } = (0, import_plugin_graph2.useGraph)();
+  const { graph } = (0, import_app_framework7.useAppGraph)();
   const attended = (0, import_react_ui_attention.useAttended)();
   const startOfAttention = attended.at(-1);
   const path = usePath(graph, startOfAttention);
@@ -1080,7 +1120,7 @@ var SmallPresenceLive = ({ id, open, viewers }) => {
   });
 };
 var SmallPresence = ({ count = 0, attended, containsAttended }) => {
-  const { t } = (0, import_react_ui16.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui16.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   return /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Root, null, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Trigger, {
     asChild: true
   }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui_attention.AttentionGlyph, {
@@ -1095,25 +1135,25 @@ var SmallPresence = ({ count = 0, attended, containsAttended }) => {
   })), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Arrow, null))));
 };
 var SpacePluginSettings = ({ settings }) => {
-  const { t } = (0, import_react_ui17.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
-  return /* @__PURE__ */ import_react22.default.createElement(import_react22.default.Fragment, null, /* @__PURE__ */ import_react22.default.createElement(import_react_ui_form4.DeprecatedFormInput, {
+  const { t } = (0, import_react_ui17.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  return /* @__PURE__ */ import_react22.default.createElement(import_react_ui_form4.DeprecatedFormContainer, null, /* @__PURE__ */ import_react22.default.createElement(import_react_ui_form4.DeprecatedFormInput, {
     label: t("show hidden spaces label")
   }, /* @__PURE__ */ import_react22.default.createElement(import_react_ui17.Input.Switch, {
     checked: settings.showHidden,
     onCheckedChange: (checked) => settings.showHidden = !!checked
   })));
 };
-var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx";
-var SpaceSettingsPanel = ({ classNames, space }) => {
-  const { t } = (0, import_react_ui18.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
-  const client = (0, import_react_client5.useClient)();
+var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx";
+var SpaceSettingsPanel = ({ space }) => {
+  const { t } = (0, import_react_ui18.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const client = (0, import_react_client6.useClient)();
   const edgeEnabled = Boolean(client.config.values.runtime?.client?.edgeFeatures?.echoReplicator);
   const [edgeReplication, setEdgeReplication] = (0, import_react23.useState)(space.internal.data.edgeReplication === import_metadata.EdgeReplicationSetting.ENABLED);
   const toggleEdgeReplication = (0, import_react23.useCallback)(async (next) => {
     setEdgeReplication(next);
     await space?.internal.setEdgeReplicationPreference(next ? import_metadata.EdgeReplicationSetting.ENABLED : import_metadata.EdgeReplicationSetting.DISABLED).catch((err) => {
-      import_log2.log.catch(err, void 0, {
-        F: __dxlog_file2,
+      import_log3.log.catch(err, void 0, {
+        F: __dxlog_file3,
         L: 36,
         S: void 0,
         C: (f, a) => f(...a)
@@ -1123,10 +1163,7 @@ var SpaceSettingsPanel = ({ classNames, space }) => {
   }, [
     space
   ]);
-  return /* @__PURE__ */ import_react23.default.createElement("div", {
-    role: "form",
-    className: (0, import_react_ui_theme4.mx)("flex flex-col", classNames)
-  }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
+  return /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormContainer, null, /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
     label: t("name label")
   }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui18.Input.TextInput, {
     placeholder: t("unnamed space label"),
@@ -1134,6 +1171,12 @@ var SpaceSettingsPanel = ({ classNames, space }) => {
     onChange: (event) => {
       space.properties.name = event.target.value;
     }
+  })), /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
+    label: t("hue label")
+  }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui_pickers.HuePickerBlock, {
+    hue: space.properties.hue,
+    onChangeHue: (nextHue) => space.properties.hue = nextHue,
+    onClickClear: () => space.properties.hue = void 0
   })), edgeEnabled && /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
     label: t("edge replication label")
   }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui18.Input.Switch, {
@@ -1141,17 +1184,23 @@ var SpaceSettingsPanel = ({ classNames, space }) => {
     onCheckedChange: toggleEdgeReplication
   })));
 };
-var SPACE_SETTINGS_DIALOG = `${import_chunk_AO4EW2RX.SPACE_PLUGIN}/SpaceSettingsDialog`;
+var SPACE_SETTINGS_DIALOG = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/SpaceSettingsDialog`;
 var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "members", namesCache }) => {
-  const { t } = (0, import_react_ui19.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
-  const client = (0, import_react_client6.useClient)();
+  const { t } = (0, import_react_ui19.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const client = (0, import_react_client7.useClient)();
   const [tabsActivePart, setTabsActivePart] = (0, import_react24.useState)("list");
   const [selected, setSelected] = (0, import_react24.useState)(initialTab);
-  const locked = space.properties[import_chunk_Z34MTEU7.COMPOSER_SPACE_LOCK];
-  const name = (0, import_chunk_Z34MTEU7.getSpaceDisplayName)(space, {
+  const locked = space.properties[import_chunk_SYVPVU3K.COMPOSER_SPACE_LOCK];
+  const name = (0, import_chunk_SYVPVU3K.getSpaceDisplayName)(space, {
     personal: client.spaces.default === space,
     namesCache
   });
+  const panels = (0, import_app_framework9.useCapabilities)(import_chunk_UX3U4RU2.SpaceCapabilities.SettingsPanel);
+  const data = (0, import_react24.useMemo)(() => ({
+    subject: space
+  }), [
+    space
+  ]);
   return (
     // TODO(wittjosiah): The tablist dialog pattern is copied from @dxos/plugin-manager.
     //  Consider factoring it out to the tabs package.
@@ -1204,7 +1253,10 @@ var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "m
     }, t("settings tab label")), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tab, {
       value: "members",
       disabled: locked
-    }, t("members tab label"))))), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tabpanel, {
+    }, t("members tab label")), panels.map((panel) => /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tab, {
+      key: panel.id,
+      value: panel.id
+    }, (0, import_react_ui19.toLocalizedString)(panel.label, t)))))), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tabpanel, {
       value: "settings",
       classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
     }, /* @__PURE__ */ import_react24.default.createElement(SpaceSettingsPanel, {
@@ -1217,10 +1269,17 @@ var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "m
       hideHeading: true,
       target,
       createInvitationUrl
+    }))), panels.map((panel) => /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tabpanel, {
+      key: panel.id,
+      value: panel.id,
+      classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
+    }, /* @__PURE__ */ import_react24.default.createElement(import_app_framework9.Surface, {
+      role: `space-settings--${panel.id}`,
+      data
     }))))))
   );
 };
-var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/sync-state.ts";
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/sync-state.ts";
 var createEmptyEdgeSyncState = () => ({
   missingOnLocal: 0,
   missingOnRemote: 0,
@@ -1240,11 +1299,11 @@ var getSyncSummary = (syncMap) => {
 };
 var isEdgePeerId = (peerId, spaceId) => peerId.startsWith(`${import_protocols.EdgeService.AUTOMERGE_REPLICATOR}:${spaceId}`);
 var useSyncState = () => {
-  const client = (0, import_react_client8.useClient)();
+  const client = (0, import_react_client9.useClient)();
   const [spaceState, setSpaceState] = (0, import_react27.useState)({});
   (0, import_react27.useEffect)(() => {
     const ctx = new import_context.Context(void 0, {
-      F: __dxlog_file3,
+      F: __dxlog_file4,
       L: 48
     });
     const createSubscriptions = (spaces) => {
@@ -1279,7 +1338,7 @@ var useSpaceSyncState = (space) => {
   const [spaceState, setSpaceState] = (0, import_react27.useState)();
   (0, import_react27.useEffect)(() => {
     const ctx = new import_context.Context(void 0, {
-      F: __dxlog_file3,
+      F: __dxlog_file4,
       L: 87
     });
     space.crud.subscribeToSyncState(ctx, ({ peers = [] }) => {
@@ -1298,7 +1357,7 @@ var useSpaceSyncState = (space) => {
 };
 var useEdgeStatus = () => {
   const [status, setStatus] = (0, import_react26.useState)(import_services.QueryEdgeStatusResponse.EdgeStatus.NOT_CONNECTED);
-  const client = (0, import_react_client7.useClient)();
+  const client = (0, import_react_client8.useClient)();
   (0, import_react26.useEffect)(() => {
     client.services.services.EdgeAgentService?.queryEdgeStatus().subscribe(({ status: status2 }) => {
       setStatus(status2);
@@ -1309,11 +1368,11 @@ var useEdgeStatus = () => {
   return status;
 };
 var InlineSyncStatus = ({ space, open }) => {
-  const { t } = (0, import_react_ui20.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui20.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const id = space.id;
   const { hasAttention, isAncestor, isRelated } = (0, import_react_ui_attention2.useAttention)(id);
   const isAttended = hasAttention || isAncestor || isRelated;
-  const { graph } = (0, import_plugin_graph3.useGraph)();
+  const { graph } = (0, import_app_framework10.useAppGraph)();
   const attended = (0, import_react_ui_attention2.useAttended)();
   const startOfAttention = attended.at(-1);
   const path = usePath(graph, startOfAttention);
@@ -1364,13 +1423,13 @@ var useActive = (count) => {
   return active;
 };
 var SpaceRowContainer = ({ spaceId, state }) => {
-  const { t } = (0, import_react_ui22.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
-  const client = (0, import_react_client10.useClient)();
-  const space = (0, import_echo8.useSpace)(spaceId);
+  const { t } = (0, import_react_ui22.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const client = (0, import_react_client11.useClient)();
+  const space = (0, import_echo6.useSpace)(spaceId);
   if (!space) {
     return null;
   }
-  const spaceName = (0, import_react_ui22.toLocalizedString)((0, import_chunk_Z34MTEU7.getSpaceDisplayName)(space, {
+  const spaceName = (0, import_react_ui22.toLocalizedString)((0, import_chunk_SYVPVU3K.getSpaceDisplayName)(space, {
     personal: space === client.spaces.default
   }), t);
   return /* @__PURE__ */ import_react29.default.createElement(SpaceRow, {
@@ -1438,7 +1497,7 @@ var Bar = ({ classNames, count, total }) => {
     className: "absolute top-0 bottom-0 flex items-center mx-0.5 text-black text-xs"
   }, count));
 };
-var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/save-tracker.ts";
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/save-tracker.ts";
 var createClientSaveTracker = (client, cb) => {
   const unsubscribeCallbacks = {};
   const state = {};
@@ -1466,7 +1525,7 @@ var createClientSaveTracker = (client, cb) => {
 };
 var createSpaceSaveTracker = (space, cb) => {
   const ctx = new import_context2.Context(void 0, {
-    F: __dxlog_file4,
+    F: __dxlog_file5,
     L: 40
   });
   void space.waitUntilReady().then(() => {
@@ -1525,7 +1584,7 @@ var getIcon = (status) => {
   }
 };
 var SyncStatus = () => {
-  const client = (0, import_react_client9.useClient)();
+  const client = (0, import_react_client10.useClient)();
   const state = useSyncState();
   const [saved, setSaved] = (0, import_react28.useState)(true);
   (0, import_react28.useEffect)(() => {
@@ -1539,7 +1598,7 @@ var SyncStatus = () => {
   });
 };
 var SyncStatusIndicator = ({ state, saved }) => {
-  const { t } = (0, import_react_ui21.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui21.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const summary = getSyncSummary(state);
   const offline = Object.values(state).length === 0;
   const needsToUpload = summary.differentDocuments > 0 || summary.missingOnRemote > 0;
@@ -1580,18 +1639,16 @@ var SyncStatusIndicator = ({ state, saved }) => {
       asChild: true
     }, /* @__PURE__ */ import_react28.default.createElement(import_plugin_status_bar.StatusBar.Button, {
       title
-    }, icon)), /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Portal, null, /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Content, {
-      sideOffset: 16
-    }, /* @__PURE__ */ import_react28.default.createElement(SyncStatusDetail, {
+    }, icon)), /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Portal, null, /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Content, null, /* @__PURE__ */ import_react28.default.createElement(SyncStatusDetail, {
       state,
       summary,
       debug: false
-    }))));
+    }), /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Arrow, null))));
   }
 };
 var SyncStatusDetail = ({ classNames, state, summary, debug }) => {
   const [showAll, setShowAll] = (0, import_react28.useState)(false);
-  const { t } = (0, import_react_ui21.useTranslation)(import_chunk_AO4EW2RX.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui21.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
   const entries = Object.entries(state).filter(([_, value]) => showAll || value.missingOnLocal + value.missingOnRemote > 0).toSorted(([a], [b]) => a < b ? -1 : a > b ? 1 : 0);
   const handleCheckedChange = (0, import_react28.useCallback)((state2) => setShowAll(state2), [
     setShowAll
@@ -1666,4 +1723,4 @@ var SyncStatusDetail = ({ classNames, state, summary, debug }) => {
   SyncStatusDetail,
   SyncStatusIndicator
 });
-//# sourceMappingURL=chunk-VCPICVIE.cjs.map
+//# sourceMappingURL=chunk-4AZ2DD4G.cjs.map