@tatchi-xyz/sdk 0.21.0 → 0.31.1

package/dist/esm/react/components/AccountMenuButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["AccountMenuButtonInner: React.FC<AccountMenuButtonProps>","MENU_ITEMS: MenuItem[]","error: any","AccountMenuButton: React.FC<AccountMenuButtonProps>"],"sources":["../../../../../src/react/components/AccountMenuButton/index.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { KeyIcon } from './icons/KeyIcon';\nimport { ScanIcon } from './icons/ScanIcon';\nimport { LinkIcon } from './icons/LinkIcon';\nimport { SlidersIcon } from './icons/SlidersIcon';\nimport { SunIcon } from './icons/SunIcon';\nimport { MoonIcon } from './icons/MoonIcon';\nimport { UserAccountButton } from './UserAccountButton';\nimport { ProfileDropdown } from './ProfileDropdown';\nimport { useProfileState } from './hooks/useProfileState';\nimport { useTatchi } from '../../context';\nimport type { AccountMenuButtonProps, MenuItem } from './types';\nimport { PROFILE_MENU_ITEM_IDS } from './types';\nimport { QRCodeScanner } from '../QRCodeScanner';\nimport { LinkedDevicesModal } from './LinkedDevicesModal';\nimport './Web3AuthProfileButton.css';\nimport { Theme, useTheme } from '../theme';\nimport { AccountId, toAccountId } from '../../../core/types/accountIds';\n\n/**\n * Account Menu Button Component\n * Provides user settings, account management, and device linking.\n * **Important:** This component should be used inside a TatchiPasskey context.\n * Wrap your app with PasskeyProvider or ensure TatchiPasskey is available in context via useTatchi.\n *\n * @example\n * ```tsx\n * import { PasskeyProvider } from '@tatchi-xyz/sdk/react';\n * import { AccountMenuButton } from '@tatchi-xyz/sdk/react';\n *\n * function App() {\n *   return (\n *     <PasskeyProvider configs={passkeyConfigs}>\n *       <AccountMenuButton\n *         username=\"alice\"\n *         onLogout={() => console.log('User logged out')}\n *         deviceLinkingScannerParams={{\n *           onDeviceLinked: (result) => console.log('Device linked:', result),\n *           onError: (error) => console.error('Error:', error),\n *           onClose: () => console.log('Scanner closed'),\n *           onEvent: (event) => console.log('Event:', event),\n *           fundingAmount: '0.05'\n *         }}\n *       />\n *     </PasskeyProvider>\n *   );\n * }\n * ```\n */\nconst AccountMenuButtonInner: React.FC<AccountMenuButtonProps> = ({\n  nearAccountId: nearAccountIdProp,\n  nearExplorerBaseUrl = 'https://nearblocks.io',\n  username: usernameProp,\n  hideUsername = false,\n  onLogout: onLogout,\n  deviceLinkingScannerParams,\n  toggleColors,\n  style,\n  className,\n  portalTarget,\n  isMenuOpen,\n  onMenuOpenChange,\n  highlightedMenuItem,\n}) => {\n  // Get values from context if not provided as props\n  const {\n    loginState,\n    tatchi,\n    logout,\n  } = useTatchi();\n\n  // Use props if provided, otherwise fall back to context\n  const accountName = usernameProp || nearAccountIdProp?.split('.')?.[0] || loginState.nearAccountId?.split('.')?.[0] || 'User';\n  const loggedInAccountId = loginState.nearAccountId;\n  const nearAccountId = nearAccountIdProp || loggedInAccountId;\n\n  // Local state for modals/expanded sections\n  const [showQRScanner, setShowQRScanner] = useState(false);\n  const [showLinkedDevices, setShowLinkedDevices] = useState(false);\n  const [transactionSettingsOpen, setTransactionSettingsOpen] = useState(false);\n  const [currentConfirmConfig, setCurrentConfirmConfig] = useState<any>(null);\n\n  // State management\n  const {\n    isOpen,\n    refs,\n    handleToggle,\n    handleClose,\n  } = useProfileState({\n    open: typeof isMenuOpen === 'boolean' ? isMenuOpen : undefined,\n    onOpenChange: onMenuOpenChange,\n  });\n\n  // Read current theme from Theme context (falls back to system preference)\n  const { theme } = useTheme();\n\n  // Keep local view state in sync with SDK preferences (mirrors wallet host in iframe mode)\n  useEffect(() => {\n    if (!tatchi) return;\n    if (!loginState.isLoggedIn || !loggedInAccountId) {\n      setCurrentConfirmConfig(null);\n      return;\n    }\n\n    let cancelled = false;\n\n    if (AccountId.validate(loggedInAccountId).valid) {\n      tatchi.userPreferences.setCurrentUser(toAccountId(loggedInAccountId));\n    }\n    setCurrentConfirmConfig(tatchi.getConfirmationConfig());\n\n    const unsub = tatchi.userPreferences.onConfirmationConfigChange?.((cfg: any) => {\n      if (cancelled) return;\n      setCurrentConfirmConfig(cfg);\n    });\n\n    return () => {\n      cancelled = true;\n      unsub?.();\n    };\n  }, [tatchi, loginState.isLoggedIn, loggedInAccountId]);\n\n  // Handlers for transaction settings\n  const handleSetUiMode = (mode: 'skip' | 'modal' | 'drawer') => {\n    // Only patch the field we intend to change to avoid overwriting theme or other values\n    tatchi.setConfirmationConfig({ uiMode: mode } as any);\n  };\n\n  const handleToggleSkipClick = () => {\n    if (!currentConfirmConfig) return;\n    const newBehavior = currentConfirmConfig.behavior === 'requireClick' ? 'autoProceed' : 'requireClick';\n    tatchi.setConfirmBehavior(newBehavior);\n  };\n\n  const handleSetDelay = (delay: number) => {\n    // Only patch delay; avoid passing a stale theme from local state\n    tatchi.setConfirmationConfig({ autoProceedDelay: delay } as any);\n  };\n\n  const handleToggleTheme = () => {\n    // Determine next theme from current visible theme when possible\n    const newTheme = (theme === 'dark' ? 'light' : (theme === 'light' ? 'dark' : (currentConfirmConfig?.theme === 'dark' ? 'light' : 'dark')));\n    tatchi.setUserTheme(newTheme);\n    // Always show a quick pulse to acknowledge the press\n    if (typeof document !== 'undefined' && document.body) {\n      document.body.setAttribute('data-w3a-theme-pulse', '1');\n      window.setTimeout(() => {\n        document.body?.removeAttribute('data-w3a-theme-pulse');\n      }, 220);\n    }\n  };\n\n  // Menu items configuration with context-aware handlers\n  const MENU_ITEMS: MenuItem[] = useMemo(() => [\n    {\n      id: PROFILE_MENU_ITEM_IDS.EXPORT_KEYS,\n      icon: <KeyIcon />,\n      label: 'Export Keys',\n      description: 'View your private keys',\n      disabled: !loginState.isLoggedIn,\n      onClick: async () => {\n        try {\n          await tatchi.exportNearKeypairWithUI(nearAccountId!);\n        } catch (error: any) {\n          console.error('Key export failed:', error);\n          const msg = String(error?.message || 'Unknown error');\n          const friendly = /No user data found|No public key found/i.test(msg)\n            ? 'No local key material found for this account on this device. Please complete registration or recovery here first.'\n            : msg;\n          alert(`Key export failed: ${friendly}`);\n        }\n      },\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.SCAN_LINK_DEVICE,\n      icon: <ScanIcon />,\n      label: 'Scan and Link Device',\n      description: 'Scan QR to link a device',\n      disabled: !loginState.isLoggedIn,\n      onClick: () => {\n        setShowQRScanner(true);\n      },\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.LINKED_DEVICES,\n      icon: <LinkIcon />,\n      label: 'Linked Devices',\n      description: 'View linked devices',\n      disabled: !loginState.isLoggedIn,\n      onClick: () => setShowLinkedDevices(true),\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.TOGGLE_THEME,\n      icon: theme === 'dark' ? <SunIcon /> : <MoonIcon />,\n      label: 'Toggle Theme',\n      description: theme === 'dark' ? 'Dark Mode' : 'Light Mode',\n      disabled: false,\n      onClick: handleToggleTheme,\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.TRANSACTION_SETTINGS,\n      icon: <SlidersIcon />,\n      label: 'Transaction Settings',\n      description: 'Customize confirmation behavior',\n      disabled: !loginState.isLoggedIn,\n      onClick: () => setTransactionSettingsOpen((v) => !v),\n      keepOpenOnClick: true,\n    },\n  ], [tatchi, nearAccountId, loginState.isLoggedIn, theme, handleToggleTheme]);\n\n  const highlightedMenuItemId = highlightedMenuItem?.id;\n  const highlightShouldFocus = highlightedMenuItem?.focus ?? true;\n  const highlightedIndex = useMemo(() => {\n    if (!highlightedMenuItemId) return -1;\n    return MENU_ITEMS.findIndex((item) => item.id === highlightedMenuItemId);\n  }, [MENU_ITEMS, highlightedMenuItemId]);\n\n  useEffect(() => {\n    if (!isOpen || highlightedIndex < 0 || !highlightShouldFocus) return;\n    const el = refs.menuItemsRef.current?.[highlightedIndex];\n    if (!el) return;\n    const focusItem = () => {\n      if (typeof (el as any).focus === 'function') {\n        (el as any).focus();\n      }\n    };\n    if (typeof window === 'undefined') {\n      focusItem();\n      return;\n    }\n    const frame = window.requestAnimationFrame(focusItem);\n    return () => window.cancelAnimationFrame(frame);\n  }, [isOpen, highlightedIndex, highlightShouldFocus, refs.menuItemsRef]);\n\n  // Handlers\n  const handleLogout = () => {\n    logout();\n    onLogout?.();\n    handleClose();\n  };\n\n  return (\n    <div\n      ref={refs.buttonRef}\n      className={`w3a-profile-button-morphable ${isOpen ? 'open' : 'closed'}${className ? ` ${className}` : ''}`}\n      style={style}\n      data-state={isOpen ? 'open' : 'closed'}\n    >\n      <UserAccountButton\n        username={accountName}\n        hideUsername={hideUsername}\n        fullAccountId={nearAccountId || undefined}\n        isOpen={isOpen}\n        onClick={handleToggle}\n        nearExplorerBaseUrl={nearExplorerBaseUrl}\n        theme={theme}\n      />\n\n      {/* Visible menu structure for actual interaction */}\n      <ProfileDropdown\n        ref={refs.dropdownRef}\n        isOpen={isOpen}\n        menuItems={MENU_ITEMS}\n        onLogout={handleLogout}\n        onClose={handleClose}\n        menuItemsRef={refs.menuItemsRef}\n        toggleColors={toggleColors}\n        currentConfirmConfig={currentConfirmConfig}\n        onSetUiMode={handleSetUiMode}\n        onToggleSkipClick={handleToggleSkipClick}\n        onSetDelay={handleSetDelay}\n        onToggleTheme={handleToggleTheme}\n        transactionSettingsOpen={transactionSettingsOpen}\n        theme={theme}\n        highlightedMenuItemId={highlightedMenuItemId}\n      />\n\n      {/* QR Scanner Modal (portaled to nearest root for robustness) */}\n      {createPortal(\n        <QRCodeScanner\n          key=\"profile-qr-scanner\"\n          isOpen={showQRScanner}\n          fundingAmount={deviceLinkingScannerParams?.fundingAmount || '0.05'}\n          onDeviceLinked={(result) => {\n            deviceLinkingScannerParams?.onDeviceLinked?.(result);\n            setShowQRScanner(false);\n          }}\n          onError={(error) => {\n            deviceLinkingScannerParams?.onError?.(error);\n            setShowQRScanner(false);\n          }}\n          onClose={() => {\n            deviceLinkingScannerParams?.onClose?.();\n            setShowQRScanner(false);\n          }}\n          onEvent={(event) => deviceLinkingScannerParams?.onEvent?.(event)}\n        />, (portalTarget || document.body))}\n\n      {/* Linked Devices Modal (portaled to nearest root for robustness) */}\n      {createPortal(\n        <LinkedDevicesModal\n          nearAccountId={nearAccountId!}\n          isOpen={showLinkedDevices}\n          onClose={() => setShowLinkedDevices(false)}\n        />, (portalTarget || document.body))}\n    </div>\n  );\n};\n\nexport const AccountMenuButton: React.FC<AccountMenuButtonProps> = (props) => {\n  return (\n    <Theme>\n      <AccountMenuButtonInner {...props} />\n    </Theme>\n  );\n};\n\nexport const ProfileSettingsButton = AccountMenuButton;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["AccountMenuButtonInner: React.FC<AccountMenuButtonProps>","MENU_ITEMS: MenuItem[]","error: any","AccountMenuButton: React.FC<AccountMenuButtonProps>"],"sources":["../../../../../src/react/components/AccountMenuButton/index.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { KeyIcon } from './icons/KeyIcon';\nimport { ScanIcon } from './icons/ScanIcon';\nimport { LinkIcon } from './icons/LinkIcon';\nimport { SlidersIcon } from './icons/SlidersIcon';\nimport { SunIcon } from './icons/SunIcon';\nimport { MoonIcon } from './icons/MoonIcon';\nimport { UserAccountButton } from './UserAccountButton';\nimport { ProfileDropdown } from './ProfileDropdown';\nimport { useProfileState } from './hooks/useProfileState';\nimport { useTatchi } from '../../context';\nimport type { AccountMenuButtonProps, MenuItem } from './types';\nimport { PROFILE_MENU_ITEM_IDS } from './types';\nimport { QRCodeScanner } from '../QRCodeScanner';\nimport { LinkedDevicesModal } from './LinkedDevicesModal';\nimport './Web3AuthProfileButton.css';\nimport { Theme, useTheme } from '../theme';\nimport { AccountId, toAccountId } from '../../../core/types/accountIds';\nimport type { SignerMode } from '../../../core/types/signer-worker';\n\n/**\n * Account Menu Button Component\n * Provides user settings, account management, and device linking.\n * **Important:** This component should be used inside a TatchiPasskey context.\n * Wrap your app with PasskeyProvider or ensure TatchiPasskey is available in context via useTatchi.\n *\n * @example\n * ```tsx\n * import { PasskeyProvider } from '@tatchi-xyz/sdk/react';\n * import { AccountMenuButton } from '@tatchi-xyz/sdk/react';\n *\n * function App() {\n *   return (\n *     <PasskeyProvider configs={passkeyConfigs}>\n *       <AccountMenuButton\n *         username=\"alice\"\n *         onLogout={() => console.log('User logged out')}\n *         deviceLinkingScannerParams={{\n *           onDeviceLinked: (result) => console.log('Device linked:', result),\n *           onError: (error) => console.error('Error:', error),\n *           onClose: () => console.log('Scanner closed'),\n *           onEvent: (event) => console.log('Event:', event),\n *           fundingAmount: '0.05'\n *         }}\n *       />\n *     </PasskeyProvider>\n *   );\n * }\n * ```\n */\nconst AccountMenuButtonInner: React.FC<AccountMenuButtonProps> = ({\n  nearAccountId: nearAccountIdProp,\n  nearExplorerBaseUrl = 'https://nearblocks.io',\n  username: usernameProp,\n  hideUsername = false,\n  onLogout: onLogout,\n  deviceLinkingScannerParams,\n  toggleColors,\n  style,\n  className,\n  portalTarget,\n  isMenuOpen,\n  onMenuOpenChange,\n  highlightedMenuItem,\n}) => {\n  // Get values from context if not provided as props\n  const {\n    loginState,\n    tatchi,\n    logout,\n  } = useTatchi();\n\n  // Use props if provided, otherwise fall back to context\n  const accountName = usernameProp || nearAccountIdProp?.split('.')?.[0] || loginState.nearAccountId?.split('.')?.[0] || 'User';\n  const loggedInAccountId = loginState.nearAccountId;\n  const nearAccountId = nearAccountIdProp || loggedInAccountId;\n\n  // Local state for modals/expanded sections\n  const [showQRScanner, setShowQRScanner] = useState(false);\n  const [showLinkedDevices, setShowLinkedDevices] = useState(false);\n  const [transactionSettingsOpen, setTransactionSettingsOpen] = useState(false);\n  const [currentConfirmConfig, setCurrentConfirmConfig] = useState<any>(null);\n  const [currentSignerMode, setCurrentSignerMode] = useState<SignerMode | null>(null);\n  const lastThresholdSignerModeRef = useRef<SignerMode | null>(null);\n\n  // State management\n  const {\n    isOpen,\n    refs,\n    handleToggle,\n    handleClose,\n  } = useProfileState({\n    open: typeof isMenuOpen === 'boolean' ? isMenuOpen : undefined,\n    onOpenChange: onMenuOpenChange,\n  });\n\n  // Read current theme from Theme context (falls back to system preference)\n  const { theme } = useTheme();\n\n  // Keep local view state in sync with SDK preferences (mirrors wallet host in iframe mode)\n  useEffect(() => {\n    if (!tatchi) return;\n    if (!loginState.isLoggedIn || !loggedInAccountId) {\n      setCurrentConfirmConfig(null);\n      setCurrentSignerMode(null);\n      return;\n    }\n\n    let cancelled = false;\n\n    if (AccountId.validate(loggedInAccountId).valid) {\n      tatchi.userPreferences.setCurrentUser(toAccountId(loggedInAccountId));\n    }\n    setCurrentConfirmConfig(tatchi.getConfirmationConfig());\n    setCurrentSignerMode(tatchi.getSignerMode());\n\n    const unsubConfirmConfig = tatchi.userPreferences.onConfirmationConfigChange?.((cfg: any) => {\n      if (cancelled) return;\n      setCurrentConfirmConfig(cfg);\n    });\n    const unsubSignerMode = tatchi.userPreferences.onSignerModeChange?.((mode) => {\n      if (cancelled) return;\n      setCurrentSignerMode(mode);\n    });\n\n    return () => {\n      cancelled = true;\n      unsubConfirmConfig?.();\n      unsubSignerMode?.();\n    };\n  }, [tatchi, loginState.isLoggedIn, loggedInAccountId]);\n\n  useEffect(() => {\n    if (currentSignerMode?.mode === 'threshold-signer') {\n      lastThresholdSignerModeRef.current = currentSignerMode;\n    }\n  }, [currentSignerMode]);\n\n  // Handlers for transaction settings\n  const handleSetUiMode = (mode: 'skip' | 'modal' | 'drawer') => {\n    // Only patch the field we intend to change to avoid overwriting theme or other values\n    tatchi.setConfirmationConfig({ uiMode: mode } as any);\n  };\n\n  const handleToggleSkipClick = () => {\n    if (!currentConfirmConfig) return;\n    const newBehavior = currentConfirmConfig.behavior === 'requireClick' ? 'autoProceed' : 'requireClick';\n    tatchi.setConfirmBehavior(newBehavior);\n  };\n\n  const handleSetDelay = (delay: number) => {\n    // Only patch delay; avoid passing a stale theme from local state\n    tatchi.setConfirmationConfig({ autoProceedDelay: delay } as any);\n  };\n\n  const handleToggleTheme = () => {\n    // Determine next theme from current visible theme when possible\n    const newTheme = (theme === 'dark' ? 'light' : (theme === 'light' ? 'dark' : (currentConfirmConfig?.theme === 'dark' ? 'light' : 'dark')));\n    tatchi.setUserTheme(newTheme);\n    // Always show a quick pulse to acknowledge the press\n    if (typeof document !== 'undefined' && document.body) {\n      document.body.setAttribute('data-w3a-theme-pulse', '1');\n      window.setTimeout(() => {\n        document.body?.removeAttribute('data-w3a-theme-pulse');\n      }, 220);\n    }\n  };\n\n  const handleToggleThresholdSigning = (enabled: boolean) => {\n    if (enabled) {\n      const prev = lastThresholdSignerModeRef.current;\n      tatchi.setSignerMode(prev?.mode === 'threshold-signer' ? prev : 'threshold-signer');\n      return;\n    }\n    tatchi.setSignerMode('local-signer');\n  };\n\n  // Menu items configuration with context-aware handlers\n  const MENU_ITEMS: MenuItem[] = useMemo(() => [\n    {\n      id: PROFILE_MENU_ITEM_IDS.EXPORT_KEYS,\n      icon: <KeyIcon />,\n      label: 'Export Keys',\n      description: 'View your private keys',\n      disabled: !loginState.isLoggedIn,\n      onClick: async () => {\n        try {\n          await tatchi.exportNearKeypairWithUI(nearAccountId!);\n        } catch (error: any) {\n          console.error('Key export failed:', error);\n          const msg = String(error?.message || 'Unknown error');\n          const friendly = /No user data found|No public key found/i.test(msg)\n            ? 'No local key material found for this account on this device. Please complete registration or recovery here first.'\n            : msg;\n          alert(`Key export failed: ${friendly}`);\n        }\n      },\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.SCAN_LINK_DEVICE,\n      icon: <ScanIcon />,\n      label: 'Scan and Link Device',\n      description: 'Scan QR to link a device',\n      disabled: !loginState.isLoggedIn,\n      onClick: () => {\n        setShowQRScanner(true);\n      },\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.LINKED_DEVICES,\n      icon: <LinkIcon />,\n      label: 'Linked Devices',\n      description: 'View linked devices',\n      disabled: !loginState.isLoggedIn,\n      onClick: () => setShowLinkedDevices(true),\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.TOGGLE_THEME,\n      icon: theme === 'dark' ? <SunIcon /> : <MoonIcon />,\n      label: 'Toggle Theme',\n      description: theme === 'dark' ? 'Dark Mode' : 'Light Mode',\n      disabled: false,\n      onClick: handleToggleTheme,\n      keepOpenOnClick: true,\n    },\n    {\n      id: PROFILE_MENU_ITEM_IDS.TRANSACTION_SETTINGS,\n      icon: <SlidersIcon />,\n      label: 'Transaction Settings',\n      description: 'Customize confirmation behavior',\n      disabled: !loginState.isLoggedIn,\n      onClick: () => setTransactionSettingsOpen((v) => !v),\n      keepOpenOnClick: true,\n    },\n  ], [tatchi, nearAccountId, loginState.isLoggedIn, theme, handleToggleTheme]);\n\n  const highlightedMenuItemId = highlightedMenuItem?.id;\n  const highlightShouldFocus = highlightedMenuItem?.focus ?? true;\n  const highlightedIndex = useMemo(() => {\n    if (!highlightedMenuItemId) return -1;\n    return MENU_ITEMS.findIndex((item) => item.id === highlightedMenuItemId);\n  }, [MENU_ITEMS, highlightedMenuItemId]);\n\n  useEffect(() => {\n    if (!isOpen || highlightedIndex < 0 || !highlightShouldFocus) return;\n    const el = refs.menuItemsRef.current?.[highlightedIndex];\n    if (!el) return;\n    const focusItem = () => {\n      if (typeof (el as any).focus === 'function') {\n        (el as any).focus();\n      }\n    };\n    if (typeof window === 'undefined') {\n      focusItem();\n      return;\n    }\n    const frame = window.requestAnimationFrame(focusItem);\n    return () => window.cancelAnimationFrame(frame);\n  }, [isOpen, highlightedIndex, highlightShouldFocus, refs.menuItemsRef]);\n\n  // Handlers\n  const handleLogout = () => {\n    logout();\n    onLogout?.();\n    handleClose();\n  };\n\n  return (\n    <div\n      ref={refs.buttonRef}\n      className={`w3a-profile-button-morphable ${isOpen ? 'open' : 'closed'}${className ? ` ${className}` : ''}`}\n      style={style}\n      data-state={isOpen ? 'open' : 'closed'}\n    >\n      <UserAccountButton\n        username={accountName}\n        hideUsername={hideUsername}\n        fullAccountId={nearAccountId || undefined}\n        isOpen={isOpen}\n        onClick={handleToggle}\n        nearExplorerBaseUrl={nearExplorerBaseUrl}\n        theme={theme}\n      />\n\n      {/* Visible menu structure for actual interaction */}\n      <ProfileDropdown\n        ref={refs.dropdownRef}\n        isOpen={isOpen}\n        menuItems={MENU_ITEMS}\n        onLogout={handleLogout}\n        onClose={handleClose}\n        menuItemsRef={refs.menuItemsRef}\n        toggleColors={toggleColors}\n        currentConfirmConfig={currentConfirmConfig}\n        signerMode={currentSignerMode ?? undefined}\n        onToggleThresholdSigning={handleToggleThresholdSigning}\n        onSetUiMode={handleSetUiMode}\n        onToggleSkipClick={handleToggleSkipClick}\n        onSetDelay={handleSetDelay}\n        onToggleTheme={handleToggleTheme}\n        transactionSettingsOpen={transactionSettingsOpen}\n        theme={theme}\n        highlightedMenuItemId={highlightedMenuItemId}\n      />\n\n      {/* QR Scanner Modal (portaled to nearest root for robustness) */}\n      {createPortal(\n        <QRCodeScanner\n          key=\"profile-qr-scanner\"\n          isOpen={showQRScanner}\n          fundingAmount={deviceLinkingScannerParams?.fundingAmount || '0.05'}\n          onDeviceLinked={(result) => {\n            deviceLinkingScannerParams?.onDeviceLinked?.(result);\n            setShowQRScanner(false);\n          }}\n          onError={(error) => {\n            deviceLinkingScannerParams?.onError?.(error);\n            setShowQRScanner(false);\n          }}\n          onClose={() => {\n            deviceLinkingScannerParams?.onClose?.();\n            setShowQRScanner(false);\n          }}\n          onEvent={(event) => deviceLinkingScannerParams?.onEvent?.(event)}\n        />, (portalTarget || document.body))}\n\n      {/* Linked Devices Modal (portaled to nearest root for robustness) */}\n      {createPortal(\n        <LinkedDevicesModal\n          nearAccountId={nearAccountId!}\n          isOpen={showLinkedDevices}\n          onClose={() => setShowLinkedDevices(false)}\n        />, (portalTarget || document.body))}\n    </div>\n  );\n};\n\nexport const AccountMenuButton: React.FC<AccountMenuButtonProps> = (props) => {\n  return (\n    <Theme>\n      <AccountMenuButtonInner {...props} />\n    </Theme>\n  );\n};\n\nexport const ProfileSettingsButton = AccountMenuButton;\n"],"mappings":"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"}

package/dist/esm/react/components/AccountMenuButton/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/react/components/AccountMenuButton/types.ts"],"sourcesContent":["import type { ToggleColorProps } from './Toggle';\nimport type { DeviceLinkingSSEEvent, LinkDeviceResult } from '@/index';\nimport type { ThemeName } from '@/core/WebAuthnManager/LitComponents/confirm-ui-types';\n\nexport interface ProfileDimensions {\n  width: number;\n  height: number;\n}\n\nexport interface ProfileAnimationConfig {\n  duration: number;\n  delay: number;\n  ease: string;\n}\n\nexport const PROFILE_MENU_ITEM_IDS = {\n  EXPORT_KEYS: 'export-keys',\n  SCAN_LINK_DEVICE: 'scan-link-device',\n  LINKED_DEVICES: 'linked-devices',\n  TOGGLE_THEME: 'toggle-theme',\n  TRANSACTION_SETTINGS: 'transaction-settings',\n} as const;\n\nexport type ProfileSettingsMenuItemId = typeof PROFILE_MENU_ITEM_IDS[keyof typeof PROFILE_MENU_ITEM_IDS];\n\nexport interface MenuItem {\n  id?: ProfileSettingsMenuItemId | (string & {});\n  icon: React.ReactNode;\n  label: string;\n  description: string;\n  disabled: boolean;\n  onClick?: () => void;\n  // When true, clicking this item will NOT close the dropdown\n  keepOpenOnClick?: boolean;\n}\n\nexport interface HighlightedProfileMenuItem {\n  id: ProfileSettingsMenuItemId | (string & {});\n  /**\n   * When true (default), focus the highlighted button when the menu opens.\n   */\n  focus?: boolean;\n}\n\nexport interface DeviceLinkingScannerParams {\n  onDeviceLinked?: (result: LinkDeviceResult) => void;\n  onError?: (error: Error) => void;\n  onClose?: () => void;\n  onEvent?: (event: DeviceLinkingSSEEvent) => void;\n  fundingAmount?: string;\n}\n\nexport interface AccountMenuButtonProps {\n  nearAccountId: string;\n  nearExplorerBaseUrl?: string;\n  username?: string | null;\n  hideUsername?: boolean;\n  onLogout?: () => void;\n  // QR Code Scanner parameters\n  deviceLinkingScannerParams?: DeviceLinkingScannerParams;\n  // styles\n  toggleColors?: ToggleColorProps;\n  style?: React.CSSProperties;\n  className?: string;\n  // Optional: where to portal overlays (modals)\n  // Defaults to the component's ShadowRoot when present, otherwise document.body\n  portalTarget?: HTMLElement | ShadowRoot | null;\n  // Programmatic menu control\n  isMenuOpen?: boolean;\n  onMenuOpenChange?: (open: boolean) => void;\n  highlightedMenuItem?: HighlightedProfileMenuItem | null;\n}\n\nexport type ProfileSettingsButtonProps = AccountMenuButtonProps;\n\nexport interface UserAccountButtonProps {\n  username: string;\n  hideUsername: boolean;\n  fullAccountId?: string;\n  nearExplorerBaseUrl?: string;\n  isOpen: boolean;\n  onClick: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n  theme?: ThemeName;\n  // Optional ARIA linkage\n  menuId?: string;\n  triggerId?: string;\n}\n\nexport interface ProfileDropdownProps {\n  isOpen: boolean;\n  menuItems: MenuItem[];\n  onLogout: () => void;\n  onClose: () => void;\n  toggleColors?: ToggleColorProps;\n  theme?: ThemeName;\n  currentConfirmConfig?: any;\n  onSetUiMode?: (mode: 'skip' | 'modal' | 'drawer') => void;\n  onToggleShowDetails?: () => void;\n  onToggleSkipClick?: () => void;\n  onSetDelay?: (delay: number) => void;\n  onToggleTheme?: () => void;\n  transactionSettingsOpen?: boolean;\n  menuItemsRef: React.MutableRefObject<(HTMLElement | null)[]>;\n  // Optional ARIA linkage\n  menuId?: string;\n  triggerId?: string;\n  highlightedMenuItemId?: string;\n}\n\nexport interface MenuItemProps {\n  item: MenuItem;\n  onClose: () => void;\n  className?: string;\n  style?: React.CSSProperties;\n  isHighlighted?: boolean;\n}\n\nexport interface LogoutMenuItemProps {\n  onLogout: () => void;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport interface ProfileRelayerToggleSectionProps {\n  toggleColors?: ToggleColorProps;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport interface TransactionSettingsSectionProps {\n  currentConfirmConfig: any;\n  onSetUiMode?: (mode: 'skip' | 'modal' | 'drawer') => void;\n  onToggleShowDetails?: () => void;\n  onToggleSkipClick: () => void;\n  onSetDelay: (delay: number) => void;\n  onToggleTheme?: () => void;\n  className?: string;\n  style?: React.CSSProperties;\n  isOpen?: boolean;\n  theme?: ThemeName;\n}\n\nexport interface ProfileStateRefs {\n  buttonRef: React.RefObject<HTMLDivElement | null>;\n  dropdownRef: React.RefObject<HTMLDivElement | null>;\n  menuItemsRef: React.MutableRefObject<(HTMLElement | null)[]>;\n}\n\nexport type { ToggleColorProps };\n"],"mappings":";AAeA,MAAa,wBAAwB;CACnC,aAAa;CACb,kBAAkB;CAClB,gBAAgB;CAChB,cAAc;CACd,sBAAsB"}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/react/components/AccountMenuButton/types.ts"],"sourcesContent":["import type { ToggleColorProps } from './Toggle';\nimport type { DeviceLinkingSSEEvent, LinkDeviceResult } from '@/index';\nimport type { ThemeName } from '@/core/WebAuthnManager/LitComponents/confirm-ui-types';\nimport type { SignerMode } from '@/core/types/signer-worker';\n\nexport interface ProfileDimensions {\n  width: number;\n  height: number;\n}\n\nexport interface ProfileAnimationConfig {\n  duration: number;\n  delay: number;\n  ease: string;\n}\n\nexport const PROFILE_MENU_ITEM_IDS = {\n  EXPORT_KEYS: 'export-keys',\n  SCAN_LINK_DEVICE: 'scan-link-device',\n  LINKED_DEVICES: 'linked-devices',\n  TOGGLE_THEME: 'toggle-theme',\n  TRANSACTION_SETTINGS: 'transaction-settings',\n} as const;\n\nexport type ProfileSettingsMenuItemId = typeof PROFILE_MENU_ITEM_IDS[keyof typeof PROFILE_MENU_ITEM_IDS];\n\nexport interface MenuItem {\n  id?: ProfileSettingsMenuItemId | (string & {});\n  icon: React.ReactNode;\n  label: string;\n  description: string;\n  disabled: boolean;\n  onClick?: () => void;\n  // When true, clicking this item will NOT close the dropdown\n  keepOpenOnClick?: boolean;\n}\n\nexport interface HighlightedProfileMenuItem {\n  id: ProfileSettingsMenuItemId | (string & {});\n  /**\n   * When true (default), focus the highlighted button when the menu opens.\n   */\n  focus?: boolean;\n}\n\nexport interface DeviceLinkingScannerParams {\n  onDeviceLinked?: (result: LinkDeviceResult) => void;\n  onError?: (error: Error) => void;\n  onClose?: () => void;\n  onEvent?: (event: DeviceLinkingSSEEvent) => void;\n  fundingAmount?: string;\n}\n\nexport interface AccountMenuButtonProps {\n  nearAccountId: string;\n  nearExplorerBaseUrl?: string;\n  username?: string | null;\n  hideUsername?: boolean;\n  onLogout?: () => void;\n  // QR Code Scanner parameters\n  deviceLinkingScannerParams?: DeviceLinkingScannerParams;\n  // styles\n  toggleColors?: ToggleColorProps;\n  style?: React.CSSProperties;\n  className?: string;\n  // Optional: where to portal overlays (modals)\n  // Defaults to the component's ShadowRoot when present, otherwise document.body\n  portalTarget?: HTMLElement | ShadowRoot | null;\n  // Programmatic menu control\n  isMenuOpen?: boolean;\n  onMenuOpenChange?: (open: boolean) => void;\n  highlightedMenuItem?: HighlightedProfileMenuItem | null;\n}\n\nexport type ProfileSettingsButtonProps = AccountMenuButtonProps;\n\nexport interface UserAccountButtonProps {\n  username: string;\n  hideUsername: boolean;\n  fullAccountId?: string;\n  nearExplorerBaseUrl?: string;\n  isOpen: boolean;\n  onClick: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n  theme?: ThemeName;\n  // Optional ARIA linkage\n  menuId?: string;\n  triggerId?: string;\n}\n\nexport interface ProfileDropdownProps {\n  isOpen: boolean;\n  menuItems: MenuItem[];\n  onLogout: () => void;\n  onClose: () => void;\n  toggleColors?: ToggleColorProps;\n  theme?: ThemeName;\n  currentConfirmConfig?: any;\n  signerMode?: SignerMode;\n  onToggleThresholdSigning?: (enabled: boolean) => void;\n  onSetUiMode?: (mode: 'skip' | 'modal' | 'drawer') => void;\n  onToggleShowDetails?: () => void;\n  onToggleSkipClick?: () => void;\n  onSetDelay?: (delay: number) => void;\n  onToggleTheme?: () => void;\n  transactionSettingsOpen?: boolean;\n  menuItemsRef: React.MutableRefObject<(HTMLElement | null)[]>;\n  // Optional ARIA linkage\n  menuId?: string;\n  triggerId?: string;\n  highlightedMenuItemId?: string;\n}\n\nexport interface MenuItemProps {\n  item: MenuItem;\n  onClose: () => void;\n  className?: string;\n  style?: React.CSSProperties;\n  isHighlighted?: boolean;\n}\n\nexport interface LogoutMenuItemProps {\n  onLogout: () => void;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport interface ProfileRelayerToggleSectionProps {\n  toggleColors?: ToggleColorProps;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport interface TransactionSettingsSectionProps {\n  currentConfirmConfig: any;\n  signerMode?: SignerMode;\n  onToggleThresholdSigning?: (enabled: boolean) => void;\n  onSetUiMode?: (mode: 'skip' | 'modal' | 'drawer') => void;\n  onToggleShowDetails?: () => void;\n  onToggleSkipClick: () => void;\n  onSetDelay: (delay: number) => void;\n  onToggleTheme?: () => void;\n  className?: string;\n  style?: React.CSSProperties;\n  isOpen?: boolean;\n  theme?: ThemeName;\n}\n\nexport interface ProfileStateRefs {\n  buttonRef: React.RefObject<HTMLDivElement | null>;\n  dropdownRef: React.RefObject<HTMLDivElement | null>;\n  menuItemsRef: React.MutableRefObject<(HTMLElement | null)[]>;\n}\n\nexport type { ToggleColorProps };\n"],"mappings":";AAgBA,MAAa,wBAAwB;CACnC,aAAa;CACb,kBAAkB;CAClB,gBAAgB;CAChB,cAAc;CACd,sBAAsB"}