@dxos/plugin-client 0.8.4-main.fffef41 → 0.8.4-staging.60fe92afc8

package/dist/lib/neutral/InvitationsContainer-ME722VKS.mjs

@@ -0,0 +1,132 @@
+import {
+  useHubHttpClient
+} from "./chunk-JEF2FQGB.mjs";
+import "./chunk-J5LGTIGS.mjs";
+
+// src/containers/InvitationsContainer/InvitationsContainer.tsx
+import { useAtom, useAtomSet } from "@effect-atom/atom-react";
+import React, { useCallback, useState } from "react";
+import { useCapability } from "@dxos/app-framework/ui";
+import { Context } from "@dxos/context";
+import { Clipboard, Icon, IconButton, List, ListItem, useAsyncEffect, useTranslation } from "@dxos/react-ui";
+import { Settings } from "@dxos/react-ui-form";
+import { meta } from "#meta";
+import { ClientCapabilities } from "#types";
+var __dxlog_file = "/__w/dxos/dxos/packages/plugins/plugin-client/src/containers/InvitationsContainer/InvitationsContainer.tsx";
+var InvitationsContainer = () => {
+  const { t } = useTranslation(meta.id);
+  const accountCacheAtom = useCapability(ClientCapabilities.AccountCache);
+  const [cache] = useAtom(accountCacheAtom);
+  const setCache = useAtomSet(accountCacheAtom);
+  const [pending, setPending] = useState(false);
+  const hubHttp = useHubHttpClient();
+  useAsyncEffect(async () => {
+    if (!hubHttp) {
+      return;
+    }
+    try {
+      const result = await hubHttp.listAccountInvitations(new Context(void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 26 }));
+      setCache((prev) => ({
+        ...prev,
+        invitations: result.invitations,
+        fetchedAt: Date.now()
+      }));
+    } catch {
+    }
+  }, [
+    hubHttp,
+    setCache
+  ]);
+  const handleIssue = useCallback(async () => {
+    if (!hubHttp) {
+      return;
+    }
+    setPending(true);
+    try {
+      const result = await hubHttp.issueAccountInvitation(new Context(void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 45 }));
+      setCache((prev) => ({
+        ...prev,
+        account: prev.account ? {
+          ...prev.account,
+          invitationsRemaining: Math.max(0, prev.account.invitationsRemaining - 1)
+        } : prev.account,
+        invitations: [
+          {
+            code: result.code,
+            createdAt: (/* @__PURE__ */ new Date()).toISOString()
+          },
+          ...prev.invitations ?? []
+        ]
+      }));
+    } finally {
+      setPending(false);
+    }
+  }, [
+    hubHttp,
+    setCache
+  ]);
+  const remaining = cache.account?.invitationsRemaining ?? 0;
+  const list = cache.invitations ?? [];
+  const available = list.filter((row) => !row.redeemedByIdentityDid);
+  const redeemed = list.filter((row) => Boolean(row.redeemedByIdentityDid));
+  return /* @__PURE__ */ React.createElement(Clipboard.Provider, null, /* @__PURE__ */ React.createElement(Settings.Viewport, null, /* @__PURE__ */ React.createElement(Settings.Section, {
+    title: t("invitations-section.title"),
+    description: t("invitations-section.description")
+  }, /* @__PURE__ */ React.createElement(Settings.Item, {
+    title: t("generate-invitation.label"),
+    description: t("generate-invitation.description", {
+      count: remaining
+    })
+  }, /* @__PURE__ */ React.createElement(IconButton, {
+    icon: "ph--plus--regular",
+    label: t("generate-invitation.label"),
+    variant: "primary",
+    onClick: handleIssue,
+    disabled: pending || remaining <= 0
+  }))), available.length > 0 ? /* @__PURE__ */ React.createElement(Settings.Section, {
+    title: t("available-invitations.title")
+  }, /* @__PURE__ */ React.createElement(List, null, available.map((row) => /* @__PURE__ */ React.createElement(AvailableInvitationItem, {
+    key: row.code,
+    row
+  })))) : null, redeemed.length > 0 ? /* @__PURE__ */ React.createElement(Settings.Section, {
+    title: t("redeemed-invitations.title")
+  }, /* @__PURE__ */ React.createElement(List, null, redeemed.map((row) => /* @__PURE__ */ React.createElement(RedeemedInvitationItem, {
+    key: row.code,
+    row
+  })))) : null));
+};
+var AvailableInvitationItem = ({ row }) => /* @__PURE__ */ React.createElement(ListItem.Root, {
+  classNames: "grid grid-cols-[min-content_1fr_min-content] items-center gap-2"
+}, /* @__PURE__ */ React.createElement(ListItem.Endcap, null, /* @__PURE__ */ React.createElement(Icon, {
+  icon: "ph--paper-plane-tilt--duotone",
+  size: 5,
+  classNames: "text-description"
+})), /* @__PURE__ */ React.createElement("div", {
+  className: "flex flex-col min-w-0"
+}, /* @__PURE__ */ React.createElement(ListItem.Heading, {
+  classNames: "font-mono truncate"
+}, row.code), /* @__PURE__ */ React.createElement("p", {
+  className: "text-description text-xs"
+}, new Date(row.createdAt).toLocaleString())), /* @__PURE__ */ React.createElement(ListItem.Endcap, null, /* @__PURE__ */ React.createElement(Clipboard.IconButton, {
+  value: row.code
+})));
+var RedeemedInvitationItem = ({ row }) => {
+  const date = row.redeemedAt ?? row.createdAt;
+  return /* @__PURE__ */ React.createElement(ListItem.Root, {
+    classNames: "grid grid-cols-[min-content_1fr] items-center gap-2"
+  }, /* @__PURE__ */ React.createElement(ListItem.Endcap, null, /* @__PURE__ */ React.createElement(Icon, {
+    icon: "ph--check-circle--duotone",
+    size: 5,
+    classNames: "text-success-text"
+  })), /* @__PURE__ */ React.createElement("div", {
+    className: "flex flex-col min-w-0"
+  }, /* @__PURE__ */ React.createElement(ListItem.Heading, {
+    classNames: "font-mono truncate"
+  }, row.code), /* @__PURE__ */ React.createElement("p", {
+    className: "text-description text-xs"
+  }, new Date(date).toLocaleString())));
+};
+export {
+  InvitationsContainer as default
+};
+//# sourceMappingURL=InvitationsContainer-ME722VKS.mjs.map

package/dist/lib/neutral/InvitationsContainer-ME722VKS.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/containers/InvitationsContainer/InvitationsContainer.tsx"],
+  "sourcesContent": ["//\n// Copyright 2026 DXOS.org\n//\n\nimport { useAtom, useAtomSet } from '@effect-atom/atom-react';\nimport React, { useCallback, useState } from 'react';\n\nimport { useCapability } from '@dxos/app-framework/ui';\nimport { Context } from '@dxos/context';\nimport { Clipboard, Icon, IconButton, List, ListItem, useAsyncEffect, useTranslation } from '@dxos/react-ui';\nimport { Settings } from '@dxos/react-ui-form';\n\nimport { meta } from '#meta';\nimport { ClientCapabilities } from '#types';\n\nimport { type AccountCacheInvitation } from '../../state/account-cache';\nimport { useHubHttpClient } from '../../state/use-hub-http';\n\nexport const InvitationsContainer = () => {\n  const { t } = useTranslation(meta.id);\n  const accountCacheAtom = useCapability(ClientCapabilities.AccountCache);\n  const [cache] = useAtom(accountCacheAtom);\n  const setCache = useAtomSet(accountCacheAtom);\n  const [pending, setPending] = useState(false);\n\n  // Account/invitation routes live on hub-service, not the edge worker.\n  const hubHttp = useHubHttpClient();\n\n  useAsyncEffect(async () => {\n    if (!hubHttp) {\n      return;\n    }\n    try {\n      const result = await hubHttp.listAccountInvitations(new Context());\n      setCache((prev) => ({ ...prev, invitations: result.invitations, fetchedAt: Date.now() }));\n    } catch {\n      // Offline: keep cache.\n    }\n  }, [hubHttp, setCache]);\n\n  const handleIssue = useCallback(async () => {\n    if (!hubHttp) {\n      return;\n    }\n    setPending(true);\n    try {\n      const result = await hubHttp.issueAccountInvitation(new Context());\n      // Optimistically push the new code and decrement the remaining quota; the\n      // server consumes one slot at issue time. Next refresh reconciles.\n      setCache((prev) => ({\n        ...prev,\n        account: prev.account\n          ? { ...prev.account, invitationsRemaining: Math.max(0, prev.account.invitationsRemaining - 1) }\n          : prev.account,\n        invitations: [{ code: result.code, createdAt: new Date().toISOString() }, ...(prev.invitations ?? [])],\n      }));\n    } finally {\n      setPending(false);\n    }\n  }, [hubHttp, setCache]);\n\n  const remaining = cache.account?.invitationsRemaining ?? 0;\n  const list = cache.invitations ?? [];\n  const available = list.filter((row) => !row.redeemedByIdentityDid);\n  const redeemed = list.filter((row) => Boolean(row.redeemedByIdentityDid));\n\n  return (\n    <Clipboard.Provider>\n      <Settings.Viewport>\n        <Settings.Section title={t('invitations-section.title')} description={t('invitations-section.description')}>\n          <Settings.Item\n            title={t('generate-invitation.label')}\n            description={t('generate-invitation.description', { count: remaining })}\n          >\n            <IconButton\n              icon='ph--plus--regular'\n              label={t('generate-invitation.label')}\n              variant='primary'\n              onClick={handleIssue}\n              disabled={pending || remaining <= 0}\n            />\n          </Settings.Item>\n        </Settings.Section>\n\n        {available.length > 0 ? (\n          <Settings.Section title={t('available-invitations.title')}>\n            <List>\n              {available.map((row) => (\n                <AvailableInvitationItem key={row.code} row={row} />\n              ))}\n            </List>\n          </Settings.Section>\n        ) : null}\n\n        {redeemed.length > 0 ? (\n          <Settings.Section title={t('redeemed-invitations.title')}>\n            <List>\n              {redeemed.map((row) => (\n                <RedeemedInvitationItem key={row.code} row={row} />\n              ))}\n            </List>\n          </Settings.Section>\n        ) : null}\n      </Settings.Viewport>\n    </Clipboard.Provider>\n  );\n};\n\nconst AvailableInvitationItem = ({ row }: { row: AccountCacheInvitation }) => (\n  <ListItem.Root classNames='grid grid-cols-[min-content_1fr_min-content] items-center gap-2'>\n    <ListItem.Endcap>\n      <Icon icon='ph--paper-plane-tilt--duotone' size={5} classNames='text-description' />\n    </ListItem.Endcap>\n    <div className='flex flex-col min-w-0'>\n      <ListItem.Heading classNames='font-mono truncate'>{row.code}</ListItem.Heading>\n      <p className='text-description text-xs'>{new Date(row.createdAt).toLocaleString()}</p>\n    </div>\n    <ListItem.Endcap>\n      <Clipboard.IconButton value={row.code} />\n    </ListItem.Endcap>\n  </ListItem.Root>\n);\n\nconst RedeemedInvitationItem = ({ row }: { row: AccountCacheInvitation }) => {\n  const date = row.redeemedAt ?? row.createdAt;\n  return (\n    <ListItem.Root classNames='grid grid-cols-[min-content_1fr] items-center gap-2'>\n      <ListItem.Endcap>\n        <Icon icon='ph--check-circle--duotone' size={5} classNames='text-success-text' />\n      </ListItem.Endcap>\n      <div className='flex flex-col min-w-0'>\n        <ListItem.Heading classNames='font-mono truncate'>{row.code}</ListItem.Heading>\n        <p className='text-description text-xs'>{new Date(date).toLocaleString()}</p>\n      </div>\n    </ListItem.Root>\n  );\n};\n"],
+  "mappings": "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",
+  "names": ["useAtom", "useAtomSet", "React", "useCallback", "useState", "useCapability", "Context", "Clipboard", "Icon", "IconButton", "List", "ListItem", "useAsyncEffect", "useTranslation", "Settings", "meta", "ClientCapabilities", "InvitationsContainer", "accountCacheAtom", "useCapability", "cache", "setCache", "useAtomSet", "pending", "setPending", "hubHttp", "useHubHttpClient", "invitations", "fetchedAt", "result", "account", "prev", "invitationsRemaining", "code", "available", "list", "filter", "row", "redeemedByIdentityDid", "redeemed", "Clipboard", "title", "Settings", "t", "count", "remaining", "icon", "variant", "onClick", "handleIssue", "disabled", "List", "key", "map", "AvailableInvitationItem", "classNames", "className", "ListItem", "Heading", "p", "Date", "toLocaleString", "value", "RedeemedInvitationItem", "Endcap"]
+}

package/dist/lib/neutral/JoinDialog-2NXAKPLP.mjs

@@ -0,0 +1,53 @@
+import "./chunk-J5LGTIGS.mjs";
+
+// src/containers/JoinDialog/JoinDialog.tsx
+import React, { useCallback } from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { LayoutOperation } from "@dxos/app-toolkit";
+import { ObservabilityOperation } from "@dxos/plugin-observability";
+import { Dialog, useTranslation } from "@dxos/react-ui";
+import { JoinPanel } from "@dxos/shell/react";
+import { osTranslations } from "@dxos/ui-theme";
+import { meta } from "#meta";
+import { ClientOperation } from "#operations";
+var JoinDialog = (props) => {
+  const { invokePromise } = useOperationInvoker();
+  const { t } = useTranslation(meta.id);
+  const handleCancelResetStorage = useCallback(() => invokePromise(ClientOperation.ShareIdentity), [
+    invokePromise
+  ]);
+  const handleDone = useCallback(async (result) => {
+    if (result?.identityKey) {
+      await Promise.all([
+        invokePromise(LayoutOperation.UpdateDialog, {
+          state: false
+        }),
+        invokePromise(ObservabilityOperation.SendEvent, {
+          name: props.initialDisposition === "recover-identity" ? "identity.recover" : "identity.join"
+        })
+      ]);
+    }
+  }, [
+    invokePromise
+  ]);
+  return /* @__PURE__ */ React.createElement(Dialog.Content, null, /* @__PURE__ */ React.createElement(Dialog.Header, null, /* @__PURE__ */ React.createElement(Dialog.Title, {
+    classNames: "sr-only"
+  }, t("join-space.label", {
+    ns: osTranslations
+  }))), /* @__PURE__ */ React.createElement(Dialog.Body, null, /* @__PURE__ */ React.createElement(JoinPanel, {
+    ...props,
+    mode: "halo-only",
+    exitActionParent: /* @__PURE__ */ React.createElement(Dialog.Close, {
+      asChild: true
+    }),
+    doneActionParent: /* @__PURE__ */ React.createElement(Dialog.Close, {
+      asChild: true
+    }),
+    onCancelResetStorage: handleCancelResetStorage,
+    onDone: handleDone
+  })));
+};
+export {
+  JoinDialog as default
+};
+//# sourceMappingURL=JoinDialog-2NXAKPLP.mjs.map

package/dist/lib/neutral/JoinDialog-2NXAKPLP.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "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 { LayoutOperation } from '@dxos/app-toolkit';\nimport { ObservabilityOperation } from '@dxos/plugin-observability';\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';\nimport { ClientOperation } from '#operations';\n\nexport const JoinDialog = (props: JoinPanelProps) => {\n  const { invokePromise } = useOperationInvoker();\n  const { t } = useTranslation(meta.id);\n\n  const handleCancelResetStorage = useCallback(() => invokePromise(ClientOperation.ShareIdentity), [invokePromise]);\n\n  const handleDone = useCallback(\n    async (result: InvitationResult | null) => {\n      if (result?.identityKey) {\n        await Promise.all([\n          invokePromise(LayoutOperation.UpdateDialog, { state: false }),\n          invokePromise(ObservabilityOperation.SendEvent, {\n            name: props.initialDisposition === 'recover-identity' ? 'identity.recover' : 'identity.join',\n          }),\n        ]);\n      }\n    },\n    [invokePromise],\n  );\n\n  // TODO(burdon): Move JoinHeading into Dialog.Heading.\n  return (\n    <Dialog.Content>\n      <Dialog.Header>\n        <Dialog.Title classNames='sr-only'>{t('join-space.label', { ns: osTranslations })}</Dialog.Title>\n      </Dialog.Header>\n      <Dialog.Body>\n        <JoinPanel\n          {...props}\n          mode='halo-only'\n          exitActionParent={<Dialog.Close asChild />}\n          doneActionParent={<Dialog.Close asChild />}\n          onCancelResetStorage={handleCancelResetStorage}\n          onDone={handleDone}\n        />\n      </Dialog.Body>\n    </Dialog.Content>\n  );\n};\n"],
+  "mappings": ";;;AAIA,OAAOA,SAASC,mBAAmB;AAEnC,SAASC,2BAA2B;AACpC,SAASC,uBAAuB;AAChC,SAASC,8BAA8B;AAEvC,SAASC,QAAQC,sBAAsB;AACvC,SAASC,iBAAsC;AAC/C,SAASC,sBAAsB;AAE/B,SAASC,YAAY;AACrB,SAASC,uBAAuB;AAEzB,IAAMC,aAAa,CAACC,UAAAA;AACzB,QAAM,EAAEC,cAAa,IAAKX,oBAAAA;AAC1B,QAAM,EAAEY,EAAC,IAAKR,eAAeG,KAAKM,EAAE;AAEpC,QAAMC,2BAA2Bf,YAAY,MAAMY,cAAcH,gBAAgBO,aAAa,GAAG;IAACJ;GAAc;AAEhH,QAAMK,aAAajB,YACjB,OAAOkB,WAAAA;AACL,QAAIA,QAAQC,aAAa;AACvB,YAAMC,QAAQC,IAAI;QAChBT,cAAcV,gBAAgBoB,cAAc;UAAEC,OAAO;QAAM,CAAA;QAC3DX,cAAcT,uBAAuBqB,WAAW;UAC9CC,MAAMd,MAAMe,uBAAuB,qBAAqB,qBAAqB;QAC/E,CAAA;OACD;IACH;EACF,GACA;IAACd;GAAc;AAIjB,SACE,sBAAA,cAACR,OAAOuB,SAAO,MACb,sBAAA,cAACvB,OAAOwB,QAAM,MACZ,sBAAA,cAACxB,OAAOyB,OAAK;IAACC,YAAW;KAAWjB,EAAE,oBAAoB;IAAEkB,IAAIxB;EAAe,CAAA,CAAA,CAAA,GAEjF,sBAAA,cAACH,OAAO4B,MAAI,MACV,sBAAA,cAAC1B,WAAAA;IACE,GAAGK;IACJsB,MAAK;IACLC,kBAAkB,sBAAA,cAAC9B,OAAO+B,OAAK;MAACC,SAAAA;;IAChCC,kBAAkB,sBAAA,cAACjC,OAAO+B,OAAK;MAACC,SAAAA;;IAChCE,sBAAsBvB;IACtBwB,QAAQtB;;AAKlB;",
+  "names": ["React", "useCallback", "useOperationInvoker", "LayoutOperation", "ObservabilityOperation", "Dialog", "useTranslation", "JoinPanel", "osTranslations", "meta", "ClientOperation", "JoinDialog", "props", "invokePromise", "t", "id", "handleCancelResetStorage", "ShareIdentity", "handleDone", "result", "identityKey", "Promise", "all", "UpdateDialog", "state", "SendEvent", "name", "initialDisposition", "Content", "Header", "Title", "classNames", "ns", "Body", "mode", "exitActionParent", "Close", "asChild", "doneActionParent", "onCancelResetStorage", "onDone"]
+}

package/dist/lib/neutral/ProfileContainer-VPX3FPWG.mjs

@@ -0,0 +1,168 @@
+import "./chunk-J5LGTIGS.mjs";
+
+// src/containers/ProfileContainer/ProfileContainer.tsx
+import * as Schema from "effect/Schema";
+import React, { useCallback, useMemo, useState } from "react";
+import { debounce } from "@dxos/async";
+import { useClient } from "@dxos/react-client";
+import { useIdentity } from "@dxos/react-client/halo";
+import { ButtonGroup, Clipboard, Input, useTranslation } from "@dxos/react-ui";
+import { Form, Settings } from "@dxos/react-ui-form";
+import { EmojiPickerBlock, HuePicker } from "@dxos/react-ui-pickers";
+import { hexToEmoji, hexToHue } from "@dxos/util";
+import { meta } from "#meta";
+var UserProfile = Schema.Struct({
+  did: Schema.String.annotations({
+    title: "DID"
+  }),
+  displayName: Schema.String.annotations({
+    title: "Display name"
+  }),
+  emoji: Schema.String.annotations({
+    title: "Avatar"
+  }),
+  hue: Schema.String.annotations({
+    title: "Color"
+  })
+});
+var getDefaultHueValue = (identity) => hexToHue(identity?.identityKey.toHex() ?? "0");
+var getHueValue = (identity) => identity?.profile?.data?.hue || getDefaultHueValue(identity);
+var getDefaultEmojiValue = (identity) => hexToEmoji(identity?.identityKey.toHex() ?? "0");
+var getEmojiValue = (identity) => identity?.profile?.data?.emoji || getDefaultEmojiValue(identity);
+var ProfileContainer = () => {
+  const { t } = useTranslation(meta.id);
+  const client = useClient();
+  const identity = useIdentity();
+  const [displayName, setDisplayNameDirectly] = useState(identity?.profile?.displayName ?? "");
+  const [emoji, setEmojiDirectly] = useState(getEmojiValue(identity));
+  const [hue, setHueDirectly] = useState(getHueValue(identity));
+  const updateProfile = useMemo(() => debounce((profile) => client.halo.updateProfile({
+    displayName: profile.displayName,
+    data: {
+      emoji: profile.emoji,
+      hue: profile.hue
+    }
+  }), 2e3), []);
+  const handleChange = useCallback((profile, meta2) => {
+    for (const [path, changed] of Object.entries(meta2.changed)) {
+      if (changed) {
+        switch (path) {
+          case "displayName":
+            setDisplayNameDirectly(profile.displayName ?? "");
+            break;
+          case "emoji":
+            setEmojiDirectly(profile.emoji ?? getDefaultEmojiValue(identity));
+            break;
+          case "hue":
+            setHueDirectly(profile.hue ?? getDefaultHueValue(identity));
+            break;
+          default:
+            break;
+        }
+      }
+    }
+    void updateProfile(profile);
+  }, [
+    identity
+  ]);
+  const values = useMemo(() => ({
+    did: identity?.did,
+    displayName,
+    emoji,
+    hue
+  }), [
+    identity,
+    displayName,
+    emoji,
+    hue
+  ]);
+  const fieldMap = useMemo(() => ({
+    displayName: ({ type, label, getValue, onValueChange }) => {
+      const handleChange2 = useCallback(({ target: { value } }) => onValueChange(type, value), [
+        onValueChange,
+        type
+      ]);
+      return /* @__PURE__ */ React.createElement(Settings.Item, {
+        title: label,
+        description: t("display-name.description")
+      }, /* @__PURE__ */ React.createElement(Input.TextInput, {
+        value: getValue(),
+        onChange: handleChange2,
+        placeholder: t("display-name-input.placeholder"),
+        classNames: "min-w-64"
+      }));
+    },
+    emoji: ({ type, label, getValue, onValueChange }) => {
+      const handleChange2 = useCallback((nextEmoji) => onValueChange(type, nextEmoji), [
+        onValueChange,
+        type
+      ]);
+      const handleEmojiReset = useCallback(() => onValueChange(type, getDefaultEmojiValue(identity)), [
+        onValueChange,
+        type
+      ]);
+      return /* @__PURE__ */ React.createElement(Settings.Item, {
+        title: label,
+        description: t("icon.description")
+      }, /* @__PURE__ */ React.createElement(EmojiPickerBlock, {
+        triggerVariant: "default",
+        emoji: getValue(),
+        onChangeEmoji: handleChange2,
+        onClickClear: handleEmojiReset,
+        classNames: "justify-self-end"
+      }));
+    },
+    hue: ({ type, label, getValue, onValueChange }) => {
+      const handleChange2 = useCallback((nextHue) => onValueChange(type, nextHue), [
+        onValueChange,
+        type
+      ]);
+      const handleHueReset = useCallback(() => onValueChange(type, getDefaultHueValue(identity)), [
+        onValueChange,
+        type
+      ]);
+      return /* @__PURE__ */ React.createElement(Settings.Item, {
+        title: label,
+        description: t("hue.description")
+      }, /* @__PURE__ */ React.createElement("div", {
+        className: "flex justify-self-end"
+      }, /* @__PURE__ */ React.createElement(HuePicker, {
+        value: getValue(),
+        onChange: handleChange2,
+        onReset: handleHueReset
+      })));
+    },
+    // TODO(wittjosiah): We need text input annotations for disabled and copyable.
+    did: ({ label, getValue }) => {
+      return /* @__PURE__ */ React.createElement(Settings.Item, {
+        title: label,
+        description: t("did.description")
+      }, /* @__PURE__ */ React.createElement(ButtonGroup, {
+        classNames: "w-full"
+      }, /* @__PURE__ */ React.createElement(Input.TextInput, {
+        value: getValue(),
+        disabled: true,
+        classNames: "min-w-64"
+      }), /* @__PURE__ */ React.createElement(Clipboard.IconButton, {
+        value: getValue() ?? ""
+      })));
+    }
+  }), [
+    t
+  ]);
+  return /* @__PURE__ */ React.createElement(Clipboard.Provider, null, /* @__PURE__ */ React.createElement(Settings.Viewport, null, /* @__PURE__ */ React.createElement(Settings.Section, {
+    title: t("profile.label"),
+    description: t("profile.description")
+  }, /* @__PURE__ */ React.createElement(Form.Root, {
+    schema: UserProfile,
+    values,
+    fieldMap,
+    onValuesChanged: handleChange
+  }, /* @__PURE__ */ React.createElement(Form.Content, {
+    classNames: "gap-form-gap"
+  }, /* @__PURE__ */ React.createElement(Form.FieldSet, null))))));
+};
+export {
+  ProfileContainer as default
+};
+//# sourceMappingURL=ProfileContainer-VPX3FPWG.mjs.map

package/dist/lib/neutral/ProfileContainer-VPX3FPWG.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/containers/ProfileContainer/ProfileContainer.tsx"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\nimport React, { type ChangeEvent, useCallback, useMemo, useState } from 'react';\n\nimport { debounce } from '@dxos/async';\nimport { useClient } from '@dxos/react-client';\nimport { type Identity, useIdentity } from '@dxos/react-client/halo';\nimport { ButtonGroup, Clipboard, Input, useTranslation } from '@dxos/react-ui';\nimport { Form, type FormFieldMap, type FormUpdateMeta, Settings } from '@dxos/react-ui-form';\nimport { EmojiPickerBlock, HuePicker } from '@dxos/react-ui-pickers';\nimport { hexToEmoji, hexToHue } from '@dxos/util';\n\nimport { meta } from '#meta';\n\n// TOOD(burdon): Factor out?\n// TODO(wittjosiah): Integrate annotations with translations.\nconst UserProfile = Schema.Struct({\n  did: Schema.String.annotations({ title: 'DID' }),\n  displayName: Schema.String.annotations({ title: 'Display name' }),\n  emoji: Schema.String.annotations({ title: 'Avatar' }),\n  hue: Schema.String.annotations({ title: 'Color' }),\n});\n\ntype UserProfile = Schema.Schema.Type<typeof UserProfile>;\n\n// TODO(thure): Factor out?\nconst getDefaultHueValue = (identity: Identity | null) => hexToHue(identity?.identityKey.toHex() ?? '0');\nconst getHueValue = (identity: Identity | null) => identity?.profile?.data?.hue || getDefaultHueValue(identity);\nconst getDefaultEmojiValue = (identity: Identity | null) => hexToEmoji(identity?.identityKey.toHex() ?? '0');\nconst getEmojiValue = (identity: Identity | null) => identity?.profile?.data?.emoji || getDefaultEmojiValue(identity);\n\nexport const ProfileContainer = () => {\n  const { t } = useTranslation(meta.id);\n  const client = useClient();\n  const identity = useIdentity();\n  const [displayName, setDisplayNameDirectly] = useState(identity?.profile?.displayName ?? '');\n  const [emoji, setEmojiDirectly] = useState<string>(getEmojiValue(identity));\n  const [hue, setHueDirectly] = useState<string>(getHueValue(identity));\n\n  const updateProfile = useMemo(\n    () =>\n      debounce(\n        (profile: Partial<UserProfile>) =>\n          client.halo.updateProfile({\n            displayName: profile.displayName,\n            data: {\n              emoji: profile.emoji,\n              hue: profile.hue,\n            },\n          }),\n        2_000,\n      ),\n    [],\n  );\n\n  const handleChange = useCallback(\n    (profile: Partial<UserProfile>, meta: FormUpdateMeta<UserProfile>) => {\n      for (const [path, changed] of Object.entries(meta.changed)) {\n        if (changed) {\n          switch (path) {\n            case 'displayName':\n              setDisplayNameDirectly(profile.displayName ?? '');\n              break;\n            case 'emoji':\n              setEmojiDirectly(profile.emoji ?? getDefaultEmojiValue(identity));\n              break;\n            case 'hue':\n              setHueDirectly(profile.hue ?? getDefaultHueValue(identity));\n              break;\n            default:\n              break;\n          }\n        }\n      }\n\n      void updateProfile(profile);\n    },\n    [identity],\n  );\n\n  const values = useMemo(\n    () => ({\n      did: identity?.did,\n      displayName,\n      emoji,\n      hue,\n    }),\n    [identity, displayName, emoji, hue],\n  );\n\n  // TODO(wittjosiah): Integrate descriptions with the form schema.\n  const fieldMap = useMemo<FormFieldMap>(\n    () => ({\n      displayName: ({ type, label, getValue, onValueChange }) => {\n        const handleChange = useCallback(\n          ({ target: { value } }: ChangeEvent<HTMLInputElement>) => onValueChange(type, value),\n          [onValueChange, type],\n        );\n\n        return (\n          <Settings.Item title={label} description={t('display-name.description')}>\n            <Input.TextInput\n              value={getValue()}\n              onChange={handleChange}\n              placeholder={t('display-name-input.placeholder')}\n              classNames='min-w-64'\n            />\n          </Settings.Item>\n        );\n      },\n      emoji: ({ type, label, getValue, onValueChange }) => {\n        const handleChange = useCallback((nextEmoji: string) => onValueChange(type, nextEmoji), [onValueChange, type]);\n        const handleEmojiReset = useCallback(\n          () => onValueChange(type, getDefaultEmojiValue(identity)),\n          [onValueChange, type],\n        );\n\n        return (\n          <Settings.Item title={label} description={t('icon.description')}>\n            <EmojiPickerBlock\n              triggerVariant='default'\n              emoji={getValue()}\n              onChangeEmoji={handleChange}\n              onClickClear={handleEmojiReset}\n              classNames='justify-self-end'\n            />\n          </Settings.Item>\n        );\n      },\n      hue: ({ type, label, getValue, onValueChange }) => {\n        const handleChange = useCallback((nextHue: string) => onValueChange(type, nextHue), [onValueChange, type]);\n        const handleHueReset = useCallback(\n          () => onValueChange(type, getDefaultHueValue(identity)),\n          [onValueChange, type],\n        );\n\n        return (\n          <Settings.Item title={label} description={t('hue.description')}>\n            <div className='flex justify-self-end'>\n              <HuePicker value={getValue()} onChange={handleChange} onReset={handleHueReset} />\n            </div>\n          </Settings.Item>\n        );\n      },\n      // TODO(wittjosiah): We need text input annotations for disabled and copyable.\n      did: ({ label, getValue }) => {\n        return (\n          <Settings.Item title={label} description={t('did.description')}>\n            <ButtonGroup classNames='w-full'>\n              <Input.TextInput value={getValue()} disabled classNames='min-w-64' />\n              <Clipboard.IconButton value={getValue() ?? ''} />\n            </ButtonGroup>\n          </Settings.Item>\n        );\n      },\n    }),\n    [t],\n  );\n\n  return (\n    <Clipboard.Provider>\n      <Settings.Viewport>\n        <Settings.Section title={t('profile.label')} description={t('profile.description')}>\n          <Form.Root schema={UserProfile} values={values} fieldMap={fieldMap} onValuesChanged={handleChange}>\n            <Form.Content classNames='gap-form-gap'>\n              <Form.FieldSet />\n            </Form.Content>\n          </Form.Root>\n        </Settings.Section>\n      </Settings.Viewport>\n    </Clipboard.Provider>\n  );\n};\n"],
+  "mappings": "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",
+  "names": ["Schema", "React", "useCallback", "useMemo", "useState", "debounce", "useClient", "useIdentity", "ButtonGroup", "Clipboard", "Input", "useTranslation", "Form", "Settings", "EmojiPickerBlock", "HuePicker", "hexToEmoji", "hexToHue", "meta", "UserProfile", "Struct", "did", "String", "annotations", "title", "displayName", "emoji", "hue", "getDefaultHueValue", "identity", "identityKey", "toHex", "getHueValue", "profile", "data", "getDefaultEmojiValue", "getEmojiValue", "ProfileContainer", "t", "id", "client", "setDisplayNameDirectly", "setEmojiDirectly", "setHueDirectly", "updateProfile", "halo", "handleChange", "path", "changed", "Object", "entries", "values", "fieldMap", "type", "label", "getValue", "onValueChange", "target", "value", "Item", "description", "TextInput", "onChange", "placeholder", "classNames", "nextEmoji", "handleEmojiReset", "triggerVariant", "onChangeEmoji", "onClickClear", "nextHue", "handleHueReset", "div", "className", "onReset", "disabled", "IconButton", "Provider", "Viewport", "Section", "Root", "schema", "onValuesChanged", "Content", "FieldSet"]
+}

package/dist/lib/neutral/RecoveryCodeDialog-EWHB6U5T.mjs

@@ -0,0 +1,59 @@
+import "./chunk-J5LGTIGS.mjs";
+
+// src/containers/RecoveryCodeDialog/RecoveryCodeDialog.tsx
+import React, { useCallback, useState } from "react";
+import { AlertDialog, Button, Clipboard, Input, useTranslation } from "@dxos/react-ui";
+import { meta } from "#meta";
+var RecoveryCodeDialog = ({ code }) => {
+  const { t } = useTranslation(meta.id);
+  const [confirmation, setConfirmation] = useState(false);
+  const handleConfirmation = useCallback((checked) => setConfirmation(checked), []);
+  return /* @__PURE__ */ React.createElement(AlertDialog.Content, {
+    size: "md",
+    classNames: "min-h-[15rem]"
+  }, /* @__PURE__ */ React.createElement(AlertDialog.Body, null, /* @__PURE__ */ React.createElement(AlertDialog.Title, null, t("recovery-code-dialog.title")), /* @__PURE__ */ React.createElement(AlertDialog.Description, {
+    classNames: "py-4"
+  }, t("recovery-code-dialog.description")), /* @__PURE__ */ React.createElement(Clipboard.Provider, null, /* @__PURE__ */ React.createElement(Code, {
+    code
+  })), /* @__PURE__ */ React.createElement("div", {
+    className: "flex flex-col py-4 gap-2"
+  }, /* @__PURE__ */ React.createElement("p", null, t("recovery-code-dialog-warning-1.message")), /* @__PURE__ */ React.createElement("p", null, t("recovery-code-dialog-warning-2.message"))), /* @__PURE__ */ React.createElement("div", {
+    className: "flex items-center gap-2 pb-4"
+  }, /* @__PURE__ */ React.createElement(Input.Root, null, /* @__PURE__ */ React.createElement(Input.Checkbox, {
+    "data-testid": "recoveryCode.confirm",
+    checked: confirmation,
+    onCheckedChange: handleConfirmation
+  }), /* @__PURE__ */ React.createElement(Input.Label, null, t("recovery-code-confirmation.label"))))), /* @__PURE__ */ React.createElement(AlertDialog.ActionBar, null, /* @__PURE__ */ React.createElement(AlertDialog.Action, {
+    asChild: true
+  }, /* @__PURE__ */ React.createElement(Button, {
+    "data-testid": "recoveryCode.continue",
+    variant: "primary",
+    disabled: !confirmation
+  }, t("continue.label")))));
+};
+var Code = ({ code }) => {
+  const words = code.split(" ");
+  return /* @__PURE__ */ React.createElement("div", {
+    className: "relative p-2 border border-separator rounded-sm group"
+  }, /* @__PURE__ */ React.createElement(Clipboard.IconButton, {
+    value: code,
+    classNames: "absolute top-2 right-2 invisible group-hover:visible"
+  }), /* @__PURE__ */ React.createElement("div", {
+    className: "grid grid-cols-4"
+  }, words.map((word, i) => /* @__PURE__ */ React.createElement("div", {
+    key: i,
+    className: "flex items-center p-2 gap-2"
+  }, /* @__PURE__ */ React.createElement("div", {
+    className: "w-4 text-xs text-center text-subdued"
+  }, i + 1), /* @__PURE__ */ React.createElement("div", {
+    className: "text-sm"
+  }, word)))));
+};
+
+// src/containers/RecoveryCodeDialog/index.ts
+var RecoveryCodeDialog_default = RecoveryCodeDialog;
+export {
+  RecoveryCodeDialog,
+  RecoveryCodeDialog_default as default
+};
+//# sourceMappingURL=RecoveryCodeDialog-EWHB6U5T.mjs.map

package/dist/lib/neutral/RecoveryCodeDialog-EWHB6U5T.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/containers/RecoveryCodeDialog/RecoveryCodeDialog.tsx", "../../../src/containers/RecoveryCodeDialog/index.ts"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useCallback, useState } from 'react';\n\nimport { AlertDialog, Button, Clipboard, Input, useTranslation } from '@dxos/react-ui';\n\nimport { meta } from '#meta';\n\nexport type RecoveryCodeDialogProps = {\n  code: string;\n};\n\n// TODO(burdon): Should have cancel button.\nexport const RecoveryCodeDialog = ({ code }: RecoveryCodeDialogProps) => {\n  const { t } = useTranslation(meta.id);\n  const [confirmation, setConfirmation] = useState(false);\n\n  const handleConfirmation = useCallback((checked: boolean) => setConfirmation(checked), []);\n\n  return (\n    <AlertDialog.Content size='md' classNames='min-h-[15rem]'>\n      <AlertDialog.Body>\n        <AlertDialog.Title>{t('recovery-code-dialog.title')}</AlertDialog.Title>\n        <AlertDialog.Description classNames='py-4'>{t('recovery-code-dialog.description')}</AlertDialog.Description>\n        <Clipboard.Provider>\n          <Code code={code} />\n        </Clipboard.Provider>\n        <div className='flex flex-col py-4 gap-2'>\n          <p>{t('recovery-code-dialog-warning-1.message')}</p>\n          <p>{t('recovery-code-dialog-warning-2.message')}</p>\n        </div>\n        <div className='flex items-center gap-2 pb-4'>\n          <Input.Root>\n            <Input.Checkbox\n              data-testid='recoveryCode.confirm'\n              checked={confirmation}\n              onCheckedChange={handleConfirmation}\n            />\n            <Input.Label>{t('recovery-code-confirmation.label')}</Input.Label>\n          </Input.Root>\n        </div>\n      </AlertDialog.Body>\n      <AlertDialog.ActionBar>\n        <AlertDialog.Action asChild>\n          <Button data-testid='recoveryCode.continue' variant='primary' disabled={!confirmation}>\n            {t('continue.label')}\n          </Button>\n        </AlertDialog.Action>\n      </AlertDialog.ActionBar>\n    </AlertDialog.Content>\n  );\n};\n\nconst Code = ({ code }: { code: string }) => {\n  const words = code.split(' ');\n  return (\n    <div className='relative p-2 border border-separator rounded-sm group'>\n      <Clipboard.IconButton value={code} classNames='absolute top-2 right-2 invisible group-hover:visible' />\n      <div className='grid grid-cols-4'>\n        {words.map((word, i) => (\n          <div key={i} className='flex items-center p-2 gap-2'>\n            <div className='w-4 text-xs text-center text-subdued'>{i + 1}</div>\n            <div className='text-sm'>{word}</div>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { RecoveryCodeDialog } from './RecoveryCodeDialog';\n\nexport * from './RecoveryCodeDialog';\nexport default RecoveryCodeDialog;\n"],
+  "mappings": ";;;AAIA,OAAOA,SAASC,aAAaC,gBAAgB;AAE7C,SAASC,aAAaC,QAAQC,WAAWC,OAAOC,sBAAsB;AAEtE,SAASC,YAAY;AAOd,IAAMC,qBAAqB,CAAC,EAAEC,KAAI,MAA2B;AAClE,QAAM,EAAEC,EAAC,IAAKJ,eAAeC,KAAKI,EAAE;AACpC,QAAM,CAACC,cAAcC,eAAAA,IAAmBZ,SAAS,KAAA;AAEjD,QAAMa,qBAAqBd,YAAY,CAACe,YAAqBF,gBAAgBE,OAAAA,GAAU,CAAA,CAAE;AAEzF,SACE,sBAAA,cAACb,YAAYc,SAAO;IAACC,MAAK;IAAKC,YAAW;KACxC,sBAAA,cAAChB,YAAYiB,MAAI,MACf,sBAAA,cAACjB,YAAYkB,OAAK,MAAEV,EAAE,4BAAA,CAAA,GACtB,sBAAA,cAACR,YAAYmB,aAAW;IAACH,YAAW;KAAQR,EAAE,kCAAA,CAAA,GAC9C,sBAAA,cAACN,UAAUkB,UAAQ,MACjB,sBAAA,cAACC,MAAAA;IAAKd;OAER,sBAAA,cAACe,OAAAA;IAAIC,WAAU;KACb,sBAAA,cAACC,KAAAA,MAAGhB,EAAE,wCAAA,CAAA,GACN,sBAAA,cAACgB,KAAAA,MAAGhB,EAAE,wCAAA,CAAA,CAAA,GAER,sBAAA,cAACc,OAAAA;IAAIC,WAAU;KACb,sBAAA,cAACpB,MAAMsB,MAAI,MACT,sBAAA,cAACtB,MAAMuB,UAAQ;IACbC,eAAY;IACZd,SAASH;IACTkB,iBAAiBhB;MAEnB,sBAAA,cAACT,MAAM0B,OAAK,MAAErB,EAAE,kCAAA,CAAA,CAAA,CAAA,CAAA,GAItB,sBAAA,cAACR,YAAY8B,WAAS,MACpB,sBAAA,cAAC9B,YAAY+B,QAAM;IAACC,SAAAA;KAClB,sBAAA,cAAC/B,QAAAA;IAAO0B,eAAY;IAAwBM,SAAQ;IAAUC,UAAU,CAACxB;KACtEF,EAAE,gBAAA,CAAA,CAAA,CAAA,CAAA;AAMf;AAEA,IAAMa,OAAO,CAAC,EAAEd,KAAI,MAAoB;AACtC,QAAM4B,QAAQ5B,KAAK6B,MAAM,GAAA;AACzB,SACE,sBAAA,cAACd,OAAAA;IAAIC,WAAU;KACb,sBAAA,cAACrB,UAAUmC,YAAU;IAACC,OAAO/B;IAAMS,YAAW;MAC9C,sBAAA,cAACM,OAAAA;IAAIC,WAAU;KACZY,MAAMI,IAAI,CAACC,MAAMC,MAChB,sBAAA,cAACnB,OAAAA;IAAIoB,KAAKD;IAAGlB,WAAU;KACrB,sBAAA,cAACD,OAAAA;IAAIC,WAAU;KAAwCkB,IAAI,CAAA,GAC3D,sBAAA,cAACnB,OAAAA;IAAIC,WAAU;KAAWiB,IAAAA,CAAAA,CAAAA,CAAAA,CAAAA;AAMtC;;;AC/DA,IAAA,6BAAeG;",
+  "names": ["React", "useCallback", "useState", "AlertDialog", "Button", "Clipboard", "Input", "useTranslation", "meta", "RecoveryCodeDialog", "code", "t", "id", "confirmation", "setConfirmation", "handleConfirmation", "checked", "Content", "size", "classNames", "Body", "Title", "Description", "Provider", "Code", "div", "className", "p", "Root", "Checkbox", "data-testid", "onCheckedChange", "Label", "ActionBar", "Action", "asChild", "variant", "disabled", "words", "split", "IconButton", "value", "map", "word", "i", "key", "RecoveryCodeDialog"]
+}

package/dist/lib/neutral/RecoveryCredentialsContainer-IPBGDMIA.mjs

@@ -0,0 +1,51 @@
+import "./chunk-J5LGTIGS.mjs";
+
+// src/containers/RecoveryCredentialsContainer/RecoveryCredentialsContainer.tsx
+import React from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { useCredentials } from "@dxos/react-client/halo";
+import { Icon, IconButton, List, ListItem, Message, useTranslation } from "@dxos/react-ui";
+import { Settings } from "@dxos/react-ui-form";
+import { meta } from "#meta";
+import { ClientOperation } from "#operations";
+var MANAGE_CREDENTIALS_DIALOG = `${meta.id}.ManageCredentialsDialog`;
+var RecoveryCredentialsContainer = () => {
+  const { t } = useTranslation(meta.id);
+  const { invokePromise } = useOperationInvoker();
+  const credentials = useCredentials();
+  const recoveryCredentials = credentials.filter((credential) => credential.subject.assertion["@type"] === "dxos.halo.credentials.IdentityRecovery");
+  return /* @__PURE__ */ React.createElement(Settings.Viewport, null, /* @__PURE__ */ React.createElement(Settings.Section, {
+    title: t("recovery-setup-dialog.title"),
+    description: t("recovery-setup-dialog.description")
+  }, /* @__PURE__ */ React.createElement(Settings.Item, {
+    title: t("create-passkey.label"),
+    description: t("create-passkey.description")
+  }, /* @__PURE__ */ React.createElement(IconButton, {
+    label: t("create-passkey.label"),
+    icon: "ph--key--duotone",
+    variant: "primary",
+    onClick: () => invokePromise(ClientOperation.CreatePasskey)
+  })), /* @__PURE__ */ React.createElement(Settings.Item, {
+    title: t("create-recovery-code.label"),
+    description: t("create-recovery-code.description")
+  }, /* @__PURE__ */ React.createElement(IconButton, {
+    label: t("create-recovery-code.label"),
+    icon: "ph--receipt--duotone",
+    variant: "default",
+    onClick: () => invokePromise(ClientOperation.CreateRecoveryCode)
+  }))), /* @__PURE__ */ React.createElement(Settings.Section, {
+    title: t("credentials-list.label")
+  }, recoveryCredentials.length < 1 ? /* @__PURE__ */ React.createElement(Message.Root, {
+    valence: "error"
+  }, /* @__PURE__ */ React.createElement(Message.Title, {
+    icon: "ph--shield-warning--duotone"
+  }, t("no-credentials.title")), /* @__PURE__ */ React.createElement(Message.Content, null, t("no-credentials.message"))) : /* @__PURE__ */ React.createElement(List, null, recoveryCredentials.map((credential) => /* @__PURE__ */ React.createElement(ListItem.Root, {
+    key: credential.id?.toHex()
+  }, /* @__PURE__ */ React.createElement(ListItem.Endcap, null, /* @__PURE__ */ React.createElement(Icon, {
+    icon: "ph--key--regular"
+  })), /* @__PURE__ */ React.createElement(ListItem.Heading, null, credential.issuanceDate.toLocaleString()))))));
+};
+export {
+  RecoveryCredentialsContainer as default
+};
+//# sourceMappingURL=RecoveryCredentialsContainer-IPBGDMIA.mjs.map

package/dist/lib/neutral/RecoveryCredentialsContainer-IPBGDMIA.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/containers/RecoveryCredentialsContainer/RecoveryCredentialsContainer.tsx"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport { useOperationInvoker } from '@dxos/app-framework/ui';\nimport { useCredentials } from '@dxos/react-client/halo';\nimport { Icon, IconButton, List, ListItem, Message, useTranslation } from '@dxos/react-ui';\nimport { Settings } from '@dxos/react-ui-form';\n\nimport { meta } from '#meta';\nimport { ClientOperation } from '#operations';\n\nexport const MANAGE_CREDENTIALS_DIALOG = `${meta.id}.ManageCredentialsDialog`;\n\nexport const RecoveryCredentialsContainer = () => {\n  const { t } = useTranslation(meta.id);\n  const { invokePromise } = useOperationInvoker();\n  const credentials = useCredentials();\n  const recoveryCredentials = credentials.filter(\n    (credential) => credential.subject.assertion['@type'] === 'dxos.halo.credentials.IdentityRecovery',\n  );\n\n  return (\n    <Settings.Viewport>\n      <Settings.Section title={t('recovery-setup-dialog.title')} description={t('recovery-setup-dialog.description')}>\n        <Settings.Item title={t('create-passkey.label')} description={t('create-passkey.description')}>\n          <IconButton\n            label={t('create-passkey.label')}\n            icon='ph--key--duotone'\n            variant='primary'\n            onClick={() => invokePromise(ClientOperation.CreatePasskey)}\n          />\n        </Settings.Item>\n        <Settings.Item title={t('create-recovery-code.label')} description={t('create-recovery-code.description')}>\n          <IconButton\n            label={t('create-recovery-code.label')}\n            icon='ph--receipt--duotone'\n            variant='default'\n            onClick={() => invokePromise(ClientOperation.CreateRecoveryCode)}\n          />\n        </Settings.Item>\n      </Settings.Section>\n      <Settings.Section title={t('credentials-list.label')}>\n        {recoveryCredentials.length < 1 ? (\n          <Message.Root valence='error'>\n            <Message.Title icon='ph--shield-warning--duotone'>{t('no-credentials.title')}</Message.Title>\n            <Message.Content>{t('no-credentials.message')}</Message.Content>\n          </Message.Root>\n        ) : (\n          <List>\n            {recoveryCredentials.map((credential) => (\n              <ListItem.Root key={credential.id?.toHex()}>\n                <ListItem.Endcap>\n                  <Icon icon='ph--key--regular' />\n                </ListItem.Endcap>\n                <ListItem.Heading>{credential.issuanceDate.toLocaleString()}</ListItem.Heading>\n              </ListItem.Root>\n            ))}\n          </List>\n        )}\n      </Settings.Section>\n    </Settings.Viewport>\n  );\n};\n"],
+  "mappings": ";;;AAIA,OAAOA,WAAW;AAElB,SAASC,2BAA2B;AACpC,SAASC,sBAAsB;AAC/B,SAASC,MAAMC,YAAYC,MAAMC,UAAUC,SAASC,sBAAsB;AAC1E,SAASC,gBAAgB;AAEzB,SAASC,YAAY;AACrB,SAASC,uBAAuB;AAEzB,IAAMC,4BAA4B,GAAGF,KAAKG,EAAE;AAE5C,IAAMC,+BAA+B,MAAA;AAC1C,QAAM,EAAEC,EAAC,IAAKP,eAAeE,KAAKG,EAAE;AACpC,QAAM,EAAEG,cAAa,IAAKf,oBAAAA;AAC1B,QAAMgB,cAAcf,eAAAA;AACpB,QAAMgB,sBAAsBD,YAAYE,OACtC,CAACC,eAAeA,WAAWC,QAAQC,UAAU,OAAA,MAAa,wCAAA;AAG5D,SACE,sBAAA,cAACb,SAASc,UAAQ,MAChB,sBAAA,cAACd,SAASe,SAAO;IAACC,OAAOV,EAAE,6BAAA;IAAgCW,aAAaX,EAAE,mCAAA;KACxE,sBAAA,cAACN,SAASkB,MAAI;IAACF,OAAOV,EAAE,sBAAA;IAAyBW,aAAaX,EAAE,4BAAA;KAC9D,sBAAA,cAACX,YAAAA;IACCwB,OAAOb,EAAE,sBAAA;IACTc,MAAK;IACLC,SAAQ;IACRC,SAAS,MAAMf,cAAcL,gBAAgBqB,aAAa;OAG9D,sBAAA,cAACvB,SAASkB,MAAI;IAACF,OAAOV,EAAE,4BAAA;IAA+BW,aAAaX,EAAE,kCAAA;KACpE,sBAAA,cAACX,YAAAA;IACCwB,OAAOb,EAAE,4BAAA;IACTc,MAAK;IACLC,SAAQ;IACRC,SAAS,MAAMf,cAAcL,gBAAgBsB,kBAAkB;QAIrE,sBAAA,cAACxB,SAASe,SAAO;IAACC,OAAOV,EAAE,wBAAA;KACxBG,oBAAoBgB,SAAS,IAC5B,sBAAA,cAAC3B,QAAQ4B,MAAI;IAACC,SAAQ;KACpB,sBAAA,cAAC7B,QAAQ8B,OAAK;IAACR,MAAK;KAA+Bd,EAAE,sBAAA,CAAA,GACrD,sBAAA,cAACR,QAAQ+B,SAAO,MAAEvB,EAAE,wBAAA,CAAA,CAAA,IAGtB,sBAAA,cAACV,MAAAA,MACEa,oBAAoBqB,IAAI,CAACnB,eACxB,sBAAA,cAACd,SAAS6B,MAAI;IAACK,KAAKpB,WAAWP,IAAI4B,MAAAA;KACjC,sBAAA,cAACnC,SAASoC,QAAM,MACd,sBAAA,cAACvC,MAAAA;IAAK0B,MAAK;OAEb,sBAAA,cAACvB,SAASqC,SAAO,MAAEvB,WAAWwB,aAAaC,eAAc,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAQzE;",
+  "names": ["React", "useOperationInvoker", "useCredentials", "Icon", "IconButton", "List", "ListItem", "Message", "useTranslation", "Settings", "meta", "ClientOperation", "MANAGE_CREDENTIALS_DIALOG", "id", "RecoveryCredentialsContainer", "t", "invokePromise", "credentials", "recoveryCredentials", "filter", "credential", "subject", "assertion", "Viewport", "Section", "title", "description", "Item", "label", "icon", "variant", "onClick", "CreatePasskey", "CreateRecoveryCode", "length", "Root", "valence", "Title", "Content", "map", "key", "toHex", "Endcap", "Heading", "issuanceDate", "toLocaleString"]
+}

package/dist/lib/neutral/ResetDialog-KUWX45JY.mjs

@@ -0,0 +1,57 @@
+import "./chunk-J5LGTIGS.mjs";
+
+// src/containers/ResetDialog/ResetDialog.tsx
+import * as Effect from "effect/Effect";
+import React, { useCallback } from "react";
+import { Capability } from "@dxos/app-framework";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { LayoutOperation } from "@dxos/app-toolkit";
+import { EffectEx } from "@dxos/effect";
+import { useClient } from "@dxos/react-client";
+import { Dialog, useTranslation } from "@dxos/react-ui";
+import { ConfirmReset, translationKey } from "@dxos/shell/react";
+var ResetDialog = ({ mode, onReset, onBeforeReset, capabilityManager }) => {
+  const { t } = useTranslation(translationKey);
+  const { invokePromise } = useOperationInvoker();
+  const client = useClient();
+  const handleReset = useCallback(async () => {
+    if (onBeforeReset) {
+      await onBeforeReset();
+    }
+    await client.reset();
+    const target = mode === "join-new-identity" ? "deviceInvitation" : mode === "recover" ? "recoverIdentity" : void 0;
+    if (onReset) {
+      await EffectEx.runAndForwardErrors(onReset({
+        target
+      }).pipe(Effect.provideService(Capability.Service, capabilityManager)));
+    }
+  }, [
+    client,
+    mode,
+    onReset,
+    capabilityManager
+  ]);
+  const handleCancel = useCallback(() => {
+    void invokePromise(LayoutOperation.UpdateDialog, {
+      state: false
+    });
+  }, [
+    invokePromise
+  ]);
+  return /* @__PURE__ */ React.createElement(Dialog.Content, null, /* @__PURE__ */ React.createElement(Dialog.Header, null, /* @__PURE__ */ React.createElement(Dialog.Title, null, t("reset-dialog.title"))), /* @__PURE__ */ React.createElement(Dialog.Body, null, /* @__PURE__ */ React.createElement(Dialog.Description, {
+    classNames: "sr-only"
+  }, t("reset-dialog.description")), /* @__PURE__ */ React.createElement(ConfirmReset, {
+    active: true,
+    mode,
+    onConfirm: handleReset,
+    onCancel: handleCancel
+  })));
+};
+
+// src/containers/ResetDialog/index.ts
+var ResetDialog_default = ResetDialog;
+export {
+  ResetDialog,
+  ResetDialog_default as default
+};
+//# sourceMappingURL=ResetDialog-KUWX45JY.mjs.map