@dxos/plugin-space 0.6.14-staging.54a8bab → 0.6.14-staging.7b35391

package/dist/lib/node-esm/index.mjs

@@ -4,7 +4,7 @@ import {
   SPACE_PLUGIN_SHORT_ID,
   SpaceAction,
   meta_default
-} from "./chunk-YPQGKWHJ.mjs";
+} from "./chunk-DVUZ7A7G.mjs";
 import {
   ActorSchema,
   ChannelType,
@@ -16,26 +16,26 @@ import {
   ThreadStatus,
   ThreadType,
   parseSpaceInitPlugin
-} from "./chunk-TRJKV4PK.mjs";
+} from "./chunk-MCEAI4CV.mjs";
 
 // packages/plugins/plugin-space/src/SpacePlugin.tsx
 import { signal } from "@preact/signals-core";
 import React17 from "react";
-import { LayoutAction as LayoutAction2, NavigationAction as NavigationAction3, Surface as Surface2, firstIdInPart, openIds, parseGraphPlugin, parseIntentPlugin as parseIntentPlugin2, parseLayoutPlugin, parseMetadataResolverPlugin, parseNavigationPlugin as parseNavigationPlugin2, resolvePlugin } from "@dxos/app-framework";
+import { LayoutAction as LayoutAction2, NavigationAction as NavigationAction4, Surface, findPlugin, firstIdInPart, openIds, parseGraphPlugin, parseIntentPlugin as parseIntentPlugin2, parseLayoutPlugin, parseMetadataResolverPlugin, parseNavigationPlugin as parseNavigationPlugin2, resolvePlugin } from "@dxos/app-framework";
 import { EventSubscriptions } from "@dxos/async";
 import { isReactiveObject as isReactiveObject2 } from "@dxos/echo-schema";
 import { scheduledEffect } from "@dxos/echo-signals/core";
+import { invariant as invariant2 } from "@dxos/invariant";
 import { LocalStorageStore } from "@dxos/local-storage";
 import { log as log3 } from "@dxos/log";
 import { Migrations as Migrations2 } from "@dxos/migrations";
 import { parseAttentionPlugin } from "@dxos/plugin-attention";
 import { parseClientPlugin } from "@dxos/plugin-client";
 import { createExtension, memoize as memoize2, toSignal } from "@dxos/plugin-graph";
-import { ObservabilityAction } from "@dxos/plugin-observability/meta";
+import { ObservabilityAction as ObservabilityAction2 } from "@dxos/plugin-observability/meta";
 import { PublicKey as PublicKey2 } from "@dxos/react-client";
-import { Expando, Filter, SpaceState as SpaceState3, create as create2, fullyQualifiedId as fullyQualifiedId4, getSpace as getSpace4, getTypename as getTypename2, isEchoObject as isEchoObject2, isSpace as isSpace2, loadObjectReferences, parseId, FQ_ID_LENGTH } from "@dxos/react-client/echo";
-import { Dialog } from "@dxos/react-ui";
-import { ClipboardProvider as ClipboardProvider2, InvitationManager, osTranslations } from "@dxos/shell/react";
+import { Expando, Filter, SpaceState as SpaceState2, create as create2, fullyQualifiedId as fullyQualifiedId4, getSpace as getSpace4, getTypename as getTypename2, isEchoObject as isEchoObject2, isSpace as isSpace2, loadObjectReferences, parseId, FQ_ID_LENGTH } from "@dxos/react-client/echo";
+import { osTranslations } from "@dxos/shell/react";
 import { ComplexMap as ComplexMap2, nonNullable, reduceGroupBy } from "@dxos/util";
 
 // packages/plugins/plugin-space/src/components/AwaitingObject.tsx
@@ -71,7 +71,7 @@ var AwaitingObject = ({ id }) => {
   useEffect(() => {
     if (objects.findIndex((object) => fullyQualifiedId(object) === id) > -1) {
       setFound(true);
-      if (navigationPlugin?.provides.location.active === id) {
+      if (navigationPlugin?.provides.location.active.solo?.[0].id === id) {
         setOpen(false);
       }
     }
@@ -178,15 +178,105 @@ var DefaultObjectSettings = ({ object }) => {
   })));
 };
 
+// packages/plugins/plugin-space/src/components/JoinDialog.tsx
+import React5, { useCallback } from "react";
+import { LayoutAction, NavigationAction as NavigationAction2, useIntentDispatcher } from "@dxos/app-framework";
+import { useGraph } from "@dxos/plugin-graph";
+import { ObservabilityAction } from "@dxos/plugin-observability/meta";
+import { useSpaces } from "@dxos/react-client/echo";
+import { Dialog, useTranslation as useTranslation5 } from "@dxos/react-ui";
+import { JoinPanel } from "@dxos/shell/react";
+var JoinDialog = ({ navigableCollections, ...props }) => {
+  const { t } = useTranslation5(SPACE_PLUGIN);
+  const dispatch = useIntentDispatcher();
+  const spaces = useSpaces();
+  const { graph } = useGraph();
+  const handleDone = useCallback(async (result) => {
+    if (result?.spaceKey) {
+      await Promise.all([
+        dispatch({
+          action: LayoutAction.SET_LAYOUT,
+          data: {
+            element: "toast",
+            subject: {
+              id: `${SPACE_PLUGIN}/join-success`,
+              duration: 5e3,
+              title: t("join success label"),
+              closeLabel: t("dismiss label")
+            }
+          }
+        }),
+        dispatch({
+          action: LayoutAction.SET_LAYOUT,
+          data: {
+            element: "dialog",
+            state: false
+          }
+        })
+      ]);
+    }
+    const space = spaces.find(({ key }) => result?.spaceKey?.equals(key));
+    const target = result?.target || (navigableCollections ? space?.id : void 0);
+    if (target) {
+      await graph.waitForPath({
+        target
+      }).catch(() => {
+      });
+      await Promise.all([
+        dispatch({
+          action: NavigationAction2.OPEN,
+          data: {
+            activeParts: {
+              main: [
+                target
+              ]
+            }
+          }
+        }),
+        dispatch({
+          action: NavigationAction2.EXPOSE,
+          data: {
+            id: target
+          }
+        })
+      ]);
+    }
+    if (space) {
+      await dispatch({
+        action: ObservabilityAction.SEND_EVENT,
+        data: {
+          name: "space.join",
+          properties: {
+            spaceId: space.id
+          }
+        }
+      });
+    }
+  }, [
+    dispatch,
+    spaces
+  ]);
+  return /* @__PURE__ */ React5.createElement(Dialog.Content, null, /* @__PURE__ */ React5.createElement(JoinPanel, {
+    ...props,
+    exitActionParent: /* @__PURE__ */ React5.createElement(Dialog.Close, {
+      asChild: true
+    }),
+    doneActionParent: /* @__PURE__ */ React5.createElement(Dialog.Close, {
+      asChild: true
+    }),
+    onDone: handleDone
+  }));
+};
+
 // packages/plugins/plugin-space/src/components/MenuFooter.tsx
 import { Planet } from "@phosphor-icons/react";
-import React5 from "react";
+import React6 from "react";
 import { getSpace as getSpace2 } from "@dxos/client/echo";
 import { useClient as useClient2 } from "@dxos/react-client";
-import { DropdownMenu, toLocalizedString, useTranslation as useTranslation5 } from "@dxos/react-ui";
+import { DropdownMenu, toLocalizedString, useTranslation as useTranslation6 } from "@dxos/react-ui";
 
 // packages/plugins/plugin-space/src/util.tsx
-import { NavigationAction as NavigationAction2 } from "@dxos/app-framework";
+import { NavigationAction as NavigationAction3 } from "@dxos/app-framework";
 import { create, isReactiveObject, getTypename, getSchema, getObjectAnnotation, EXPANDO_TYPENAME } from "@dxos/echo-schema";
 import { invariant } from "@dxos/invariant";
 import { Migrations } from "@dxos/migrations";
@@ -218,8 +308,9 @@ var getSpaceDisplayName = (space, { personal, namesCache = {} } = {}) => {
     }
   ];
 };
-var getCollectionGraphNodePartials = ({ collection, space, resolve }) => {
+var getCollectionGraphNodePartials = ({ navigable, collection, space, resolve }) => {
   return {
+    disabled: !navigable,
     acceptPersistenceClass: /* @__PURE__ */ new Set([
       "echo"
     ]),
@@ -259,13 +350,14 @@ var getCollectionGraphNodePartials = ({ collection, space, resolve }) => {
 var checkPendingMigration = (space) => {
   return space.state.get() === SpaceState.SPACE_REQUIRES_MIGRATION || space.state.get() === SpaceState.SPACE_READY && !!Migrations.versionProperty && space.properties[Migrations.versionProperty] !== Migrations.targetVersion;
 };
-var constructSpaceNode = ({ space, personal, namesCache, resolve }) => {
+var constructSpaceNode = ({ space, navigable = false, personal, namesCache, resolve }) => {
   const hasPendingMigration = checkPendingMigration(space);
   const collection = space.state.get() === SpaceState.SPACE_READY && space.properties[CollectionType.typename];
   const partials = space.state.get() === SpaceState.SPACE_READY && collection instanceof CollectionType ? getCollectionGraphNodePartials({
     collection,
     space,
-    resolve
+    resolve,
+    navigable
   }) : {};
   return {
     id: space.id,
@@ -279,12 +371,12 @@ var constructSpaceNode = ({ space, personal, namesCache, resolve }) => {
       }),
       description: space.state.get() === SpaceState.SPACE_READY && space.properties.description,
       icon: "ph--planet--regular",
-      disabled: space.state.get() !== SpaceState.SPACE_READY || hasPendingMigration,
+      disabled: !navigable || space.state.get() !== SpaceState.SPACE_READY || hasPendingMigration,
       testId: "spacePlugin.space"
     }
   };
 };
-var constructSpaceActionGroups = ({ space, dispatch }) => {
+var constructSpaceActionGroups = ({ space, navigable, dispatch }) => {
   const state = space.state.get();
   const hasPendingMigration = checkPendingMigration(space);
   const getId = (id) => `${id}/${space.id}`;
@@ -306,8 +398,6 @@ var constructSpaceActionGroups = ({ space, dispatch }) => {
         ],
         icon: "ph--plus--regular",
         disposition: "toolbar",
-        // TODO(wittjosiah): This is currently a navtree feature. Address this with cmd+k integration.
-        // mainAreaDisposition: 'in-flow',
         menuType: "searchList",
         testId: "spacePlugin.createObject"
       },
@@ -327,9 +417,11 @@ var constructSpaceActionGroups = ({ space, dispatch }) => {
                 })
               }
             },
-            {
-              action: NavigationAction2.OPEN
-            }
+            ...navigable ? [
+              {
+                action: NavigationAction3.OPEN
+              }
+            ] : []
           ]),
           properties: {
             label: [
@@ -374,7 +466,6 @@ var constructSpaceActions = ({ space, dispatch, personal, migrating }) => {
         ],
         icon: "ph--database--regular",
         disposition: "toolbar",
-        mainAreaDisposition: "in-flow",
         disabled: migrating || Migrations.running(space)
       }
     });
@@ -392,7 +483,7 @@ var constructSpaceActions = ({ space, dispatch, personal, migrating }) => {
           plugin: SPACE_PLUGIN,
           action: SpaceAction.SHARE,
           data: {
-            spaceId: space.id
+            space
           }
         });
       },
@@ -408,8 +499,7 @@ var constructSpaceActions = ({ space, dispatch, personal, migrating }) => {
         keyBinding: {
           macos: "meta+.",
           windows: "alt+."
-        },
-        mainAreaDisposition: "absent"
+        }
       }
     }, {
       id: locked ? getId(SpaceAction.UNLOCK) : getId(SpaceAction.LOCK),
@@ -456,8 +546,28 @@ var constructSpaceActions = ({ space, dispatch, personal, migrating }) => {
         keyBinding: {
           macos: "shift+F6",
           windows: "shift+F6"
-        },
-        mainAreaDisposition: "absent"
+        }
+      }
+    }, {
+      id: getId(SpaceAction.OPEN_SETTINGS),
+      type: ACTION_TYPE,
+      data: async () => {
+        await dispatch({
+          plugin: SPACE_PLUGIN,
+          action: SpaceAction.OPEN_SETTINGS,
+          data: {
+            space
+          }
+        });
+      },
+      properties: {
+        label: [
+          "open space settings label",
+          {
+            ns: SPACE_PLUGIN
+          }
+        ],
+        icon: "ph--gear--regular"
       }
     });
   }
@@ -482,7 +592,6 @@ var constructSpaceActions = ({ space, dispatch, personal, migrating }) => {
           }
         ],
         icon: "ph--x--regular",
-        mainAreaDisposition: "menu",
         disabled: personal
       }
     });
@@ -508,14 +617,13 @@ var constructSpaceActions = ({ space, dispatch, personal, migrating }) => {
           }
         ],
         icon: "ph--clock-counter-clockwise--regular",
-        disposition: "toolbar",
-        mainAreaDisposition: "in-flow"
+        disposition: "toolbar"
       }
     });
   }
   return actions;
 };
-var createObjectNode = ({ object, space, resolve }) => {
+var createObjectNode = ({ object, space, navigable = false, resolve }) => {
   const type = getTypename(object);
   if (!type) {
     return void 0;
@@ -527,7 +635,8 @@ var createObjectNode = ({ object, space, resolve }) => {
   const partials = object instanceof CollectionType ? getCollectionGraphNodePartials({
     collection: object,
     space,
-    resolve
+    resolve,
+    navigable
   }) : metadata.graphProps;
   return {
     id: fullyQualifiedId2(object),
@@ -548,7 +657,7 @@ var createObjectNode = ({ object, space, resolve }) => {
     }
   };
 };
-var constructObjectActionGroups = ({ object, dispatch }) => {
+var constructObjectActionGroups = ({ object, navigable, dispatch }) => {
   if (!(object instanceof CollectionType)) {
     return [];
   }
@@ -568,8 +677,6 @@ var constructObjectActionGroups = ({ object, dispatch }) => {
         ],
         icon: "ph--plus--regular",
         disposition: "toolbar",
-        // TODO(wittjosiah): This is currently a navtree feature. Address this with cmd+k integration.
-        // mainAreaDisposition: 'in-flow',
         menuType: "searchList",
         testId: "spacePlugin.createObject"
       },
@@ -589,9 +696,11 @@ var constructObjectActionGroups = ({ object, dispatch }) => {
                 })
               }
             },
-            {
-              action: NavigationAction2.OPEN
-            }
+            ...navigable ? [
+              {
+                action: NavigationAction3.OPEN
+              }
+            ] : []
           ]),
           properties: {
             label: [
@@ -639,7 +748,7 @@ var constructObjectActions = ({ node, dispatch }) => {
       }
     },
     {
-      id: getId(SpaceAction.REMOVE_OBJECT),
+      id: getId(SpaceAction.REMOVE_OBJECTS),
       type: ACTION_TYPE,
       data: async () => {
         const graph = getGraph(node);
@@ -648,9 +757,11 @@ var constructObjectActions = ({ node, dispatch }) => {
         }).find(({ data }) => data instanceof CollectionType)?.data;
         await dispatch([
           {
-            action: SpaceAction.REMOVE_OBJECT,
+            action: SpaceAction.REMOVE_OBJECTS,
             data: {
-              object,
+              objects: [
+                object
+              ],
               collection
             }
           }
@@ -723,7 +834,7 @@ var cloneObject = async (object, resolve, newSpace) => {
   const serializer = metadata.serializer;
   invariant(serializer, `No serializer for type: ${typename}`, {
     F: __dxlog_file,
-    L: 604,
+    L: 632,
     S: void 0,
     A: [
       "serializer",
@@ -742,28 +853,28 @@ var cloneObject = async (object, resolve, newSpace) => {
 
 // packages/plugins/plugin-space/src/components/MenuFooter.tsx
 var MenuFooter = ({ object }) => {
-  const { t } = useTranslation5(SPACE_PLUGIN);
+  const { t } = useTranslation6(SPACE_PLUGIN);
   const client = useClient2();
   const space = getSpace2(object);
   const spaceName = space ? getSpaceDisplayName(space, {
     personal: client.spaces.default === space
   }) : "";
-  return space ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(DropdownMenu.Separator, null), /* @__PURE__ */ React5.createElement(DropdownMenu.GroupLabel, null, t("menu footer label")), /* @__PURE__ */ React5.createElement("dl", {
+  return space ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(DropdownMenu.Separator, null), /* @__PURE__ */ React6.createElement(DropdownMenu.GroupLabel, null, t("menu footer label")), /* @__PURE__ */ React6.createElement("dl", {
     className: "pis-2 mbe-2 text-xs grid grid-cols-[max-content_1fr] gap-2"
-  }, /* @__PURE__ */ React5.createElement("dt", {
+  }, /* @__PURE__ */ React6.createElement("dt", {
     className: "uppercase text-[.75em] tracking-wide font-medium mbs-px self-start"
-  }, t("location label")), /* @__PURE__ */ React5.createElement("dd", {
+  }, t("location label")), /* @__PURE__ */ React6.createElement("dd", {
     className: "line-clamp-3"
-  }, /* @__PURE__ */ React5.createElement(Planet, {
+  }, /* @__PURE__ */ React6.createElement(Planet, {
     className: "inline-block mie-1"
   }), toLocalizedString(spaceName, t)))) : null;
 };
 
 // packages/plugins/plugin-space/src/components/PersistenceStatus.tsx
 import { ArrowsCounterClockwise, CheckCircle as CheckCircle2, Warning } from "@phosphor-icons/react";
-import React6, { useEffect as useEffect2, useState as useState2 } from "react";
+import React7, { useEffect as useEffect2, useState as useState2 } from "react";
 import { debounce } from "@dxos/async";
-import { Tooltip, useTranslation as useTranslation6 } from "@dxos/react-ui";
+import { Tooltip, useTranslation as useTranslation7 } from "@dxos/react-ui";
 import { getSize as getSize2, mx as mx3, staticPlaceholderText, warningText } from "@dxos/react-ui-theme";
 var Status;
 (function(Status2) {
@@ -772,7 +883,7 @@ var Status;
   Status2[Status2["ERROR"] = 2] = "ERROR";
 })(Status || (Status = {}));
 var PersistenceStatus = ({ db }) => {
-  const { t } = useTranslation6(SPACE_PLUGIN);
+  const { t } = useTranslation7(SPACE_PLUGIN);
   const [displayMessage, setDisplayMessage] = useState2(false);
   const [status, naturalSetStatus] = useState2(0);
   const [prevStatus, setPrevStatus] = useState2(0);
@@ -789,49 +900,49 @@ var PersistenceStatus = ({ db }) => {
   ]);
   switch (status) {
     case 2:
-      return /* @__PURE__ */ React6.createElement("div", {
+      return /* @__PURE__ */ React7.createElement("div", {
         className: "flex items-center"
-      }, /* @__PURE__ */ React6.createElement(Warning, {
+      }, /* @__PURE__ */ React7.createElement(Warning, {
         className: mx3(getSize2(4), "me-1")
-      }), /* @__PURE__ */ React6.createElement("span", {
+      }), /* @__PURE__ */ React7.createElement("span", {
         className: mx3("text-sm", warningText)
       }, t("persistence error label")));
     case 1:
-      return /* @__PURE__ */ React6.createElement("div", {
+      return /* @__PURE__ */ React7.createElement("div", {
         className: "flex items-center"
-      }, /* @__PURE__ */ React6.createElement(ArrowsCounterClockwise, {
+      }, /* @__PURE__ */ React7.createElement(ArrowsCounterClockwise, {
         className: mx3(getSize2(4), "me-1")
-      }), /* @__PURE__ */ React6.createElement("span", {
+      }), /* @__PURE__ */ React7.createElement("span", {
         className: mx3("text-sm", staticPlaceholderText)
       }, t("persistence pending label")));
     case 0:
     default:
-      return /* @__PURE__ */ React6.createElement(Tooltip.Root, {
+      return /* @__PURE__ */ React7.createElement(Tooltip.Root, {
         delayDuration: 400
-      }, /* @__PURE__ */ React6.createElement(Tooltip.Trigger, {
+      }, /* @__PURE__ */ React7.createElement(Tooltip.Trigger, {
         role: "status",
         className: "flex items-center"
-      }, /* @__PURE__ */ React6.createElement(CheckCircle2, {
+      }, /* @__PURE__ */ React7.createElement(CheckCircle2, {
         className: mx3(getSize2(4), "me-1")
-      }), displayMessage && /* @__PURE__ */ React6.createElement("span", {
+      }), displayMessage && /* @__PURE__ */ React7.createElement("span", {
         className: mx3("text-sm", staticPlaceholderText)
-      }, t("persisted locally label"))), /* @__PURE__ */ React6.createElement(Tooltip.Portal, null, /* @__PURE__ */ React6.createElement(Tooltip.Content, {
+      }, t("persisted locally label"))), /* @__PURE__ */ React7.createElement(Tooltip.Portal, null, /* @__PURE__ */ React7.createElement(Tooltip.Content, {
         classNames: "z-10"
-      }, t("persisted locally message"), /* @__PURE__ */ React6.createElement(Tooltip.Arrow, null))));
+      }, t("persisted locally message"), /* @__PURE__ */ React7.createElement(Tooltip.Arrow, null))));
   }
 };
 
 // packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx
-import React7, { useCallback, useRef, useState as useState3 } from "react";
+import React8, { useCallback as useCallback2, useRef, useState as useState3 } from "react";
 import { log } from "@dxos/log";
-import { Button as Button2, Input as Input2, Popover, useTranslation as useTranslation7 } from "@dxos/react-ui";
+import { Button as Button2, Input as Input2, Popover, useTranslation as useTranslation8 } from "@dxos/react-ui";
 var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/PopoverRenameObject.tsx";
 var PopoverRenameObject = ({ object: obj }) => {
-  const { t } = useTranslation7(SPACE_PLUGIN);
+  const { t } = useTranslation8(SPACE_PLUGIN);
   const doneButton = useRef(null);
   const object = obj;
   const [name, setName] = useState3(object.name || object.title || "");
-  const handleDone = useCallback(() => {
+  const handleDone = useCallback2(() => {
     try {
       object.name = name;
     } catch {
@@ -852,23 +963,23 @@ var PopoverRenameObject = ({ object: obj }) => {
     object,
     name
   ]);
-  return /* @__PURE__ */ React7.createElement("div", {
+  return /* @__PURE__ */ React8.createElement("div", {
     role: "none",
     className: "p-1 flex gap-2"
-  }, /* @__PURE__ */ React7.createElement("div", {
+  }, /* @__PURE__ */ React8.createElement("div", {
     role: "none",
     className: "flex-1"
-  }, /* @__PURE__ */ React7.createElement(Input2.Root, null, /* @__PURE__ */ React7.createElement(Input2.Label, {
+  }, /* @__PURE__ */ React8.createElement(Input2.Root, null, /* @__PURE__ */ React8.createElement(Input2.Label, {
     srOnly: true
-  }, t("object name label")), /* @__PURE__ */ React7.createElement(Input2.TextInput, {
+  }, t("object name label")), /* @__PURE__ */ React8.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__ */ React7.createElement(Popover.Close, {
+  }))), /* @__PURE__ */ React8.createElement(Popover.Close, {
     asChild: true
-  }, /* @__PURE__ */ React7.createElement(Button2, {
+  }, /* @__PURE__ */ React8.createElement(Button2, {
     ref: doneButton,
     classNames: "self-stretch",
     onClick: handleDone
@@ -878,36 +989,36 @@ var PopoverRenameObject = ({ object: obj }) => {
 };
 
 // packages/plugins/plugin-space/src/components/PopoverRenameSpace.tsx
-import React8, { useCallback as useCallback2, useRef as useRef2, useState as useState4 } from "react";
-import { Button as Button3, Input as Input3, Popover as Popover2, useTranslation as useTranslation8 } from "@dxos/react-ui";
+import React9, { useCallback as useCallback3, useRef as useRef2, useState as useState4 } from "react";
+import { Button as Button3, Input as Input3, Popover as Popover2, useTranslation as useTranslation9 } from "@dxos/react-ui";
 var PopoverRenameSpace = ({ space }) => {
-  const { t } = useTranslation8(SPACE_PLUGIN);
+  const { t } = useTranslation9(SPACE_PLUGIN);
   const doneButton = useRef2(null);
   const [name, setName] = useState4(space.properties.name ?? "");
-  const handleDone = useCallback2(() => {
+  const handleDone = useCallback3(() => {
     space.properties.name = name;
   }, [
     space,
     name
   ]);
-  return /* @__PURE__ */ React8.createElement("div", {
+  return /* @__PURE__ */ React9.createElement("div", {
     role: "none",
     className: "p-1 flex gap-2"
-  }, /* @__PURE__ */ React8.createElement("div", {
+  }, /* @__PURE__ */ React9.createElement("div", {
     role: "none",
     className: "flex-1"
-  }, /* @__PURE__ */ React8.createElement(Input3.Root, null, /* @__PURE__ */ React8.createElement(Input3.Label, {
+  }, /* @__PURE__ */ React9.createElement(Input3.Root, null, /* @__PURE__ */ React9.createElement(Input3.Label, {
     srOnly: true
-  }, t("space name label")), /* @__PURE__ */ React8.createElement(Input3.TextInput, {
+  }, t("space name label")), /* @__PURE__ */ React9.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__ */ React8.createElement(Popover2.Close, {
+  }))), /* @__PURE__ */ React9.createElement(Popover2.Close, {
     asChild: true
-  }, /* @__PURE__ */ React8.createElement(Button3, {
+  }, /* @__PURE__ */ React9.createElement(Button3, {
     ref: doneButton,
     classNames: "self-stretch",
     onClick: handleDone
@@ -917,271 +1028,38 @@ var PopoverRenameSpace = ({ space }) => {
 };
 
 // packages/plugins/plugin-space/src/components/ShareSpaceButton.tsx
-import React9 from "react";
-import { useIntentDispatcher } from "@dxos/app-framework";
-import { Button as Button4, useTranslation as useTranslation9 } from "@dxos/react-ui";
-var ShareSpaceButton = ({ spaceId }) => {
-  const dispatch = useIntentDispatcher();
-  return /* @__PURE__ */ React9.createElement(ShareSpaceButtonImpl, {
+import React10 from "react";
+import { useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
+import { IconButton, useTranslation as useTranslation10 } from "@dxos/react-ui";
+var ShareSpaceButton = ({ space }) => {
+  const dispatch = useIntentDispatcher2();
+  return /* @__PURE__ */ React10.createElement(ShareSpaceButtonImpl, {
     onClick: () => dispatch({
       action: SpaceAction.SHARE,
       data: {
-        spaceId
+        space
       }
     })
   });
 };
 var ShareSpaceButtonImpl = ({ onClick }) => {
-  const { t } = useTranslation9(SPACE_PLUGIN);
-  return /* @__PURE__ */ React9.createElement(Button4, {
-    "data-testid": "spacePlugin.shareSpaceButton",
-    onClick,
-    classNames: "mli-1"
-  }, t("share space label"));
-};
-
-// packages/plugins/plugin-space/src/components/SpaceMain/SpaceMain.tsx
-import { Command } from "@phosphor-icons/react";
-import React11 from "react";
-import { Surface } from "@dxos/app-framework";
-import { SpaceState as SpaceState2 } from "@dxos/react-client/echo";
-import { Main, useTranslation as useTranslation11 } from "@dxos/react-ui";
-import { getSize as getSize4, mx as mx5, topbarBlockPaddingStart } from "@dxos/react-ui-theme";
-import { ClipboardProvider } from "@dxos/shell/react";
-
-// packages/plugins/plugin-space/src/components/SpaceMain/SpaceMembersSection.tsx
-import { CaretDown, Check, UserPlus, UsersThree } from "@phosphor-icons/react";
-import React10, { useCallback as useCallback3, useState as useState5 } from "react";
-import { LayoutAction, useIntent } from "@dxos/app-framework";
-import { useMembers, SpaceMember, useSpaceInvitations } from "@dxos/react-client/echo";
-import { InvitationEncoder } from "@dxos/react-client/invitations";
-import { Invitation } from "@dxos/react-client/invitations";
-import { Button as Button5, ButtonGroup, DropdownMenu as DropdownMenu2, List, useTranslation as useTranslation10 } from "@dxos/react-ui";
-import { descriptionText as descriptionText2, getSize as getSize3, mx as mx4 } from "@dxos/react-ui-theme";
-import { InvitationListItem, IdentityListItem } from "@dxos/shell/react";
-var activeActionKeyStorageKey = "dxos:react-shell/space-manager/active-action";
-var Presence = SpaceMember.PresenceState;
-var handleCreateInvitationUrl = (invitationCode) => `${origin}?spaceInvitationCode=${invitationCode}`;
-var SpaceMemberList = ({ members }) => {
-  return members.length > 0 ? /* @__PURE__ */ React10.createElement(List, {
-    classNames: "col-start-2 col-end-5 gap-y-1 grid grid-cols-subgrid items-center"
-  }, members.map((member) => /* @__PURE__ */ React10.createElement(IdentityListItem, {
-    classNames: "contents",
-    key: member.identity.identityKey.toHex(),
-    identity: member.identity,
-    presence: member.presence
-  }))) : null;
-};
-var SpaceMembersSection = ({ space }) => {
   const { t } = useTranslation10(SPACE_PLUGIN);
-  const invitations = useSpaceInvitations(space.key);
-  const { dispatch } = useIntent();
-  const handleCloseDialog = () => dispatch({
-    action: LayoutAction.SET_LAYOUT,
-    data: {
-      element: "dialog",
-      state: false
-    }
-  });
-  const handleInvitationSelect = ({ invitation: invitationObservable }) => {
-    const invitation = invitationObservable.get();
-    void dispatch({
-      action: LayoutAction.SET_LAYOUT,
-      data: {
-        element: "dialog",
-        component: "dxos.org/plugin/space/InvitationManagerDialog",
-        subject: {
-          invitationUrl: handleCreateInvitationUrl(InvitationEncoder.encode(invitation)),
-          send: handleCloseDialog,
-          status: invitation.state,
-          type: invitation.type,
-          authCode: invitation.authCode,
-          id: invitation.invitationId
-        }
-      }
-    });
-  };
-  const inviteActions = {
-    inviteOne: {
-      label: t("invite one label", {
-        ns: "os"
-      }),
-      description: t("invite one description", {
-        ns: "os"
-      }),
-      icon: UserPlus,
-      onClick: useCallback3(() => {
-        space.share?.({
-          type: Invitation.Type.INTERACTIVE,
-          authMethod: Invitation.AuthMethod.SHARED_SECRET
-        });
-      }, [
-        space
-      ])
-    },
-    inviteMany: {
-      label: t("invite many label", {
-        ns: "os"
-      }),
-      description: t("invite many description", {
-        ns: "os"
-      }),
-      icon: UsersThree,
-      onClick: useCallback3(() => {
-        space.share?.({
-          type: Invitation.Type.INTERACTIVE,
-          authMethod: Invitation.AuthMethod.NONE,
-          multiUse: true
-        });
-      }, [
-        space
-      ])
-    }
-  };
-  const [activeActionKey, setInternalActiveActionKey] = useState5(localStorage.getItem(activeActionKeyStorageKey) ?? "inviteOne");
-  const setActiveActionKey = (nextKey) => {
-    setInternalActiveActionKey(nextKey);
-    localStorage.setItem(activeActionKeyStorageKey, nextKey);
-  };
-  const activeAction = inviteActions[activeActionKey] ?? {};
-  const members = useMembers(space.key).reduce((acc, member) => {
-    acc[member.presence].push(member);
-    return acc;
-  }, {
-    [Presence.ONLINE]: [],
-    [Presence.OFFLINE]: []
+  return /* @__PURE__ */ React10.createElement(IconButton, {
+    "data-testid": "spacePlugin.shareSpaceButton",
+    icon: "ph--users--regular",
+    label: t("share space label"),
+    onClick
   });
-  return /* @__PURE__ */ React10.createElement("section", {
-    className: "mbe-4 col-span-3 grid gap-y-2 grid-cols-subgrid auto-rows-min"
-  }, /* @__PURE__ */ React10.createElement("h2", {
-    className: "contents"
-  }, /* @__PURE__ */ React10.createElement(UsersThree, {
-    weight: "duotone",
-    className: mx4(getSize3(5), "place-self-center")
-  }), /* @__PURE__ */ React10.createElement("span", {
-    className: "text-lg col-span-2"
-  }, t("space members label"))), /* @__PURE__ */ React10.createElement("h3", {
-    className: "col-start-2 col-span-3 text-sm italic text-description"
-  }, t("invitations heading")), invitations.length > 0 && /* @__PURE__ */ React10.createElement(List, {
-    classNames: "col-start-2 col-span-2 gap-y-2 grid grid-cols-[var(--rail-size)_1fr_var(--rail-action)_var(--rail-action)]"
-  }, invitations.map((invitation) => /* @__PURE__ */ React10.createElement(InvitationListItem, {
-    reverseEffects: true,
-    classNames: "pis-0 pie-0 gap-0 col-span-4 grid grid-cols-subgrid",
-    key: invitation.get().invitationId,
-    invitation,
-    send: handleInvitationSelect,
-    createInvitationUrl: handleCreateInvitationUrl
-  }))), /* @__PURE__ */ React10.createElement(ButtonGroup, {
-    classNames: "col-start-2 col-end-4 grid grid-cols-[1fr_var(--rail-action)] place-self-grow gap-px"
-  }, /* @__PURE__ */ React10.createElement(Button5, {
-    classNames: "gap-2",
-    onClick: activeAction.onClick
-  }, /* @__PURE__ */ React10.createElement(activeAction.icon, {
-    className: getSize3(5)
-  }), /* @__PURE__ */ React10.createElement("span", null, t(activeAction.label, {
-    ns: "os"
-  }))), /* @__PURE__ */ React10.createElement(DropdownMenu2.Root, null, /* @__PURE__ */ React10.createElement(DropdownMenu2.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React10.createElement(Button5, {
-    classNames: "pli-0"
-  }, /* @__PURE__ */ React10.createElement(CaretDown, {
-    className: getSize3(4)
-  }))), /* @__PURE__ */ React10.createElement(DropdownMenu2.Content, null, /* @__PURE__ */ React10.createElement(DropdownMenu2.Viewport, null, Object.entries(inviteActions).map(([id, action]) => {
-    return /* @__PURE__ */ React10.createElement(DropdownMenu2.CheckboxItem, {
-      key: id,
-      "aria-labelledby": `${id}__label`,
-      "aria-describedby": `${id}__description`,
-      checked: activeActionKey === id,
-      onCheckedChange: (checked) => checked && setActiveActionKey(id),
-      classNames: "gap-2"
-    }, action.icon && /* @__PURE__ */ React10.createElement(action.icon, {
-      className: getSize3(5)
-    }), /* @__PURE__ */ React10.createElement("div", {
-      role: "none",
-      className: "flex-1 min-is-0 space-b-1"
-    }, /* @__PURE__ */ React10.createElement("p", {
-      id: `${id}__label`
-    }, t(action.label, {
-      ns: "os"
-    })), action.description && /* @__PURE__ */ React10.createElement("p", {
-      id: `${id}__description`,
-      className: descriptionText2
-    }, t(action.description, {
-      ns: "os"
-    }))), /* @__PURE__ */ React10.createElement(DropdownMenu2.ItemIndicator, {
-      asChild: true
-    }, /* @__PURE__ */ React10.createElement(Check, {
-      className: getSize3(4)
-    })));
-  })), /* @__PURE__ */ React10.createElement(DropdownMenu2.Arrow, null)))), members[Presence.ONLINE].length + members[Presence.OFFLINE].length < 1 ? /* @__PURE__ */ React10.createElement("p", {
-    className: mx4(descriptionText2, "text-center is-full mlb-2")
-  }, t("empty space members message", {
-    ns: "os"
-  })) : /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement("h3", {
-    className: "col-start-2 col-end-5 text-sm italic text-description"
-  }, t("active space members heading", {
-    count: members[Presence.ONLINE].length
-  })), /* @__PURE__ */ React10.createElement(SpaceMemberList, {
-    members: members[Presence.ONLINE]
-  }), /* @__PURE__ */ React10.createElement("h3", {
-    className: "col-start-2 col-end-5 text-sm italic text-description"
-  }, t("inactive space members heading", {
-    count: members[Presence.OFFLINE].length
-  })), /* @__PURE__ */ React10.createElement(SpaceMemberList, {
-    members: members[Presence.OFFLINE]
-  })));
-};
-
-// packages/plugins/plugin-space/src/components/SpaceMain/SpaceMain.tsx
-var KeyShortcuts = () => {
-  const { t } = useTranslation11(SPACE_PLUGIN);
-  return /* @__PURE__ */ React11.createElement("section", {
-    className: "mbe-4 col-span-4 md:col-start-5 md:col-end-7 grid grid-cols-subgrid gap-y-2 auto-rows-min"
-  }, /* @__PURE__ */ React11.createElement("h2", {
-    className: "contents"
-  }, /* @__PURE__ */ React11.createElement(Command, {
-    weight: "duotone",
-    className: mx5(getSize4(5), "place-self-center")
-  }), /* @__PURE__ */ React11.createElement("span", {
-    className: "text-lg col-span-2 md:col-span-1"
-  }, t("keyshortcuts label"))), /* @__PURE__ */ React11.createElement("div", {
-    role: "none",
-    className: "col-start-2 col-end-4 md:col-end-5 pie-2"
-  }, /* @__PURE__ */ React11.createElement(Surface, {
-    role: "keyshortcuts"
-  })));
-};
-var spaceMainLayout = "grid gap-y-2 auto-rows-min before:bs-2 before:col-span-5 grid-cols-[var(--rail-size)_var(--rail-size)_1fr_var(--rail-size)] md:grid-cols-[var(--rail-size)_var(--rail-size)_minmax(max-content,1fr)_var(--rail-size)_var(--rail-size)_minmax(max-content,2fr)_var(--rail-size)]";
-var SpaceMain = ({ space, role }) => {
-  const state = space.state.get();
-  const ready = state === SpaceState2.SPACE_READY;
-  const Root = role === "main" ? Main.Content : "div";
-  return /* @__PURE__ */ React11.createElement(ClipboardProvider, null, /* @__PURE__ */ React11.createElement(Root, {
-    ...role === "main" ? {
-      classNames: [
-        topbarBlockPaddingStart,
-        "min-bs-dvh",
-        spaceMainLayout
-      ]
-    } : {
-      role: "none",
-      className: mx5(topbarBlockPaddingStart, "row-span-2", spaceMainLayout)
-    },
-    "data-testid": `spacePlugin.${role}`,
-    "data-isready": ready ? "true" : "false"
-  }, ready && /* @__PURE__ */ React11.createElement(SpaceMembersSection, {
-    space
-  }), /* @__PURE__ */ React11.createElement(KeyShortcuts, null)));
 };
 
 // packages/plugins/plugin-space/src/components/SpacePresence.tsx
-import React12, { useCallback as useCallback4, useEffect as useEffect3, useState as useState6 } from "react";
+import React11, { useCallback as useCallback4, useEffect as useEffect3, useState as useState5 } from "react";
 import { usePlugin } from "@dxos/app-framework";
 import { generateName } from "@dxos/display-name";
 import { PublicKey, useClient as useClient3 } from "@dxos/react-client";
-import { getSpace as getSpace3, useMembers as useMembers2, fullyQualifiedId as fullyQualifiedId3 } from "@dxos/react-client/echo";
+import { getSpace as getSpace3, useMembers, fullyQualifiedId as fullyQualifiedId3 } from "@dxos/react-client/echo";
 import { useIdentity } from "@dxos/react-client/halo";
-import { Avatar, AvatarGroup, AvatarGroupItem, Tooltip as Tooltip2, useTranslation as useTranslation12, List as List2, ListItem, useDefaultValue } from "@dxos/react-ui";
+import { Avatar, AvatarGroup, AvatarGroupItem, Tooltip as Tooltip2, useTranslation as useTranslation11, List, ListItem, useDefaultValue } from "@dxos/react-ui";
 import { AttentionGlyph, useAttention } from "@dxos/react-ui-attention";
 import { ComplexMap, keyToFallback } from "@dxos/util";
 var REFRESH_INTERVAL = 5e3;
@@ -1193,8 +1071,8 @@ var SpacePresence = ({ object, spaceKey }) => {
   const client = useClient3();
   const identity = useIdentity();
   const space = spaceKey ? client.spaces.get(spaceKey) : getSpace3(object);
-  const spaceMembers = useMembers2(space?.key);
-  const [_moment, setMoment] = useState6(Date.now());
+  const spaceMembers = useMembers(space?.key);
+  const [_moment, setMoment] = useState5(Date.now());
   useEffect3(() => {
     const interval = setInterval(() => setMoment(Date.now()), REFRESH_INTERVAL);
     return () => clearInterval(interval);
@@ -1218,7 +1096,7 @@ var SpacePresence = ({ object, spaceKey }) => {
       lastSeen
     };
   }).toSorted((a, b) => a.lastSeen - b.lastSeen);
-  return /* @__PURE__ */ React12.createElement(FullPresence, {
+  return /* @__PURE__ */ React11.createElement(FullPresence, {
     members: membersForObject
   });
 };
@@ -1228,38 +1106,38 @@ var FullPresence = (props) => {
   if (members.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ React12.createElement(AvatarGroup.Root, {
+  return /* @__PURE__ */ React11.createElement(AvatarGroup.Root, {
     size,
     classNames: "mbs-2 mie-4",
     "data-testid": "spacePlugin.presence"
-  }, members.slice(0, 3).map((member, i) => /* @__PURE__ */ React12.createElement(Tooltip2.Root, {
+  }, members.slice(0, 3).map((member, i) => /* @__PURE__ */ React11.createElement(Tooltip2.Root, {
     key: member.identity.identityKey.toHex()
-  }, /* @__PURE__ */ React12.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React12.createElement(PrensenceAvatar, {
+  }, /* @__PURE__ */ React11.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React11.createElement(PrensenceAvatar, {
     identity: member.identity,
     group: true,
     match: member.currentlyAttended,
     index: members.length - i,
     onClick: () => onMemberClick?.(member)
-  })), /* @__PURE__ */ React12.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React12.createElement(Tooltip2.Content, {
+  })), /* @__PURE__ */ React11.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React11.createElement(Tooltip2.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ React12.createElement("span", null, getName(member.identity)), /* @__PURE__ */ React12.createElement(Tooltip2.Arrow, null))))), members.length > 3 && /* @__PURE__ */ React12.createElement(Tooltip2.Root, null, /* @__PURE__ */ React12.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React12.createElement(AvatarGroupItem.Root, {
+  }, /* @__PURE__ */ React11.createElement("span", null, getName(member.identity)), /* @__PURE__ */ React11.createElement(Tooltip2.Arrow, null))))), members.length > 3 && /* @__PURE__ */ React11.createElement(Tooltip2.Root, null, /* @__PURE__ */ React11.createElement(Tooltip2.Trigger, null, /* @__PURE__ */ React11.createElement(AvatarGroupItem.Root, {
     status: "inactive"
-  }, /* @__PURE__ */ React12.createElement(Avatar.Frame, {
+  }, /* @__PURE__ */ React11.createElement(Avatar.Frame, {
     style: {
       zIndex: members.length - 4
     }
-  }, /* @__PURE__ */ React12.createElement(Avatar.Fallback, {
+  }, /* @__PURE__ */ React11.createElement(Avatar.Fallback, {
     text: `+${members.length - 3}`
-  })))), /* @__PURE__ */ React12.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React12.createElement(Tooltip2.Content, {
+  })))), /* @__PURE__ */ React11.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React11.createElement(Tooltip2.Content, {
     side: "bottom"
-  }, /* @__PURE__ */ React12.createElement(Tooltip2.Arrow, null), /* @__PURE__ */ React12.createElement(List2, {
+  }, /* @__PURE__ */ React11.createElement(Tooltip2.Arrow, null), /* @__PURE__ */ React11.createElement(List, {
     classNames: "max-h-56 overflow-y-auto"
-  }, members.map((member) => /* @__PURE__ */ React12.createElement(ListItem.Root, {
+  }, members.map((member) => /* @__PURE__ */ React11.createElement(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__ */ React12.createElement(PrensenceAvatar, {
+  }, /* @__PURE__ */ React11.createElement(PrensenceAvatar, {
     identity: member.identity,
     showName: true,
     match: member.currentlyAttended
@@ -1269,10 +1147,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__ */ React12.createElement(Root, {
+  return /* @__PURE__ */ React11.createElement(Root, {
     status,
     hue: identity.profile?.data?.hue || fallbackValue.hue
-  }, /* @__PURE__ */ React12.createElement(Avatar.Frame, {
+  }, /* @__PURE__ */ React11.createElement(Avatar.Frame, {
     "data-testid": "spacePlugin.presence.member",
     "data-status": status,
     ...index ? {
@@ -1281,9 +1159,9 @@ var PrensenceAvatar = ({ identity, showName, match, group, index, onClick }) =>
       }
     } : {},
     onClick: () => onClick?.()
-  }, /* @__PURE__ */ React12.createElement(Avatar.Fallback, {
+  }, /* @__PURE__ */ React11.createElement(Avatar.Fallback, {
     text: identity.profile?.data?.emoji || fallbackValue.emoji
-  })), showName && /* @__PURE__ */ React12.createElement(Avatar.Label, {
+  })), showName && /* @__PURE__ */ React11.createElement(Avatar.Label, {
     classNames: "text-sm truncate pli-2"
   }, getName(identity)));
 };
@@ -1292,7 +1170,7 @@ var SmallPresenceLive = ({ id, viewers }) => {
     const moment = Date.now();
     return Array.from(viewers2.values()).filter(({ lastSeen }) => moment - lastSeen < ACTIVITY_DURATION);
   };
-  const [activeViewers, setActiveViewers] = useState6(viewers ? getActiveViewers(viewers) : []);
+  const [activeViewers, setActiveViewers] = useState5(viewers ? getActiveViewers(viewers) : []);
   useEffect3(() => {
     if (viewers) {
       setActiveViewers(getActiveViewers(viewers));
@@ -1304,44 +1182,44 @@ var SmallPresenceLive = ({ id, viewers }) => {
   }, [
     viewers
   ]);
-  return /* @__PURE__ */ React12.createElement(SmallPresence, {
+  return /* @__PURE__ */ React11.createElement(SmallPresence, {
     id,
     count: activeViewers.length
   });
 };
 var SmallPresence = ({ id, count }) => {
-  const { t } = useTranslation12(SPACE_PLUGIN);
+  const { t } = useTranslation11(SPACE_PLUGIN);
   const { hasAttention, isAncestor, isRelated } = useAttention(id);
   const attention = hasAttention || isAncestor || isRelated;
-  return /* @__PURE__ */ React12.createElement(Tooltip2.Root, null, /* @__PURE__ */ React12.createElement(Tooltip2.Trigger, {
+  return /* @__PURE__ */ React11.createElement(Tooltip2.Root, null, /* @__PURE__ */ React11.createElement(Tooltip2.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ React12.createElement("div", {
+  }, /* @__PURE__ */ React11.createElement("div", {
     role: "none",
     className: "flex",
     "data-attention": attention
-  }, /* @__PURE__ */ React12.createElement(AttentionGlyph, {
+  }, /* @__PURE__ */ React11.createElement(AttentionGlyph, {
     presence: count > 1 ? "many" : count === 1 ? "one" : "none",
     classNames: "self-center mie-1"
-  }))), /* @__PURE__ */ React12.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React12.createElement(Tooltip2.Content, {
+  }))), /* @__PURE__ */ React11.createElement(Tooltip2.Portal, null, /* @__PURE__ */ React11.createElement(Tooltip2.Content, {
     side: "bottom",
     classNames: "z-[70]"
-  }, /* @__PURE__ */ React12.createElement("span", null, t("presence label", {
+  }, /* @__PURE__ */ React11.createElement("span", null, t("presence label", {
     count
-  })), /* @__PURE__ */ React12.createElement(Tooltip2.Arrow, null))));
+  })), /* @__PURE__ */ React11.createElement(Tooltip2.Arrow, null))));
 };
 
-// packages/plugins/plugin-space/src/components/SpaceSettings.tsx
-import React13 from "react";
-import { useIntentDispatcher as useIntentDispatcher2, useResolvePlugins } from "@dxos/app-framework";
-import { Input as Input4, Select, toLocalizedString as toLocalizedString2, useTranslation as useTranslation13 } from "@dxos/react-ui";
+// packages/plugins/plugin-space/src/components/SpacePluginSettings.tsx
+import React12 from "react";
+import { useIntentDispatcher as useIntentDispatcher3, useResolvePlugins } from "@dxos/app-framework";
+import { Input as Input4, Select, toLocalizedString as toLocalizedString2, useTranslation as useTranslation12 } from "@dxos/react-ui";
 import { DeprecatedFormInput } from "@dxos/react-ui-data";
-var SpaceSettings = ({ settings }) => {
-  const { t } = useTranslation13(SPACE_PLUGIN);
-  const dispatch = useIntentDispatcher2();
+var SpacePluginSettings = ({ settings }) => {
+  const { t } = useTranslation12(SPACE_PLUGIN);
+  const dispatch = useIntentDispatcher3();
   const plugins = useResolvePlugins(parseSpaceInitPlugin);
-  return /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(DeprecatedFormInput, {
+  return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(DeprecatedFormInput, {
     label: t("show hidden spaces label")
-  }, /* @__PURE__ */ React13.createElement(Input4.Switch, {
+  }, /* @__PURE__ */ React12.createElement(Input4.Switch, {
     checked: settings.showHidden,
     onCheckedChange: (checked) => dispatch({
       plugin: SPACE_PLUGIN,
@@ -1350,41 +1228,49 @@ var SpaceSettings = ({ settings }) => {
         state: !!checked
       }
     })
-  })), /* @__PURE__ */ React13.createElement(DeprecatedFormInput, {
+  })), /* @__PURE__ */ React12.createElement(DeprecatedFormInput, {
     label: t("default on space create label")
-  }, /* @__PURE__ */ React13.createElement(Select.Root, {
+  }, /* @__PURE__ */ React12.createElement(Select.Root, {
     value: settings.onSpaceCreate,
     onValueChange: (value) => {
       settings.onSpaceCreate = value;
     }
-  }, /* @__PURE__ */ React13.createElement(Select.TriggerButton, null), /* @__PURE__ */ React13.createElement(Select.Portal, null, /* @__PURE__ */ React13.createElement(Select.Content, null, /* @__PURE__ */ React13.createElement(Select.Viewport, null, plugins.map(({ provides: { space: { onSpaceCreate } } }) => /* @__PURE__ */ React13.createElement(Select.Option, {
+  }, /* @__PURE__ */ React12.createElement(Select.TriggerButton, null), /* @__PURE__ */ React12.createElement(Select.Portal, null, /* @__PURE__ */ React12.createElement(Select.Content, null, /* @__PURE__ */ React12.createElement(Select.Viewport, null, plugins.map(({ provides: { space: { onSpaceCreate } } }) => /* @__PURE__ */ React12.createElement(Select.Option, {
     key: onSpaceCreate.action,
     value: onSpaceCreate.action
   }, toLocalizedString2(onSpaceCreate.label, t)))))))));
 };
 
-// packages/plugins/plugin-space/src/components/SpaceSettingsPanel.tsx
-import React14, { useCallback as useCallback5, useState as useState7 } from "react";
+// packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsDialog.tsx
+import React14, { useState as useState7 } from "react";
+import { useClient as useClient5 } from "@dxos/react-client";
+import { Button as Button4, Dialog as Dialog2, Icon, toLocalizedString as toLocalizedString3, useTranslation as useTranslation14 } from "@dxos/react-ui";
+import { Tabs } from "@dxos/react-ui-tabs";
+import { ClipboardProvider, SpacePanel } from "@dxos/shell/react";
+
+// packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx
+import React13, { useCallback as useCallback5, useState as useState6 } from "react";
 import { log as log2 } from "@dxos/log";
 import { EdgeReplicationSetting } from "@dxos/protocols/proto/dxos/echo/metadata";
 import { useClient as useClient4 } from "@dxos/react-client";
 import { DeviceType, useDevices } from "@dxos/react-client/halo";
-import { Input as Input5, useTranslation as useTranslation14 } from "@dxos/react-ui";
-var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettingsPanel.tsx";
+import { Input as Input5, useTranslation as useTranslation13 } from "@dxos/react-ui";
+import { DeprecatedFormInput as DeprecatedFormInput2 } from "@dxos/react-ui-data";
+var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsPanel.tsx";
 var SpaceSettingsPanel = ({ space }) => {
-  const { t } = useTranslation14(SPACE_PLUGIN);
+  const { t } = useTranslation13(SPACE_PLUGIN);
   const client = useClient4();
   const devices = useDevices();
   const managedDeviceAvailable = devices.find((device) => device.profile?.type === DeviceType.AGENT_MANAGED);
   const edgeAgents = Boolean(client.config.values.runtime?.client?.edgeFeatures?.agents);
   const edgeReplicationAvailable = edgeAgents && managedDeviceAvailable;
-  const [edgeReplication, setEdgeReplication] = useState7(space.internal.data.edgeReplication === EdgeReplicationSetting.ENABLED);
+  const [edgeReplication, setEdgeReplication] = useState6(space.internal.data.edgeReplication === EdgeReplicationSetting.ENABLED);
   const toggleEdgeReplication = useCallback5(async (next) => {
     setEdgeReplication(next);
     await space?.internal.setEdgeReplicationPreference(next ? EdgeReplicationSetting.ENABLED : EdgeReplicationSetting.DISABLED).catch((err) => {
       log2.catch(err, void 0, {
         F: __dxlog_file3,
-        L: 38,
+        L: 39,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -1393,39 +1279,117 @@ var SpaceSettingsPanel = ({ space }) => {
   }, [
     space
   ]);
-  return /* @__PURE__ */ React14.createElement("div", {
+  return /* @__PURE__ */ React13.createElement("div", {
     role: "form",
-    className: "flex flex-col w-full p-2 gap-4"
-  }, /* @__PURE__ */ React14.createElement(Input5.Root, null, /* @__PURE__ */ React14.createElement("div", {
-    role: "none",
-    className: "flex flex-col gap-1"
-  }, /* @__PURE__ */ React14.createElement(Input5.Label, null, t("name label")), /* @__PURE__ */ React14.createElement(Input5.TextInput, {
-    placeholder: t("name placeholder"),
+    className: "flex flex-col"
+  }, /* @__PURE__ */ React13.createElement(DeprecatedFormInput2, {
+    label: t("name label")
+  }, /* @__PURE__ */ React13.createElement(Input5.TextInput, {
+    placeholder: t("unnamed space label"),
     value: space.properties.name ?? "",
     onChange: (event) => {
       space.properties.name = event.target.value;
     }
-  }))), edgeReplicationAvailable && /* @__PURE__ */ React14.createElement(Input5.Root, null, /* @__PURE__ */ React14.createElement("div", {
-    role: "none",
-    className: "flex justify-between"
-  }, /* @__PURE__ */ React14.createElement(Input5.Label, null, t("edge replication label")), /* @__PURE__ */ React14.createElement(Input5.Switch, {
+  })), edgeReplicationAvailable && /* @__PURE__ */ React13.createElement(DeprecatedFormInput2, {
+    label: t("edge replication label")
+  }, /* @__PURE__ */ React13.createElement(Input5.Switch, {
     checked: edgeReplication,
     onCheckedChange: toggleEdgeReplication
-  }))));
+  })));
+};
+
+// packages/plugins/plugin-space/src/components/SpaceSettings/SpaceSettingsDialog.tsx
+var SpaceSettingsDialog = ({ space, target, createInvitationUrl, initialTab = "members", namesCache }) => {
+  const { t } = useTranslation14(SPACE_PLUGIN);
+  const client = useClient5();
+  const [tabsActivePart, setTabsActivePart] = useState7("list");
+  const [selected, setSelected] = useState7(initialTab);
+  const locked = space.properties[COMPOSER_SPACE_LOCK];
+  const name = getSpaceDisplayName(space, {
+    personal: client.spaces.default === space,
+    namesCache
+  });
+  return (
+    // TODO(wittjosiah): The tablist dialog pattern is copied from @dxos/plugin-manager.
+    //  Consider factoring it out to the tabs package.
+    /* @__PURE__ */ React14.createElement(Dialog2.Content, {
+      classNames: "p-0 bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
+    }, /* @__PURE__ */ React14.createElement("div", {
+      role: "none",
+      className: "flex justify-between pbs-3 pis-2 pie-3 @md:pbs-4 @md:pis-4 @md:pie-5"
+    }, /* @__PURE__ */ React14.createElement(Dialog2.Title, {
+      onClick: () => setTabsActivePart("list"),
+      "aria-description": t("click to return to tablist description"),
+      classNames: "flex cursor-pointer items-center group/title"
+    }, /* @__PURE__ */ React14.createElement(Icon, {
+      icon: "ph--caret-left--regular",
+      size: 4,
+      classNames: [
+        "@md:hidden",
+        tabsActivePart === "list" && "invisible"
+      ]
+    }), /* @__PURE__ */ React14.createElement("span", {
+      className: tabsActivePart !== "list" ? "group-hover/title:underline @md:group-hover/title:no-underline underline-offset-4 decoration-1" : ""
+    }, toLocalizedString3(name, t))), /* @__PURE__ */ React14.createElement(Dialog2.Close, {
+      asChild: true
+    }, /* @__PURE__ */ React14.createElement(Button4, {
+      density: "fine",
+      variant: "ghost",
+      autoFocus: true
+    }, /* @__PURE__ */ React14.createElement(Icon, {
+      icon: "ph--x--regular",
+      size: 3
+    })))), /* @__PURE__ */ React14.createElement(Tabs.Root, {
+      orientation: "vertical",
+      value: selected,
+      onValueChange: setSelected,
+      activePart: tabsActivePart,
+      onActivePartChange: setTabsActivePart,
+      classNames: "flex flex-col flex-1 mbs-2"
+    }, /* @__PURE__ */ React14.createElement(Tabs.Viewport, {
+      classNames: "flex-1 min-bs-0"
+    }, /* @__PURE__ */ React14.createElement("div", {
+      role: "none",
+      className: "overflow-y-auto pli-3 @md:pis-2 @md:pie-0 mbe-4 border-r border-separator"
+    }, /* @__PURE__ */ React14.createElement(Tabs.Tablist, {
+      classNames: "flex flex-col max-bs-none min-is-[200px] gap-4 overflow-y-auto"
+    }, /* @__PURE__ */ React14.createElement("div", {
+      role: "none",
+      className: "flex flex-col ml-1"
+    }, /* @__PURE__ */ React14.createElement(Tabs.Tab, {
+      value: "settings"
+    }, t("settings tab label")), /* @__PURE__ */ React14.createElement(Tabs.Tab, {
+      value: "members",
+      disabled: locked
+    }, t("members tab label"))))), /* @__PURE__ */ React14.createElement(Tabs.Tabpanel, {
+      value: "settings",
+      classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
+    }, /* @__PURE__ */ React14.createElement(SpaceSettingsPanel, {
+      space
+    })), /* @__PURE__ */ React14.createElement(Tabs.Tabpanel, {
+      value: "members",
+      classNames: "pli-3 @md:pli-5 max-bs-dvh overflow-y-auto"
+    }, /* @__PURE__ */ React14.createElement(ClipboardProvider, null, /* @__PURE__ */ React14.createElement(SpacePanel, {
+      space,
+      hideHeading: true,
+      target,
+      createInvitationUrl
+    }))))))
+  );
 };
 
 // packages/plugins/plugin-space/src/components/SyncStatus/SyncStatus.tsx
 import React16, { useEffect as useEffect6, useState as useState10 } from "react";
 import { StatusBar } from "@dxos/plugin-status-bar";
-import { useClient as useClient6 } from "@dxos/react-client";
-import { Icon as Icon2, Popover as Popover3, useTranslation as useTranslation15 } from "@dxos/react-ui";
+import { useClient as useClient7 } from "@dxos/react-client";
+import { Icon as Icon3, Popover as Popover3, useTranslation as useTranslation15 } from "@dxos/react-ui";
 import { SyntaxHighlighter } from "@dxos/react-ui-syntax-highlighter";
-import { mx as mx7 } from "@dxos/react-ui-theme";
+import { mx as mx5 } from "@dxos/react-ui-theme";
 
 // packages/plugins/plugin-space/src/components/SyncStatus/Space.tsx
 import React15, { useEffect as useEffect4, useState as useState8 } from "react";
-import { Icon } from "@dxos/react-ui";
-import { mx as mx6 } from "@dxos/react-ui-theme";
+import { Icon as Icon2 } from "@dxos/react-ui";
+import { mx as mx4 } from "@dxos/react-ui-theme";
 var SYNC_STALLED_TIMEOUT = 5e3;
 var styles = {
   barBg: "bg-neutral-50 dark:bg-green-900 text-black",
@@ -1459,15 +1423,15 @@ var SpaceRow = ({ spaceId, state: { localDocumentCount, remoteDocumentCount, mis
   const downActive = useActive(localDocumentCount);
   const upActive = useActive(remoteDocumentCount);
   return /* @__PURE__ */ React15.createElement("div", {
-    className: mx6("flex items-center mx-[2px] gap-[2px] cursor-pointer", styles.barHover),
+    className: mx4("flex items-center mx-[2px] gap-[2px] cursor-pointer", styles.barHover),
     title: spaceId,
     onClick: () => {
       void navigator.clipboard.writeText(spaceId);
     }
-  }, /* @__PURE__ */ React15.createElement(Icon, {
+  }, /* @__PURE__ */ React15.createElement(Icon2, {
     icon: "ph--arrow-fat-line-left--regular",
     size: 3,
-    classNames: mx6(downActive && "animate-[pulse_1s_infinite]")
+    classNames: mx4(downActive && "animate-[pulse_1s_infinite]")
   }), /* @__PURE__ */ React15.createElement(Candle, {
     up: {
       count: remoteDocumentCount,
@@ -1478,22 +1442,22 @@ var SpaceRow = ({ spaceId, state: { localDocumentCount, remoteDocumentCount, mis
       total: localDocumentCount + missingOnLocal
     },
     title: spaceId
-  }), /* @__PURE__ */ React15.createElement(Icon, {
+  }), /* @__PURE__ */ React15.createElement(Icon2, {
     icon: "ph--arrow-fat-line-right--regular",
     size: 3,
-    classNames: mx6(upActive && "animate-[pulse_1s_step-start_infinite]")
+    classNames: mx4(upActive && "animate-[pulse_1s_step-start_infinite]")
   }));
 };
 var Candle = ({ classNames, up, down }) => {
   return /* @__PURE__ */ React15.createElement("div", {
-    className: mx6("grid grid-cols-[1fr_2rem_1fr] w-full h-3", classNames)
+    className: mx4("grid grid-cols-[1fr_2rem_1fr] w-full h-3", classNames)
   }, /* @__PURE__ */ React15.createElement(Bar, {
     classNames: "justify-end",
     ...up
   }), /* @__PURE__ */ React15.createElement("div", {
     className: "relative"
   }, /* @__PURE__ */ React15.createElement("div", {
-    className: mx6("absolute inset-0 flex items-center justify-center text-xs", styles.barBg)
+    className: mx4("absolute inset-0 flex items-center justify-center text-xs", styles.barBg)
   }, up.total)), /* @__PURE__ */ React15.createElement(Bar, down));
 };
 var Bar = ({ classNames, count, total }) => {
@@ -1502,9 +1466,9 @@ var Bar = ({ classNames, count, total }) => {
     p = Math.min(p, 95);
   }
   return /* @__PURE__ */ React15.createElement("div", {
-    className: mx6("relative flex w-full", styles.barBg, classNames)
+    className: mx4("relative flex w-full", styles.barBg, classNames)
   }, /* @__PURE__ */ React15.createElement("div", {
-    className: mx6("shrink-0", styles.barFg),
+    className: mx4("shrink-0", styles.barFg),
     style: {
       width: `${p}%`
     }
@@ -1608,7 +1572,7 @@ var getIcon = (status) => {
 import { useEffect as useEffect5, useState as useState9 } from "react";
 import { Context as Context2 } from "@dxos/context";
 import { EdgeService } from "@dxos/protocols";
-import { useClient as useClient5 } from "@dxos/react-client";
+import { useClient as useClient6 } from "@dxos/react-client";
 var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/components/SyncStatus/sync-state.ts";
 var createEmptyEdgeSyncState = () => ({
   missingOnLocal: 0,
@@ -1629,7 +1593,7 @@ var getSyncSummary = (syncMap) => {
 };
 var isEdgePeerId = (peerId, spaceId) => peerId.startsWith(`${EdgeService.AUTOMERGE_REPLICATOR}:${spaceId}`);
 var useSyncState = () => {
-  const client = useClient5();
+  const client = useClient6();
   const [spaceState, setSpaceState] = useState9({});
   useEffect5(() => {
     const ctx = new Context2(void 0, {
@@ -1667,7 +1631,7 @@ var useSyncState = () => {
 
 // packages/plugins/plugin-space/src/components/SyncStatus/SyncStatus.tsx
 var SyncStatus = () => {
-  const client = useClient6();
+  const client = useClient7();
   const state = useSyncState();
   const [saved, setSaved] = useState10(true);
   useEffect6(() => {
@@ -1708,7 +1672,7 @@ var SyncStatusIndicator = ({ state, saved }) => {
     needsToDownload
   ]);
   const title = t(`${status} label`);
-  const icon = /* @__PURE__ */ React16.createElement(Icon2, {
+  const icon = /* @__PURE__ */ React16.createElement(Icon3, {
     icon: getIcon(status),
     size: 4,
     classNames
@@ -1735,7 +1699,7 @@ var SyncStatusDetail = ({ classNames, state, summary, debug }) => {
   const { t } = useTranslation15(SPACE_PLUGIN);
   const entries = Object.entries(state).sort(([a], [b]) => a < b ? -1 : a > b ? 1 : 0);
   return /* @__PURE__ */ React16.createElement("div", {
-    className: mx7("flex flex-col gap-3 p-2 text-xs min-w-[16rem]", classNames)
+    className: mx5("flex flex-col gap-3 p-2 text-xs min-w-[16rem]", classNames)
   }, /* @__PURE__ */ React16.createElement("h1", null, t("sync status title")), /* @__PURE__ */ React16.createElement("div", {
     className: "flex flex-col gap-2"
   }, entries.map(([spaceId, state2]) => /* @__PURE__ */ React16.createElement(SpaceRow, {
@@ -1791,6 +1755,7 @@ var translations_default = [
         "delete object label": "Delete item",
         "collection deleted label": "Collection deleted",
         "object deleted label": "Item deleted",
+        "objects deleted label": "Items deleted",
         "go to object label": "Open item",
         "found object label": "Ready.",
         "found object description": "The requested object is now available.",
@@ -1840,7 +1805,10 @@ var translations_default = [
         "uploading label": "Replicating to peers",
         "offline persisted label": "Saved to disk (offline)",
         "remote synced label": "Synced with peers",
-        "open settings panel label": "Show Settings"
+        "open settings panel label": "Show Settings",
+        "open space settings label": "Space Settings",
+        "members tab label": "Members",
+        "settings tab label": "Settings"
       }
     }
   }
@@ -1849,10 +1817,11 @@ var translations_default = [
 // packages/plugins/plugin-space/src/SpacePlugin.tsx
 var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/plugins/plugin-space/src/SpacePlugin.tsx";
 var ACTIVE_NODE_BROADCAST_INTERVAL = 3e4;
+var WAIT_FOR_OBJECT_TIMEOUT2 = 1e3;
 var SPACE_MAX_OBJECTS = 500;
 var DIRECTORY_TYPE = "text/directory";
 var parseSpacePlugin = (plugin) => Array.isArray(plugin?.provides.space?.enabled) ? plugin : void 0;
-var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
+var SpacePlugin = ({ invitationUrl = window.location.origin, invitationParam = "spaceInvitationCode", firstRun, onFirstRun } = {}) => {
   const settings = new LocalStorageStore(SPACE_PLUGIN, {
     onSpaceCreate: "dxos.org/plugin/markdown/action/create"
   });
@@ -1862,7 +1831,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
     viewersByObject: {},
     // TODO(wittjosiah): Stop using (Complex)Map inside reactive object.
     viewersByIdentity: new ComplexMap2(PublicKey2.hash),
-    sdkMigrationRunning: {}
+    sdkMigrationRunning: {},
+    navigableCollections: false
   });
   const subscriptions = new EventSubscriptions();
   const spaceSubscriptions = new EventSubscriptions();
@@ -1873,6 +1843,11 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
   let layoutPlugin;
   let navigationPlugin;
   let attentionPlugin;
+  const createSpaceInvitationUrl = (invitationCode) => {
+    const baseUrl = new URL(invitationUrl);
+    baseUrl.searchParams.set(invitationParam, invitationCode);
+    return baseUrl.toString();
+  };
   const onSpaceReady = async () => {
     if (!clientPlugin || !intentPlugin || !graphPlugin || !navigationPlugin || !layoutPlugin || !attentionPlugin) {
       return;
@@ -1905,20 +1880,26 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
       }
       const node = graph.findNode(soloPart.id);
       if (!node && soloPart.id.length === FQ_ID_LENGTH) {
-        void dispatch({
-          plugin: SPACE_PLUGIN,
-          action: SpaceAction.WAIT_FOR_OBJECT,
-          data: {
-            id: soloPart.id
+        const timeout = setTimeout(async () => {
+          const node2 = graph.findNode(soloPart.id);
+          if (!node2) {
+            await dispatch({
+              plugin: SPACE_PLUGIN,
+              action: SpaceAction.WAIT_FOR_OBJECT,
+              data: {
+                id: soloPart.id
+              }
+            });
           }
-        });
+        }, WAIT_FOR_OBJECT_TIMEOUT2);
+        return () => clearTimeout(timeout);
       }
     }));
     subscriptions.add(client.spaces.subscribe(async (spaces) => {
-      if (defaultSpace.state.get() === SpaceState3.SPACE_REQUIRES_MIGRATION) {
+      if (defaultSpace.state.get() === SpaceState2.SPACE_REQUIRES_MIGRATION) {
         await defaultSpace.internal.migrate();
       }
-      spaces.filter((space) => space.state.get() === SpaceState3.SPACE_READY).forEach((space) => {
+      spaces.filter((space) => space.state.get() === SpaceState2.SPACE_READY).forEach((space) => {
         subscriptions.add(scheduledEffect(() => ({
           name: space.properties.name
         }), ({ name }) => state.values.spaceNames[space.id] = name));
@@ -1961,7 +1942,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 err: err.message
               }, {
                 F: __dxlog_file6,
-                L: 257,
+                L: 292,
                 S: void 0,
                 C: (f, a) => f(...a)
               });
@@ -2019,6 +2000,9 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
         key: "spaceNames",
         type: LocalStorageStore.json()
       });
+      if (findPlugin(plugins, "dxos.org/plugin/stack")) {
+        state.values.navigableCollections = true;
+      }
       graphPlugin = resolvePlugin(plugins, parseGraphPlugin);
       layoutPlugin = resolvePlugin(plugins, parseLayoutPlugin);
       navigationPlugin = resolvePlugin(plugins, parseNavigationPlugin2);
@@ -2114,7 +2098,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
         component: ({ data, role, ...rest }) => {
           switch (role) {
             case "article":
-              return isSpace2(data.object) && data.object.state.get() === SpaceState3.SPACE_READY ? /* @__PURE__ */ React17.createElement(Surface2, {
+              return isSpace2(data.object) && data.object.state.get() === SpaceState2.SPACE_READY ? /* @__PURE__ */ React17.createElement(Surface, {
                 data: {
                   object: data.object.properties[CollectionType.typename],
                   id: data.object.id
@@ -2137,11 +2121,13 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 disposition: "fallback"
               } : null;
             case "dialog":
-              if (data.component === "dxos.org/plugin/space/InvitationManagerDialog") {
-                return /* @__PURE__ */ React17.createElement(Dialog.Content, null, /* @__PURE__ */ React17.createElement(ClipboardProvider2, null, /* @__PURE__ */ React17.createElement(InvitationManager, {
-                  active: true,
-                  ...data.subject
-                })));
+              if (data.component === "dxos.org/plugin/space/SpaceSettingsDialog") {
+                return /* @__PURE__ */ React17.createElement(SpaceSettingsDialog, {
+                  ...data.subject,
+                  createInvitationUrl: createSpaceInvitationUrl
+                });
+              } else if (data.component === "dxos.org/plugin/space/JoinDialog") {
+                return /* @__PURE__ */ React17.createElement(JoinDialog, data.subject);
               }
               return null;
             case "popover": {
@@ -2175,12 +2161,12 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 return null;
               }
               const space = isSpace2(data.object) ? data.object : getSpace4(data.object);
-              const object = isSpace2(data.object) ? data.object.state.get() === SpaceState3.SPACE_READY ? space?.properties[CollectionType.typename] : void 0 : data.object;
+              const object = isSpace2(data.object) ? data.object.state.get() === SpaceState2.SPACE_READY ? space?.properties[CollectionType.typename] : void 0 : data.object;
               return space && object ? {
                 node: /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(SpacePresence, {
                   object
                 }), space.properties[COMPOSER_SPACE_LOCK] ? null : /* @__PURE__ */ React17.createElement(ShareSpaceButton, {
-                  spaceId: space.id
+                  space
                 })),
                 disposition: "hoist"
               } : null;
@@ -2190,7 +2176,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 collection: data.object
               }) : null;
             case "settings":
-              return data.plugin === meta_default.id ? /* @__PURE__ */ React17.createElement(SpaceSettings, {
+              return data.plugin === meta_default.id ? /* @__PURE__ */ React17.createElement(SpacePluginSettings, {
                 settings: settings.values
               }) : null;
             case "menu-footer":
@@ -2235,7 +2221,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                     }
                   });
                   return () => defaultSpaceUnsubscribe?.();
-                }, () => client.spaces.isReady.get() && client.spaces.default.state.get() === SpaceState3.SPACE_READY);
+                }, () => client.spaces.isReady.get() && client.spaces.default.state.get() === SpaceState2.SPACE_READY);
                 if (!isReady) {
                   return [];
                 }
@@ -2252,6 +2238,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                       ],
                       testId: "spacePlugin.spaces",
                       role: "branch",
+                      disabled: true,
                       childrenPersistenceClass: "echo",
                       onRearrangeChildren: async (nextOrder) => {
                         graph._sortEdges(SPACES, "outbound", nextOrder.map(({ id }) => id));
@@ -2263,7 +2250,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                         } else {
                           log3.warn("spaces order object not found", void 0, {
                             F: __dxlog_file6,
-                            L: 553,
+                            L: 596,
                             S: void 0,
                             C: (f, a) => f(...a)
                           });
@@ -2282,15 +2269,10 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 {
                   id: SpaceAction.CREATE,
                   data: async () => {
-                    await dispatch([
-                      {
-                        plugin: SPACE_PLUGIN,
-                        action: SpaceAction.CREATE
-                      },
-                      {
-                        action: NavigationAction3.OPEN
-                      }
-                    ]);
+                    await dispatch({
+                      plugin: SPACE_PLUGIN,
+                      action: SpaceAction.CREATE
+                    });
                   },
                   properties: {
                     label: [
@@ -2302,21 +2284,16 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                     icon: "ph--plus--regular",
                     disposition: "item",
                     testId: "spacePlugin.createSpace",
-                    className: "pbs-4"
+                    className: "border-t border-separator"
                   }
                 },
                 {
                   id: SpaceAction.JOIN,
                   data: async () => {
-                    await dispatch([
-                      {
-                        plugin: SPACE_PLUGIN,
-                        action: SpaceAction.JOIN
-                      },
-                      {
-                        action: NavigationAction3.OPEN
-                      }
-                    ]);
+                    await dispatch({
+                      plugin: SPACE_PLUGIN,
+                      action: SpaceAction.JOIN
+                    });
                   },
                   properties: {
                     label: [
@@ -2327,8 +2304,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                     ],
                     icon: "ph--sign-in--regular",
                     disposition: "item",
-                    testId: "spacePlugin.joinSpace",
-                    className: "pbe-4"
+                    testId: "spacePlugin.joinSpace"
                   }
                 }
               ],
@@ -2338,23 +2314,27 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 if (!spaces || !isReady) {
                   return;
                 }
-                const [spacesOrder] = memoizeQuery(client.spaces.default, Filter.schema(Expando, {
-                  key: SHARED
-                }));
-                const order = spacesOrder?.order ?? [];
-                const orderMap = new Map(order.map((id, index) => [
-                  id,
-                  index
-                ]));
-                return [
-                  ...spaces.filter((space) => orderMap.has(space.id)).sort((a, b) => orderMap.get(a.id) - orderMap.get(b.id)),
-                  ...spaces.filter((space) => !orderMap.has(space.id))
-                ].filter((space) => settings.values.showHidden ? true : space.state.get() !== SpaceState3.SPACE_INACTIVE).map((space) => constructSpaceNode({
-                  space,
-                  personal: space === client.spaces.default,
-                  namesCache: state.values.spaceNames,
-                  resolve
-                }));
+                try {
+                  const [spacesOrder] = memoizeQuery(client.spaces.default, Filter.schema(Expando, {
+                    key: SHARED
+                  }));
+                  const order = spacesOrder?.order ?? [];
+                  const orderMap = new Map(order.map((id, index) => [
+                    id,
+                    index
+                  ]));
+                  return [
+                    ...spaces.filter((space) => orderMap.has(space.id)).sort((a, b) => orderMap.get(a.id) - orderMap.get(b.id)),
+                    ...spaces.filter((space) => !orderMap.has(space.id))
+                  ].filter((space) => settings.values.showHidden ? true : space.state.get() !== SpaceState2.SPACE_INACTIVE).map((space) => constructSpaceNode({
+                    space,
+                    navigable: state.values.navigableCollections,
+                    personal: space === client.spaces.default,
+                    namesCache: state.values.spaceNames,
+                    resolve
+                  }));
+                } catch {
+                }
               }
             }),
             // Find an object by its fully qualified id.
@@ -2366,8 +2346,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 if (!space) {
                   return;
                 }
-                const state2 = toSignal((onChange) => space.state.subscribe(() => onChange()).unsubscribe, () => space.state.get(), space.id);
-                if (state2 !== SpaceState3.SPACE_READY) {
+                const spaceState = toSignal((onChange) => space.state.subscribe(() => onChange()).unsubscribe, () => space.state.get(), space.id);
+                if (spaceState !== SpaceState2.SPACE_READY) {
                   return;
                 }
                 const store = memoize2(() => signal(space.db.getObjectById(objectId)), id);
@@ -2383,7 +2363,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 return createObjectNode({
                   object,
                   space,
-                  resolve
+                  resolve,
+                  navigable: state.values.navigableCollections
                 });
               }
             }),
@@ -2393,7 +2374,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
               filter: (node) => isSpace2(node.data),
               actionGroups: ({ node }) => constructSpaceActionGroups({
                 space: node.data,
-                dispatch
+                dispatch,
+                navigable: state.values.navigableCollections
               }),
               actions: ({ node }) => {
                 const space = node.data;
@@ -2411,8 +2393,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
               filter: (node) => isSpace2(node.data),
               connector: ({ node }) => {
                 const space = node.data;
-                const state2 = toSignal((onChange) => space.state.subscribe(() => onChange()).unsubscribe, () => space.state.get(), space.id);
-                if (state2 !== SpaceState3.SPACE_READY) {
+                const spaceState = toSignal((onChange) => space.state.subscribe(() => onChange()).unsubscribe, () => space.state.get(), space.id);
+                if (spaceState !== SpaceState2.SPACE_READY) {
                   return;
                 }
                 const collection = space.properties[CollectionType.typename];
@@ -2422,7 +2404,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 return collection.objects.filter(nonNullable).map((object) => createObjectNode({
                   object,
                   space,
-                  resolve
+                  resolve,
+                  navigable: state.values.navigableCollections
                 })).filter(nonNullable);
               }
             }),
@@ -2432,7 +2415,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
               filter: (node) => isEchoObject2(node.data),
               actionGroups: ({ node }) => constructObjectActionGroups({
                 object: node.data,
-                dispatch
+                dispatch,
+                navigable: state.values.navigableCollections
               }),
               actions: ({ node }) => constructObjectActions({
                 node,
@@ -2452,7 +2436,8 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 return collection.objects.filter(nonNullable).map((object) => createObjectNode({
                   object,
                   space,
-                  resolve
+                  resolve,
+                  navigable: state.values.navigableCollections
                 })).filter(nonNullable);
               }
             }),
@@ -2643,13 +2628,16 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                         }
                       },
                       {
-                        action: NavigationAction3.EXPOSE
+                        action: NavigationAction4.OPEN
+                      },
+                      {
+                        action: NavigationAction4.EXPOSE
                       }
                     ]
                   ] : [],
                   [
                     {
-                      action: ObservabilityAction.SEND_EVENT,
+                      action: ObservabilityAction2.SEND_EVENT,
                       data: {
                         name: "space.create",
                         properties: {
@@ -2662,77 +2650,58 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
               };
             }
             case SpaceAction.JOIN: {
-              if (client) {
-                const { space } = await client.shell.joinSpace({
-                  invitationCode: intent.data?.invitationCode
-                });
-                if (space) {
-                  return {
-                    data: {
-                      space,
-                      id: space.id,
-                      activeParts: {
-                        main: [
-                          space.id
-                        ]
-                      }
-                    },
-                    intents: [
-                      [
-                        {
-                          action: LayoutAction2.SET_LAYOUT,
-                          data: {
-                            element: "toast",
-                            subject: {
-                              id: `${SPACE_PLUGIN}/join-success`,
-                              duration: 1e4,
-                              title: translations_default[0]["en-US"][SPACE_PLUGIN]["join success label"],
-                              closeLabel: translations_default[0]["en-US"][SPACE_PLUGIN]["dismiss label"]
-                            }
-                          }
-                        }
-                      ],
-                      [
-                        {
-                          action: ObservabilityAction.SEND_EVENT,
-                          data: {
-                            name: "space.join",
-                            properties: {
-                              spaceId: space.id
-                            }
-                          }
+              return {
+                data: true,
+                intents: [
+                  [
+                    {
+                      action: LayoutAction2.SET_LAYOUT,
+                      data: {
+                        element: "dialog",
+                        component: "dxos.org/plugin/space/JoinDialog",
+                        dialogBlockAlign: "start",
+                        subject: {
+                          initialInvitationCode: intent.data?.invitationCode
                         }
-                      ]
-                    ]
-                  };
-                }
-              }
+                      }
+                    }
+                  ]
+                ]
+              };
               break;
             }
             case SpaceAction.SHARE: {
-              const spaceId = intent.data?.spaceId;
-              if (clientPlugin2 && typeof spaceId === "string") {
-                if (!navigationPlugin?.provides.location.active) {
-                  return;
-                }
-                const target = firstIdInPart(navigationPlugin?.provides.location.active, "main");
-                const result = await clientPlugin2.provides.client.shell.shareSpace({
-                  spaceId,
-                  target
-                });
+              const space = intent.data?.space;
+              if (isSpace2(space) && !space.properties[COMPOSER_SPACE_LOCK]) {
+                const active = navigationPlugin?.provides.location.active;
+                const mode = layoutPlugin?.provides.layout.layoutMode;
+                const target = active ? firstIdInPart(active, mode === "solo" ? "solo" : "main") : void 0;
                 return {
-                  data: result,
+                  data: true,
                   intents: [
                     [
                       {
-                        action: ObservabilityAction.SEND_EVENT,
+                        action: LayoutAction2.SET_LAYOUT,
+                        data: {
+                          element: "dialog",
+                          component: "dxos.org/plugin/space/SpaceSettingsDialog",
+                          dialogBlockAlign: "start",
+                          subject: {
+                            space,
+                            target,
+                            initialTab: "members",
+                            createInvitationUrl: createSpaceInvitationUrl
+                          }
+                        }
+                      }
+                    ],
+                    [
+                      {
+                        action: ObservabilityAction2.SEND_EVENT,
                         data: {
                           name: "space.share",
                           properties: {
-                            spaceId,
-                            members: result.members?.length,
-                            error: result.error?.message,
-                            cancelled: result.cancelled
+                            space: space.id
                           }
                         }
                       }
@@ -2751,7 +2720,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                   intents: [
                     [
                       {
-                        action: ObservabilityAction.SEND_EVENT,
+                        action: ObservabilityAction2.SEND_EVENT,
                         data: {
                           name: "space.lock",
                           properties: {
@@ -2774,7 +2743,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                   intents: [
                     [
                       {
-                        action: ObservabilityAction.SEND_EVENT,
+                        action: ObservabilityAction2.SEND_EVENT,
                         data: {
                           name: "space.unlock",
                           properties: {
@@ -2809,6 +2778,32 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
               }
               break;
             }
+            case SpaceAction.OPEN_SETTINGS: {
+              const space = intent.data?.space;
+              if (isSpace2(space)) {
+                return {
+                  data: true,
+                  intents: [
+                    [
+                      {
+                        action: LayoutAction2.SET_LAYOUT,
+                        data: {
+                          element: "dialog",
+                          component: "dxos.org/plugin/space/SpaceSettingsDialog",
+                          dialogBlockAlign: "start",
+                          subject: {
+                            space,
+                            initialTab: "settings",
+                            createInvitationUrl: createSpaceInvitationUrl
+                          }
+                        }
+                      }
+                    ]
+                  ]
+                };
+              }
+              break;
+            }
             case SpaceAction.OPEN: {
               const space = intent.data?.space;
               if (isSpace2(space)) {
@@ -2832,7 +2827,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
             case SpaceAction.MIGRATE: {
               const space = intent.data?.space;
               if (isSpace2(space)) {
-                if (space.state.get() === SpaceState3.SPACE_REQUIRES_MIGRATION) {
+                if (space.state.get() === SpaceState2.SPACE_REQUIRES_MIGRATION) {
                   state.values.sdkMigrationRunning[space.id] = true;
                   await space.internal.migrate();
                   state.values.sdkMigrationRunning[space.id] = false;
@@ -2843,7 +2838,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                   intents: [
                     [
                       {
-                        action: ObservabilityAction.SEND_EVENT,
+                        action: ObservabilityAction2.SEND_EVENT,
                         data: {
                           name: "space.migrate",
                           properties: {
@@ -2893,7 +2888,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                     ],
                     [
                       {
-                        action: ObservabilityAction.SEND_EVENT,
+                        action: ObservabilityAction2.SEND_EVENT,
                         data: {
                           name: "space.limit",
                           properties: {
@@ -2934,7 +2929,7 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 intents: [
                   [
                     {
-                      action: ObservabilityAction.SEND_EVENT,
+                      action: ObservabilityAction2.SEND_EVENT,
                       data: {
                         name: "space.object.add",
                         properties: {
@@ -2948,10 +2943,19 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                 ]
               };
             }
-            case SpaceAction.REMOVE_OBJECT: {
-              const object = intent.data?.object ?? intent.data?.result;
-              const space = getSpace4(object);
-              if (!(isEchoObject2(object) && space)) {
+            case SpaceAction.REMOVE_OBJECTS: {
+              const objects = intent.data?.objects ?? intent.data?.result;
+              invariant2(Array.isArray(objects), void 0, {
+                F: __dxlog_file6,
+                L: 1291,
+                S: void 0,
+                A: [
+                  "Array.isArray(objects)",
+                  ""
+                ]
+              });
+              const space = getSpace4(objects[0]);
+              if (!space || !objects.every((obj) => isEchoObject2(obj) && getSpace4(obj) === space)) {
                 return;
               }
               const resolve = resolvePlugin(plugins, parseMetadataResolverPlugin)?.provides.metadata.resolver;
@@ -2959,20 +2963,20 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
               const openObjectIds = new Set(openIds(activeParts ?? {}));
               if (!intent.undo && resolve) {
                 const parentCollection = intent.data?.collection ?? space.properties[CollectionType.typename];
-                const nestedObjects = await getNestedObjects(object, resolve);
+                const nestedObjectsList = await Promise.all(objects.map((obj) => getNestedObjects(obj, resolve)));
                 const deletionData = {
-                  object,
+                  objects,
                   parentCollection,
-                  index: parentCollection instanceof CollectionType ? parentCollection.objects.indexOf(object) : -1,
-                  nestedObjects,
-                  wasActive: [
-                    object,
-                    ...nestedObjects
-                  ].map((obj) => fullyQualifiedId4(obj)).filter((id) => openObjectIds.has(id))
+                  indices: objects.map((obj) => parentCollection instanceof CollectionType ? parentCollection.objects.indexOf(obj) : -1),
+                  nestedObjectsList,
+                  wasActive: objects.flatMap((obj, i) => [
+                    obj,
+                    ...nestedObjectsList[i]
+                  ]).map((obj) => fullyQualifiedId4(obj)).filter((id) => openObjectIds.has(id))
                 };
                 if (deletionData.wasActive.length > 0) {
                   await intentPlugin?.provides.intent.dispatch({
-                    action: NavigationAction3.CLOSE,
+                    action: NavigationAction4.CLOSE,
                     data: {
                       activeParts: {
                         main: deletionData.wasActive,
@@ -2981,38 +2985,43 @@ var SpacePlugin = ({ firstRun, onFirstRun } = {}) => {
                     }
                   });
                 }
-                if (parentCollection instanceof CollectionType) {
-                  const index = parentCollection.objects.indexOf(object);
-                  if (index !== -1) {
-                    parentCollection.objects.splice(index, 1);
-                  }
+                if (deletionData.parentCollection instanceof CollectionType) {
+                  [
+                    ...deletionData.indices
+                  ].sort((a, b) => b - a).forEach((index) => {
+                    if (index !== -1) {
+                      deletionData.parentCollection.objects.splice(index, 1);
+                    }
+                  });
                 }
-                deletionData.nestedObjects.forEach((obj) => {
+                deletionData.nestedObjectsList.flat().forEach((obj) => {
                   space.db.remove(obj);
                 });
-                space.db.remove(object);
-                const undoMessageKey = object instanceof CollectionType ? "collection deleted label" : "object deleted label";
+                objects.forEach((obj) => space.db.remove(obj));
+                const undoMessageKey = objects.some((obj) => obj instanceof CollectionType) ? "collection deleted label" : objects.length > 1 ? "objects deleted label" : "object deleted label";
                 return {
                   data: true,
                   undoable: {
-                    // Consider using a translation key here.
+                    // TODO(ZaymonFC): Pluralize if more than one object.
                     message: translations_default[0]["en-US"][SPACE_PLUGIN][undoMessageKey],
                     data: deletionData
                   }
                 };
               } else {
                 const undoData = intent.data;
-                if (undoData && isEchoObject2(undoData.object) && undoData.parentCollection instanceof CollectionType) {
-                  const restoredObject = space.db.add(undoData.object);
-                  undoData.nestedObjects.forEach((obj) => {
+                if (undoData?.objects?.length && undoData.objects.every(isEchoObject2) && undoData.parentCollection instanceof CollectionType) {
+                  const restoredObjects = undoData.objects.map((obj) => space.db.add(obj));
+                  undoData.nestedObjectsList.flat().forEach((obj) => {
                     space.db.add(obj);
                   });
-                  if (undoData.index !== -1) {
-                    undoData.parentCollection.objects.splice(undoData.index, 0, restoredObject);
-                  }
+                  undoData.indices.forEach((index, i) => {
+                    if (index !== -1) {
+                      undoData.parentCollection.objects.splice(index, 0, restoredObjects[i]);
+                    }
+                  });
                   if (undoData.wasActive.length > 0) {
                     await intentPlugin?.provides.intent.dispatch({
-                      action: NavigationAction3.OPEN,
+                      action: NavigationAction4.OPEN,
                       data: {
                         activeParts: {
                           main: undoData.wasActive
@@ -3099,6 +3108,7 @@ export {
   ContactType,
   DefaultObjectSettings,
   FullPresence,
+  JoinDialog,
   MenuFooter,
   MessageState,
   MessageType,
@@ -3116,10 +3126,10 @@ export {
   SmallPresence,
   SmallPresenceLive,
   SpaceAction,
-  SpaceMain,
   SpacePlugin,
+  SpacePluginSettings,
   SpacePresence,
-  SpaceSettings,
+  SpaceSettingsDialog,
   SpaceSettingsPanel,
   SyncStatus,
   SyncStatusDetail,