@dxos/plugin-space 0.10.0 → 0.11.1

package/dist/lib/chunk-CreateSpaceDialog.mjs

@@ -0,0 +1,68 @@
+import { meta } from "#meta";
+import { GraphPath, LayoutOperation } from "@dxos/app-toolkit";
+import * as Effect from "effect/Effect";
+import { SpaceOperation } from "#operations";
+import { SpaceForm } from "#types";
+import { EffectEx } from "@dxos/effect";
+import { useCallback, useRef, useState } from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { Column, Dialog, useTranslation } from "@dxos/react-ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Form } from "@dxos/react-ui-form";
+import { useInputSurfaceLookup } from "#hooks";
+import { log } from "@dxos/log";
+//#region src/containers/CreateSpaceDialog/CreateSpaceDialog.tsx
+var __dxlog_file = "/__w/dxos/dxos/packages/plugins/plugin-space/src/containers/CreateSpaceDialog/CreateSpaceDialog.tsx";
+`${meta.profile.key}`;
+var initialValues = { edgeReplication: true };
+var CreateSpaceDialog = () => {
+	const closeRef = useRef(null);
+	const { t } = useTranslation(meta.profile.key);
+	const { invoke } = useOperationInvoker();
+	const inputSurfaceLookup = useInputSurfaceLookup();
+	const [error, setError] = useState(void 0);
+	const handleCreateSpace = useCallback((data) => {
+		setError(void 0);
+		return Effect.gen(function* () {
+			const { space } = yield* invoke(SpaceOperation.Create, data);
+			yield* invoke(LayoutOperation.Open, {
+				subject: [GraphPath.getSpaceHomePath(space.id)],
+				workspace: GraphPath.getSpacePath(space.id),
+				navigation: "immediate"
+			});
+			yield* invoke(LayoutOperation.UpdateDialog, { state: false });
+		}).pipe(Effect.catchAll((failure) => Effect.sync(() => {
+			log.catch(failure, void 0, {
+				"~LogMeta": "~LogMeta",
+				F: __dxlog_file,
+				L: 48,
+				S: void 0
+			});
+			setError(t("create-space-dialog.error.message"));
+		})), EffectEx.runAndForwardErrors);
+	}, [invoke, t]);
+	return /* @__PURE__ */ jsxs(Dialog.Content, { children: [/* @__PURE__ */ jsxs(Dialog.Header, { children: [/* @__PURE__ */ jsx(Dialog.Title, { children: t("create-space-dialog.title") }), /* @__PURE__ */ jsx(Dialog.Close, {
+		asChild: true,
+		children: /* @__PURE__ */ jsx(Dialog.ActionIconButton, {
+			action: "close",
+			ref: closeRef
+		})
+	})] }), /* @__PURE__ */ jsx(Dialog.Body, { children: /* @__PURE__ */ jsx(Form.Root, {
+		testId: "create-space-form",
+		autoFocus: true,
+		schema: SpaceForm,
+		defaultValues: initialValues,
+		fieldProvider: inputSurfaceLookup,
+		onSave: handleCreateSpace,
+		children: /* @__PURE__ */ jsx(Column.Center, { children: /* @__PURE__ */ jsxs(Form.Content, { children: [
+			/* @__PURE__ */ jsx(Form.FieldSet, {}),
+			/* @__PURE__ */ jsx(Form.Error, { children: error }),
+			/* @__PURE__ */ jsx(Form.Submit, {})
+		] }) })
+	}) })] });
+};
+CreateSpaceDialog.displayName = "CreateSpaceDialog";
+//#endregion
+export { CreateSpaceDialog as default };
+
+//# sourceMappingURL=chunk-CreateSpaceDialog.mjs.map

package/dist/lib/chunk-CreateSpaceDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunk-CreateSpaceDialog.mjs","names":[],"sources":["../../src/containers/CreateSpaceDialog/CreateSpaceDialog.tsx"],"sourcesContent":["//\n// Copyright 2024 DXOS.org\n//\n\nimport * as Effect from 'effect/Effect';\nimport type * as Schema from 'effect/Schema';\nimport React, { useCallback, useRef, useState } from 'react';\n\nimport { useOperationInvoker } from '@dxos/app-framework/ui';\nimport { GraphPath, LayoutOperation } from '@dxos/app-toolkit';\nimport { EffectEx } from '@dxos/effect';\nimport { log } from '@dxos/log';\nimport { Column, Dialog, useTranslation } from '@dxos/react-ui';\nimport { Form } from '@dxos/react-ui-form';\n\nimport { useInputSurfaceLookup } from '#hooks';\nimport { meta } from '#meta';\nimport { SpaceOperation } from '#operations';\nimport { SpaceForm } from '#types';\n\nexport const CREATE_SPACE_DIALOG = `${meta.profile.key}.CreateSpaceDialog`;\n\ntype FormValues = Schema.Schema.Type<typeof SpaceForm>;\nconst initialValues: FormValues = { edgeReplication: true };\n\nexport const CreateSpaceDialog = () => {\n  const closeRef = useRef<HTMLButtonElement | null>(null);\n  const { t } = useTranslation(meta.profile.key);\n  const { invoke } = useOperationInvoker();\n\n  const inputSurfaceLookup = useInputSurfaceLookup();\n  const [error, setError] = useState<string | undefined>(undefined);\n\n  const handleCreateSpace = useCallback(\n    (data: FormValues) => {\n      setError(undefined);\n      return Effect.gen(function* () {\n        const { space } = yield* invoke(SpaceOperation.Create, data);\n        yield* invoke(LayoutOperation.Open, {\n          subject: [GraphPath.getSpaceHomePath(space.id)],\n          workspace: GraphPath.getSpacePath(space.id),\n          navigation: 'immediate',\n        });\n        yield* invoke(LayoutOperation.UpdateDialog, { state: false });\n      }).pipe(\n        Effect.catchAll((failure) =>\n          Effect.sync(() => {\n            log.catch(failure);\n            setError(t('create-space-dialog.error.message'));\n          }),\n        ),\n        EffectEx.runAndForwardErrors,\n      );\n    },\n    [invoke, t],\n  );\n\n  return (\n    <Dialog.Content>\n      <Dialog.Header>\n        <Dialog.Title>{t('create-space-dialog.title')}</Dialog.Title>\n        <Dialog.Close asChild>\n          <Dialog.ActionIconButton action='close' ref={closeRef} />\n        </Dialog.Close>\n      </Dialog.Header>\n      <Dialog.Body>\n        <Form.Root\n          testId='create-space-form'\n          autoFocus\n          schema={SpaceForm}\n          defaultValues={initialValues}\n          fieldProvider={inputSurfaceLookup}\n          onSave={handleCreateSpace}\n        >\n          {/* Dialog.Body owns the gutter Column; place the form in its center column via Column.Center\n              (not Form.Viewport's own Column.Root, which double-insets) so it aligns with the title. */}\n          <Column.Center>\n            <Form.Content>\n              <Form.FieldSet />\n              <Form.Error>{error}</Form.Error>\n              <Form.Submit />\n            </Form.Content>\n          </Column.Center>\n        </Form.Root>\n      </Dialog.Body>\n    </Dialog.Content>\n  );\n};\n\nCreateSpaceDialog.displayName = 'CreateSpaceDialog';\n"],"mappings":";;;;;;;;;;;;;;;AAoBmC,GAAG,KAAK,QAAQ,IAAhB;AAGnC,IAAM,gBAA4B,EAAE,iBAAiB,KAAK;AAE1D,IAAa,0BAA0B;CACrC,MAAM,WAAW,OAAiC,IAAI;CACtD,MAAM,EAAE,MAAM,eAAe,KAAK,QAAQ,GAAG;CAC7C,MAAM,EAAE,WAAW,oBAAoB;CAEvC,MAAM,qBAAqB,sBAAsB;CACjD,MAAM,CAAC,OAAO,YAAY,SAA6B,KAAA,CAAS;CAEhE,MAAM,oBAAoB,aACvB,SAAqB;EACpB,SAAS,KAAA,CAAS;EAClB,OAAO,OAAO,IAAI,aAAa;GAC7B,MAAM,EAAE,UAAU,OAAO,OAAO,eAAe,QAAQ,IAAI;GAC3D,OAAO,OAAO,gBAAgB,MAAM;IAClC,SAAS,CAAC,UAAU,iBAAiB,MAAM,EAAE,CAAC;IAC9C,WAAW,UAAU,aAAa,MAAM,EAAE;IAC1C,YAAY;GACd,CAAC;GACD,OAAO,OAAO,gBAAgB,cAAc,EAAE,OAAO,MAAM,CAAC;EAC9D,CAAC,CAAC,CAAC,KACD,OAAO,UAAU,YACf,OAAO,WAAW;GAChB,IAAI,MAAM,SAAM,KAAA,GAAA;IAAA,YAAA;IAAA,GAAA;IAAA,GAAA;IAAA,GAAA,KAAA;GAAA,CAAC;GACjB,SAAS,EAAE,mCAAmC,CAAC;EACjD,CAAC,CACH,GACA,SAAS,mBACX;CACF,GACA,CAAC,QAAQ,CAAC,CACZ;CAEA,OACE,qBAAC,OAAO,SAAR,EAAA,UAAA,CACE,qBAAC,OAAO,QAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR,EAAA,UAAe,EAAE,2BAA2B,EAAgB,CAAA,GAC5D,oBAAC,OAAO,OAAR;EAAc,SAAA;YACZ,oBAAC,OAAO,kBAAR;GAAyB,QAAO;GAAQ,KAAK;EAAW,CAAA;CAC5C,CAAA,CACD,EAAA,CAAA,GACf,oBAAC,OAAO,MAAR,EAAA,UACE,oBAAC,KAAK,MAAN;EACE,QAAO;EACP,WAAA;EACA,QAAQ;EACR,eAAe;EACf,eAAe;EACf,QAAQ;YAIR,oBAAC,OAAO,QAAR,EAAA,UACE,qBAAC,KAAK,SAAN,EAAA,UAAA;GACE,oBAAC,KAAK,UAAN,CAAgB,CAAA;GAChB,oBAAC,KAAK,OAAN,EAAA,UAAa,MAAkB,CAAA;GAC/B,oBAAC,KAAK,QAAN,CAAc,CAAA;EACF,EAAA,CAAA,EACD,CAAA;CACN,CAAA,EACA,CAAA,CACC,EAAA,CAAA;AAEpB;AAEA,kBAAkB,cAAc"}

package/dist/lib/chunk-DefaultProperties.mjs

@@ -0,0 +1,59 @@
+import { Capability } from "@dxos/app-framework";
+import * as Effect from "effect/Effect";
+import { Operation } from "@dxos/compute";
+import { SpaceCapabilities } from "#types";
+import { forwardRef, useCallback, useMemo } from "react";
+import { Surface, useCapabilities, useOperationInvoker, usePluginManager } from "@dxos/app-framework/ui";
+import { AppSurface } from "@dxos/app-toolkit/ui";
+import { Panel, Toolbar } from "@dxos/react-ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ObjectProperties } from "@dxos/react-ui-form";
+//#region src/containers/DefaultProperties/DefaultProperties.tsx
+/**
+* Generic object-properties companion rendered for any object: a schema-driven {@link ObjectProperties}
+* form plus the `object-properties` surface, so plugins whose properties are plain editable fields need
+* not register a bespoke surface (mirrors `DefaultSettings` for plugin settings).
+*/
+var DefaultProperties = forwardRef(({ role, subject: object }, forwardedRef) => {
+	const manager = usePluginManager();
+	const operationInvoker = useOperationInvoker();
+	const createEntries = useCapabilities(SpaceCapabilities.CreateObjectEntry);
+	const data = useMemo(() => ({ subject: object }), [object]);
+	const resolveCreateEntry = useCallback((typename) => {
+		const entry = createEntries.find((createEntry) => createEntry.id === typename);
+		if (!entry?.inputSchema && !entry?.createObject) return;
+		return {
+			inputSchema: entry.inputSchema,
+			createObject: async (values, db) => {
+				return (await entry.createObject(values, {
+					db,
+					target: db
+				}).pipe(Effect.provideService(Capability.Service, manager.capabilities), Effect.provideService(Operation.Service, operationInvoker), Effect.runPromise)).object;
+			}
+		};
+	}, [
+		createEntries,
+		manager,
+		operationInvoker
+	]);
+	return /* @__PURE__ */ jsxs(Panel.Root, {
+		role,
+		ref: forwardedRef,
+		children: [/* @__PURE__ */ jsx(Panel.Toolbar, { children: /* @__PURE__ */ jsx(Toolbar.Root, { classNames: "dx-document" }) }), /* @__PURE__ */ jsx(Panel.Content, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(ObjectProperties, {
+				object,
+				resolveCreateEntry,
+				children: /* @__PURE__ */ jsx(Surface.Surface, {
+					type: AppSurface.ObjectProperties,
+					data
+				})
+			})
+		})]
+	});
+});
+DefaultProperties.displayName = "DefaultProperties";
+//#endregion
+export { DefaultProperties as default };
+
+//# sourceMappingURL=chunk-DefaultProperties.mjs.map

package/dist/lib/chunk-DefaultProperties.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunk-DefaultProperties.mjs","names":[],"sources":["../../src/containers/DefaultProperties/DefaultProperties.tsx"],"sourcesContent":["//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Effect from 'effect/Effect';\nimport React, { forwardRef, useCallback, useMemo } from 'react';\n\nimport { Capability } from '@dxos/app-framework';\nimport { Surface, useCapabilities, useOperationInvoker, usePluginManager } from '@dxos/app-framework/ui';\nimport { AppSurface } from '@dxos/app-toolkit/ui';\nimport { Operation } from '@dxos/compute';\nimport { type Database, type Obj } from '@dxos/echo';\nimport { Panel, Toolbar } from '@dxos/react-ui';\nimport { type CreateEntryOverride, ObjectProperties } from '@dxos/react-ui-form';\n\nimport { SpaceCapabilities } from '#types';\n\nexport type DefaultPropertiesProps = AppSurface.ObjectPropertiesProps<Obj.Unknown>;\n\n/**\n * Generic object-properties companion rendered for any object: a schema-driven {@link ObjectProperties}\n * form plus the `object-properties` surface, so plugins whose properties are plain editable fields need\n * not register a bespoke surface (mirrors `DefaultSettings` for plugin settings).\n */\nexport const DefaultProperties = forwardRef<HTMLDivElement, DefaultPropertiesProps>(\n  ({ role, subject: object }, forwardedRef) => {\n    const manager = usePluginManager();\n    const operationInvoker = useOperationInvoker();\n    const createEntries = useCapabilities(SpaceCapabilities.CreateObjectEntry);\n    const data = useMemo<AppSurface.ObjectPropertiesData>(() => ({ subject: object }), [object]);\n\n    const resolveCreateEntry = useCallback(\n      (typename: string): CreateEntryOverride | undefined => {\n        const entry = createEntries.find((createEntry) => createEntry.id === typename);\n        if (!entry?.inputSchema && !entry?.createObject) {\n          return undefined;\n        }\n        return {\n          inputSchema: entry.inputSchema,\n          createObject: async (values: any, db: Database.Database): Promise<Obj.Unknown> => {\n            const result = await entry\n              .createObject(values, { db, target: db })\n              .pipe(\n                Effect.provideService(Capability.Service, manager.capabilities),\n                Effect.provideService(Operation.Service, operationInvoker),\n                Effect.runPromise,\n              );\n            return result.object;\n          },\n        };\n      },\n      [createEntries, manager, operationInvoker],\n    );\n\n    return (\n      <Panel.Root role={role} ref={forwardedRef}>\n        <Panel.Toolbar>\n          <Toolbar.Root classNames='dx-document' />\n        </Panel.Toolbar>\n        <Panel.Content asChild>\n          <ObjectProperties object={object} resolveCreateEntry={resolveCreateEntry}>\n            {/* TODO(burdon): Ambiguous naming since providers only replace parts; can't update Toolbar, etc. Consider DefaultSettings pattern. */}\n            <Surface.Surface type={AppSurface.ObjectProperties} data={data} />\n          </ObjectProperties>\n        </Panel.Content>\n      </Panel.Root>\n    );\n  },\n);\n\nDefaultProperties.displayName = 'DefaultProperties';\n"],"mappings":";;;;;;;;;;;;;;;;AAwBA,IAAa,oBAAoB,YAC9B,EAAE,MAAM,SAAS,UAAU,iBAAiB;CAC3C,MAAM,UAAU,iBAAiB;CACjC,MAAM,mBAAmB,oBAAoB;CAC7C,MAAM,gBAAgB,gBAAgB,kBAAkB,iBAAiB;CACzE,MAAM,OAAO,eAAgD,EAAE,SAAS,OAAO,IAAI,CAAC,MAAM,CAAC;CAE3F,MAAM,qBAAqB,aACxB,aAAsD;EACrD,MAAM,QAAQ,cAAc,MAAM,gBAAgB,YAAY,OAAO,QAAQ;EAC7E,IAAI,CAAC,OAAO,eAAe,CAAC,OAAO,cACjC;EAEF,OAAO;GACL,aAAa,MAAM;GACnB,cAAc,OAAO,QAAa,OAAgD;IAQhF,QAAO,MAPc,MAClB,aAAa,QAAQ;KAAE;KAAI,QAAQ;IAAG,CAAC,CAAA,CACvC,KACC,OAAO,eAAe,WAAW,SAAS,QAAQ,YAAY,GAC9D,OAAO,eAAe,UAAU,SAAS,gBAAgB,GACzD,OAAO,UACT,EAAA,CACY;GAChB;EACF;CACF,GACA;EAAC;EAAe;EAAS;CAAgB,CAC3C;CAEA,OACE,qBAAC,MAAM,MAAP;EAAkB;EAAM,KAAK;YAA7B,CACE,oBAAC,MAAM,SAAP,EAAA,UACE,oBAAC,QAAQ,MAAT,EAAc,YAAW,cAAe,CAAA,EAC3B,CAAA,GACf,oBAAC,MAAM,SAAP;GAAe,SAAA;aACb,oBAAC,kBAAD;IAA0B;IAA4B;cAEpD,oBAAC,QAAQ,SAAT;KAAiB,MAAM,WAAW;KAAwB;IAAO,CAAA;GACjD,CAAA;EACL,CAAA,CACL;;AAEhB,CACF;AAEA,kBAAkB,cAAc"}

package/dist/lib/chunk-ImportSpaceDialog.mjs

@@ -0,0 +1,58 @@
+import { meta } from "#meta";
+import { GraphPath, LayoutOperation } from "@dxos/app-toolkit";
+import { SpaceOperation } from "#operations";
+import { useCallback } from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { Button, Dialog, Icon, useTranslation } from "@dxos/react-ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { FileUploader } from "react-drag-drop-files";
+//#region src/containers/ImportSpaceDialog/ImportSpaceDialog.tsx
+var ImportSpaceDialog = () => {
+	const { t } = useTranslation(meta.profile.key);
+	const { invokePromise } = useOperationInvoker();
+	const handleFile = useCallback(async (file) => {
+		const contents = new Uint8Array(await file.arrayBuffer());
+		const { data: result } = await invokePromise(SpaceOperation.ImportSpace, { archive: {
+			filename: file.name,
+			contents
+		} });
+		await invokePromise(LayoutOperation.UpdateDialog, { state: false });
+		if (result?.space) await invokePromise(LayoutOperation.SwitchWorkspace, { subject: GraphPath.getSpacePath(result.space.id) });
+	}, [invokePromise]);
+	return /* @__PURE__ */ jsxs(Dialog.Content, { children: [
+		/* @__PURE__ */ jsxs(Dialog.Header, { children: [/* @__PURE__ */ jsx(Dialog.Title, { children: t("import-space-dialog.title") }), /* @__PURE__ */ jsx(Dialog.Close, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Dialog.ActionIconButton, { action: "close" })
+		})] }),
+		/* @__PURE__ */ jsxs(Dialog.Body, { children: [/* @__PURE__ */ jsx("p", {
+			className: "my-4",
+			children: t("import-space-dialog.description")
+		}), /* @__PURE__ */ jsxs(FileUploader, {
+			types: ["json", "tar"],
+			classes: "block my-4 p-8 border-2 border-dashed border-neutral-500/50 rounded-sm flex items-center justify-center gap-2 cursor-pointer",
+			dropMessageStyle: {
+				border: "none",
+				backgroundColor: "#EEE"
+			},
+			handleChange: (file) => {
+				handleFile(file);
+			},
+			children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph--file-plus--duotone",
+				size: 8
+			}), /* @__PURE__ */ jsx("span", { children: t("import-space-dialog.upload.label") })]
+		})] }),
+		/* @__PURE__ */ jsx(Dialog.ActionBar, { children: /* @__PURE__ */ jsx(Dialog.Close, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				variant: "primary",
+				children: t("cancel.label")
+			})
+		}) })
+	] });
+};
+ImportSpaceDialog.displayName = "ImportSpaceDialog";
+//#endregion
+export { ImportSpaceDialog as default };
+
+//# sourceMappingURL=chunk-ImportSpaceDialog.mjs.map

package/dist/lib/chunk-ImportSpaceDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunk-ImportSpaceDialog.mjs","names":[],"sources":["../../src/containers/ImportSpaceDialog/ImportSpaceDialog.tsx"],"sourcesContent":["//\n// Copyright 2026 DXOS.org\n//\n\nimport React, { useCallback } from 'react';\nimport { FileUploader } from 'react-drag-drop-files';\n\nimport { useOperationInvoker } from '@dxos/app-framework/ui';\nimport { GraphPath, LayoutOperation } from '@dxos/app-toolkit';\nimport { Button, Dialog, Icon, useTranslation } from '@dxos/react-ui';\n\nimport { meta } from '#meta';\nimport { SpaceOperation } from '#operations';\n\nexport const ImportSpaceDialog = () => {\n  const { t } = useTranslation(meta.profile.key);\n  const { invokePromise } = useOperationInvoker();\n\n  const handleFile = useCallback(\n    async (file: File) => {\n      const contents = new Uint8Array(await file.arrayBuffer());\n      const { data: result } = await invokePromise(SpaceOperation.ImportSpace, {\n        archive: { filename: file.name, contents },\n      });\n      await invokePromise(LayoutOperation.UpdateDialog, { state: false });\n      if (result?.space) {\n        await invokePromise(LayoutOperation.SwitchWorkspace, { subject: GraphPath.getSpacePath(result.space.id) });\n      }\n    },\n    [invokePromise],\n  );\n\n  return (\n    <Dialog.Content>\n      <Dialog.Header>\n        <Dialog.Title>{t('import-space-dialog.title')}</Dialog.Title>\n        <Dialog.Close asChild>\n          <Dialog.ActionIconButton action='close' />\n        </Dialog.Close>\n      </Dialog.Header>\n      <Dialog.Body>\n        <p className='my-4'>{t('import-space-dialog.description')}</p>\n        <FileUploader\n          types={['json', 'tar']}\n          classes='block my-4 p-8 border-2 border-dashed border-neutral-500/50 rounded-sm flex items-center justify-center gap-2 cursor-pointer'\n          dropMessageStyle={{ border: 'none', backgroundColor: '#EEE' }}\n          handleChange={(file: File) => {\n            void handleFile(file);\n          }}\n        >\n          <Icon icon='ph--file-plus--duotone' size={8} />\n          <span>{t('import-space-dialog.upload.label')}</span>\n        </FileUploader>\n      </Dialog.Body>\n      <Dialog.ActionBar>\n        <Dialog.Close asChild>\n          <Button variant='primary'>{t('cancel.label')}</Button>\n        </Dialog.Close>\n      </Dialog.ActionBar>\n    </Dialog.Content>\n  );\n};\n\nImportSpaceDialog.displayName = 'ImportSpaceDialog';\n"],"mappings":";;;;;;;;;AAcA,IAAa,0BAA0B;CACrC,MAAM,EAAE,MAAM,eAAe,KAAK,QAAQ,GAAG;CAC7C,MAAM,EAAE,kBAAkB,oBAAoB;CAE9C,MAAM,aAAa,YACjB,OAAO,SAAe;EACpB,MAAM,WAAW,IAAI,WAAW,MAAM,KAAK,YAAY,CAAC;EACxD,MAAM,EAAE,MAAM,WAAW,MAAM,cAAc,eAAe,aAAa,EACvE,SAAS;GAAE,UAAU,KAAK;GAAM;EAAS,EAC3C,CAAC;EACD,MAAM,cAAc,gBAAgB,cAAc,EAAE,OAAO,MAAM,CAAC;EAClE,IAAI,QAAQ,OACV,MAAM,cAAc,gBAAgB,iBAAiB,EAAE,SAAS,UAAU,aAAa,OAAO,MAAM,EAAE,EAAE,CAAC;CAE7G,GACA,CAAC,aAAa,CAChB;CAEA,OACE,qBAAC,OAAO,SAAR,EAAA,UAAA;EACE,qBAAC,OAAO,QAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR,EAAA,UAAe,EAAE,2BAA2B,EAAgB,CAAA,GAC5D,oBAAC,OAAO,OAAR;GAAc,SAAA;aACZ,oBAAC,OAAO,kBAAR,EAAyB,QAAO,QAAS,CAAA;EAC7B,CAAA,CACD,EAAA,CAAA;EACf,qBAAC,OAAO,MAAR,EAAA,UAAA,CACE,oBAAC,KAAD;GAAG,WAAU;aAAQ,EAAE,iCAAiC;EAAK,CAAA,GAC7D,qBAAC,cAAD;GACE,OAAO,CAAC,QAAQ,KAAK;GACrB,SAAQ;GACR,kBAAkB;IAAE,QAAQ;IAAQ,iBAAiB;GAAO;GAC5D,eAAe,SAAe;IAC5B,WAAgB,IAAI;GACtB;aANF,CAQE,oBAAC,MAAD;IAAM,MAAK;IAAyB,MAAM;GAAI,CAAA,GAC9C,oBAAC,QAAD,EAAA,UAAO,EAAE,kCAAkC,EAAQ,CAAA,CACvC;IACH,EAAA,CAAA;EACb,oBAAC,OAAO,WAAR,EAAA,UACE,oBAAC,OAAO,OAAR;GAAc,SAAA;aACZ,oBAAC,QAAD;IAAQ,SAAQ;cAAW,EAAE,cAAc;GAAU,CAAA;EACzC,CAAA,EACE,CAAA;CACJ,EAAA,CAAA;AAEpB;AAEA,kBAAkB,cAAc"}

package/dist/lib/chunk-InlineSyncStatus.mjs

@@ -0,0 +1,37 @@
+import { meta } from "#meta";
+import { GraphPath } from "@dxos/app-toolkit";
+import { EdgeStatus } from "@dxos/protocols/proto/dxos/client/services";
+import "react";
+import { useSpaceSyncState } from "@dxos/react-client/echo";
+import { Tooltip, useTranslation } from "@dxos/react-ui";
+import { jsx } from "react/jsx-runtime";
+import { useEdgeStatus } from "#hooks";
+import { EdgeReplicationSetting } from "@dxos/protocols/proto/dxos/echo/metadata";
+import { AttentionGlyph, useAttention } from "@dxos/react-ui-attention";
+//#region src/containers/InlineSyncStatus/InlineSyncStatus.tsx
+var InlineSyncStatus = ({ space, open }) => {
+	const { t } = useTranslation(meta.profile.key);
+	const { hasAttention, isAncestor, isRelated } = useAttention(GraphPath.getSpacePath(space.id));
+	const attended = hasAttention || isRelated;
+	const containsAttended = isAncestor && !open;
+	const connectedToEdge = useEdgeStatus().state === EdgeStatus.ConnectionState.CONNECTED;
+	const edgeSyncEnabled = space.internal.data.edgeReplication === EdgeReplicationSetting.ENABLED;
+	const syncState = useSpaceSyncState(space);
+	const syncing = connectedToEdge && edgeSyncEnabled && syncState && syncState.missingOnLocal > 0;
+	return /* @__PURE__ */ jsx(Tooltip.Trigger, {
+		asChild: true,
+		content: t("syncing.label"),
+		side: "bottom",
+		children: /* @__PURE__ */ jsx(AttentionGlyph, {
+			syncing,
+			attended,
+			containsAttended,
+			classNames: "self-center mx-1"
+		})
+	});
+};
+InlineSyncStatus.displayName = "InlineSyncStatus";
+//#endregion
+export { InlineSyncStatus as default };
+
+//# sourceMappingURL=chunk-InlineSyncStatus.mjs.map

package/dist/lib/chunk-InlineSyncStatus.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunk-InlineSyncStatus.mjs","names":[],"sources":["../../src/containers/InlineSyncStatus/InlineSyncStatus.tsx"],"sourcesContent":["//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport { GraphPath } from '@dxos/app-toolkit';\nimport { EdgeStatus } from '@dxos/protocols/proto/dxos/client/services';\nimport { EdgeReplicationSetting } from '@dxos/protocols/proto/dxos/echo/metadata';\nimport { type Space, useSpaceSyncState } from '@dxos/react-client/echo';\nimport { Tooltip, useTranslation } from '@dxos/react-ui';\nimport { AttentionGlyph, useAttention } from '@dxos/react-ui-attention';\n\nimport { useEdgeStatus } from '#hooks';\nimport { meta } from '#meta';\n\nexport const InlineSyncStatus = ({ space, open }: { space: Space; open?: boolean }) => {\n  const { t } = useTranslation(meta.profile.key);\n  const qualifiedId = GraphPath.getSpacePath(space.id);\n  const { hasAttention, isAncestor, isRelated } = useAttention(qualifiedId);\n  const attended = hasAttention || isRelated;\n  const containsAttended = isAncestor && !open;\n  const connectedToEdge = useEdgeStatus().state === EdgeStatus.ConnectionState.CONNECTED;\n  // TODO(wittjosiah): This is not reactive.\n  const edgeSyncEnabled = space.internal.data.edgeReplication === EdgeReplicationSetting.ENABLED;\n  const syncState = useSpaceSyncState(space);\n  const syncing = connectedToEdge && edgeSyncEnabled && syncState && syncState.missingOnLocal > 0;\n\n  return (\n    <Tooltip.Trigger asChild content={t('syncing.label')} side='bottom'>\n      <AttentionGlyph\n        syncing={syncing}\n        attended={attended}\n        containsAttended={containsAttended}\n        classNames='self-center mx-1'\n      />\n    </Tooltip.Trigger>\n  );\n};\n\nInlineSyncStatus.displayName = 'InlineSyncStatus';\n"],"mappings":";;;;;;;;;;;AAgBA,IAAa,oBAAoB,EAAE,OAAO,WAA6C;CACrF,MAAM,EAAE,MAAM,eAAe,KAAK,QAAQ,GAAG;CAE7C,MAAM,EAAE,cAAc,YAAY,cAAc,aAD5B,UAAU,aAAa,MAAM,EACY,CAAW;CACxE,MAAM,WAAW,gBAAgB;CACjC,MAAM,mBAAmB,cAAc,CAAC;CACxC,MAAM,kBAAkB,cAAc,CAAC,CAAC,UAAU,WAAW,gBAAgB;CAE7E,MAAM,kBAAkB,MAAM,SAAS,KAAK,oBAAoB,uBAAuB;CACvF,MAAM,YAAY,kBAAkB,KAAK;CACzC,MAAM,UAAU,mBAAmB,mBAAmB,aAAa,UAAU,iBAAiB;CAE9F,OACE,oBAAC,QAAQ,SAAT;EAAiB,SAAA;EAAQ,SAAS,EAAE,eAAe;EAAG,MAAK;YACzD,oBAAC,gBAAD;GACW;GACC;GACQ;GAClB,YAAW;EACZ,CAAA;CACc,CAAA;AAErB;AAEA,iBAAiB,cAAc"}

package/dist/lib/chunk-JoinDialog.mjs

@@ -0,0 +1,65 @@
+import { meta } from "#meta";
+import { GraphPath, LayoutOperation } from "@dxos/app-toolkit";
+import { JoinPanel } from "@dxos/shell/react";
+import { useCallback } from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { useClient } from "@dxos/react-client";
+import { Dialog, useTranslation } from "@dxos/react-ui";
+import { osTranslations } from "@dxos/ui-theme";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Trigger } from "@dxos/async";
+import { ObservabilityOperation } from "@dxos/plugin-observability";
+`${meta.profile.key}`;
+var JoinDialog = ({ navigableCollections, onDone, ...props }) => {
+	const { invokePromise } = useOperationInvoker();
+	const client = useClient();
+	const { t } = useTranslation(meta.profile.key);
+	const handleDone = useCallback(async (result) => {
+		const spaceKey = result?.spaceKey;
+		if (!spaceKey) return;
+		await Promise.all([invokePromise(LayoutOperation.AddToast, {
+			id: `${meta.profile.key}.join-success`,
+			duration: 5e3,
+			title: ["join-success.label", { ns: meta.profile.key }],
+			closeLabel: ["dismiss.label", { ns: meta.profile.key }]
+		}), invokePromise(LayoutOperation.UpdateDialog, { state: false })]);
+		let space = client.spaces.get(spaceKey);
+		if (!space) {
+			const trigger = new Trigger();
+			client.spaces.subscribe(() => {
+				const space = client.spaces.get(spaceKey);
+				if (space) trigger.wake(space);
+			});
+			space = await trigger.wait();
+		}
+		await invokePromise(LayoutOperation.Open, {
+			subject: [GraphPath.getSpaceHomePath(space.id)],
+			workspace: GraphPath.getSpacePath(space.id),
+			navigation: "immediate"
+		});
+		onDone?.(result);
+		if (space) await invokePromise(ObservabilityOperation.SendEvent, {
+			name: "space.join",
+			properties: { spaceId: space.id }
+		});
+	}, [
+		invokePromise,
+		client,
+		navigableCollections,
+		onDone
+	]);
+	return /* @__PURE__ */ jsxs(Dialog.Content, { children: [/* @__PURE__ */ jsx(Dialog.Title, {
+		classNames: "sr-only",
+		children: t("join-space.label", { ns: osTranslations })
+	}), /* @__PURE__ */ jsx(Dialog.Body, { children: /* @__PURE__ */ jsx(JoinPanel, {
+		...props,
+		exitActionParent: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true }),
+		doneActionParent: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true }),
+		onDone: handleDone
+	}) })] });
+};
+JoinDialog.displayName = "JoinDialog";
+//#endregion
+export { JoinDialog, JoinDialog as default };
+
+//# sourceMappingURL=chunk-JoinDialog.mjs.map

package/dist/lib/chunk-JoinDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunk-JoinDialog.mjs","names":[],"sources":["../../src/containers/JoinDialog/JoinDialog.tsx"],"sourcesContent":["//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useCallback } from 'react';\n\nimport { useOperationInvoker } from '@dxos/app-framework/ui';\nimport { GraphPath, LayoutOperation } from '@dxos/app-toolkit';\nimport { Trigger } from '@dxos/async';\nimport { ObservabilityOperation } from '@dxos/plugin-observability';\nimport { useClient } from '@dxos/react-client';\nimport { type Space } from '@dxos/react-client/echo';\nimport { type InvitationResult } from '@dxos/react-client/invitations';\nimport { Dialog, useTranslation } from '@dxos/react-ui';\nimport { JoinPanel, type JoinPanelProps } from '@dxos/shell/react';\nimport { osTranslations } from '@dxos/ui-theme';\n\nimport { meta } from '#meta';\n\nexport const JOIN_DIALOG = `${meta.profile.key}.JoinDialog`;\n\nexport type JoinDialogProps = JoinPanelProps & {\n  navigableCollections?: boolean;\n};\n\nexport const JoinDialog = ({ navigableCollections, onDone, ...props }: JoinDialogProps) => {\n  const { invokePromise } = useOperationInvoker();\n  const client = useClient();\n  const { t } = useTranslation(meta.profile.key);\n\n  const handleDone = useCallback(\n    async (result: InvitationResult | null) => {\n      const spaceKey = result?.spaceKey;\n      if (!spaceKey) {\n        return;\n      }\n\n      await Promise.all([\n        invokePromise(LayoutOperation.AddToast, {\n          id: `${meta.profile.key}.join-success`,\n          duration: 5_000,\n          title: ['join-success.label', { ns: meta.profile.key }],\n          closeLabel: ['dismiss.label', { ns: meta.profile.key }],\n        }),\n        invokePromise(LayoutOperation.UpdateDialog, { state: false }),\n      ]);\n\n      let space = client.spaces.get(spaceKey);\n      if (!space) {\n        // TODO(wittjosiah): Add api to wait for a space.\n        const trigger = new Trigger<Space>();\n        client.spaces.subscribe(() => {\n          const space = client.spaces.get(spaceKey);\n          if (space) {\n            trigger.wake(space);\n          }\n        });\n        space = await trigger.wait();\n      }\n\n      // TODO(wittjosiah): `result.target` is ignored so acceptance navigates to the space home\n      // immediately; revisit how to incorporate the target once immediate navigation is settled.\n      await invokePromise(LayoutOperation.Open, {\n        subject: [GraphPath.getSpaceHomePath(space.id)],\n        workspace: GraphPath.getSpacePath(space.id),\n        navigation: 'immediate',\n      });\n\n      onDone?.(result);\n\n      if (space) {\n        await invokePromise(ObservabilityOperation.SendEvent, {\n          name: 'space.join',\n          properties: {\n            spaceId: space.id,\n          },\n        });\n      }\n    },\n    [invokePromise, client, navigableCollections, onDone],\n  );\n\n  // TODO(burdon): Move JoinHeading into Dialog.Heading.\n  return (\n    <Dialog.Content>\n      <Dialog.Title classNames='sr-only'>{t('join-space.label', { ns: osTranslations })}</Dialog.Title>\n      <Dialog.Body>\n        <JoinPanel\n          {...props}\n          exitActionParent={<Dialog.Close asChild />}\n          doneActionParent={<Dialog.Close asChild />}\n          onDone={handleDone}\n        />\n      </Dialog.Body>\n    </Dialog.Content>\n  );\n};\n\nJoinDialog.displayName = 'JoinDialog';\n"],"mappings":";;;;;;;;;;;AAmB2B,GAAG,KAAK,QAAQ,IAAhB;AAM3B,IAAa,cAAc,EAAE,sBAAsB,QAAQ,GAAG,YAA6B;CACzF,MAAM,EAAE,kBAAkB,oBAAoB;CAC9C,MAAM,SAAS,UAAU;CACzB,MAAM,EAAE,MAAM,eAAe,KAAK,QAAQ,GAAG;CAE7C,MAAM,aAAa,YACjB,OAAO,WAAoC;EACzC,MAAM,WAAW,QAAQ;EACzB,IAAI,CAAC,UACH;EAGF,MAAM,QAAQ,IAAI,CAChB,cAAc,gBAAgB,UAAU;GACtC,IAAI,GAAG,KAAK,QAAQ,IAAI;GACxB,UAAU;GACV,OAAO,CAAC,sBAAsB,EAAE,IAAI,KAAK,QAAQ,IAAI,CAAC;GACtD,YAAY,CAAC,iBAAiB,EAAE,IAAI,KAAK,QAAQ,IAAI,CAAC;EACxD,CAAC,GACD,cAAc,gBAAgB,cAAc,EAAE,OAAO,MAAM,CAAC,CAC9D,CAAC;EAED,IAAI,QAAQ,OAAO,OAAO,IAAI,QAAQ;EACtC,IAAI,CAAC,OAAO;GAEV,MAAM,UAAU,IAAI,QAAe;GACnC,OAAO,OAAO,gBAAgB;IAC5B,MAAM,QAAQ,OAAO,OAAO,IAAI,QAAQ;IACxC,IAAI,OACF,QAAQ,KAAK,KAAK;GAEtB,CAAC;GACD,QAAQ,MAAM,QAAQ,KAAK;EAC7B;EAIA,MAAM,cAAc,gBAAgB,MAAM;GACxC,SAAS,CAAC,UAAU,iBAAiB,MAAM,EAAE,CAAC;GAC9C,WAAW,UAAU,aAAa,MAAM,EAAE;GAC1C,YAAY;EACd,CAAC;EAED,SAAS,MAAM;EAEf,IAAI,OACF,MAAM,cAAc,uBAAuB,WAAW;GACpD,MAAM;GACN,YAAY,EACV,SAAS,MAAM,GACjB;EACF,CAAC;CAEL,GACA;EAAC;EAAe;EAAQ;EAAsB;CAAM,CACtD;CAGA,OACE,qBAAC,OAAO,SAAR,EAAA,UAAA,CACE,oBAAC,OAAO,OAAR;EAAc,YAAW;YAAW,EAAE,oBAAoB,EAAE,IAAI,eAAe,CAAC;CAAgB,CAAA,GAChG,oBAAC,OAAO,MAAR,EAAA,UACE,oBAAC,WAAD;EACE,GAAI;EACJ,kBAAkB,oBAAC,OAAO,OAAR,EAAc,SAAA,KAAS,CAAA;EACzC,kBAAkB,oBAAC,OAAO,OAAR,EAAc,SAAA,KAAS,CAAA;EACzC,QAAQ;CACT,CAAA,EACU,CAAA,CACC,EAAA,CAAA;AAEpB;AAEA,WAAW,cAAc"}

package/dist/lib/chunk-MembersContainer.mjs

@@ -0,0 +1,263 @@
+import { hexToEmoji } from "@dxos/util";
+import { meta } from "#meta";
+import { AppAnnotation } from "@dxos/app-toolkit";
+import { Annotation, Obj } from "@dxos/echo";
+import { SpaceOperation } from "#operations";
+import { AuthCode, BifurcatedAction, Centered, Emoji, InvitationList, SpaceMemberList, Viewport, translationKey } from "@dxos/shell/react";
+import * as Option from "effect/Option";
+import { useMemo, useState } from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { useConfig } from "@dxos/react-client";
+import { useSpaceInvitations } from "@dxos/react-client/echo";
+import { Button, Clipboard, Icon, useId as useId$1, useTranslation } from "@dxos/react-ui";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Form } from "@dxos/react-ui-form";
+import { log } from "@dxos/log";
+import { QR } from "react-qr-rounded";
+import { Invitation, InvitationEncoder } from "@dxos/react-client/invitations";
+//#region src/containers/MembersContainer/MembersContainer.tsx
+var __dxlog_file = "/__w/dxos/dxos/packages/plugins/plugin-space/src/containers/MembersContainer/MembersContainer.tsx";
+var activeActionKey = "dxos:react-shell/space-manager/active-action";
+var handleInvitationEvent = (invitation, subscription) => {
+	const invitationCode = InvitationEncoder.encode(invitation);
+	if (invitation.state === Invitation.State.CONNECTING) {
+		log.info(JSON.stringify({
+			invitationCode,
+			authCode: invitation.authCode
+		}), void 0, {
+			"~LogMeta": "~LogMeta",
+			F: __dxlog_file,
+			L: 41,
+			S: void 0
+		});
+		subscription.unsubscribe();
+	}
+};
+var MembersContainer = ({ space, createInvitationUrl }) => {
+	const { t } = useTranslation(meta.profile.key);
+	const config = useConfig();
+	const { invokePromise } = useOperationInvoker();
+	const visibleInvitations = useSpaceInvitations(space.key)?.filter((invitation) => ![Invitation.State.CANCELLED].includes(invitation.get().state));
+	const [activeAction, setInternalActiveAction] = useState(localStorage.getItem(activeActionKey) ?? "inviteMany");
+	const setActiveAction = (nextAction) => {
+		setInternalActiveAction(nextAction);
+		localStorage.setItem(activeActionKey, nextAction);
+	};
+	const target = Annotation.get(space.properties, AppAnnotation.RootCollectionAnnotation).pipe(Option.getOrUndefined)?.target?.objects[0]?.target;
+	const inviteActions = useMemo(() => ({
+		inviteOne: {
+			label: t("invite-one.label", { ns: translationKey }),
+			description: t("invite-one.description", { ns: translationKey }),
+			icon: "ph--user-plus--regular",
+			testId: "membersContainer.inviteOne",
+			onClick: async () => {
+				const { data: invitation } = await invokePromise(SpaceOperation.Share, {
+					space,
+					type: Invitation.Type.INTERACTIVE,
+					authMethod: Invitation.AuthMethod.SHARED_SECRET,
+					multiUse: false,
+					target: target && Obj.getURI(target)
+				});
+				if (invitation && config.values.runtime?.app?.env?.DX_ENVIRONMENT !== "production") {
+					const subscription = invitation.subscribe((invitation) => handleInvitationEvent(invitation, subscription));
+				}
+			}
+		},
+		inviteMany: {
+			label: t("invite-many.label", { ns: translationKey }),
+			description: t("invite-many.description", { ns: translationKey }),
+			icon: "ph--users-three--regular",
+			testId: "membersContainer.inviteMany",
+			onClick: async () => {
+				const { data: invitation } = await invokePromise(SpaceOperation.Share, {
+					space,
+					type: Invitation.Type.DELEGATED,
+					authMethod: Invitation.AuthMethod.KNOWN_PUBLIC_KEY,
+					multiUse: true,
+					target: target && Obj.getURI(target)
+				});
+				if (invitation && config.values.runtime?.app?.env?.DX_ENVIRONMENT !== "production") {
+					const subscription = invitation.subscribe((invitation) => handleInvitationEvent(invitation, subscription));
+				}
+			}
+		}
+	}), [
+		t,
+		space,
+		target,
+		invokePromise
+	]);
+	const [selectedInvitation, setSelectedInvitation] = useState(null);
+	const handleSend = (event) => {
+		setSelectedInvitation(event.invitation);
+	};
+	const handleBack = () => {
+		setSelectedInvitation(null);
+	};
+	return /* @__PURE__ */ jsx(Clipboard.Provider, { children: /* @__PURE__ */ jsx(Form.Root, {
+		variant: "settings",
+		children: /* @__PURE__ */ jsx(Form.Viewport, {
+			scroll: true,
+			children: /* @__PURE__ */ jsx(Form.Content, { children: /* @__PURE__ */ jsx(Form.Section, {
+				title: t("members-verbose.label"),
+				description: t("members.description"),
+				children: /* @__PURE__ */ jsxs(Form.Group, { children: [/* @__PURE__ */ jsxs("div", {
+					role: "group",
+					className: "min-w-0",
+					children: [/* @__PURE__ */ jsx("h3", {
+						className: "text-lg mb-2",
+						children: t("members.label")
+					}), /* @__PURE__ */ jsx(SpaceMemberList, {
+						spaceKey: space.key,
+						includeSelf: true
+					})]
+				}), /* @__PURE__ */ jsxs("div", {
+					role: "group",
+					className: "min-w-0",
+					children: [
+						/* @__PURE__ */ jsx("h3", {
+							className: "text-lg mb-2",
+							children: t("invitations.label")
+						}),
+						selectedInvitation && /* @__PURE__ */ jsx(InvitationSection, {
+							...selectedInvitation,
+							onBack: handleBack
+						}),
+						!selectedInvitation && /* @__PURE__ */ jsxs(Fragment, { children: [
+							/* @__PURE__ */ jsx("p", {
+								className: "text-description mb-2",
+								children: t("space-invitation.description")
+							}),
+							/* @__PURE__ */ jsx(InvitationList, {
+								className: "mb-2",
+								send: handleSend,
+								invitations: visibleInvitations ?? [],
+								onClickRemove: (invitation) => invitation.cancel(),
+								createInvitationUrl
+							}),
+							/* @__PURE__ */ jsx(BifurcatedAction, {
+								actions: inviteActions,
+								activeAction,
+								onChangeActiveAction: setActiveAction,
+								"data-testid": "membersContainer.createInvitation"
+							})
+						] })
+					]
+				})] })
+			}) })
+		})
+	}) });
+};
+var InvitationSection = ({ state = Invitation.State.INIT, authCode, invitationId = "never", url = "never", onBack }) => {
+	const activeView = state < 0 ? "init" : state >= Invitation.State.CANCELLED ? "complete" : state >= Invitation.State.READY_FOR_AUTHENTICATION && authCode ? "auth-code" : "qr-code";
+	return /* @__PURE__ */ jsx(Viewport.Root, {
+		activeView,
+		children: /* @__PURE__ */ jsxs(Viewport.Views, { children: [
+			/* @__PURE__ */ jsx(Viewport.View, { id: "init" }),
+			/* @__PURE__ */ jsx(Viewport.View, {
+				id: "complete",
+				children: /* @__PURE__ */ jsx(InvitationComplete, { statusValue: state })
+			}),
+			/* @__PURE__ */ jsx(Viewport.View, {
+				id: "auth-code",
+				children: /* @__PURE__ */ jsx(InvitationAuthCode, {
+					id: invitationId,
+					code: authCode ?? "never",
+					onCancel: onBack
+				})
+			}),
+			/* @__PURE__ */ jsx(Viewport.View, {
+				id: "qr-code",
+				children: /* @__PURE__ */ jsx(InvitationQR, {
+					id: invitationId,
+					url,
+					onCancel: onBack
+				})
+			})
+		] })
+	});
+};
+var InvitationQR = ({ id, url, onCancel }) => {
+	const { t } = useTranslation(translationKey);
+	const qrLabel = useId$1("members-container__qr-code");
+	const emoji = hexToEmoji(id);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("p", {
+			className: "text-description",
+			children: t("qr-code.description", { ns: meta.profile.key })
+		}),
+		/* @__PURE__ */ jsxs("div", {
+			role: "group",
+			className: "grid grid-cols-[1fr_min-content] my-2 gap-2",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "w-full aspect-square relative text-description",
+					children: [/* @__PURE__ */ jsx(QR, {
+						rounding: 100,
+						backgroundColor: "transparent",
+						color: "currentColor",
+						"aria-labelledby": qrLabel,
+						errorCorrectionLevel: "Q",
+						cutout: true,
+						children: url ?? "never"
+					}), /* @__PURE__ */ jsx(Centered, { children: /* @__PURE__ */ jsx(Emoji, { text: emoji }) })]
+				}),
+				/* @__PURE__ */ jsx("span", {
+					id: qrLabel,
+					className: "sr-only",
+					children: t("qr.label")
+				}),
+				/* @__PURE__ */ jsx(Clipboard.Button, { value: url ?? "never" })
+			]
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			onClick: onCancel,
+			children: t("cancel.label")
+		})
+	] });
+};
+var InvitationAuthCode = ({ id, code, onCancel }) => {
+	const { t } = useTranslation(translationKey);
+	const emoji = hexToEmoji(id);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("p", {
+			className: "text-description",
+			children: t("auth-other-device-emoji.message")
+		}),
+		emoji && /* @__PURE__ */ jsx(Emoji, {
+			text: emoji,
+			className: "mx-auto my-2 text-center"
+		}),
+		/* @__PURE__ */ jsx("p", {
+			className: "text-description",
+			children: t("auth-code.message")
+		}),
+		/* @__PURE__ */ jsx(AuthCode, {
+			code,
+			large: true,
+			classNames: "mx-auto my-2 text-center grow"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			onClick: onCancel,
+			children: t("cancel.label")
+		})
+	] });
+};
+var InvitationComplete = ({ statusValue }) => {
+	return statusValue > 0 ? /* @__PURE__ */ jsx(Icon, {
+		icon: "ph--check--regular",
+		size: 6,
+		classNames: "m-1.5"
+	}) : /* @__PURE__ */ jsx(Icon, {
+		icon: "ph--x--regular",
+		size: 6,
+		classNames: "m-1.5"
+	});
+};
+MembersContainer.displayName = "MembersContainer";
+//#endregion
+export { MembersContainer as default };
+
+//# sourceMappingURL=chunk-MembersContainer.mjs.map

package/dist/lib/chunk-MembersContainer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chunk-MembersContainer.mjs","names":[],"sources":["../../src/containers/MembersContainer/MembersContainer.tsx"],"sourcesContent":["//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Option from 'effect/Option';\nimport React, { type Dispatch, type SetStateAction, useMemo, useState } from 'react';\nimport { QR } from 'react-qr-rounded';\n\nimport { useOperationInvoker } from '@dxos/app-framework/ui';\nimport { AppAnnotation } from '@dxos/app-toolkit';\nimport { AppSurface } from '@dxos/app-toolkit/ui';\nimport { Annotation, Obj } from '@dxos/echo';\nimport { log } from '@dxos/log';\nimport { useConfig } from '@dxos/react-client';\nimport { useSpaceInvitations } from '@dxos/react-client/echo';\nimport { type CancellableInvitationObservable, Invitation, InvitationEncoder } from '@dxos/react-client/invitations';\nimport { Button, Clipboard, Icon, useId, useTranslation } from '@dxos/react-ui';\nimport { Form } from '@dxos/react-ui-form';\nimport {\n  type ActionMenuItem,\n  AuthCode,\n  BifurcatedAction,\n  Centered,\n  Emoji,\n  InvitationList,\n  SpaceMemberList,\n  Viewport,\n  translationKey as shellTranslationKey,\n} from '@dxos/shell/react';\nimport { hexToEmoji } from '@dxos/util';\n\nimport { meta } from '#meta';\nimport { SpaceOperation } from '#operations';\n\n// TODO(wittjosiah): Copied from Shell.\nconst activeActionKey = 'dxos:react-shell/space-manager/active-action';\n\nconst handleInvitationEvent = (invitation: Invitation, subscription: ZenObservable.Subscription) => {\n  const invitationCode = InvitationEncoder.encode(invitation);\n  if (invitation.state === Invitation.State.CONNECTING) {\n    log.info(JSON.stringify({ invitationCode, authCode: invitation.authCode }));\n    subscription.unsubscribe();\n  }\n};\n\nexport type MembersContainerProps = AppSurface.SpaceArticleProps<{\n  createInvitationUrl: (invitationCode: string) => string;\n}>;\n\nexport const MembersContainer = ({ space, createInvitationUrl }: MembersContainerProps) => {\n  const { t } = useTranslation(meta.profile.key);\n  const config = useConfig();\n  const { invokePromise } = useOperationInvoker();\n  const invitations = useSpaceInvitations(space.key);\n  const visibleInvitations = invitations?.filter(\n    (invitation) => ![Invitation.State.CANCELLED].includes(invitation.get().state),\n  );\n\n  const [activeAction, setInternalActiveAction] = useState(localStorage.getItem(activeActionKey) ?? 'inviteMany');\n\n  const setActiveAction = (nextAction: string) => {\n    setInternalActiveAction(nextAction);\n    localStorage.setItem(activeActionKey, nextAction);\n  };\n\n  // TODO(wittjosiah): Track which was the most recently viewed object.\n  const target = Annotation.get(space.properties, AppAnnotation.RootCollectionAnnotation).pipe(Option.getOrUndefined)\n    ?.target?.objects[0]?.target;\n\n  const inviteActions = useMemo(\n    (): Record<string, ActionMenuItem> => ({\n      inviteOne: {\n        label: t('invite-one.label', { ns: shellTranslationKey }),\n        description: t('invite-one.description', { ns: shellTranslationKey }),\n        icon: 'ph--user-plus--regular',\n        testId: 'membersContainer.inviteOne',\n        onClick: async () => {\n          const { data: invitation } = await invokePromise(SpaceOperation.Share, {\n            space,\n            type: Invitation.Type.INTERACTIVE,\n            authMethod: Invitation.AuthMethod.SHARED_SECRET,\n            multiUse: false,\n            target: target && Obj.getURI(target),\n          });\n          if (invitation && config.values.runtime?.app?.env?.DX_ENVIRONMENT !== 'production') {\n            const subscription: ZenObservable.Subscription = (invitation as CancellableInvitationObservable).subscribe(\n              (invitation: Invitation) => handleInvitationEvent(invitation, subscription),\n            );\n          }\n        },\n      },\n      inviteMany: {\n        label: t('invite-many.label', { ns: shellTranslationKey }),\n        description: t('invite-many.description', { ns: shellTranslationKey }),\n        icon: 'ph--users-three--regular',\n        testId: 'membersContainer.inviteMany',\n        onClick: async () => {\n          const { data: invitation } = await invokePromise(SpaceOperation.Share, {\n            space,\n            type: Invitation.Type.DELEGATED,\n            authMethod: Invitation.AuthMethod.KNOWN_PUBLIC_KEY,\n            multiUse: true,\n            target: target && Obj.getURI(target),\n          });\n          if (invitation && config.values.runtime?.app?.env?.DX_ENVIRONMENT !== 'production') {\n            const subscription: ZenObservable.Subscription = (invitation as CancellableInvitationObservable).subscribe(\n              (invitation: Invitation) => handleInvitationEvent(invitation, subscription),\n            );\n          }\n        },\n      },\n    }),\n    [t, space, target, invokePromise],\n  );\n\n  const [selectedInvitation, setSelectedInvitation] = useState<CancellableInvitationObservable | null>(null);\n  const handleSend = (event: { type: 'selectInvitation'; invitation: CancellableInvitationObservable }) => {\n    setSelectedInvitation(event.invitation);\n  };\n  const handleBack = () => {\n    setSelectedInvitation(null);\n  };\n\n  return (\n    <Clipboard.Provider>\n      <Form.Root variant='settings'>\n        <Form.Viewport scroll>\n          <Form.Content>\n            <Form.Section title={t('members-verbose.label')} description={t('members.description')}>\n              <Form.Group>\n                <div role='group' className='min-w-0'>\n                  <h3 className='text-lg mb-2'>{t('members.label')}</h3>\n                  <SpaceMemberList spaceKey={space.key} includeSelf />\n                </div>\n                <div role='group' className='min-w-0'>\n                  <h3 className='text-lg mb-2'>{t('invitations.label')}</h3>\n                  {selectedInvitation && <InvitationSection {...selectedInvitation} onBack={handleBack} />}\n                  {!selectedInvitation && (\n                    <>\n                      <p className='text-description mb-2'>{t('space-invitation.description')}</p>\n                      <InvitationList\n                        className='mb-2'\n                        send={handleSend}\n                        invitations={visibleInvitations ?? []}\n                        onClickRemove={(invitation) => invitation.cancel()}\n                        createInvitationUrl={createInvitationUrl}\n                      />\n                      <BifurcatedAction\n                        actions={inviteActions}\n                        activeAction={activeAction}\n                        onChangeActiveAction={setActiveAction as Dispatch<SetStateAction<string>>}\n                        data-testid='membersContainer.createInvitation'\n                      />\n                    </>\n                  )}\n                </div>\n              </Form.Group>\n            </Form.Section>\n          </Form.Content>\n        </Form.Viewport>\n      </Form.Root>\n    </Clipboard.Provider>\n  );\n};\n\n// TODO(wittjosiah): Reconcile the below components with DevicesContainer in @dxos/plugin-client.\n\ntype InvitationComponentProps = Partial<\n  Pick<Invitation, 'authCode' | 'invitationId'> & {\n    state: Invitation.State;\n    url: string;\n    onBack: () => void;\n  }\n>;\n\nconst InvitationSection = ({\n  state = Invitation.State.INIT,\n  authCode,\n  invitationId = 'never',\n  url = 'never',\n  onBack,\n}: InvitationComponentProps) => {\n  const activeView =\n    state < 0\n      ? 'init'\n      : state >= Invitation.State.CANCELLED\n        ? 'complete'\n        : state >= Invitation.State.READY_FOR_AUTHENTICATION && authCode\n          ? 'auth-code'\n          : 'qr-code';\n  return (\n    <Viewport.Root activeView={activeView}>\n      <Viewport.Views>\n        <Viewport.View id='init'>\n          {/* This view intentionally left blank while conditionally rendering the viewport. */}\n        </Viewport.View>\n        <Viewport.View id='complete'>\n          <InvitationComplete statusValue={state} />\n        </Viewport.View>\n        <Viewport.View id='auth-code'>\n          <InvitationAuthCode id={invitationId} code={authCode ?? 'never'} onCancel={onBack} />\n        </Viewport.View>\n        <Viewport.View id='qr-code'>\n          <InvitationQR id={invitationId} url={url} onCancel={onBack} />\n        </Viewport.View>\n      </Viewport.Views>\n    </Viewport.Root>\n  );\n};\n\nconst InvitationQR = ({ id, url, onCancel }: { id: string; url: string; onCancel?: () => void }) => {\n  const { t } = useTranslation(shellTranslationKey);\n  const qrLabel = useId('members-container__qr-code');\n  const emoji = hexToEmoji(id);\n  return (\n    <>\n      <p className='text-description'>{t('qr-code.description', { ns: meta.profile.key })}</p>\n      <div role='group' className='grid grid-cols-[1fr_min-content] my-2 gap-2'>\n        <div className='w-full aspect-square relative text-description'>\n          <QR\n            rounding={100}\n            backgroundColor='transparent'\n            color='currentColor'\n            aria-labelledby={qrLabel}\n            errorCorrectionLevel='Q'\n            cutout={true}\n          >\n            {url ?? 'never'}\n          </QR>\n          <Centered>\n            <Emoji text={emoji} />\n          </Centered>\n        </div>\n        <span id={qrLabel} className='sr-only'>\n          {t('qr.label')}\n        </span>\n        <Clipboard.Button value={url ?? 'never'} />\n      </div>\n      <Button variant='ghost' onClick={onCancel}>\n        {t('cancel.label')}\n      </Button>\n    </>\n  );\n};\n\nconst InvitationAuthCode = ({ id, code, onCancel }: { id: string; code: string; onCancel?: () => void }) => {\n  const { t } = useTranslation(shellTranslationKey);\n  const emoji = hexToEmoji(id);\n\n  return (\n    <>\n      <p className='text-description'>{t('auth-other-device-emoji.message')}</p>\n      {emoji && <Emoji text={emoji} className='mx-auto my-2 text-center' />}\n      <p className='text-description'>{t('auth-code.message')}</p>\n      <AuthCode code={code} large classNames='mx-auto my-2 text-center grow' />\n      <Button variant='ghost' onClick={onCancel}>\n        {t('cancel.label')}\n      </Button>\n    </>\n  );\n};\n\nconst InvitationComplete = ({ statusValue }: { statusValue: number }) => {\n  return statusValue > 0 ? (\n    <Icon icon='ph--check--regular' size={6} classNames='m-1.5' />\n  ) : (\n    <Icon icon='ph--x--regular' size={6} classNames='m-1.5' />\n  );\n};\n\nMembersContainer.displayName = 'MembersContainer';\n"],"mappings":"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"}