@dxos/plugin-client 0.8.3 → 0.8.4-main.1068cf700f

package/dist/lib/browser/chunk-5MC5HCIM.mjs

@@ -1,693 +0,0 @@
-import {
-  ClientAction
-} from "./chunk-IA3AVM4I.mjs";
-import {
-  CLIENT_PLUGIN
-} from "./chunk-MCEXD5XH.mjs";
-
-// packages/plugins/plugin-client/src/components/DevicesContainer.tsx
-import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
-import { Check, X } from "@phosphor-icons/react";
-import React, { useCallback, useEffect, useState } from "react";
-import { QR } from "react-qr-rounded";
-import { createIntent, useIntentDispatcher } from "@dxos/app-framework";
-import { log } from "@dxos/log";
-import { useClient, useMulticastObservable } from "@dxos/react-client";
-import { useDevices } from "@dxos/react-client/halo";
-import { Invitation, InvitationEncoder } from "@dxos/react-client/invitations";
-import { useNetworkStatus } from "@dxos/react-client/mesh";
-import { Button, Clipboard, IconButton, List, useId, useTranslation } from "@dxos/react-ui";
-import { ControlFrame, ControlFrameItem, ControlGroup, ControlItem, ControlPage, ControlSection } from "@dxos/react-ui-form";
-import { StackItem } from "@dxos/react-ui-stack";
-import { getSize, mx } from "@dxos/react-ui-theme";
-import { AuthCode, Centered, DeviceListItem, Emoji, Viewport } from "@dxos/shell/react";
-import { hexToEmoji } from "@dxos/util";
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-client/src/components/DevicesContainer.tsx";
-var DevicesContainer = ({ createInvitationUrl }) => {
-  var _effect = _useSignals();
-  try {
-    const { t } = useTranslation("os");
-    const { dispatchPromise: dispatch } = useIntentDispatcher();
-    const devices = useDevices();
-    const { swarm: connectionState } = useNetworkStatus();
-    const handleResetStorage = useCallback(() => dispatch(createIntent(ClientAction.ResetStorage)), [
-      dispatch
-    ]);
-    const handleRecover = useCallback(() => dispatch(createIntent(ClientAction.ResetStorage, {
-      mode: "recover"
-    })), [
-      dispatch
-    ]);
-    const handleJoinNewIdentity = useCallback(() => dispatch(createIntent(ClientAction.ResetStorage, {
-      mode: "join new identity"
-    })), [
-      dispatch
-    ]);
-    return /* @__PURE__ */ React.createElement(Clipboard.Provider, null, /* @__PURE__ */ React.createElement(StackItem.Content, {
-      classNames: "block overflow-y-auto"
-    }, /* @__PURE__ */ React.createElement(ControlPage, null, /* @__PURE__ */ React.createElement(ControlSection, {
-      title: t("devices verbose label", {
-        ns: CLIENT_PLUGIN
-      }),
-      description: t("devices description", {
-        ns: CLIENT_PLUGIN
-      })
-    }, /* @__PURE__ */ React.createElement(ControlFrame, null, /* @__PURE__ */ React.createElement(ControlFrameItem, {
-      title: t("devices label", {
-        ns: CLIENT_PLUGIN
-      })
-    }, /* @__PURE__ */ React.createElement(List, null, devices.map((device) => {
-      return /* @__PURE__ */ React.createElement(DeviceListItem, {
-        key: device.deviceKey.toHex(),
-        device,
-        connectionState
-      });
-    }))), createInvitationUrl && /* @__PURE__ */ React.createElement(ControlFrameItem, {
-      title: "Add device"
-    }, /* @__PURE__ */ React.createElement(DeviceInvitation, {
-      createInvitationUrl
-    })))), /* @__PURE__ */ React.createElement(ControlSection, {
-      title: t("danger zone title", {
-        ns: CLIENT_PLUGIN
-      }),
-      description: t("danger zone description", {
-        ns: CLIENT_PLUGIN
-      })
-    }, /* @__PURE__ */ React.createElement(ControlGroup, null, /* @__PURE__ */ React.createElement(ControlItem, {
-      title: t("reset device label"),
-      description: t("reset device description", {
-        ns: CLIENT_PLUGIN
-      })
-    }, /* @__PURE__ */ React.createElement(Button, {
-      variant: "destructive",
-      onClick: handleResetStorage,
-      "data-testid": "devicesContainer.reset"
-    }, t("reset device label"))), /* @__PURE__ */ React.createElement(ControlItem, {
-      title: t("recover identity label"),
-      description: t("recover identity description", {
-        ns: CLIENT_PLUGIN
-      })
-    }, /* @__PURE__ */ React.createElement(Button, {
-      variant: "destructive",
-      onClick: handleRecover,
-      "data-testid": "devicesContainer.recover"
-    }, t("recover identity label"))), /* @__PURE__ */ React.createElement(ControlItem, {
-      title: t("join new identity label"),
-      description: t("join new identity description", {
-        ns: CLIENT_PLUGIN
-      })
-    }, /* @__PURE__ */ React.createElement(Button, {
-      variant: "destructive",
-      onClick: handleJoinNewIdentity,
-      "data-testid": "devicesContainer.joinExisting"
-    }, t("join new identity label"))))))));
-  } finally {
-    _effect.f();
-  }
-};
-var DeviceInvitation = (props) => {
-  var _effect = _useSignals();
-  try {
-    const client = useClient();
-    const [invitation, setInvitation] = useState();
-    const onInvitationCreate = useCallback(() => {
-      const invitation2 = client.halo.share();
-      if (client.config.values.runtime?.app?.env?.DX_ENVIRONMENT !== "production") {
-        const subscription = invitation2.subscribe((invitation3) => {
-          const invitationCode = InvitationEncoder.encode(invitation3);
-          if (invitation3.state === Invitation.State.CONNECTING) {
-            log.info(JSON.stringify({
-              invitationCode,
-              authCode: invitation3.authCode
-            }), void 0, {
-              F: __dxlog_file,
-              L: 141,
-              S: void 0,
-              C: (f, a) => f(...a)
-            });
-            subscription.unsubscribe();
-          }
-        });
-      }
-      setInvitation(invitation2);
-    }, [
-      client
-    ]);
-    const onInvitationDone = useCallback(() => {
-      setInvitation(void 0);
-    }, []);
-    if (invitation) {
-      return /* @__PURE__ */ React.createElement(DeviceInvitationImpl, {
-        ...props,
-        invitation,
-        onInvitationCreate,
-        onInvitationDone
-      });
-    } else {
-      return /* @__PURE__ */ React.createElement(InvitationSection, {
-        ...props,
-        onInvitationCreate,
-        onInvitationDone
-      });
-    }
-  } finally {
-    _effect.f();
-  }
-};
-var DeviceInvitationImpl = ({ invitation: invitationObservable, createInvitationUrl, onInvitationDone, onInvitationCreate }) => {
-  var _effect = _useSignals();
-  try {
-    const invitation = useMulticastObservable(invitationObservable);
-    const url = createInvitationUrl(InvitationEncoder.encode(invitation));
-    useEffect(() => {
-      if (invitation.state >= Invitation.State.SUCCESS) {
-        onInvitationDone();
-      }
-    }, [
-      invitation.state
-    ]);
-    return /* @__PURE__ */ React.createElement(InvitationSection, {
-      ...invitation,
-      url,
-      onInvitationDone,
-      onInvitationCreate
-    });
-  } finally {
-    _effect.f();
-  }
-};
-var InvitationSection = ({ state = -1, authCode, invitationId = "never", url = "never", onInvitationDone = () => {
-}, onInvitationCreate = () => {
-} }) => {
-  var _effect = _useSignals();
-  try {
-    const { t } = useTranslation(CLIENT_PLUGIN);
-    const activeView = state < 0 ? "init" : state >= Invitation.State.CANCELLED ? "complete" : state >= Invitation.State.READY_FOR_AUTHENTICATION && authCode ? "auth-code" : "qr-code";
-    return activeView === "init" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", {
-      className: "text-description mbe-2"
-    }, t("add device description")), /* @__PURE__ */ React.createElement(IconButton, {
-      icon: "ph--plus--regular",
-      label: t("create device invitation label"),
-      disabled: state >= 0,
-      classNames: "is-full",
-      "data-testid": "devicesContainer.createInvitation",
-      onClick: onInvitationCreate
-    })) : /* @__PURE__ */ React.createElement(Viewport.Root, {
-      activeView
-    }, /* @__PURE__ */ React.createElement(Viewport.Views, null, /* @__PURE__ */ React.createElement(Viewport.View, {
-      id: "init"
-    }), /* @__PURE__ */ React.createElement(Viewport.View, {
-      id: "complete"
-    }, /* @__PURE__ */ React.createElement(InvitationComplete, {
-      statusValue: state
-    })), /* @__PURE__ */ React.createElement(Viewport.View, {
-      id: "auth-code"
-    }, /* @__PURE__ */ React.createElement(InvitationAuthCode, {
-      id: invitationId,
-      code: authCode ?? "never",
-      onCancel: onInvitationDone
-    })), /* @__PURE__ */ React.createElement(Viewport.View, {
-      id: "qr-code"
-    }, /* @__PURE__ */ React.createElement(InvitationQR, {
-      id: invitationId,
-      url,
-      onCancel: onInvitationDone
-    }))));
-  } finally {
-    _effect.f();
-  }
-};
-var InvitationQR = ({ id, url, onCancel }) => {
-  var _effect = _useSignals();
-  try {
-    const { t } = useTranslation("os");
-    const qrLabel = useId("devices-container__qr-code");
-    const emoji = hexToEmoji(id);
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", {
-      className: "text-description"
-    }, t("qr code description", {
-      ns: CLIENT_PLUGIN
-    })), /* @__PURE__ */ React.createElement("div", {
-      role: "group",
-      className: "grid grid-cols-[1fr_min-content] mlb-2 gap-2"
-    }, /* @__PURE__ */ React.createElement("div", {
-      role: "none",
-      className: "is-full aspect-square relative text-description"
-    }, /* @__PURE__ */ React.createElement(QR, {
-      rounding: 100,
-      backgroundColor: "transparent",
-      color: "currentColor",
-      "aria-labelledby": qrLabel,
-      errorCorrectionLevel: "Q",
-      cutout: true
-    }, url ?? "never"), /* @__PURE__ */ React.createElement(Centered, null, /* @__PURE__ */ React.createElement(Emoji, {
-      text: emoji
-    }))), /* @__PURE__ */ React.createElement("span", {
-      id: qrLabel,
-      className: "sr-only"
-    }, t("qr label"))), /* @__PURE__ */ React.createElement("div", {
-      className: "flex justify-center"
-    }, /* @__PURE__ */ React.createElement("div", {
-      className: "flex gap-2"
-    }, /* @__PURE__ */ React.createElement(Clipboard.Button, {
-      value: url ?? "never"
-    }), /* @__PURE__ */ React.createElement(Button, {
-      variant: "ghost",
-      onClick: onCancel
-    }, t("cancel label")))));
-  } finally {
-    _effect.f();
-  }
-};
-var InvitationAuthCode = ({ id, code, onCancel }) => {
-  var _effect = _useSignals();
-  try {
-    const { t } = useTranslation("os");
-    const emoji = hexToEmoji(id);
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", {
-      className: "text-description"
-    }, t("auth other device emoji message")), emoji && /* @__PURE__ */ React.createElement(Emoji, {
-      text: emoji,
-      className: "mli-auto mlb-2 text-center"
-    }), /* @__PURE__ */ React.createElement("p", {
-      className: "text-description"
-    }, t("auth code message")), /* @__PURE__ */ React.createElement(AuthCode, {
-      code,
-      large: true,
-      classNames: "mli-auto mlb-2 text-center grow"
-    }), /* @__PURE__ */ React.createElement(Button, {
-      variant: "ghost",
-      onClick: onCancel
-    }, t("cancel label")));
-  } finally {
-    _effect.f();
-  }
-};
-var InvitationComplete = ({ statusValue }) => {
-  var _effect = _useSignals();
-  try {
-    return statusValue > 0 ? /* @__PURE__ */ React.createElement(Check, {
-      className: mx("m-1.5", getSize(6))
-    }) : /* @__PURE__ */ React.createElement(X, {
-      className: mx("m-1.5", getSize(6))
-    });
-  } finally {
-    _effect.f();
-  }
-};
-
-// packages/plugins/plugin-client/src/components/JoinDialog.tsx
-import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
-import React2, { useCallback as useCallback2 } from "react";
-import { createIntent as createIntent2, LayoutAction, useIntentDispatcher as useIntentDispatcher2 } from "@dxos/app-framework";
-import { ObservabilityAction } from "@dxos/plugin-observability/types";
-import { Dialog, useTranslation as useTranslation2 } from "@dxos/react-ui";
-import { JoinPanel } from "@dxos/shell/react";
-var JOIN_DIALOG = `${CLIENT_PLUGIN}/JoinDialog`;
-var JoinDialog = (props) => {
-  var _effect = _useSignals2();
-  try {
-    const { dispatchPromise: dispatch } = useIntentDispatcher2();
-    const { t } = useTranslation2(CLIENT_PLUGIN);
-    const handleCancelResetStorage = useCallback2(() => dispatch(createIntent2(ClientAction.ShareIdentity)), [
-      dispatch
-    ]);
-    const handleDone = useCallback2(async (result) => {
-      if (result?.identityKey) {
-        await Promise.all([
-          dispatch(createIntent2(LayoutAction.UpdateDialog, {
-            part: "dialog",
-            options: {
-              state: false
-            }
-          })),
-          dispatch(createIntent2(ObservabilityAction.SendEvent, {
-            name: props.initialDisposition === "recover-identity" ? "identity.recover" : "identity.join"
-          }))
-        ]);
-      }
-    }, [
-      dispatch
-    ]);
-    return /* @__PURE__ */ React2.createElement(Dialog.Content, null, /* @__PURE__ */ React2.createElement(Dialog.Title, {
-      classNames: "sr-only"
-    }, t("join space label", {
-      ns: "os"
-    })), /* @__PURE__ */ React2.createElement(JoinPanel, {
-      mode: "halo-only",
-      ...props,
-      exitActionParent: /* @__PURE__ */ React2.createElement(Dialog.Close, {
-        asChild: true
-      }),
-      doneActionParent: /* @__PURE__ */ React2.createElement(Dialog.Close, {
-        asChild: true
-      }),
-      onCancelResetStorage: handleCancelResetStorage,
-      onDone: handleDone
-    }));
-  } finally {
-    _effect.f();
-  }
-};
-
-// packages/plugins/plugin-client/src/components/ProfileContainer.tsx
-import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
-import { Schema } from "effect";
-import React3, { useCallback as useCallback3, useMemo, useState as useState2 } from "react";
-import { debounce } from "@dxos/async";
-import { useClient as useClient2 } from "@dxos/react-client";
-import { useIdentity } from "@dxos/react-client/halo";
-import { ButtonGroup, Clipboard as Clipboard2, Input, useTranslation as useTranslation3 } from "@dxos/react-ui";
-import { Form, ControlItem as ControlItem2, ControlItemInput, ControlSection as ControlSection2, ControlPage as ControlPage2 } from "@dxos/react-ui-form";
-import { EmojiPickerBlock, HuePicker } from "@dxos/react-ui-pickers";
-import { StackItem as StackItem2 } from "@dxos/react-ui-stack";
-import { hexToHue, hexToEmoji as hexToEmoji2 } from "@dxos/util";
-var getDefaultHueValue = (identity) => hexToHue(identity?.identityKey.toHex() ?? "0");
-var getDefaultEmojiValue = (identity) => hexToEmoji2(identity?.identityKey.toHex() ?? "0");
-var getHueValue = (identity) => identity?.profile?.data?.hue || getDefaultHueValue(identity);
-var getEmojiValue = (identity) => identity?.profile?.data?.emoji || getDefaultEmojiValue(identity);
-var ProfileContainer = () => {
-  var _effect = _useSignals3();
-  try {
-    const { t } = useTranslation3(CLIENT_PLUGIN);
-    const client = useClient2();
-    const identity = useIdentity();
-    const [displayName, setDisplayNameDirectly] = useState2(identity?.profile?.displayName ?? "");
-    const [emoji, setEmojiDirectly] = useState2(getEmojiValue(identity));
-    const [hue, setHueDirectly] = useState2(getHueValue(identity));
-    const updateProfile = useMemo(() => debounce((profile) => client.halo.updateProfile({
-      displayName: profile.displayName,
-      data: {
-        emoji: profile.emoji,
-        hue: profile.hue
-      }
-    }), 2e3), []);
-    const handleSave = useCallback3((profile) => {
-      setDisplayNameDirectly(profile.displayName);
-      setEmojiDirectly(profile.emoji);
-      setHueDirectly(profile.hue);
-      updateProfile(profile);
-    }, [
-      identity
-    ]);
-    const values = useMemo(() => ({
-      displayName,
-      emoji,
-      hue,
-      did: identity?.did
-    }), [
-      identity,
-      displayName,
-      emoji,
-      hue
-    ]);
-    const customElements = useMemo(() => ({
-      displayName: ({ type, label, getValue, onValueChange }) => {
-        const handleChange = useCallback3(({ target: { value } }) => onValueChange(type, value), [
-          onValueChange,
-          type
-        ]);
-        return /* @__PURE__ */ React3.createElement(ControlItemInput, {
-          title: label,
-          description: t("display name description")
-        }, /* @__PURE__ */ React3.createElement(Input.TextInput, {
-          value: getValue(),
-          onChange: handleChange,
-          placeholder: t("display name input placeholder"),
-          classNames: "min-is-64"
-        }));
-      },
-      emoji: ({ type, label, getValue, onValueChange }) => {
-        const handleChange = useCallback3((nextEmoji) => onValueChange(type, nextEmoji), [
-          onValueChange,
-          type
-        ]);
-        const handleEmojiReset = useCallback3(() => onValueChange(type, getDefaultEmojiValue(identity)), [
-          onValueChange,
-          type
-        ]);
-        return /* @__PURE__ */ React3.createElement(ControlItem2, {
-          title: label,
-          description: t("icon description")
-        }, /* @__PURE__ */ React3.createElement(EmojiPickerBlock, {
-          triggerVariant: "default",
-          emoji: getValue(),
-          onChangeEmoji: handleChange,
-          onClickClear: handleEmojiReset,
-          classNames: "justify-self-end"
-        }));
-      },
-      hue: ({ type, label, getValue, onValueChange }) => {
-        const handleChange = useCallback3((nextHue) => onValueChange(type, nextHue), [
-          onValueChange,
-          type
-        ]);
-        const handleHueReset = useCallback3(() => onValueChange(type, getDefaultHueValue(identity)), [
-          onValueChange,
-          type
-        ]);
-        return /* @__PURE__ */ React3.createElement(ControlItem2, {
-          title: label,
-          description: t("hue description")
-        }, /* @__PURE__ */ React3.createElement(HuePicker, {
-          value: getValue(),
-          onChange: handleChange,
-          onReset: handleHueReset,
-          classNames: "[--hue-preview-size:1.5rem] justify-self-end"
-        }));
-      },
-      // TODO(wittjosiah): We need text input annotations for disabled and copyable.
-      did: ({ label, getValue }) => {
-        return /* @__PURE__ */ React3.createElement(ControlItemInput, {
-          title: label,
-          description: t("did description")
-        }, /* @__PURE__ */ React3.createElement(ButtonGroup, null, /* @__PURE__ */ React3.createElement(Input.TextInput, {
-          value: getValue(),
-          disabled: true,
-          classNames: "min-is-64"
-        }), /* @__PURE__ */ React3.createElement(Clipboard2.IconButton, {
-          value: getValue() ?? ""
-        })));
-      }
-    }), [
-      t
-    ]);
-    return /* @__PURE__ */ React3.createElement(StackItem2.Content, {
-      classNames: "block overflow-y-auto"
-    }, /* @__PURE__ */ React3.createElement(ControlPage2, null, /* @__PURE__ */ React3.createElement(Clipboard2.Provider, null, /* @__PURE__ */ React3.createElement(ControlSection2, {
-      title: t("profile label"),
-      description: t("profile description")
-    }, /* @__PURE__ */ React3.createElement(Form, {
-      schema: ProfileSchema,
-      values,
-      autoSave: true,
-      onSave: handleSave,
-      Custom: customElements,
-      classNames: "container-max-width grid grid-cols-1 md:grid-cols-[1fr_min-content] gap-4",
-      outerSpacing: false
-    })))));
-  } finally {
-    _effect.f();
-  }
-};
-var ProfileSchema = Schema.Struct({
-  displayName: Schema.String.annotations({
-    title: "Display name"
-  }),
-  emoji: Schema.String.annotations({
-    title: "Avatar"
-  }),
-  hue: Schema.String.annotations({
-    title: "Color"
-  }),
-  did: Schema.String.annotations({
-    title: "DID"
-  })
-});
-
-// packages/plugins/plugin-client/src/components/RecoveryCodeDialog.tsx
-import { useSignals as _useSignals4 } from "@preact-signals/safe-react/tracking";
-import React4, { useCallback as useCallback4, useState as useState3 } from "react";
-import { AlertDialog, Button as Button2, Clipboard as Clipboard3, Input as Input2, useTranslation as useTranslation4 } from "@dxos/react-ui";
-var RECOVERY_CODE_DIALOG = `${CLIENT_PLUGIN}/RecoveryCodeDialog`;
-var RecoveryCodeDialog = ({ code }) => {
-  var _effect = _useSignals4();
-  try {
-    const { t } = useTranslation4(CLIENT_PLUGIN);
-    const [confirmation, setConfirmation] = useState3(false);
-    const handleConfirmation = useCallback4((checked) => setConfirmation(checked), []);
-    return /* @__PURE__ */ React4.createElement(AlertDialog.Content, {
-      classNames: "bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
-    }, /* @__PURE__ */ React4.createElement(AlertDialog.Title, null, t("recovery code dialog title")), /* @__PURE__ */ React4.createElement("p", {
-      className: "py-4"
-    }, t("recovery code dialog description")), /* @__PURE__ */ React4.createElement(Clipboard3.Provider, null, /* @__PURE__ */ React4.createElement(Code, {
-      code
-    })), /* @__PURE__ */ React4.createElement("div", {
-      className: "flex flex-col py-4 gap-2"
-    }, /* @__PURE__ */ React4.createElement("p", null, t("recovery code dialog warning 1")), /* @__PURE__ */ React4.createElement("p", null, t("recovery code dialog warning 2"))), /* @__PURE__ */ React4.createElement("div", {
-      className: "flex items-center gap-2 pbe-4"
-    }, /* @__PURE__ */ React4.createElement(Input2.Root, null, /* @__PURE__ */ React4.createElement(Input2.Checkbox, {
-      "data-testid": "recoveryCode.confirm",
-      checked: confirmation,
-      onCheckedChange: handleConfirmation
-    }), /* @__PURE__ */ React4.createElement(Input2.Label, null, t("recovery code confirmation label")))), /* @__PURE__ */ React4.createElement("div", {
-      className: "flex justify-end"
-    }, /* @__PURE__ */ React4.createElement(AlertDialog.Action, {
-      asChild: true
-    }, /* @__PURE__ */ React4.createElement(Button2, {
-      "data-testid": "recoveryCode.continue",
-      variant: "primary",
-      disabled: !confirmation
-    }, t("continue label")))));
-  } finally {
-    _effect.f();
-  }
-};
-var Code = ({ code }) => {
-  var _effect = _useSignals4();
-  try {
-    const words = code.split(" ");
-    return /* @__PURE__ */ React4.createElement("div", {
-      className: "relative p-2 border border-separator rounded group"
-    }, /* @__PURE__ */ React4.createElement(Clipboard3.IconButton, {
-      value: code,
-      classNames: "absolute top-2 right-2 invisible group-hover:visible"
-    }), /* @__PURE__ */ React4.createElement("div", {
-      className: "grid grid-cols-4"
-    }, words.map((word, i) => /* @__PURE__ */ React4.createElement("div", {
-      key: i,
-      className: "flex items-center p-2 gap-2"
-    }, /* @__PURE__ */ React4.createElement("div", {
-      className: "w-4 text-xs text-center text-subdued"
-    }, i + 1), /* @__PURE__ */ React4.createElement("div", {
-      className: "text-sm"
-    }, word)))));
-  } finally {
-    _effect.f();
-  }
-};
-
-// packages/plugins/plugin-client/src/components/RecoveryCredentialsContainer.tsx
-import { useSignals as _useSignals5 } from "@preact-signals/safe-react/tracking";
-import React5 from "react";
-import { createIntent as createIntent3, useIntentDispatcher as useIntentDispatcher3 } from "@dxos/app-framework";
-import { useCredentials } from "@dxos/react-client/halo";
-import { Icon, IconButton as IconButton2, List as List2, ListItem, useTranslation as useTranslation5, Message } from "@dxos/react-ui";
-import { ControlGroup as ControlGroup2, ControlItem as ControlItem3, ControlPage as ControlPage3, ControlSection as ControlSection3 } from "@dxos/react-ui-form";
-import { StackItem as StackItem3 } from "@dxos/react-ui-stack";
-var MANAGE_CREDENTIALS_DIALOG = `${CLIENT_PLUGIN}/ManageCredentialsDialog`;
-var RecoveryCredentialsContainer = () => {
-  var _effect = _useSignals5();
-  try {
-    const { t } = useTranslation5(CLIENT_PLUGIN);
-    const { dispatchPromise: dispatch } = useIntentDispatcher3();
-    const credentials = useCredentials();
-    const recoveryCredentials = credentials.filter((credential) => credential.subject.assertion["@type"] === "dxos.halo.credentials.IdentityRecovery");
-    return /* @__PURE__ */ React5.createElement(StackItem3.Content, {
-      classNames: "block overflow-y-auto"
-    }, /* @__PURE__ */ React5.createElement(ControlPage3, null, /* @__PURE__ */ React5.createElement(ControlSection3, {
-      title: t("recovery setup dialog title"),
-      description: t("recovery setup dialog description")
-    }, /* @__PURE__ */ React5.createElement(ControlGroup2, null, /* @__PURE__ */ React5.createElement(ControlItem3, {
-      title: t("create passkey label"),
-      description: t("create passkey description")
-    }, /* @__PURE__ */ React5.createElement(IconButton2, {
-      label: t("create passkey label"),
-      icon: "ph--key--duotone",
-      variant: "primary",
-      size: 5,
-      onClick: () => dispatch(createIntent3(ClientAction.CreatePasskey))
-    })), /* @__PURE__ */ React5.createElement(ControlItem3, {
-      title: t("create recovery code label"),
-      description: t("create recovery code description")
-    }, /* @__PURE__ */ React5.createElement(IconButton2, {
-      label: t("create recovery code label"),
-      icon: "ph--receipt--duotone",
-      variant: "default",
-      size: 5,
-      onClick: () => dispatch(createIntent3(ClientAction.CreateRecoveryCode))
-    })))), /* @__PURE__ */ React5.createElement(ControlSection3, {
-      title: t("credentials list label")
-    }, recoveryCredentials.length < 1 ? /* @__PURE__ */ React5.createElement(Message.Root, {
-      valence: "error",
-      classNames: "container-max-width"
-    }, /* @__PURE__ */ React5.createElement(Message.Title, {
-      icon: "ph--shield-warning--duotone"
-    }, t("no credentials title")), /* @__PURE__ */ React5.createElement(Message.Content, null, t("no credentials message"))) : /* @__PURE__ */ React5.createElement(List2, {
-      classNames: "container-max-width pli-2"
-    }, recoveryCredentials.map((credential) => /* @__PURE__ */ React5.createElement(ListItem.Root, {
-      key: credential.id?.toHex()
-    }, /* @__PURE__ */ React5.createElement(ListItem.Endcap, null, /* @__PURE__ */ React5.createElement(Icon, {
-      icon: "ph--key--regular",
-      size: 5
-    })), /* @__PURE__ */ React5.createElement(ListItem.Heading, null, credential.issuanceDate.toLocaleString())))))));
-  } finally {
-    _effect.f();
-  }
-};
-
-// packages/plugins/plugin-client/src/components/ResetDialog.tsx
-import { useSignals as _useSignals6 } from "@preact-signals/safe-react/tracking";
-import React6, { useCallback as useCallback5 } from "react";
-import { createIntent as createIntent4, LayoutAction as LayoutAction2, useIntentDispatcher as useIntentDispatcher4 } from "@dxos/app-framework";
-import { useClient as useClient3 } from "@dxos/react-client";
-import { Dialog as Dialog2, useTranslation as useTranslation6 } from "@dxos/react-ui";
-import { ConfirmReset } from "@dxos/shell/react";
-var RESET_DIALOG = `${CLIENT_PLUGIN}/ResetDialog`;
-var ResetDialog = ({ mode, onReset }) => {
-  var _effect = _useSignals6();
-  try {
-    const { t } = useTranslation6(CLIENT_PLUGIN);
-    const { dispatchPromise: dispatch } = useIntentDispatcher4();
-    const client = useClient3();
-    const handleReset = useCallback5(async () => {
-      await client.reset();
-      const target = mode === "join new identity" ? "deviceInvitation" : mode === "recover" ? "recoverIdentity" : void 0;
-      await onReset?.({
-        target
-      });
-    }, [
-      dispatch,
-      client,
-      mode,
-      onReset
-    ]);
-    const handleCancel = useCallback5(() => {
-      void dispatch(createIntent4(LayoutAction2.UpdateDialog, {
-        part: "dialog",
-        options: {
-          state: false
-        }
-      }));
-    }, [
-      dispatch
-    ]);
-    return /* @__PURE__ */ React6.createElement(Dialog2.Content, {
-      classNames: "bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden"
-    }, /* @__PURE__ */ React6.createElement(Dialog2.Title, {
-      classNames: "sr-only"
-    }, t("reset dialog title")), /* @__PURE__ */ React6.createElement(Dialog2.Description, {
-      classNames: "sr-only"
-    }, t("reset dialog description")), /* @__PURE__ */ React6.createElement(ConfirmReset, {
-      active: true,
-      mode,
-      onConfirm: handleReset,
-      onCancel: handleCancel
-    }));
-  } finally {
-    _effect.f();
-  }
-};
-
-export {
-  DevicesContainer,
-  JOIN_DIALOG,
-  JoinDialog,
-  ProfileContainer,
-  RECOVERY_CODE_DIALOG,
-  RecoveryCodeDialog,
-  RecoveryCredentialsContainer,
-  RESET_DIALOG,
-  ResetDialog
-};
-//# sourceMappingURL=chunk-5MC5HCIM.mjs.map