@dxos/plugin-space 0.10.0 → 0.11.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-space",
-  "version": "0.10.0",
+  "version": "0.11.1",
   "description": "DXOS Surface plugin for DXOS ECHO Spaces",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -19,38 +19,38 @@
         "default": "./src/capabilities/index.ts"
       },
       "types": "./dist/types/src/capabilities/index.d.ts",
-      "node": "./dist/lib/neutral/capabilities/node.mjs",
-      "default": "./dist/lib/neutral/capabilities/index.mjs"
+      "node": "./dist/lib/capabilities/node.mjs",
+      "default": "./dist/lib/capabilities.mjs"
     },
     "#capabilities/node": {
       "source": "./src/capabilities/node.ts",
       "types": "./dist/types/src/capabilities/node.d.ts",
-      "default": "./dist/lib/neutral/capabilities/node.mjs"
+      "default": "./dist/lib/capabilities/node.mjs"
     },
     "#components": {
       "source": "./src/components/index.ts",
       "types": "./dist/types/src/components/index.d.ts",
-      "default": "./dist/lib/neutral/components/index.mjs"
+      "default": "./dist/lib/components.mjs"
     },
     "#containers": {
       "source": "./src/containers/index.ts",
       "types": "./dist/types/src/containers/index.d.ts",
-      "default": "./dist/lib/neutral/containers/index.mjs"
+      "default": "./dist/lib/containers.mjs"
     },
     "#hooks": {
       "source": "./src/hooks/index.ts",
       "types": "./dist/types/src/hooks/index.d.ts",
-      "default": "./dist/lib/neutral/hooks/index.mjs"
+      "default": "./dist/lib/hooks.mjs"
     },
     "#meta": {
       "source": "./src/meta.ts",
       "types": "./dist/types/src/meta.d.ts",
-      "default": "./dist/lib/neutral/meta.mjs"
+      "default": "./dist/lib/meta.mjs"
     },
     "#operations": {
       "source": "./src/operations/index.ts",
       "types": "./dist/types/src/operations/index.d.ts",
-      "default": "./dist/lib/neutral/operations/index.mjs"
+      "default": "./dist/lib/operations.mjs"
     },
     "#plugin": {
       "source": {
@@ -59,57 +59,62 @@
         "default": "./src/SpacePlugin.ts"
       },
       "types": "./dist/types/src/SpacePlugin.d.ts",
-      "workerd": "./dist/lib/neutral/SpacePlugin.workerd.mjs",
-      "node": "./dist/lib/neutral/SpacePlugin.node.mjs",
-      "default": "./dist/lib/neutral/SpacePlugin.mjs"
+      "workerd": "./dist/lib/SpacePlugin.workerd.mjs",
+      "node": "./dist/lib/SpacePlugin.node.mjs",
+      "default": "./dist/lib/SpacePlugin.mjs"
     },
     "#translations": {
       "source": "./src/translations.ts",
       "types": "./dist/types/src/translations.d.ts",
-      "default": "./dist/lib/neutral/translations.mjs"
+      "default": "./dist/lib/translations.mjs"
     },
     "#types": {
       "source": "./src/types/index.ts",
       "types": "./dist/types/src/types/index.d.ts",
-      "default": "./dist/lib/neutral/types/index.mjs"
+      "default": "./dist/lib/types.mjs"
     }
   },
   "exports": {
     ".": {
       "source": "./src/index.ts",
       "types": "./dist/types/src/index.d.ts",
-      "default": "./dist/lib/neutral/index.mjs"
+      "import": "./dist/lib/index.mjs"
     },
     "./assets/PLUGIN.mdl": "./PLUGIN.mdl",
     "./plugin": {
       "source": "./src/plugin.ts",
       "types": "./dist/types/src/plugin.d.ts",
-      "default": "./dist/lib/neutral/plugin.mjs"
+      "import": "./dist/lib/plugin.mjs"
     },
     "./components": {
       "source": "./src/components/index.ts",
       "types": "./dist/types/src/components/index.d.ts",
-      "default": "./dist/lib/neutral/components/index.mjs"
+      "import": "./dist/lib/components.mjs"
+    },
+    "./containers": {
+      "source": "./src/containers/index.ts",
+      "types": "./dist/types/src/containers/index.d.ts",
+      "import": "./dist/lib/containers.mjs"
     },
     "./constants": {
       "source": "./src/constants.ts",
       "types": "./dist/types/src/constants.d.ts",
-      "default": "./dist/lib/neutral/constants.mjs"
+      "import": "./dist/lib/constants.mjs"
     },
     "./testing": {
       "source": "./src/testing.ts",
       "types": "./dist/types/src/testing.d.ts",
-      "default": "./dist/lib/neutral/testing.mjs"
+      "import": "./dist/lib/testing.mjs"
     },
     "./translations": {
       "source": "./src/translations.ts",
       "types": "./dist/types/src/translations.d.ts",
-      "default": "./dist/lib/neutral/translations.mjs"
+      "import": "./dist/lib/translations.mjs"
     },
     "./types": {
       "source": "./src/types/index.ts",
       "types": "./dist/types/src/types/index.d.ts",
-      "default": "./dist/lib/neutral/types/index.mjs"
+      "import": "./dist/lib/types.mjs"
     }
   },
   "types": "dist/types/src/index.d.ts",
@@ -125,66 +130,76 @@
     "@effect/cli": "0.75.2",
     "react-drag-drop-files": "^2.3.8",
     "react-qr-rounded": "^1.0.0",
-    "@dxos/app-framework": "0.10.0",
-    "@dxos/app-toolkit": "0.10.0",
-    "@dxos/cli-util": "0.10.0",
-    "@dxos/client-protocol": "0.10.0",
-    "@dxos/async": "0.10.0",
-    "@dxos/compute": "0.10.0",
-    "@dxos/context": "0.10.0",
-    "@dxos/display-name": "0.10.0",
-    "@dxos/echo": "0.10.0",
-    "@dxos/echo-client": "0.10.0",
-    "@dxos/errors": "0.10.0",
-    "@dxos/effect": "0.10.0",
-    "@dxos/invariant": "0.10.0",
-    "@dxos/log": "0.10.0",
-    "@dxos/migrations": "0.10.0",
-    "@dxos/plugin-attention": "0.10.0",
-    "@dxos/keys": "0.10.0",
-    "@dxos/plugin-client": "0.10.0",
-    "@dxos/plugin-graph": "0.10.0",
-    "@dxos/plugin-status-bar": "0.10.0",
-    "@dxos/plugin-settings": "0.10.0",
-    "@dxos/protocols": "0.10.0",
-    "@dxos/plugin-observability": "0.10.0",
-    "@dxos/react-client": "0.10.0",
-    "@dxos/react-ui": "0.10.0",
-    "@dxos/react-ui-attention": "0.10.0",
-    "@dxos/react-ui-components": "0.10.0",
-    "@dxos/react-ui-form": "0.10.0",
-    "@dxos/react-ui-list": "0.10.0",
-    "@dxos/react-ui-menu": "0.10.0",
-    "@dxos/react-ui-mosaic": "0.10.0",
-    "@dxos/react-ui-pickers": "0.10.0",
-    "@dxos/react-ui-search": "0.10.0",
-    "@dxos/react-ui-masonry": "0.10.0",
-    "@dxos/schema": "0.10.0",
-    "@dxos/shell": "0.10.0",
-    "@dxos/types": "0.10.0",
-    "@dxos/ui-theme": "0.10.0",
-    "@dxos/ui-types": "0.10.0",
-    "@dxos/client": "0.10.0",
-    "@dxos/util": "0.10.0"
+    "@dxos/app-framework": "0.11.1",
+    "@dxos/app-toolkit": "0.11.1",
+    "@dxos/async": "0.11.1",
+    "@dxos/cli-util": "0.11.1",
+    "@dxos/client": "0.11.1",
+    "@dxos/client-protocol": "0.11.1",
+    "@dxos/compute": "0.11.1",
+    "@dxos/context": "0.11.1",
+    "@dxos/display-name": "0.11.1",
+    "@dxos/echo": "0.11.1",
+    "@dxos/echo-client": "0.11.1",
+    "@dxos/echo-react": "0.11.1",
+    "@dxos/effect": "0.11.1",
+    "@dxos/errors": "0.11.1",
+    "@dxos/extractor": "0.11.1",
+    "@dxos/halo": "0.11.1",
+    "@dxos/halo-react": "0.11.1",
+    "@dxos/invariant": "0.11.1",
+    "@dxos/keys": "0.11.1",
+    "@dxos/log": "0.11.1",
+    "@dxos/migrations": "0.11.1",
+    "@dxos/plugin-attention": "0.11.1",
+    "@dxos/plugin-client": "0.11.1",
+    "@dxos/plugin-graph": "0.11.1",
+    "@dxos/plugin-observability": "0.11.1",
+    "@dxos/plugin-settings": "0.11.1",
+    "@dxos/plugin-status-bar": "0.11.1",
+    "@dxos/protocols": "0.11.1",
+    "@dxos/react-client": "0.11.1",
+    "@dxos/react-ui": "0.11.1",
+    "@dxos/react-ui-attention": "0.11.1",
+    "@dxos/react-ui-components": "0.11.1",
+    "@dxos/react-ui-dashboard": "0.11.1",
+    "@dxos/react-ui-dnd": "0.11.1",
+    "@dxos/react-ui-form": "0.11.1",
+    "@dxos/react-ui-list": "0.11.1",
+    "@dxos/react-ui-masonry": "0.11.1",
+    "@dxos/react-ui-menu": "0.11.1",
+    "@dxos/react-ui-mosaic": "0.11.1",
+    "@dxos/react-ui-pickers": "0.11.1",
+    "@dxos/react-ui-search": "0.11.1",
+    "@dxos/react-ui-table": "0.11.1",
+    "@dxos/react-ui-tabs": "0.11.1",
+    "@dxos/schema": "0.11.1",
+    "@dxos/shell": "0.11.1",
+    "@dxos/types": "0.11.1",
+    "@dxos/ui-types": "0.11.1",
+    "@dxos/util": "0.11.1",
+    "@dxos/ui-theme": "0.11.1"
   },
   "devDependencies": {
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "1.1.0",
     "@babel/core": "^7.18.13",
     "@effect-atom/atom-react": "^0.5.0",
     "@effect/platform": "0.96.2",
+    "@effect/platform-node": "0.107.0",
     "@types/react": "~19.2.17",
     "@types/react-dom": "~19.2.3",
     "effect": "3.21.4",
     "react": "~19.2.7",
     "react-dom": "~19.2.7",
-    "vite": "^8.0.16",
-    "@dxos/lit-ui": "0.10.0",
-    "@dxos/plugin-preview": "0.10.0",
-    "@dxos/plugin-testing": "0.10.0",
-    "@dxos/random": "0.10.0",
-    "@dxos/react-ui": "0.10.0",
-    "@dxos/storybook-utils": "0.10.0",
-    "@dxos/ui-theme": "0.10.0"
+    "vite": "^8.1.4",
+    "@dxos/lit-ui": "0.11.1",
+    "@dxos/plugin-preview": "0.11.1",
+    "@dxos/plugin-testing": "0.11.1",
+    "@dxos/random": "0.11.1",
+    "@dxos/react-ui": "0.11.1",
+    "@dxos/storybook-utils": "0.11.1",
+    "@dxos/ui-theme": "0.11.1",
+    "@dxos/extractor-lib": "0.11.1"
   },
   "peerDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
@@ -192,8 +207,8 @@
     "effect": "3.21.4",
     "react": "~19.2.7",
     "react-dom": "~19.2.7",
-    "@dxos/react-ui": "0.10.0",
-    "@dxos/ui-theme": "0.10.0"
+    "@dxos/react-ui": "^0.11.1",
+    "@dxos/ui-theme": "^0.11.1"
   },
   "publishConfig": {
     "access": "public"

package/src/SpacePlugin.ts

@@ -21,8 +21,8 @@ import {
   Organization,
   Person,
   Pipeline,
-  Project,
   Task,
+  TaskSet,
 } from '@dxos/types';
 
 import {
@@ -30,7 +30,7 @@ import {
   CreateObject,
   IdentityCreated,
   NavigationHandler,
-  NavigationResolver,
+  NavigationTargetResolver,
   OperationHandler,
   ReactRoot,
   ReactSurface,
@@ -50,10 +50,9 @@ import pluginSpec from '../PLUGIN.mdl?raw';
 
 export const SpacePlugin = Plugin.define<SpacePluginOptions>(meta).pipe(
   AppPlugin.addCreateObjectModule({ activate: CreateObject }),
-  AppPlugin.addNavigationHandlerModule(({ invitationProp }) => ({
-    activate: () => NavigationHandler({ invitationProp }),
+  AppPlugin.addNavigationHandlerModule(({ invitationProp, invitationUrlHandler }) => ({
+    activate: () => NavigationHandler({ invitationProp, invitationUrlHandler }),
   })),
-  AppPlugin.addNavigationResolverModule({ activatesOn: ClientEvents.ClientReady, activate: NavigationResolver }),
   AppPlugin.addOperationHandlerModule({ activate: OperationHandler }),
   AppPlugin.addReactRootModule({ activate: ReactRoot }),
   AppPlugin.addSchemaModule({
@@ -68,15 +67,16 @@ export const SpacePlugin = Plugin.define<SpacePluginOptions>(meta).pipe(
       Organization.Organization,
       Person.Person,
       Pipeline.Pipeline,
-      Project.Project,
       Tag.Tag,
       Task.Task,
+      TaskSet.TaskSet,
     ],
   }),
   AppPlugin.addSettingsModule({ activate: SpaceSettings }),
   AppPlugin.addTranslationsModule({
     translations: [...translations, ...componentsTranslations, ...formTranslations, ...shellTranslations],
   }),
+  Plugin.addModule({ activatesOn: ClientEvents.ClientReady, activate: NavigationTargetResolver }),
   Plugin.addModule({
     // TODO(wittjosiah): Does not integrate with settings store.
     //   Should this be a different event?

package/src/SpacePlugin.workerd.ts

@@ -19,9 +19,11 @@ import {
   Task,
 } from '@dxos/types';
 
-import { OperationHandler } from '#capabilities';
 import { meta } from '#meta';
 
+// Direct module import: the `#capabilities` barrel pulls the React surface into worker bundles.
+import OperationHandler from './capabilities/operation-handler';
+
 export const SpacePlugin = Plugin.define(meta).pipe(
   AppPlugin.addOperationHandlerModule({ activate: OperationHandler }),
   AppPlugin.addSchemaModule({

package/src/capabilities/SpaceFormFields.tsx

@@ -0,0 +1,72 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+// Form-input surfaces. Each consumes the whole surface envelope — the form renderer's own props ride
+// alongside `data` — so they are registered without a `props` mapper.
+
+import React, { useCallback } from 'react';
+
+import { type Surface } from '@dxos/app-framework/ui';
+import { type AppSurface, useTypeOptions } from '@dxos/app-toolkit/ui';
+import { Database, Obj } from '@dxos/echo';
+import { SchemaEx } from '@dxos/effect';
+import { Input } from '@dxos/react-ui';
+import { type FormFieldRendererProps, SelectField } from '@dxos/react-ui-form';
+import { HuePicker, IconPicker } from '@dxos/react-ui-pickers';
+
+import { type TypeInputOptions, TypeInputOptionsAnnotationId } from '#types';
+
+/** The form renderer's own props ride alongside `data`; `type` comes from the field AST. */
+export type SpaceFormFieldProps = Surface.ComponentProps<AppSurface.FormInputData> &
+  Omit<FormFieldRendererProps, 'type'>;
+
+export const HueField = ({ data, label, readonly, getValue, onValueChange }: SpaceFormFieldProps) => {
+  const ast = data.fieldPropertyAst;
+  const handleChange = useCallback((nextHue: string) => ast && onValueChange(ast, nextHue), [ast, onValueChange]);
+  const handleReset = useCallback(() => ast && onValueChange(ast, undefined), [ast, onValueChange]);
+
+  if (!ast) {
+    return null;
+  }
+
+  return (
+    <Input.Root>
+      <Input.Label>{label}</Input.Label>
+      <HuePicker disabled={!!readonly} value={getValue() ?? ''} onChange={handleChange} onReset={handleReset} />
+    </Input.Root>
+  );
+};
+
+export const IconField = ({ data, label, readonly, getValue, onValueChange }: SpaceFormFieldProps) => {
+  const ast = data.fieldPropertyAst;
+  const handleChange = useCallback((nextIcon: string) => ast && onValueChange(ast, nextIcon), [ast, onValueChange]);
+  const handleReset = useCallback(() => ast && onValueChange(ast, undefined), [ast, onValueChange]);
+
+  if (!ast) {
+    return null;
+  }
+
+  return (
+    <Input.Root>
+      <Input.Label>{label}</Input.Label>
+      <IconPicker disabled={!!readonly} value={getValue() ?? ''} onChange={handleChange} onReset={handleReset} />
+    </Input.Root>
+  );
+};
+
+export const TypenameField = ({ data, ...inputProps }: SpaceFormFieldProps) => {
+  const ast = data.fieldPropertyAst;
+  const target = data.target;
+  const db = Database.isDatabase(target) ? target : Obj.isObject(target) ? Obj.getDatabase(target) : undefined;
+  const annotation = SchemaEx.findAnnotation<TypeInputOptions>(data.schema.ast, TypeInputOptionsAnnotationId)!;
+  const options = useTypeOptions({ db, annotation });
+
+  if (!ast) {
+    return null;
+  }
+
+  const props: FormFieldRendererProps = { ...inputProps, type: ast };
+
+  return <SelectField {...props} options={options} />;
+};

package/src/capabilities/SpaceSurfaces.tsx

@@ -0,0 +1,219 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+// Surface components that cannot be expressed as a `props` mapper, because they call hooks or must
+// render nothing until an ambient value (the active space, a backing view) resolves.
+
+import * as Option from 'effect/Option';
+import React, { type Ref } from 'react';
+
+import { useAtomCapability, useOperationInvoker, useSettingsState } from '@dxos/app-framework/ui';
+import { AppAnnotation, type AppCapabilities } from '@dxos/app-toolkit';
+import { useActiveSpace, useHomeVisibility } from '@dxos/app-toolkit/ui';
+import { Annotation, Obj, Type } from '@dxos/echo';
+import { useType } from '@dxos/echo-react';
+import { type Space, SpaceState, getSpace, isSpace, useSpaces } from '@dxos/react-client/echo';
+import { getTypeURIFromQuery } from '@dxos/schema';
+
+import {
+  MembersContainer,
+  MergePreview,
+  ObjectCardStack,
+  SchemaContainer,
+  SmallPresenceLive,
+  SpaceHomeDashboard,
+  SpaceHomeRecent,
+  SpacePresence,
+  SpaceSettings,
+  SpaceSettingsContainer,
+  TypeArticle,
+  ViewEditor,
+} from '#containers';
+import { SpaceOperation } from '#operations';
+import { type Settings, SpaceCapabilities } from '#types';
+
+import { tryGetViewForObject } from './try-get-view';
+
+export type SpaceHomeSectionProps = {
+  space: Space;
+};
+
+/** Home sections are individually dismissible per space, which is durable UI state. */
+export const SpaceHomeRecentSurface = ({ space }: SpaceHomeSectionProps) => {
+  const { visible, hide } = useHomeVisibility(space, 'spaceHomeRecent');
+
+  return visible ? <SpaceHomeRecent space={space} onClose={hide} /> : null;
+};
+
+export const SpaceHomeDashboardSurface = ({ space }: SpaceHomeSectionProps) => {
+  const { visible, hide } = useHomeVisibility(space, 'spaceHomeDashboard');
+
+  return visible ? <SpaceHomeDashboard space={space} onClose={hide} /> : null;
+};
+
+export type TypeArticleSurfaceProps = {
+  role: string;
+  attendableId: string;
+  type: Type.AnyEntity;
+  /** The navtree node's properties bag, which carries the space for a type collection. */
+  properties?: Record<string, unknown>;
+};
+
+export const TypeArticleSurface = ({ role, attendableId, type, properties }: TypeArticleSurfaceProps) => {
+  const space = isSpace(properties?.space) ? properties.space : undefined;
+  if (!space) {
+    return null;
+  }
+
+  return <TypeArticle role={role} space={space} type={type} attendableId={attendableId} />;
+};
+
+export type SpaceSettingsSurfaceProps = {
+  subject: AppCapabilities.Settings;
+};
+
+export const SpaceSettingsSurface = ({ subject }: SpaceSettingsSurfaceProps) => {
+  const spaces = useSpaces();
+  const { invokePromise } = useOperationInvoker();
+  const { settings, updateSettings } = useSettingsState<Settings.Settings>(subject.atom);
+
+  return (
+    <SpaceSettings
+      spaces={spaces}
+      onOpenSpaceSettings={(space: Space) => invokePromise(SpaceOperation.OpenSettings, { space })}
+      settings={settings}
+      onSettingsChange={updateSettings}
+    />
+  );
+};
+
+/** The space-settings articles are scoped to the active space rather than to a subject. */
+export const SpaceSettingsPropertiesSurface = () => {
+  const space = useActiveSpace();
+  if (!space) {
+    return null;
+  }
+
+  return <SpaceSettingsContainer space={space} />;
+};
+
+export type SpaceMembersSurfaceProps = {
+  createInvitationUrl: (invitationCode: string) => string;
+};
+
+export const SpaceMembersSurface = ({ createInvitationUrl }: SpaceMembersSurfaceProps) => {
+  const space = useActiveSpace();
+  if (!space) {
+    return null;
+  }
+
+  return <MembersContainer space={space} createInvitationUrl={createInvitationUrl} />;
+};
+
+export const SpaceSchemaSurface = () => {
+  const space = useActiveSpace();
+  if (!space) {
+    return null;
+  }
+
+  return <SchemaContainer space={space} />;
+};
+
+export type SelectedObjectsSurfaceProps = {
+  companionTo: Type.AnyEntity | Obj.Unknown;
+  ref?: Ref<HTMLDivElement>;
+};
+
+// TODO(burdon): Replace with mosaic.
+export const SelectedObjectsSurface = ({ companionTo, ref }: SelectedObjectsSurfaceProps) => {
+  const activeSpace = useActiveSpace();
+  const isTypeCompanion = Type.isType(companionTo);
+
+  // Object companion (e.g. a Table.Table): resolve its type via the view backing it.
+  const view = !isTypeCompanion ? tryGetViewForObject(companionTo) : undefined;
+  const viewDb = view ? Obj.getDatabase(view) : undefined;
+  const viewTypeUri = view?.query ? getTypeURIFromQuery(view.query.ast) : undefined;
+  const resolvedViewType = useType(viewDb, viewTypeUri);
+
+  // A staged merge takes over the companion: the panel's job is to show what the user is
+  // about to select, and during a review that is the proposed merged object, not the inputs.
+  const { mergePreview } = useAtomCapability(SpaceCapabilities.EphemeralState);
+
+  // Type/schema companion (e.g. a TypeArticle plank): the type IS the subject, no view lookup needed.
+  if (isTypeCompanion) {
+    if (!activeSpace) {
+      return null;
+    }
+
+    if (mergePreview?.typeUri === Type.getURI(companionTo)) {
+      return <MergePreview type={companionTo} spaceId={activeSpace.id} preview={mergePreview} ref={ref} />;
+    }
+
+    return (
+      <ObjectCardStack
+        key={Type.getURI(companionTo)}
+        objectId={Type.getURI(companionTo)}
+        db={activeSpace.db}
+        type={companionTo}
+        ref={ref}
+      />
+    );
+  }
+
+  if (!view || !viewDb || !resolvedViewType) {
+    return null;
+  }
+
+  return (
+    <ObjectCardStack
+      key={Obj.getURI(companionTo)}
+      objectId={Obj.getURI(companionTo)}
+      db={viewDb}
+      type={resolvedViewType}
+      ref={ref}
+    />
+  );
+};
+
+export type ViewEditorSurfaceProps = {
+  subject: Obj.Unknown;
+};
+
+/** Resolves the view backing the object; the filter has already established that one exists. */
+export const ViewEditorSurface = ({ subject }: ViewEditorSurfaceProps) => {
+  const view = tryGetViewForObject(subject);
+  if (!view) {
+    return null;
+  }
+
+  return <ViewEditor view={view} />;
+};
+
+export type NavtreePresenceSurfaceProps = {
+  id: string;
+  open?: boolean;
+};
+
+export const NavtreePresenceSurface = ({ id, open }: NavtreePresenceSurfaceProps) => {
+  const ephemeral = useAtomCapability(SpaceCapabilities.EphemeralState);
+
+  return <SmallPresenceLive id={id} open={open} viewers={ephemeral.viewersByObject[id]} />;
+};
+
+export type NavbarPresenceSurfaceProps = {
+  subject: Space | Obj.Unknown;
+};
+
+/** For a space the presence target is its root collection; for an object it is the object itself. */
+export const NavbarPresenceSurface = ({ subject }: NavbarPresenceSurfaceProps) => {
+  const space = isSpace(subject) ? subject : getSpace(subject);
+  const object = isSpace(subject)
+    ? subject.state.get() === SpaceState.SPACE_READY
+      ? space &&
+        Annotation.get(space.properties, AppAnnotation.RootCollectionAnnotation).pipe(Option.getOrUndefined)?.target
+      : undefined
+    : subject;
+
+  return object ? <SpacePresence object={object} /> : null;
+};