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

package/dist/lib/browser/{chunk-DIBLC24B.mjs → chunk-S6B7627U.mjs}

@@ -1,15 +1,15 @@
 import {
   SpaceCapabilities
-} from "./chunk-RLZQJD47.mjs";
+} from "./chunk-NU7WDVGN.mjs";
 import {
   COMPOSER_SPACE_LOCK,
   getSpaceDisplayName
-} from "./chunk-ZL5ZFGBK.mjs";
+} from "./chunk-23RVI5FZ.mjs";
 import {
   CollectionType,
   SpaceAction,
   SpaceForm
-} from "./chunk-XPZ6IIXF.mjs";
+} from "./chunk-ULA2UQJ4.mjs";
 import {
   SPACE_PLUGIN
 } from "./chunk-PQXZCNAU.mjs";
@@ -228,20 +228,23 @@ var BaseObjectSettings = ({ object }) => {
 // packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectDialog.tsx
 import { pipe } from "effect";
 import React6, { useCallback as useCallback5, useRef } from "react";
-import { chain, createIntent as createIntent2, LayoutAction as LayoutAction2, useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
+import { Capabilities, chain, createIntent as createIntent2, LayoutAction as LayoutAction2, useCapabilities, useIntentDispatcher as useIntentDispatcher2, usePluginManager as usePluginManager2 } from "@dxos/app-framework";
+import { invariant as invariant2 } from "@dxos/invariant";
 import { useClient as useClient2 } from "@dxos/react-client";
 import { getSpace, isReactiveObject, isSpace, useSpaces } from "@dxos/react-client/echo";
 import { Button as Button2, Dialog, Icon as Icon2, useTranslation as useTranslation6 } from "@dxos/react-ui";
 
 // packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectPanel.tsx
-import React5, { useCallback as useCallback4, useMemo, useState as useState3 } from "react";
+import React5, { useCallback as useCallback4, useState as useState3 } from "react";
 import { Surface, isSurfaceAvailable, usePluginManager } from "@dxos/app-framework";
-import { getObjectAnnotation, S } from "@dxos/echo-schema";
+import { getObjectAnnotation } from "@dxos/echo-schema";
+import { invariant } from "@dxos/invariant";
 import { Icon, toLocalizedString, useTranslation as useTranslation5 } from "@dxos/react-ui";
 import { Form as Form2 } from "@dxos/react-ui-form";
 import { SearchList } from "@dxos/react-ui-searchlist";
 import { mx as mx2 } from "@dxos/react-ui-theme";
 import { isNonNullable } from "@dxos/util";
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectPanel.tsx";
 var useInputSurfaceLookup = (baseData) => {
   const pluginManager = usePluginManager();
   return useCallback4(({ prop, schema, inputProps }) => {
@@ -266,12 +269,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 } = useTranslation5(SPACE_PLUGIN);
   const [typename, setTypename] = useState3(initialTypename);
   const [target, setTarget] = useState3(initialTarget);
-  const schema = schemas.find((schema2) => getObjectAnnotation(schema2)?.typename === typename);
-  const options = schemas.map(getObjectAnnotation).filter(isNonNullable).sort((a, b) => {
+  const form = forms.find((form2) => getObjectAnnotation(form2.objectSchema)?.typename === typename);
+  const options = forms.map((form2) => getObjectAnnotation(form2.objectSchema)).filter(isNonNullable).sort((a, b) => {
     const nameA = t("typename label", {
       ns: a.typename,
       defaultValue: a.typename
@@ -283,63 +286,68 @@ var CreateObjectPanel = ({ classNames, schemas, spaces, typename: initialTypenam
     return nameA.localeCompare(nameB);
   });
   const handleCreateObject = useCallback4(async (props) => {
-    if (!schema || !target) {
+    if (!form || !target) {
       return;
     }
     await onCreateObject?.({
-      schema,
+      form,
       target,
       data: props
     });
   }, [
     onCreateObject,
-    schema,
+    form,
     target
   ]);
-  const metadata = useMemo(() => {
-    if (!typename) {
-      return;
+  const handleSetTypename = useCallback4(async (typename2) => {
+    invariant(target, "target is required", {
+      F: __dxlog_file,
+      L: 94,
+      S: void 0,
+      A: [
+        "target",
+        "'target is required'"
+      ]
+    });
+    const form2 = forms.find((form3) => 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 = useMemo(() => {
-    const schema2 = metadata?.creationSchema ?? S.Struct({
-      name: S.optional(S.String)
-    });
-    return /* @__PURE__ */ React5.createElement(Form2, {
-      classNames: "!p-0",
-      autoFocus: true,
-      values: {
-        name: initialName
-      },
-      schema: schema2,
-      testId: "create-object-form",
-      onSave: handleCreateObject,
-      lookupComponent: inputSurfaceLookup
-    });
-  }, [
-    initialName,
-    handleCreateObject,
-    metadata
-  ]);
   return /* @__PURE__ */ React5.createElement("div", {
     role: "form",
     className: mx2("flex flex-col gap-2", classNames)
-  }, !schema ? /* @__PURE__ */ React5.createElement(SelectSchema, {
+  }, !form ? /* @__PURE__ */ React5.createElement(SelectSchema, {
     options,
     resolve,
-    onChange: setTypename
+    onChange: handleSetTypename
   }) : !target ? /* @__PURE__ */ React5.createElement(SelectSpace, {
     spaces,
     defaultSpaceId,
     onChange: setTarget
-  }) : form);
+  }) : form.formSchema ? /* @__PURE__ */ React5.createElement(Form2, {
+    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 } = useTranslation5(SPACE_PLUGIN);
@@ -405,23 +413,50 @@ var SelectSchema = ({ options, resolve, onChange }) => {
   }))))));
 };
 
+// packages/plugins/plugin-space/src/capabilities/index.ts
+import { lazy } from "@dxos/app-framework";
+var AppGraphBuilder = lazy(() => import("./app-graph-builder-MGK5HWPZ.mjs"));
+var AppGraphSerializer = lazy(() => import("./app-graph-serializer-FOWFLYGU.mjs"));
+var IdentityCreated = lazy(() => import("./identity-created-FYGS6TBH.mjs"));
+var IntentResolver = lazy(() => import("./intent-resolver-QVR4MSJV.mjs"));
+var ReactRoot = lazy(() => import("./react-root-IP2ZB245.mjs"));
+var ReactSurface = lazy(() => import("./react-surface-BT3EHB6V.mjs"));
+var Schema = lazy(() => import("./schema-5W3DSY2E.mjs"));
+var SpaceSettings = lazy(() => import("./settings-PHPCXX33.mjs"));
+var SpaceState = lazy(() => import("./state-INJ63O57.mjs"));
+var SpacesReady = lazy(() => import("./spaces-ready-K47RR7N2.mjs"));
+
 // packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectDialog.tsx
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/CreateDialog/CreateObjectDialog.tsx";
 var CREATE_OBJECT_DIALOG = `${SPACE_PLUGIN}/CreateObjectDialog`;
-var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _shouldNavigate, resolve }) => {
+var CreateObjectDialog = ({ target, typename, name, shouldNavigate: _shouldNavigate }) => {
   const closeRef = useRef(null);
+  const manager = usePluginManager2();
   const { t } = useTranslation6(SPACE_PLUGIN);
   const client = useClient2();
   const spaces = useSpaces();
   const { dispatchPromise: dispatch } = useIntentDispatcher2();
-  const handleCreateObject = useCallback5(async ({ schema, target: _target, data }) => {
+  const forms = useCapabilities(SpaceCapabilities.ObjectForm);
+  const resolve = useCallback5((typename2) => manager.context.requestCapabilities(Capabilities.Metadata).find(({ id }) => id === typename2)?.metadata ?? {}, [
+    manager
+  ]);
+  const handleCreateObject = useCallback5(async ({ form, target: _target, data = {} }) => {
     const target2 = isSpace(_target) ? _target.properties[CollectionType.typename]?.target : _target;
-    const createObjectIntent = resolve?.(schema.typename)?.createObject;
-    if (!createObjectIntent || !target2) {
+    if (!target2) {
       return;
     }
     closeRef.current?.click();
     const space = isSpace(target2) ? target2 : getSpace(target2);
-    const result = await dispatch(createObjectIntent(data, {
+    invariant2(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;
@@ -463,7 +498,7 @@ var CreateObjectDialog = ({ schemas, target, typename, name, shouldNavigate: _sh
       size: 4
     })))), /* @__PURE__ */ React6.createElement(CreateObjectPanel, {
       classNames: "p-4",
-      schemas,
+      forms,
       spaces,
       target,
       typename,
@@ -571,7 +606,7 @@ import { ObservabilityAction } from "@dxos/plugin-observability/types";
 import { useClient as useClient3 } from "@dxos/react-client";
 import { Dialog as Dialog3 } from "@dxos/react-ui";
 import { JoinPanel } from "@dxos/shell/react";
-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 = `${SPACE_PLUGIN}/JoinDialog`;
 var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
   const { dispatchPromise: dispatch } = useIntentDispatcher4();
@@ -610,7 +645,7 @@ var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
     const space = result?.spaceKey ? client.spaces.get(result.spaceKey) : void 0;
     if (!space) {
       log.warn("Space not found", result?.spaceKey, {
-        F: __dxlog_file,
+        F: __dxlog_file3,
         L: 56,
         S: void 0,
         C: (f, a) => f(...a)
@@ -750,14 +785,58 @@ var PersistenceStatus = ({ db }) => {
   }
 };
 
+// packages/plugins/plugin-space/src/components/PopoverAddSpace.tsx
+import React13 from "react";
+import { createIntent as createIntent5, LayoutAction as LayoutAction5, useIntentDispatcher as useIntentDispatcher5 } from "@dxos/app-framework";
+import { IconButton as IconButton3, useTranslation as useTranslation12 } from "@dxos/react-ui";
+var POPOVER_ADD_SPACE = `${SPACE_PLUGIN}/PopoverRenameSpace`;
+var PopoverAddSpace = () => {
+  const { t } = useTranslation12(SPACE_PLUGIN);
+  const { dispatchPromise: dispatch } = useIntentDispatcher5();
+  return /* @__PURE__ */ React13.createElement("div", {
+    role: "none",
+    className: "grid grid-cols-1 gap-1 [&>button]:justify-start"
+  }, /* @__PURE__ */ React13.createElement(IconButton3, {
+    variant: "ghost",
+    label: t("create space label"),
+    icon: "ph--plus--regular",
+    onClick: () => {
+      void dispatch(createIntent5(SpaceAction.OpenCreateSpace));
+      void dispatch(createIntent5(LayoutAction5.UpdatePopover, {
+        part: "popover",
+        options: {
+          anchorId: "",
+          state: false
+        }
+      }));
+    },
+    "data-testid": "spacePlugin.createSpace"
+  }), /* @__PURE__ */ React13.createElement(IconButton3, {
+    variant: "ghost",
+    label: t("join space label"),
+    icon: "ph--sign-in--regular",
+    onClick: () => {
+      void dispatch(createIntent5(SpaceAction.Join));
+      void dispatch(createIntent5(LayoutAction5.UpdatePopover, {
+        part: "popover",
+        options: {
+          anchorId: "",
+          state: false
+        }
+      }));
+    },
+    "data-testid": "spacePlugin.joinSpace"
+  }));
+};
+
 // packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx
-import React13, { useCallback as useCallback8, useRef as useRef3, useState as useState5 } from "react";
+import React14, { useCallback as useCallback8, useRef as useRef3, useState as useState5 } from "react";
 import { log as log2 } from "@dxos/log";
-import { Button as Button4, Input as Input2, Popover, useTranslation as useTranslation12 } from "@dxos/react-ui";
-var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx";
+import { Button as Button4, Input as Input2, Popover, useTranslation as useTranslation13 } from "@dxos/react-ui";
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx";
 var POPOVER_RENAME_OBJECT = `${SPACE_PLUGIN}/PopoverRenameObject`;
 var PopoverRenameObject = ({ object: obj }) => {
-  const { t } = useTranslation12(SPACE_PLUGIN);
+  const { t } = useTranslation13(SPACE_PLUGIN);
   const doneButton = useRef3(null);
   const object = obj;
   const [name, setName] = useState5(object.name || object.title || "");
@@ -771,7 +850,7 @@ var PopoverRenameObject = ({ object: obj }) => {
         log2.error("Failed to rename object", {
           err
         }, {
-          F: __dxlog_file2,
+          F: __dxlog_file4,
           L: 30,
           S: void 0,
           C: (f, a) => f(...a)
@@ -782,23 +861,23 @@ var PopoverRenameObject = ({ object: obj }) => {
     object,
     name
   ]);
-  return /* @__PURE__ */ React13.createElement("div", {
+  return /* @__PURE__ */ React14.createElement("div", {
     role: "none",
     className: "p-1 flex gap-2"
-  }, /* @__PURE__ */ React13.createElement("div", {
+  }, /* @__PURE__ */ React14.createElement("div", {
     role: "none",
     className: "flex-1"
-  }, /* @__PURE__ */ React13.createElement(Input2.Root, null, /* @__PURE__ */ React13.createElement(Input2.Label, {
+  }, /* @__PURE__ */ React14.createElement(Input2.Root, null, /* @__PURE__ */ React14.createElement(Input2.Label, {
     srOnly: true
-  }, t("object name label")), /* @__PURE__ */ React13.createElement(Input2.TextInput, {
+  }, t("object name label")), /* @__PURE__ */ React14.createElement(Input2.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__ */ React13.createElement(Popover.Close, {
+  }))), /* @__PURE__ */ React14.createElement(Popover.Close, {
     asChild: true
-  }, /* @__PURE__ */ React13.createElement(Button4, {
+  }, /* @__PURE__ */ React14.createElement(Button4, {
     ref: doneButton,
     classNames: "self-stretch",
     onClick: handleDone
@@ -808,11 +887,11 @@ var PopoverRenameObject = ({ object: obj }) => {
 };
 
 // packages/plugins/plugin-space/src/components/PopoverRenameSpace.tsx
-import React14, { useCallback as useCallback9, useRef as useRef4, useState as useState6 } from "react";
-import { Button as Button5, Input as Input3, Popover as Popover2, useTranslation as useTranslation13 } from "@dxos/react-ui";
+import React15, { useCallback as useCallback9, useRef as useRef4, useState as useState6 } from "react";
+import { Button as Button5, Input as Input3, Popover as Popover2, useTranslation as useTranslation14 } from "@dxos/react-ui";
 var POPOVER_RENAME_SPACE = `${SPACE_PLUGIN}/PopoverRenameSpace`;
 var PopoverRenameSpace = ({ space }) => {
-  const { t } = useTranslation13(SPACE_PLUGIN);
+  const { t } = useTranslation14(SPACE_PLUGIN);
   const doneButton = useRef4(null);
   const [name, setName] = useState6(space.properties.name ?? "");
   const handleDone = useCallback9(() => {
@@ -821,24 +900,24 @@ var PopoverRenameSpace = ({ space }) => {
     space,
     name
   ]);
-  return /* @__PURE__ */ React14.createElement("div", {
+  return /* @__PURE__ */ React15.createElement("div", {
     role: "none",
     className: "p-1 flex gap-2"
-  }, /* @__PURE__ */ React14.createElement("div", {
+  }, /* @__PURE__ */ React15.createElement("div", {
     role: "none",
     className: "flex-1"
-  }, /* @__PURE__ */ React14.createElement(Input3.Root, null, /* @__PURE__ */ React14.createElement(Input3.Label, {
+  }, /* @__PURE__ */ React15.createElement(Input3.Root, null, /* @__PURE__ */ React15.createElement(Input3.Label, {
     srOnly: true
-  }, t("space name label")), /* @__PURE__ */ React14.createElement(Input3.TextInput, {
+  }, t("space name label")), /* @__PURE__ */ React15.createElement(Input3.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__ */ React14.createElement(Popover2.Close, {
+  }))), /* @__PURE__ */ React15.createElement(Popover2.Close, {
     asChild: true
-  }, /* @__PURE__ */ React14.createElement(Button5, {
+  }, /* @__PURE__ */ React15.createElement(Button5, {
     ref: doneButton,
     classNames: "self-stretch",
     onClick: handleDone
@@ -848,20 +927,20 @@ var PopoverRenameSpace = ({ space }) => {
 };
 
 // packages/plugins/plugin-space/src/components/ShareSpaceButton.tsx
-import React15 from "react";
-import { createIntent as createIntent5, useIntentDispatcher as useIntentDispatcher5 } from "@dxos/app-framework";
-import { IconButton as IconButton3, useTranslation as useTranslation14 } from "@dxos/react-ui";
+import React16 from "react";
+import { createIntent as createIntent6, useIntentDispatcher as useIntentDispatcher6 } from "@dxos/app-framework";
+import { IconButton as IconButton4, useTranslation as useTranslation15 } from "@dxos/react-ui";
 var ShareSpaceButton = ({ space }) => {
-  const { dispatchPromise: dispatch } = useIntentDispatcher5();
-  return /* @__PURE__ */ React15.createElement(ShareSpaceButtonImpl, {
-    onClick: () => dispatch(createIntent5(SpaceAction.Share, {
+  const { dispatchPromise: dispatch } = useIntentDispatcher6();
+  return /* @__PURE__ */ React16.createElement(ShareSpaceButtonImpl, {
+    onClick: () => dispatch(createIntent6(SpaceAction.Share, {
       space
     }))
   });
 };
 var ShareSpaceButtonImpl = ({ onClick }) => {
-  const { t } = useTranslation14(SPACE_PLUGIN);
-  return /* @__PURE__ */ React15.createElement(IconButton3, {
+  const { t } = useTranslation15(SPACE_PLUGIN);
+  return /* @__PURE__ */ React16.createElement(IconButton4, {
     "data-testid": "spacePlugin.shareSpaceButton",
     icon: "ph--users--regular",
     label: t("share space label"),
@@ -870,28 +949,16 @@ var ShareSpaceButtonImpl = ({ onClick }) => {
 };
 
 // packages/plugins/plugin-space/src/components/SpacePresence.tsx
-import React16, { useCallback as useCallback10, useEffect as useEffect4, useState as useState8 } from "react";
+import React17, { useCallback as useCallback10, useEffect as useEffect4, useState as useState8 } from "react";
 import { useAppGraph as useAppGraph2, useCapability } from "@dxos/app-framework";
 import { generateName } from "@dxos/display-name";
 import { PublicKey, useClient as useClient5 } from "@dxos/react-client";
 import { getSpace as getSpace3, useMembers, fullyQualifiedId as fullyQualifiedId2 } from "@dxos/react-client/echo";
 import { useIdentity } from "@dxos/react-client/halo";
-import { Avatar, AvatarGroup, AvatarGroupItem, Tooltip as Tooltip2, useTranslation as useTranslation15, List as List2, ListItem as ListItem2, useDefaultValue } from "@dxos/react-ui";
+import { Avatar, AvatarGroup, AvatarGroupItem, Tooltip as Tooltip2, useTranslation as useTranslation16, List as List2, ListItem as ListItem2, useDefaultValue } from "@dxos/react-ui";
 import { AttentionGlyph, useAttended, useAttention } from "@dxos/react-ui-attention";
 import { ComplexMap, keyToFallback } from "@dxos/util";
 
-// packages/plugins/plugin-space/src/capabilities/index.ts
-import { lazy } from "@dxos/app-framework";
-var AppGraphBuilder = lazy(() => import("./app-graph-builder-GSS3V7IN.mjs"));
-var AppGraphSerializer = lazy(() => import("./app-graph-serializer-QDXM5M6K.mjs"));
-var IdentityCreated = lazy(() => import("./identity-created-25TK5XNO.mjs"));
-var IntentResolver = lazy(() => import("./intent-resolver-LNTCXZ57.mjs"));
-var ReactRoot = lazy(() => import("./react-root-Q7JJDCPB.mjs"));
-var ReactSurface = lazy(() => import("./react-surface-BDMYLARO.mjs"));
-var SpaceSettings = lazy(() => import("./settings-K4JPYYEM.mjs"));
-var SpaceState = lazy(() => import("./state-6DCY5YJP.mjs"));
-var SpacesReady = lazy(() => import("./spaces-ready-THYJEJYZ.mjs"));
-
 // packages/plugins/plugin-space/src/hooks/usePath.ts
 import { useEffect as useEffect3, useState as useState7 } from "react";
 var usePath = (graph, id, timeout) => {
@@ -962,7 +1029,7 @@ var SpacePresence = ({ object, spaceKey }) => {
       lastSeen
     };
   }).toSorted((a, b) => a.lastSeen - b.lastSeen);
-  return /* @__PURE__ */ React16.createElement(FullPresence, {
+  return /* @__PURE__ */ React17.createElement(FullPresence, {
     members: membersForObject
   });
 };
@@ -972,38 +1039,38 @@ var FullPresence = (props) => {
   if (members.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ React16.createElement(AvatarGroup.Root, {
+  return /* @__PURE__ */ React17.createElement(AvatarGroup.Root, {
     size,
     classNames: "mbs-2 mie-4",
     "data-testid": "spacePlugin.presence"
-  }, members.slice(0, 3).map((member, i) => /* @__PURE__ */ React16.createElement(Tooltip2.Root, {
+  }, members.slice(0, 3).map((member, i) => /* @__PURE__ */ React17.createElement(Tooltip2.Root, {
     key: member.identity.identityKey.toHex()
-  }, /* @__PURE__ */ React16.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React16.createElement(PrensenceAvatar, {
+  }, /* @__PURE__ */ React17.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React17.createElement(PrensenceAvatar, {
     identity: member.identity,
     group: true,
     match: member.currentlyAttended,
     index: members.length - i,
     onClick: () => onMemberClick?.(member)
-  })), /* @__PURE__ */ React16.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React16.createElement(Tooltip2.Content, {
+  })), /* @__PURE__ */ React17.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React17.createElement(Tooltip2.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ React16.createElement("span", null, getName(member.identity)), /* @__PURE__ */ React16.createElement(Tooltip2.Arrow, null))))), members.length > 3 && /* @__PURE__ */ React16.createElement(Tooltip2.Root, null, /* @__PURE__ */ React16.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React16.createElement(AvatarGroupItem.Root, {
+  }, /* @__PURE__ */ React17.createElement("span", null, getName(member.identity)), /* @__PURE__ */ React17.createElement(Tooltip2.Arrow, null))))), members.length > 3 && /* @__PURE__ */ React17.createElement(Tooltip2.Root, null, /* @__PURE__ */ React17.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React17.createElement(AvatarGroupItem.Root, {
     status: "inactive"
-  }, /* @__PURE__ */ React16.createElement(Avatar.Frame, {
+  }, /* @__PURE__ */ React17.createElement(Avatar.Frame, {
     style: {
       zIndex: members.length - 4
     }
-  }, /* @__PURE__ */ React16.createElement(Avatar.Fallback, {
+  }, /* @__PURE__ */ React17.createElement(Avatar.Fallback, {
     text: `+${members.length - 3}`
-  })))), /* @__PURE__ */ React16.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React16.createElement(Tooltip2.Content, {
+  })))), /* @__PURE__ */ React17.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React17.createElement(Tooltip2.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ React16.createElement(Tooltip2.Arrow, null), /* @__PURE__ */ React16.createElement(List2, {
+  }, /* @__PURE__ */ React17.createElement(Tooltip2.Arrow, null), /* @__PURE__ */ React17.createElement(List2, {
     classNames: "max-h-56 overflow-y-auto"
-  }, members.map((member) => /* @__PURE__ */ React16.createElement(ListItem2.Root, {
+  }, members.map((member) => /* @__PURE__ */ React17.createElement(ListItem2.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__ */ React16.createElement(PrensenceAvatar, {
+  }, /* @__PURE__ */ React17.createElement(PrensenceAvatar, {
     identity: member.identity,
     showName: true,
     match: member.currentlyAttended
@@ -1013,10 +1080,10 @@ var PrensenceAvatar = ({ identity, showName, match, group, index, onClick }) =>
   const Root = group ? AvatarGroupItem.Root : Avatar.Root;
   const status = match ? "current" : "active";
   const fallbackValue = keyToFallback(identity.identityKey);
-  return /* @__PURE__ */ React16.createElement(Root, {
+  return /* @__PURE__ */ React17.createElement(Root, {
     status,
     hue: identity.profile?.data?.hue || fallbackValue.hue
-  }, /* @__PURE__ */ React16.createElement(Avatar.Frame, {
+  }, /* @__PURE__ */ React17.createElement(Avatar.Frame, {
     "data-testid": "spacePlugin.presence.member",
     "data-status": status,
     ...index ? {
@@ -1025,9 +1092,9 @@ var PrensenceAvatar = ({ identity, showName, match, group, index, onClick }) =>
       }
     } : {},
     onClick: () => onClick?.()
-  }, /* @__PURE__ */ React16.createElement(Avatar.Fallback, {
+  }, /* @__PURE__ */ React17.createElement(Avatar.Fallback, {
     text: identity.profile?.data?.emoji || fallbackValue.emoji
-  })), showName && /* @__PURE__ */ React16.createElement(Avatar.Label, {
+  })), showName && /* @__PURE__ */ React17.createElement(Avatar.Label, {
     classNames: "text-sm truncate pli-2"
   }, getName(identity)));
 };
@@ -1055,53 +1122,53 @@ var SmallPresenceLive = ({ id, open, viewers }) => {
   }, [
     viewers
   ]);
-  return /* @__PURE__ */ React16.createElement(SmallPresence, {
+  return /* @__PURE__ */ React17.createElement(SmallPresence, {
     count: activeViewers.length,
     attended: isAttended,
     containsAttended
   });
 };
 var SmallPresence = ({ count = 0, attended, containsAttended }) => {
-  const { t } = useTranslation15(SPACE_PLUGIN);
-  return /* @__PURE__ */ React16.createElement(Tooltip2.Root, null, /* @__PURE__ */ React16.createElement(Tooltip2.Trigger, {
+  const { t } = useTranslation16(SPACE_PLUGIN);
+  return /* @__PURE__ */ React17.createElement(Tooltip2.Root, null, /* @__PURE__ */ React17.createElement(Tooltip2.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ React16.createElement(AttentionGlyph, {
+  }, /* @__PURE__ */ React17.createElement(AttentionGlyph, {
     attended,
     containsAttended,
     presence: count > 1 ? "many" : count === 1 ? "one" : "none",
     classNames: "self-center mie-1"
-  })), /* @__PURE__ */ React16.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React16.createElement(Tooltip2.Content, {
+  })), /* @__PURE__ */ React17.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React17.createElement(Tooltip2.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ React16.createElement("span", null, t("presence label", {
+  }, /* @__PURE__ */ React17.createElement("span", null, t("presence label", {
     count
-  })), /* @__PURE__ */ React16.createElement(Tooltip2.Arrow, null))));
+  })), /* @__PURE__ */ React17.createElement(Tooltip2.Arrow, null))));
 };
 
 // packages/plugins/plugin-space/src/components/SpacePluginSettings.tsx
-import React17 from "react";
-import { Input as Input4, useTranslation as useTranslation16 } from "@dxos/react-ui";
+import React18 from "react";
+import { Input as Input4, useTranslation as useTranslation17 } from "@dxos/react-ui";
 import { DeprecatedFormContainer, DeprecatedFormInput } from "@dxos/react-ui-form";
 var SpacePluginSettings = ({ settings }) => {
-  const { t } = useTranslation16(SPACE_PLUGIN);
-  return /* @__PURE__ */ React17.createElement(DeprecatedFormContainer, null, /* @__PURE__ */ React17.createElement(DeprecatedFormInput, {
+  const { t } = useTranslation17(SPACE_PLUGIN);
+  return /* @__PURE__ */ React18.createElement(DeprecatedFormContainer, null, /* @__PURE__ */ React18.createElement(DeprecatedFormInput, {
     label: t("show hidden spaces label")
-  }, /* @__PURE__ */ React17.createElement(Input4.Switch, {
+  }, /* @__PURE__ */ React18.createElement(Input4.Switch, {
     checked: settings.showHidden,
     onCheckedChange: (checked) => settings.showHidden = !!checked
   })));
 };
 
 // packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx
-import React18, { useCallback as useCallback11, useState as useState9 } from "react";
+import React19, { useCallback as useCallback11, useState as useState9 } from "react";
 import { log as log3 } from "@dxos/log";
 import { EdgeReplicationSetting } from "@dxos/protocols/proto/dxos/echo/metadata";
 import { useClient as useClient6 } from "@dxos/react-client";
-import { Input as Input5, useTranslation as useTranslation17 } from "@dxos/react-ui";
+import { Input as Input5, Toolbar, useTranslation as useTranslation18 } from "@dxos/react-ui";
 import { DeprecatedFormContainer as DeprecatedFormContainer2, DeprecatedFormInput as DeprecatedFormInput2 } from "@dxos/react-ui-form";
-import { HuePickerBlock } from "@dxos/react-ui-pickers";
-var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx";
+import { HuePicker, IconPicker } from "@dxos/react-ui-pickers";
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx";
 var SpaceSettingsPanel = ({ space }) => {
-  const { t } = useTranslation17(SPACE_PLUGIN);
+  const { t } = useTranslation18(SPACE_PLUGIN);
   const client = useClient6();
   const edgeEnabled = Boolean(client.config.values.runtime?.client?.edgeFeatures?.echoReplicator);
   const [edgeReplication, setEdgeReplication] = useState9(space.internal.data.edgeReplication === EdgeReplicationSetting.ENABLED);
@@ -1109,7 +1176,7 @@ var SpaceSettingsPanel = ({ space }) => {
     setEdgeReplication(next);
     await space?.internal.setEdgeReplicationPreference(next ? EdgeReplicationSetting.ENABLED : EdgeReplicationSetting.DISABLED).catch((err) => {
       log3.catch(err, void 0, {
-        F: __dxlog_file3,
+        F: __dxlog_file5,
         L: 36,
         S: void 0,
         C: (f, a) => f(...a)
@@ -1119,38 +1186,48 @@ var SpaceSettingsPanel = ({ space }) => {
   }, [
     space
   ]);
-  return /* @__PURE__ */ React18.createElement(DeprecatedFormContainer2, null, /* @__PURE__ */ React18.createElement(DeprecatedFormInput2, {
+  return /* @__PURE__ */ React19.createElement(DeprecatedFormContainer2, null, /* @__PURE__ */ React19.createElement(DeprecatedFormInput2, {
     label: t("name label")
-  }, /* @__PURE__ */ React18.createElement(Input5.TextInput, {
+  }, /* @__PURE__ */ React19.createElement(Input5.TextInput, {
     placeholder: t("unnamed space label"),
     value: space.properties.name ?? "",
     onChange: (event) => {
       space.properties.name = event.target.value;
     }
-  })), /* @__PURE__ */ React18.createElement(DeprecatedFormInput2, {
+  })), /* @__PURE__ */ React19.createElement(DeprecatedFormInput2, {
+    label: t("icon label")
+  }, /* @__PURE__ */ React19.createElement(Toolbar.Root, null, /* @__PURE__ */ React19.createElement(IconPicker, {
+    value: space.properties.icon,
+    onChange: (nextIcon) => space.properties.icon = nextIcon,
+    onReset: () => {
+      space.properties.icon = void 0;
+    }
+  }))), /* @__PURE__ */ React19.createElement(DeprecatedFormInput2, {
     label: t("hue label")
-  }, /* @__PURE__ */ React18.createElement(HuePickerBlock, {
-    hue: space.properties.hue,
-    onChangeHue: (nextHue) => space.properties.hue = nextHue,
-    onClickClear: () => space.properties.hue = void 0
-  })), edgeEnabled && /* @__PURE__ */ React18.createElement(DeprecatedFormInput2, {
+  }, /* @__PURE__ */ React19.createElement(Toolbar.Root, null, /* @__PURE__ */ React19.createElement(HuePicker, {
+    value: space.properties.hue,
+    onChange: (nextHue) => space.properties.hue = nextHue,
+    onReset: () => {
+      space.properties.hue = void 0;
+    }
+  }))), edgeEnabled && /* @__PURE__ */ React19.createElement(DeprecatedFormInput2, {
     label: t("edge replication label")
-  }, /* @__PURE__ */ React18.createElement(Input5.Switch, {
+  }, /* @__PURE__ */ React19.createElement(Input5.Switch, {
     checked: edgeReplication,
     onCheckedChange: toggleEdgeReplication
   })));
 };
 
 // packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsDialog.tsx
-import React19, { useMemo as useMemo2, useState as useState10 } from "react";
-import { Surface as Surface2, useCapabilities } from "@dxos/app-framework";
+import React20, { useMemo, useState as useState10 } from "react";
+import { Surface as Surface2, useCapabilities as useCapabilities2 } from "@dxos/app-framework";
 import { useClient as useClient7 } from "@dxos/react-client";
-import { Button as Button6, Clipboard, Dialog as Dialog4, Icon as Icon4, toLocalizedString as toLocalizedString3, useTranslation as useTranslation18 } from "@dxos/react-ui";
+import { Button as Button6, Clipboard, Dialog as Dialog4, Icon as Icon4, toLocalizedString as toLocalizedString3, useTranslation as useTranslation19 } from "@dxos/react-ui";
 import { Tabs } from "@dxos/react-ui-tabs";
 import { SpacePanel } from "@dxos/shell/react";
 var SPACE_SETTINGS_DIALOG = `${SPACE_PLUGIN}/SpaceSettingsDialog`;
 var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "members", namesCache }) => {
-  const { t } = useTranslation18(SPACE_PLUGIN);
+  const { t } = useTranslation19(SPACE_PLUGIN);
   const client = useClient7();
   const [tabsActivePart, setTabsActivePart] = useState10("list");
   const [selected, setSelected] = useState10(initialTab);
@@ -1159,8 +1236,8 @@ var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "m
     personal: client.spaces.default === space,
     namesCache
   });
-  const panels = useCapabilities(SpaceCapabilities.SettingsPanel);
-  const data = useMemo2(() => ({
+  const panels = useCapabilities2(SpaceCapabilities.SettingsPanel);
+  const data = useMemo(() => ({
     subject: space
   }), [
     space
@@ -1168,76 +1245,76 @@ 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__ */ React19.createElement(Dialog4.Content, {
+    /* @__PURE__ */ React20.createElement(Dialog4.Content, {
       classNames: "p-0 bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
-    }, /* @__PURE__ */ React19.createElement("div", {
+    }, /* @__PURE__ */ React20.createElement("div", {
       role: "none",
       className: "flex justify-between pbs-2 pis-2 pie-2 @md:pbs-4 @md:pis-4 @md:pie-4"
-    }, /* @__PURE__ */ React19.createElement(Dialog4.Title, {
+    }, /* @__PURE__ */ React20.createElement(Dialog4.Title, {
       onClick: () => setTabsActivePart("list"),
       "aria-description": t("click to return to tablist description"),
       classNames: "flex cursor-pointer items-center group/title"
-    }, /* @__PURE__ */ React19.createElement(Icon4, {
+    }, /* @__PURE__ */ React20.createElement(Icon4, {
       icon: "ph--caret-left--regular",
       size: 4,
       classNames: [
         "@md:hidden",
         tabsActivePart === "list" && "invisible"
       ]
-    }), /* @__PURE__ */ React19.createElement("span", {
+    }), /* @__PURE__ */ React20.createElement("span", {
       className: tabsActivePart !== "list" ? "group-hover/title:underline @md:group-hover/title:no-underline underline-offset-4 decoration-1" : ""
-    }, toLocalizedString3(name, t))), /* @__PURE__ */ React19.createElement(Dialog4.Close, {
+    }, toLocalizedString3(name, t))), /* @__PURE__ */ React20.createElement(Dialog4.Close, {
       asChild: true
-    }, /* @__PURE__ */ React19.createElement(Button6, {
+    }, /* @__PURE__ */ React20.createElement(Button6, {
       density: "fine",
       variant: "ghost",
       autoFocus: true
-    }, /* @__PURE__ */ React19.createElement(Icon4, {
+    }, /* @__PURE__ */ React20.createElement(Icon4, {
       icon: "ph--x--regular",
       size: 4
-    })))), /* @__PURE__ */ React19.createElement(Tabs.Root, {
+    })))), /* @__PURE__ */ React20.createElement(Tabs.Root, {
       orientation: "vertical",
       value: selected,
       onValueChange: setSelected,
       activePart: tabsActivePart,
       onActivePartChange: setTabsActivePart,
       classNames: "flex flex-col flex-1 mbs-2"
-    }, /* @__PURE__ */ React19.createElement(Tabs.Viewport, {
+    }, /* @__PURE__ */ React20.createElement(Tabs.Viewport, {
       classNames: "flex-1 min-bs-0"
-    }, /* @__PURE__ */ React19.createElement("div", {
+    }, /* @__PURE__ */ React20.createElement("div", {
       role: "none",
       className: "overflow-y-auto pli-3 @md:pis-2 @md:pie-0 mbe-4 border-r border-separator"
-    }, /* @__PURE__ */ React19.createElement(Tabs.Tablist, {
+    }, /* @__PURE__ */ React20.createElement(Tabs.Tablist, {
       classNames: "flex flex-col max-bs-none min-is-[200px] gap-4 overflow-y-auto"
-    }, /* @__PURE__ */ React19.createElement("div", {
+    }, /* @__PURE__ */ React20.createElement("div", {
       role: "none",
       className: "flex flex-col ml-1"
-    }, /* @__PURE__ */ React19.createElement(Tabs.Tab, {
+    }, /* @__PURE__ */ React20.createElement(Tabs.Tab, {
       value: "settings"
-    }, t("settings tab label")), /* @__PURE__ */ React19.createElement(Tabs.Tab, {
+    }, t("settings tab label")), /* @__PURE__ */ React20.createElement(Tabs.Tab, {
       value: "members",
       disabled: locked
-    }, t("members tab label")), panels.map((panel) => /* @__PURE__ */ React19.createElement(Tabs.Tab, {
+    }, t("members tab label")), panels.map((panel) => /* @__PURE__ */ React20.createElement(Tabs.Tab, {
       key: panel.id,
       value: panel.id
-    }, toLocalizedString3(panel.label, t)))))), /* @__PURE__ */ React19.createElement(Tabs.Tabpanel, {
+    }, toLocalizedString3(panel.label, t)))))), /* @__PURE__ */ React20.createElement(Tabs.Tabpanel, {
       value: "settings",
       classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
-    }, /* @__PURE__ */ React19.createElement(SpaceSettingsPanel, {
+    }, /* @__PURE__ */ React20.createElement(SpaceSettingsPanel, {
       space
-    })), /* @__PURE__ */ React19.createElement(Tabs.Tabpanel, {
+    })), /* @__PURE__ */ React20.createElement(Tabs.Tabpanel, {
       value: "members",
       classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
-    }, /* @__PURE__ */ React19.createElement(Clipboard.Provider, null, /* @__PURE__ */ React19.createElement(SpacePanel, {
+    }, /* @__PURE__ */ React20.createElement(Clipboard.Provider, null, /* @__PURE__ */ React20.createElement(SpacePanel, {
       space,
       hideHeading: true,
       target,
       createInvitationUrl
-    }))), panels.map((panel) => /* @__PURE__ */ React19.createElement(Tabs.Tabpanel, {
+    }))), panels.map((panel) => /* @__PURE__ */ React20.createElement(Tabs.Tabpanel, {
       key: panel.id,
       value: panel.id,
       classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
-    }, /* @__PURE__ */ React19.createElement(Surface2, {
+    }, /* @__PURE__ */ React20.createElement(Surface2, {
       role: `space-settings--${panel.id}`,
       data
     }))))))
@@ -1245,12 +1322,12 @@ var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "m
 };
 
 // packages/plugins/plugin-space/src/components/SyncStatus/InlineSyncStatus.tsx
-import React20, { useEffect as useEffect6, useState as useState12 } from "react";
+import React21, { useEffect as useEffect6, useState as useState12 } from "react";
 import { useAppGraph as useAppGraph3 } from "@dxos/app-framework";
 import { QueryEdgeStatusResponse } from "@dxos/protocols/proto/dxos/client/services";
 import { EdgeReplicationSetting as EdgeReplicationSetting2 } from "@dxos/protocols/proto/dxos/echo/metadata";
 import { useClient as useClient9 } from "@dxos/react-client";
-import { Tooltip as Tooltip3, useTranslation as useTranslation19 } from "@dxos/react-ui";
+import { Tooltip as Tooltip3, useTranslation as useTranslation20 } from "@dxos/react-ui";
 import { AttentionGlyph as AttentionGlyph2, useAttended as useAttended2, useAttention as useAttention2 } from "@dxos/react-ui-attention";
 
 // packages/plugins/plugin-space/src/components/SyncStatus/sync-state.ts
@@ -1258,7 +1335,7 @@ import { useEffect as useEffect5, useState as useState11 } from "react";
 import { Context } from "@dxos/context";
 import { EdgeService } from "@dxos/protocols";
 import { useClient as useClient8 } from "@dxos/react-client";
-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,
@@ -1282,7 +1359,7 @@ var useSyncState = () => {
   const [spaceState, setSpaceState] = useState11({});
   useEffect5(() => {
     const ctx = new Context(void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file6,
       L: 48
     });
     const createSubscriptions = (spaces) => {
@@ -1317,7 +1394,7 @@ var useSpaceSyncState = (space) => {
   const [spaceState, setSpaceState] = useState11();
   useEffect5(() => {
     const ctx = new Context(void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file6,
       L: 87
     });
     space.crud.subscribeToSyncState(ctx, ({ peers = [] }) => {
@@ -1349,7 +1426,7 @@ var useEdgeStatus = () => {
   return status;
 };
 var InlineSyncStatus = ({ space, open }) => {
-  const { t } = useTranslation19(SPACE_PLUGIN);
+  const { t } = useTranslation20(SPACE_PLUGIN);
   const id = space.id;
   const { hasAttention, isAncestor, isRelated } = useAttention2(id);
   const isAttended = hasAttention || isAncestor || isRelated;
@@ -1362,32 +1439,32 @@ var InlineSyncStatus = ({ space, open }) => {
   const edgeSyncEnabled = space.internal.data.edgeReplication === EdgeReplicationSetting2.ENABLED;
   const syncState = useSpaceSyncState(space);
   const syncing = connectedToEdge && edgeSyncEnabled && syncState && syncState.missingOnLocal > 0;
-  return /* @__PURE__ */ React20.createElement(Tooltip3.Root, null, /* @__PURE__ */ React20.createElement(Tooltip3.Trigger, {
+  return /* @__PURE__ */ React21.createElement(Tooltip3.Root, null, /* @__PURE__ */ React21.createElement(Tooltip3.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ React20.createElement(AttentionGlyph2, {
+  }, /* @__PURE__ */ React21.createElement(AttentionGlyph2, {
     syncing,
     attended: isAttended,
     containsAttended,
     classNames: "self-center mie-1"
-  })), /* @__PURE__ */ React20.createElement(Tooltip3.Portal, null, /* @__PURE__ */ React20.createElement(Tooltip3.Content, {
+  })), /* @__PURE__ */ React21.createElement(Tooltip3.Portal, null, /* @__PURE__ */ React21.createElement(Tooltip3.Content, {
     side: "bottom",
     classNames: "z-[70]"
-  }, /* @__PURE__ */ React20.createElement("span", null, t("syncing label")), /* @__PURE__ */ React20.createElement(Tooltip3.Arrow, null))));
+  }, /* @__PURE__ */ React21.createElement("span", null, t("syncing label")), /* @__PURE__ */ React21.createElement(Tooltip3.Arrow, null))));
 };
 
 // packages/plugins/plugin-space/src/components/SyncStatus/SyncStatus.tsx
-import React22, { useCallback as useCallback12, useEffect as useEffect8, useState as useState14 } from "react";
+import React23, { useCallback as useCallback12, useEffect as useEffect8, useState as useState14 } from "react";
 import { StatusBar } from "@dxos/plugin-status-bar";
 import { useClient as useClient11 } from "@dxos/react-client";
-import { Icon as Icon6, Input as Input6, Popover as Popover3, useTranslation as useTranslation21 } from "@dxos/react-ui";
+import { Icon as Icon6, Input as Input6, Popover as Popover3, useTranslation as useTranslation22 } from "@dxos/react-ui";
 import { SyntaxHighlighter } from "@dxos/react-ui-syntax-highlighter";
 import { mx as mx6 } from "@dxos/react-ui-theme";
 
 // packages/plugins/plugin-space/src/components/SyncStatus/Space.tsx
-import React21, { useEffect as useEffect7, useState as useState13 } from "react";
+import React22, { useEffect as useEffect7, useState as useState13 } from "react";
 import { useClient as useClient10 } from "@dxos/react-client";
 import { useSpace } from "@dxos/react-client/echo";
-import { Icon as Icon5, toLocalizedString as toLocalizedString4, useTranslation as useTranslation20 } from "@dxos/react-ui";
+import { Icon as Icon5, toLocalizedString as toLocalizedString4, useTranslation as useTranslation21 } from "@dxos/react-ui";
 import { mx as mx5 } from "@dxos/react-ui-theme";
 var SYNC_STALLED_TIMEOUT = 5e3;
 var styles = {
@@ -1419,7 +1496,7 @@ var useActive = (count) => {
   return active;
 };
 var SpaceRowContainer = ({ spaceId, state }) => {
-  const { t } = useTranslation20(SPACE_PLUGIN);
+  const { t } = useTranslation21(SPACE_PLUGIN);
   const client = useClient10();
   const space = useSpace(spaceId);
   if (!space) {
@@ -1428,7 +1505,7 @@ var SpaceRowContainer = ({ spaceId, state }) => {
   const spaceName = toLocalizedString4(getSpaceDisplayName(space, {
     personal: space === client.spaces.default
   }), t);
-  return /* @__PURE__ */ React21.createElement(SpaceRow, {
+  return /* @__PURE__ */ React22.createElement(SpaceRow, {
     spaceId,
     spaceName,
     state
@@ -1437,19 +1514,19 @@ var SpaceRowContainer = ({ spaceId, state }) => {
 var SpaceRow = ({ spaceId, spaceName, state: { localDocumentCount, remoteDocumentCount, missingOnLocal, missingOnRemote } }) => {
   const downActive = useActive(localDocumentCount);
   const upActive = useActive(remoteDocumentCount);
-  return /* @__PURE__ */ React21.createElement("div", {
+  return /* @__PURE__ */ React22.createElement("div", {
     className: "flex items-center mx-0.5 gap-0.5 cursor-pointer",
     title: spaceId,
     onClick: () => {
       void navigator.clipboard.writeText(spaceId);
     }
-  }, /* @__PURE__ */ React21.createElement("span", {
+  }, /* @__PURE__ */ React22.createElement("span", {
     className: "is-1/2 truncate"
-  }, spaceName), /* @__PURE__ */ React21.createElement(Icon5, {
+  }, spaceName), /* @__PURE__ */ React22.createElement(Icon5, {
     icon: "ph--arrow-fat-line-left--regular",
     size: 3,
     classNames: mx5(downActive && "animate-[pulse_1s_infinite]")
-  }), /* @__PURE__ */ React21.createElement(Candle, {
+  }), /* @__PURE__ */ React22.createElement(Candle, {
     up: {
       count: remoteDocumentCount,
       total: remoteDocumentCount + missingOnRemote
@@ -1459,44 +1536,44 @@ var SpaceRow = ({ spaceId, spaceName, state: { localDocumentCount, remoteDocumen
       total: localDocumentCount + missingOnLocal
     },
     title: spaceId
-  }), /* @__PURE__ */ React21.createElement(Icon5, {
+  }), /* @__PURE__ */ React22.createElement(Icon5, {
     icon: "ph--arrow-fat-line-right--regular",
     size: 3,
     classNames: mx5(upActive && "animate-[pulse_1s_step-start_infinite]")
   }));
 };
 var Candle = ({ classNames, up, down }) => {
-  return /* @__PURE__ */ React21.createElement("div", {
+  return /* @__PURE__ */ React22.createElement("div", {
     className: mx5("grid grid-cols-[1fr_2rem_1fr] w-full h-3", classNames)
-  }, /* @__PURE__ */ React21.createElement(Bar, {
+  }, /* @__PURE__ */ React22.createElement(Bar, {
     classNames: "justify-end",
     ...up
-  }), /* @__PURE__ */ React21.createElement("div", {
+  }), /* @__PURE__ */ React22.createElement("div", {
     className: "relative"
-  }, /* @__PURE__ */ React21.createElement("div", {
+  }, /* @__PURE__ */ React22.createElement("div", {
     className: mx5("absolute inset-0 flex items-center justify-center text-xs", styles.barBg)
-  }, up.total)), /* @__PURE__ */ React21.createElement(Bar, down));
+  }, up.total)), /* @__PURE__ */ React22.createElement(Bar, down));
 };
 var Bar = ({ classNames, count, total }) => {
   let p = count / total * 100;
   if (count < total) {
     p = Math.min(p, 95);
   }
-  return /* @__PURE__ */ React21.createElement("div", {
+  return /* @__PURE__ */ React22.createElement("div", {
     className: mx5("relative flex w-full", styles.barBg, classNames)
-  }, /* @__PURE__ */ React21.createElement("div", {
+  }, /* @__PURE__ */ React22.createElement("div", {
     className: mx5("shrink-0", styles.barFg),
     style: {
       width: `${p}%`
     }
-  }), count !== total && /* @__PURE__ */ React21.createElement("div", {
+  }), count !== total && /* @__PURE__ */ React22.createElement("div", {
     className: "absolute top-0 bottom-0 flex items-center mx-0.5 text-black text-xs"
   }, count));
 };
 
 // packages/plugins/plugin-space/src/components/SyncStatus/save-tracker.ts
 import { Context as Context2 } from "@dxos/context";
-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 = {};
@@ -1524,7 +1601,7 @@ var createClientSaveTracker = (client, cb) => {
 };
 var createSpaceSaveTracker = (space, cb) => {
   const ctx = new Context2(void 0, {
-    F: __dxlog_file5,
+    F: __dxlog_file7,
     L: 40
   });
   void space.waitUntilReady().then(() => {
@@ -1595,13 +1672,13 @@ var SyncStatus = () => {
       setSaved(state2 === "saved");
     });
   }, []);
-  return /* @__PURE__ */ React22.createElement(SyncStatusIndicator, {
+  return /* @__PURE__ */ React23.createElement(SyncStatusIndicator, {
     state,
     saved
   });
 };
 var SyncStatusIndicator = ({ state, saved }) => {
-  const { t } = useTranslation21(SPACE_PLUGIN);
+  const { t } = useTranslation22(SPACE_PLUGIN);
   const summary = getSyncSummary(state);
   const offline = Object.values(state).length === 0;
   const needsToUpload = summary.differentDocuments > 0 || summary.missingOnRemote > 0;
@@ -1628,58 +1705,58 @@ var SyncStatusIndicator = ({ state, saved }) => {
     needsToDownload
   ]);
   const title = t(`${status} label`);
-  const icon = /* @__PURE__ */ React22.createElement(Icon6, {
+  const icon = /* @__PURE__ */ React23.createElement(Icon6, {
     icon: getIcon(status),
     size: 4,
     classNames
   });
   if (offline) {
-    return /* @__PURE__ */ React22.createElement(StatusBar.Item, {
+    return /* @__PURE__ */ React23.createElement(StatusBar.Item, {
       title
     }, icon);
   } else {
-    return /* @__PURE__ */ React22.createElement(Popover3.Root, null, /* @__PURE__ */ React22.createElement(Popover3.Trigger, {
+    return /* @__PURE__ */ React23.createElement(Popover3.Root, null, /* @__PURE__ */ React23.createElement(Popover3.Trigger, {
       asChild: true
-    }, /* @__PURE__ */ React22.createElement(StatusBar.Button, {
+    }, /* @__PURE__ */ React23.createElement(StatusBar.Button, {
       title
-    }, icon)), /* @__PURE__ */ React22.createElement(Popover3.Portal, null, /* @__PURE__ */ React22.createElement(Popover3.Content, null, /* @__PURE__ */ React22.createElement(SyncStatusDetail, {
+    }, icon)), /* @__PURE__ */ React23.createElement(Popover3.Portal, null, /* @__PURE__ */ React23.createElement(Popover3.Content, null, /* @__PURE__ */ React23.createElement(SyncStatusDetail, {
       state,
       summary,
       debug: false
-    }), /* @__PURE__ */ React22.createElement(Popover3.Arrow, null))));
+    }), /* @__PURE__ */ React23.createElement(Popover3.Arrow, null))));
   }
 };
 var SyncStatusDetail = ({ classNames, state, summary, debug }) => {
   const [showAll, setShowAll] = useState14(false);
-  const { t } = useTranslation21(SPACE_PLUGIN);
+  const { t } = useTranslation22(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 = useCallback12((state2) => setShowAll(state2), [
     setShowAll
   ]);
-  return /* @__PURE__ */ React22.createElement("div", {
+  return /* @__PURE__ */ React23.createElement("div", {
     className: mx6("flex flex-col gap-3 p-2 text-xs min-w-96", classNames)
-  }, /* @__PURE__ */ React22.createElement("div", {
+  }, /* @__PURE__ */ React23.createElement("div", {
     role: "none",
     className: "flex items-center"
-  }, /* @__PURE__ */ React22.createElement("h1", {
+  }, /* @__PURE__ */ React23.createElement("h1", {
     className: "flex-1"
-  }, t("sync status title")), /* @__PURE__ */ React22.createElement("div", {
+  }, t("sync status title")), /* @__PURE__ */ React23.createElement("div", {
     className: "flex items-center gap-2"
-  }, /* @__PURE__ */ React22.createElement(Input6.Root, null, /* @__PURE__ */ React22.createElement(Input6.Label, {
+  }, /* @__PURE__ */ React23.createElement(Input6.Root, null, /* @__PURE__ */ React23.createElement(Input6.Label, {
     classNames: "text-xs"
-  }, t("show all label")), /* @__PURE__ */ React22.createElement(Input6.Checkbox, {
+  }, t("show all label")), /* @__PURE__ */ React23.createElement(Input6.Checkbox, {
     checked: showAll,
     onCheckedChange: handleCheckedChange
-  })))), /* @__PURE__ */ React22.createElement("div", {
+  })))), /* @__PURE__ */ React23.createElement("div", {
     className: "flex flex-col gap-2"
-  }, entries.length === 0 && /* @__PURE__ */ React22.createElement("div", {
+  }, entries.length === 0 && /* @__PURE__ */ React23.createElement("div", {
     role: "none",
     className: "flex justify-center"
-  }, t("no sync status label")), entries.map(([spaceId, state2]) => /* @__PURE__ */ React22.createElement(SpaceRowContainer, {
+  }, t("no sync status label")), entries.map(([spaceId, state2]) => /* @__PURE__ */ React23.createElement(SpaceRowContainer, {
     key: spaceId,
     spaceId,
     state: state2
-  }))), debug && /* @__PURE__ */ React22.createElement(SyntaxHighlighter, {
+  }))), debug && /* @__PURE__ */ React23.createElement(SyntaxHighlighter, {
     language: "json"
   }, JSON.stringify(summary, null, 2)));
 };
@@ -1698,6 +1775,8 @@ export {
   JoinDialog,
   MenuFooter,
   PersistenceStatus,
+  POPOVER_ADD_SPACE,
+  PopoverAddSpace,
   POPOVER_RENAME_OBJECT,
   PopoverRenameObject,
   POPOVER_RENAME_SPACE,
@@ -1722,8 +1801,9 @@ export {
   IntentResolver,
   ReactRoot,
   ReactSurface,
+  Schema,
   SpaceSettings,
   SpaceState,
   SpacesReady
 };
-//# sourceMappingURL=chunk-DIBLC24B.mjs.map
+//# sourceMappingURL=chunk-S6B7627U.mjs.map