@seams/wallet 0.17.0 → 0.19.0

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ConfirmContent.js

@@ -1,3 +1,5 @@
+import { walletText } from "../../../../ui/messages.js";
+import { WalletLocaleContext, WalletText } from "./WalletLocale.js";
 import { CONFIRM_SURFACE_HEIGHT_DRIVEN_VAR, createSurfaceHeightReflow } from "../confirm-surface-resize.js";
 import { TransactionTree } from "./TransactionTree.js";
 import { Component, createRef } from "preact";
@@ -9,6 +11,7 @@ function stopDragStart(event) {
 	event.stopPropagation();
 }
 var ConfirmContent = class extends Component {
+	static contextType = WalletLocaleContext;
 	state = { armed: false };
 	id = `seams-confirm-content-${++nextContentId}`;
 	root = createRef();
@@ -87,7 +90,7 @@ var ConfirmContent = class extends Component {
 					this.props.errorMessage && /* @__PURE__ */ jsx("div", {
 						class: "error",
 						role: "alert",
-						children: this.props.errorMessage
+						children: /* @__PURE__ */ jsx(WalletText, { copy: this.props.errorMessage })
 					}),
 					this.props.tree && /* @__PURE__ */ jsx("div", {
 						class: "tooltip-width",
@@ -107,7 +110,7 @@ var ConfirmContent = class extends Component {
 							type: "button",
 							class: "cancel",
 							onClick: this.cancel,
-							children: this.props.cancelText
+							children: /* @__PURE__ */ jsx(WalletText, { copy: this.props.cancelText })
 						}), /* @__PURE__ */ jsx("button", {
 							type: this.props.decision.kind === "form" ? "submit" : "button",
 							form: this.props.decision.kind === "form" ? this.props.decision.formId : void 0,
@@ -117,8 +120,8 @@ var ConfirmContent = class extends Component {
 							children: preparing ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
 								class: "loading-indicator",
 								role: "progressbar",
-								"aria-label": "Loading"
-							}), /* @__PURE__ */ jsx("span", { children: "Loading..." })] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [this.props.confirmIcon, this.props.confirmText] })
+								"aria-label": walletText(this.context, "Loading")
+							}), /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(WalletText, { message: "Loading..." }) })] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [this.props.confirmIcon, /* @__PURE__ */ jsx(WalletText, { copy: this.props.confirmText })] })
 						})]
 					})
 				]

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ConfirmHeader.js

@@ -1,8 +1,12 @@
+import { walletText } from "../../../../ui/messages.js";
+import { WalletText, useWalletLocale } from "./WalletLocale.js";
 import { PadlockIcon } from "./PadlockIcon.js";
 import { PasskeyHaloLoading } from "./PasskeyHaloLoading.js";
 import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
 //#region src/core/signingEngine/uiConfirm/ui/preact/ConfirmHeader.tsx
+/** @jsxImportSource preact */
 function ConfirmHeader(props) {
+	const locale = useWalletLocale();
 	return /* @__PURE__ */ jsxs("div", {
 		class: "hero seams-confirm-header",
 		children: [/* @__PURE__ */ jsx(PasskeyHaloLoading, {
@@ -14,11 +18,11 @@ function ConfirmHeader(props) {
 			children: [
 				/* @__PURE__ */ jsx("h2", {
 					class: "hero-heading",
-					children: props.heading
+					children: /* @__PURE__ */ jsx(WalletText, { copy: props.heading })
 				}),
 				props.errorMessage && /* @__PURE__ */ jsx("div", {
 					class: "error-banner",
-					children: props.errorMessage
+					children: /* @__PURE__ */ jsx(WalletText, { copy: props.errorMessage })
 				}),
 				/* @__PURE__ */ jsx("div", {
 					class: "rpid-wrapper",
@@ -30,8 +34,8 @@ function ConfirmHeader(props) {
 								role: "status",
 								children: props.website.kind === "ready" ? /* @__PURE__ */ jsx("span", {
 									class: "domain-text",
-									children: props.website.text
-								}) : /* @__PURE__ */ jsx(LoadingStatus, { label: "Loading website" })
+									children: /* @__PURE__ */ jsx(WalletText, { copy: props.website.text })
+								}) : /* @__PURE__ */ jsx(LoadingStatus, { label: walletText(locale, "Loading website") })
 							})]
 						}), /* @__PURE__ */ jsxs("span", {
 							class: "security-details",
@@ -52,7 +56,7 @@ function ConfirmHeader(props) {
 								]
 							}), /* @__PURE__ */ jsx("span", {
 								role: "status",
-								children: props.chainDetails.kind === "ready" ? props.chainDetails.text : /* @__PURE__ */ jsx(LoadingStatus, { label: "Loading chain details" })
+								children: props.chainDetails.kind === "ready" ? /* @__PURE__ */ jsx(WalletText, { copy: props.chainDetails.text }) : /* @__PURE__ */ jsx(LoadingStatus, { label: walletText(locale, "Loading chain details") })
 							})]
 						})]
 					})
@@ -81,7 +85,7 @@ function LoadingStatus(props) {
 		]
 	}), /* @__PURE__ */ jsx("span", {
 		class: "sr-only",
-		children: props.label
+		children: /* @__PURE__ */ jsx(WalletText, { copy: props.label })
 	})] });
 }
 //#endregion

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ConfirmationBody.js

@@ -1,3 +1,5 @@
+import { walletDisplayText } from "../../../../ui/messages.js";
+import { WalletLocaleContext, WalletText } from "./WalletLocale.js";
 import { Component } from "preact";
 import { jsx, jsxs } from "preact/jsx-runtime";
 //#region src/core/signingEngine/uiConfirm/ui/preact/ConfirmationBody.tsx
@@ -6,6 +8,7 @@ function assertNever(value) {
 	throw new Error(`Unexpected confirmation body: ${String(value)}`);
 }
 var ConfirmationBody = class extends Component {
+	static contextType = WalletLocaleContext;
 	copy = () => {
 		if (this.props.model.kind === "funding") this.props.onCopyAccount(this.props.model.accountId);
 	};
@@ -15,25 +18,25 @@ var ConfirmationBody = class extends Component {
 			case "empty": return null;
 			case "text": return /* @__PURE__ */ jsx("div", {
 				class: "confirmation-body",
-				children: model.text
+				children: /* @__PURE__ */ jsx(WalletText, { copy: model.text })
 			});
 			case "status": return /* @__PURE__ */ jsx("div", {
 				class: "confirmation-body confirmation-body--status",
-				children: model.text
+				children: /* @__PURE__ */ jsx(WalletText, { copy: model.text })
 			});
 			case "funding": return /* @__PURE__ */ jsxs("div", {
 				class: "confirmation-body confirmation-body--funding",
 				children: [
-					"NEAR account",
+					/* @__PURE__ */ jsx(WalletText, { message: "NEAR account" }),
 					/* @__PURE__ */ jsx("button", {
 						type: "button",
 						class: "confirmation-body__copy-target",
-						title: `Copy ${model.accountId}`,
-						"aria-label": `Copy NEAR account ${model.accountId}`,
+						title: walletDisplayText(this.context, `Copy ${model.accountId}`),
+						"aria-label": walletDisplayText(this.context, `Copy NEAR account ${model.accountId}`),
 						onClick: this.copy,
 						children: model.shortAccountId
 					}),
-					"needs funding"
+					/* @__PURE__ */ jsx(WalletText, { message: "needs funding" })
 				]
 			});
 			default: return assertNever(model);

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ConfirmationContent.js

@@ -1,3 +1,5 @@
+import { walletDisplayText, walletText } from "../../../../ui/messages.js";
+import { WalletLocaleContext, WalletText } from "./WalletLocale.js";
 import { PadlockIcon } from "./PadlockIcon.js";
 import { CONFIRM_SURFACE_HEIGHT_DRIVEN_VAR, createSurfaceHeightReflow } from "../confirm-surface-resize.js";
 import { copySurfaceText } from "./clipboard.js";
@@ -13,6 +15,7 @@ import { jsx, jsxs } from "preact/jsx-runtime";
 /** @jsxImportSource preact */
 let nextConfirmationId = 0;
 var ConfirmationContent = class extends Component {
+	static contextType = WalletLocaleContext;
 	root = createRef();
 	otpFormId = `seams-confirmation-email-${++nextConfirmationId}`;
 	reflowId = `seams-confirmation-content-surface-${nextConfirmationId}`;
@@ -75,29 +78,29 @@ var ConfirmationContent = class extends Component {
 							children: [
 								model.transaction.onBack && /* @__PURE__ */ jsx("button", {
 									type: "button",
-									"aria-label": "Back to review",
-									title: "Back to review",
+									"aria-label": walletText(this.context, "Back to review"),
+									title: walletText(this.context, "Back to review"),
 									disabled: decision.kind === "preparing",
 									onClick: model.transaction.onBack,
 									children: /* @__PURE__ */ jsx(ReviewIcon, { kind: "back" })
 								}),
 								/* @__PURE__ */ jsx(PadlockIcon, {}),
-								model.header.website.kind === "ready" ? model.header.website.text : /* @__PURE__ */ jsx(LoadingStatus, { label: "Loading website" })
+								model.header.website.kind === "ready" ? model.header.website.text : /* @__PURE__ */ jsx(LoadingStatus, { label: walletText(this.context, "Loading website") })
 							]
 						}), /* @__PURE__ */ jsx("button", {
 							type: "button",
-							"aria-label": model.transaction.cancelText,
+							"aria-label": walletDisplayText(this.context, model.transaction.cancelText),
 							onClick: model.transaction.onCancel,
 							children: /* @__PURE__ */ jsx(ReviewIcon, { kind: "close" })
 						})]
 					}),
 					model.review.model && /* @__PURE__ */ jsx("div", {
 						class: "seams-review-eyebrow",
-						children: model.review.model.operations.length === 1 ? model.review.model.operations[0].label.replace(/\s+using\s+[\d,.]+\s+gas$/i, "") : "Transaction"
+						children: model.review.model.operations.length === 1 ? /* @__PURE__ */ jsx(WalletText, { copy: model.review.model.operations[0].label.replace(/\s+using\s+[\d,.]+\s+gas$/i, "") }) : /* @__PURE__ */ jsx(WalletText, { message: "Transaction" })
 					}),
 					/* @__PURE__ */ jsx("h2", {
 						class: "seams-review-title",
-						children: model.header.heading
+						children: /* @__PURE__ */ jsx(WalletText, { copy: model.header.heading })
 					}),
 					/* @__PURE__ */ jsx(TransactionReview, { data: model.review }),
 					/* @__PURE__ */ jsxs("div", {

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ConfirmationDrawer.js

@@ -1,3 +1,5 @@
+import { walletDisplayText, walletText } from "../../../../ui/messages.js";
+import { WalletLocaleContext, WalletText } from "./WalletLocale.js";
 import { drawerDragTranslate, shouldDismissDrawerDrag } from "../drawer-gesture.js";
 import { Component, createRef } from "preact";
 import { jsx, jsxs } from "preact/jsx-runtime";
@@ -8,6 +10,7 @@ function ConfirmationDrawer(props) {
 	return /* @__PURE__ */ jsx(DrawerShell, { ...props }, props.context);
 }
 var DrawerShell = class extends Component {
+	static contextType = WalletLocaleContext;
 	state = { settled: false };
 	id = `seams-confirmation-drawer-${++nextDrawerId}`;
 	dialog = createRef();
@@ -245,7 +248,7 @@ var DrawerShell = class extends Component {
 					/* @__PURE__ */ jsx("button", {
 						type: "button",
 						class: "seams-drawer-handle",
-						"aria-label": "Dismiss confirmation",
+						"aria-label": walletText(this.context, "Dismiss confirmation"),
 						disabled: !this.canDrag(),
 						onClick: this.cancel,
 						children: /* @__PURE__ */ jsx("span", {})
@@ -253,7 +256,7 @@ var DrawerShell = class extends Component {
 					/* @__PURE__ */ jsx("button", {
 						type: "button",
 						class: "seams-drawer-close",
-						"aria-label": "Close",
+						"aria-label": walletText(this.context, "Close"),
 						disabled: !this.canDrag(),
 						onClick: this.cancel,
 						children: "×"
@@ -264,7 +267,7 @@ var DrawerShell = class extends Component {
 				ref: this.body,
 				children: [this.props.errorMessage && /* @__PURE__ */ jsx("div", {
 					class: "error",
-					children: this.props.errorMessage
+					children: /* @__PURE__ */ jsx(WalletText, { copy: this.props.errorMessage })
 				}), /* @__PURE__ */ jsx("div", {
 					class: "seams-drawer-content",
 					ref: this.content,
@@ -276,7 +279,7 @@ var DrawerShell = class extends Component {
 		return /* @__PURE__ */ jsx("dialog", {
 			class: "seams-drawer-dialog",
 			ref: this.dialog,
-			"aria-label": this.props.label,
+			"aria-label": walletDisplayText(this.context, this.props.label),
 			onCancel: this.cancel,
 			onClick: this.backdropClick,
 			onClickCapture: this.suppressDragClick,

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ConfirmationModal.js

@@ -1,3 +1,5 @@
+import { walletDisplayText } from "../../../../ui/messages.js";
+import { WalletLocaleContext } from "./WalletLocale.js";
 import { Component, createRef } from "preact";
 import { jsx } from "preact/jsx-runtime";
 //#region src/core/signingEngine/uiConfirm/ui/preact/ConfirmationModal.tsx
@@ -7,6 +9,7 @@ function ConfirmationModal(props) {
 	return /* @__PURE__ */ jsx(ModalShell, { ...props }, props.context);
 }
 var ModalShell = class extends Component {
+	static contextType = WalletLocaleContext;
 	dialog = createRef();
 	hosted = createRef();
 	containerId = `seams-confirmation-modal-${++nextModalId}`;
@@ -35,7 +38,7 @@ var ModalShell = class extends Component {
 		if (this.props.context === "standalone") return /* @__PURE__ */ jsx("dialog", {
 			ref: this.dialog,
 			class: "seams-confirmation-modal",
-			"aria-label": this.props.label,
+			"aria-label": walletDisplayText(this.context, this.props.label),
 			onCancel: this.cancel,
 			onClick: this.backdropClick,
 			children: /* @__PURE__ */ jsx("div", {

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/EmailOtpContent.js

@@ -1,3 +1,5 @@
+import { walletDisplayText } from "../../../../ui/messages.js";
+import { WalletLocaleContext } from "./WalletLocale.js";
 import { formatEmailOtpSentText } from "../../../stepUpConfirmation/otpPrompt/promptText.js";
 import { EmailOtpInput } from "./EmailOtpInput.js";
 import { EmailOtpSession } from "./email-otp-session.js";
@@ -9,6 +11,7 @@ function EmailOtpContent(props) {
 	return /* @__PURE__ */ jsx(EmailOtpSessionView, { ...props }, props.prompt.challengeId);
 }
 var EmailOtpSessionView = class extends Component {
+	static contextType = WalletLocaleContext;
 	session;
 	form = createRef();
 	lifetime;
@@ -118,7 +121,7 @@ var EmailOtpSessionView = class extends Component {
 				challengeId: this.lifetime.kind === "active" ? this.lifetime.challengeId : "",
 				code: this.state.code,
 				helperText: this.props.prompt.helperText?.trim() || formatEmailOtpSentText(this.lifetime.kind === "active" ? this.lifetime.emailHint : ""),
-				errorMessage: this.state.error || void 0,
+				errorMessage: walletDisplayText(this.context, this.state.error || void 0),
 				state: this.inputState(),
 				resend: this.resendAction()
 			})

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/EmailOtpInput.js

@@ -1,3 +1,4 @@
+import { WalletText } from "./WalletLocale.js";
 import { Component } from "preact";
 import { jsx, jsxs } from "preact/jsx-runtime";
 //#region src/core/signingEngine/uiConfirm/ui/preact/EmailOtpInput.tsx
@@ -28,7 +29,7 @@ var EmailOtpInput = class extends Component {
 				/* @__PURE__ */ jsx("label", {
 					class: "email-otp-confirm__label",
 					for: this.id,
-					children: "Email code"
+					children: /* @__PURE__ */ jsx(WalletText, { message: "Email code" })
 				}),
 				/* @__PURE__ */ jsxs("div", {
 					class: "email-otp-confirm__code-field",
@@ -65,19 +66,19 @@ var EmailOtpInput = class extends Component {
 				/* @__PURE__ */ jsx("div", {
 					id: helperId,
 					class: "email-otp-confirm__helper",
-					children: this.props.helperText
+					children: /* @__PURE__ */ jsx(WalletText, { copy: this.props.helperText })
 				}),
 				this.props.errorMessage && /* @__PURE__ */ jsx("div", {
 					id: errorId,
 					class: "email-otp-confirm__error",
-					children: this.props.errorMessage
+					children: /* @__PURE__ */ jsx(WalletText, { copy: this.props.errorMessage })
 				}),
 				this.props.resend && /* @__PURE__ */ jsx("button", {
 					type: "button",
 					class: "email-otp-confirm__resend",
 					disabled: this.props.resend.kind === "unavailable",
 					onClick: this.resend,
-					children: this.props.resend.label
+					children: /* @__PURE__ */ jsx(WalletText, { copy: this.props.resend.label })
 				})
 			]
 		});

package/dist/esm/core/signingEngine/uiConfirm/ui/preact/ExportPrivateKeySurface.js

@@ -0,0 +1,319 @@
+import { walletDisplayText, walletText } from "../../../../ui/messages.js";
+import { WalletLocaleContext, WalletText, useWalletLocale } from "./WalletLocale.js";
+import { copySurfaceText } from "./clipboard.js";
+import { CopyStatusIcon } from "./CopyStatusIcon.js";
+import { advanceRevealState, createSpinningState, maskedPrivateKey, settlingState } from "../export-private-key-reveal.js";
+import { Component, createRef } from "preact";
+import { Fragment as Fragment$1, jsx, jsxs } from "preact/jsx-runtime";
+//#region src/core/signingEngine/uiConfirm/ui/preact/ExportPrivateKeySurface.tsx
+/** @jsxImportSource preact */
+function ExportPrivateKeySurface({ model, onClose }) {
+	const locale = useWalletLocale();
+	const entries = model.kind === "failed" ? [] : model.entries;
+	const showAccount = entries.length === 0 || entries.some(isNearKey);
+	return /* @__PURE__ */ jsx("div", {
+		class: "seams-export-key-viewer",
+		"data-seams-drawer-no-drag": true,
+		onPointerDown: stopDrag,
+		onMouseDown: stopDrag,
+		onTouchStart: stopDrag,
+		children: /* @__PURE__ */ jsxs("div", {
+			class: "content",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					class: "seams-export-header",
+					children: [/* @__PURE__ */ jsx("h2", {
+						class: "title",
+						children: /* @__PURE__ */ jsx(WalletText, { message: "Exported Keys" })
+					}), onClose && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						class: "seams-export-modal-close",
+						"aria-label": walletText(locale, "Close exported keys"),
+						onClick: onClose,
+						children: "×"
+					})]
+				}),
+				model.kind === "failed" && /* @__PURE__ */ jsx("div", {
+					class: "error-banner",
+					role: "alert",
+					children: /* @__PURE__ */ jsx(WalletText, { copy: model.message })
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					class: "fields",
+					children: [showAccount && /* @__PURE__ */ jsxs("div", {
+						class: "field",
+						children: [/* @__PURE__ */ jsx("div", {
+							class: "field-label",
+							children: /* @__PURE__ */ jsx(WalletText, { message: "Near Account ID" })
+						}), /* @__PURE__ */ jsx("div", {
+							class: "field-value",
+							children: /* @__PURE__ */ jsx("span", {
+								class: "value",
+								children: model.accountId || "—"
+							})
+						})]
+					}), entries.length > 0 ? entries.map(renderKey) : /* @__PURE__ */ jsx("div", {
+						class: "field",
+						children: /* @__PURE__ */ jsx("div", {
+							class: "field-value",
+							children: /* @__PURE__ */ jsx("span", {
+								class: "muted",
+								children: model.kind === "loading" ? /* @__PURE__ */ jsx(WalletText, { message: "Preparing private key…" }) : /* @__PURE__ */ jsx(WalletText, { message: "No keys available" })
+							})
+						})
+					})]
+				}),
+				model.guidance && /* @__PURE__ */ jsx(ExportGuidanceContent, { guidance: model.guidance }),
+				/* @__PURE__ */ jsx("div", {
+					class: "warning",
+					children: /* @__PURE__ */ jsx(WalletText, { message: "Warning: your private keys grant full control of your account and funds. Keep it in a secret place." })
+				})
+			]
+		})
+	});
+}
+function isNearKey(entry) {
+	return entry.scheme === "ed25519";
+}
+function renderKey(entry) {
+	return /* @__PURE__ */ jsx(ExportKeyCard, { entry }, entry.id);
+}
+function stopDrag(event) {
+	event.stopPropagation();
+}
+function ExportGuidanceContent({ guidance }) {
+	return /* @__PURE__ */ jsxs("div", {
+		class: "warning",
+		children: [
+			/* @__PURE__ */ jsx("strong", { children: /* @__PURE__ */ jsx(WalletText, { copy: guidance.title || "Next Steps" }) }),
+			guidance.body && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(WalletText, { copy: guidance.body }) }),
+			guidance.steps?.length ? /* @__PURE__ */ jsx("ol", { children: guidance.steps.map(renderGuidanceStep) }) : null
+		]
+	});
+}
+function renderGuidanceStep(step, index) {
+	return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(WalletText, { copy: step }) }, index);
+}
+var ExportKeyCard = class extends Component {
+	static contextType = WalletLocaleContext;
+	state = {
+		reveal: null,
+		publicCopied: false,
+		privateCopied: false
+	};
+	root = createRef();
+	frame = null;
+	timers = /* @__PURE__ */ new Map();
+	generation = 0;
+	copyLifetime = new AbortController();
+	active = false;
+	componentDidMount() {
+		this.active = true;
+		this.reset(this.props.entry);
+	}
+	componentWillReceiveProps(next) {
+		if (!sameKey(this.props.entry, next.entry)) this.reset(next.entry);
+	}
+	componentDidUpdate() {
+		this.schedule();
+	}
+	componentWillUnmount() {
+		this.active = false;
+		this.clearPending();
+		this.state.reveal = null;
+	}
+	clearPending() {
+		this.generation += 1;
+		this.copyLifetime.abort();
+		const view = this.root.current?.ownerDocument.defaultView;
+		if (this.frame !== null) view?.cancelAnimationFrame(this.frame);
+		this.frame = null;
+		for (const timer of this.timers.values()) view?.clearTimeout(timer);
+		this.timers.clear();
+	}
+	reset(entry) {
+		this.clearPending();
+		this.copyLifetime = new AbortController();
+		const view = this.root.current.ownerDocument.defaultView;
+		const reduced = view.matchMedia("(prefers-reduced-motion: reduce)").matches;
+		const now = view.performance.now();
+		let reveal = null;
+		switch (entry.material.kind) {
+			case "loading":
+				reveal = createSpinningState(entry.id, entry.scheme, reduced, now);
+				break;
+			case "ready":
+				reveal = reduced ? {
+					kind: "settled",
+					entryKey: entry.id
+				} : settlingState(createSpinningState(entry.id, entry.scheme, false, now), maskedPrivateKey(entry.material.value), now);
+				break;
+			case "unavailable": break;
+			default: assertNever(entry.material);
+		}
+		this.setState({
+			reveal,
+			publicCopied: false,
+			privateCopied: false
+		});
+	}
+	schedule() {
+		const reveal = this.state.reveal;
+		if (!this.active || this.frame !== null || !reveal || reveal.kind === "settled") return;
+		const view = this.root.current.ownerDocument.defaultView;
+		if (view.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
+		this.frame = view.requestAnimationFrame(this.tick);
+	}
+	tick = (now) => {
+		this.frame = null;
+		const reveal = this.state.reveal;
+		if (!this.active || !reveal || reveal.kind === "settled") return;
+		const next = advanceRevealState(reveal, now);
+		if (next !== reveal) this.setState({ reveal: next });
+		this.schedule();
+	};
+	copyPublic = () => {
+		this.copy("public");
+	};
+	copyPrivate = () => {
+		this.copy("private");
+	};
+	clearPublic = () => {
+		this.timers.delete("public");
+		if (this.active) this.setState({ publicCopied: false });
+	};
+	clearPrivate = () => {
+		this.timers.delete("private");
+		if (this.active) this.setState({ privateCopied: false });
+	};
+	async copy(field) {
+		const entry = this.props.entry;
+		if (!this.active) return;
+		if (field === "private" && (entry.material.kind !== "ready" || this.state.reveal?.kind !== "settled")) return;
+		let value = entry.publicKey;
+		if (field === "private") {
+			if (entry.material.kind !== "ready") return;
+			value = entry.material.value;
+		}
+		if (!value) return;
+		const generation = this.generation;
+		const root = this.root.current;
+		const view = root.ownerDocument.defaultView;
+		view.focus();
+		if (!await copySurfaceText(root, value, this.copyLifetime.signal).catch(copyFailed) || !this.active || generation !== this.generation) return;
+		const previous = this.timers.get(field);
+		if (previous !== void 0) view.clearTimeout(previous);
+		if (field === "public") this.setState({ publicCopied: true });
+		else this.setState({ privateCopied: true });
+		this.timers.set(field, view.setTimeout(field === "public" ? this.clearPublic : this.clearPrivate, 3e3));
+	}
+	render() {
+		const entry = this.props.entry;
+		const privateReady = entry.material.kind === "ready" && this.state.reveal?.kind === "settled";
+		return /* @__PURE__ */ jsxs("div", {
+			class: "key-card",
+			ref: this.root,
+			children: [
+				/* @__PURE__ */ jsx("div", {
+					class: "key-title",
+					children: /* @__PURE__ */ jsx(WalletText, { copy: entry.label })
+				}),
+				entry.address && /* @__PURE__ */ jsxs("div", {
+					class: "field",
+					children: [/* @__PURE__ */ jsx("div", {
+						class: "field-label",
+						children: /* @__PURE__ */ jsx(WalletText, { message: "Address" })
+					}), /* @__PURE__ */ jsx("div", {
+						class: "field-value",
+						children: /* @__PURE__ */ jsx("span", {
+							class: "value",
+							children: entry.address
+						})
+					})]
+				}),
+				entry.scheme === "ed25519" && /* @__PURE__ */ jsxs("button", {
+					type: "button",
+					class: `field copy-field${this.state.publicCopied ? " copied" : ""}`,
+					"aria-label": walletDisplayText(this.context, this.state.publicCopied ? "Public key copied" : "Copy public key"),
+					disabled: !entry.publicKey,
+					onClick: this.copyPublic,
+					children: [/* @__PURE__ */ jsx("div", {
+						class: "field-label",
+						children: /* @__PURE__ */ jsx(WalletText, { message: "Public Key" })
+					}), /* @__PURE__ */ jsxs("div", {
+						class: "field-value",
+						children: [/* @__PURE__ */ jsx("span", {
+							class: "value",
+							children: entry.publicKey || "—"
+						}), /* @__PURE__ */ jsx(CopyStatusIcon, {})]
+					})]
+				}),
+				/* @__PURE__ */ jsxs("button", {
+					type: "button",
+					class: `field copy-field${this.state.privateCopied ? " copied" : ""}`,
+					"aria-label": walletDisplayText(this.context, this.state.privateCopied ? "Private key copied" : "Copy private key"),
+					disabled: !privateReady,
+					onClick: this.copyPrivate,
+					children: [/* @__PURE__ */ jsx("div", {
+						class: "field-label",
+						children: /* @__PURE__ */ jsx(WalletText, { message: "Private Key" })
+					}), /* @__PURE__ */ jsxs("div", {
+						class: "field-value",
+						children: [/* @__PURE__ */ jsx("span", {
+							class: "value private-key",
+							children: /* @__PURE__ */ jsx(PrivateKeyText, {
+								material: entry.material,
+								reveal: this.state.reveal
+							})
+						}), /* @__PURE__ */ jsx(CopyStatusIcon, {})]
+					})]
+				})
+			]
+		});
+	}
+};
+function sameKey(left, right) {
+	return left.id === right.id && left.scheme === right.scheme && left.publicKey === right.publicKey && left.material.kind === right.material.kind && left.material.value === right.material.value;
+}
+function copyFailed() {
+	return false;
+}
+function PrivateKeyText({ material, reveal }) {
+	if (reveal && reveal.kind !== "settled") return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("span", {
+		class: "private-key-reel",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ jsx("span", {
+			class: "reel-prefix",
+			children: reveal.prefix
+		}), renderSlots(reveal)]
+	}), /* @__PURE__ */ jsx("span", {
+		class: "seams-sr-only",
+		role: "status",
+		children: /* @__PURE__ */ jsx(WalletText, { message: "Decrypting private key" })
+	})] });
+	if (material.kind !== "ready") return /* @__PURE__ */ jsx("span", {
+		class: "muted",
+		children: "—"
+	});
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", { children: maskedPrivateKey(material.value) }), /* @__PURE__ */ jsx("span", {
+		class: "seams-sr-only",
+		role: "status",
+		children: /* @__PURE__ */ jsx(WalletText, { message: "Private key ready" })
+	})] });
+}
+function renderSlots(reveal) {
+	const lockedSlots = reveal.kind === "settling" ? reveal.lockedSlots : 0;
+	const slots = [];
+	for (let index = 0; index < reveal.slots.length; index += 1) slots.push(/* @__PURE__ */ jsx("span", {
+		class: `reel-slot${index < lockedSlots ? " settled" : ""}`,
+		children: reveal.slots[index].glyph
+	}, index));
+	return slots;
+}
+function assertNever(value) {
+	throw new Error(`Unexpected export key material: ${String(value)}`);
+}
+//#endregion
+export { ExportPrivateKeySurface };
+
+//# sourceMappingURL=ExportPrivateKeySurface.js.map