@seams/wallet 0.15.6 → 0.18.0

package/dist/esm/react/components/AccountMenuButton/AuthenticationMethodsModal.js

@@ -1,3 +1,5 @@
+import { walletDisplayText, walletText } from "../../../core/ui/messages.js";
+import { WalletText, useWalletLocale } from "../../context/WalletLocale.js";
 import { useSeams } from "../../context/index.js";
 import { AccountMenuDialogFrame } from "./AccountMenuDialog.js";
 import { AuthenticationMethodRow } from "./AuthenticationMethodRow.js";
@@ -113,6 +115,7 @@ function inventoryStatus(state) {
 	}
 }
 const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation }) => {
+	const locale = useWalletLocale();
 	const { seams, loginState, refreshSession } = useSeams();
 	const [loadState, setLoadState] = React.useState({ kind: "idle" });
 	const [actionState, setActionState] = React.useState({ kind: "idle" });
@@ -298,7 +301,7 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 		dialogRef,
 		contentClassName: "seams-auth-methods-modal-content",
 		titleId: "seams-auth-methods-modal-title",
-		title: "Authentication methods",
+		title: walletText(locale, "Authentication methods"),
 		children: /* @__PURE__ */ jsx(AuthenticationMethodsView, {
 			walletLabel: walletId ?? "Wallet",
 			status: inventoryStatus(loadState),
@@ -309,21 +312,25 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 					loadState.kind === "idle" ? /* @__PURE__ */ jsx("div", {
 						className: "seams-linked-devices-modal-placeholder",
 						role: "status",
-						children: "Checking authentication methods…"
+						children: /* @__PURE__ */ jsx(WalletText, { message: "Checking authentication methods…" })
 					}) : null,
 					loadState.kind === "error" ? /* @__PURE__ */ jsxs("div", {
 						className: "seams-linked-devices-modal-placeholder",
 						role: "alert",
-						children: [/* @__PURE__ */ jsxs("span", { children: ["Unable to load authentication methods: ", loadState.message] }), /* @__PURE__ */ jsx("button", {
+						children: [/* @__PURE__ */ jsxs("span", { children: [
+							/* @__PURE__ */ jsx(WalletText, { message: "Unable to load authentication methods:" }),
+							" ",
+							/* @__PURE__ */ jsx(WalletText, { copy: loadState.message })
+						] }), /* @__PURE__ */ jsx("button", {
 							type: "button",
 							className: "seams-linked-devices-modal-secondary",
 							onClick: () => void loadInventory(),
-							children: "Try again"
+							children: /* @__PURE__ */ jsx(WalletText, { message: "Try again" })
 						})]
 					}) : null,
 					inventory ? /* @__PURE__ */ jsx("section", {
 						className: "seams-account-menu-section",
-						"aria-label": "Active authentication methods",
+						"aria-label": walletText(locale, "Active authentication methods"),
 						children: /* @__PURE__ */ jsx("ul", {
 							className: "seams-account-method-tiles",
 							children: methods.map((method) => {
@@ -331,42 +338,41 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 								const revoking = actionState.kind === "revoking" && actionState.method.walletAuthMethodId === method.walletAuthMethodId;
 								return /* @__PURE__ */ jsx(AuthenticationMethodRow, {
 									kind: method.kind,
-									title: methodTitle(method),
-									description: methodDescription(method),
+									title: walletDisplayText(locale, methodTitle(method)),
+									description: walletDisplayText(locale, methodDescription(method)),
 									action: !confirming && canManageMethods && methods.length > 1 ? /* @__PURE__ */ jsx("button", {
 										type: "button",
 										className: "seams-linked-devices-modal-secondary seams-linked-devices-modal-remove",
 										disabled: actionInProgress,
-										"aria-label": `Remove ${methodTitle(method)}`,
+										"aria-label": walletDisplayText(locale, `Remove ${methodTitle(method)}`),
 										onClick: () => setActionState({
 											kind: "confirming_revoke",
 											method
 										}),
-										children: revoking ? "Removing…" : "Remove"
+										children: revoking ? /* @__PURE__ */ jsx(WalletText, { message: "Removing…" }) : /* @__PURE__ */ jsx(WalletText, { message: "Remove" })
 									}) : null,
 									children: confirming ? /* @__PURE__ */ jsxs("div", {
 										className: "seams-linked-devices-modal-confirm",
-										children: [/* @__PURE__ */ jsxs("span", { children: [
-											"Remove ",
-											methodTitle(method),
-											" from this device? You will need the other active method to unlock it."
-										] }), /* @__PURE__ */ jsxs("div", {
+										children: [/* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(WalletText, {
+											message: "Remove {value0} from this device? You will need the other active method to unlock it.",
+											values: { value0: walletDisplayText(locale, methodTitle(method)) }
+										}) }), /* @__PURE__ */ jsxs("div", {
 											className: "seams-linked-devices-modal-confirm-actions",
 											children: [/* @__PURE__ */ jsx("button", {
 												type: "button",
 												className: "seams-linked-devices-modal-secondary",
 												onClick: () => setActionState({ kind: "idle" }),
-												children: "Keep it"
+												children: /* @__PURE__ */ jsx(WalletText, { message: "Keep it" })
 											}), /* @__PURE__ */ jsx("button", {
 												type: "button",
 												className: "seams-linked-devices-modal-danger",
 												onClick: () => void revokeMethod(),
-												children: "Remove method"
+												children: /* @__PURE__ */ jsx(WalletText, { message: "Remove method" })
 											})]
 										})]
 									}) : methods.length > 1 ? null : /* @__PURE__ */ jsx("span", {
 										className: "seams-linked-devices-modal-item-detail",
-										children: "Add another method before removing this one."
+										children: /* @__PURE__ */ jsx(WalletText, { message: "Add another method before removing this one." })
 									})
 								}, method.walletAuthMethodId);
 							})
@@ -379,7 +385,7 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 							/* @__PURE__ */ jsx("h3", {
 								id: "seams-auth-methods-add",
 								className: "seams-account-menu-section-label",
-								children: "Add a method"
+								children: /* @__PURE__ */ jsx(WalletText, { message: "Add a method" })
 							}),
 							!hasPasskey ? /* @__PURE__ */ jsxs("div", {
 								className: "seams-linked-devices-modal-add-method",
@@ -391,10 +397,10 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 									children: [/* @__PURE__ */ jsx(PlusIcon, {
 										size: 18,
 										strokeWidth: 1.75
-									}), actionState.kind === "adding" && actionState.method === "passkey" ? "Adding…" : "Add passkey"]
+									}), actionState.kind === "adding" && actionState.method === "passkey" ? /* @__PURE__ */ jsx(WalletText, { message: "Adding…" }) : /* @__PURE__ */ jsx(WalletText, { message: "Add passkey" })]
 								}), /* @__PURE__ */ jsx("p", {
 									className: "seams-linked-devices-modal-security-note",
-									children: "Use a passkey from this device to unlock the wallet."
+									children: /* @__PURE__ */ jsx(WalletText, { message: "Use a passkey from this device to unlock the wallet." })
 								})]
 							}) : null,
 							!hasEmailOtp ? /* @__PURE__ */ jsx("div", {
@@ -408,7 +414,7 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 									children: [
 										/* @__PURE__ */ jsx("label", {
 											htmlFor: emailInputId,
-											children: "Email address"
+											children: /* @__PURE__ */ jsx(WalletText, { message: "Email address" })
 										}),
 										/* @__PURE__ */ jsx("input", {
 											id: emailInputId,
@@ -427,7 +433,7 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 											type: "submit",
 											className: "seams-linked-devices-modal-secondary",
 											disabled: actionInProgress || !canManageMethods,
-											children: actionState.kind === "adding" && actionState.method === "email_otp" ? "Adding…" : "Add Email OTP"
+											children: actionState.kind === "adding" && actionState.method === "email_otp" ? /* @__PURE__ */ jsx(WalletText, { message: "Adding…" }) : /* @__PURE__ */ jsx(WalletText, { message: "Add Email OTP" })
 										})
 									]
 								})
@@ -437,30 +443,30 @@ const AuthenticationMethodsModal = ({ walletId, isOpen, onClose, presentation })
 					loadState.kind === "loaded" && inventory?.kind === "local_selection" ? /* @__PURE__ */ jsxs("section", {
 						className: "seams-linked-devices-modal-add-method",
 						children: [
-							/* @__PURE__ */ jsx("h3", { children: "Unlock to manage methods" }),
+							/* @__PURE__ */ jsx("h3", { children: /* @__PURE__ */ jsx(WalletText, { message: "Unlock to manage methods" }) }),
 							/* @__PURE__ */ jsx("p", {
 								className: "seams-linked-devices-modal-security-note",
-								children: "Confirm your current authentication method to add or remove methods."
+								children: /* @__PURE__ */ jsx(WalletText, { message: "Confirm your current authentication method to add or remove methods." })
 							}),
 							/* @__PURE__ */ jsx("button", {
 								type: "button",
 								className: "seams-linked-devices-modal-secondary seams-account-menu-wide-button",
 								disabled: actionInProgress,
 								onClick: () => void unlockOwnerSession(),
-								children: actionState.kind === "unlocking" ? "Unlocking…" : "Unlock wallet"
+								children: actionState.kind === "unlocking" ? /* @__PURE__ */ jsx(WalletText, { message: "Unlocking…" }) : /* @__PURE__ */ jsx(WalletText, { message: "Unlock wallet" })
 							})
 						]
 					}) : null,
 					actionState.kind === "error" ? /* @__PURE__ */ jsx("div", {
 						className: "seams-linked-devices-modal-error",
 						role: "alert",
-						children: actionState.message
+						children: /* @__PURE__ */ jsx(WalletText, { copy: actionState.message })
 					}) : null,
 					/* @__PURE__ */ jsx("div", {
 						className: "seams-linked-devices-modal-live",
 						role: "status",
 						"aria-live": "polite",
-						children: announcement
+						children: /* @__PURE__ */ jsx(WalletText, { copy: announcement })
 					})
 				]
 			})

package/dist/esm/react/components/AccountMenuButton/AuthenticationMethodsView.js

@@ -1,12 +1,15 @@
+import { walletDisplayText, walletText } from "../../../core/ui/messages.js";
+import { useWalletLocale } from "../../context/WalletLocale.js";
 import { AccountMenuDeviceDetails } from "./AccountMenuDeviceDetails.js";
 import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/react/components/AccountMenuButton/AuthenticationMethodsView.tsx
 /** Shared presentation; callers own enrollment data and authenticated actions. */
 function AuthenticationMethodsView({ walletLabel, status, children }) {
+	const locale = useWalletLocale();
 	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(AccountMenuDeviceDetails, {
-		title: walletLabel,
-		description: "This wallet",
+		title: walletDisplayText(locale, walletLabel),
+		description: walletText(locale, "This wallet"),
 		details: [{
 			label: "Status",
 			value: status

package/dist/esm/react/components/AccountMenuButton/ExportKeysScreen.js

@@ -1,3 +1,5 @@
+import { walletText } from "../../../core/ui/messages.js";
+import { WalletText, useWalletLocale } from "../../context/WalletLocale.js";
 import { AccountMenuScreen } from "./AccountMenuScreen.js";
 import { ExportKeysSection } from "./ExportKeysSection.js";
 import "react";
@@ -6,12 +8,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
 /** Shared key selection; the connected caller owns the authenticated export. */
 function ExportKeysScreen({ onBack, ...selection }) {
 	return /* @__PURE__ */ jsxs(AccountMenuScreen, {
-		title: "Export keys",
+		title: walletText(useWalletLocale(), "Export keys"),
 		onBack,
 		children: [
 			/* @__PURE__ */ jsx("p", {
 				className: "seams-account-description",
-				children: "Choose the signing key to export. Your wallet will ask you to authenticate."
+				children: /* @__PURE__ */ jsx(WalletText, { message: "Choose the signing key to export. Your wallet will ask you to authenticate." })
 			}),
 			/* @__PURE__ */ jsx(ExportKeysSection, {
 				...selection,
@@ -19,7 +21,7 @@ function ExportKeysScreen({ onBack, ...selection }) {
 			}),
 			/* @__PURE__ */ jsx("p", {
 				className: "seams-account-note",
-				children: "Keep exported keys private. Anyone with a signing key can control its accounts."
+				children: /* @__PURE__ */ jsx(WalletText, { message: "Keep exported keys private. Anyone with a signing key can control its accounts." })
 			})
 		]
 	});

package/dist/esm/react/components/AccountMenuButton/ExportKeysSection.js

@@ -1,3 +1,4 @@
+import { WalletText } from "../../context/WalletLocale.js";
 import { KeyIcon } from "./icons/KeyIcon.js";
 import SpinnerIcon from "./icons/SpinnerIcon.js";
 import "react";
@@ -48,15 +49,15 @@ const ExportKeysSection = ({ isOpen = false, presentation = "menu", loadingChain
 						}) : null,
 						/* @__PURE__ */ jsx("span", {
 							className: "seams-export-keys-row-label",
-							children: row.label
+							children: /* @__PURE__ */ jsx(WalletText, { copy: row.label })
 						}),
 						/* @__PURE__ */ jsx("span", {
 							className: "seams-export-keys-row-description",
-							children: row.description
+							children: /* @__PURE__ */ jsx(WalletText, { copy: row.description })
 						}),
 						presentation === "page" ? /* @__PURE__ */ jsxs("span", {
 							className: "seams-export-keys-action",
-							children: [loadingChain === row.chain ? "Preparing export…" : "Export key", /* @__PURE__ */ jsx("span", {
+							children: [loadingChain === row.chain ? /* @__PURE__ */ jsx(WalletText, { message: "Preparing export…" }) : /* @__PURE__ */ jsx(WalletText, { message: "Export key" }), /* @__PURE__ */ jsx("span", {
 								"aria-hidden": "true",
 								children: "→"
 							})]

package/dist/esm/react/components/AccountMenuButton/LinkedDevicesModal.css

@@ -375,8 +375,19 @@
 }
 
 .seams-linked-devices-modal-otp-input:focus-visible {
-  outline: 2px solid var(--seams-colors-primary);
-  outline-offset: 2px;
+  outline: none;
+  border-color: transparent;
+  background:
+    linear-gradient(var(--seams-colors-colorBackground), var(--seams-colors-colorBackground))
+      padding-box,
+    var(
+        --seams-colors-focusGradient,
+        linear-gradient(
+          var(--seams-colors-focus, var(--seams-colors-primary)),
+          var(--seams-colors-focus, var(--seams-colors-primary))
+        )
+      )
+      border-box;
 }
 
 .seams-linked-devices-modal-secondary,

package/dist/esm/react/components/AccountMenuButton/LinkedDevicesModal.js

@@ -1,3 +1,5 @@
+import { walletDisplayText, walletText } from "../../../core/ui/messages.js";
+import { WalletText, useWalletLocale } from "../../context/WalletLocale.js";
 import { useSeams } from "../../context/index.js";
 import { AccountMenuDeviceDetails } from "./AccountMenuDeviceDetails.js";
 import { AccountMenuDialogFrame } from "./AccountMenuDialog.js";
@@ -107,15 +109,15 @@ function deviceStateAttr(view) {
 	return view.kind === "owner" ? "active" : view.device.state;
 }
 /** "today" / "yesterday" / a plain date — never a timestamp with seconds. */
-function friendlyDay(value, now) {
+function friendlyDay(value, now, locale) {
 	const then = new Date(value);
 	const startOfToday = new Date(now);
 	startOfToday.setHours(0, 0, 0, 0);
 	const daysAgo = Math.floor((startOfToday.getTime() - then.setHours(0, 0, 0, 0)) / (1440 * 60 * 1e3));
-	if (daysAgo <= 0) return "today";
-	if (daysAgo === 1) return "yesterday";
-	if (daysAgo < 7) return `${daysAgo} days ago`;
-	return new Date(value).toLocaleDateString(void 0, {
+	if (daysAgo <= 0) return walletText(locale, "today");
+	if (daysAgo === 1) return walletText(locale, "yesterday");
+	if (daysAgo < 7) return walletText(locale, "{value0} days ago", { value0: daysAgo });
+	return new Date(value).toLocaleDateString(locale, {
 		month: "short",
 		day: "numeric",
 		year: "numeric"
@@ -138,16 +140,16 @@ function credentialDescription(credential) {
 * row's title collides with another visible row, the created-at day is
 * appended as a second human disambiguator.
 */
-function deviceMetaLine(view, deviceNumber, titleCollides, now) {
+function deviceMetaLine(view, deviceNumber, titleCollides, now, locale) {
 	const credential = viewCredential(view);
-	const parts = [`Device ${deviceNumber}`];
+	const parts = [walletText(locale, "Device {value0}", { value0: deviceNumber })];
 	if (credential.kind === "passkey") {
-		parts.push(credential.device.synced ? "Synced passkey" : "Passkey");
+		parts.push(walletText(locale, credential.device.synced ? "Synced passkey" : "Passkey"));
 		const provider = credential.device.providerLabel ?? credential.device.provider;
 		if (provider) parts.push(provider);
 	} else parts.push(String(credential.email));
-	if (titleCollides) parts.push(`Added ${friendlyDay(viewCreatedAtMs(view), now)}`);
-	parts.push(`Last used ${friendlyDay(viewLastActivityAtMs(view), now)}`);
+	if (titleCollides) parts.push(walletText(locale, "Added {value0}", { value0: friendlyDay(viewCreatedAtMs(view), now, locale) }));
+	parts.push(walletText(locale, "Last used {value0}", { value0: friendlyDay(viewLastActivityAtMs(view), now, locale) }));
 	return parts.join(" · ");
 }
 /** Icon for the row: what kind of thing holds this credential. */
@@ -165,18 +167,21 @@ function credentialIcon(credential) {
 	});
 }
 /** "sign in with ___ first" — names the actual sibling instead of "the sibling method". */
-function siblingMethodName(siblings) {
+function siblingMethodName(siblings, locale) {
 	if (siblings.length === 1) {
 		const credential = viewCredential(siblings[0]);
-		return credential.kind === "email_otp" ? "your email code" : `your "${credential.device.label}" passkey`;
+		return credential.kind === "email_otp" ? walletText(locale, "your email code") : walletText(locale, "your \"{value0}\" passkey", { value0: credential.device.label });
 	}
-	if (siblings.every((view) => viewCredential(view).kind === "email_otp")) return "your email code";
-	return "another sign-in method";
+	if (siblings.every((view) => viewCredential(view).kind === "email_otp")) return walletText(locale, "your email code");
+	return walletText(locale, "another sign-in method");
 }
-function selectedMethodRemovalHint(target, devices) {
+function selectedMethodRemovalHint(target, devices, locale) {
 	const targetMethodId = String(viewCredential(target).walletAuthMethodId);
 	const siblings = devices.map(({ view }) => view).filter((view) => isActiveWalletMethod(view) && String(viewCredential(view).walletAuthMethodId) !== targetMethodId);
-	return `You're signed in with ${viewCredential(target).kind === "email_otp" ? "your email code" : "this passkey"}. To remove it, sign in with ${siblingMethodName(siblings)} first.`;
+	return walletText(locale, "You're signed in with {value0}. To remove it, sign in with {value1} first.", {
+		value0: walletText(locale, viewCredential(target).kind === "email_otp" ? "your email code" : "this passkey"),
+		value1: siblingMethodName(siblings, locale)
+	});
 }
 function deviceDescription(view, deviceNumber) {
 	return `Device ${deviceNumber}, ${credentialDescription(viewCredential(view))} (ID ${shortDisplayId(viewDisplayId(view))})`;
@@ -201,6 +206,7 @@ function withLinkedDevicesLoadTimeout(promise) {
 	});
 }
 const LinkedDevicesModal = ({ walletId, isOpen, onClose, presentation }) => {
+	const locale = useWalletLocale();
 	const { seams, loginState } = useSeams();
 	const [loadState, setLoadState] = React.useState({ kind: "idle" });
 	const [revokeState, setRevokeState] = React.useState({ kind: "idle" });
@@ -292,38 +298,42 @@ const LinkedDevicesModal = ({ walletId, isOpen, onClose, presentation }) => {
 		dialogRef,
 		contentClassName: "seams-linked-devices-inventory-content",
 		titleId: "seams-linked-devices-modal-title",
-		title: selectedDevice ? "Device details" : "Linked devices",
+		title: walletDisplayText(locale, selectedDevice ? "Device details" : "Linked devices"),
 		children: [selectedDevice ? /* @__PURE__ */ jsx(AccountMenuDeviceDetails, {
-			title: credentialDescription(viewCredential(selectedDevice.view)),
-			description: deviceMetaLine(selectedDevice.view, selectedDevice.deviceNumber, false, Date.now()),
+			title: walletDisplayText(locale, credentialDescription(viewCredential(selectedDevice.view))),
+			description: walletDisplayText(locale, deviceMetaLine(selectedDevice.view, selectedDevice.deviceNumber, false, Date.now(), locale)),
 			details: [{
 				label: "Status",
 				value: deviceStateAttr(selectedDevice.view)
 			}]
 		}) : /* @__PURE__ */ jsx("p", {
 			className: "seams-linked-devices-modal-subtitle",
-			children: "Anything listed here can unlock this wallet."
+			children: /* @__PURE__ */ jsx(WalletText, { message: "Anything listed here can unlock this wallet." })
 		}), /* @__PURE__ */ jsxs("div", {
 			className: "seams-linked-devices-modal-body",
 			children: [
 				loadState.kind === "loading" || loadState.kind === "idle" ? /* @__PURE__ */ jsx("div", {
 					className: "seams-linked-devices-modal-placeholder",
 					role: "status",
-					children: "Checking your devices…"
+					children: /* @__PURE__ */ jsx(WalletText, { message: "Checking your devices…" })
 				}) : null,
 				loadState.kind === "error" ? /* @__PURE__ */ jsxs("div", {
 					className: "seams-linked-devices-modal-placeholder",
 					role: "alert",
-					children: [/* @__PURE__ */ jsxs("span", { children: ["Unable to load your devices: ", loadState.message] }), /* @__PURE__ */ jsx("button", {
+					children: [/* @__PURE__ */ jsxs("span", { children: [
+						/* @__PURE__ */ jsx(WalletText, { message: "Unable to load your devices:" }),
+						" ",
+						/* @__PURE__ */ jsx(WalletText, { copy: loadState.message })
+					] }), /* @__PURE__ */ jsx("button", {
 						type: "button",
 						className: "seams-linked-devices-modal-secondary",
 						onClick: () => void loadDevices(),
-						children: "Try again"
+						children: /* @__PURE__ */ jsx(WalletText, { message: "Try again" })
 					})]
 				}) : null,
 				showEmpty ? /* @__PURE__ */ jsx("div", {
 					className: "seams-linked-devices-modal-placeholder",
-					children: "No other devices are using this wallet."
+					children: /* @__PURE__ */ jsx(WalletText, { message: "No other devices are using this wallet." })
 				}) : null,
 				devices.length > 0 ? /* @__PURE__ */ jsx("ul", {
 					className: "seams-linked-devices-modal-list seams-linked-devices-modal-list--grouped",
@@ -342,8 +352,8 @@ const LinkedDevicesModal = ({ walletId, isOpen, onClose, presentation }) => {
 						if (presentation === "embedded" && !selectedDevice) return /* @__PURE__ */ jsx(AuthenticationMethodRow, {
 							kind: viewCredential(view).kind,
 							icon: credentialIcon(viewCredential(view)),
-							title,
-							description: deviceMetaLine(view, deviceNumber, titleCollides, Date.now()),
+							title: walletDisplayText(locale, title),
+							description: walletDisplayText(locale, deviceMetaLine(view, deviceNumber, titleCollides, Date.now(), locale)),
 							onSelect: setSelectedDeviceId.bind(null, cardId)
 						}, cardId);
 						return /* @__PURE__ */ jsxs("li", {
@@ -364,41 +374,40 @@ const LinkedDevicesModal = ({ walletId, isOpen, onClose, presentation }) => {
 											className: "seams-linked-devices-modal-item-main",
 											children: [/* @__PURE__ */ jsx("span", {
 												className: "seams-linked-devices-modal-item-name",
-												children: title
+												children: /* @__PURE__ */ jsx(WalletText, { copy: title })
 											}), chip ? /* @__PURE__ */ jsx("span", {
 												className: `seams-linked-devices-modal-standing tone-${chip.tone}`,
-												children: chip.label
+												children: /* @__PURE__ */ jsx(WalletText, { copy: chip.label })
 											}) : null]
 										}),
 										/* @__PURE__ */ jsx("div", {
 											className: "seams-linked-devices-modal-item-detail",
-											children: deviceMetaLine(view, deviceNumber, titleCollides, Date.now())
+											children: /* @__PURE__ */ jsx(WalletText, { copy: deviceMetaLine(view, deviceNumber, titleCollides, Date.now(), locale) })
 										}),
 										isSelectedMethod && hasRemovableSibling ? /* @__PURE__ */ jsxs("div", {
 											className: "seams-linked-devices-modal-hint",
 											children: [/* @__PURE__ */ jsx(LockIcon, {
 												size: 15,
 												strokeWidth: 1.75
-											}), /* @__PURE__ */ jsx("span", { children: selectedMethodRemovalHint(view, devices) })]
+											}), /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(WalletText, { copy: selectedMethodRemovalHint(view, devices, locale) }) })]
 										}) : null,
 										confirming ? /* @__PURE__ */ jsxs("div", {
 											className: "seams-linked-devices-modal-confirm",
-											children: [/* @__PURE__ */ jsxs("span", { children: [
-												"Remove ",
-												title,
-												"? It will lose access right away."
-											] }), /* @__PURE__ */ jsxs("div", {
+											children: [/* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(WalletText, {
+												message: "Remove {value0}? It will lose access right away.",
+												values: { value0: title }
+											}) }), /* @__PURE__ */ jsxs("div", {
 												className: "seams-linked-devices-modal-confirm-actions",
 												children: [/* @__PURE__ */ jsx("button", {
 													type: "button",
 													className: "seams-linked-devices-modal-secondary",
 													onClick: () => setRevokeState({ kind: "idle" }),
-													children: "Keep it"
+													children: /* @__PURE__ */ jsx(WalletText, { message: "Keep it" })
 												}), /* @__PURE__ */ jsx("button", {
 													type: "button",
 													className: "seams-linked-devices-modal-danger",
 													onClick: () => void revokeMethod(view, deviceNumber),
-													children: "Yes, remove"
+													children: /* @__PURE__ */ jsx(WalletText, { message: "Yes, remove" })
 												})]
 											})]
 										}) : null
@@ -408,12 +417,12 @@ const LinkedDevicesModal = ({ walletId, isOpen, onClose, presentation }) => {
 									type: "button",
 									className: "seams-linked-devices-modal-secondary seams-linked-devices-modal-remove",
 									disabled: revocationInProgress,
-									"aria-label": `Remove ${deviceDescription(view, deviceNumber)}`,
+									"aria-label": walletDisplayText(locale, `Remove ${deviceDescription(view, deviceNumber)}`),
 									onClick: () => setRevokeState({
 										kind: "confirming",
 										walletAuthMethodId
 									}),
-									children: working ? "Removing…" : "Remove"
+									children: working ? /* @__PURE__ */ jsx(WalletText, { message: "Removing…" }) : /* @__PURE__ */ jsx(WalletText, { message: "Remove" })
 								}) : null
 							]
 						}, cardId);
@@ -422,13 +431,13 @@ const LinkedDevicesModal = ({ walletId, isOpen, onClose, presentation }) => {
 				revokeState.kind === "error" ? /* @__PURE__ */ jsx("div", {
 					className: "seams-linked-devices-modal-error",
 					role: "alert",
-					children: revokeState.message
+					children: /* @__PURE__ */ jsx(WalletText, { copy: revokeState.message })
 				}) : null,
 				/* @__PURE__ */ jsx("div", {
 					className: "seams-linked-devices-modal-live",
 					role: "status",
 					"aria-live": "polite",
-					children: announcement
+					children: /* @__PURE__ */ jsx(WalletText, { copy: announcement })
 				})
 			]
 		})]

package/dist/esm/react/components/AccountMenuButton/LockMenuItem.js

@@ -1,4 +1,5 @@
 import { blinkMenuItem } from "../../../utils/menuItemBlink.js";
+import { WalletText } from "../../context/WalletLocale.js";
 import LogOutIcon from "./icons/LogOutIcon2.js";
 import { memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -18,7 +19,7 @@ const LockMenuItem = memo(({ onLock, className, style }) => {
 			className: "seams-dropdown-menu-item-content",
 			children: /* @__PURE__ */ jsx("div", {
 				className: "seams-dropdown-menu-item-label",
-				children: "Lock Wallet"
+				children: /* @__PURE__ */ jsx(WalletText, { message: "Lock Wallet" })
 			})
 		})]
 	});

package/dist/esm/react/components/AccountMenuButton/MenuItem.js

@@ -1,3 +1,4 @@
+import { WalletText } from "../../context/WalletLocale.js";
 import { HoverArrowIcon } from "./icons/HoverArrowIcon.js";
 import { forwardRef, memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -30,10 +31,10 @@ const MenuItem = memo(forwardRef(({ item, onClose, className, style, isHighlight
 				className: "seams-dropdown-menu-item-content",
 				children: [/* @__PURE__ */ jsx("div", {
 					className: "seams-dropdown-menu-item-label",
-					children: item.label
+					children: /* @__PURE__ */ jsx(WalletText, { copy: item.label })
 				}), /* @__PURE__ */ jsx("div", {
 					className: "seams-dropdown-menu-item-description",
-					children: item.description
+					children: /* @__PURE__ */ jsx(WalletText, { copy: item.description })
 				})]
 			}),
 			!item.disabled ? /* @__PURE__ */ jsx(HoverArrowIcon, {}) : null

package/dist/esm/react/components/AccountMenuButton/ProfileDropdown.js

@@ -1,3 +1,5 @@
+import { walletDisplayText, walletText } from "../../../core/ui/messages.js";
+import { WalletText, useWalletLocale } from "../../context/WalletLocale.js";
 import { MenuItem } from "./MenuItem.js";
 import { LockMenuItem } from "./LockMenuItem.js";
 import "react";
@@ -23,10 +25,11 @@ function storeMenuRef(refs, index, element) {
 	refs.current[index] = element;
 }
 function MenuGroup({ label, items, props }) {
+	const locale = useWalletLocale();
 	return /* @__PURE__ */ jsxs("section", {
 		className: "seams-account-menu-group",
-		"aria-label": label,
-		children: [/* @__PURE__ */ jsx("h3", { children: label }), items.map(renderItem.bind(null, props))]
+		"aria-label": walletDisplayText(locale, label),
+		children: [/* @__PURE__ */ jsx("h3", { children: /* @__PURE__ */ jsx(WalletText, { copy: label }) }), items.map(renderItem.bind(null, props))]
 	});
 }
 function renderItem(props, item) {
@@ -39,17 +42,18 @@ function renderItem(props, item) {
 	}, item.id);
 }
 function ProfileDropdown(props) {
+	const locale = useWalletLocale();
 	props.menuItemsRef.current.length = props.menuItems.length;
 	return /* @__PURE__ */ jsxs("div", {
 		className: "seams-profile-dropdown-menu",
 		children: [
 			/* @__PURE__ */ jsx(MenuGroup, {
-				label: "Addresses",
+				label: walletText(locale, "Addresses"),
 				items: props.menuItems.filter(isAccountItem),
 				props
 			}),
 			/* @__PURE__ */ jsx(MenuGroup, {
-				label: "Security & devices",
+				label: walletText(locale, "Security & devices"),
 				items: props.menuItems.filter(isSecurityItem).sort(compareSecurityItems),
 				props
 			}),

package/dist/esm/react/components/AccountMenuButton/RecoveryCodeAcknowledgement.js

@@ -1,3 +1,4 @@
+import { WalletText } from "../../context/WalletLocale.js";
 import { useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/react/components/AccountMenuButton/RecoveryCodeAcknowledgement.tsx
@@ -12,13 +13,13 @@ function RecoveryCodeAcknowledgement({ onDone }) {
 			type: "checkbox",
 			checked: acknowledged,
 			onChange: updateAcknowledgement.bind(null, setAcknowledged)
-		}), /* @__PURE__ */ jsx("span", { children: "I’ve saved these codes. They won’t be shown again." })]
+		}), /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(WalletText, { message: "I’ve saved these codes. They won’t be shown again." }) })]
 	}), /* @__PURE__ */ jsx("button", {
 		type: "button",
 		className: "seams-account-action primary",
 		disabled: !acknowledged,
 		onClick: onDone,
-		children: "Done"
+		children: /* @__PURE__ */ jsx(WalletText, { message: "Done" })
 	})] });
 }
 //#endregion

package/dist/esm/react/components/AccountMenuButton/RecoveryCodeActions.js

@@ -1,3 +1,4 @@
+import { WalletText } from "../../context/WalletLocale.js";
 import { useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/react/components/AccountMenuButton/RecoveryCodeActions.tsx
@@ -33,18 +34,18 @@ function RecoveryCodeActions({ codes }) {
 			type: "button",
 			className: "seams-account-action",
 			onClick: copyCodes.bind(null, codes, setFeedback),
-			children: "Copy all"
+			children: /* @__PURE__ */ jsx(WalletText, { message: "Copy all" })
 		}), /* @__PURE__ */ jsx("button", {
 			type: "button",
 			className: "seams-account-action",
 			onClick: downloadCodes.bind(null, codes, setFeedback),
-			children: "Download all"
+			children: /* @__PURE__ */ jsx(WalletText, { message: "Download all" })
 		})]
 	}), /* @__PURE__ */ jsx("p", {
 		className: "seams-recovery-code-action-status",
 		role: "status",
 		"aria-live": "polite",
-		children: feedback
+		children: /* @__PURE__ */ jsx(WalletText, { copy: feedback })
 	})] });
 }
 //#endregion