@dxos/plugin-space 0.7.5-labs.ea4b4c2 → 0.7.5-labs.f400bbc

package/dist/lib/node/{chunk-2RCJT3P2.cjs → chunk-N2FS7PRA.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_2RCJT3P2_exports = {};
-__export(chunk_2RCJT3P2_exports, {
+var chunk_N2FS7PRA_exports = {};
+__export(chunk_N2FS7PRA_exports, {
   AdvancedObjectSettings: () => AdvancedObjectSettings,
   AppGraphBuilder: () => AppGraphBuilder,
   AppGraphSerializer: () => AppGraphSerializer,
@@ -46,14 +46,17 @@ __export(chunk_2RCJT3P2_exports, {
   JOIN_DIALOG: () => JOIN_DIALOG,
   JoinDialog: () => JoinDialog,
   MenuFooter: () => MenuFooter,
+  POPOVER_ADD_SPACE: () => POPOVER_ADD_SPACE,
   POPOVER_RENAME_OBJECT: () => POPOVER_RENAME_OBJECT,
   POPOVER_RENAME_SPACE: () => POPOVER_RENAME_SPACE,
   PersistenceStatus: () => PersistenceStatus,
+  PopoverAddSpace: () => PopoverAddSpace,
   PopoverRenameObject: () => PopoverRenameObject,
   PopoverRenameSpace: () => PopoverRenameSpace,
   ReactRoot: () => ReactRoot,
   ReactSurface: () => ReactSurface,
   SPACE_SETTINGS_DIALOG: () => SPACE_SETTINGS_DIALOG,
+  Schema: () => Schema,
   ShareSpaceButton: () => ShareSpaceButton,
   ShareSpaceButtonImpl: () => ShareSpaceButtonImpl,
   SmallPresence: () => SmallPresence,
@@ -69,10 +72,10 @@ __export(chunk_2RCJT3P2_exports, {
   SyncStatusDetail: () => SyncStatusDetail,
   SyncStatusIndicator: () => SyncStatusIndicator
 });
-module.exports = __toCommonJS(chunk_2RCJT3P2_exports);
-var import_chunk_UX3U4RU2 = require("./chunk-UX3U4RU2.cjs");
-var import_chunk_MMXP2NHE = require("./chunk-MMXP2NHE.cjs");
-var import_chunk_SPCSJ2CY = require("./chunk-SPCSJ2CY.cjs");
+module.exports = __toCommonJS(chunk_N2FS7PRA_exports);
+var import_chunk_YZKNRFHU = require("./chunk-YZKNRFHU.cjs");
+var import_chunk_OVGKWJOC = require("./chunk-OVGKWJOC.cjs");
+var import_chunk_WAJKBO3J = require("./chunk-WAJKBO3J.cjs");
 var import_chunk_WZR6OAN3 = require("./chunk-WZR6OAN3.cjs");
 var import_react = __toESM(require("react"));
 var import_echo_schema = require("@dxos/echo-schema");
@@ -93,20 +96,23 @@ var import_react_ui4 = require("@dxos/react-ui");
 var import_effect = require("effect");
 var import_react6 = __toESM(require("react"));
 var import_app_framework2 = require("@dxos/app-framework");
+var import_invariant = require("@dxos/invariant");
 var import_react_client2 = require("@dxos/react-client");
 var import_echo3 = require("@dxos/react-client/echo");
 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_invariant2 = require("@dxos/invariant");
 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_app_framework4 = require("@dxos/app-framework");
 var import_effect2 = require("effect");
 var import_react8 = __toESM(require("react"));
-var import_app_framework4 = require("@dxos/app-framework");
+var import_app_framework5 = 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"));
@@ -115,7 +121,7 @@ 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_app_framework6 = require("@dxos/app-framework");
 var import_log = require("@dxos/log");
 var import_types = require("@dxos/plugin-observability/types");
 var import_react_client3 = require("@dxos/react-client");
@@ -132,60 +138,63 @@ var import_async = require("@dxos/async");
 var import_react_ui12 = require("@dxos/react-ui");
 var import_react_ui_theme4 = require("@dxos/react-ui-theme");
 var import_react17 = __toESM(require("react"));
-var import_log2 = require("@dxos/log");
+var import_app_framework7 = require("@dxos/app-framework");
 var import_react_ui13 = require("@dxos/react-ui");
 var import_react18 = __toESM(require("react"));
+var import_log2 = require("@dxos/log");
 var import_react_ui14 = require("@dxos/react-ui");
 var import_react19 = __toESM(require("react"));
-var import_app_framework6 = require("@dxos/app-framework");
 var import_react_ui15 = require("@dxos/react-ui");
 var import_react20 = __toESM(require("react"));
-var import_app_framework7 = require("@dxos/app-framework");
+var import_app_framework8 = require("@dxos/app-framework");
+var import_react_ui16 = require("@dxos/react-ui");
+var import_react21 = __toESM(require("react"));
+var import_app_framework9 = require("@dxos/app-framework");
 var import_display_name = require("@dxos/display-name");
 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_ui17 = require("@dxos/react-ui");
 var import_react_ui_attention = require("@dxos/react-ui-attention");
 var import_util2 = require("@dxos/util");
-var import_app_framework8 = require("@dxos/app-framework");
-var import_react21 = require("react");
-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_react22 = require("react");
 var import_react23 = __toESM(require("react"));
+var import_react_ui18 = require("@dxos/react-ui");
+var import_react_ui_form4 = require("@dxos/react-ui-form");
+var import_react24 = __toESM(require("react"));
 var import_log3 = require("@dxos/log");
 var import_metadata = require("@dxos/protocols/proto/dxos/echo/metadata");
 var import_react_client6 = require("@dxos/react-client");
-var import_react_ui18 = require("@dxos/react-ui");
+var import_react_ui19 = require("@dxos/react-ui");
 var import_react_ui_form5 = require("@dxos/react-ui-form");
-var import_react24 = __toESM(require("react"));
-var import_app_framework9 = require("@dxos/app-framework");
+var import_react_ui_pickers = require("@dxos/react-ui-pickers");
+var import_react25 = __toESM(require("react"));
+var import_app_framework10 = require("@dxos/app-framework");
 var import_react_client7 = require("@dxos/react-client");
-var import_react_ui19 = require("@dxos/react-ui");
+var import_react_ui20 = 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_app_framework10 = require("@dxos/app-framework");
+var import_react26 = require("@dxos/shell/react");
+var import_react27 = __toESM(require("react"));
+var import_app_framework11 = 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_client8 = require("@dxos/react-client");
-var import_react_ui20 = require("@dxos/react-ui");
+var import_react_ui21 = require("@dxos/react-ui");
 var import_react_ui_attention2 = require("@dxos/react-ui-attention");
-var import_react27 = require("react");
+var import_react28 = require("react");
 var import_context = require("@dxos/context");
 var import_protocols = require("@dxos/protocols");
 var import_react_client9 = require("@dxos/react-client");
-var import_react28 = __toESM(require("react"));
+var import_react29 = __toESM(require("react"));
 var import_plugin_status_bar = require("@dxos/plugin-status-bar");
 var import_react_client10 = require("@dxos/react-client");
-var import_react_ui21 = require("@dxos/react-ui");
+var import_react_ui22 = 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_react30 = __toESM(require("react"));
 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_ui23 = require("@dxos/react-ui");
 var import_react_ui_theme6 = require("@dxos/react-ui-theme");
 var import_context2 = require("@dxos/context");
 var ForeignKeys = ({ keys, onDelete }) => {
@@ -303,7 +312,7 @@ var AwaitingObject = ({ id }) => {
     objects,
     layout
   ]);
-  const handleClose = (0, import_react4.useCallback)(async () => dispatch((0, import_app_framework.createIntent)(import_chunk_SPCSJ2CY.SpaceAction.WaitForObject, {
+  const handleClose = (0, import_react4.useCallback)(async () => dispatch((0, import_app_framework.createIntent)(import_chunk_WAJKBO3J.SpaceAction.WaitForObject, {
     id: void 0
   })), [
     dispatch
@@ -355,17 +364,25 @@ var AwaitingObject = ({ id }) => {
 };
 var BaseObjectSettings = ({ object }) => {
   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();
+      }
     }
   })));
 };
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectPanel.tsx";
 var useInputSurfaceLookup = (baseData) => {
   const pluginManager = (0, import_app_framework3.usePluginManager)();
   return (0, import_react7.useCallback)(({ prop, schema, inputProps }) => {
@@ -390,12 +407,12 @@ var useInputSurfaceLookup = (baseData) => {
     baseData
   ]);
 };
-var CreateObjectPanel = ({ classNames, schemas, spaces, typename: initialTypename, target: initialTarget, name: initialName, defaultSpaceId, resolve, onCreateObject }) => {
+var CreateObjectPanel = ({ classNames, forms, 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).sort((a, b) => {
+  const form = forms.find((form2) => (0, import_echo_schema2.getObjectAnnotation)(form2.objectSchema)?.typename === typename);
+  const options = forms.map((form2) => (0, import_echo_schema2.getObjectAnnotation)(form2.objectSchema)).filter(import_util.isNonNullable).sort((a, b) => {
     const nameA = t("typename label", {
       ns: a.typename,
       defaultValue: a.typename
@@ -407,63 +424,68 @@ var CreateObjectPanel = ({ classNames, schemas, spaces, typename: initialTypenam
     return nameA.localeCompare(nameB);
   });
   const handleCreateObject = (0, import_react7.useCallback)(async (props) => {
-    if (!schema || !target) {
+    if (!form || !target) {
       return;
     }
     await onCreateObject?.({
-      schema,
+      form,
       target,
       data: props
     });
   }, [
     onCreateObject,
-    schema,
+    form,
     target
   ]);
-  const metadata = (0, import_react7.useMemo)(() => {
-    if (!typename) {
-      return;
+  const handleSetTypename = (0, import_react7.useCallback)(async (typename2) => {
+    (0, import_invariant2.invariant)(target, "target is required", {
+      F: __dxlog_file,
+      L: 94,
+      S: void 0,
+      A: [
+        "target",
+        "'target is required'"
+      ]
+    });
+    const form2 = forms.find((form3) => (0, import_echo_schema2.getObjectAnnotation)(form3.objectSchema)?.typename === typename2);
+    if (form2 && !form2.formSchema) {
+      await onCreateObject?.({
+        form: form2,
+        target
+      });
+    } else {
+      setTypename(typename2);
     }
-    return resolve?.(typename);
   }, [
-    resolve,
-    typename
+    forms,
+    onCreateObject,
+    target
   ]);
   const inputSurfaceLookup = useInputSurfaceLookup({
     target
   });
-  const form = (0, import_react7.useMemo)(() => {
-    const schema2 = metadata?.creationSchema ?? import_echo_schema2.S.Struct({
-      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
-      },
-      schema: schema2,
-      testId: "create-object-form",
-      onSave: handleCreateObject,
-      lookupComponent: inputSurfaceLookup
-    });
-  }, [
-    initialName,
-    handleCreateObject,
-    metadata
-  ]);
   return /* @__PURE__ */ import_react7.default.createElement("div", {
     role: "form",
     className: (0, import_react_ui_theme2.mx)("flex flex-col gap-2", classNames)
-  }, !schema ? /* @__PURE__ */ import_react7.default.createElement(SelectSchema, {
+  }, !form ? /* @__PURE__ */ import_react7.default.createElement(SelectSchema, {
     options,
     resolve,
-    onChange: setTypename
+    onChange: handleSetTypename
   }) : !target ? /* @__PURE__ */ import_react7.default.createElement(SelectSpace, {
     spaces,
     defaultSpaceId,
     onChange: setTarget
-  }) : form);
+  }) : form.formSchema ? /* @__PURE__ */ import_react7.default.createElement(import_react_ui_form2.Form, {
+    classNames: "!p-0",
+    autoFocus: true,
+    values: {
+      name: initialName
+    },
+    schema: form.formSchema,
+    testId: "create-object-form",
+    onSave: handleCreateObject,
+    lookupComponent: inputSurfaceLookup
+  }) : void 0);
 };
 var SelectSpace = ({ spaces, defaultSpaceId, onChange }) => {
   const { t } = (0, import_react_ui6.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
@@ -478,23 +500,23 @@ var SelectSpace = ({ spaces, defaultSpaceId, onChange }) => {
   }), /* @__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_MMXP2NHE.getSpaceDisplayName)(a, {
+    const aName = (0, import_react_ui6.toLocalizedString)((0, import_chunk_OVGKWJOC.getSpaceDisplayName)(a, {
       personal: a.id === defaultSpaceId
     }), t);
-    const bName = (0, import_react_ui6.toLocalizedString)((0, import_chunk_MMXP2NHE.getSpaceDisplayName)(b, {
+    const bName = (0, import_react_ui6.toLocalizedString)((0, import_chunk_OVGKWJOC.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_MMXP2NHE.getSpaceDisplayName)(space, {
+    value: (0, import_react_ui6.toLocalizedString)((0, import_chunk_OVGKWJOC.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_MMXP2NHE.getSpaceDisplayName)(space, {
+  }, (0, import_react_ui6.toLocalizedString)((0, import_chunk_OVGKWJOC.getSpaceDisplayName)(space, {
     personal: space.id === defaultSpaceId
   }), t))))));
 };
@@ -528,27 +550,51 @@ var SelectSchema = ({ options, resolve, onChange }) => {
     defaultValue: option.typename
   }))))));
 };
+var AppGraphBuilder = (0, import_app_framework4.lazy)(() => import("./app-graph-builder-ZIUBXRPA.cjs"));
+var AppGraphSerializer = (0, import_app_framework4.lazy)(() => import("./app-graph-serializer-VQOGHKXL.cjs"));
+var IdentityCreated = (0, import_app_framework4.lazy)(() => import("./identity-created-AXI64BLE.cjs"));
+var IntentResolver = (0, import_app_framework4.lazy)(() => import("./intent-resolver-MLENGECT.cjs"));
+var ReactRoot = (0, import_app_framework4.lazy)(() => import("./react-root-3OX5Z5CX.cjs"));
+var ReactSurface = (0, import_app_framework4.lazy)(() => import("./react-surface-5NYCMXSM.cjs"));
+var Schema = (0, import_app_framework4.lazy)(() => import("./schema-YN7WVFRX.cjs"));
+var SpaceSettings = (0, import_app_framework4.lazy)(() => import("./settings-5QYFWNH7.cjs"));
+var SpaceState = (0, import_app_framework4.lazy)(() => import("./state-57UE3DYE.cjs"));
+var SpacesReady = (0, import_app_framework4.lazy)(() => import("./spaces-ready-FQNAKR7G.cjs"));
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectDialog.tsx";
 var CREATE_OBJECT_DIALOG = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/CreateObjectDialog`;
-var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _shouldNavigate, resolve }) => {
+var CreateObjectDialog = ({ target, typename, name, shouldNavigate: _shouldNavigate }) => {
   const closeRef = (0, import_react6.useRef)(null);
+  const manager = (0, import_app_framework2.usePluginManager)();
   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_SPCSJ2CY.CollectionType.typename]?.target : _target;
-    const createObjectIntent = resolve?.(schema.typename)?.createObject;
-    if (!createObjectIntent || !target2) {
+  const forms = (0, import_app_framework2.useCapabilities)(import_chunk_YZKNRFHU.SpaceCapabilities.ObjectForm);
+  const resolve = (0, import_react6.useCallback)((typename2) => manager.context.requestCapabilities(import_app_framework2.Capabilities.Metadata).find(({ id }) => id === typename2)?.metadata ?? {}, [
+    manager
+  ]);
+  const handleCreateObject = (0, import_react6.useCallback)(async ({ form, target: _target, data = {} }) => {
+    const target2 = (0, import_echo3.isSpace)(_target) ? _target.properties[import_chunk_WAJKBO3J.CollectionType.typename]?.target : _target;
+    if (!target2) {
       return;
     }
     closeRef.current?.click();
     const space = (0, import_echo3.isSpace)(target2) ? target2 : (0, import_echo3.getSpace)(target2);
-    const result = await dispatch(createObjectIntent(data, {
+    (0, import_invariant.invariant)(space, "Missing space", {
+      F: __dxlog_file2,
+      L: 75,
+      S: void 0,
+      A: [
+        "space",
+        "'Missing space'"
+      ]
+    });
+    const result = await dispatch(form.getIntent(data, {
       space
     }));
     const object = result.data?.object;
     if ((0, import_echo3.isReactiveObject)(object)) {
-      const addObjectIntent = (0, import_app_framework2.createIntent)(import_chunk_SPCSJ2CY.SpaceAction.AddObject, {
+      const addObjectIntent = (0, import_app_framework2.createIntent)(import_chunk_WAJKBO3J.SpaceAction.AddObject, {
         target: target2,
         object
       });
@@ -585,7 +631,7 @@ var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _sh
       size: 4
     })))), /* @__PURE__ */ import_react6.default.createElement(CreateObjectPanel, {
       classNames: "p-4",
-      schemas,
+      forms,
       spaces,
       target,
       typename,
@@ -603,15 +649,15 @@ var initialValues2 = {
 var CreateSpaceDialog = () => {
   const closeRef = (0, import_react8.useRef)(null);
   const { t } = (0, import_react_ui7.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
-  const { dispatch } = (0, import_app_framework4.useIntentDispatcher)();
+  const { dispatch } = (0, import_app_framework5.useIntentDispatcher)();
   const handleCreateSpace = (0, import_react8.useCallback)(async (data) => {
     const program = import_effect2.Effect.gen(function* () {
-      const { space } = yield* dispatch((0, import_app_framework4.createIntent)(import_chunk_SPCSJ2CY.SpaceAction.Create, data));
-      yield* dispatch((0, import_app_framework4.createIntent)(import_app_framework4.LayoutAction.SwitchWorkspace, {
+      const { space } = yield* dispatch((0, import_app_framework5.createIntent)(import_chunk_WAJKBO3J.SpaceAction.Create, data));
+      yield* dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.SwitchWorkspace, {
         part: "workspace",
         subject: space.id
       }));
-      yield* dispatch((0, import_app_framework4.createIntent)(import_chunk_SPCSJ2CY.SpaceAction.OpenCreateObject, {
+      yield* dispatch((0, import_app_framework5.createIntent)(import_chunk_WAJKBO3J.SpaceAction.OpenCreateObject, {
         target: space
       }));
     });
@@ -644,7 +690,7 @@ var CreateSpaceDialog = () => {
       classNames: "!p-0",
       autoFocus: true,
       values: initialValues2,
-      schema: import_chunk_SPCSJ2CY.SpaceForm,
+      schema: import_chunk_WAJKBO3J.SpaceForm,
       onSave: handleCreateSpace
     })))
   );
@@ -668,16 +714,16 @@ var CollectionSection = ({ collection }) => {
     className: "truncate"
   }, collection.name ?? t("unnamed collection label")));
 };
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/JoinDialog.tsx";
+var __dxlog_file3 = "/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 { dispatchPromise: dispatch } = (0, import_app_framework5.useIntentDispatcher)();
+  const { dispatchPromise: dispatch } = (0, import_app_framework6.useIntentDispatcher)();
   const client = (0, import_react_client3.useClient)();
-  const { graph } = (0, import_app_framework5.useAppGraph)();
+  const { graph } = (0, import_app_framework6.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.AddToast, {
+        dispatch((0, import_app_framework6.createIntent)(import_app_framework6.LayoutAction.AddToast, {
           part: "toast",
           subject: {
             id: `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/join-success`,
@@ -696,7 +742,7 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
             ]
           }
         })),
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.UpdateDialog, {
+        dispatch((0, import_app_framework6.createIntent)(import_app_framework6.LayoutAction.UpdateDialog, {
           part: "dialog",
           options: {
             state: false
@@ -707,14 +753,14 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
     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,
+        F: __dxlog_file3,
         L: 56,
         S: void 0,
         C: (f, a) => f(...a)
       });
       return;
     }
-    await dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.SwitchWorkspace, {
+    await dispatch((0, import_app_framework6.createIntent)(import_app_framework6.LayoutAction.SwitchWorkspace, {
       part: "workspace",
       subject: space.id
     }));
@@ -725,13 +771,13 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
       }).catch(() => {
       });
       await Promise.all([
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.Open, {
+        dispatch((0, import_app_framework6.createIntent)(import_app_framework6.LayoutAction.Open, {
           part: "main",
           subject: [
             target
           ]
         })),
-        dispatch((0, import_app_framework5.createIntent)(import_app_framework5.LayoutAction.Expose, {
+        dispatch((0, import_app_framework6.createIntent)(import_app_framework6.LayoutAction.Expose, {
           part: "navigation",
           subject: target
         }))
@@ -739,7 +785,7 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
     }
     await onDone?.(result);
     if (space) {
-      await dispatch((0, import_app_framework5.createIntent)(import_types.ObservabilityAction.SendEvent, {
+      await dispatch((0, import_app_framework6.createIntent)(import_types.ObservabilityAction.SendEvent, {
         name: "space.join",
         properties: {
           spaceId: space.id
@@ -766,7 +812,7 @@ var MenuFooter = ({ object }) => {
   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_MMXP2NHE.getSpaceDisplayName)(space, {
+  const spaceName = space ? (0, import_chunk_OVGKWJOC.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", {
@@ -832,14 +878,53 @@ var PersistenceStatus = ({ db }) => {
       }, 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_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx";
+var POPOVER_ADD_SPACE = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/PopoverRenameSpace`;
+var PopoverAddSpace = () => {
+  const { t } = (0, import_react_ui13.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const { dispatchPromise: dispatch } = (0, import_app_framework7.useIntentDispatcher)();
+  return /* @__PURE__ */ import_react17.default.createElement("div", {
+    role: "none",
+    className: "grid grid-cols-1 gap-1 [&>button]:justify-start"
+  }, /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.IconButton, {
+    variant: "ghost",
+    label: t("create space label"),
+    icon: "ph--plus--regular",
+    onClick: () => {
+      void dispatch((0, import_app_framework7.createIntent)(import_chunk_WAJKBO3J.SpaceAction.OpenCreateSpace));
+      void dispatch((0, import_app_framework7.createIntent)(import_app_framework7.LayoutAction.UpdatePopover, {
+        part: "popover",
+        options: {
+          anchorId: "",
+          state: false
+        }
+      }));
+    },
+    "data-testid": "spacePlugin.createSpace"
+  }), /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.IconButton, {
+    variant: "ghost",
+    label: t("join space label"),
+    icon: "ph--sign-in--regular",
+    onClick: () => {
+      void dispatch((0, import_app_framework7.createIntent)(import_chunk_WAJKBO3J.SpaceAction.Join));
+      void dispatch((0, import_app_framework7.createIntent)(import_app_framework7.LayoutAction.UpdatePopover, {
+        part: "popover",
+        options: {
+          anchorId: "",
+          state: false
+        }
+      }));
+    },
+    "data-testid": "spacePlugin.joinSpace"
+  }));
+};
+var __dxlog_file4 = "/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_WZR6OAN3.SPACE_PLUGIN);
-  const doneButton = (0, import_react17.useRef)(null);
+  const { t } = (0, import_react_ui14.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const doneButton = (0, import_react18.useRef)(null);
   const object = obj;
-  const [name, setName] = (0, import_react17.useState)(object.name || object.title || "");
-  const handleDone = (0, import_react17.useCallback)(() => {
+  const [name, setName] = (0, import_react18.useState)(object.name || object.title || "");
+  const handleDone = (0, import_react18.useCallback)(() => {
     try {
       object.name = name;
     } catch {
@@ -849,7 +934,7 @@ var PopoverRenameObject = ({ object: obj }) => {
         import_log2.log.error("Failed to rename object", {
           err
         }, {
-          F: __dxlog_file2,
+          F: __dxlog_file4,
           L: 30,
           S: void 0,
           C: (f, a) => f(...a)
@@ -860,23 +945,23 @@ var PopoverRenameObject = ({ object: obj }) => {
     object,
     name
   ]);
-  return /* @__PURE__ */ import_react17.default.createElement("div", {
+  return /* @__PURE__ */ import_react18.default.createElement("div", {
     role: "none",
     className: "p-1 flex gap-2"
-  }, /* @__PURE__ */ import_react17.default.createElement("div", {
+  }, /* @__PURE__ */ import_react18.default.createElement("div", {
     role: "none",
     className: "flex-1"
-  }, /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.Input.Root, null, /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.Input.Label, {
+  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Input.Root, null, /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Input.Label, {
     srOnly: true
-  }, t("object name label")), /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.Input.TextInput, {
+  }, t("object name label")), /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Input.TextInput, {
     placeholder: t("object title placeholder"),
     value: name,
     "data-testid": "spacePlugin.renameObject.input",
     onChange: ({ target: { value } }) => setName(value),
     onKeyDown: ({ key }) => key === "Enter" && doneButton.current?.click()
-  }))), /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.Popover.Close, {
+  }))), /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Popover.Close, {
     asChild: true
-  }, /* @__PURE__ */ import_react17.default.createElement(import_react_ui13.Button, {
+  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Button, {
     ref: doneButton,
     classNames: "self-stretch",
     onClick: handleDone
@@ -886,33 +971,33 @@ var PopoverRenameObject = ({ object: obj }) => {
 };
 var POPOVER_RENAME_SPACE = `${import_chunk_WZR6OAN3.SPACE_PLUGIN}/PopoverRenameSpace`;
 var PopoverRenameSpace = ({ space }) => {
-  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)(() => {
+  const { t } = (0, import_react_ui15.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const doneButton = (0, import_react19.useRef)(null);
+  const [name, setName] = (0, import_react19.useState)(space.properties.name ?? "");
+  const handleDone = (0, import_react19.useCallback)(() => {
     space.properties.name = name;
   }, [
     space,
     name
   ]);
-  return /* @__PURE__ */ import_react18.default.createElement("div", {
+  return /* @__PURE__ */ import_react19.default.createElement("div", {
     role: "none",
     className: "p-1 flex gap-2"
-  }, /* @__PURE__ */ import_react18.default.createElement("div", {
+  }, /* @__PURE__ */ import_react19.default.createElement("div", {
     role: "none",
     className: "flex-1"
-  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Input.Root, null, /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Input.Label, {
+  }, /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.Input.Root, null, /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.Input.Label, {
     srOnly: true
-  }, t("space name label")), /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Input.TextInput, {
+  }, t("space name label")), /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.Input.TextInput, {
     defaultValue: space.properties.name ?? "",
     placeholder: t("unnamed space label"),
     onChange: ({ target: { value } }) => setName(value),
     // TODO(wittjosiah): Ideally this should access the popover context to close the popover.
     //   Currently this is not possible because Radix does not expose the popover context.
     onKeyDown: ({ key }) => key === "Enter" && doneButton.current?.click()
-  }))), /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Popover.Close, {
+  }))), /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.Popover.Close, {
     asChild: true
-  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui14.Button, {
+  }, /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.Button, {
     ref: doneButton,
     classNames: "self-stretch",
     onClick: handleDone
@@ -921,36 +1006,27 @@ 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_SPCSJ2CY.SpaceAction.Share, {
+  const { dispatchPromise: dispatch } = (0, import_app_framework8.useIntentDispatcher)();
+  return /* @__PURE__ */ import_react20.default.createElement(ShareSpaceButtonImpl, {
+    onClick: () => dispatch((0, import_app_framework8.createIntent)(import_chunk_WAJKBO3J.SpaceAction.Share, {
       space
     }))
   });
 };
 var ShareSpaceButtonImpl = ({ onClick }) => {
-  const { t } = (0, import_react_ui15.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_ui15.IconButton, {
+  const { t } = (0, import_react_ui16.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  return /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.IconButton, {
     "data-testid": "spacePlugin.shareSpaceButton",
     icon: "ph--users--regular",
     label: t("share space label"),
     onClick
   });
 };
-var AppGraphBuilder = (0, import_app_framework8.lazy)(() => import("./app-graph-builder-6N4TEVHH.cjs"));
-var AppGraphSerializer = (0, import_app_framework8.lazy)(() => import("./app-graph-serializer-AWKVTYAB.cjs"));
-var IdentityCreated = (0, import_app_framework8.lazy)(() => import("./identity-created-JNDKMFKI.cjs"));
-var IntentResolver = (0, import_app_framework8.lazy)(() => import("./intent-resolver-NVTAESKB.cjs"));
-var ReactRoot = (0, import_app_framework8.lazy)(() => import("./react-root-YCHSAYQE.cjs"));
-var ReactSurface = (0, import_app_framework8.lazy)(() => import("./react-surface-ANSZ4FKK.cjs"));
-var SpaceSettings = (0, import_app_framework8.lazy)(() => import("./settings-RBBL22DJ.cjs"));
-var SpaceState = (0, import_app_framework8.lazy)(() => import("./state-WPZC4JXB.cjs"));
-var SpacesReady = (0, import_app_framework8.lazy)(() => import("./spaces-ready-WHU4J6E5.cjs"));
 var usePath = (graph, id, timeout) => {
-  const [pathState, setPathState] = (0, import_react21.useState)(id ? graph.getPath({
+  const [pathState, setPathState] = (0, import_react22.useState)(id ? graph.getPath({
     target: id
   }) : void 0);
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (!id && pathState) {
       setPathState(void 0);
     }
@@ -984,18 +1060,18 @@ var ACTIVITY_DURATION = 3e4;
 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_UX3U4RU2.SpaceCapabilities.MutableState);
+  const spaceState = (0, import_app_framework9.useCapability)(import_chunk_YZKNRFHU.SpaceCapabilities.MutableState);
   const client = (0, import_react_client5.useClient)();
   const identity = (0, import_halo.useIdentity)();
   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 [_moment, setMoment] = (0, import_react21.useState)(Date.now());
+  (0, import_react21.useEffect)(() => {
     const interval = setInterval(() => setMoment(Date.now()), REFRESH_INTERVAL);
     return () => clearInterval(interval);
   }, []);
-  const memberOnline = (0, import_react20.useCallback)((member) => member.presence === 1, []);
-  const memberIsNotSelf = (0, import_react20.useCallback)((member) => !identity?.identityKey.equals(member.identity.identityKey), [
+  const memberOnline = (0, import_react21.useCallback)((member) => member.presence === 1, []);
+  const memberIsNotSelf = (0, import_react21.useCallback)((member) => !identity?.identityKey.equals(member.identity.identityKey), [
     identity?.identityKey
   ]);
   if (!identity || !spaceState || !space) {
@@ -1012,61 +1088,61 @@ var SpacePresence = ({ object, spaceKey }) => {
       lastSeen
     };
   }).toSorted((a, b) => a.lastSeen - b.lastSeen);
-  return /* @__PURE__ */ import_react20.default.createElement(FullPresence, {
+  return /* @__PURE__ */ import_react21.default.createElement(FullPresence, {
     members: membersForObject
   });
 };
 var FullPresence = (props) => {
   const { size = 9, onMemberClick } = props;
-  const members = (0, import_react_ui16.useDefaultValue)(props.members, () => []);
+  const members = (0, import_react_ui17.useDefaultValue)(props.members, () => []);
   if (members.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.AvatarGroup.Root, {
+  return /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.AvatarGroup.Root, {
     size,
     classNames: "mbs-2 mie-4",
     "data-testid": "spacePlugin.presence"
-  }, members.slice(0, 3).map((member, i) => /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Root, {
+  }, members.slice(0, 3).map((member, i) => /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Root, {
     key: member.identity.identityKey.toHex()
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Trigger, null, /* @__PURE__ */ import_react20.default.createElement(PrensenceAvatar, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Trigger, null, /* @__PURE__ */ import_react21.default.createElement(PrensenceAvatar, {
     identity: member.identity,
     group: true,
     match: member.currentlyAttended,
     index: members.length - i,
     onClick: () => onMemberClick?.(member)
-  })), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Portal, null, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Content, {
+  })), /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Portal, null, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ import_react20.default.createElement("span", null, getName(member.identity)), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Arrow, null))))), members.length > 3 && /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Root, null, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Trigger, null, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.AvatarGroupItem.Root, {
+  }, /* @__PURE__ */ import_react21.default.createElement("span", null, getName(member.identity)), /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Arrow, null))))), members.length > 3 && /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Root, null, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Trigger, null, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.AvatarGroupItem.Root, {
     status: "inactive"
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Avatar.Frame, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Avatar.Frame, {
     style: {
       zIndex: members.length - 4
     }
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Avatar.Fallback, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Avatar.Fallback, {
     text: `+${members.length - 3}`
-  })))), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Portal, null, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Content, {
+  })))), /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Portal, null, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Arrow, null), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.List, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Arrow, null), /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.List, {
     classNames: "max-h-56 overflow-y-auto"
-  }, members.map((member) => /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.ListItem.Root, {
+  }, members.map((member) => /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.ListItem.Root, {
     key: member.identity.identityKey.toHex(),
     classNames: "flex gap-2 items-center cursor-pointer mbe-2",
     onClick: () => onMemberClick?.(member),
     "data-testid": "identity-list-item"
-  }, /* @__PURE__ */ import_react20.default.createElement(PrensenceAvatar, {
+  }, /* @__PURE__ */ import_react21.default.createElement(PrensenceAvatar, {
     identity: member.identity,
     showName: true,
     match: member.currentlyAttended
   }))))))));
 };
 var PrensenceAvatar = ({ identity, showName, match, group, index, onClick }) => {
-  const Root = group ? import_react_ui16.AvatarGroupItem.Root : import_react_ui16.Avatar.Root;
+  const Root = group ? import_react_ui17.AvatarGroupItem.Root : import_react_ui17.Avatar.Root;
   const status = match ? "current" : "active";
   const fallbackValue = (0, import_util2.keyToFallback)(identity.identityKey);
-  return /* @__PURE__ */ import_react20.default.createElement(Root, {
+  return /* @__PURE__ */ import_react21.default.createElement(Root, {
     status,
     hue: identity.profile?.data?.hue || fallbackValue.hue
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Avatar.Frame, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Avatar.Frame, {
     "data-testid": "spacePlugin.presence.member",
     "data-status": status,
     ...index ? {
@@ -1075,16 +1151,16 @@ var PrensenceAvatar = ({ identity, showName, match, group, index, onClick }) =>
       }
     } : {},
     onClick: () => onClick?.()
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Avatar.Fallback, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Avatar.Fallback, {
     text: identity.profile?.data?.emoji || fallbackValue.emoji
-  })), showName && /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Avatar.Label, {
+  })), showName && /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Avatar.Label, {
     classNames: "text-sm truncate pli-2"
   }, getName(identity)));
 };
 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_app_framework7.useAppGraph)();
+  const { graph } = (0, import_app_framework9.useAppGraph)();
   const attended = (0, import_react_ui_attention.useAttended)();
   const startOfAttention = attended.at(-1);
   const path = usePath(graph, startOfAttention);
@@ -1093,8 +1169,8 @@ var SmallPresenceLive = ({ id, open, viewers }) => {
     const moment = Date.now();
     return Array.from(viewers2.values()).filter((viewer) => moment - viewer.lastSeen < ACTIVITY_DURATION);
   };
-  const [activeViewers, setActiveViewers] = (0, import_react20.useState)(viewers ? getActiveViewers(viewers) : []);
-  (0, import_react20.useEffect)(() => {
+  const [activeViewers, setActiveViewers] = (0, import_react21.useState)(viewers ? getActiveViewers(viewers) : []);
+  (0, import_react21.useEffect)(() => {
     if (viewers) {
       setActiveViewers(getActiveViewers(viewers));
       const interval = setInterval(() => {
@@ -1105,48 +1181,48 @@ var SmallPresenceLive = ({ id, open, viewers }) => {
   }, [
     viewers
   ]);
-  return /* @__PURE__ */ import_react20.default.createElement(SmallPresence, {
+  return /* @__PURE__ */ import_react21.default.createElement(SmallPresence, {
     count: activeViewers.length,
     attended: isAttended,
     containsAttended
   });
 };
 var SmallPresence = ({ count = 0, attended, containsAttended }) => {
-  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, {
+  const { t } = (0, import_react_ui17.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  return /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Root, null, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui_attention.AttentionGlyph, {
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui_attention.AttentionGlyph, {
     attended,
     containsAttended,
     presence: count > 1 ? "many" : count === 1 ? "one" : "none",
     classNames: "self-center mie-1"
-  })), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Portal, null, /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Content, {
+  })), /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Portal, null, /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ import_react20.default.createElement("span", null, t("presence label", {
+  }, /* @__PURE__ */ import_react21.default.createElement("span", null, t("presence label", {
     count
-  })), /* @__PURE__ */ import_react20.default.createElement(import_react_ui16.Tooltip.Arrow, null))));
+  })), /* @__PURE__ */ import_react21.default.createElement(import_react_ui17.Tooltip.Arrow, null))));
 };
 var SpacePluginSettings = ({ settings }) => {
-  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, {
+  const { t } = (0, import_react_ui18.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  return /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form4.DeprecatedFormContainer, null, /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form4.DeprecatedFormInput, {
     label: t("show hidden spaces label")
-  }, /* @__PURE__ */ import_react22.default.createElement(import_react_ui17.Input.Switch, {
+  }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui18.Input.Switch, {
     checked: settings.showHidden,
     onCheckedChange: (checked) => settings.showHidden = !!checked
   })));
 };
-var __dxlog_file3 = "/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_WZR6OAN3.SPACE_PLUGIN);
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx";
+var SpaceSettingsPanel = ({ space }) => {
+  const { t } = (0, import_react_ui19.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) => {
+  const [edgeReplication, setEdgeReplication] = (0, import_react24.useState)(space.internal.data.edgeReplication === import_metadata.EdgeReplicationSetting.ENABLED);
+  const toggleEdgeReplication = (0, import_react24.useCallback)(async (next) => {
     setEdgeReplication(next);
     await space?.internal.setEdgeReplicationPreference(next ? import_metadata.EdgeReplicationSetting.ENABLED : import_metadata.EdgeReplicationSetting.DISABLED).catch((err) => {
       import_log3.log.catch(err, void 0, {
-        F: __dxlog_file3,
-        L: 35,
+        F: __dxlog_file5,
+        L: 36,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -1155,34 +1231,50 @@ var SpaceSettingsPanel = ({ classNames, space }) => {
   }, [
     space
   ]);
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormContainer, null, /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
+  return /* @__PURE__ */ import_react24.default.createElement(import_react_ui_form5.DeprecatedFormContainer, null, /* @__PURE__ */ import_react24.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
     label: t("name label")
-  }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui18.Input.TextInput, {
+  }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Input.TextInput, {
     placeholder: t("unnamed space label"),
     value: space.properties.name ?? "",
     onChange: (event) => {
       space.properties.name = event.target.value;
     }
-  })), edgeEnabled && /* @__PURE__ */ import_react23.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
+  })), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
+    label: t("icon label")
+  }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Toolbar.Root, null, /* @__PURE__ */ import_react24.default.createElement(import_react_ui_pickers.IconPicker, {
+    value: space.properties.icon,
+    onChange: (nextIcon) => space.properties.icon = nextIcon,
+    onReset: () => {
+      space.properties.icon = void 0;
+    }
+  }))), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
+    label: t("hue label")
+  }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Toolbar.Root, null, /* @__PURE__ */ import_react24.default.createElement(import_react_ui_pickers.HuePicker, {
+    value: space.properties.hue,
+    onChange: (nextHue) => space.properties.hue = nextHue,
+    onReset: () => {
+      space.properties.hue = void 0;
+    }
+  }))), edgeEnabled && /* @__PURE__ */ import_react24.default.createElement(import_react_ui_form5.DeprecatedFormInput, {
     label: t("edge replication label")
-  }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui18.Input.Switch, {
+  }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Input.Switch, {
     checked: edgeReplication,
     onCheckedChange: toggleEdgeReplication
   })));
 };
 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_WZR6OAN3.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui20.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_MMXP2NHE.COMPOSER_SPACE_LOCK];
-  const name = (0, import_chunk_MMXP2NHE.getSpaceDisplayName)(space, {
+  const [tabsActivePart, setTabsActivePart] = (0, import_react25.useState)("list");
+  const [selected, setSelected] = (0, import_react25.useState)(initialTab);
+  const locked = space.properties[import_chunk_OVGKWJOC.COMPOSER_SPACE_LOCK];
+  const name = (0, import_chunk_OVGKWJOC.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)(() => ({
+  const panels = (0, import_app_framework10.useCapabilities)(import_chunk_YZKNRFHU.SpaceCapabilities.SettingsPanel);
+  const data = (0, import_react25.useMemo)(() => ({
     subject: space
   }), [
     space
@@ -1190,82 +1282,82 @@ var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "m
   return (
     // TODO(wittjosiah): The tablist dialog pattern is copied from @dxos/plugin-manager.
     //  Consider factoring it out to the tabs package.
-    /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Dialog.Content, {
+    /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Dialog.Content, {
       classNames: "p-0 bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
-    }, /* @__PURE__ */ import_react24.default.createElement("div", {
+    }, /* @__PURE__ */ import_react25.default.createElement("div", {
       role: "none",
       className: "flex justify-between pbs-2 pis-2 pie-2 @md:pbs-4 @md:pis-4 @md:pie-4"
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Dialog.Title, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Dialog.Title, {
       onClick: () => setTabsActivePart("list"),
       "aria-description": t("click to return to tablist description"),
       classNames: "flex cursor-pointer items-center group/title"
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Icon, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Icon, {
       icon: "ph--caret-left--regular",
       size: 4,
       classNames: [
         "@md:hidden",
         tabsActivePart === "list" && "invisible"
       ]
-    }), /* @__PURE__ */ import_react24.default.createElement("span", {
+    }), /* @__PURE__ */ import_react25.default.createElement("span", {
       className: tabsActivePart !== "list" ? "group-hover/title:underline @md:group-hover/title:no-underline underline-offset-4 decoration-1" : ""
-    }, (0, import_react_ui19.toLocalizedString)(name, t))), /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Dialog.Close, {
+    }, (0, import_react_ui20.toLocalizedString)(name, t))), /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Dialog.Close, {
       asChild: true
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Button, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Button, {
       density: "fine",
       variant: "ghost",
       autoFocus: true
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Icon, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Icon, {
       icon: "ph--x--regular",
       size: 4
-    })))), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Root, {
+    })))), /* @__PURE__ */ import_react25.default.createElement(import_react_ui_tabs.Tabs.Root, {
       orientation: "vertical",
       value: selected,
       onValueChange: setSelected,
       activePart: tabsActivePart,
       onActivePartChange: setTabsActivePart,
       classNames: "flex flex-col flex-1 mbs-2"
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Viewport, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui_tabs.Tabs.Viewport, {
       classNames: "flex-1 min-bs-0"
-    }, /* @__PURE__ */ import_react24.default.createElement("div", {
+    }, /* @__PURE__ */ import_react25.default.createElement("div", {
       role: "none",
       className: "overflow-y-auto pli-3 @md:pis-2 @md:pie-0 mbe-4 border-r border-separator"
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tablist, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui_tabs.Tabs.Tablist, {
       classNames: "flex flex-col max-bs-none min-is-[200px] gap-4 overflow-y-auto"
-    }, /* @__PURE__ */ import_react24.default.createElement("div", {
+    }, /* @__PURE__ */ import_react25.default.createElement("div", {
       role: "none",
       className: "flex flex-col ml-1"
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tab, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui_tabs.Tabs.Tab, {
       value: "settings"
-    }, t("settings tab label")), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tab, {
+    }, t("settings tab label")), /* @__PURE__ */ import_react25.default.createElement(import_react_ui_tabs.Tabs.Tab, {
       value: "members",
       disabled: locked
-    }, t("members tab label")), panels.map((panel) => /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tab, {
+    }, t("members tab label")), panels.map((panel) => /* @__PURE__ */ import_react25.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, {
+    }, (0, import_react_ui20.toLocalizedString)(panel.label, t)))))), /* @__PURE__ */ import_react25.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, {
+    }, /* @__PURE__ */ import_react25.default.createElement(SpaceSettingsPanel, {
       space
-    })), /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tabpanel, {
+    })), /* @__PURE__ */ import_react25.default.createElement(import_react_ui_tabs.Tabs.Tabpanel, {
       value: "members",
       classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
-    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui19.Clipboard.Provider, null, /* @__PURE__ */ import_react24.default.createElement(import_react25.SpacePanel, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui20.Clipboard.Provider, null, /* @__PURE__ */ import_react25.default.createElement(import_react26.SpacePanel, {
       space,
       hideHeading: true,
       target,
       createInvitationUrl
-    }))), panels.map((panel) => /* @__PURE__ */ import_react24.default.createElement(import_react_ui_tabs.Tabs.Tabpanel, {
+    }))), panels.map((panel) => /* @__PURE__ */ import_react25.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, {
+    }, /* @__PURE__ */ import_react25.default.createElement(import_app_framework10.Surface, {
       role: `space-settings--${panel.id}`,
       data
     }))))))
   );
 };
-var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/sync-state.ts";
+var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/sync-state.ts";
 var createEmptyEdgeSyncState = () => ({
   missingOnLocal: 0,
   missingOnRemote: 0,
@@ -1286,10 +1378,10 @@ var getSyncSummary = (syncMap) => {
 var isEdgePeerId = (peerId, spaceId) => peerId.startsWith(`${import_protocols.EdgeService.AUTOMERGE_REPLICATOR}:${spaceId}`);
 var useSyncState = () => {
   const client = (0, import_react_client9.useClient)();
-  const [spaceState, setSpaceState] = (0, import_react27.useState)({});
-  (0, import_react27.useEffect)(() => {
+  const [spaceState, setSpaceState] = (0, import_react28.useState)({});
+  (0, import_react28.useEffect)(() => {
     const ctx = new import_context.Context(void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file6,
       L: 48
     });
     const createSubscriptions = (spaces) => {
@@ -1321,10 +1413,10 @@ var useSyncState = () => {
   return spaceState;
 };
 var useSpaceSyncState = (space) => {
-  const [spaceState, setSpaceState] = (0, import_react27.useState)();
-  (0, import_react27.useEffect)(() => {
+  const [spaceState, setSpaceState] = (0, import_react28.useState)();
+  (0, import_react28.useEffect)(() => {
     const ctx = new import_context.Context(void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file6,
       L: 87
     });
     space.crud.subscribeToSyncState(ctx, ({ peers = [] }) => {
@@ -1342,9 +1434,9 @@ var useSpaceSyncState = (space) => {
   return spaceState;
 };
 var useEdgeStatus = () => {
-  const [status, setStatus] = (0, import_react26.useState)(import_services.QueryEdgeStatusResponse.EdgeStatus.NOT_CONNECTED);
+  const [status, setStatus] = (0, import_react27.useState)(import_services.QueryEdgeStatusResponse.EdgeStatus.NOT_CONNECTED);
   const client = (0, import_react_client8.useClient)();
-  (0, import_react26.useEffect)(() => {
+  (0, import_react27.useEffect)(() => {
     client.services.services.EdgeAgentService?.queryEdgeStatus().subscribe(({ status: status2 }) => {
       setStatus(status2);
     });
@@ -1354,11 +1446,11 @@ var useEdgeStatus = () => {
   return status;
 };
 var InlineSyncStatus = ({ space, open }) => {
-  const { t } = (0, import_react_ui20.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui21.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_app_framework10.useAppGraph)();
+  const { graph } = (0, import_app_framework11.useAppGraph)();
   const attended = (0, import_react_ui_attention2.useAttended)();
   const startOfAttention = attended.at(-1);
   const path = usePath(graph, startOfAttention);
@@ -1367,17 +1459,17 @@ var InlineSyncStatus = ({ space, open }) => {
   const edgeSyncEnabled = space.internal.data.edgeReplication === import_metadata2.EdgeReplicationSetting.ENABLED;
   const syncState = useSpaceSyncState(space);
   const syncing = connectedToEdge && edgeSyncEnabled && syncState && syncState.missingOnLocal > 0;
-  return /* @__PURE__ */ import_react26.default.createElement(import_react_ui20.Tooltip.Root, null, /* @__PURE__ */ import_react26.default.createElement(import_react_ui20.Tooltip.Trigger, {
+  return /* @__PURE__ */ import_react27.default.createElement(import_react_ui21.Tooltip.Root, null, /* @__PURE__ */ import_react27.default.createElement(import_react_ui21.Tooltip.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ import_react26.default.createElement(import_react_ui_attention2.AttentionGlyph, {
+  }, /* @__PURE__ */ import_react27.default.createElement(import_react_ui_attention2.AttentionGlyph, {
     syncing,
     attended: isAttended,
     containsAttended,
     classNames: "self-center mie-1"
-  })), /* @__PURE__ */ import_react26.default.createElement(import_react_ui20.Tooltip.Portal, null, /* @__PURE__ */ import_react26.default.createElement(import_react_ui20.Tooltip.Content, {
+  })), /* @__PURE__ */ import_react27.default.createElement(import_react_ui21.Tooltip.Portal, null, /* @__PURE__ */ import_react27.default.createElement(import_react_ui21.Tooltip.Content, {
     side: "bottom",
     classNames: "z-[70]"
-  }, /* @__PURE__ */ import_react26.default.createElement("span", null, t("syncing label")), /* @__PURE__ */ import_react26.default.createElement(import_react_ui20.Tooltip.Arrow, null))));
+  }, /* @__PURE__ */ import_react27.default.createElement("span", null, t("syncing label")), /* @__PURE__ */ import_react27.default.createElement(import_react_ui21.Tooltip.Arrow, null))));
 };
 var SYNC_STALLED_TIMEOUT = 5e3;
 var styles = {
@@ -1386,9 +1478,9 @@ var styles = {
   barHover: "dark:hover:bg-green-500"
 };
 var useActive = (count) => {
-  const [current, setCurrent] = (0, import_react29.useState)(count);
-  const [active, setActive] = (0, import_react29.useState)(false);
-  (0, import_react29.useEffect)(() => {
+  const [current, setCurrent] = (0, import_react30.useState)(count);
+  const [active, setActive] = (0, import_react30.useState)(false);
+  (0, import_react30.useEffect)(() => {
     let t;
     if (count !== current) {
       setActive(true);
@@ -1409,16 +1501,16 @@ var useActive = (count) => {
   return active;
 };
 var SpaceRowContainer = ({ spaceId, state }) => {
-  const { t } = (0, import_react_ui22.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui23.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_MMXP2NHE.getSpaceDisplayName)(space, {
+  const spaceName = (0, import_react_ui23.toLocalizedString)((0, import_chunk_OVGKWJOC.getSpaceDisplayName)(space, {
     personal: space === client.spaces.default
   }), t);
-  return /* @__PURE__ */ import_react29.default.createElement(SpaceRow, {
+  return /* @__PURE__ */ import_react30.default.createElement(SpaceRow, {
     spaceId,
     spaceName,
     state
@@ -1427,19 +1519,19 @@ var SpaceRowContainer = ({ spaceId, state }) => {
 var SpaceRow = ({ spaceId, spaceName, state: { localDocumentCount, remoteDocumentCount, missingOnLocal, missingOnRemote } }) => {
   const downActive = useActive(localDocumentCount);
   const upActive = useActive(remoteDocumentCount);
-  return /* @__PURE__ */ import_react29.default.createElement("div", {
+  return /* @__PURE__ */ import_react30.default.createElement("div", {
     className: "flex items-center mx-0.5 gap-0.5 cursor-pointer",
     title: spaceId,
     onClick: () => {
       void navigator.clipboard.writeText(spaceId);
     }
-  }, /* @__PURE__ */ import_react29.default.createElement("span", {
+  }, /* @__PURE__ */ import_react30.default.createElement("span", {
     className: "is-1/2 truncate"
-  }, spaceName), /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Icon, {
+  }, spaceName), /* @__PURE__ */ import_react30.default.createElement(import_react_ui23.Icon, {
     icon: "ph--arrow-fat-line-left--regular",
     size: 3,
     classNames: (0, import_react_ui_theme6.mx)(downActive && "animate-[pulse_1s_infinite]")
-  }), /* @__PURE__ */ import_react29.default.createElement(Candle, {
+  }), /* @__PURE__ */ import_react30.default.createElement(Candle, {
     up: {
       count: remoteDocumentCount,
       total: remoteDocumentCount + missingOnRemote
@@ -1449,41 +1541,41 @@ var SpaceRow = ({ spaceId, spaceName, state: { localDocumentCount, remoteDocumen
       total: localDocumentCount + missingOnLocal
     },
     title: spaceId
-  }), /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Icon, {
+  }), /* @__PURE__ */ import_react30.default.createElement(import_react_ui23.Icon, {
     icon: "ph--arrow-fat-line-right--regular",
     size: 3,
     classNames: (0, import_react_ui_theme6.mx)(upActive && "animate-[pulse_1s_step-start_infinite]")
   }));
 };
 var Candle = ({ classNames, up, down }) => {
-  return /* @__PURE__ */ import_react29.default.createElement("div", {
+  return /* @__PURE__ */ import_react30.default.createElement("div", {
     className: (0, import_react_ui_theme6.mx)("grid grid-cols-[1fr_2rem_1fr] w-full h-3", classNames)
-  }, /* @__PURE__ */ import_react29.default.createElement(Bar, {
+  }, /* @__PURE__ */ import_react30.default.createElement(Bar, {
     classNames: "justify-end",
     ...up
-  }), /* @__PURE__ */ import_react29.default.createElement("div", {
+  }), /* @__PURE__ */ import_react30.default.createElement("div", {
     className: "relative"
-  }, /* @__PURE__ */ import_react29.default.createElement("div", {
+  }, /* @__PURE__ */ import_react30.default.createElement("div", {
     className: (0, import_react_ui_theme6.mx)("absolute inset-0 flex items-center justify-center text-xs", styles.barBg)
-  }, up.total)), /* @__PURE__ */ import_react29.default.createElement(Bar, down));
+  }, up.total)), /* @__PURE__ */ import_react30.default.createElement(Bar, down));
 };
 var Bar = ({ classNames, count, total }) => {
   let p = count / total * 100;
   if (count < total) {
     p = Math.min(p, 95);
   }
-  return /* @__PURE__ */ import_react29.default.createElement("div", {
+  return /* @__PURE__ */ import_react30.default.createElement("div", {
     className: (0, import_react_ui_theme6.mx)("relative flex w-full", styles.barBg, classNames)
-  }, /* @__PURE__ */ import_react29.default.createElement("div", {
+  }, /* @__PURE__ */ import_react30.default.createElement("div", {
     className: (0, import_react_ui_theme6.mx)("shrink-0", styles.barFg),
     style: {
       width: `${p}%`
     }
-  }), count !== total && /* @__PURE__ */ import_react29.default.createElement("div", {
+  }), count !== total && /* @__PURE__ */ import_react30.default.createElement("div", {
     className: "absolute top-0 bottom-0 flex items-center mx-0.5 text-black text-xs"
   }, count));
 };
-var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/save-tracker.ts";
+var __dxlog_file7 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/save-tracker.ts";
 var createClientSaveTracker = (client, cb) => {
   const unsubscribeCallbacks = {};
   const state = {};
@@ -1511,7 +1603,7 @@ var createClientSaveTracker = (client, cb) => {
 };
 var createSpaceSaveTracker = (space, cb) => {
   const ctx = new import_context2.Context(void 0, {
-    F: __dxlog_file5,
+    F: __dxlog_file7,
     L: 40
   });
   void space.waitUntilReady().then(() => {
@@ -1572,19 +1664,19 @@ var getIcon = (status) => {
 var SyncStatus = () => {
   const client = (0, import_react_client10.useClient)();
   const state = useSyncState();
-  const [saved, setSaved] = (0, import_react28.useState)(true);
-  (0, import_react28.useEffect)(() => {
+  const [saved, setSaved] = (0, import_react29.useState)(true);
+  (0, import_react29.useEffect)(() => {
     return createClientSaveTracker(client, (state2) => {
       setSaved(state2 === "saved");
     });
   }, []);
-  return /* @__PURE__ */ import_react28.default.createElement(SyncStatusIndicator, {
+  return /* @__PURE__ */ import_react29.default.createElement(SyncStatusIndicator, {
     state,
     saved
   });
 };
 var SyncStatusIndicator = ({ state, saved }) => {
-  const { t } = (0, import_react_ui21.useTranslation)(import_chunk_WZR6OAN3.SPACE_PLUGIN);
+  const { t } = (0, import_react_ui22.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;
@@ -1595,8 +1687,8 @@ var SyncStatusIndicator = ({ state, saved }) => {
     needsToUpload,
     needsToDownload
   });
-  const [classNames, setClassNames] = (0, import_react28.useState)();
-  (0, import_react28.useEffect)(() => {
+  const [classNames, setClassNames] = (0, import_react29.useState)();
+  (0, import_react29.useEffect)(() => {
     setClassNames(void 0);
     if (offline || !needsToUpload && !needsToDownload) {
       return;
@@ -1611,58 +1703,58 @@ var SyncStatusIndicator = ({ state, saved }) => {
     needsToDownload
   ]);
   const title = t(`${status} label`);
-  const icon = /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Icon, {
+  const icon = /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Icon, {
     icon: getIcon(status),
     size: 4,
     classNames
   });
   if (offline) {
-    return /* @__PURE__ */ import_react28.default.createElement(import_plugin_status_bar.StatusBar.Item, {
+    return /* @__PURE__ */ import_react29.default.createElement(import_plugin_status_bar.StatusBar.Item, {
       title
     }, icon);
   } else {
-    return /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Root, null, /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Trigger, {
+    return /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Popover.Root, null, /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Popover.Trigger, {
       asChild: true
-    }, /* @__PURE__ */ import_react28.default.createElement(import_plugin_status_bar.StatusBar.Button, {
+    }, /* @__PURE__ */ import_react29.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, null, /* @__PURE__ */ import_react28.default.createElement(SyncStatusDetail, {
+    }, icon)), /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Popover.Portal, null, /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Popover.Content, null, /* @__PURE__ */ import_react29.default.createElement(SyncStatusDetail, {
       state,
       summary,
       debug: false
-    }), /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Popover.Arrow, null))));
+    }), /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.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_WZR6OAN3.SPACE_PLUGIN);
+  const [showAll, setShowAll] = (0, import_react29.useState)(false);
+  const { t } = (0, import_react_ui22.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), [
+  const handleCheckedChange = (0, import_react29.useCallback)((state2) => setShowAll(state2), [
     setShowAll
   ]);
-  return /* @__PURE__ */ import_react28.default.createElement("div", {
+  return /* @__PURE__ */ import_react29.default.createElement("div", {
     className: (0, import_react_ui_theme5.mx)("flex flex-col gap-3 p-2 text-xs min-w-96", classNames)
-  }, /* @__PURE__ */ import_react28.default.createElement("div", {
+  }, /* @__PURE__ */ import_react29.default.createElement("div", {
     role: "none",
     className: "flex items-center"
-  }, /* @__PURE__ */ import_react28.default.createElement("h1", {
+  }, /* @__PURE__ */ import_react29.default.createElement("h1", {
     className: "flex-1"
-  }, t("sync status title")), /* @__PURE__ */ import_react28.default.createElement("div", {
+  }, t("sync status title")), /* @__PURE__ */ import_react29.default.createElement("div", {
     className: "flex items-center gap-2"
-  }, /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Input.Root, null, /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Input.Label, {
+  }, /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Input.Root, null, /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Input.Label, {
     classNames: "text-xs"
-  }, t("show all label")), /* @__PURE__ */ import_react28.default.createElement(import_react_ui21.Input.Checkbox, {
+  }, t("show all label")), /* @__PURE__ */ import_react29.default.createElement(import_react_ui22.Input.Checkbox, {
     checked: showAll,
     onCheckedChange: handleCheckedChange
-  })))), /* @__PURE__ */ import_react28.default.createElement("div", {
+  })))), /* @__PURE__ */ import_react29.default.createElement("div", {
     className: "flex flex-col gap-2"
-  }, entries.length === 0 && /* @__PURE__ */ import_react28.default.createElement("div", {
+  }, entries.length === 0 && /* @__PURE__ */ import_react29.default.createElement("div", {
     role: "none",
     className: "flex justify-center"
-  }, t("no sync status label")), entries.map(([spaceId, state2]) => /* @__PURE__ */ import_react28.default.createElement(SpaceRowContainer, {
+  }, t("no sync status label")), entries.map(([spaceId, state2]) => /* @__PURE__ */ import_react29.default.createElement(SpaceRowContainer, {
     key: spaceId,
     spaceId,
     state: state2
-  }))), debug && /* @__PURE__ */ import_react28.default.createElement(import_react_ui_syntax_highlighter.SyntaxHighlighter, {
+  }))), debug && /* @__PURE__ */ import_react29.default.createElement(import_react_ui_syntax_highlighter.SyntaxHighlighter, {
     language: "json"
   }, JSON.stringify(summary, null, 2)));
 };
@@ -1686,14 +1778,17 @@ var SyncStatusDetail = ({ classNames, state, summary, debug }) => {
   JOIN_DIALOG,
   JoinDialog,
   MenuFooter,
+  POPOVER_ADD_SPACE,
   POPOVER_RENAME_OBJECT,
   POPOVER_RENAME_SPACE,
   PersistenceStatus,
+  PopoverAddSpace,
   PopoverRenameObject,
   PopoverRenameSpace,
   ReactRoot,
   ReactSurface,
   SPACE_SETTINGS_DIALOG,
+  Schema,
   ShareSpaceButton,
   ShareSpaceButtonImpl,
   SmallPresence,
@@ -1709,4 +1804,4 @@ var SyncStatusDetail = ({ classNames, state, summary, debug }) => {
   SyncStatusDetail,
   SyncStatusIndicator
 });
-//# sourceMappingURL=chunk-2RCJT3P2.cjs.map
+//# sourceMappingURL=chunk-N2FS7PRA.cjs.map