@embarkai/ui-kit 0.4.93 → 0.4.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -5010,10 +5010,11 @@ var init_cn = __esm({
5010
5010
 
5011
5011
  // src/internal/constants.ts
5012
5012
  import { Key, Mail, Wallet2 } from "lucide-react";
5013
- var LOCAL_COLOR_MODE_KEY, LOOCAL_BACKUP_STATUS_KEY, DEFAULT_AUTH_MENU_HEIGHT, DEFAULT_MAIN_MENU_HEIGHT, MAX_CONTENT_HEIGHT, MAIN_DIALOG_ANIMATION_SPEED, Y_ANIMATION_SETUP, BLOCKSCOUT_QUERY_STALE_TIME, BLOCKSCOUT_QUERY_GC_TIME, BLOCKSCOUT_REFRESH_DEBOUNCE, IPFS_GATEWAY, PROVIDERS_META;
5013
+ var EMBARKAI_DIALOG_ONBOARDING_ID, LOCAL_COLOR_MODE_KEY, LOOCAL_BACKUP_STATUS_KEY, DEFAULT_AUTH_MENU_HEIGHT, DEFAULT_MAIN_MENU_HEIGHT, MAX_CONTENT_HEIGHT, MAIN_DIALOG_ANIMATION_SPEED, Y_ANIMATION_SETUP, BLOCKSCOUT_QUERY_STALE_TIME, BLOCKSCOUT_QUERY_GC_TIME, BLOCKSCOUT_REFRESH_DEBOUNCE, IPFS_GATEWAY, PROVIDERS_META;
5014
5014
  var init_constants = __esm({
5015
5015
  "src/internal/constants.ts"() {
5016
5016
  init_assets();
5017
+ EMBARKAI_DIALOG_ONBOARDING_ID = "embark-main-dialog-content";
5017
5018
  LOCAL_COLOR_MODE_KEY = "passport-theme-mode";
5018
5019
  LOOCAL_BACKUP_STATUS_KEY = "passport-backup-status";
5019
5020
  DEFAULT_AUTH_MENU_HEIGHT = 253;
@@ -5049,25 +5050,16 @@ var init_useLayoutStore = __esm({
5049
5050
  colorMode: "light",
5050
5051
  isMobileView: false,
5051
5052
  maxScrollHeight: MAX_CONTENT_HEIGHT,
5052
- isDialogClosing: false,
5053
5053
  isDialogOpen: false,
5054
+ isDialogAnimating: false,
5054
5055
  isDialogForced: false,
5055
- dialogTitle: null,
5056
- dialogDescription: null,
5057
5056
  dialogContent: null,
5058
5057
  isSettings: false,
5059
5058
  setColorMode: (colorMode) => set({ colorMode }),
5060
- // setLayoutView: (layoutView) => set(() => ({ layoutView })),
5061
- // setDeviceType: (deviceType) => set(() => ({ deviceType })),
5062
5059
  setIsMobileView: (isMobileView) => set({ isMobileView }),
5063
5060
  setMaxScrollHeight: (maxScrollHeight) => set({ maxScrollHeight }),
5064
- setIsDialogClosing: (isDialogClosing) => set({ isDialogClosing }),
5065
- setIsDialogOpen: (isDialogOpen) => set({ isDialogOpen }),
5066
- setIsDialogForced: (isDialogForced) => set({ isDialogForced }),
5067
- setDialogTitle: (dialogTitle) => set({ dialogTitle }),
5068
- setDialogDescription: (dialogDescription) => set({ dialogDescription }),
5069
- setDialogContent: (dialogContent) => set({ dialogContent }),
5070
- setIsSettings: (isSettings) => set({ isSettings })
5061
+ /** dedicated setter for dialog forced state */
5062
+ setIsDialogForced: (isDialogForced) => set({ isDialogForced })
5071
5063
  }));
5072
5064
  }
5073
5065
  });
@@ -11081,7 +11073,6 @@ var init_AuthMenu = __esm({
11081
11073
  init_auth();
11082
11074
  init_constants();
11083
11075
  init_useLayoutDataStore();
11084
- init_useLayoutStore();
11085
11076
  init_Expandable2();
11086
11077
  init_button();
11087
11078
  init_highlight();
@@ -11095,16 +11086,14 @@ var init_AuthMenu = __esm({
11095
11086
  AuthMenu = () => {
11096
11087
  const { t } = useT();
11097
11088
  const isIframeReady = useSession((st) => st.isIframeReady);
11098
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
11099
- const setTransitionPageHeight = useLayoutDataStore((st) => st.setTransitionPageHeight);
11100
11089
  const pendingWalletLogin = useLayoutDataStore((st) => st.pendingWalletLogin);
11101
- const setPendingWalletLogin = useLayoutDataStore((st) => st.setPendingWalletLogin);
11102
- const { step, alert: alert2, setStep, setPasskeyStatus, setEmail, setEmailChallenge, setAlert } = useAuthStore();
11090
+ const step = useAuthStore((st) => st.step);
11091
+ const alert2 = useAuthStore((st) => st.alert);
11103
11092
  const { pendingLoginResponseRef, onAuthSuccess, goBackToSignIn } = useAuthMenuHandlers();
11104
11093
  useEffect12(() => {
11105
11094
  if (!pendingWalletLogin) return;
11106
11095
  const loginResponse = pendingWalletLogin;
11107
- setPendingWalletLogin(null);
11096
+ useLayoutDataStore.getState().setPendingWalletLogin(null);
11108
11097
  console.log("[AuthMenu] Processing wallet login response:", loginResponse);
11109
11098
  jwtTokenManager2.clearTokens().then(() => {
11110
11099
  pendingLoginResponseRef.current = loginResponse;
@@ -11112,8 +11101,9 @@ var init_AuthMenu = __esm({
11112
11101
  });
11113
11102
  }, [pendingWalletLogin]);
11114
11103
  useEffect12(() => {
11115
- setTransitionPageHeight(DEFAULT_AUTH_MENU_HEIGHT);
11104
+ useLayoutDataStore.getState().setTransitionPageHeight(DEFAULT_AUTH_MENU_HEIGHT);
11116
11105
  return () => {
11106
+ const { setStep, setPasskeyStatus, setEmail, setEmailChallenge, setAlert } = useAuthStore.getState();
11117
11107
  setStep("signin");
11118
11108
  setEmail("");
11119
11109
  setEmailChallenge(null);
@@ -11122,7 +11112,7 @@ var init_AuthMenu = __esm({
11122
11112
  };
11123
11113
  }, []);
11124
11114
  if (!isIframeReady) {
11125
- return /* @__PURE__ */ jsxs18("div", { className: "w-full p-8 flex flex-col justify-center items-center gap-[var(--ui-kit-gap)]", children: [
11115
+ return /* @__PURE__ */ jsxs18(Expandable, { isExpanded: true, className: "w-full p-8 flex flex-col justify-center items-center gap-[var(--ui-kit-gap)]", children: [
11126
11116
  /* @__PURE__ */ jsx23(Loader4, { className: "w-4 h-4 animate-spin" }),
11127
11117
  /* @__PURE__ */ jsx23("span", { className: "text-sm text-[var(--ui-kit-fg-muted)]", children: "Initializing wallet..." })
11128
11118
  ] });
@@ -11144,26 +11134,25 @@ var init_AuthMenu = __esm({
11144
11134
  }),
11145
11135
  [onAuthSuccess, goBackToSignIn]
11146
11136
  );
11147
- return /* @__PURE__ */ jsx23(
11148
- "div",
11149
- {
11150
- style: {
11151
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
11152
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
11153
- },
11154
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
11155
- children: /* @__PURE__ */ jsxs18(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
11156
- stepContent[step],
11157
- alert2 && /* @__PURE__ */ jsxs18(Highlight, { type: "error", children: [
11158
- /* @__PURE__ */ jsxs18("span", { className: "block w-full flex flex-col gap-1 flex-1 mb-2", children: [
11159
- /* @__PURE__ */ jsx23("span", { className: "block font-bold leading-5", children: alert2.title }),
11160
- /* @__PURE__ */ jsx23("span", { className: "block whitespace-pre-line", children: alert2.message || "Unknown error" })
11161
- ] }),
11162
- /* @__PURE__ */ jsx23(Button, { variant: "default", size: "medium", className: "w-full", onClick: () => setAlert(null), children: t("passport:common.hide") })
11163
- ] })
11164
- ] })
11165
- }
11166
- );
11137
+ return /* @__PURE__ */ jsxs18(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
11138
+ stepContent[step],
11139
+ alert2 && /* @__PURE__ */ jsxs18(Highlight, { type: "error", children: [
11140
+ /* @__PURE__ */ jsxs18("span", { className: "block w-full flex flex-col gap-1 flex-1 mb-2", children: [
11141
+ /* @__PURE__ */ jsx23("span", { className: "block font-bold leading-5", children: alert2.title }),
11142
+ /* @__PURE__ */ jsx23("span", { className: "block whitespace-pre-line", children: alert2.message || "Unknown error" })
11143
+ ] }),
11144
+ /* @__PURE__ */ jsx23(
11145
+ Button,
11146
+ {
11147
+ variant: "default",
11148
+ size: "medium",
11149
+ className: "w-full",
11150
+ onClick: () => useAuthStore.getState().setAlert(null),
11151
+ children: t("passport:common.hide")
11152
+ }
11153
+ )
11154
+ ] })
11155
+ ] });
11167
11156
  };
11168
11157
  }
11169
11158
  });
@@ -12649,11 +12638,12 @@ var init_components = __esm({
12649
12638
  var BUY_MENU_BINANCE_TOUR;
12650
12639
  var init_onboarding_setup = __esm({
12651
12640
  "src/internal/components/BuyMenu/onboarding.setup.ts"() {
12641
+ init_constants();
12652
12642
  init_useBinanceStore();
12653
12643
  init_useBuyMenuStore();
12654
12644
  BUY_MENU_BINANCE_TOUR = [
12655
12645
  {
12656
- elId: "buymenu-page" /* buymenu */,
12646
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"buy" /* BUY */}`,
12657
12647
  title: "passport:buyMenu.onboarding.buyMenu.title",
12658
12648
  description: "passport:buyMenu.onboarding.buyMenu.description",
12659
12649
  waitSecs: 6,
@@ -14456,7 +14446,6 @@ import { Fragment as Fragment14, jsx as jsx50, jsxs as jsxs43 } from "react/jsx-
14456
14446
  function BuyMenu() {
14457
14447
  const { t } = useT();
14458
14448
  const walletAddress = useSession((st) => st.address);
14459
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
14460
14449
  useBuyMenuParams();
14461
14450
  useHandleInputAmount();
14462
14451
  const rampProvider = useBuyMenuStore((st) => st.rampProvider);
@@ -14472,103 +14461,92 @@ function BuyMenu() {
14472
14461
  const showExtras = !isCryptoSelector && !isFiatSelector && !isProviderSummary && !isProviderSelector && !isPaymentModeSelector;
14473
14462
  const showProviderTrigger = showExtras && !isTransactionHistory;
14474
14463
  useOnboardingTourAvailable(showProviderTrigger);
14475
- return /* @__PURE__ */ jsx50(
14476
- "div",
14477
- {
14478
- ref: (inst) => onboarder.registerElement("buymenu-page" /* buymenu */, inst),
14479
- style: {
14480
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
14481
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
14482
- },
14483
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
14484
- children: /* @__PURE__ */ jsxs43(Expandable, { isExpanded: true, contentClassName: "relative w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
14485
- /* @__PURE__ */ jsxs43("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
14486
- /* @__PURE__ */ jsx50(
14487
- Button,
14488
- {
14489
- variant: "ghost",
14490
- size: "icon",
14491
- className: "flex-none",
14492
- onClick: () => {
14493
- const {
14494
- setIsProviderSummary,
14495
- setIsTransactionHistory,
14496
- setIsProviderSelector,
14497
- setIsCryptoSelector,
14498
- setIsFiatSelector,
14499
- setIsPaymentModeSelector,
14500
- setError
14501
- } = useBuyMenuStore.getState();
14502
- setError(null);
14503
- if (isProviderSummary) {
14504
- setIsProviderSummary(false);
14505
- return;
14506
- }
14507
- if (isTransactionHistory) {
14508
- setIsTransactionHistory(false);
14509
- return;
14510
- }
14511
- if (isProviderSelector) {
14512
- setIsProviderSelector(false);
14513
- return;
14514
- }
14515
- if (isCryptoSelector) {
14516
- setIsCryptoSelector(false);
14517
- return;
14518
- }
14519
- if (isFiatSelector) {
14520
- setIsFiatSelector(false);
14521
- return;
14522
- }
14523
- if (isPaymentModeSelector) {
14524
- setIsPaymentModeSelector(false);
14525
- return;
14526
- }
14527
- useLayoutDataStore.getState().setPage("main-menu" /* MAIN_MENU */);
14528
- },
14529
- children: /* @__PURE__ */ jsx50(ArrowLeft3, { className: "h-4 w-4" })
14464
+ return /* @__PURE__ */ jsxs43(Expandable, { isExpanded: true, contentClassName: "relative w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
14465
+ /* @__PURE__ */ jsxs43("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
14466
+ /* @__PURE__ */ jsx50(
14467
+ Button,
14468
+ {
14469
+ variant: "ghost",
14470
+ size: "icon",
14471
+ className: "flex-none",
14472
+ onClick: () => {
14473
+ const {
14474
+ setIsProviderSummary,
14475
+ setIsTransactionHistory,
14476
+ setIsProviderSelector,
14477
+ setIsCryptoSelector,
14478
+ setIsFiatSelector,
14479
+ setIsPaymentModeSelector,
14480
+ setError
14481
+ } = useBuyMenuStore.getState();
14482
+ setError(null);
14483
+ if (isProviderSummary) {
14484
+ setIsProviderSummary(false);
14485
+ return;
14530
14486
  }
14531
- ),
14532
- /* @__PURE__ */ jsx50("span", { className: "block flex-none text-xl font-semibold", children: t("passport:buyMenu.title") }),
14533
- showExtras && /* @__PURE__ */ jsx50("div", { className: "flex-1 h-8 flex items-center justify-end gap-[var(--ui-kit-gap)]", children: /* @__PURE__ */ jsx50(
14534
- Switch,
14535
- {
14536
- labels: { checked: "PURCHASE", unchecked: "HISTORY" },
14537
- checked: isTransactionHistory,
14538
- onChange: () => {
14539
- useBuyMenuStore.getState().setError(null);
14540
- useBuyMenuStore.getState().setIsTransactionHistory();
14541
- }
14487
+ if (isTransactionHistory) {
14488
+ setIsTransactionHistory(false);
14489
+ return;
14542
14490
  }
14543
- ) })
14544
- ] }),
14545
- showProviderTrigger && /* @__PURE__ */ jsxs43(Fragment14, { children: [
14546
- /* @__PURE__ */ jsx50("span", { className: "block text-[10px] text-[var(--ui-kit-fg-muted)]", children: t("passport:buyMenu.selectProvider") }),
14547
- /* @__PURE__ */ jsxs43(
14548
- Button,
14549
- {
14550
- ref: (inst) => onboarder.registerElement("buymenu-provider-selector" /* providerSelector */, inst),
14551
- variant: !!selectedProvider?.id ? "default" : "secondary",
14552
- onClick: () => {
14553
- useBuyMenuStore.getState().setError(null);
14554
- useBuyMenuStore.getState().setIsProviderSelector(true);
14555
- },
14556
- className: cn2("w-full justify-center", {
14557
- [ACTIVE_PROVIDER_CNS[selectedProvider?.id]]: rampProvider === selectedProvider?.id,
14558
- [IDLE_PROVIDERS_CNS[selectedProvider?.id]]: rampProvider !== selectedProvider?.id
14559
- }),
14560
- children: [
14561
- /* @__PURE__ */ jsx50(selectedProvider.icon, {}),
14562
- !selectedProvider.icon && t("passport:buyMenu.selectProvider")
14563
- ]
14491
+ if (isProviderSelector) {
14492
+ setIsProviderSelector(false);
14493
+ return;
14564
14494
  }
14565
- )
14566
- ] }),
14567
- isProviderSelector ? /* @__PURE__ */ jsx50(ProviderSelector, { providers: AVAILABLE_RAMP_PROVIDERS.map((el) => ({ ...el, Icon: el.icon })) }) : /* @__PURE__ */ jsx50(ProviderComponent, { walletAddress }),
14568
- error && /* @__PURE__ */ jsx50(Highlight, { type: "error", children: error })
14569
- ] })
14570
- }
14571
- );
14495
+ if (isCryptoSelector) {
14496
+ setIsCryptoSelector(false);
14497
+ return;
14498
+ }
14499
+ if (isFiatSelector) {
14500
+ setIsFiatSelector(false);
14501
+ return;
14502
+ }
14503
+ if (isPaymentModeSelector) {
14504
+ setIsPaymentModeSelector(false);
14505
+ return;
14506
+ }
14507
+ useLayoutDataStore.getState().setPage("main-menu" /* MAIN_MENU */);
14508
+ },
14509
+ children: /* @__PURE__ */ jsx50(ArrowLeft3, { className: "h-4 w-4" })
14510
+ }
14511
+ ),
14512
+ /* @__PURE__ */ jsx50("span", { className: "block flex-none text-xl font-semibold", children: t("passport:buyMenu.title") }),
14513
+ showExtras && /* @__PURE__ */ jsx50("div", { className: "flex-1 h-8 flex items-center justify-end gap-[var(--ui-kit-gap)]", children: /* @__PURE__ */ jsx50(
14514
+ Switch,
14515
+ {
14516
+ labels: { checked: "PURCHASE", unchecked: "HISTORY" },
14517
+ checked: isTransactionHistory,
14518
+ onChange: () => {
14519
+ useBuyMenuStore.getState().setError(null);
14520
+ useBuyMenuStore.getState().setIsTransactionHistory();
14521
+ }
14522
+ }
14523
+ ) })
14524
+ ] }),
14525
+ showProviderTrigger && /* @__PURE__ */ jsxs43(Fragment14, { children: [
14526
+ /* @__PURE__ */ jsx50("span", { className: "block text-[10px] text-[var(--ui-kit-fg-muted)]", children: t("passport:buyMenu.selectProvider") }),
14527
+ /* @__PURE__ */ jsxs43(
14528
+ Button,
14529
+ {
14530
+ ref: (inst) => onboarder.registerElement("buymenu-provider-selector" /* providerSelector */, inst),
14531
+ variant: !!selectedProvider?.id ? "default" : "secondary",
14532
+ onClick: () => {
14533
+ useBuyMenuStore.getState().setError(null);
14534
+ useBuyMenuStore.getState().setIsProviderSelector(true);
14535
+ },
14536
+ className: cn2("w-full justify-center", {
14537
+ [ACTIVE_PROVIDER_CNS[selectedProvider?.id]]: rampProvider === selectedProvider?.id,
14538
+ [IDLE_PROVIDERS_CNS[selectedProvider?.id]]: rampProvider !== selectedProvider?.id
14539
+ }),
14540
+ children: [
14541
+ /* @__PURE__ */ jsx50(selectedProvider.icon, {}),
14542
+ !selectedProvider.icon && t("passport:buyMenu.selectProvider")
14543
+ ]
14544
+ }
14545
+ )
14546
+ ] }),
14547
+ isProviderSelector ? /* @__PURE__ */ jsx50(ProviderSelector, { providers: AVAILABLE_RAMP_PROVIDERS.map((el) => ({ ...el, Icon: el.icon })) }) : /* @__PURE__ */ jsx50(ProviderComponent, { walletAddress }),
14548
+ error && /* @__PURE__ */ jsx50(Highlight, { type: "error", children: error })
14549
+ ] });
14572
14550
  }
14573
14551
  var init_BuyMenu = __esm({
14574
14552
  "src/internal/components/BuyMenu/BuyMenu.tsx"() {
@@ -14576,7 +14554,6 @@ var init_BuyMenu = __esm({
14576
14554
  init_SessionContext();
14577
14555
  init_i18n();
14578
14556
  init_useLayoutDataStore();
14579
- init_useLayoutStore();
14580
14557
  init_Expandable2();
14581
14558
  init_Onboarding();
14582
14559
  init_button();
@@ -14937,20 +14914,6 @@ var init_ChainItem = __esm({
14937
14914
  }
14938
14915
  });
14939
14916
 
14940
- // src/internal/components/ChainsMenu/onboarding.setup.ts
14941
- var CHAIN_MENU_TOUR;
14942
- var init_onboarding_setup2 = __esm({
14943
- "src/internal/components/ChainsMenu/onboarding.setup.ts"() {
14944
- CHAIN_MENU_TOUR = [
14945
- {
14946
- elId: "embarkai-chain-menu-onboarding" /* chainMenu */,
14947
- title: "passport:chainMenu.onboarding.chainMenu.title",
14948
- description: "passport:chainMenu.onboarding.chainMenu.description"
14949
- }
14950
- ];
14951
- }
14952
- });
14953
-
14954
14917
  // src/internal/components/ChainsMenu/ChainsMenu.tsx
14955
14918
  import { PAYMASTER_CACHE_TTL_MS } from "@embarkai/core";
14956
14919
  import { getChainConfig as getChainConfig8, SUPPORTED_MAINNETS as SUPPORTED_MAINNETS2 } from "@embarkai/core/read";
@@ -14962,7 +14925,6 @@ function ChainsMenu() {
14962
14925
  const { t } = useT();
14963
14926
  const config = useProviderConfig().config;
14964
14927
  const activeChainId = useSession((st) => st.activeChainId);
14965
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
14966
14928
  const [isTestnets, setIsTestnets] = useState11(false);
14967
14929
  const [nextChainId, setNextChainId] = useState11(null);
14968
14930
  useOnboardingTourAvailable(true);
@@ -14993,56 +14955,45 @@ function ChainsMenu() {
14993
14955
  chainId: activeChainId
14994
14956
  } : void 0
14995
14957
  });
14996
- return /* @__PURE__ */ jsx58(
14997
- "div",
14998
- {
14999
- ref: (inst) => onboarder.registerElement("embarkai-chain-menu-onboarding" /* chainMenu */, inst),
15000
- style: {
15001
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
15002
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
15003
- },
15004
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
15005
- children: /* @__PURE__ */ jsxs51(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
15006
- /* @__PURE__ */ jsxs51("div", { className: "flex items-center justify-between gap-[var(--ui-kit-gap)]", children: [
15007
- /* @__PURE__ */ jsxs51("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
15008
- /* @__PURE__ */ jsx58(
15009
- Button,
15010
- {
15011
- size: "icon",
15012
- variant: "ghost",
15013
- title: t("passport:common.back"),
15014
- onClick: () => {
15015
- const chainMenuOpenedFrom = useLayoutDataStore.getState().chainMenuOpenedFrom;
15016
- useLayoutDataStore.getState().setPage(chainMenuOpenedFrom || "settings" /* SETTINGS */);
15017
- },
15018
- children: /* @__PURE__ */ jsx58(ArrowLeft4, { className: "h-4 w-4" })
15019
- }
15020
- ),
15021
- /* @__PURE__ */ jsx58("span", { className: "text-xl font-semibold", children: t("passport:chainMenu.title") })
15022
- ] }),
15023
- /* @__PURE__ */ jsx58(
15024
- Switch,
15025
- {
15026
- labels: { checked: "MAINNETS", unchecked: "ALL" },
15027
- checked: isTestnets,
15028
- onChange: () => setIsTestnets(!isTestnets)
15029
- }
15030
- )
15031
- ] }),
15032
- /* @__PURE__ */ jsx58("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: visibleNetworks.map((network, networkIdx) => /* @__PURE__ */ jsx58(
15033
- ChainItem,
14958
+ return /* @__PURE__ */ jsxs51(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
14959
+ /* @__PURE__ */ jsxs51("div", { className: "flex items-center justify-between gap-[var(--ui-kit-gap)]", children: [
14960
+ /* @__PURE__ */ jsxs51("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
14961
+ /* @__PURE__ */ jsx58(
14962
+ Button,
15034
14963
  {
15035
- ...network,
15036
- nextChainId,
15037
- setNextChainId,
15038
- isActivePaymasterDataLoading,
15039
- activePaymasterData
15040
- },
15041
- `chain-${network.chainId}-${networkIdx}`
15042
- )) })
15043
- ] })
15044
- }
15045
- );
14964
+ size: "icon",
14965
+ variant: "ghost",
14966
+ title: t("passport:common.back"),
14967
+ onClick: () => {
14968
+ const chainMenuOpenedFrom = useLayoutDataStore.getState().chainMenuOpenedFrom;
14969
+ useLayoutDataStore.getState().setPage(chainMenuOpenedFrom || "settings" /* SETTINGS */);
14970
+ },
14971
+ children: /* @__PURE__ */ jsx58(ArrowLeft4, { className: "h-4 w-4" })
14972
+ }
14973
+ ),
14974
+ /* @__PURE__ */ jsx58("span", { className: "text-xl font-semibold", children: t("passport:chainMenu.title") })
14975
+ ] }),
14976
+ /* @__PURE__ */ jsx58(
14977
+ Switch,
14978
+ {
14979
+ labels: { checked: "MAINNETS", unchecked: "ALL" },
14980
+ checked: isTestnets,
14981
+ onChange: () => setIsTestnets(!isTestnets)
14982
+ }
14983
+ )
14984
+ ] }),
14985
+ /* @__PURE__ */ jsx58("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: visibleNetworks.map((network, networkIdx) => /* @__PURE__ */ jsx58(
14986
+ ChainItem,
14987
+ {
14988
+ ...network,
14989
+ nextChainId,
14990
+ setNextChainId,
14991
+ isActivePaymasterDataLoading,
14992
+ activePaymasterData
14993
+ },
14994
+ `chain-${network.chainId}-${networkIdx}`
14995
+ )) })
14996
+ ] });
15046
14997
  }
15047
14998
  var init_ChainsMenu = __esm({
15048
14999
  "src/internal/components/ChainsMenu/ChainsMenu.tsx"() {
@@ -15052,7 +15003,6 @@ var init_ChainsMenu = __esm({
15052
15003
  init_useT();
15053
15004
  init_resolve_paymaster();
15054
15005
  init_useLayoutDataStore();
15055
- init_useLayoutStore();
15056
15006
  init_Expandable2();
15057
15007
  init_Onboarding();
15058
15008
  init_button();
@@ -15070,71 +15020,60 @@ function ChainSwitchRequest() {
15070
15020
  const config = useProviderConfig().config;
15071
15021
  const isLoading = useSession((st) => st.isLoading);
15072
15022
  const chainConfig = useSession((st) => st.chainConfig);
15073
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
15074
15023
  const prefferedChain = NETWORK_OPTIONS.find((ch) => ch.chainId === config.current?.network?.chainId) || null;
15075
15024
  const PrefferedChainIcon = prefferedChain?.Icon || (() => null);
15076
- return /* @__PURE__ */ jsx59(
15077
- "div",
15078
- {
15079
- style: {
15080
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
15081
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
15082
- },
15083
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
15084
- children: /* @__PURE__ */ jsxs52(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
15085
- /* @__PURE__ */ jsxs52("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
15086
- /* @__PURE__ */ jsx59(
15087
- Button,
15088
- {
15089
- size: "icon",
15090
- variant: "ghost",
15091
- title: t("passport:common.back"),
15092
- onClick: () => useLayoutDataStore.getState().setPage("settings" /* SETTINGS */),
15093
- children: /* @__PURE__ */ jsx59(ArrowLeft5, { className: "h-4 w-4" })
15094
- }
15095
- ),
15096
- /* @__PURE__ */ jsx59("span", { className: "text-xl font-semibold", children: t("passport:chainMenu.chainSwitchRequest.title") })
15097
- ] }),
15098
- /* @__PURE__ */ jsxs52(Highlight, { type: "info", className: "flex gap-[var(--ui-kit-gap)]", children: [
15099
- /* @__PURE__ */ jsx59(Info2, { className: "w-4 h-4 flex-none" }),
15100
- /* @__PURE__ */ jsx59("span", { className: "block", children: /* @__PURE__ */ jsx59(
15101
- Trans,
15102
- {
15103
- i18nKey: "passport:chainMenu.chainSwitchRequest.description",
15104
- values: {
15105
- preferredChain: `${prefferedChain?.name || "N/A"}`,
15106
- currentChain: `${chainConfig?.name || "N/A"}`
15107
- },
15108
- components: {
15109
- br: /* @__PURE__ */ jsx59("br", {}),
15110
- b: /* @__PURE__ */ jsx59("span", { className: "font-bold" })
15111
- }
15112
- }
15113
- ) })
15114
- ] }),
15115
- /* @__PURE__ */ jsxs52(
15116
- Button,
15117
- {
15118
- size: "large",
15119
- variant: "default",
15120
- className: "w-full",
15121
- disabled: isLoading,
15122
- onClick: () => {
15123
- if (!config.current?.network?.chainId) return;
15124
- useSession.getState().setActiveChainId(config.current.network.chainId);
15125
- useLayoutDataStore.getState().setPage("chain" /* CHAIN */);
15126
- },
15127
- children: [
15128
- isLoading ? /* @__PURE__ */ jsx59(Loader7, { className: "w-6 h-6 animate-spin" }) : /* @__PURE__ */ jsx59(PrefferedChainIcon, { className: "w-6 h-6" }),
15129
- t("passport:chainMenu.chainSwitchRequest.confirmButton", {
15130
- chain: `${prefferedChain?.name || "N/A"}`
15131
- })
15132
- ]
15025
+ return /* @__PURE__ */ jsxs52(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
15026
+ /* @__PURE__ */ jsxs52("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
15027
+ /* @__PURE__ */ jsx59(
15028
+ Button,
15029
+ {
15030
+ size: "icon",
15031
+ variant: "ghost",
15032
+ title: t("passport:common.back"),
15033
+ onClick: () => useLayoutDataStore.getState().setPage("settings" /* SETTINGS */),
15034
+ children: /* @__PURE__ */ jsx59(ArrowLeft5, { className: "h-4 w-4" })
15035
+ }
15036
+ ),
15037
+ /* @__PURE__ */ jsx59("span", { className: "text-xl font-semibold", children: t("passport:chainMenu.chainSwitchRequest.title") })
15038
+ ] }),
15039
+ /* @__PURE__ */ jsxs52(Highlight, { type: "info", className: "flex gap-[var(--ui-kit-gap)]", children: [
15040
+ /* @__PURE__ */ jsx59(Info2, { className: "w-4 h-4 flex-none" }),
15041
+ /* @__PURE__ */ jsx59("span", { className: "block", children: /* @__PURE__ */ jsx59(
15042
+ Trans,
15043
+ {
15044
+ i18nKey: "passport:chainMenu.chainSwitchRequest.description",
15045
+ values: {
15046
+ preferredChain: `${prefferedChain?.name || "N/A"}`,
15047
+ currentChain: `${chainConfig?.name || "N/A"}`
15048
+ },
15049
+ components: {
15050
+ br: /* @__PURE__ */ jsx59("br", {}),
15051
+ b: /* @__PURE__ */ jsx59("span", { className: "font-bold" })
15133
15052
  }
15134
- )
15135
- ] })
15136
- }
15137
- );
15053
+ }
15054
+ ) })
15055
+ ] }),
15056
+ /* @__PURE__ */ jsxs52(
15057
+ Button,
15058
+ {
15059
+ size: "large",
15060
+ variant: "default",
15061
+ className: "w-full",
15062
+ disabled: isLoading,
15063
+ onClick: () => {
15064
+ if (!config.current?.network?.chainId) return;
15065
+ useSession.getState().setActiveChainId(config.current.network.chainId);
15066
+ useLayoutDataStore.getState().setPage("chain" /* CHAIN */);
15067
+ },
15068
+ children: [
15069
+ isLoading ? /* @__PURE__ */ jsx59(Loader7, { className: "w-6 h-6 animate-spin" }) : /* @__PURE__ */ jsx59(PrefferedChainIcon, { className: "w-6 h-6" }),
15070
+ t("passport:chainMenu.chainSwitchRequest.confirmButton", {
15071
+ chain: `${prefferedChain?.name || "N/A"}`
15072
+ })
15073
+ ]
15074
+ }
15075
+ )
15076
+ ] });
15138
15077
  }
15139
15078
  var init_ChainSwitchRequest = __esm({
15140
15079
  "src/internal/components/ChainsMenu/ChainSwitchRequest.tsx"() {
@@ -15143,13 +15082,27 @@ var init_ChainSwitchRequest = __esm({
15143
15082
  init_SessionContext();
15144
15083
  init_useT();
15145
15084
  init_useLayoutDataStore();
15146
- init_useLayoutStore();
15147
15085
  init_Expandable2();
15148
15086
  init_button();
15149
15087
  init_highlight();
15150
15088
  }
15151
15089
  });
15152
15090
 
15091
+ // src/internal/components/ChainsMenu/onboarding.setup.ts
15092
+ var CHAIN_MENU_TOUR;
15093
+ var init_onboarding_setup2 = __esm({
15094
+ "src/internal/components/ChainsMenu/onboarding.setup.ts"() {
15095
+ init_constants();
15096
+ CHAIN_MENU_TOUR = [
15097
+ {
15098
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"chain" /* CHAIN */}`,
15099
+ title: "passport:chainMenu.onboarding.chainMenu.title",
15100
+ description: "passport:chainMenu.onboarding.chainMenu.description"
15101
+ }
15102
+ ];
15103
+ }
15104
+ });
15105
+
15153
15106
  // src/internal/components/ChainsMenu/index.ts
15154
15107
  var init_ChainsMenu2 = __esm({
15155
15108
  "src/internal/components/ChainsMenu/index.ts"() {
@@ -16359,20 +16312,6 @@ var init_useLinkTelegram = __esm({
16359
16312
  }
16360
16313
  });
16361
16314
 
16362
- // src/internal/components/ManageWalletMenu/onboarding.setup.ts
16363
- var MANAGE_WALLET_MENU_TOUR;
16364
- var init_onboarding_setup3 = __esm({
16365
- "src/internal/components/ManageWalletMenu/onboarding.setup.ts"() {
16366
- MANAGE_WALLET_MENU_TOUR = [
16367
- {
16368
- elId: "embarkai-profiles-menu-onboarding" /* profilesMenu */,
16369
- title: "passport:profilesMenu.onboarding.profilesMenu.title",
16370
- description: "passport:profilesMenu.onboarding.profilesMenu.description"
16371
- }
16372
- ];
16373
- }
16374
- });
16375
-
16376
16315
  // src/internal/components/ManageWalletMenu/ProviderCard.tsx
16377
16316
  import { Clock, Link2Icon, LoaderIcon as LoaderIcon7, Trash2Icon, UnplugIcon } from "lucide-react";
16378
16317
  import { Fragment as Fragment16, jsx as jsx68, jsxs as jsxs60 } from "react/jsx-runtime";
@@ -16550,7 +16489,6 @@ function ManageWalletMenu() {
16550
16489
  const config = useProviderConfig().config;
16551
16490
  const { t } = useT();
16552
16491
  const { open: openEmbarkAI } = useOpenPage();
16553
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
16554
16492
  const {
16555
16493
  alert: alert2,
16556
16494
  providerType,
@@ -16645,66 +16583,54 @@ function ManageWalletMenu() {
16645
16583
  const showExtraProvidersUi = !isProvidersLoading && !providersError && (providerType === "email" || providerType === "passkey");
16646
16584
  useOnboardingTourAvailable(!showExtraProvidersUi && providerType === null);
16647
16585
  const combinedAlertMessage = alert2?.message || providersError?.message || null;
16648
- return /* @__PURE__ */ jsx69(
16649
- "div",
16650
- {
16651
- ref: (inst) => onboarder.registerElement("embarkai-profiles-menu-onboarding" /* profilesMenu */, inst),
16652
- style: {
16653
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
16654
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
16655
- },
16656
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
16657
- children: /* @__PURE__ */ jsxs61(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
16658
- /* @__PURE__ */ jsxs61("div", { className: "flex items-center gap-[var(--ui-kit-gap)] w-full justify-between", children: [
16659
- /* @__PURE__ */ jsxs61("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
16660
- /* @__PURE__ */ jsx69(
16661
- Button,
16662
- {
16663
- variant: "ghost",
16664
- size: "icon",
16665
- title: t("passport:common.back"),
16666
- disabled: linkIsLoading,
16667
- onClick: () => {
16668
- setAlert(null);
16669
- if (providerType === "email") {
16670
- setEmail("");
16671
- setEmailCode("");
16672
- setEmailStep("input");
16673
- setEmailCodeExpiresAt(0);
16674
- }
16675
- if (!providerType) useLayoutDataStore.getState().setPage("settings" /* SETTINGS */);
16676
- setProviderType(null);
16677
- },
16678
- children: /* @__PURE__ */ jsx69(ArrowLeft6, { className: "h-4 w-4" })
16586
+ return /* @__PURE__ */ jsxs61(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
16587
+ /* @__PURE__ */ jsxs61("div", { className: "flex items-center gap-[var(--ui-kit-gap)] w-full justify-between", children: [
16588
+ /* @__PURE__ */ jsxs61("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
16589
+ /* @__PURE__ */ jsx69(
16590
+ Button,
16591
+ {
16592
+ variant: "ghost",
16593
+ size: "icon",
16594
+ title: t("passport:common.back"),
16595
+ disabled: linkIsLoading,
16596
+ onClick: () => {
16597
+ setAlert(null);
16598
+ if (providerType === "email") {
16599
+ setEmail("");
16600
+ setEmailCode("");
16601
+ setEmailStep("input");
16602
+ setEmailCodeExpiresAt(0);
16679
16603
  }
16680
- ),
16681
- /* @__PURE__ */ jsx69("span", { className: "text-xl font-semibold", children: t("passport:profilesMenu.title") })
16682
- ] }),
16683
- linkIsLoading && /* @__PURE__ */ jsx69(LoaderIcon8, { className: "w-4 h-4 animate-spin text-[var(--ui-kit-fg-muted)]" })
16684
- ] }),
16685
- isProvidersLoading && /* @__PURE__ */ jsx69("div", { className: "flex items-center justify-center p-4 text-[var(--ui-kit-fg-muted)]", children: /* @__PURE__ */ jsx69(Loader9, { className: "w-4 h-4 animate-spin" }) }),
16686
- /* @__PURE__ */ jsx69(EmailNotConnectedWarning, {}),
16687
- showCurrentProviders && renderProviders.map((node) => node),
16688
- showExtraProvidersUi && /* @__PURE__ */ jsx69(AddProvider, {}),
16689
- combinedAlertMessage && /* @__PURE__ */ jsxs61(Highlight, { type: "error", children: [
16690
- /* @__PURE__ */ jsxs61("div", { className: "break-words whitespace-pre-wrap mb-4", children: [
16691
- alert2?.title && /* @__PURE__ */ jsxs61(Fragment17, { children: [
16692
- /* @__PURE__ */ jsx69("strong", { children: alert2.title }),
16693
- /* @__PURE__ */ jsx69("br", {})
16694
- ] }),
16695
- combinedAlertMessage
16696
- ] }),
16697
- /* @__PURE__ */ jsx69(Button, { variant: "default", size: "medium", className: "w-full", onClick: () => setAlert(null), children: t("passport:common.hide") })
16698
- ] })
16699
- ] })
16700
- }
16701
- );
16604
+ if (!providerType) useLayoutDataStore.getState().setPage("settings" /* SETTINGS */);
16605
+ setProviderType(null);
16606
+ },
16607
+ children: /* @__PURE__ */ jsx69(ArrowLeft6, { className: "h-4 w-4" })
16608
+ }
16609
+ ),
16610
+ /* @__PURE__ */ jsx69("span", { className: "text-xl font-semibold", children: t("passport:profilesMenu.title") })
16611
+ ] }),
16612
+ linkIsLoading && /* @__PURE__ */ jsx69(LoaderIcon8, { className: "w-4 h-4 animate-spin text-[var(--ui-kit-fg-muted)]" })
16613
+ ] }),
16614
+ isProvidersLoading && /* @__PURE__ */ jsx69("div", { className: "flex items-center justify-center p-4 text-[var(--ui-kit-fg-muted)]", children: /* @__PURE__ */ jsx69(Loader9, { className: "w-4 h-4 animate-spin" }) }),
16615
+ /* @__PURE__ */ jsx69(EmailNotConnectedWarning, {}),
16616
+ showCurrentProviders && renderProviders.map((node) => node),
16617
+ showExtraProvidersUi && /* @__PURE__ */ jsx69(AddProvider, {}),
16618
+ combinedAlertMessage && /* @__PURE__ */ jsxs61(Highlight, { type: "error", children: [
16619
+ /* @__PURE__ */ jsxs61("div", { className: "break-words whitespace-pre-wrap mb-4", children: [
16620
+ alert2?.title && /* @__PURE__ */ jsxs61(Fragment17, { children: [
16621
+ /* @__PURE__ */ jsx69("strong", { children: alert2.title }),
16622
+ /* @__PURE__ */ jsx69("br", {})
16623
+ ] }),
16624
+ combinedAlertMessage
16625
+ ] }),
16626
+ /* @__PURE__ */ jsx69(Button, { variant: "default", size: "medium", className: "w-full", onClick: () => setAlert(null), children: t("passport:common.hide") })
16627
+ ] })
16628
+ ] });
16702
16629
  }
16703
16630
  var POSSIBLE_PROVIDERS, MULTI_PROVIDERS;
16704
16631
  var init_ManageWallet = __esm({
16705
16632
  "src/internal/components/ManageWalletMenu/ManageWallet.tsx"() {
16706
16633
  init_useLayoutDataStore();
16707
- init_useLayoutStore();
16708
16634
  init_ProviderContext();
16709
16635
  init_useOpenPage();
16710
16636
  init_i18n();
@@ -16847,6 +16773,21 @@ var init_UnlinkProviderMenu = __esm({
16847
16773
  }
16848
16774
  });
16849
16775
 
16776
+ // src/internal/components/ManageWalletMenu/onboarding.setup.ts
16777
+ var MANAGE_WALLET_MENU_TOUR;
16778
+ var init_onboarding_setup3 = __esm({
16779
+ "src/internal/components/ManageWalletMenu/onboarding.setup.ts"() {
16780
+ init_constants();
16781
+ MANAGE_WALLET_MENU_TOUR = [
16782
+ {
16783
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"manage-wallet" /* MANAGE_WALLET */}`,
16784
+ title: "passport:profilesMenu.onboarding.profilesMenu.title",
16785
+ description: "passport:profilesMenu.onboarding.profilesMenu.description"
16786
+ }
16787
+ ];
16788
+ }
16789
+ });
16790
+
16850
16791
  // src/internal/components/ManageWalletMenu/index.ts
16851
16792
  var init_ManageWalletMenu = __esm({
16852
16793
  "src/internal/components/ManageWalletMenu/index.ts"() {
@@ -16901,7 +16842,6 @@ function ConnectExternalWalletMenu() {
16901
16842
  const { isConnected: isExternalWalletConnected } = useConnection();
16902
16843
  const { mutate: disconnect } = useDisconnect2();
16903
16844
  const { mutateAsync: signMessageAsync } = useSignMessage();
16904
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
16905
16845
  const walletMenuOpenedFrom = useLayoutDataStore((st) => st.walletMenuOpenedFrom);
16906
16846
  const { data: providers = [] } = useQuery8({
16907
16847
  retry: false,
@@ -17117,69 +17057,59 @@ function ConnectExternalWalletMenu() {
17117
17057
  return t("passport:connectMenu.instructions.confirm");
17118
17058
  }
17119
17059
  }, [embarkAiAddress, t]);
17120
- return /* @__PURE__ */ jsx71(
17121
- "div",
17122
- {
17123
- style: {
17124
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
17125
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
17126
- },
17127
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
17128
- children: /* @__PURE__ */ jsxs63(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
17129
- /* @__PURE__ */ jsxs63("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
17130
- /* @__PURE__ */ jsx71(
17131
- Button,
17132
- {
17133
- variant: "ghost",
17134
- size: "icon",
17135
- title: t("passport:common.back"),
17136
- disabled: isConnectingExternalWallet || isLoginOrLinkOrConnectWallet,
17137
- onClick: () => useLayoutDataStore.getState().setPage(walletMenuOpenedFrom ?? "main-menu" /* MAIN_MENU */),
17138
- children: /* @__PURE__ */ jsx71(ArrowLeft7, { className: "h-4 w-4" })
17060
+ return /* @__PURE__ */ jsxs63(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
17061
+ /* @__PURE__ */ jsxs63("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
17062
+ /* @__PURE__ */ jsx71(
17063
+ Button,
17064
+ {
17065
+ variant: "ghost",
17066
+ size: "icon",
17067
+ title: t("passport:common.back"),
17068
+ disabled: isConnectingExternalWallet || isLoginOrLinkOrConnectWallet,
17069
+ onClick: () => useLayoutDataStore.getState().setPage(walletMenuOpenedFrom ?? "main-menu" /* MAIN_MENU */),
17070
+ children: /* @__PURE__ */ jsx71(ArrowLeft7, { className: "h-4 w-4" })
17071
+ }
17072
+ ),
17073
+ /* @__PURE__ */ jsx71("span", { className: "text-xl font-semibold", children: t("passport:connectMenu.connectWallet") })
17074
+ ] }),
17075
+ visibleConnectors.map((connector) => {
17076
+ const isConnectingThis = isConnectingExternalWallet && //@ts-expect-error uid exists
17077
+ pendingConnectVariables?.connector?.uid === connector.uid;
17078
+ const WalletIcon = WALLET_ICONS[connector.id] || Wallet2Icon2;
17079
+ return /* @__PURE__ */ jsxs63(
17080
+ Button,
17081
+ {
17082
+ variant: "secondary",
17083
+ size: "large",
17084
+ className: "w-full justify-center",
17085
+ disabled: isConnectingExternalWallet,
17086
+ onClick: async () => {
17087
+ if (isExternalWalletConnected) {
17088
+ disconnect();
17089
+ await new Promise((resolve) => setTimeout(resolve, 500));
17139
17090
  }
17140
- ),
17141
- /* @__PURE__ */ jsx71("span", { className: "text-xl font-semibold", children: t("passport:connectMenu.connectWallet") })
17142
- ] }),
17143
- visibleConnectors.map((connector) => {
17144
- const isConnectingThis = isConnectingExternalWallet && //@ts-expect-error uid exists
17145
- pendingConnectVariables?.connector?.uid === connector.uid;
17146
- const WalletIcon = WALLET_ICONS[connector.id] || Wallet2Icon2;
17147
- return /* @__PURE__ */ jsxs63(
17148
- Button,
17149
- {
17150
- variant: "secondary",
17151
- size: "large",
17152
- className: "w-full justify-center",
17153
- disabled: isConnectingExternalWallet,
17154
- onClick: async () => {
17155
- if (isExternalWalletConnected) {
17156
- disconnect();
17157
- await new Promise((resolve) => setTimeout(resolve, 500));
17158
- }
17159
- useLayoutStore.getState().setIsDialogForced(true);
17160
- connect({ connector });
17161
- },
17162
- children: [
17163
- isConnectingThis ? /* @__PURE__ */ jsx71("div", { className: "w-6 h-6 flex-none flex items-center justify-center", children: /* @__PURE__ */ jsx71(Loader11, { className: "w-4 h-4 animate-spin" }) }) : /* @__PURE__ */ jsx71(WalletIcon, { className: "w-6 h-6 flex-none" }),
17164
- /* @__PURE__ */ jsx71("span", { children: connector.name })
17165
- ]
17166
- },
17167
- connector.uid
17168
- );
17169
- }),
17170
- isConnectingExternalWallet && !!pendingConnectVariables?.connector && /* @__PURE__ */ jsx71(Highlight, {
17171
- type: "warning",
17172
- // @ts-expect-error i18n typing
17173
- children: t("passport:connectMenu.instructions.follow", {
17174
- wallet: pendingConnectVariables.connector.name,
17175
- steps: getInstructionSteps()
17176
- })
17177
- }),
17178
- visibleConnectors.length === 0 && /* @__PURE__ */ jsx71(Highlight, { type: "info", children: t("passport:connectMenu.noWallets") }),
17179
- error && /* @__PURE__ */ jsx71(Highlight, { type: "error", children: error.message })
17180
- ] })
17181
- }
17182
- );
17091
+ useLayoutStore.getState().setIsDialogForced(true);
17092
+ connect({ connector });
17093
+ },
17094
+ children: [
17095
+ isConnectingThis ? /* @__PURE__ */ jsx71("div", { className: "w-6 h-6 flex-none flex items-center justify-center", children: /* @__PURE__ */ jsx71(Loader11, { className: "w-4 h-4 animate-spin" }) }) : /* @__PURE__ */ jsx71(WalletIcon, { className: "w-6 h-6 flex-none" }),
17096
+ /* @__PURE__ */ jsx71("span", { children: connector.name })
17097
+ ]
17098
+ },
17099
+ connector.uid
17100
+ );
17101
+ }),
17102
+ isConnectingExternalWallet && !!pendingConnectVariables?.connector && /* @__PURE__ */ jsx71(Highlight, {
17103
+ type: "warning",
17104
+ // @ts-expect-error i18n typing
17105
+ children: t("passport:connectMenu.instructions.follow", {
17106
+ wallet: pendingConnectVariables.connector.name,
17107
+ steps: getInstructionSteps()
17108
+ })
17109
+ }),
17110
+ visibleConnectors.length === 0 && /* @__PURE__ */ jsx71(Highlight, { type: "info", children: t("passport:connectMenu.noWallets") }),
17111
+ error && /* @__PURE__ */ jsx71(Highlight, { type: "error", children: error.message })
17112
+ ] });
17183
17113
  }
17184
17114
  var init_ConnectExternalWalletMenu = __esm({
17185
17115
  "src/internal/components/ConnectExternalWalletMenu/ConnectExternalWalletMenu.tsx"() {
@@ -17335,8 +17265,8 @@ var init_devices = __esm({
17335
17265
  });
17336
17266
 
17337
17267
  // src/internal/components/DevicesMenu/DeviceLinkScreen.tsx
17338
- import { useState as useState14 } from "react";
17339
17268
  import { ArrowLeft as ArrowLeft8, Loader2 as Loader22 } from "lucide-react";
17269
+ import { useState as useState14 } from "react";
17340
17270
  import { jsx as jsx72, jsxs as jsxs64 } from "react/jsx-runtime";
17341
17271
  function getErrorMessage(err) {
17342
17272
  const code = err?.code;
@@ -17355,7 +17285,6 @@ function getErrorMessage(err) {
17355
17285
  }
17356
17286
  function DeviceLinkScreen() {
17357
17287
  const setPage = useLayoutDataStore((s) => s.setPage);
17358
- const maxScrollHeight = useLayoutStore((s) => s.maxScrollHeight);
17359
17288
  const { mutate: link, isPending } = useLinkDevice();
17360
17289
  const [code, setCode] = useState14("");
17361
17290
  const [error, setError] = useState14(null);
@@ -17377,54 +17306,36 @@ function DeviceLinkScreen() {
17377
17306
  }
17378
17307
  });
17379
17308
  }
17380
- return /* @__PURE__ */ jsx72(
17381
- "div",
17382
- {
17383
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
17384
- className: "list-scrollbar-y w-full",
17385
- children: /* @__PURE__ */ jsxs64(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
17386
- /* @__PURE__ */ jsxs64("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
17387
- /* @__PURE__ */ jsx72(Button, { variant: "ghost", size: "icon", onClick: () => setPage("devices" /* DEVICES */), children: /* @__PURE__ */ jsx72(ArrowLeft8, { className: "h-4 w-4 flex-none" }) }),
17388
- /* @__PURE__ */ jsx72("span", { className: "text-xl font-semibold", children: "Link Device" })
17389
- ] }),
17390
- /* @__PURE__ */ jsx72("p", { className: "text-sm text-[var(--ui-kit-fg-muted)]", children: "On your device: Long press to link smart wallet. Then enter the 6-character code shown on screen." }),
17391
- /* @__PURE__ */ jsx72(
17392
- "input",
17393
- {
17394
- type: "text",
17395
- value: code,
17396
- onChange: (e) => handleCodeChange(e.target.value),
17397
- onKeyDown: (e) => e.key === "Enter" && handleLink(),
17398
- placeholder: "XXXXXX",
17399
- autoFocus: true,
17400
- maxLength: 6,
17401
- className: "w-full text-center text-2xl tracking-[0.3em] font-mono px-4 py-3 rounded-lg\n bg-[var(--ui-kit-bg)] text-[var(--ui-kit-fg)]\n border border-[var(--ui-kit-bd)] focus:outline-none focus:border-[var(--ui-kit-primary)]\n uppercase"
17402
- }
17403
- ),
17404
- error && /* @__PURE__ */ jsx72("p", { className: "text-sm text-[var(--ui-kit-bg-error)]", children: error }),
17405
- /* @__PURE__ */ jsx72(
17406
- Button,
17407
- {
17408
- variant: "default",
17409
- size: "large",
17410
- className: "w-full",
17411
- disabled: !isValid || isPending,
17412
- onClick: handleLink,
17413
- children: isPending ? /* @__PURE__ */ jsx72(Loader22, { className: "w-4 h-4 animate-spin" }) : "Link"
17414
- }
17415
- )
17416
- ] })
17417
- }
17418
- );
17309
+ return /* @__PURE__ */ jsxs64(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
17310
+ /* @__PURE__ */ jsxs64("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
17311
+ /* @__PURE__ */ jsx72(Button, { variant: "ghost", size: "icon", onClick: () => setPage("devices" /* DEVICES */), children: /* @__PURE__ */ jsx72(ArrowLeft8, { className: "h-4 w-4 flex-none" }) }),
17312
+ /* @__PURE__ */ jsx72("span", { className: "text-xl font-semibold", children: "Link Device" })
17313
+ ] }),
17314
+ /* @__PURE__ */ jsx72("p", { className: "text-sm text-[var(--ui-kit-fg-muted)]", children: "On your device: Long press to link smart wallet. Then enter the 6-character code shown on screen." }),
17315
+ /* @__PURE__ */ jsx72(
17316
+ "input",
17317
+ {
17318
+ type: "text",
17319
+ value: code,
17320
+ onChange: (e) => handleCodeChange(e.target.value),
17321
+ onKeyDown: (e) => e.key === "Enter" && handleLink(),
17322
+ placeholder: "XXXXXX",
17323
+ autoFocus: true,
17324
+ maxLength: 6,
17325
+ className: "w-full text-center text-2xl tracking-[0.3em] font-mono px-4 py-3 rounded-lg\n bg-[var(--ui-kit-bg)] text-[var(--ui-kit-fg)]\n border border-[var(--ui-kit-bd)] focus:outline-none focus:border-[var(--ui-kit-primary)]\n uppercase"
17326
+ }
17327
+ ),
17328
+ error && /* @__PURE__ */ jsx72("p", { className: "text-sm text-[var(--ui-kit-bg-error)]", children: error }),
17329
+ /* @__PURE__ */ jsx72(Button, { variant: "default", size: "large", className: "w-full", disabled: !isValid || isPending, onClick: handleLink, children: isPending ? /* @__PURE__ */ jsx72(Loader22, { className: "w-4 h-4 animate-spin" }) : "Link" })
17330
+ ] });
17419
17331
  }
17420
17332
  var VALID_CHARS;
17421
17333
  var init_DeviceLinkScreen = __esm({
17422
17334
  "src/internal/components/DevicesMenu/DeviceLinkScreen.tsx"() {
17335
+ init_devices();
17336
+ init_useLayoutDataStore();
17423
17337
  init_Expandable2();
17424
17338
  init_button();
17425
- init_useLayoutDataStore();
17426
- init_useLayoutStore();
17427
- init_devices();
17428
17339
  VALID_CHARS = /^[A-HJ-NP-Z2-9]*$/;
17429
17340
  }
17430
17341
  });
@@ -17947,8 +17858,8 @@ var init_guardian_backup = __esm({
17947
17858
  });
17948
17859
 
17949
17860
  // src/internal/components/DevicesMenu/DeviceManageScreen.tsx
17950
- import { useCallback as useCallback19, useEffect as useEffect25, useRef as useRef14, useState as useState15 } from "react";
17951
17861
  import { ArrowLeft as ArrowLeft9, Cpu, Download, HardDrive, Loader2 as Loader23, Trash2, Upload } from "lucide-react";
17862
+ import { useCallback as useCallback19, useEffect as useEffect25, useRef as useRef14, useState as useState15 } from "react";
17952
17863
  import { Fragment as Fragment18, jsx as jsx73, jsxs as jsxs65 } from "react/jsx-runtime";
17953
17864
  function formatSize(bytes) {
17954
17865
  if (bytes < 1024) return `${bytes} B`;
@@ -17957,7 +17868,6 @@ function formatSize(bytes) {
17957
17868
  function DeviceManageScreen() {
17958
17869
  const setPage = useLayoutDataStore((s) => s.setPage);
17959
17870
  const pageParams = useLayoutDataStore((s) => s.pageParams);
17960
- const maxScrollHeight = useLayoutStore((s) => s.maxScrollHeight);
17961
17871
  const session = useSession((st) => st.session);
17962
17872
  const userId = session?.mpcUserId || "";
17963
17873
  const deviceId = pageParams?.deviceId;
@@ -18059,193 +17969,211 @@ function DeviceManageScreen() {
18059
17969
  setActionState(null);
18060
17970
  }
18061
17971
  }, [password, userId, refreshList]);
18062
- const handleDelete = useCallback19(async (keyshareId) => {
18063
- const guardian = guardianRef.current;
18064
- if (!guardian) return;
18065
- setActionState({ action: "delete", keyshareId, substep: "confirm-device" });
18066
- setErrorMessage(null);
18067
- setWaitingConfirm(true);
18068
- try {
18069
- await deleteFromGuardian(guardian, keyshareId);
18070
- setWaitingConfirm(false);
18071
- setStatusMessage("Keyshare deleted.");
18072
- setActionState(null);
18073
- await refreshList();
18074
- } catch (err) {
18075
- setWaitingConfirm(false);
18076
- setErrorMessage(err.message);
18077
- setActionState(null);
18078
- }
18079
- }, [refreshList]);
17972
+ const handleDelete = useCallback19(
17973
+ async (keyshareId) => {
17974
+ const guardian = guardianRef.current;
17975
+ if (!guardian) return;
17976
+ setActionState({ action: "delete", keyshareId, substep: "confirm-device" });
17977
+ setErrorMessage(null);
17978
+ setWaitingConfirm(true);
17979
+ try {
17980
+ await deleteFromGuardian(guardian, keyshareId);
17981
+ setWaitingConfirm(false);
17982
+ setStatusMessage("Keyshare deleted.");
17983
+ setActionState(null);
17984
+ await refreshList();
17985
+ } catch (err) {
17986
+ setWaitingConfirm(false);
17987
+ setErrorMessage(err.message);
17988
+ setActionState(null);
17989
+ }
17990
+ },
17991
+ [refreshList]
17992
+ );
18080
17993
  const isWorking = actionState?.substep === "working" || actionState?.substep === "confirm-device";
18081
- return /* @__PURE__ */ jsx73(
18082
- "div",
18083
- {
18084
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
18085
- className: "list-scrollbar-y w-full",
18086
- children: /* @__PURE__ */ jsxs65(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
18087
- /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
18088
- /* @__PURE__ */ jsx73(Button, { variant: "ghost", size: "icon", onClick: () => {
17994
+ return /* @__PURE__ */ jsxs65(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
17995
+ /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
17996
+ /* @__PURE__ */ jsx73(
17997
+ Button,
17998
+ {
17999
+ variant: "ghost",
18000
+ size: "icon",
18001
+ onClick: () => {
18089
18002
  guardianRef.current?.close();
18090
18003
  setPage("devices" /* DEVICES */);
18091
- }, children: /* @__PURE__ */ jsx73(ArrowLeft9, { className: "h-4 w-4 flex-none" }) }),
18092
- /* @__PURE__ */ jsx73(HardDrive, { className: "h-5 w-5 flex-none" }),
18093
- /* @__PURE__ */ jsx73("span", { className: "text-xl font-semibold", children: deviceName || "Guardian" }),
18094
- screen.step === "connected" && /* @__PURE__ */ jsxs65("span", { className: "text-xs text-[var(--ui-kit-fg-muted)] ml-auto", children: [
18095
- "v",
18096
- screen.info.fwVer
18097
- ] })
18098
- ] }),
18099
- waitingConfirm && /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-2 p-3 rounded-lg bg-[var(--ui-kit-bg)] text-sm animate-pulse", children: [
18100
- /* @__PURE__ */ jsx73(Loader23, { className: "w-4 h-4 animate-spin" }),
18101
- /* @__PURE__ */ jsx73("span", { children: "Confirm on your device..." })
18004
+ },
18005
+ children: /* @__PURE__ */ jsx73(ArrowLeft9, { className: "h-4 w-4 flex-none" })
18006
+ }
18007
+ ),
18008
+ /* @__PURE__ */ jsx73(HardDrive, { className: "h-5 w-5 flex-none" }),
18009
+ /* @__PURE__ */ jsx73("span", { className: "text-xl font-semibold", children: deviceName || "Guardian" }),
18010
+ screen.step === "connected" && /* @__PURE__ */ jsxs65("span", { className: "text-xs text-[var(--ui-kit-fg-muted)] ml-auto", children: [
18011
+ "v",
18012
+ screen.info.fwVer
18013
+ ] })
18014
+ ] }),
18015
+ waitingConfirm && /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-2 p-3 rounded-lg bg-[var(--ui-kit-bg)] text-sm animate-pulse", children: [
18016
+ /* @__PURE__ */ jsx73(Loader23, { className: "w-4 h-4 animate-spin" }),
18017
+ /* @__PURE__ */ jsx73("span", { children: "Confirm on your device..." })
18018
+ ] }),
18019
+ statusMessage && /* @__PURE__ */ jsx73("div", { className: "text-sm text-green-500 p-2", children: statusMessage }),
18020
+ errorMessage && /* @__PURE__ */ jsx73("div", { className: "text-sm text-[var(--ui-kit-bg-error)] p-2", children: errorMessage }),
18021
+ screen.step === "connecting" && /* @__PURE__ */ jsx73("div", { className: "flex justify-center py-8", children: /* @__PURE__ */ jsx73(Loader23, { className: "w-6 h-6 animate-spin text-[var(--ui-kit-fg-muted)]" }) }),
18022
+ screen.step === "error" && /* @__PURE__ */ jsx73("div", { className: "text-sm text-[var(--ui-kit-bg-error)] text-center py-8", children: screen.message }),
18023
+ screen.step === "new-device" && /* @__PURE__ */ jsxs65("div", { className: "flex flex-col items-center gap-4 py-8", children: [
18024
+ /* @__PURE__ */ jsx73(Cpu, { className: "w-10 h-10 text-[var(--ui-kit-fg-muted)]" }),
18025
+ /* @__PURE__ */ jsxs65("div", { className: "text-center", children: [
18026
+ /* @__PURE__ */ jsx73("p", { className: "text-sm font-semibold", children: "New device detected" }),
18027
+ /* @__PURE__ */ jsxs65("p", { className: "text-xs text-[var(--ui-kit-fg-muted)] mt-1", children: [
18028
+ screen.info.deviceId,
18029
+ " \xB7 v",
18030
+ screen.info.fwVer
18031
+ ] })
18032
+ ] }),
18033
+ /* @__PURE__ */ jsx73(
18034
+ Button,
18035
+ {
18036
+ variant: "default",
18037
+ size: "large",
18038
+ className: "w-full",
18039
+ onClick: () => {
18040
+ setPage("device-link" /* DEVICE_LINK */);
18041
+ },
18042
+ children: "Link Device"
18043
+ }
18044
+ )
18045
+ ] }),
18046
+ screen.step === "connected" && /* @__PURE__ */ jsxs65(Fragment18, { children: [
18047
+ screen.keyshares.length === 0 && /* @__PURE__ */ jsx73("div", { className: "text-sm text-[var(--ui-kit-fg-muted)] text-center py-4", children: "No keyshares stored on this device" }),
18048
+ screen.keyshares.length > 0 && /* @__PURE__ */ jsxs65("div", { className: "text-xs text-[var(--ui-kit-fg-muted)] text-right", children: [
18049
+ screen.keyshares.length,
18050
+ " keyshare",
18051
+ screen.keyshares.length > 1 ? "s" : "",
18052
+ " \xB7",
18053
+ " ",
18054
+ formatSize(screen.keyshares.reduce((s, e) => s + e.size, 0))
18055
+ ] }),
18056
+ screen.keyshares.map(({ id, size }) => /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-3 p-3 rounded-lg bg-[var(--ui-kit-bg)]", children: [
18057
+ /* @__PURE__ */ jsx73(Cpu, { className: "w-5 h-5 text-[var(--ui-kit-fg-muted)] shrink-0" }),
18058
+ /* @__PURE__ */ jsxs65("div", { className: "flex-1 min-w-0", children: [
18059
+ /* @__PURE__ */ jsx73("span", { className: "text-sm font-mono truncate block text-[var(--ui-kit-fg)]", children: id }),
18060
+ /* @__PURE__ */ jsx73("span", { className: "text-xs text-[var(--ui-kit-fg-muted)]", children: formatSize(size) })
18102
18061
  ] }),
18103
- statusMessage && /* @__PURE__ */ jsx73("div", { className: "text-sm text-green-500 p-2", children: statusMessage }),
18104
- errorMessage && /* @__PURE__ */ jsx73("div", { className: "text-sm text-[var(--ui-kit-bg-error)] p-2", children: errorMessage }),
18105
- screen.step === "connecting" && /* @__PURE__ */ jsx73("div", { className: "flex justify-center py-8", children: /* @__PURE__ */ jsx73(Loader23, { className: "w-6 h-6 animate-spin text-[var(--ui-kit-fg-muted)]" }) }),
18106
- screen.step === "error" && /* @__PURE__ */ jsx73("div", { className: "text-sm text-[var(--ui-kit-bg-error)] text-center py-8", children: screen.message }),
18107
- screen.step === "new-device" && /* @__PURE__ */ jsxs65("div", { className: "flex flex-col items-center gap-4 py-8", children: [
18108
- /* @__PURE__ */ jsx73(Cpu, { className: "w-10 h-10 text-[var(--ui-kit-fg-muted)]" }),
18109
- /* @__PURE__ */ jsxs65("div", { className: "text-center", children: [
18110
- /* @__PURE__ */ jsx73("p", { className: "text-sm font-semibold", children: "New device detected" }),
18111
- /* @__PURE__ */ jsxs65("p", { className: "text-xs text-[var(--ui-kit-fg-muted)] mt-1", children: [
18112
- screen.info.deviceId,
18113
- " \xB7 v",
18114
- screen.info.fwVer
18115
- ] })
18116
- ] }),
18062
+ /* @__PURE__ */ jsx73(
18063
+ Button,
18064
+ {
18065
+ variant: "ghost",
18066
+ size: "icon",
18067
+ disabled: isWorking,
18068
+ onClick: () => {
18069
+ guardianRef.current?.close();
18070
+ const store = useLayoutDataStore.getState();
18071
+ store.setPageParams({ key: "device-restore" /* DEVICE_RESTORE */, keyshareId: id, deviceId, deviceName });
18072
+ store.setPage("device-restore" /* DEVICE_RESTORE */);
18073
+ },
18074
+ title: "Restore",
18075
+ children: /* @__PURE__ */ jsx73(Download, { className: "w-4 h-4" })
18076
+ }
18077
+ ),
18078
+ /* @__PURE__ */ jsx73(
18079
+ Button,
18080
+ {
18081
+ variant: "ghost",
18082
+ size: "icon",
18083
+ disabled: isWorking,
18084
+ onClick: () => handleDelete(id),
18085
+ title: "Delete",
18086
+ className: "text-[var(--ui-kit-bg-error)]",
18087
+ children: /* @__PURE__ */ jsx73(Trash2, { className: "w-4 h-4" })
18088
+ }
18089
+ )
18090
+ ] }, id)),
18091
+ actionState?.action === "overwrite" && actionState.substep === "confirm" && /* @__PURE__ */ jsxs65("div", { className: "flex items-center justify-between gap-2 p-3 rounded-lg bg-[var(--ui-kit-bg)]", children: [
18092
+ /* @__PURE__ */ jsx73("span", { className: "text-sm", children: "Keyshare exists. Overwrite? (requires button press on device)" }),
18093
+ /* @__PURE__ */ jsxs65("div", { className: "flex gap-2", children: [
18117
18094
  /* @__PURE__ */ jsx73(
18118
18095
  Button,
18119
18096
  {
18120
- variant: "default",
18121
- size: "large",
18122
- className: "w-full",
18097
+ variant: "ghost",
18098
+ size: "small",
18123
18099
  onClick: () => {
18124
- setPage("device-link" /* DEVICE_LINK */);
18125
- },
18126
- children: "Link Device"
18127
- }
18128
- )
18129
- ] }),
18130
- screen.step === "connected" && /* @__PURE__ */ jsxs65(Fragment18, { children: [
18131
- screen.keyshares.length === 0 && /* @__PURE__ */ jsx73("div", { className: "text-sm text-[var(--ui-kit-fg-muted)] text-center py-4", children: "No keyshares stored on this device" }),
18132
- screen.keyshares.length > 0 && /* @__PURE__ */ jsxs65("div", { className: "text-xs text-[var(--ui-kit-fg-muted)] text-right", children: [
18133
- screen.keyshares.length,
18134
- " keyshare",
18135
- screen.keyshares.length > 1 ? "s" : "",
18136
- " \xB7 ",
18137
- formatSize(screen.keyshares.reduce((s, e) => s + e.size, 0))
18138
- ] }),
18139
- screen.keyshares.map(({ id, size }) => /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-3 p-3 rounded-lg bg-[var(--ui-kit-bg)]", children: [
18140
- /* @__PURE__ */ jsx73(Cpu, { className: "w-5 h-5 text-[var(--ui-kit-fg-muted)] shrink-0" }),
18141
- /* @__PURE__ */ jsxs65("div", { className: "flex-1 min-w-0", children: [
18142
- /* @__PURE__ */ jsx73("span", { className: "text-sm font-mono truncate block text-[var(--ui-kit-fg)]", children: id }),
18143
- /* @__PURE__ */ jsx73("span", { className: "text-xs text-[var(--ui-kit-fg-muted)]", children: formatSize(size) })
18144
- ] }),
18145
- /* @__PURE__ */ jsx73(
18146
- Button,
18147
- {
18148
- variant: "ghost",
18149
- size: "icon",
18150
- disabled: isWorking,
18151
- onClick: () => {
18152
- guardianRef.current?.close();
18153
- const store = useLayoutDataStore.getState();
18154
- store.setPageParams({ key: "device-restore" /* DEVICE_RESTORE */, keyshareId: id, deviceId, deviceName });
18155
- store.setPage("device-restore" /* DEVICE_RESTORE */);
18156
- },
18157
- title: "Restore",
18158
- children: /* @__PURE__ */ jsx73(Download, { className: "w-4 h-4" })
18159
- }
18160
- ),
18161
- /* @__PURE__ */ jsx73(
18162
- Button,
18163
- {
18164
- variant: "ghost",
18165
- size: "icon",
18166
- disabled: isWorking,
18167
- onClick: () => handleDelete(id),
18168
- title: "Delete",
18169
- className: "text-[var(--ui-kit-bg-error)]",
18170
- children: /* @__PURE__ */ jsx73(Trash2, { className: "w-4 h-4" })
18171
- }
18172
- )
18173
- ] }, id)),
18174
- actionState?.action === "overwrite" && actionState.substep === "confirm" && /* @__PURE__ */ jsxs65("div", { className: "flex items-center justify-between gap-2 p-3 rounded-lg bg-[var(--ui-kit-bg)]", children: [
18175
- /* @__PURE__ */ jsx73("span", { className: "text-sm", children: "Keyshare exists. Overwrite? (requires button press on device)" }),
18176
- /* @__PURE__ */ jsxs65("div", { className: "flex gap-2", children: [
18177
- /* @__PURE__ */ jsx73(Button, { variant: "ghost", size: "small", onClick: () => {
18178
18100
  setActionState(null);
18179
18101
  setPassword("");
18180
- }, children: "Cancel" }),
18181
- /* @__PURE__ */ jsx73(Button, { variant: "outline", size: "small", onClick: handleOverwrite, children: "Overwrite" })
18182
- ] })
18183
- ] }),
18184
- actionState?.action === "backup" && actionState.substep === "password" ? /* @__PURE__ */ jsxs65("div", { className: "flex gap-2", children: [
18185
- /* @__PURE__ */ jsx73(
18186
- "input",
18187
- {
18188
- type: "password",
18189
- autoComplete: "one-time-code",
18190
- "data-1p-ignore": true,
18191
- "data-lpignore": "true",
18192
- value: password,
18193
- onChange: (e) => setPassword(e.target.value),
18194
- onKeyDown: (e) => e.key === "Enter" && password && handleBackup(),
18195
- placeholder: "Encryption password",
18196
- className: "flex-1 text-sm px-3 py-2 rounded-lg bg-[var(--ui-kit-bg)] border border-[var(--ui-kit-bd)] text-[var(--ui-kit-fg)] focus:outline-none focus:border-[var(--ui-kit-primary)]",
18197
- autoFocus: true
18198
- }
18199
- ),
18200
- /* @__PURE__ */ jsx73(Button, { variant: "default", disabled: !password, onClick: handleBackup, children: "Backup" }),
18201
- /* @__PURE__ */ jsx73(Button, { variant: "ghost", onClick: () => {
18202
- setActionState(null);
18203
- setPassword("");
18204
- }, children: "Cancel" })
18205
- ] }) : /* @__PURE__ */ jsxs65(
18206
- Button,
18207
- {
18208
- variant: "default",
18209
- size: "large",
18210
- className: "w-full",
18211
- disabled: isWorking,
18212
- onClick: () => {
18213
- setStatusMessage(null);
18214
- setErrorMessage(null);
18215
- setActionState({ action: "backup", substep: "password" });
18216
18102
  },
18217
- children: [
18218
- /* @__PURE__ */ jsx73(Upload, { className: "w-4 h-4" }),
18219
- /* @__PURE__ */ jsx73("span", { children: "Backup Current Keyshare" })
18220
- ]
18103
+ children: "Cancel"
18221
18104
  }
18222
18105
  ),
18223
- actionState?.substep === "working" && /* @__PURE__ */ jsx73("div", { className: "flex justify-center py-2", children: /* @__PURE__ */ jsx73(Loader23, { className: "w-5 h-5 animate-spin" }) })
18106
+ /* @__PURE__ */ jsx73(Button, { variant: "outline", size: "small", onClick: handleOverwrite, children: "Overwrite" })
18224
18107
  ] })
18225
- ] })
18226
- }
18227
- );
18108
+ ] }),
18109
+ actionState?.action === "backup" && actionState.substep === "password" ? /* @__PURE__ */ jsxs65("div", { className: "flex gap-2", children: [
18110
+ /* @__PURE__ */ jsx73(
18111
+ "input",
18112
+ {
18113
+ type: "password",
18114
+ autoComplete: "one-time-code",
18115
+ "data-1p-ignore": true,
18116
+ "data-lpignore": "true",
18117
+ value: password,
18118
+ onChange: (e) => setPassword(e.target.value),
18119
+ onKeyDown: (e) => e.key === "Enter" && password && handleBackup(),
18120
+ placeholder: "Encryption password",
18121
+ className: "flex-1 text-sm px-3 py-2 rounded-lg bg-[var(--ui-kit-bg)] border border-[var(--ui-kit-bd)] text-[var(--ui-kit-fg)] focus:outline-none focus:border-[var(--ui-kit-primary)]",
18122
+ autoFocus: true
18123
+ }
18124
+ ),
18125
+ /* @__PURE__ */ jsx73(Button, { variant: "default", disabled: !password, onClick: handleBackup, children: "Backup" }),
18126
+ /* @__PURE__ */ jsx73(
18127
+ Button,
18128
+ {
18129
+ variant: "ghost",
18130
+ onClick: () => {
18131
+ setActionState(null);
18132
+ setPassword("");
18133
+ },
18134
+ children: "Cancel"
18135
+ }
18136
+ )
18137
+ ] }) : /* @__PURE__ */ jsxs65(
18138
+ Button,
18139
+ {
18140
+ variant: "default",
18141
+ size: "large",
18142
+ className: "w-full",
18143
+ disabled: isWorking,
18144
+ onClick: () => {
18145
+ setStatusMessage(null);
18146
+ setErrorMessage(null);
18147
+ setActionState({ action: "backup", substep: "password" });
18148
+ },
18149
+ children: [
18150
+ /* @__PURE__ */ jsx73(Upload, { className: "w-4 h-4" }),
18151
+ /* @__PURE__ */ jsx73("span", { children: "Backup Current Keyshare" })
18152
+ ]
18153
+ }
18154
+ ),
18155
+ actionState?.substep === "working" && /* @__PURE__ */ jsx73("div", { className: "flex justify-center py-2", children: /* @__PURE__ */ jsx73(Loader23, { className: "w-5 h-5 animate-spin" }) })
18156
+ ] })
18157
+ ] });
18228
18158
  }
18229
18159
  var init_DeviceManageScreen = __esm({
18230
18160
  "src/internal/components/DevicesMenu/DeviceManageScreen.tsx"() {
18231
- init_Expandable2();
18232
- init_button();
18233
- init_useLayoutDataStore();
18234
- init_useLayoutStore();
18235
18161
  init_SessionContext();
18236
- init_iframe_manager();
18237
18162
  init_guardian_backup();
18163
+ init_useLayoutDataStore();
18164
+ init_iframe_manager();
18165
+ init_Expandable2();
18166
+ init_button();
18238
18167
  }
18239
18168
  });
18240
18169
 
18241
18170
  // src/internal/components/DevicesMenu/DeviceRestoreScreen.tsx
18242
- import { useCallback as useCallback20, useState as useState16 } from "react";
18243
18171
  import { AlertTriangle as AlertTriangle2, ArrowLeft as ArrowLeft10, Download as Download2, Loader2 as Loader24 } from "lucide-react";
18172
+ import { useCallback as useCallback20, useState as useState16 } from "react";
18244
18173
  import { Fragment as Fragment19, jsx as jsx74, jsxs as jsxs66 } from "react/jsx-runtime";
18245
18174
  function DeviceRestoreScreen() {
18246
18175
  const setPage = useLayoutDataStore((s) => s.setPage);
18247
18176
  const pageParams = useLayoutDataStore((s) => s.pageParams);
18248
- const maxScrollHeight = useLayoutStore((s) => s.maxScrollHeight);
18249
18177
  const session = useSession((st) => st.session);
18250
18178
  const userId = session?.mpcUserId || "";
18251
18179
  const keyshareId = pageParams?.keyshareId;
@@ -18281,82 +18209,74 @@ function DeviceRestoreScreen() {
18281
18209
  setIsWorking(false);
18282
18210
  }
18283
18211
  }, [password, keyshareId, userId, deviceId]);
18284
- return /* @__PURE__ */ jsx74(
18285
- "div",
18286
- {
18287
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
18288
- className: "list-scrollbar-y w-full",
18289
- children: /* @__PURE__ */ jsxs66(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
18290
- /* @__PURE__ */ jsxs66("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
18291
- /* @__PURE__ */ jsx74(Button, { variant: "ghost", size: "icon", onClick: () => setPage("device-manage" /* DEVICE_MANAGE */), children: /* @__PURE__ */ jsx74(ArrowLeft10, { className: "h-4 w-4 flex-none" }) }),
18292
- /* @__PURE__ */ jsx74("span", { className: "text-xl font-semibold", children: "Restore Keyshare" })
18293
- ] }),
18294
- /* @__PURE__ */ jsxs66("div", { className: "flex gap-3 p-3 rounded-lg bg-[var(--ui-kit-bg)] border border-[var(--ui-kit-bg-error)]", children: [
18295
- /* @__PURE__ */ jsx74(AlertTriangle2, { className: "w-5 h-5 text-[var(--ui-kit-bg-error)] shrink-0 mt-0.5" }),
18296
- /* @__PURE__ */ jsxs66("div", { className: "text-sm", children: [
18297
- /* @__PURE__ */ jsx74("p", { className: "font-semibold text-[var(--ui-kit-bg-error)]", children: "This will replace your current keyshare" }),
18298
- /* @__PURE__ */ jsxs66("p", { className: "text-[var(--ui-kit-fg-muted)] mt-1", children: [
18299
- "Your existing keyshare will be overwritten with the backup from ",
18300
- deviceName || "Guardian",
18301
- " device. Make sure you have a backup of your current keyshare before proceeding."
18302
- ] })
18303
- ] })
18304
- ] }),
18305
- /* @__PURE__ */ jsx74("div", { className: "text-xs text-[var(--ui-kit-fg-muted)] font-mono truncate px-1", children: keyshareId }),
18306
- /* @__PURE__ */ jsx74(
18307
- "input",
18308
- {
18309
- type: "password",
18310
- autoComplete: "one-time-code",
18311
- "data-1p-ignore": true,
18312
- "data-lpignore": "true",
18313
- value: password,
18314
- onChange: (e) => setPassword(e.target.value),
18315
- onKeyDown: (e) => e.key === "Enter" && password && !isWorking && handleRestore(),
18316
- placeholder: "Encryption password",
18317
- className: "w-full text-sm px-3 py-2 rounded-lg bg-[var(--ui-kit-bg)] border border-[var(--ui-kit-bd)] text-[var(--ui-kit-fg)] focus:outline-none focus:border-[var(--ui-kit-primary)]",
18318
- autoFocus: true,
18319
- disabled: isWorking
18320
- }
18321
- ),
18322
- /* @__PURE__ */ jsx74(
18323
- Button,
18324
- {
18325
- variant: "default",
18326
- size: "large",
18327
- className: "w-full",
18328
- disabled: !password || isWorking,
18329
- onClick: handleRestore,
18330
- children: isWorking ? /* @__PURE__ */ jsxs66(Fragment19, { children: [
18331
- /* @__PURE__ */ jsx74(Loader24, { className: "w-4 h-4 animate-spin" }),
18332
- /* @__PURE__ */ jsx74("span", { children: "Restoring \u2014 confirm on your device..." })
18333
- ] }) : /* @__PURE__ */ jsxs66(Fragment19, { children: [
18334
- /* @__PURE__ */ jsx74(Download2, { className: "w-4 h-4" }),
18335
- /* @__PURE__ */ jsx74("span", { children: "Restore from Guardian" })
18336
- ] })
18337
- }
18338
- ),
18339
- statusMessage && /* @__PURE__ */ jsx74("div", { className: "text-sm text-green-500 p-2 text-center", children: statusMessage }),
18340
- errorMessage && /* @__PURE__ */ jsx74("div", { className: "text-sm text-[var(--ui-kit-bg-error)] p-2 text-center", children: errorMessage })
18212
+ return /* @__PURE__ */ jsxs66(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
18213
+ /* @__PURE__ */ jsxs66("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
18214
+ /* @__PURE__ */ jsx74(Button, { variant: "ghost", size: "icon", onClick: () => setPage("device-manage" /* DEVICE_MANAGE */), children: /* @__PURE__ */ jsx74(ArrowLeft10, { className: "h-4 w-4 flex-none" }) }),
18215
+ /* @__PURE__ */ jsx74("span", { className: "text-xl font-semibold", children: "Restore Keyshare" })
18216
+ ] }),
18217
+ /* @__PURE__ */ jsxs66("div", { className: "flex gap-3 p-3 rounded-lg bg-[var(--ui-kit-bg)] border border-[var(--ui-kit-bg-error)]", children: [
18218
+ /* @__PURE__ */ jsx74(AlertTriangle2, { className: "w-5 h-5 text-[var(--ui-kit-bg-error)] shrink-0 mt-0.5" }),
18219
+ /* @__PURE__ */ jsxs66("div", { className: "text-sm", children: [
18220
+ /* @__PURE__ */ jsx74("p", { className: "font-semibold text-[var(--ui-kit-bg-error)]", children: "This will replace your current keyshare" }),
18221
+ /* @__PURE__ */ jsxs66("p", { className: "text-[var(--ui-kit-fg-muted)] mt-1", children: [
18222
+ "Your existing keyshare will be overwritten with the backup from ",
18223
+ deviceName || "Guardian",
18224
+ " device. Make sure you have a backup of your current keyshare before proceeding."
18225
+ ] })
18341
18226
  ] })
18342
- }
18343
- );
18227
+ ] }),
18228
+ /* @__PURE__ */ jsx74("div", { className: "text-xs text-[var(--ui-kit-fg-muted)] font-mono truncate px-1", children: keyshareId }),
18229
+ /* @__PURE__ */ jsx74(
18230
+ "input",
18231
+ {
18232
+ type: "password",
18233
+ autoComplete: "one-time-code",
18234
+ "data-1p-ignore": true,
18235
+ "data-lpignore": "true",
18236
+ value: password,
18237
+ onChange: (e) => setPassword(e.target.value),
18238
+ onKeyDown: (e) => e.key === "Enter" && password && !isWorking && handleRestore(),
18239
+ placeholder: "Encryption password",
18240
+ className: "w-full text-sm px-3 py-2 rounded-lg bg-[var(--ui-kit-bg)] border border-[var(--ui-kit-bd)] text-[var(--ui-kit-fg)] focus:outline-none focus:border-[var(--ui-kit-primary)]",
18241
+ autoFocus: true,
18242
+ disabled: isWorking
18243
+ }
18244
+ ),
18245
+ /* @__PURE__ */ jsx74(
18246
+ Button,
18247
+ {
18248
+ variant: "default",
18249
+ size: "large",
18250
+ className: "w-full",
18251
+ disabled: !password || isWorking,
18252
+ onClick: handleRestore,
18253
+ children: isWorking ? /* @__PURE__ */ jsxs66(Fragment19, { children: [
18254
+ /* @__PURE__ */ jsx74(Loader24, { className: "w-4 h-4 animate-spin" }),
18255
+ /* @__PURE__ */ jsx74("span", { children: "Restoring \u2014 confirm on your device..." })
18256
+ ] }) : /* @__PURE__ */ jsxs66(Fragment19, { children: [
18257
+ /* @__PURE__ */ jsx74(Download2, { className: "w-4 h-4" }),
18258
+ /* @__PURE__ */ jsx74("span", { children: "Restore from Guardian" })
18259
+ ] })
18260
+ }
18261
+ ),
18262
+ statusMessage && /* @__PURE__ */ jsx74("div", { className: "text-sm text-green-500 p-2 text-center", children: statusMessage }),
18263
+ errorMessage && /* @__PURE__ */ jsx74("div", { className: "text-sm text-[var(--ui-kit-bg-error)] p-2 text-center", children: errorMessage })
18264
+ ] });
18344
18265
  }
18345
18266
  var init_DeviceRestoreScreen = __esm({
18346
18267
  "src/internal/components/DevicesMenu/DeviceRestoreScreen.tsx"() {
18347
- init_Expandable2();
18348
- init_button();
18349
- init_useLayoutDataStore();
18350
- init_useLayoutStore();
18351
18268
  init_SessionContext();
18352
- init_iframe_manager();
18353
18269
  init_guardian_backup();
18270
+ init_useLayoutDataStore();
18271
+ init_iframe_manager();
18272
+ init_Expandable2();
18273
+ init_button();
18354
18274
  }
18355
18275
  });
18356
18276
 
18357
18277
  // src/internal/components/DevicesMenu/DevicesMenu.tsx
18278
+ import { ArrowLeft as ArrowLeft11, CheckCircle, Cpu as Cpu2, HardDrive as HardDrive2, Loader2 as Loader25, Monitor, RefreshCw, Trash2 as Trash22 } from "lucide-react";
18358
18279
  import { useState as useState17 } from "react";
18359
- import { ArrowLeft as ArrowLeft11, Cpu as Cpu2, Monitor, CheckCircle, Trash2 as Trash22, Loader2 as Loader25, RefreshCw, HardDrive as HardDrive2 } from "lucide-react";
18360
18280
  import { jsx as jsx75, jsxs as jsxs67 } from "react/jsx-runtime";
18361
18281
  function DeviceIcon({ deviceType }) {
18362
18282
  const Icon2 = deviceType === "iot" ? Cpu2 : Monitor;
@@ -18426,7 +18346,11 @@ function DeviceRow({ device }) {
18426
18346
  {
18427
18347
  onClick: () => {
18428
18348
  const store = useLayoutDataStore.getState();
18429
- store.setPageParams({ key: "device-manage" /* DEVICE_MANAGE */, deviceId: device.deviceId, deviceName: device.deviceName });
18349
+ store.setPageParams({
18350
+ key: "device-manage" /* DEVICE_MANAGE */,
18351
+ deviceId: device.deviceId,
18352
+ deviceName: device.deviceName
18353
+ });
18430
18354
  store.setPage("device-manage" /* DEVICE_MANAGE */);
18431
18355
  },
18432
18356
  className: "text-[var(--ui-kit-fg-muted)] hover:text-[var(--ui-kit-fg)] transition-colors shrink-0",
@@ -18446,50 +18370,32 @@ function DeviceRow({ device }) {
18446
18370
  }
18447
18371
  function DevicesMenu() {
18448
18372
  const setPage = useLayoutDataStore((s) => s.setPage);
18449
- const maxScrollHeight = useLayoutStore((s) => s.maxScrollHeight);
18450
18373
  const { data, isLoading, error, refetch, isFetching } = useDevices();
18451
18374
  const devices = data?.devices ?? [];
18452
- return /* @__PURE__ */ jsx75(
18453
- "div",
18454
- {
18455
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
18456
- className: "list-scrollbar-y w-full",
18457
- children: /* @__PURE__ */ jsxs67(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
18458
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
18459
- /* @__PURE__ */ jsx75(Button, { variant: "ghost", size: "icon", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ jsx75(ArrowLeft11, { className: "h-4 w-4 flex-none" }) }),
18460
- /* @__PURE__ */ jsx75("span", { className: "text-xl font-semibold", children: "Devices" }),
18461
- isLoading && /* @__PURE__ */ jsx75(Loader25, { className: "w-4 h-4 animate-spin" }),
18462
- /* @__PURE__ */ jsx75("div", { className: "flex-1" }),
18463
- /* @__PURE__ */ jsx75(Button, { variant: "ghost", size: "icon", onClick: () => refetch(), disabled: isFetching, children: /* @__PURE__ */ jsx75(RefreshCw, { className: `h-4 w-4 flex-none ${isFetching ? "animate-spin" : ""}` }) })
18464
- ] }),
18465
- error && /* @__PURE__ */ jsx75("div", { className: "text-sm text-[var(--ui-kit-bg-error)] text-center py-4", children: "Failed to load devices" }),
18466
- !isLoading && !error && devices.length === 0 && /* @__PURE__ */ jsx75("div", { className: "text-sm text-[var(--ui-kit-fg-muted)] text-center py-8", children: "No linked devices" }),
18467
- devices.map((device) => /* @__PURE__ */ jsx75(DeviceRow, { device }, device.deviceId)),
18468
- /* @__PURE__ */ jsxs67(
18469
- Button,
18470
- {
18471
- variant: "default",
18472
- size: "large",
18473
- className: "w-full",
18474
- onClick: () => setPage("device-link" /* DEVICE_LINK */),
18475
- children: [
18476
- /* @__PURE__ */ jsx75(Cpu2, { className: "w-4 h-4" }),
18477
- /* @__PURE__ */ jsx75("span", { children: "Add Device" })
18478
- ]
18479
- }
18480
- )
18481
- ] })
18482
- }
18483
- );
18375
+ return /* @__PURE__ */ jsxs67(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
18376
+ /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
18377
+ /* @__PURE__ */ jsx75(Button, { variant: "ghost", size: "icon", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ jsx75(ArrowLeft11, { className: "h-4 w-4 flex-none" }) }),
18378
+ /* @__PURE__ */ jsx75("span", { className: "text-xl font-semibold", children: "Devices" }),
18379
+ isLoading && /* @__PURE__ */ jsx75(Loader25, { className: "w-4 h-4 animate-spin" }),
18380
+ /* @__PURE__ */ jsx75("div", { className: "flex-1" }),
18381
+ /* @__PURE__ */ jsx75(Button, { variant: "ghost", size: "icon", onClick: () => refetch(), disabled: isFetching, children: /* @__PURE__ */ jsx75(RefreshCw, { className: `h-4 w-4 flex-none ${isFetching ? "animate-spin" : ""}` }) })
18382
+ ] }),
18383
+ error && /* @__PURE__ */ jsx75("div", { className: "text-sm text-[var(--ui-kit-bg-error)] text-center py-4", children: "Failed to load devices" }),
18384
+ !isLoading && !error && devices.length === 0 && /* @__PURE__ */ jsx75("div", { className: "text-sm text-[var(--ui-kit-fg-muted)] text-center py-8", children: "No linked devices" }),
18385
+ devices.map((device) => /* @__PURE__ */ jsx75(DeviceRow, { device }, device.deviceId)),
18386
+ /* @__PURE__ */ jsxs67(Button, { variant: "default", size: "large", className: "w-full", onClick: () => setPage("device-link" /* DEVICE_LINK */), children: [
18387
+ /* @__PURE__ */ jsx75(Cpu2, { className: "w-4 h-4" }),
18388
+ /* @__PURE__ */ jsx75("span", { children: "Add Device" })
18389
+ ] })
18390
+ ] });
18484
18391
  }
18485
18392
  var init_DevicesMenu = __esm({
18486
18393
  "src/internal/components/DevicesMenu/DevicesMenu.tsx"() {
18487
- init_Expandable2();
18488
- init_button();
18489
- init_useLayoutDataStore();
18490
- init_useLayoutStore();
18491
18394
  init_devices();
18492
18395
  init_guardian_backup();
18396
+ init_useLayoutDataStore();
18397
+ init_Expandable2();
18398
+ init_button();
18493
18399
  }
18494
18400
  });
18495
18401
 
@@ -19367,10 +19273,11 @@ var init_MethodSelector = __esm({
19367
19273
  var KEYSHARE_BACKUP_MENU_TOUR, KEYSHARE_BACKUP_MENU_TOUR_NO_PASSKEY;
19368
19274
  var init_onboarding_setup4 = __esm({
19369
19275
  "src/internal/components/KeyshareRestoreMenu/onboarding.setup.ts"() {
19276
+ init_constants();
19370
19277
  init_hooks();
19371
19278
  KEYSHARE_BACKUP_MENU_TOUR = [
19372
19279
  {
19373
- elId: "embarkai-keyshare-backup-menu-onboarding" /* backupMenu */,
19280
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"keysare-backup" /* KEYSARE_BACKUP */}`,
19374
19281
  title: "passport:backupMenu.onboarding.backupMenu.title",
19375
19282
  description: "passport:backupMenu.onboarding.backupMenu.description",
19376
19283
  onNext: () => {
@@ -19395,7 +19302,7 @@ var init_onboarding_setup4 = __esm({
19395
19302
  }
19396
19303
  },
19397
19304
  {
19398
- elId: "embarkai-keyshare-backup-menu-onboarding" /* backupMenu */,
19305
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"keysare-backup" /* KEYSARE_BACKUP */}`,
19399
19306
  title: "passport:backupMenu.onboarding.backupEncryptionPassword.title",
19400
19307
  description: "passport:backupMenu.onboarding.backupEncryptionPassword.description",
19401
19308
  onNext: () => {
@@ -19406,7 +19313,7 @@ var init_onboarding_setup4 = __esm({
19406
19313
  }
19407
19314
  },
19408
19315
  {
19409
- elId: "embarkai-keyshare-backup-menu-onboarding" /* backupMenu */,
19316
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"keysare-backup" /* KEYSARE_BACKUP */}`,
19410
19317
  title: "passport:backupMenu.onboarding.backupEncryptionPasskey.title",
19411
19318
  description: "passport:backupMenu.onboarding.backupEncryptionPasskey.description",
19412
19319
  onNext: () => {
@@ -19426,7 +19333,7 @@ var init_onboarding_setup4 = __esm({
19426
19333
  ];
19427
19334
  KEYSHARE_BACKUP_MENU_TOUR_NO_PASSKEY = [
19428
19335
  {
19429
- elId: "embarkai-keyshare-backup-menu-onboarding" /* backupMenu */,
19336
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"keysare-backup" /* KEYSARE_BACKUP */}`,
19430
19337
  title: "passport:backupMenu.onboarding.backupMenu.title",
19431
19338
  description: "passport:backupMenu.onboarding.backupMenu.description",
19432
19339
  onNext: () => {
@@ -19441,7 +19348,7 @@ var init_onboarding_setup4 = __esm({
19441
19348
  }
19442
19349
  },
19443
19350
  {
19444
- elId: "embarkai-keyshare-backup-menu-onboarding" /* backupMenu */,
19351
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"keysare-backup" /* KEYSARE_BACKUP */}`,
19445
19352
  title: "passport:backupMenu.onboarding.backupEncryptionPassword.title",
19446
19353
  description: "passport:backupMenu.onboarding.backupEncryptionPassword.description",
19447
19354
  onNext: () => {
@@ -20329,7 +20236,6 @@ var init_KeyshareRestoreMenu = __esm({
20329
20236
  const { callbacksRef } = useProviderConfig();
20330
20237
  const { t } = useT();
20331
20238
  const address = useSession((st) => st.address);
20332
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
20333
20239
  const error = useRestoreStore((st) => st.error);
20334
20240
  const success = useRestoreStore((st) => st.success);
20335
20241
  const currentRestoreMethod = useRestoreStore((st) => st.method);
@@ -20412,106 +20318,99 @@ var init_KeyshareRestoreMenu = __esm({
20412
20318
  }
20413
20319
  });
20414
20320
  const RestoreComponent = currentRestoreMethod ? RESTORE_COMPONENTS[currentRestoreMethod] : null;
20415
- return /* @__PURE__ */ jsx84(
20416
- "div",
20417
- {
20418
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
20419
- className: "list-scrollbar-y w-full",
20420
- children: /* @__PURE__ */ jsxs76(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
20421
- isBackupStatusLoading && /* @__PURE__ */ jsxs76("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)] text-center justify-center items-center", children: [
20422
- /* @__PURE__ */ jsx84(Loader14, { className: "w-4 h-4 animate-spin" }),
20423
- /* @__PURE__ */ jsx84("span", { className: "block w-full text-xs leading-4", children: t("passport:restoreMenu.check") })
20321
+ return /* @__PURE__ */ jsxs76(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
20322
+ isBackupStatusLoading && /* @__PURE__ */ jsxs76("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)] text-center justify-center items-center", children: [
20323
+ /* @__PURE__ */ jsx84(Loader14, { className: "w-4 h-4 animate-spin" }),
20324
+ /* @__PURE__ */ jsx84("span", { className: "block w-full text-xs leading-4", children: t("passport:restoreMenu.check") })
20325
+ ] }),
20326
+ !success && !isBackupStatusLoading && !isDisconnecting && !hasServerBackup && /* @__PURE__ */ jsx84(
20327
+ NoBackupFound,
20328
+ {
20329
+ isLoading: isRestoringFromServer || isRestoringFromCloud || isRestoringFromFile || isDisconnecting,
20330
+ restoreFromFile
20331
+ }
20332
+ ),
20333
+ !success && !isBackupStatusLoading && !isDisconnecting && hasServerBackup && /* @__PURE__ */ jsxs76(Fragment27, { children: [
20334
+ /* @__PURE__ */ jsxs76("div", { className: "flex items-center justify-between gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
20335
+ /* @__PURE__ */ jsxs76("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20336
+ /* @__PURE__ */ jsx84(CloudDownload2, { className: "w-6 h-6" }),
20337
+ /* @__PURE__ */ jsx84("span", { className: "font-bold text-xl leading-6", children: t("passport:restoreMenu.title") })
20424
20338
  ] }),
20425
- !success && !isBackupStatusLoading && !isDisconnecting && !hasServerBackup && /* @__PURE__ */ jsx84(
20426
- NoBackupFound,
20339
+ /* @__PURE__ */ jsx84(
20340
+ Switch,
20427
20341
  {
20428
- isLoading: isRestoringFromServer || isRestoringFromCloud || isRestoringFromFile || isDisconnecting,
20429
- restoreFromFile
20430
- }
20431
- ),
20432
- !success && !isBackupStatusLoading && !isDisconnecting && hasServerBackup && /* @__PURE__ */ jsxs76(Fragment27, { children: [
20433
- /* @__PURE__ */ jsxs76("div", { className: "flex items-center justify-between gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
20434
- /* @__PURE__ */ jsxs76("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20435
- /* @__PURE__ */ jsx84(CloudDownload2, { className: "w-6 h-6" }),
20436
- /* @__PURE__ */ jsx84("span", { className: "font-bold text-xl leading-6", children: t("passport:restoreMenu.title") })
20437
- ] }),
20438
- /* @__PURE__ */ jsx84(
20439
- Switch,
20440
- {
20441
- name: "advanced-restore-flow-toggle",
20442
- labels: { checked: t("passport:common.standard"), unchecked: t("passport:common.advanced") },
20443
- checked: currentRestoreMethod !== "server",
20444
- onChange: () => {
20445
- const { setError, setRestorePassword, setRestoreFile, setMethod } = useRestoreStore.getState();
20446
- if (!!error) setError(null);
20447
- if (currentRestoreMethod === "server") {
20448
- setRestorePassword("");
20449
- setMethod(null);
20450
- } else {
20451
- setRestoreFile(null);
20452
- setMethod("server");
20453
- }
20454
- }
20342
+ name: "advanced-restore-flow-toggle",
20343
+ labels: { checked: t("passport:common.standard"), unchecked: t("passport:common.advanced") },
20344
+ checked: currentRestoreMethod !== "server",
20345
+ onChange: () => {
20346
+ const { setError, setRestorePassword, setRestoreFile, setMethod } = useRestoreStore.getState();
20347
+ if (!!error) setError(null);
20348
+ if (currentRestoreMethod === "server") {
20349
+ setRestorePassword("");
20350
+ setMethod(null);
20351
+ } else {
20352
+ setRestoreFile(null);
20353
+ setMethod("server");
20455
20354
  }
20456
- )
20457
- ] }),
20458
- /* @__PURE__ */ jsx84(MethodSelector, { mode: "restore", serverRecoveryStatus }),
20459
- !!currentRestoreMethod && /* @__PURE__ */ jsx84(
20460
- RestoreComponent,
20461
- {
20462
- isLoading: isRestoringFromFile || isRestoringFromServer || isRestoringFromCloud || isDisconnecting,
20463
- fileHandler: restoreFromFile,
20464
- serverHandler: restoreFromServer2,
20465
- cloudHandler: restoreFromCloud
20466
20355
  }
20467
- )
20468
- ] }),
20469
- !success && !isBackupStatusLoading && /* @__PURE__ */ jsxs76(
20470
- Button,
20471
- {
20472
- size: "large",
20473
- variant: "ghost",
20474
- onClick: () => {
20475
- const {
20476
- setError,
20477
- setShowPassword,
20478
- setUsePasskey,
20479
- setRestoreFile,
20480
- setRestorePassword,
20481
- setSuccess,
20482
- setMethod
20483
- } = useRestoreStore.getState();
20484
- setError(null);
20485
- setShowPassword(false);
20486
- setUsePasskey(false);
20487
- setRestoreFile(null);
20488
- setRestorePassword("");
20489
- setSuccess(null);
20490
- setMethod(null);
20491
- disconnect();
20492
- },
20493
- disabled: isDisconnecting || isRestoringFromFile || isRestoringFromServer,
20494
- className: "w-fit mx-auto",
20495
- children: [
20496
- isDisconnecting ? /* @__PURE__ */ jsx84(Loader14, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ jsx84(UserCircle2, { className: "w-4 h-4" }),
20497
- /* @__PURE__ */ jsx84("span", { children: t("passport:restoreMenu.tryAnotherAccount") })
20498
- ]
20499
20356
  }
20500
- ),
20501
- error && /* @__PURE__ */ jsxs76(Highlight, { type: "error", className: "flex gap-[var(--ui-kit-gap)]", children: [
20502
- /* @__PURE__ */ jsx84(AlertCircle2, { className: "h-4 w-4 flex-shrink-0" }),
20503
- /* @__PURE__ */ jsx84("span", { className: "w-full flex-1 block", children: error })
20504
- ] }),
20505
- success && /* @__PURE__ */ jsxs76(Fragment27, { children: [
20506
- /* @__PURE__ */ jsxs76(Highlight, { type: "success", className: "flex gap-[var(--ui-kit-gap)]", children: [
20507
- /* @__PURE__ */ jsx84(CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
20508
- /* @__PURE__ */ jsx84("span", { className: "w-full flex-1 block", children: success })
20509
- ] }),
20510
- /* @__PURE__ */ jsx84(Button, { variant: "default", size: "large", className: "w-full", onClick: () => onRestoreSuccess(), children: "Done" })
20511
- ] })
20512
- ] })
20513
- }
20514
- );
20357
+ )
20358
+ ] }),
20359
+ /* @__PURE__ */ jsx84(MethodSelector, { mode: "restore", serverRecoveryStatus }),
20360
+ !!currentRestoreMethod && /* @__PURE__ */ jsx84(
20361
+ RestoreComponent,
20362
+ {
20363
+ isLoading: isRestoringFromFile || isRestoringFromServer || isRestoringFromCloud || isDisconnecting,
20364
+ fileHandler: restoreFromFile,
20365
+ serverHandler: restoreFromServer2,
20366
+ cloudHandler: restoreFromCloud
20367
+ }
20368
+ )
20369
+ ] }),
20370
+ !success && !isBackupStatusLoading && /* @__PURE__ */ jsxs76(
20371
+ Button,
20372
+ {
20373
+ size: "large",
20374
+ variant: "ghost",
20375
+ onClick: () => {
20376
+ const {
20377
+ setError,
20378
+ setShowPassword,
20379
+ setUsePasskey,
20380
+ setRestoreFile,
20381
+ setRestorePassword,
20382
+ setSuccess,
20383
+ setMethod
20384
+ } = useRestoreStore.getState();
20385
+ setError(null);
20386
+ setShowPassword(false);
20387
+ setUsePasskey(false);
20388
+ setRestoreFile(null);
20389
+ setRestorePassword("");
20390
+ setSuccess(null);
20391
+ setMethod(null);
20392
+ disconnect();
20393
+ },
20394
+ disabled: isDisconnecting || isRestoringFromFile || isRestoringFromServer,
20395
+ className: "w-fit mx-auto",
20396
+ children: [
20397
+ isDisconnecting ? /* @__PURE__ */ jsx84(Loader14, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ jsx84(UserCircle2, { className: "w-4 h-4" }),
20398
+ /* @__PURE__ */ jsx84("span", { children: t("passport:restoreMenu.tryAnotherAccount") })
20399
+ ]
20400
+ }
20401
+ ),
20402
+ error && /* @__PURE__ */ jsxs76(Highlight, { type: "error", className: "flex gap-[var(--ui-kit-gap)]", children: [
20403
+ /* @__PURE__ */ jsx84(AlertCircle2, { className: "h-4 w-4 flex-shrink-0" }),
20404
+ /* @__PURE__ */ jsx84("span", { className: "w-full flex-1 block", children: error })
20405
+ ] }),
20406
+ success && /* @__PURE__ */ jsxs76(Fragment27, { children: [
20407
+ /* @__PURE__ */ jsxs76(Highlight, { type: "success", className: "flex gap-[var(--ui-kit-gap)]", children: [
20408
+ /* @__PURE__ */ jsx84(CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
20409
+ /* @__PURE__ */ jsx84("span", { className: "w-full flex-1 block", children: success })
20410
+ ] }),
20411
+ /* @__PURE__ */ jsx84(Button, { variant: "default", size: "large", className: "w-full", onClick: () => onRestoreSuccess(), children: "Done" })
20412
+ ] })
20413
+ ] });
20515
20414
  };
20516
20415
  }
20517
20416
  });
@@ -20526,7 +20425,6 @@ function KeyshareBackupMenu() {
20526
20425
  const hasServerVault = useSession((st) => st.hasServerVault);
20527
20426
  const { t } = useT();
20528
20427
  const setPage = useLayoutDataStore((st) => st.setPage);
20529
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
20530
20428
  const currentBackupMethod = useRestoreStore((st) => st.method);
20531
20429
  const usePasskey = useRestoreStore((st) => st.usePasskey);
20532
20430
  const error = useRestoreStore((st) => st.error);
@@ -20565,118 +20463,110 @@ function KeyshareBackupMenu() {
20565
20463
  createPasskey
20566
20464
  } = useCreateBackup();
20567
20465
  const BackupComponent = !!currentBackupMethod ? COMPONENTS[currentBackupMethod] : null;
20568
- return /* @__PURE__ */ jsx85(
20569
- "div",
20570
- {
20571
- ref: (inst) => onboarder.registerElement("embarkai-keyshare-backup-menu-onboarding" /* backupMenu */, inst),
20572
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
20573
- className: "list-scrollbar-y w-full",
20574
- children: /* @__PURE__ */ jsxs77(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
20575
- !!isRecoveryLoading && (hasServerVault || !currentBackupMethod) && /* @__PURE__ */ jsx85("div", { className: "w-full flex items-center justify-center p-[var(--ui-kit-pd)]", children: /* @__PURE__ */ jsx85(Loader15, { className: "w-4 h-4 animate-spin" }) }),
20576
- (!isRecoveryLoading || !hasServerVault) && !hasRecoveryData2 && /* @__PURE__ */ jsxs77("div", { className: "flex items-center justify-center gap-2 px-5 py-[var(--ui-kit-pd)]", children: [
20577
- /* @__PURE__ */ jsx85(LockIcon, { className: "w-6 h-6" }),
20578
- /* @__PURE__ */ jsx85("span", { className: "font-bold text-xl leading-6", children: t("passport:backupMenu.title") })
20579
- ] }),
20580
- !isRecoveryLoading && !!hasRecoveryData2 && /* @__PURE__ */ jsxs77(
20581
- "div",
20582
- {
20583
- ref: (inst) => onboarder.registerElement("embarkai-keyshare-backup-advanced-onboarding" /* backupAdvanced */, inst),
20584
- className: "flex items-center justify-between gap-[var(--ui-kit-gap)]",
20585
- children: [
20586
- /* @__PURE__ */ jsxs77("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20587
- /* @__PURE__ */ jsx85(
20588
- Button,
20589
- {
20590
- variant: "ghost",
20591
- size: "icon",
20592
- title: "Back",
20593
- onClick: () => {
20594
- const {
20595
- setSuccess,
20596
- setError,
20597
- setRestorePassword,
20598
- setRestoreFile,
20599
- setShowPassword,
20600
- setUsePasskey,
20601
- setMethod,
20602
- setSelectedCloudProvider
20603
- } = useRestoreStore.getState();
20604
- setRestorePassword("");
20605
- setRestoreFile(null);
20606
- setShowPassword(false);
20607
- setSelectedCloudProvider(null);
20608
- setUsePasskey(false);
20609
- setError(null);
20610
- setSuccess(null);
20611
- setMethod(null);
20612
- setPage("settings" /* SETTINGS */);
20613
- },
20614
- children: /* @__PURE__ */ jsx85(ArrowLeft13, { className: "h-4 w-4" })
20615
- }
20616
- ),
20617
- /* @__PURE__ */ jsx85("span", { className: "text-xl font-semibold leading-8", children: t("passport:backupMenu.title") })
20618
- ] }),
20619
- /* @__PURE__ */ jsx85(
20620
- Switch,
20621
- {
20622
- name: "advanced-restore-flow-toggle",
20623
- labels: { checked: t("passport:common.standard"), unchecked: t("passport:common.advanced") },
20624
- checked: currentBackupMethod !== "server",
20625
- onChange: () => {
20626
- const { setError, setRestorePassword, setRestoreFile, setMethod } = useRestoreStore.getState();
20627
- if (!!error) setError(null);
20628
- if (currentBackupMethod === "server") {
20629
- setRestorePassword("");
20630
- setMethod(null);
20631
- } else {
20632
- setRestoreFile(null);
20633
- setMethod("server");
20634
- }
20635
- }
20636
- }
20637
- )
20638
- ]
20639
- }
20640
- ),
20641
- !isRecoveryLoading && !!hasRecoveryData2 && !currentBackupMethod && /* @__PURE__ */ jsx85(MethodSelector, { mode: "backup", serverRecoveryStatus }),
20642
- (!isRecoveryLoading || !hasServerVault) && !!currentBackupMethod && /* @__PURE__ */ jsx85(Fragment28, { children: /* @__PURE__ */ jsx85(
20643
- BackupComponent,
20644
- {
20645
- mode: "backup",
20646
- isLoading: isPasswordBackupCreating || isCloudBackupCreating || isLocalBackupCreating || isPasskeyCreating,
20647
- fileHandler: createLocalBackup,
20648
- serverHandler: createPasswordBackup,
20649
- cloudHandler: createCloudBackup,
20650
- createPasskeyHandler: createPasskey
20651
- }
20652
- ) }),
20653
- !isRecoveryLoading && !currentBackupMethod && !hasRecoveryData2 && /* @__PURE__ */ jsxs77(Highlight, { type: "warning", className: "flex gap-[var(--ui-kit-gap)]", children: [
20654
- /* @__PURE__ */ jsx85(AlertCircle3, { className: "h-4 w-4 flex-shrink-0" }),
20655
- /* @__PURE__ */ jsx85("span", { className: "block flex-1 font-semibold", children: "No Backup Found" })
20656
- ] }),
20657
- error && /* @__PURE__ */ jsxs77(Highlight, { type: "error", className: "flex gap-[var(--ui-kit-gap)]", children: [
20658
- /* @__PURE__ */ jsx85(AlertCircle3, { className: "h-4 w-4 flex-shrink-0" }),
20659
- /* @__PURE__ */ jsx85("span", { className: "block w-full flex-1", children: error })
20660
- ] }),
20661
- success && /* @__PURE__ */ jsxs77(Highlight, { type: "success", className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
20662
- /* @__PURE__ */ jsxs77("div", { className: "w-full flex gap-[var(--ui-kit-gap)]", children: [
20663
- /* @__PURE__ */ jsx85(CheckCircle22, { className: "h-4 w-4 flex-shrink-0" }),
20664
- /* @__PURE__ */ jsx85("span", { className: "block w-full flex-1", children: success })
20466
+ return /* @__PURE__ */ jsxs77(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
20467
+ !!isRecoveryLoading && (hasServerVault || !currentBackupMethod) && /* @__PURE__ */ jsx85("div", { className: "w-full flex items-center justify-center p-[var(--ui-kit-pd)]", children: /* @__PURE__ */ jsx85(Loader15, { className: "w-4 h-4 animate-spin" }) }),
20468
+ (!isRecoveryLoading || !hasServerVault) && !hasRecoveryData2 && /* @__PURE__ */ jsxs77("div", { className: "flex items-center justify-center gap-2 px-5 py-[var(--ui-kit-pd)]", children: [
20469
+ /* @__PURE__ */ jsx85(LockIcon, { className: "w-6 h-6" }),
20470
+ /* @__PURE__ */ jsx85("span", { className: "font-bold text-xl leading-6", children: t("passport:backupMenu.title") })
20471
+ ] }),
20472
+ !isRecoveryLoading && !!hasRecoveryData2 && /* @__PURE__ */ jsxs77(
20473
+ "div",
20474
+ {
20475
+ ref: (inst) => onboarder.registerElement("embarkai-keyshare-backup-advanced-onboarding" /* backupAdvanced */, inst),
20476
+ className: "flex items-center justify-between gap-[var(--ui-kit-gap)]",
20477
+ children: [
20478
+ /* @__PURE__ */ jsxs77("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20479
+ /* @__PURE__ */ jsx85(
20480
+ Button,
20481
+ {
20482
+ variant: "ghost",
20483
+ size: "icon",
20484
+ title: "Back",
20485
+ onClick: () => {
20486
+ const {
20487
+ setSuccess,
20488
+ setError,
20489
+ setRestorePassword,
20490
+ setRestoreFile,
20491
+ setShowPassword,
20492
+ setUsePasskey,
20493
+ setMethod,
20494
+ setSelectedCloudProvider
20495
+ } = useRestoreStore.getState();
20496
+ setRestorePassword("");
20497
+ setRestoreFile(null);
20498
+ setShowPassword(false);
20499
+ setSelectedCloudProvider(null);
20500
+ setUsePasskey(false);
20501
+ setError(null);
20502
+ setSuccess(null);
20503
+ setMethod(null);
20504
+ setPage("settings" /* SETTINGS */);
20505
+ },
20506
+ children: /* @__PURE__ */ jsx85(ArrowLeft13, { className: "h-4 w-4" })
20507
+ }
20508
+ ),
20509
+ /* @__PURE__ */ jsx85("span", { className: "text-xl font-semibold leading-8", children: t("passport:backupMenu.title") })
20665
20510
  ] }),
20666
20511
  /* @__PURE__ */ jsx85(
20667
- Button,
20512
+ Switch,
20668
20513
  {
20669
- variant: "default",
20670
- size: "large",
20671
- className: "w-full",
20672
- onClick: () => useRestoreStore.getState().setSuccess(null),
20673
- children: t("passport:common.continue")
20514
+ name: "advanced-restore-flow-toggle",
20515
+ labels: { checked: t("passport:common.standard"), unchecked: t("passport:common.advanced") },
20516
+ checked: currentBackupMethod !== "server",
20517
+ onChange: () => {
20518
+ const { setError, setRestorePassword, setRestoreFile, setMethod } = useRestoreStore.getState();
20519
+ if (!!error) setError(null);
20520
+ if (currentBackupMethod === "server") {
20521
+ setRestorePassword("");
20522
+ setMethod(null);
20523
+ } else {
20524
+ setRestoreFile(null);
20525
+ setMethod("server");
20526
+ }
20527
+ }
20674
20528
  }
20675
20529
  )
20676
- ] })
20677
- ] })
20678
- }
20679
- );
20530
+ ]
20531
+ }
20532
+ ),
20533
+ !isRecoveryLoading && !!hasRecoveryData2 && !currentBackupMethod && /* @__PURE__ */ jsx85(MethodSelector, { mode: "backup", serverRecoveryStatus }),
20534
+ (!isRecoveryLoading || !hasServerVault) && !!currentBackupMethod && /* @__PURE__ */ jsx85(Fragment28, { children: /* @__PURE__ */ jsx85(
20535
+ BackupComponent,
20536
+ {
20537
+ mode: "backup",
20538
+ isLoading: isPasswordBackupCreating || isCloudBackupCreating || isLocalBackupCreating || isPasskeyCreating,
20539
+ fileHandler: createLocalBackup,
20540
+ serverHandler: createPasswordBackup,
20541
+ cloudHandler: createCloudBackup,
20542
+ createPasskeyHandler: createPasskey
20543
+ }
20544
+ ) }),
20545
+ !isRecoveryLoading && !currentBackupMethod && !hasRecoveryData2 && /* @__PURE__ */ jsxs77(Highlight, { type: "warning", className: "flex gap-[var(--ui-kit-gap)]", children: [
20546
+ /* @__PURE__ */ jsx85(AlertCircle3, { className: "h-4 w-4 flex-shrink-0" }),
20547
+ /* @__PURE__ */ jsx85("span", { className: "block flex-1 font-semibold", children: "No Backup Found" })
20548
+ ] }),
20549
+ error && /* @__PURE__ */ jsxs77(Highlight, { type: "error", className: "flex gap-[var(--ui-kit-gap)]", children: [
20550
+ /* @__PURE__ */ jsx85(AlertCircle3, { className: "h-4 w-4 flex-shrink-0" }),
20551
+ /* @__PURE__ */ jsx85("span", { className: "block w-full flex-1", children: error })
20552
+ ] }),
20553
+ success && /* @__PURE__ */ jsxs77(Highlight, { type: "success", className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
20554
+ /* @__PURE__ */ jsxs77("div", { className: "w-full flex gap-[var(--ui-kit-gap)]", children: [
20555
+ /* @__PURE__ */ jsx85(CheckCircle22, { className: "h-4 w-4 flex-shrink-0" }),
20556
+ /* @__PURE__ */ jsx85("span", { className: "block w-full flex-1", children: success })
20557
+ ] }),
20558
+ /* @__PURE__ */ jsx85(
20559
+ Button,
20560
+ {
20561
+ variant: "default",
20562
+ size: "large",
20563
+ className: "w-full",
20564
+ onClick: () => useRestoreStore.getState().setSuccess(null),
20565
+ children: t("passport:common.continue")
20566
+ }
20567
+ )
20568
+ ] })
20569
+ ] });
20680
20570
  }
20681
20571
  var COMPONENTS;
20682
20572
  var init_KeyshareBackupMenu = __esm({
@@ -20684,7 +20574,6 @@ var init_KeyshareBackupMenu = __esm({
20684
20574
  init_SessionContext();
20685
20575
  init_i18n();
20686
20576
  init_useLayoutDataStore();
20687
- init_useLayoutStore();
20688
20577
  init_vaultClient();
20689
20578
  init_Expandable2();
20690
20579
  init_Onboarding();
@@ -20907,34 +20796,20 @@ import { ArrowLeft as ArrowLeft14 } from "lucide-react";
20907
20796
  import { jsx as jsx87, jsxs as jsxs79 } from "react/jsx-runtime";
20908
20797
  function KycMenu() {
20909
20798
  const setPage = useLayoutDataStore((st) => st.setPage);
20910
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
20911
- return /* @__PURE__ */ jsxs79(
20912
- "div",
20913
- {
20914
- style: {
20915
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
20916
- "--ui-kit-list-scrollbar-pd-r": "4px",
20917
- "paddingTop": "var(--ui-kit-pd)",
20918
- "paddingBottom": "var(--ui-kit-pd)",
20919
- "paddingLeft": "4px"
20920
- },
20921
- className: "list-scrollbar-y w-full flex flex-col gap-[var(--ui-kit-gap)]",
20922
- children: [
20923
- /* @__PURE__ */ jsxs79("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20924
- /* @__PURE__ */ jsx87(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ jsx87(ArrowLeft14, { className: "h-4 w-4" }) }),
20925
- /* @__PURE__ */ jsx87("span", { className: "text-xl font-semibold", children: "KYC" })
20926
- ] }),
20927
- /* @__PURE__ */ jsx87(KycContent, {})
20928
- ]
20929
- }
20930
- );
20799
+ return /* @__PURE__ */ jsxs79(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
20800
+ /* @__PURE__ */ jsxs79("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20801
+ /* @__PURE__ */ jsx87(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ jsx87(ArrowLeft14, { className: "h-4 w-4" }) }),
20802
+ /* @__PURE__ */ jsx87("span", { className: "text-xl font-semibold", children: "KYC" })
20803
+ ] }),
20804
+ /* @__PURE__ */ jsx87(KycContent, {})
20805
+ ] });
20931
20806
  }
20932
20807
  var KycContent;
20933
20808
  var init_KycMenu = __esm({
20934
20809
  "src/internal/components/KYC/KycMenu.tsx"() {
20935
20810
  init_ProviderContext();
20936
20811
  init_useLayoutDataStore();
20937
- init_useLayoutStore();
20812
+ init_Expandable2();
20938
20813
  init_button();
20939
20814
  init_SumsubIframe();
20940
20815
  KycContent = () => {
@@ -21013,51 +20888,47 @@ import { jsx as jsx89, jsxs as jsxs81 } from "react/jsx-runtime";
21013
20888
  function LanguagesMenu() {
21014
20889
  const config = useProviderConfig().config;
21015
20890
  const { t, i18n } = useT();
21016
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
21017
20891
  const langOpenedFromMenu = useLayoutDataStore((st) => st.langOpenedFromMenu);
21018
- const setPage = useLayoutDataStore((st) => st.setPage);
21019
20892
  const languageList = getAvailableLanguages(config.current.translations);
21020
- return /* @__PURE__ */ jsx89(
21021
- "div",
21022
- {
21023
- style: {
21024
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
21025
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
20893
+ return /* @__PURE__ */ jsxs81(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
20894
+ /* @__PURE__ */ jsxs81("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
20895
+ /* @__PURE__ */ jsx89(
20896
+ Button,
20897
+ {
20898
+ variant: "ghost",
20899
+ size: "icon",
20900
+ title: "Back",
20901
+ onClick: () => useLayoutDataStore.getState().setPage(langOpenedFromMenu),
20902
+ children: /* @__PURE__ */ jsx89(ArrowLeft15, { className: "h-4 w-4" })
20903
+ }
20904
+ ),
20905
+ /* @__PURE__ */ jsx89("span", { className: "text-xl font-semibold", children: t("passport:common.language") })
20906
+ ] }),
20907
+ /* @__PURE__ */ jsx89("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)] py-[var(--ui-kit-pd)]", children: languageList.map((langKey) => /* @__PURE__ */ jsxs81(
20908
+ Button,
20909
+ {
20910
+ size: "large",
20911
+ variant: i18n.resolvedLanguage === langKey ? "default" : "ghost",
20912
+ className: "justify-between",
20913
+ onClick: () => {
20914
+ i18n.changeLanguage(langKey);
20915
+ localStorage.setItem(LOCAL_STORAGE_I18N_KEY, langKey);
20916
+ useLayoutDataStore.getState().setPage(langOpenedFromMenu);
20917
+ },
20918
+ children: [
20919
+ /* @__PURE__ */ jsx89("span", { children: LANGUAGES[langKey]?.name }),
20920
+ /* @__PURE__ */ jsx89("span", { className: "text-2xl leading-6", children: LANGUAGES[langKey]?.flags })
20921
+ ]
21026
20922
  },
21027
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
21028
- children: /* @__PURE__ */ jsxs81(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
21029
- /* @__PURE__ */ jsxs81("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
21030
- /* @__PURE__ */ jsx89(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage(langOpenedFromMenu), children: /* @__PURE__ */ jsx89(ArrowLeft15, { className: "h-4 w-4" }) }),
21031
- /* @__PURE__ */ jsx89("span", { className: "text-xl font-semibold", children: t("passport:common.language") })
21032
- ] }),
21033
- /* @__PURE__ */ jsx89("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)] py-[var(--ui-kit-pd)]", children: languageList.map((langKey) => /* @__PURE__ */ jsxs81(
21034
- Button,
21035
- {
21036
- size: "large",
21037
- variant: i18n.resolvedLanguage === langKey ? "default" : "ghost",
21038
- className: "justify-between",
21039
- onClick: () => {
21040
- i18n.changeLanguage(langKey);
21041
- localStorage.setItem(LOCAL_STORAGE_I18N_KEY, langKey);
21042
- setPage(langOpenedFromMenu);
21043
- },
21044
- children: [
21045
- /* @__PURE__ */ jsx89("span", { children: LANGUAGES[langKey]?.name }),
21046
- /* @__PURE__ */ jsx89("span", { className: "text-2xl leading-6", children: LANGUAGES[langKey]?.flags })
21047
- ]
21048
- },
21049
- langKey
21050
- )) })
21051
- ] })
21052
- }
21053
- );
20923
+ langKey
20924
+ )) })
20925
+ ] });
21054
20926
  }
21055
20927
  var init_LanguagesMenu = __esm({
21056
20928
  "src/internal/components/LanguagesMenu/LanguagesMenu.tsx"() {
21057
20929
  init_ProviderContext();
21058
20930
  init_i18n();
21059
20931
  init_useLayoutDataStore();
21060
- init_useLayoutStore();
21061
20932
  init_Expandable2();
21062
20933
  init_button();
21063
20934
  }
@@ -21106,12 +20977,16 @@ import { jsx as jsx90, jsxs as jsxs82 } from "react/jsx-runtime";
21106
20977
  function MainMenu() {
21107
20978
  const address = useSession((st) => st.address);
21108
20979
  const { t } = useT();
21109
- const setPage = useLayoutDataStore((st) => st.setPage);
21110
- const setTransitionPageHeight = useLayoutDataStore((st) => st.setTransitionPageHeight);
21111
- useEffect34(() => setTransitionPageHeight(DEFAULT_MAIN_MENU_HEIGHT), []);
20980
+ useEffect34(
20981
+ () => (
20982
+ // actual height measurement of the main menu on mount. prevents layout animations jumps
20983
+ useLayoutDataStore.getState().setTransitionPageHeight(DEFAULT_MAIN_MENU_HEIGHT)
20984
+ ),
20985
+ []
20986
+ );
21112
20987
  useOnboardingTourAvailable(true);
21113
20988
  useProvidersList();
21114
- return /* @__PURE__ */ jsx90("div", { className: "w-full p-[var(--ui-kit-pd)] flex flex-col gap-[var(--ui-kit-gap)]", children: /* @__PURE__ */ jsx90("div", { className: "w-full grid grid-cols-4 gap-0 md:gap-[var(--ui-kit-gap)] py-[10px] md:py-1", children: MAIN_MENU_BUTTONS.map(({ id, onboardingId, label, icon: Icon2 }) => /* @__PURE__ */ jsxs82(
20989
+ return /* @__PURE__ */ jsx90(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: /* @__PURE__ */ jsx90("div", { className: "w-full grid grid-cols-4 gap-0 md:gap-[var(--ui-kit-gap)] py-[10px] md:py-1", children: MAIN_MENU_BUTTONS.map(({ id, onboardingId, label, icon: Icon2 }) => /* @__PURE__ */ jsxs82(
21115
20990
  Button,
21116
20991
  {
21117
20992
  ref: (inst) => onboarder.registerElement(onboardingId, inst),
@@ -21119,7 +20994,7 @@ function MainMenu() {
21119
20994
  variant: "ghost",
21120
20995
  disabled: !address,
21121
20996
  className: "flex-col w-full h-fit p-0",
21122
- onClick: () => setPage(id),
20997
+ onClick: () => useLayoutDataStore.getState().setPage(id),
21123
20998
  children: [
21124
20999
  /* @__PURE__ */ jsx90(Icon2, { className: "w-5 h-5 md:w-8 md:h-8" }),
21125
21000
  /* @__PURE__ */ jsx90("span", { className: "text-xs font-semibold", children: t(label) })
@@ -21135,6 +21010,7 @@ var init_MainMenu = __esm({
21135
21010
  init_useT();
21136
21011
  init_constants();
21137
21012
  init_useLayoutDataStore();
21013
+ init_Expandable2();
21138
21014
  init_useProvidersList();
21139
21015
  init_Onboarding();
21140
21016
  init_button();
@@ -21504,20 +21380,6 @@ var init_NicknameEditForm = __esm({
21504
21380
  }
21505
21381
  });
21506
21382
 
21507
- // src/internal/components/NicknameMenu/onboarding.setup.ts
21508
- var NICKNAME_MENU_TOUR;
21509
- var init_onboarding_setup6 = __esm({
21510
- "src/internal/components/NicknameMenu/onboarding.setup.ts"() {
21511
- NICKNAME_MENU_TOUR = [
21512
- {
21513
- elId: "embarkai-nickname-menu-onboarding" /* nicknameMenu */,
21514
- title: "passport:nicknameMenu.onboarding.nicknameMenu.title",
21515
- description: "passport:nicknameMenu.onboarding.nicknameMenu.description"
21516
- }
21517
- ];
21518
- }
21519
- });
21520
-
21521
21383
  // src/internal/components/NicknameMenu/NicknameMenu.tsx
21522
21384
  import { useQuery as useQuery14 } from "@tanstack/react-query";
21523
21385
  import dayjs4 from "dayjs";
@@ -21544,79 +21406,71 @@ function NicknameMenu() {
21544
21406
  });
21545
21407
  const resolvedError = nicknameError || nicknameInfoError?.message || null;
21546
21408
  useEffect37(() => () => useNicknameStore.getState().reset(), []);
21547
- return /* @__PURE__ */ jsx92(
21548
- "div",
21549
- {
21550
- ref: (inst) => onboarder.registerElement("embarkai-nickname-menu-onboarding" /* nicknameMenu */, inst),
21551
- style: { "--ui-kit-scrollbar-mah": `${maxScrollHeight}px` },
21552
- className: "list-scrollbar-y w-full",
21553
- children: /* @__PURE__ */ jsxs84(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: [
21554
- /* @__PURE__ */ jsxs84("div", { className: "flex items-center gap-[var(--ui-kit-gap)] ", children: [
21555
- /* @__PURE__ */ jsx92(
21556
- Button,
21557
- {
21558
- variant: "ghost",
21559
- size: "icon",
21560
- title: t("passport:common.back"),
21561
- onClick: () => useLayoutDataStore.getState().setPage("settings" /* SETTINGS */),
21562
- children: /* @__PURE__ */ jsx92(ArrowLeft16, { className: "h-4 w-4 flex-none" })
21563
- }
21564
- ),
21565
- /* @__PURE__ */ jsxs84("div", { className: "flex gap-[var(--ui-kit-gap)] items-center w-fit", children: [
21566
- /* @__PURE__ */ jsx92("span", { className: "text-xl font-semibold", children: t("passport:nicknameMenu.title") }),
21567
- isNicknameInfoLoading && /* @__PURE__ */ jsx92(Loader16, { className: "w-4 h-4 animate-spin" })
21568
- ] })
21569
- ] }),
21570
- /* @__PURE__ */ jsx92(NicknameEditForm, { nicknameInfo, isInitialUser }),
21571
- !nicknameInfo?.canChange && nicknameInfo?.cooldownEndsAt && /* @__PURE__ */ jsx92(Highlight, { type: "info", children: t("passport:nicknameMenu.cooldownMessage", {
21572
- canChangeAt: dayjs4(nicknameInfo.cooldownEndsAt).format("MMM D, YYYY"),
21573
- days: String(getDaysRemaining(nicknameInfo.cooldownEndsAt))
21574
- }) }),
21575
- !nicknameSuccess && !!nicknameInfo && /* @__PURE__ */ jsxs84("div", { className: "flex items-center gap-[var(--ui-kit-gap)] justify-between text-[10px]", children: [
21576
- /* @__PURE__ */ jsxs84("span", { children: [
21577
- /* @__PURE__ */ jsx92("span", { className: "text-[var(--ui-kit-fg-muted)]", children: nicknameInfo.changedAt ? t("passport:nicknameMenu.lastChanged") : t("passport:common.created") }),
21578
- /* @__PURE__ */ jsx92("span", { children: ": " }),
21579
- /* @__PURE__ */ jsx92("strong", { className: "text-[var(--ui-kit-fg)]", children: dayjs4(nicknameInfo.changedAt || nicknameInfo.createdAt).format("MMM D, YYYY") })
21580
- ] }),
21581
- /* @__PURE__ */ jsxs84("span", { children: [
21582
- /* @__PURE__ */ jsx92("span", { className: "text-[var(--ui-kit-fg-muted)]", children: t("passport:nicknameMenu.timesChanged") }),
21583
- /* @__PURE__ */ jsx92("span", { children: ": " }),
21584
- /* @__PURE__ */ jsx92("strong", { className: "text-[var(--ui-kit-fg)]", children: nicknameInfo.changeCount })
21585
- ] })
21586
- ] }),
21587
- !!nicknameSuccess && /* @__PURE__ */ jsx92(Highlight, { type: "success", children: nicknameSuccess }),
21588
- isInitialUser && /* @__PURE__ */ jsxs84(Highlight, { type: "success", children: [
21589
- /* @__PURE__ */ jsx92("p", {
21590
- //@ts-expect-error i18n typings
21591
- children: t("passport:nicknameMenu.initialUser.welcome", {
21592
- nickname: nicknameInfo?.handle || "N/A"
21593
- })
21594
- }),
21595
- /* @__PURE__ */ jsx92("p", { children: t("passport:nicknameMenu.initialUser.message") }),
21596
- /* @__PURE__ */ jsxs84(
21597
- Button,
21598
- {
21599
- variant: "default",
21600
- size: "large",
21601
- title: t("passport:common.continue"),
21602
- onClick: () => {
21603
- const { openPostAuthNavigation, setPage } = useLayoutDataStore.getState();
21604
- if (!openPostAuthNavigation()) setPage(null);
21605
- },
21606
- className: "w-full",
21607
- children: [
21608
- t("passport:common.continue"),
21609
- " (",
21610
- nicknameInfo?.handle,
21611
- ")"
21612
- ]
21613
- }
21614
- )
21615
- ] }),
21616
- !!resolvedError?.length && /* @__PURE__ */ jsx92(Highlight, { type: "error", children: resolvedError })
21409
+ return /* @__PURE__ */ jsxs84(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
21410
+ /* @__PURE__ */ jsxs84("div", { className: "flex items-center gap-[var(--ui-kit-gap)] ", children: [
21411
+ /* @__PURE__ */ jsx92(
21412
+ Button,
21413
+ {
21414
+ variant: "ghost",
21415
+ size: "icon",
21416
+ title: t("passport:common.back"),
21417
+ onClick: () => useLayoutDataStore.getState().setPage("settings" /* SETTINGS */),
21418
+ children: /* @__PURE__ */ jsx92(ArrowLeft16, { className: "h-4 w-4 flex-none" })
21419
+ }
21420
+ ),
21421
+ /* @__PURE__ */ jsxs84("div", { className: "flex gap-[var(--ui-kit-gap)] items-center w-fit", children: [
21422
+ /* @__PURE__ */ jsx92("span", { className: "text-xl font-semibold", children: t("passport:nicknameMenu.title") }),
21423
+ isNicknameInfoLoading && /* @__PURE__ */ jsx92(Loader16, { className: "w-4 h-4 animate-spin" })
21617
21424
  ] })
21618
- }
21619
- );
21425
+ ] }),
21426
+ /* @__PURE__ */ jsx92(NicknameEditForm, { nicknameInfo, isInitialUser }),
21427
+ !nicknameInfo?.canChange && nicknameInfo?.cooldownEndsAt && /* @__PURE__ */ jsx92(Highlight, { type: "info", children: t("passport:nicknameMenu.cooldownMessage", {
21428
+ canChangeAt: dayjs4(nicknameInfo.cooldownEndsAt).format("MMM D, YYYY"),
21429
+ days: String(getDaysRemaining(nicknameInfo.cooldownEndsAt))
21430
+ }) }),
21431
+ !nicknameSuccess && !!nicknameInfo && /* @__PURE__ */ jsxs84("div", { className: "flex items-center gap-[var(--ui-kit-gap)] justify-between text-[10px]", children: [
21432
+ /* @__PURE__ */ jsxs84("span", { children: [
21433
+ /* @__PURE__ */ jsx92("span", { className: "text-[var(--ui-kit-fg-muted)]", children: nicknameInfo.changedAt ? t("passport:nicknameMenu.lastChanged") : t("passport:common.created") }),
21434
+ /* @__PURE__ */ jsx92("span", { children: ": " }),
21435
+ /* @__PURE__ */ jsx92("strong", { className: "text-[var(--ui-kit-fg)]", children: dayjs4(nicknameInfo.changedAt || nicknameInfo.createdAt).format("MMM D, YYYY") })
21436
+ ] }),
21437
+ /* @__PURE__ */ jsxs84("span", { children: [
21438
+ /* @__PURE__ */ jsx92("span", { className: "text-[var(--ui-kit-fg-muted)]", children: t("passport:nicknameMenu.timesChanged") }),
21439
+ /* @__PURE__ */ jsx92("span", { children: ": " }),
21440
+ /* @__PURE__ */ jsx92("strong", { className: "text-[var(--ui-kit-fg)]", children: nicknameInfo.changeCount })
21441
+ ] })
21442
+ ] }),
21443
+ !!nicknameSuccess && /* @__PURE__ */ jsx92(Highlight, { type: "success", children: nicknameSuccess }),
21444
+ isInitialUser && /* @__PURE__ */ jsxs84(Highlight, { type: "success", children: [
21445
+ /* @__PURE__ */ jsx92("p", {
21446
+ //@ts-expect-error i18n typings
21447
+ children: t("passport:nicknameMenu.initialUser.welcome", {
21448
+ nickname: nicknameInfo?.handle || "N/A"
21449
+ })
21450
+ }),
21451
+ /* @__PURE__ */ jsx92("p", { children: t("passport:nicknameMenu.initialUser.message") }),
21452
+ /* @__PURE__ */ jsxs84(
21453
+ Button,
21454
+ {
21455
+ variant: "default",
21456
+ size: "large",
21457
+ title: t("passport:common.continue"),
21458
+ onClick: () => {
21459
+ const { openPostAuthNavigation, setPage } = useLayoutDataStore.getState();
21460
+ if (!openPostAuthNavigation()) setPage(null);
21461
+ },
21462
+ className: "w-full",
21463
+ children: [
21464
+ t("passport:common.continue"),
21465
+ " (",
21466
+ nicknameInfo?.handle,
21467
+ ")"
21468
+ ]
21469
+ }
21470
+ )
21471
+ ] }),
21472
+ !!resolvedError?.length && /* @__PURE__ */ jsx92(Highlight, { type: "error", children: resolvedError })
21473
+ ] });
21620
21474
  }
21621
21475
  var init_NicknameMenu = __esm({
21622
21476
  "src/internal/components/NicknameMenu/NicknameMenu.tsx"() {
@@ -21637,6 +21491,21 @@ var init_NicknameMenu = __esm({
21637
21491
  }
21638
21492
  });
21639
21493
 
21494
+ // src/internal/components/NicknameMenu/onboarding.setup.ts
21495
+ var NICKNAME_MENU_TOUR;
21496
+ var init_onboarding_setup6 = __esm({
21497
+ "src/internal/components/NicknameMenu/onboarding.setup.ts"() {
21498
+ init_constants();
21499
+ NICKNAME_MENU_TOUR = [
21500
+ {
21501
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"nickname-settings" /* NICKNAME_SETTINGS */}`,
21502
+ title: "passport:nicknameMenu.onboarding.nicknameMenu.title",
21503
+ description: "passport:nicknameMenu.onboarding.nicknameMenu.description"
21504
+ }
21505
+ ];
21506
+ }
21507
+ });
21508
+
21640
21509
  // src/internal/components/NicknameMenu/index.ts
21641
21510
  var init_NicknameMenu2 = __esm({
21642
21511
  "src/internal/components/NicknameMenu/index.ts"() {
@@ -22542,7 +22411,6 @@ function PortfolioMenu() {
22542
22411
  const { t } = useT();
22543
22412
  const qc = useQueryClient21();
22544
22413
  const address = useSession((st) => st.address);
22545
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
22546
22414
  const {
22547
22415
  assets: blockscoutAssets,
22548
22416
  refreshBalances: refreshBlockscoutBalances,
@@ -22559,57 +22427,47 @@ function PortfolioMenu() {
22559
22427
  Promise.all(shownProjectAssets.map((asset) => qc.invalidateQueries({ queryKey: asset.balanceQueryKey })));
22560
22428
  refreshBlockscoutBalances();
22561
22429
  }, [qc, shownProjectAssets, refreshBlockscoutBalances]);
22562
- return /* @__PURE__ */ jsx95(
22563
- "div",
22564
- {
22565
- style: {
22566
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
22567
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
22430
+ return /* @__PURE__ */ jsxs87(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
22431
+ /* @__PURE__ */ jsxs87("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
22432
+ /* @__PURE__ */ jsx95(
22433
+ Button,
22434
+ {
22435
+ variant: "ghost",
22436
+ size: "icon",
22437
+ title: "Back",
22438
+ onClick: () => useLayoutDataStore.getState().setPage("main-menu" /* MAIN_MENU */),
22439
+ children: /* @__PURE__ */ jsx95(ArrowLeft17, { className: "h-4 w-4" })
22440
+ }
22441
+ ),
22442
+ /* @__PURE__ */ jsx95("span", { className: "text-xl font-semibold", children: t("passport:portfolioMenu.title") }),
22443
+ /* @__PURE__ */ jsx95(
22444
+ Button,
22445
+ {
22446
+ title: "Refresh balances",
22447
+ variant: "ghost",
22448
+ size: "icon",
22449
+ onClick: refreshAllAssetsBalances,
22450
+ disabled: isBlockscoutLoading || isBlockscoutFetching,
22451
+ children: isBlockscoutLoading || isBlockscoutFetching ? /* @__PURE__ */ jsx95(Loader17, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx95(RefreshCw2, { className: "h-4 w-4" })
22452
+ }
22453
+ )
22454
+ ] }),
22455
+ isBlockscoutLoading && /* @__PURE__ */ jsx95("div", { className: "w-full flex items-center justify-center gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: /* @__PURE__ */ jsx95(Loader17, { className: "w-4 h-4 animate-spin" }) }),
22456
+ !isBlockscoutLoading && blockscoutAssets?.length === 0 && /* @__PURE__ */ jsxs87(Highlight, { type: "info", className: "flex flex-col items-center justify-center gap-[var(--ui-kit-gap)]", children: [
22457
+ /* @__PURE__ */ jsx95(Gem, { className: "w-8 h-8" }),
22458
+ /* @__PURE__ */ jsx95("span", { className: "block", children: t("passport:portfolioMenu.noAssets") })
22459
+ ] }),
22460
+ !isBlockscoutLoading && shownProjectAssets?.map((asset, index) => /* @__PURE__ */ jsx95(PortfolioItem, { isProjectAsset: true, address, asset }, `project-${asset.symbol}-${index}`)),
22461
+ !isBlockscoutLoading && blockscoutAssets?.length > 0 && blockscoutAssets.map((asset, index) => /* @__PURE__ */ jsx95(
22462
+ PortfolioItem,
22463
+ {
22464
+ address,
22465
+ asset
22568
22466
  },
22569
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
22570
- children: /* @__PURE__ */ jsxs87(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
22571
- /* @__PURE__ */ jsxs87("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
22572
- /* @__PURE__ */ jsx95(
22573
- Button,
22574
- {
22575
- variant: "ghost",
22576
- size: "icon",
22577
- title: "Back",
22578
- onClick: () => useLayoutDataStore.getState().setPage("main-menu" /* MAIN_MENU */),
22579
- children: /* @__PURE__ */ jsx95(ArrowLeft17, { className: "h-4 w-4" })
22580
- }
22581
- ),
22582
- /* @__PURE__ */ jsx95("span", { className: "text-xl font-semibold", children: t("passport:portfolioMenu.title") }),
22583
- /* @__PURE__ */ jsx95(
22584
- Button,
22585
- {
22586
- title: "Refresh balances",
22587
- variant: "ghost",
22588
- size: "icon",
22589
- onClick: refreshAllAssetsBalances,
22590
- disabled: isBlockscoutLoading || isBlockscoutFetching,
22591
- children: isBlockscoutLoading || isBlockscoutFetching ? /* @__PURE__ */ jsx95(Loader17, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx95(RefreshCw2, { className: "h-4 w-4" })
22592
- }
22593
- )
22594
- ] }),
22595
- isBlockscoutLoading && /* @__PURE__ */ jsx95("div", { className: "w-full flex items-center justify-center gap-[var(--ui-kit-gap)] p-[var(--ui-kit-pd)]", children: /* @__PURE__ */ jsx95(Loader17, { className: "w-4 h-4 animate-spin" }) }),
22596
- !isBlockscoutLoading && blockscoutAssets?.length === 0 && /* @__PURE__ */ jsxs87(Highlight, { type: "info", className: "flex flex-col items-center justify-center gap-[var(--ui-kit-gap)]", children: [
22597
- /* @__PURE__ */ jsx95(Gem, { className: "w-8 h-8" }),
22598
- /* @__PURE__ */ jsx95("span", { className: "block", children: t("passport:portfolioMenu.noAssets") })
22599
- ] }),
22600
- !isBlockscoutLoading && shownProjectAssets?.map((asset, index) => /* @__PURE__ */ jsx95(PortfolioItem, { isProjectAsset: true, address, asset }, `project-${asset.symbol}-${index}`)),
22601
- !isBlockscoutLoading && blockscoutAssets?.length > 0 && blockscoutAssets.map((asset, index) => /* @__PURE__ */ jsx95(
22602
- PortfolioItem,
22603
- {
22604
- address,
22605
- asset
22606
- },
22607
- `${asset.type}-${asset.address || "native"}-${asset.tokenId || index}`
22608
- )),
22609
- blockscoutError && /* @__PURE__ */ jsx95(Highlight, { type: "error", children: blockscoutError?.message })
22610
- ] })
22611
- }
22612
- );
22467
+ `${asset.type}-${asset.address || "native"}-${asset.tokenId || index}`
22468
+ )),
22469
+ blockscoutError && /* @__PURE__ */ jsx95(Highlight, { type: "error", children: blockscoutError?.message })
22470
+ ] });
22613
22471
  }
22614
22472
  var init_PortfolioMenu = __esm({
22615
22473
  "src/internal/components/PortfolioMenu/PortfolioMenu.tsx"() {
@@ -22618,7 +22476,6 @@ var init_PortfolioMenu = __esm({
22618
22476
  init_i18n();
22619
22477
  init_useBlockscoutAssets2();
22620
22478
  init_useLayoutDataStore();
22621
- init_useLayoutStore();
22622
22479
  init_Expandable2();
22623
22480
  init_button();
22624
22481
  init_highlight();
@@ -22713,21 +22570,6 @@ var init_nickname_fingerprint = __esm({
22713
22570
  }
22714
22571
  });
22715
22572
 
22716
- // src/internal/components/ReceiveMenu/onboarding.setup.ts
22717
- var RECEIVE_MENU_ONBOARDING_ID, RECEIVE_MENU_TOUR;
22718
- var init_onboarding_setup7 = __esm({
22719
- "src/internal/components/ReceiveMenu/onboarding.setup.ts"() {
22720
- RECEIVE_MENU_ONBOARDING_ID = "embarkai-receive-menu-onboarding";
22721
- RECEIVE_MENU_TOUR = [
22722
- {
22723
- elId: RECEIVE_MENU_ONBOARDING_ID,
22724
- title: "passport:receiveMenu.onboarding.receiveMenu.title",
22725
- description: "passport:receiveMenu.onboarding.receiveMenu.description"
22726
- }
22727
- ];
22728
- }
22729
- });
22730
-
22731
22573
  // src/internal/components/ReceiveMenu/ReceiveMenu.tsx
22732
22574
  import { useQuery as useQuery19 } from "@tanstack/react-query";
22733
22575
  import { ArrowLeft as ArrowLeft18, AtSignIcon as AtSignIcon2, CheckCircle2 as CheckCircle23, Copy as Copy2, FingerprintIcon, LoaderIcon as LoaderIcon12, Wallet2Icon as Wallet2Icon3 } from "lucide-react";
@@ -22745,7 +22587,6 @@ function ReceiveMenu() {
22745
22587
  queryKey: [QUERY_KEYS.nicknameInfo, address],
22746
22588
  queryFn: async () => await getNicknameInfo()
22747
22589
  });
22748
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
22749
22590
  const [qrCodeUrl, setQrCodeUrl] = useState23("");
22750
22591
  const [isAddressCopied, setAddressCopied] = useState23(false);
22751
22592
  const [isNicknameCopied, setNicknameCopied] = useState23(false);
@@ -22767,107 +22608,96 @@ function ReceiveMenu() {
22767
22608
  color: { dark: "#000000", light: "#ffffff" }
22768
22609
  }).then((url) => setQrCodeUrl(url)).catch((err) => console.error("Failed to generate QR code:", err));
22769
22610
  }, [address]);
22770
- return /* @__PURE__ */ jsxs88(
22771
- "div",
22772
- {
22773
- ref: (inst) => onboarder.registerElement(RECEIVE_MENU_ONBOARDING_ID, inst),
22774
- style: {
22775
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
22776
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
22777
- },
22778
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)] flex flex-col gap-[var(--ui-kit-gap)]",
22779
- children: [
22780
- /* @__PURE__ */ jsxs88("div", { className: "w-full flex items-center gap-[var(--ui-kit-gap)]", children: [
22781
- /* @__PURE__ */ jsx96(
22782
- Button,
22783
- {
22784
- variant: "ghost",
22785
- size: "icon",
22786
- title: "Back",
22787
- onClick: () => useLayoutDataStore.getState().setPage("main-menu" /* MAIN_MENU */),
22788
- children: /* @__PURE__ */ jsx96(ArrowLeft18, { className: "h-4 w-4" })
22789
- }
22790
- ),
22791
- /* @__PURE__ */ jsx96("span", { className: "text-xl font-semibold", children: t("passport:receiveMenu.title") })
22792
- ] }),
22793
- /* @__PURE__ */ jsx96("span", { className: "text-xs text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.scanQR") }),
22794
- /* @__PURE__ */ jsxs88(Highlight, { className: "text-center", type: "warning", children: [
22795
- /* @__PURE__ */ jsx96("strong", { className: "block w-full", children: `${t("passport:common.network")}: ${chainConfig.name}` }),
22796
- /* @__PURE__ */ jsx96("span", { className: "block w-full", children: t("passport:receiveMenu.warning") })
22797
- ] }),
22798
- /* @__PURE__ */ jsx96("div", { className: "flex items-center justify-center p-[var(--ui-kit-pd)]", style: { minHeight: "216px" }, children: qrCodeUrl && /* @__PURE__ */ jsx96("img", { src: qrCodeUrl, alt: "Wallet QR Code", className: "w-48 h-48" }) }),
22799
- /* @__PURE__ */ jsx96("span", { className: "block text-xs leading-4 text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.share.address") }),
22800
- /* @__PURE__ */ jsxs88(
22801
- Button,
22802
- {
22803
- title: "Copy address",
22804
- variant: "secondary",
22805
- size: "medium",
22806
- className: "w-full",
22807
- onClick: () => {
22808
- if (!address) return;
22809
- navigator.clipboard.writeText(address);
22810
- setAddressCopied(true);
22811
- setTimeout(() => setAddressCopied(false), 2e3);
22812
- },
22813
- children: [
22814
- /* @__PURE__ */ jsx96(Wallet2Icon3, { className: "h-4 w-4 flex-none" }),
22815
- /* @__PURE__ */ jsxs88("span", { className: cn2("text-[10px] flex-1 block", { "text-[var(--ui-kit-bg-success)]": isAddressCopied }), children: [
22816
- address.slice(0, 10),
22817
- "...",
22818
- address.slice(-6)
22819
- ] }),
22820
- isAddressCopied ? /* @__PURE__ */ jsx96(CheckCircle23, { className: "h-4 w-4 text-[var(--ui-kit-bg-success)] flex-none" }) : /* @__PURE__ */ jsx96(Copy2, { className: "h-4 w-4 flex-none" })
22821
- ]
22822
- }
22823
- ),
22824
- /* @__PURE__ */ jsx96("span", { className: "block text-xs leading-4 text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.share.nickname") }),
22825
- /* @__PURE__ */ jsx96(
22826
- Button,
22827
- {
22828
- title: "Copy nickname",
22829
- variant: "secondary",
22830
- size: "medium",
22831
- className: "w-full",
22832
- onClick: () => {
22833
- const nickname = nicknameInfo.handle;
22834
- navigator.clipboard.writeText(nickname);
22835
- setNicknameCopied(true);
22836
- setTimeout(() => setNicknameCopied(false), 2e3);
22837
- },
22838
- children: isNicknameInfoLoading ? /* @__PURE__ */ jsx96("div", { className: "flex-1", children: /* @__PURE__ */ jsx96(LoaderIcon12, { className: "w-4 h-4 animate-spin" }) }) : /* @__PURE__ */ jsxs88(Fragment32, { children: [
22839
- /* @__PURE__ */ jsx96(AtSignIcon2, { className: "h-4 w-4 flex-none" }),
22840
- /* @__PURE__ */ jsx96("span", { className: cn2("text-xs flex-1", { "text-[var(--ui-kit-bg-success)]": isNicknameCopied }), children: nicknameInfo.handle }),
22841
- isNicknameCopied ? /* @__PURE__ */ jsx96(CheckCircle23, { className: "h-4 w-4 text-[var(--ui-kit-bg-success)] flex-none" }) : /* @__PURE__ */ jsx96(Copy2, { className: "h-4 w-4 flex-none" })
22842
- ] })
22843
- }
22844
- ),
22845
- fingerprint && /* @__PURE__ */ jsxs88(Fragment32, { children: [
22846
- /* @__PURE__ */ jsx96("span", { className: "block text-xs leading-4 text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.share.identity") }),
22847
- /* @__PURE__ */ jsxs88(
22848
- Button,
22849
- {
22850
- title: "Copy fingerprint",
22851
- variant: "secondary",
22852
- size: "medium",
22853
- className: "w-full justify-between",
22854
- onClick: () => {
22855
- if (!fingerprint) return;
22856
- navigator.clipboard.writeText(fingerprint);
22857
- setFingerprintCopied(true);
22858
- setTimeout(() => setFingerprintCopied(false), 2e3);
22859
- },
22860
- children: [
22861
- /* @__PURE__ */ jsx96(FingerprintIcon, { className: "w-4 h-4 flex-none" }),
22862
- /* @__PURE__ */ jsx96("span", { className: cn2("text-xs font-bold flex-1", { "text-[var(--ui-kit-bg-success)]": fingerprintCopied }), children: fingerprint }),
22863
- fingerprintCopied ? /* @__PURE__ */ jsx96(CheckCircle23, { className: "w-4 h-4 text-[var(--ui-kit-bg-success)] flex-none" }) : /* @__PURE__ */ jsx96(Copy2, { className: "w-4 h-4 flex-none" })
22864
- ]
22865
- }
22866
- )
22611
+ return /* @__PURE__ */ jsxs88(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
22612
+ /* @__PURE__ */ jsxs88("div", { className: "w-full flex items-center gap-[var(--ui-kit-gap)]", children: [
22613
+ /* @__PURE__ */ jsx96(
22614
+ Button,
22615
+ {
22616
+ variant: "ghost",
22617
+ size: "icon",
22618
+ title: "Back",
22619
+ onClick: () => useLayoutDataStore.getState().setPage("main-menu" /* MAIN_MENU */),
22620
+ children: /* @__PURE__ */ jsx96(ArrowLeft18, { className: "h-4 w-4" })
22621
+ }
22622
+ ),
22623
+ /* @__PURE__ */ jsx96("span", { className: "text-xl font-semibold", children: t("passport:receiveMenu.title") })
22624
+ ] }),
22625
+ /* @__PURE__ */ jsx96("span", { className: "text-xs text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.scanQR") }),
22626
+ /* @__PURE__ */ jsxs88(Highlight, { className: "text-center", type: "warning", children: [
22627
+ /* @__PURE__ */ jsx96("strong", { className: "block w-full", children: `${t("passport:common.network")}: ${chainConfig.name}` }),
22628
+ /* @__PURE__ */ jsx96("span", { className: "block w-full", children: t("passport:receiveMenu.warning") })
22629
+ ] }),
22630
+ /* @__PURE__ */ jsx96("div", { className: "flex items-center justify-center p-[var(--ui-kit-pd)]", style: { minHeight: "216px" }, children: qrCodeUrl && /* @__PURE__ */ jsx96("img", { src: qrCodeUrl, alt: "Wallet QR Code", className: "w-48 h-48" }) }),
22631
+ /* @__PURE__ */ jsx96("span", { className: "block text-xs leading-4 text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.share.address") }),
22632
+ /* @__PURE__ */ jsxs88(
22633
+ Button,
22634
+ {
22635
+ title: "Copy address",
22636
+ variant: "secondary",
22637
+ size: "medium",
22638
+ className: "w-full",
22639
+ onClick: () => {
22640
+ if (!address) return;
22641
+ navigator.clipboard.writeText(address);
22642
+ setAddressCopied(true);
22643
+ setTimeout(() => setAddressCopied(false), 2e3);
22644
+ },
22645
+ children: [
22646
+ /* @__PURE__ */ jsx96(Wallet2Icon3, { className: "h-4 w-4 flex-none" }),
22647
+ /* @__PURE__ */ jsxs88("span", { className: cn2("text-[10px] flex-1 block", { "text-[var(--ui-kit-bg-success)]": isAddressCopied }), children: [
22648
+ address.slice(0, 10),
22649
+ "...",
22650
+ address.slice(-6)
22651
+ ] }),
22652
+ isAddressCopied ? /* @__PURE__ */ jsx96(CheckCircle23, { className: "h-4 w-4 text-[var(--ui-kit-bg-success)] flex-none" }) : /* @__PURE__ */ jsx96(Copy2, { className: "h-4 w-4 flex-none" })
22653
+ ]
22654
+ }
22655
+ ),
22656
+ /* @__PURE__ */ jsx96("span", { className: "block text-xs leading-4 text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.share.nickname") }),
22657
+ /* @__PURE__ */ jsx96(
22658
+ Button,
22659
+ {
22660
+ title: "Copy nickname",
22661
+ variant: "secondary",
22662
+ size: "medium",
22663
+ className: "w-full",
22664
+ onClick: () => {
22665
+ const nickname = nicknameInfo.handle;
22666
+ navigator.clipboard.writeText(nickname);
22667
+ setNicknameCopied(true);
22668
+ setTimeout(() => setNicknameCopied(false), 2e3);
22669
+ },
22670
+ children: isNicknameInfoLoading ? /* @__PURE__ */ jsx96("div", { className: "flex-1", children: /* @__PURE__ */ jsx96(LoaderIcon12, { className: "w-4 h-4 animate-spin" }) }) : /* @__PURE__ */ jsxs88(Fragment32, { children: [
22671
+ /* @__PURE__ */ jsx96(AtSignIcon2, { className: "h-4 w-4 flex-none" }),
22672
+ /* @__PURE__ */ jsx96("span", { className: cn2("text-xs flex-1", { "text-[var(--ui-kit-bg-success)]": isNicknameCopied }), children: nicknameInfo.handle }),
22673
+ isNicknameCopied ? /* @__PURE__ */ jsx96(CheckCircle23, { className: "h-4 w-4 text-[var(--ui-kit-bg-success)] flex-none" }) : /* @__PURE__ */ jsx96(Copy2, { className: "h-4 w-4 flex-none" })
22867
22674
  ] })
22868
- ]
22869
- }
22870
- );
22675
+ }
22676
+ ),
22677
+ fingerprint && /* @__PURE__ */ jsxs88(Fragment32, { children: [
22678
+ /* @__PURE__ */ jsx96("span", { className: "block text-xs leading-4 text-[var(--ui-kit-fg-muted)]", children: t("passport:receiveMenu.share.identity") }),
22679
+ /* @__PURE__ */ jsxs88(
22680
+ Button,
22681
+ {
22682
+ title: "Copy fingerprint",
22683
+ variant: "secondary",
22684
+ size: "medium",
22685
+ className: "w-full justify-between",
22686
+ onClick: () => {
22687
+ if (!fingerprint) return;
22688
+ navigator.clipboard.writeText(fingerprint);
22689
+ setFingerprintCopied(true);
22690
+ setTimeout(() => setFingerprintCopied(false), 2e3);
22691
+ },
22692
+ children: [
22693
+ /* @__PURE__ */ jsx96(FingerprintIcon, { className: "w-4 h-4 flex-none" }),
22694
+ /* @__PURE__ */ jsx96("span", { className: cn2("text-xs font-bold flex-1", { "text-[var(--ui-kit-bg-success)]": fingerprintCopied }), children: fingerprint }),
22695
+ fingerprintCopied ? /* @__PURE__ */ jsx96(CheckCircle23, { className: "w-4 h-4 text-[var(--ui-kit-bg-success)] flex-none" }) : /* @__PURE__ */ jsx96(Copy2, { className: "w-4 h-4 flex-none" })
22696
+ ]
22697
+ }
22698
+ )
22699
+ ] })
22700
+ ] });
22871
22701
  }
22872
22702
  var init_ReceiveMenu = __esm({
22873
22703
  "src/internal/components/ReceiveMenu/ReceiveMenu.tsx"() {
@@ -22876,13 +22706,27 @@ var init_ReceiveMenu = __esm({
22876
22706
  init_nickname();
22877
22707
  init_profile();
22878
22708
  init_useLayoutDataStore();
22879
- init_useLayoutStore();
22880
22709
  init_nickname_fingerprint();
22881
22710
  init_utils();
22711
+ init_Expandable2();
22882
22712
  init_Onboarding();
22883
22713
  init_button();
22884
22714
  init_highlight();
22885
- init_onboarding_setup7();
22715
+ }
22716
+ });
22717
+
22718
+ // src/internal/components/ReceiveMenu/onboarding.setup.ts
22719
+ var RECEIVE_MENU_TOUR;
22720
+ var init_onboarding_setup7 = __esm({
22721
+ "src/internal/components/ReceiveMenu/onboarding.setup.ts"() {
22722
+ init_constants();
22723
+ RECEIVE_MENU_TOUR = [
22724
+ {
22725
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"receive" /* RECEIVE */}`,
22726
+ title: "passport:receiveMenu.onboarding.receiveMenu.title",
22727
+ description: "passport:receiveMenu.onboarding.receiveMenu.description"
22728
+ }
22729
+ ];
22886
22730
  }
22887
22731
  });
22888
22732
 
@@ -22898,9 +22742,10 @@ var init_ReceiveMenu2 = __esm({
22898
22742
  var SECURITY_MENU_TOUR;
22899
22743
  var init_onboarding_setup8 = __esm({
22900
22744
  "src/internal/components/SecurityMenu/onboarding.setup.ts"() {
22745
+ init_constants();
22901
22746
  SECURITY_MENU_TOUR = [
22902
22747
  {
22903
- elId: "embarkai-security-menu-onboarding" /* securityMenu */,
22748
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"security" /* SECURITY */}`,
22904
22749
  title: "passport:securityMenu.onboarding.securityMenu.title",
22905
22750
  description: "passport:securityMenu.onboarding.securityMenu.description"
22906
22751
  },
@@ -23513,53 +23358,40 @@ import { ArrowLeft as ArrowLeft19 } from "lucide-react";
23513
23358
  import { Fragment as Fragment36, jsx as jsx102, jsxs as jsxs94 } from "react/jsx-runtime";
23514
23359
  function SecurityMenu() {
23515
23360
  const { t } = useT();
23516
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
23517
23361
  const appToUntrust = useSecurityStore((st) => st.appToUntrust);
23518
23362
  useOnboardingTourAvailable(!appToUntrust);
23519
- return /* @__PURE__ */ jsx102(
23520
- "div",
23521
- {
23522
- ref: (inst) => onboarder.registerElement("embarkai-security-menu-onboarding" /* securityMenu */, inst),
23523
- style: {
23524
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
23525
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
23526
- },
23527
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
23528
- children: /* @__PURE__ */ jsxs94(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
23529
- /* @__PURE__ */ jsxs94("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
23530
- /* @__PURE__ */ jsx102(
23531
- Button,
23532
- {
23533
- variant: "ghost",
23534
- size: "icon",
23535
- title: t("passport:common.back"),
23536
- onClick: () => {
23537
- const { appToUntrust: appToUntrust2, untrustApp } = useSecurityStore.getState();
23538
- if (!!appToUntrust2) {
23539
- untrustApp(null);
23540
- } else {
23541
- useLayoutDataStore.getState().setPage("settings" /* SETTINGS */);
23542
- }
23543
- },
23544
- children: /* @__PURE__ */ jsx102(ArrowLeft19, { className: "h-4 w-4" })
23363
+ return /* @__PURE__ */ jsxs94(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
23364
+ /* @__PURE__ */ jsxs94("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
23365
+ /* @__PURE__ */ jsx102(
23366
+ Button,
23367
+ {
23368
+ variant: "ghost",
23369
+ size: "icon",
23370
+ title: t("passport:common.back"),
23371
+ onClick: () => {
23372
+ const { appToUntrust: appToUntrust2, untrustApp } = useSecurityStore.getState();
23373
+ if (!!appToUntrust2) {
23374
+ untrustApp(null);
23375
+ } else {
23376
+ useLayoutDataStore.getState().setPage("settings" /* SETTINGS */);
23545
23377
  }
23546
- ),
23547
- /* @__PURE__ */ jsx102("span", { className: "text-xl font-semibold", children: t("passport:securityMenu.title") })
23548
- ] }),
23549
- appToUntrust && /* @__PURE__ */ jsx102(UntrustApplication, {}),
23550
- !appToUntrust && /* @__PURE__ */ jsxs94(Fragment36, { children: [
23551
- /* @__PURE__ */ jsx102(Keyshare, {}),
23552
- /* @__PURE__ */ jsx102(ConnectedApps, {})
23553
- ] })
23554
- ] })
23555
- }
23556
- );
23378
+ },
23379
+ children: /* @__PURE__ */ jsx102(ArrowLeft19, { className: "h-4 w-4" })
23380
+ }
23381
+ ),
23382
+ /* @__PURE__ */ jsx102("span", { className: "text-xl font-semibold", children: t("passport:securityMenu.title") })
23383
+ ] }),
23384
+ appToUntrust && /* @__PURE__ */ jsx102(UntrustApplication, {}),
23385
+ !appToUntrust && /* @__PURE__ */ jsxs94(Fragment36, { children: [
23386
+ /* @__PURE__ */ jsx102(Keyshare, {}),
23387
+ /* @__PURE__ */ jsx102(ConnectedApps, {})
23388
+ ] })
23389
+ ] });
23557
23390
  }
23558
23391
  var init_SecurityMenu = __esm({
23559
23392
  "src/internal/components/SecurityMenu/SecurityMenu.tsx"() {
23560
23393
  init_i18n();
23561
23394
  init_useLayoutDataStore();
23562
- init_useLayoutStore();
23563
23395
  init_Expandable2();
23564
23396
  init_Onboarding();
23565
23397
  init_button();
@@ -24609,6 +24441,7 @@ var init_useSendStore = __esm({
24609
24441
  var TOUR_SEND_ASSET, TOUR_BRIDGE_QUOTE, SEND_MENU_TOUR, BRIDGE_MENU_TOUR;
24610
24442
  var init_onboarding_setup9 = __esm({
24611
24443
  "src/internal/components/SendMenu/onboarding.setup.ts"() {
24444
+ init_constants();
24612
24445
  init_useBridgeStore();
24613
24446
  init_useSendStore();
24614
24447
  TOUR_SEND_ASSET = {
@@ -24628,7 +24461,7 @@ var init_onboarding_setup9 = __esm({
24628
24461
  };
24629
24462
  SEND_MENU_TOUR = [
24630
24463
  {
24631
- elId: "sendmenu-page" /* sendMenu */,
24464
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"send" /* SEND */}`,
24632
24465
  title: "passport:sendMenu.onboarding.sendMenu.title",
24633
24466
  description: "passport:sendMenu.onboarding.sendMenu.description",
24634
24467
  waitSecs: 4,
@@ -24657,7 +24490,7 @@ var init_onboarding_setup9 = __esm({
24657
24490
  ];
24658
24491
  BRIDGE_MENU_TOUR = [
24659
24492
  {
24660
- elId: "sendmenu-page" /* sendMenu */,
24493
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"send" /* SEND */}`,
24661
24494
  title: "passport:bridgeMenu.onboarding.bridgeMenu.title",
24662
24495
  description: "passport:bridgeMenu.onboarding.bridgeMenu.description",
24663
24496
  waitSecs: 5
@@ -27306,7 +27139,6 @@ function SendFlowSelector() {
27306
27139
  const { t } = useT();
27307
27140
  const { config } = useProviderConfig();
27308
27141
  useSendMenuParams();
27309
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
27310
27142
  const selectorFlow = useFlowSelectorStore((st) => st.flow);
27311
27143
  const menuTitle = useFlowSelectorStore((st) => st.menuTitle);
27312
27144
  const isUiLocked = useFlowSelectorStore((st) => st.isUiLocked);
@@ -27331,81 +27163,69 @@ function SendFlowSelector() {
27331
27163
  }, []);
27332
27164
  const isSendFlowInitialState = selectorFlow === "send" && sendStep === "input" || selectorFlow === "bridge" && bridgeStep === "select";
27333
27165
  const isFlowSelectorButtonsShown = !!config?.current?.features?.showAssetBridge && isSendFlowInitialState;
27334
- return /* @__PURE__ */ jsx120(
27335
- "div",
27336
- {
27337
- ref: (inst) => onboarder.registerElement("sendmenu-page" /* sendMenu */, inst),
27338
- style: {
27339
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
27340
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
27341
- },
27342
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
27343
- children: /* @__PURE__ */ jsxs109(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
27344
- /* @__PURE__ */ jsxs109("div", { className: "flex items-center justify-between", children: [
27345
- /* @__PURE__ */ jsxs109("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
27346
- /* @__PURE__ */ jsx120(
27347
- Button,
27348
- {
27349
- variant: "ghost",
27350
- size: "icon",
27351
- disabled: isUiLocked,
27352
- onClick: () => {
27353
- useFlowSelectorStore.getState().setError(null);
27354
- const { setPage } = useLayoutDataStore.getState();
27355
- if (selectorFlow === "bridge") {
27356
- const { bridgeStep: bridgeStep2, setBridgeStep } = useBridgeStore.getState();
27357
- switch (bridgeStep2) {
27358
- case "select":
27359
- return setPage("main-menu" /* MAIN_MENU */);
27360
- // case ''
27361
- case "tx-history-details":
27362
- return setBridgeStep("tx-history");
27363
- default:
27364
- return setBridgeStep("select");
27365
- }
27366
- }
27367
- if (selectorFlow === "send") {
27368
- const { txStep, setTxStep } = useSendStore.getState();
27369
- switch (txStep) {
27370
- case "input":
27371
- return setPage("main-menu" /* MAIN_MENU */);
27372
- default:
27373
- return setTxStep("input");
27374
- }
27375
- }
27376
- },
27377
- children: /* @__PURE__ */ jsx120(ArrowLeft20, { className: "h-4 w-4" })
27166
+ return /* @__PURE__ */ jsxs109(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
27167
+ /* @__PURE__ */ jsxs109("div", { className: "flex items-center justify-between", children: [
27168
+ /* @__PURE__ */ jsxs109("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
27169
+ /* @__PURE__ */ jsx120(
27170
+ Button,
27171
+ {
27172
+ variant: "ghost",
27173
+ size: "icon",
27174
+ disabled: isUiLocked,
27175
+ onClick: () => {
27176
+ useFlowSelectorStore.getState().setError(null);
27177
+ const { setPage } = useLayoutDataStore.getState();
27178
+ if (selectorFlow === "bridge") {
27179
+ const { bridgeStep: bridgeStep2, setBridgeStep } = useBridgeStore.getState();
27180
+ switch (bridgeStep2) {
27181
+ case "select":
27182
+ return setPage("main-menu" /* MAIN_MENU */);
27183
+ // case ''
27184
+ case "tx-history-details":
27185
+ return setBridgeStep("tx-history");
27186
+ default:
27187
+ return setBridgeStep("select");
27188
+ }
27378
27189
  }
27379
- ),
27380
- /* @__PURE__ */ jsx120("span", { className: "text-xl font-semibold", children: menuTitle })
27381
- ] }),
27382
- /* @__PURE__ */ jsx120("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: /* @__PURE__ */ jsx120(BridgeHistorySwitch, {}) })
27383
- ] }),
27384
- isFlowSelectorButtonsShown && /* @__PURE__ */ jsx120(SelectorFlowButtons, {}),
27385
- availableFlows[selectorFlow],
27386
- sendOrBridgeError && /* @__PURE__ */ jsxs109(Highlight, { type: "error", className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
27387
- /* @__PURE__ */ jsx120("span", { children: sendOrBridgeError }),
27388
- /* @__PURE__ */ jsx120(
27389
- Button,
27390
- {
27391
- variant: "default",
27392
- size: "medium",
27393
- className: "w-full",
27394
- onClick: () => useFlowSelectorStore.getState().setError(null),
27395
- children: t("passport:common.hide")
27396
- }
27397
- )
27398
- ] })
27399
- ] })
27400
- }
27401
- );
27190
+ if (selectorFlow === "send") {
27191
+ const { txStep, setTxStep } = useSendStore.getState();
27192
+ switch (txStep) {
27193
+ case "input":
27194
+ return setPage("main-menu" /* MAIN_MENU */);
27195
+ default:
27196
+ return setTxStep("input");
27197
+ }
27198
+ }
27199
+ },
27200
+ children: /* @__PURE__ */ jsx120(ArrowLeft20, { className: "h-4 w-4" })
27201
+ }
27202
+ ),
27203
+ /* @__PURE__ */ jsx120("span", { className: "text-xl font-semibold", children: menuTitle })
27204
+ ] }),
27205
+ /* @__PURE__ */ jsx120("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: /* @__PURE__ */ jsx120(BridgeHistorySwitch, {}) })
27206
+ ] }),
27207
+ isFlowSelectorButtonsShown && /* @__PURE__ */ jsx120(SelectorFlowButtons, {}),
27208
+ availableFlows[selectorFlow],
27209
+ sendOrBridgeError && /* @__PURE__ */ jsxs109(Highlight, { type: "error", className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
27210
+ /* @__PURE__ */ jsx120("span", { children: sendOrBridgeError }),
27211
+ /* @__PURE__ */ jsx120(
27212
+ Button,
27213
+ {
27214
+ variant: "default",
27215
+ size: "medium",
27216
+ className: "w-full",
27217
+ onClick: () => useFlowSelectorStore.getState().setError(null),
27218
+ children: t("passport:common.hide")
27219
+ }
27220
+ )
27221
+ ] })
27222
+ ] });
27402
27223
  }
27403
27224
  var init_SendFlowSelector = __esm({
27404
27225
  "src/internal/components/SendMenu/SendFlowSelector.tsx"() {
27405
27226
  init_ProviderContext();
27406
27227
  init_i18n();
27407
27228
  init_useLayoutDataStore();
27408
- init_useLayoutStore();
27409
27229
  init_utils();
27410
27230
  init_Expandable2();
27411
27231
  init_Onboarding();
@@ -28085,20 +27905,6 @@ var init_api4 = __esm({
28085
27905
  }
28086
27906
  });
28087
27907
 
28088
- // src/internal/components/TransactionsMenu/onboarding.setup.ts
28089
- var TRANSACTIONS_MENU_TOUR;
28090
- var init_onboarding_setup10 = __esm({
28091
- "src/internal/components/TransactionsMenu/onboarding.setup.ts"() {
28092
- TRANSACTIONS_MENU_TOUR = [
28093
- {
28094
- elId: "embarkai-transactions-menu-onboarding" /* transactionsMenu */,
28095
- title: "passport:transactionsMenu.onboarding.transactionsMenu.title",
28096
- description: "passport:transactionsMenu.onboarding.transactionsMenu.description"
28097
- }
28098
- ];
28099
- }
28100
- });
28101
-
28102
27908
  // src/internal/components/TransactionsMenu/utils.ts
28103
27909
  function formatIntl(price, fractionDigits) {
28104
27910
  const formatter = Intl.NumberFormat("en-US", {
@@ -28300,7 +28106,6 @@ function TransactionsMenu() {
28300
28106
  const { t } = useT();
28301
28107
  useOnboardingTourAvailable(true);
28302
28108
  const setPage = useLayoutDataStore((st) => st.setPage);
28303
- const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
28304
28109
  const [expandedGroups, setExpandedGroups] = useState28({});
28305
28110
  const historySupported = isTransactionHistorySupported(chainConfig?.id);
28306
28111
  const {
@@ -28319,57 +28124,45 @@ function TransactionsMenu() {
28319
28124
  [qc, chainConfig.id, address]
28320
28125
  );
28321
28126
  const txHistoryResolvedError = txHistoryError ? txHistoryError instanceof Error ? txHistoryError.message : "Failed to load transactions" : null;
28322
- return /* @__PURE__ */ jsx122(
28323
- "div",
28324
- {
28325
- ref: (inst) => onboarder.registerElement("embarkai-transactions-menu-onboarding" /* transactionsMenu */, inst),
28326
- style: {
28327
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
28328
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
28127
+ return /* @__PURE__ */ jsxs111(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
28128
+ /* @__PURE__ */ jsxs111("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
28129
+ /* @__PURE__ */ jsx122(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ jsx122(ArrowLeft21, { className: "h-4 w-4" }) }),
28130
+ /* @__PURE__ */ jsx122("span", { className: "text-xl font-semibold", children: t("passport:transactionsMenu.title") }),
28131
+ historySupported && /* @__PURE__ */ jsx122(
28132
+ Button,
28133
+ {
28134
+ variant: "ghost",
28135
+ size: "icon",
28136
+ onClick: refreshTxHistory,
28137
+ disabled: isTxHistoryFetching,
28138
+ title: "Refresh transactions",
28139
+ children: isTxHistoryFetching ? /* @__PURE__ */ jsx122(Loader28, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx122(RefreshCw3, { className: "h-4 w-4" })
28140
+ }
28141
+ )
28142
+ ] }),
28143
+ !historySupported && /* @__PURE__ */ jsx122(Highlight, { type: "warning", children: /* @__PURE__ */ jsx122("span", { children: t("passport:transactionsMenu.comingSoon") }) }),
28144
+ historySupported && isTxHistoryLoading && /* @__PURE__ */ jsx122("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx122(Loader28, { className: "w-4 h-4 animate-spin" }) }),
28145
+ historySupported && !isTxHistoryLoading && !txHistoryResolvedError && txHistoryGroups.length === 0 && /* @__PURE__ */ jsx122(Highlight, { type: "info", children: /* @__PURE__ */ jsx122("span", { children: t("passport:transactionsMenu.noTransactions") }) }),
28146
+ historySupported && !isTxHistoryLoading && txHistoryResolvedError && /* @__PURE__ */ jsxs111(Highlight, { type: "error", className: "flex gap-[var(--ui-kit-gap)]", children: [
28147
+ /* @__PURE__ */ jsx122(XCircle, { className: "w-4 h-4 flex-none" }),
28148
+ /* @__PURE__ */ jsx122("span", { className: "block w-full flex-1 text-center text-xs", children: txHistoryResolvedError })
28149
+ ] }),
28150
+ historySupported && !isTxHistoryLoading && !txHistoryResolvedError && txHistoryGroups.length > 0 && /* @__PURE__ */ jsx122("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: txHistoryGroups.map((group) => /* @__PURE__ */ jsx122(
28151
+ TransactionsGroup,
28152
+ {
28153
+ group,
28154
+ expanded: expandedGroups[group.id] ?? false,
28155
+ onToggleExpanded: (groupId) => setExpandedGroups((prev) => ({ ...prev, [groupId]: !prev[groupId] }))
28329
28156
  },
28330
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
28331
- children: /* @__PURE__ */ jsxs111(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: [
28332
- /* @__PURE__ */ jsxs111("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
28333
- /* @__PURE__ */ jsx122(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ jsx122(ArrowLeft21, { className: "h-4 w-4" }) }),
28334
- /* @__PURE__ */ jsx122("span", { className: "text-xl font-semibold", children: t("passport:transactionsMenu.title") }),
28335
- historySupported && /* @__PURE__ */ jsx122(
28336
- Button,
28337
- {
28338
- variant: "ghost",
28339
- size: "icon",
28340
- onClick: refreshTxHistory,
28341
- disabled: isTxHistoryFetching,
28342
- title: "Refresh transactions",
28343
- children: isTxHistoryFetching ? /* @__PURE__ */ jsx122(Loader28, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx122(RefreshCw3, { className: "h-4 w-4" })
28344
- }
28345
- )
28346
- ] }),
28347
- !historySupported && /* @__PURE__ */ jsx122(Highlight, { type: "warning", children: /* @__PURE__ */ jsx122("span", { children: t("passport:transactionsMenu.comingSoon") }) }),
28348
- historySupported && isTxHistoryLoading && /* @__PURE__ */ jsx122("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx122(Loader28, { className: "w-4 h-4 animate-spin" }) }),
28349
- historySupported && !isTxHistoryLoading && !txHistoryResolvedError && txHistoryGroups.length === 0 && /* @__PURE__ */ jsx122(Highlight, { type: "info", children: /* @__PURE__ */ jsx122("span", { children: t("passport:transactionsMenu.noTransactions") }) }),
28350
- historySupported && !isTxHistoryLoading && txHistoryResolvedError && /* @__PURE__ */ jsxs111(Highlight, { type: "error", className: "flex gap-[var(--ui-kit-gap)]", children: [
28351
- /* @__PURE__ */ jsx122(XCircle, { className: "w-4 h-4 flex-none" }),
28352
- /* @__PURE__ */ jsx122("span", { className: "block w-full flex-1 text-center text-xs", children: txHistoryResolvedError })
28353
- ] }),
28354
- historySupported && !isTxHistoryLoading && !txHistoryResolvedError && txHistoryGroups.length > 0 && /* @__PURE__ */ jsx122("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: txHistoryGroups.map((group) => /* @__PURE__ */ jsx122(
28355
- TransactionsGroup,
28356
- {
28357
- group,
28358
- expanded: expandedGroups[group.id] ?? false,
28359
- onToggleExpanded: (groupId) => setExpandedGroups((prev) => ({ ...prev, [groupId]: !prev[groupId] }))
28360
- },
28361
- group.id
28362
- )) })
28363
- ] })
28364
- }
28365
- );
28157
+ group.id
28158
+ )) })
28159
+ ] });
28366
28160
  }
28367
28161
  var init_TransactionsMenu = __esm({
28368
28162
  "src/internal/components/TransactionsMenu/TransactionsMenu.tsx"() {
28369
28163
  init_SessionContext();
28370
28164
  init_i18n();
28371
28165
  init_useLayoutDataStore();
28372
- init_useLayoutStore();
28373
28166
  init_Expandable2();
28374
28167
  init_Onboarding();
28375
28168
  init_button();
@@ -28380,6 +28173,21 @@ var init_TransactionsMenu = __esm({
28380
28173
  }
28381
28174
  });
28382
28175
 
28176
+ // src/internal/components/TransactionsMenu/onboarding.setup.ts
28177
+ var TRANSACTIONS_MENU_TOUR;
28178
+ var init_onboarding_setup10 = __esm({
28179
+ "src/internal/components/TransactionsMenu/onboarding.setup.ts"() {
28180
+ init_constants();
28181
+ TRANSACTIONS_MENU_TOUR = [
28182
+ {
28183
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"transactions" /* TRANSACTIONS */}`,
28184
+ title: "passport:transactionsMenu.onboarding.transactionsMenu.title",
28185
+ description: "passport:transactionsMenu.onboarding.transactionsMenu.description"
28186
+ }
28187
+ ];
28188
+ }
28189
+ });
28190
+
28383
28191
  // src/internal/components/TransactionsMenu/index.ts
28384
28192
  var init_TransactionsMenu2 = __esm({
28385
28193
  "src/internal/components/TransactionsMenu/index.ts"() {
@@ -28407,21 +28215,6 @@ var init_constants8 = __esm({
28407
28215
  }
28408
28216
  });
28409
28217
 
28410
- // src/internal/components/SettingsMenu/onboarding.setup.ts
28411
- var SETTINGS_MENU_ONBOARDING_ID, SETTINGS_MENU_TOUR;
28412
- var init_onboarding_setup11 = __esm({
28413
- "src/internal/components/SettingsMenu/onboarding.setup.ts"() {
28414
- SETTINGS_MENU_ONBOARDING_ID = "embarkai-settings-menu-onboarding";
28415
- SETTINGS_MENU_TOUR = [
28416
- {
28417
- elId: SETTINGS_MENU_ONBOARDING_ID,
28418
- title: "passport:common.onboarding.settingsMenu.title",
28419
- description: "passport:common.onboarding.settingsMenu.description"
28420
- }
28421
- ];
28422
- }
28423
- });
28424
-
28425
28218
  // src/internal/components/SettingsMenu/SettingsMenu.tsx
28426
28219
  import { useQuery as useQuery27 } from "@tanstack/react-query";
28427
28220
  import { ArrowLeft as ArrowLeft22, HardDrive as HardDrive3 } from "lucide-react";
@@ -28478,41 +28271,30 @@ function SettingsMenu() {
28478
28271
  queryFn: getNicknameInfo
28479
28272
  });
28480
28273
  const highlightedKeys = settingsNotifications.map((n) => n.target);
28481
- return /* @__PURE__ */ jsxs112(
28482
- "div",
28483
- {
28484
- ref: (inst) => onboarder.registerElement(SETTINGS_MENU_ONBOARDING_ID, inst),
28485
- style: {
28486
- "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
28487
- "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
28274
+ return /* @__PURE__ */ jsxs112(Expandable, { isExpanded: true, contentClassName: "flex flex-col gap-[var(--ui-kit-gap)]", children: [
28275
+ /* @__PURE__ */ jsxs112("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
28276
+ /* @__PURE__ */ jsx123(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ jsx123(ArrowLeft22, { className: "h-4 w-4" }) }),
28277
+ /* @__PURE__ */ jsx123("span", { className: "text-xl font-semibold", children: t("passport:common.settings") })
28278
+ ] }),
28279
+ /* @__PURE__ */ jsx123("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: settingsButtons.map((el) => ({ ...el, onClick: () => setPage(el.id) })).map(({ id, name, Icon: Icon2, onClick }) => /* @__PURE__ */ jsxs112(
28280
+ Button,
28281
+ {
28282
+ variant: "secondary",
28283
+ size: "large",
28284
+ onClick,
28285
+ disabled: !address,
28286
+ className: cn2(
28287
+ "w-full items-center justify-start",
28288
+ highlightedKeys.includes(id) && "animate-glow-warning"
28289
+ ),
28290
+ children: [
28291
+ /* @__PURE__ */ jsx123(Icon2, { className: "w-4 h-4" }),
28292
+ /* @__PURE__ */ jsx123("span", { children: t(name) })
28293
+ ]
28488
28294
  },
28489
- className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)] flex flex-col gap-[var(--ui-kit-gap)]",
28490
- children: [
28491
- /* @__PURE__ */ jsxs112("div", { className: "flex items-center gap-[var(--ui-kit-gap)]", children: [
28492
- /* @__PURE__ */ jsx123(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ jsx123(ArrowLeft22, { className: "h-4 w-4" }) }),
28493
- /* @__PURE__ */ jsx123("span", { className: "text-xl font-semibold", children: t("passport:common.settings") })
28494
- ] }),
28495
- /* @__PURE__ */ jsx123("div", { className: "w-full flex flex-col gap-[var(--ui-kit-gap)]", children: settingsButtons.map((el) => ({ ...el, onClick: () => setPage(el.id) })).map(({ id, name, Icon: Icon2, onClick }) => /* @__PURE__ */ jsxs112(
28496
- Button,
28497
- {
28498
- variant: "secondary",
28499
- size: "large",
28500
- onClick,
28501
- disabled: !address,
28502
- className: cn2(
28503
- "w-full items-center justify-start",
28504
- highlightedKeys.includes(id) && "animate-glow-warning"
28505
- ),
28506
- children: [
28507
- /* @__PURE__ */ jsx123(Icon2, { className: "w-4 h-4" }),
28508
- /* @__PURE__ */ jsx123("span", { children: t(name) })
28509
- ]
28510
- },
28511
- id
28512
- )) })
28513
- ]
28514
- }
28515
- );
28295
+ id
28296
+ )) })
28297
+ ] });
28516
28298
  }
28517
28299
  var init_SettingsMenu = __esm({
28518
28300
  "src/internal/components/SettingsMenu/SettingsMenu.tsx"() {
@@ -28525,12 +28307,27 @@ var init_SettingsMenu = __esm({
28525
28307
  init_useLayoutStore();
28526
28308
  init_pro_mode();
28527
28309
  init_utils();
28310
+ init_Expandable2();
28528
28311
  init_useProvidersList();
28529
28312
  init_Onboarding();
28530
28313
  init_TransactionsMenu2();
28531
28314
  init_button();
28532
28315
  init_constants8();
28533
- init_onboarding_setup11();
28316
+ }
28317
+ });
28318
+
28319
+ // src/internal/components/SettingsMenu/onboarding.setup.ts
28320
+ var SETTINGS_MENU_TOUR;
28321
+ var init_onboarding_setup11 = __esm({
28322
+ "src/internal/components/SettingsMenu/onboarding.setup.ts"() {
28323
+ init_constants();
28324
+ SETTINGS_MENU_TOUR = [
28325
+ {
28326
+ elId: `${EMBARKAI_DIALOG_ONBOARDING_ID}-${"settings" /* SETTINGS */}`,
28327
+ title: "passport:common.onboarding.settingsMenu.title",
28328
+ description: "passport:common.onboarding.settingsMenu.description"
28329
+ }
28330
+ ];
28534
28331
  }
28535
28332
  });
28536
28333
 
@@ -28756,35 +28553,25 @@ import { useCallback as useCallback31, useEffect as useEffect50 } from "react";
28756
28553
  import { jsx as jsx125 } from "react/jsx-runtime";
28757
28554
  function usePageMapper() {
28758
28555
  const page = useLayoutDataStore((st) => st.page);
28759
- const {
28760
- setDialogTitle,
28761
- setDialogDescription,
28762
- setIsDialogForced,
28763
- setDialogContent,
28764
- setIsDialogOpen,
28765
- setIsDialogClosing
28766
- } = useLayoutStore();
28767
28556
  const closeDialog = useCallback31(() => {
28768
- setIsDialogClosing(true);
28557
+ useLayoutStore.setState({ isDialogAnimating: true });
28769
28558
  setTimeout(() => {
28770
- setDialogContent(null);
28771
- setDialogDescription(null);
28772
- setDialogTitle(null);
28773
- setIsDialogForced(false);
28774
- setIsDialogClosing(false);
28775
- setIsDialogOpen(false);
28559
+ useLayoutStore.setState({
28560
+ dialogContent: null,
28561
+ isDialogAnimating: false,
28562
+ isDialogOpen: false,
28563
+ isDialogForced: false
28564
+ // closing via page === null should reset forced state
28565
+ });
28776
28566
  }, CLEAR_DIALOG_TIMEOUT);
28777
- }, [setDialogContent, setDialogDescription, setDialogTitle, setIsDialogForced, setIsDialogOpen, setIsDialogClosing]);
28778
- const openDialog = useCallback31(
28779
- (pageItem) => {
28780
- const PageContentComponent = pageItem.component;
28781
- setDialogTitle(pageItem.title);
28782
- setDialogDescription(pageItem.description);
28783
- setDialogContent(/* @__PURE__ */ jsx125(PageContentComponent, {}));
28784
- setIsDialogOpen(true);
28785
- },
28786
- [setDialogContent, setDialogDescription, setDialogTitle, setIsDialogOpen]
28787
- );
28567
+ }, []);
28568
+ const openDialog = useCallback31((pageItem) => {
28569
+ useLayoutStore.setState({
28570
+ dialogContent: /* @__PURE__ */ jsx125(pageItem.component, {}),
28571
+ isDialogOpen: true
28572
+ // isDialogAnimating: true
28573
+ });
28574
+ }, []);
28788
28575
  useEffect50(() => {
28789
28576
  if (page === null) return closeDialog();
28790
28577
  const pageItem = PAGE_MAP[page];
@@ -28853,7 +28640,7 @@ var init_package = __esm({
28853
28640
  "package.json"() {
28854
28641
  package_default = {
28855
28642
  name: "@embarkai/ui-kit",
28856
- version: "0.4.93",
28643
+ version: "0.4.95",
28857
28644
  description: "React UI components and hooks for EmbarkAI authentication and Account Abstraction",
28858
28645
  type: "module",
28859
28646
  main: "./dist/index.cjs",
@@ -28942,9 +28729,12 @@ var init_package = __esm({
28942
28729
  },
28943
28730
  repository: {
28944
28731
  type: "git",
28945
- url: "https://github.com/lumiachain/lumia-passport-sdk",
28946
- directory: "packages/ui-kit"
28732
+ url: "https://github.com/embark-ai/ui-kit.git"
28733
+ },
28734
+ bugs: {
28735
+ url: "https://github.com/embark-ai/ui-kit/issues"
28947
28736
  },
28737
+ homepage: "https://github.com/embark-ai/ui-kit#readme",
28948
28738
  publishConfig: {
28949
28739
  access: "public"
28950
28740
  }
@@ -29116,9 +28906,9 @@ var init_Footer2 = __esm({
29116
28906
  var EMBARKAI_HEADER_ONBOARDING_ID, EMBARKAI_HEADER_TOUR_BUTTON_ID, ONBOARDING_TOURS;
29117
28907
  var init_onborading_setup = __esm({
29118
28908
  "src/internal/components/Header/onborading.setup.ts"() {
28909
+ init_constants();
29119
28910
  init_BuyMenu2();
29120
28911
  init_ChainsMenu2();
29121
- init_Dialog2();
29122
28912
  init_Footer2();
29123
28913
  init_KeyshareRestoreMenu2();
29124
28914
  init_MainMenu2();
@@ -29333,7 +29123,7 @@ import { forwardRef as forwardRef6 } from "react";
29333
29123
  import { jsx as jsx128, jsxs as jsxs116 } from "react/jsx-runtime";
29334
29124
  function useDecideContentStyles() {
29335
29125
  const isMobileView = useLayoutStore((st) => st.isMobileView);
29336
- const isClosing = useLayoutStore((st) => !!st.isDialogOpen && !!st.isDialogClosing);
29126
+ const isClosing = useLayoutStore((st) => !!st.isDialogOpen && !!st.isDialogAnimating);
29337
29127
  const mobileStyles = isMobileView ? { "--ui-kit-bdrs": "20px 20px 0px 0px" } : {};
29338
29128
  return {
29339
29129
  isClosing,
@@ -29517,12 +29307,10 @@ function Dialog2() {
29517
29307
  const className = config.current?.ui?.dialogClassName;
29518
29308
  const session = useSession((st) => st.session);
29519
29309
  const hasServerVault = useSession((st) => st.hasServerVault);
29310
+ const { colorMode, maxScrollHeight, isDialogOpen, dialogContent, isDialogForced } = useLayoutStore();
29520
29311
  const page = useLayoutDataStore((st) => st.page);
29521
29312
  const transitionPageHeight = useLayoutDataStore((st) => st.transitionPageHeight);
29522
- const setPage = useLayoutDataStore((st) => st.setPage);
29523
- const setPostAuthNavigation = useLayoutDataStore((st) => st.setPostAuthNavigation);
29524
- const { colorMode, isDialogOpen, dialogTitle, dialogDescription, dialogContent, isDialogForced, setIsSettings } = useLayoutStore();
29525
- useEffect52(() => setIsSettings(!!session), [session, setIsSettings]);
29313
+ useEffect52(() => useLayoutStore.setState({ isSettings: !!session }), [session]);
29526
29314
  usePageMapper();
29527
29315
  useAutoConnect();
29528
29316
  useBackupStatusChanges();
@@ -29537,6 +29325,7 @@ function Dialog2() {
29537
29325
  onOpenChange: (open) => {
29538
29326
  if (isDialogForced) return;
29539
29327
  if (!open) {
29328
+ const { setPostAuthNavigation, setPage } = useLayoutDataStore.getState();
29540
29329
  setPostAuthNavigation(null);
29541
29330
  setPage(null);
29542
29331
  }
@@ -29548,18 +29337,29 @@ function Dialog2() {
29548
29337
  colorMode,
29549
29338
  className,
29550
29339
  children: [
29551
- /* @__PURE__ */ jsx130(VisuallyHidden, { children: /* @__PURE__ */ jsx130(DialogTitle, { children: dialogTitle }) }),
29552
- /* @__PURE__ */ jsx130(DialogDescription, { className: "sr-only", children: dialogDescription }),
29340
+ /* @__PURE__ */ jsx130(VisuallyHidden, { children: /* @__PURE__ */ jsx130(DialogTitle, { children: "embarkAI" }) }),
29341
+ /* @__PURE__ */ jsx130(DialogDescription, { className: "sr-only", children: "embarkAI wallet" }),
29553
29342
  !isHeaderHidden && /* @__PURE__ */ jsx130(Header, {}),
29554
29343
  /* @__PURE__ */ jsx130(AnimatePresence, { mode: "wait", initial: false, children: /* @__PURE__ */ jsx130(
29555
29344
  motion.div,
29556
29345
  {
29346
+ style: { overflow: "hidden" },
29557
29347
  initial: { opacity: 0, height: transitionPageHeight },
29558
29348
  animate: { opacity: 1, height: "auto" },
29559
29349
  exit: { opacity: 0, height: transitionPageHeight },
29560
- style: { overflow: "hidden" },
29561
29350
  transition: Y_ANIMATION_SETUP,
29562
- children: dialogContent
29351
+ children: /* @__PURE__ */ jsx130(
29352
+ "div",
29353
+ {
29354
+ ref: (inst) => onboarder.registerElement(`${EMBARKAI_DIALOG_ONBOARDING_ID}-${page}`, inst),
29355
+ style: {
29356
+ "--ui-kit-scrollbar-mah": `${maxScrollHeight}px`,
29357
+ "--ui-kit-list-scrollbar-pd-r": "var(--ui-kit-pd)"
29358
+ },
29359
+ className: "list-scrollbar-y w-full p-[var(--ui-kit-pd)]",
29360
+ children: dialogContent
29361
+ }
29362
+ )
29563
29363
  },
29564
29364
  page || "empty"
29565
29365
  ) }),
@@ -29570,7 +29370,6 @@ function Dialog2() {
29570
29370
  }
29571
29371
  );
29572
29372
  }
29573
- var EMBARKAI_DIALOG_ONBOARDING_ID;
29574
29373
  var init_Dialog = __esm({
29575
29374
  "src/internal/components/Dialog/Dialog.tsx"() {
29576
29375
  init_ProviderContext();
@@ -29589,7 +29388,6 @@ var init_Dialog = __esm({
29589
29388
  init_Onboarding();
29590
29389
  init_dialog();
29591
29390
  init_visually_hidden();
29592
- EMBARKAI_DIALOG_ONBOARDING_ID = "embark-main-dialog-content";
29593
29391
  }
29594
29392
  });
29595
29393