@hexclave/next 1.0.13 → 1.0.15

package/dist/esm/clickmap/clickmap-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clickmap-styles.js","names":[],"sources":["../../../src/clickmap/clickmap-styles.ts"],"sourcesContent":["\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n// CSS for the standalone clickmap overlay.\n//\n// The clickmap is fully independent from the dev tool: it ships its own\n// stylesheet and panel chrome so the dev tool (and its stylesheet) can be\n// removed without affecting the clickmap. Class names keep the shared `sdt-`\n// prefix on purpose — the analytics ingest/query layers exclude self-clicks by\n// that prefix (see @hexclave/shared/dist/utils/dev-tool).\n// Uses the .hexclave-clickmap scope to avoid conflicts with host app styles.\n// Design tokens + base reset come from the shared in-page-ui module.\n\nimport { getInPageUiBaseCSS } from \"../in-page-ui/base-styles\";\n\nexport const clickmapCSS = getInPageUiBaseCSS('.hexclave-clickmap') + `\n  /* Bottom-centered floating panel (the clickmap's only chrome) */\n  .hexclave-clickmap .sdt-hm-panel {\n    position: fixed;\n    left: 50%;\n    bottom: 18px;\n    z-index: 2147483647;\n    width: min(680px, calc(100vw - 24px));\n    max-width: calc(100vw - 24px);\n    max-height: calc(100vh - 36px);\n    transform: translateX(-50%);\n    display: flex;\n    flex-direction: column;\n    overflow: visible;\n  }\n\n  .hexclave-clickmap .sdt-hm-panel-inner {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    animation: sdt-hm-panel-enter 0.2s ease-out;\n  }\n\n  @keyframes sdt-hm-panel-enter {\n    from {\n      opacity: 0;\n      transform: scale(0.95) translateY(8px);\n    }\n    to {\n      opacity: 1;\n      transform: scale(1) translateY(0);\n    }\n  }\n\n  /* --- Clickmaps --- */\n\n  .hexclave-clickmap .sdt-hm {\n    height: auto;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    overflow: visible;\n    background: transparent;\n  }\n\n  /* One spacing rhythm across the pill: a tight 2px base gap so adjacent\n     controls read as clusters, with the wider between-group separation\n     coming only from the metrics block's own padding (and the title's\n     trailing padding). Item-level whitespace inside ghost icon buttons\n     already provides the rest of the breathing room. */\n  .hexclave-clickmap .sdt-hm-toolbar {\n    position: relative;\n    z-index: 4;\n    display: flex;\n    align-items: center;\n    gap: 2px;\n    min-height: 44px;\n    padding: 6px 8px;\n    border: 1px solid var(--sdt-border);\n    border-radius: 999px;\n    background: var(--sdt-overlay-bg);\n    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);\n    backdrop-filter: blur(18px);\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-title {\n    flex-shrink: 0;\n    padding: 0 6px 0 2px;\n    font-size: 13px;\n    font-weight: 650;\n    color: var(--sdt-text);\n    line-height: 1.1;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-filters {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    align-items: center;\n    gap: 6px;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-filters .sdt-hm-filter-input {\n    height: 28px;\n    border-radius: 999px;\n    font-size: 11.5px;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-filters > .sdt-hm-filter-input {\n    flex-shrink: 0;\n    width: auto;\n    max-width: 120px;\n    padding-right: 4px;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-url {\n    position: relative;\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    align-items: center;\n    /* The revert/info ghost buttons hug the input they belong to. */\n    gap: 2px;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-url .sdt-hm-filter-input {\n    flex: 1;\n  }\n\n  .hexclave-clickmap .sdt-hm-mode {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    gap: 2px;\n    padding: 2px;\n    border-radius: 999px;\n    background: var(--sdt-bg-elevated);\n    border: 1px solid var(--sdt-border-subtle);\n  }\n\n  .hexclave-clickmap .sdt-hm-mode-btn {\n    min-width: 24px;\n    height: 20px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 999px;\n    background: transparent;\n    color: var(--sdt-text-tertiary);\n    padding: 0 7px;\n    font: inherit;\n    font-family: var(--sdt-font-mono, ui-monospace, monospace);\n    font-size: 11px;\n    font-weight: 600;\n    cursor: pointer;\n  }\n\n  .hexclave-clickmap .sdt-hm-mode-btn:not(.sdt-hm-mode-btn-active):hover {\n    color: var(--sdt-text);\n  }\n\n  .hexclave-clickmap .sdt-hm-mode-btn-active {\n    background: var(--sdt-accent);\n    color: white;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-input-error,\n  .hexclave-clickmap .sdt-hm-filter-input-error:focus {\n    border-color: var(--sdt-error);\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-info {\n    flex-shrink: 0;\n    width: 20px;\n    height: 20px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 999px;\n    background: transparent;\n    color: var(--sdt-text-tertiary);\n    cursor: pointer;\n    padding: 0;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-info:hover,\n  .hexclave-clickmap .sdt-hm-filter-info[aria-expanded=\"true\"] {\n    background: var(--sdt-bg-hover);\n    color: var(--sdt-text);\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help {\n    display: none;\n    position: absolute;\n    bottom: calc(100% + 10px);\n    right: 0;\n    z-index: 6;\n    width: 320px;\n    max-width: min(320px, calc(100vw - 32px));\n    box-sizing: border-box;\n    padding: 14px;\n    border: 1px solid var(--sdt-border);\n    border-radius: var(--sdt-radius-lg);\n    background: var(--sdt-bg);\n    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);\n    backdrop-filter: blur(18px);\n    cursor: default;\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-open {\n    display: block;\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-title {\n    font-size: 12px;\n    font-weight: 650;\n    color: var(--sdt-text);\n    margin-bottom: 6px;\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-body {\n    font-size: 11.5px;\n    line-height: 1.5;\n    color: var(--sdt-text-secondary);\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-rows {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px solid var(--sdt-border-subtle);\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-row {\n    display: flex;\n    align-items: baseline;\n    gap: 10px;\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-code {\n    flex-shrink: 0;\n    border-radius: var(--sdt-radius);\n    background: var(--sdt-bg-elevated);\n    border: 1px solid var(--sdt-border-subtle);\n    padding: 1px 6px;\n    font-family: var(--sdt-font-mono, ui-monospace, monospace);\n    font-size: 11px;\n    color: var(--sdt-text);\n    white-space: nowrap;\n  }\n\n  .hexclave-clickmap .sdt-hm-url-help-desc {\n    font-size: 11px;\n    line-height: 1.4;\n    color: var(--sdt-text-secondary);\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-metrics {\n    flex-shrink: 0;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    /* Side padding is what separates the metrics group from the url field\n       on its left and the toggle cluster on its right. */\n    padding: 0 8px;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-metric {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    color: var(--sdt-text-secondary);\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-metric-value {\n    font-size: 12px;\n    font-weight: 700;\n    color: var(--sdt-text);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .hexclave-clickmap .sdt-hm-toolbar-metric-icon {\n    display: inline-flex;\n    align-items: center;\n    color: var(--sdt-text-tertiary);\n  }\n\n  .hexclave-clickmap .sdt-hm-icon-btn {\n    width: 28px;\n    height: 28px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    border: 0;\n    border-radius: 999px;\n    background: transparent;\n    color: var(--sdt-text-secondary);\n    cursor: pointer;\n  }\n\n  .hexclave-clickmap .sdt-hm-icon-btn:hover {\n    background: var(--sdt-bg-hover);\n    color: var(--sdt-text);\n  }\n\n  /* Presses must always target the button itself: the chevron svg is replaced\n     when the panel toggles, and a press whose mousedown landed on a since-\n     detached svg never produces a click. */\n  .hexclave-clickmap .sdt-hm-icon-btn svg {\n    pointer-events: none;\n  }\n\n  /* Styled tooltips for toolbar controls, driven by a data-sdt-tip attribute\n     instead of native title so they match the overlay theme and also show on\n     keyboard focus. The hover transition-delay acts as a hover-intent gate so\n     tooltips don't flash while the pointer crosses the toolbar; hover-out has\n     no delay, so they dismiss instantly. */\n  .hexclave-clickmap [data-sdt-tip] {\n    position: relative;\n  }\n\n  .hexclave-clickmap [data-sdt-tip]::after {\n    content: attr(data-sdt-tip);\n    position: absolute;\n    bottom: calc(100% + 8px);\n    left: 50%;\n    transform: translateX(-50%) translateY(2px);\n    padding: 4px 8px;\n    border: 1px solid var(--sdt-border);\n    border-radius: var(--sdt-radius);\n    background: var(--sdt-overlay-bg);\n    backdrop-filter: blur(18px);\n    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);\n    color: var(--sdt-text);\n    font-size: 11px;\n    font-weight: 600;\n    line-height: 1.2;\n    white-space: nowrap;\n    pointer-events: none;\n    opacity: 0;\n    transition: opacity 0.12s ease, transform 0.12s ease;\n    z-index: 3;\n  }\n\n  .hexclave-clickmap [data-sdt-tip]:hover::after,\n  .hexclave-clickmap [data-sdt-tip]:focus-visible::after {\n    opacity: 1;\n    transform: translateX(-50%) translateY(0);\n    transition-delay: 0.35s;\n  }\n\n  /* The info button's tooltip would sit on top of its own help popover. */\n  .hexclave-clickmap .sdt-hm-filter-info[aria-expanded=\"true\"]::after {\n    opacity: 0;\n  }\n\n  .hexclave-clickmap .sdt-hm-details {\n    display: none;\n    position: relative;\n    z-index: 1;\n    max-height: min(460px, calc(100vh - 98px));\n    overflow: hidden;\n    border: 1px solid var(--sdt-border);\n    border-radius: var(--sdt-radius-lg);\n    background: var(--sdt-bg);\n    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);\n  }\n\n  .hexclave-clickmap .sdt-hm-expanded .sdt-hm-details {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .hexclave-clickmap .sdt-hm-head {\n    flex-shrink: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    padding: 16px;\n    border-bottom: 1px solid var(--sdt-border-subtle);\n  }\n\n  .hexclave-clickmap .sdt-hm-filters {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-row {\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    gap: 12px;\n  }\n\n  .hexclave-clickmap .sdt-hm-seg {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    gap: 2px;\n    height: 30px;\n    padding: 3px;\n    border-radius: var(--sdt-radius);\n    border: 1px solid var(--sdt-border-subtle);\n    background: var(--sdt-bg-elevated);\n    box-sizing: border-box;\n  }\n\n  .hexclave-clickmap .sdt-hm-seg-thumb {\n    position: absolute;\n    top: 3px;\n    left: 0;\n    bottom: 3px;\n    width: 0;\n    border-radius: calc(var(--sdt-radius) - 2px);\n    background: var(--sdt-bg);\n    border: 1px solid var(--sdt-border);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);\n    transform: translateX(0);\n    transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1), width 220ms cubic-bezier(0.22, 1, 0.36, 1);\n    pointer-events: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-seg-btn {\n    position: relative;\n    z-index: 1;\n    flex: 1 1 0;\n    min-width: 0;\n    border: 0;\n    background: transparent;\n    color: var(--sdt-text-tertiary);\n    font: inherit;\n    font-family: var(--sdt-font);\n    font-size: 11px;\n    font-weight: 600;\n    line-height: 1;\n    padding: 0 4px;\n    border-radius: calc(var(--sdt-radius) - 2px);\n    cursor: pointer;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    transition: color 160ms ease;\n  }\n\n  .hexclave-clickmap .sdt-hm-seg-btn:hover {\n    color: var(--sdt-text-secondary);\n  }\n\n  .hexclave-clickmap .sdt-hm-seg-btn[aria-checked=\"true\"] {\n    color: var(--sdt-text);\n  }\n\n  .hexclave-clickmap .sdt-hm-seg-btn:focus-visible {\n    outline: 2px solid var(--sdt-accent);\n    outline-offset: -2px;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .hexclave-clickmap .sdt-hm-seg-thumb {\n      transition: none;\n    }\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-field {\n    display: flex;\n    flex-direction: column;\n    gap: 5px;\n    min-width: 0;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-label-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 6px;\n    min-height: 13px;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-label {\n    font-size: 10px;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: var(--sdt-text-tertiary);\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-reset {\n    display: none;\n    flex-shrink: 0;\n    width: 20px;\n    height: 20px;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 999px;\n    background: transparent;\n    padding: 0;\n    color: var(--sdt-accent);\n    cursor: pointer;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-reset:hover {\n    background: var(--sdt-bg-hover);\n    color: var(--sdt-accent-hover);\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-reset-visible {\n    display: inline-flex;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-input {\n    height: 30px;\n    border-radius: var(--sdt-radius);\n    border: 1px solid var(--sdt-border-subtle);\n    background: var(--sdt-bg-elevated);\n    color: var(--sdt-text);\n    padding: 0 9px;\n    font: inherit;\n    font-size: 12px;\n    font-family: var(--sdt-font);\n    min-width: 0;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .hexclave-clickmap .sdt-hm-filter-input:focus {\n    outline: none;\n    border-color: var(--sdt-accent);\n  }\n\n  .hexclave-clickmap .sdt-hm-actions {\n    display: flex;\n    align-items: stretch;\n    gap: 10px;\n  }\n\n  .hexclave-clickmap .sdt-hm-actions .sdt-hm-btn {\n    height: auto;\n    flex-shrink: 0;\n    white-space: nowrap;\n    padding: 0 16px;\n  }\n\n  .hexclave-clickmap .sdt-hm-btn {\n    height: 30px;\n    border-radius: var(--sdt-radius);\n    border: 1px solid var(--sdt-border-subtle);\n    background: var(--sdt-bg-elevated);\n    color: var(--sdt-text-secondary);\n    padding: 0 10px;\n    font: inherit;\n    font-size: 12px;\n    cursor: pointer;\n    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;\n  }\n\n  .hexclave-clickmap .sdt-hm-btn:hover {\n    background: var(--sdt-bg-hover);\n    color: var(--sdt-text);\n    transition: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-btn-primary {\n    background: var(--sdt-accent);\n    border-color: var(--sdt-accent);\n    color: white;\n  }\n\n  .hexclave-clickmap .sdt-hm-btn-primary:hover {\n    background: var(--sdt-accent);\n    border-color: var(--sdt-accent);\n    color: white;\n    transition: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-btn-sm {\n    height: 24px;\n    flex-shrink: 0;\n    border-radius: 999px;\n    padding: 0 10px;\n    font-size: 11px;\n    font-weight: 600;\n    white-space: nowrap;\n  }\n\n  .hexclave-clickmap .sdt-hm-btn:disabled {\n    opacity: 0.45;\n    pointer-events: none;\n  }\n\n  /* Dead-clicks-only filter toggle (toolbar icon button + expanded-panel\n     button). Active state borrows the error tint used by the dead chips so\n     the mode reads as \"you are looking at failures\". */\n  .hexclave-clickmap .sdt-hm-dead-toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 6px;\n  }\n\n  .hexclave-clickmap .sdt-hm-dead-toggle-icon {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  .hexclave-clickmap .sdt-hm-dead-toggle-active,\n  .hexclave-clickmap .sdt-hm-dead-toggle-active:hover {\n    background: var(--sdt-error-muted);\n    border-color: var(--sdt-error);\n    color: var(--sdt-error);\n    transition: none;\n  }\n\n  /* Toolbar overlay toggle while the overlay is hidden: tinted so the off\n     state reads at a glance, eye-off icon carries the meaning. */\n  .hexclave-clickmap .sdt-hm-overlay-mini-off,\n  .hexclave-clickmap .sdt-hm-overlay-mini-off:hover {\n    background: var(--sdt-accent-muted);\n    color: var(--sdt-accent-hover);\n  }\n\n  .hexclave-clickmap .sdt-hm-stats {\n    flex: 1;\n    min-width: 0;\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 8px;\n  }\n\n  .hexclave-clickmap .sdt-hm-stat {\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    border-radius: var(--sdt-radius);\n    background: var(--sdt-bg-elevated);\n    padding: 7px 10px;\n  }\n\n  .hexclave-clickmap .sdt-hm-stat-label {\n    font-size: 9.5px;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: var(--sdt-text-tertiary);\n  }\n\n  .hexclave-clickmap .sdt-hm-stat-value {\n    font-size: 15px;\n    font-weight: 650;\n    color: var(--sdt-text);\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* No top padding on the scroller: the sticky list header pins at top 0,\n     and scroller padding reads as a see-through strip above it while the\n     list scrolls (Chromium offsets sticky insets by the scroll container's\n     padding). The status line below carries the 12px instead. */\n  .hexclave-clickmap .sdt-hm-body {\n    flex: 1;\n    min-height: 0;\n    overflow: auto;\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n    padding: 0 16px 14px;\n  }\n\n  .hexclave-clickmap .sdt-hm-token-status {\n    color: var(--sdt-text-secondary);\n    padding: 12px 2px 0;\n    font-size: 11.5px;\n    line-height: 1.45;\n  }\n\n  .hexclave-clickmap .sdt-hm-token-status-error {\n    color: var(--sdt-error);\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning {\n    display: none;\n    gap: 8px;\n    padding: 10px;\n    border-radius: var(--sdt-radius);\n    border: 1px solid rgba(234, 179, 8, 0.24);\n    background: var(--sdt-warning-muted);\n    color: var(--sdt-text);\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-visible {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-title {\n    font-size: 12px;\n    font-weight: 650;\n    color: var(--sdt-text);\n    line-height: 1.2;\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-body {\n    font-size: 11.5px;\n    line-height: 1.45;\n    color: var(--sdt-text-secondary);\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-actions {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-action {\n    min-width: 0;\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    border-radius: var(--sdt-radius);\n    border: 1px solid var(--sdt-border-subtle);\n    background: var(--sdt-bg-elevated);\n    padding: 4px 5px 4px 8px;\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-label {\n    font-size: 10px;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: var(--sdt-text-tertiary);\n  }\n\n  .hexclave-clickmap .sdt-hm-viewport-warning-code {\n    font-family: var(--sdt-font-mono);\n    font-size: 11.5px;\n    font-weight: 650;\n    color: var(--sdt-text);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .hexclave-clickmap .sdt-hm-copy-btn {\n    height: 22px;\n    border: 1px solid var(--sdt-border-subtle);\n    border-radius: 999px;\n    background: var(--sdt-bg);\n    color: var(--sdt-text-secondary);\n    padding: 0 8px;\n    font: inherit;\n    font-size: 10.5px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;\n  }\n\n  .hexclave-clickmap .sdt-hm-copy-btn:hover {\n    background: var(--sdt-bg-hover);\n    border-color: var(--sdt-border);\n    color: var(--sdt-text);\n    transition: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-list {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n  }\n\n  /* Datagrid-style header above the element list. Sticky inside the\n     scrolling body (full-bleed via negative margins) so select-all and the\n     bulk show/hide actions stay reachable while the list scrolls. The 24px\n     left padding lines its master checkbox up with the row checkboxes\n     (16px body padding + 8px row padding). */\n  .hexclave-clickmap .sdt-hm-list-header {\n    display: none;\n    position: sticky;\n    top: 0;\n    z-index: 2;\n    align-items: center;\n    gap: 8px;\n    margin: 0 -16px;\n    padding: 8px 24px;\n    background: var(--sdt-bg);\n    border-bottom: 1px solid var(--sdt-border-subtle);\n  }\n\n  .hexclave-clickmap .sdt-hm-list-header-visible {\n    display: flex;\n  }\n\n  .hexclave-clickmap .sdt-hm-list-header-summary {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--sdt-text-secondary);\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* Element search, compacted to header height. Shrinks before the summary\n     does, but never below a usable width. */\n  .hexclave-clickmap .sdt-hm-list-header .sdt-hm-filter-input {\n    flex: 0 1 220px;\n    width: auto;\n    min-width: 90px;\n    height: 24px;\n    border-radius: 999px;\n    font-size: 11px;\n    padding: 0 10px;\n  }\n\n  .hexclave-clickmap .sdt-hm-empty {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 140px;\n    border-radius: var(--sdt-radius);\n    border: 1px dashed var(--sdt-border);\n    color: var(--sdt-text-tertiary);\n    font-size: 12px;\n    text-align: center;\n    padding: 0 16px;\n  }\n\n  .hexclave-clickmap .sdt-hm-row {\n    width: 100%;\n    display: grid;\n    grid-template-columns: 16px minmax(42px, auto) minmax(0, 1fr) 24px;\n    align-items: center;\n    gap: 10px;\n    border: 0;\n    border-radius: var(--sdt-radius);\n    background: transparent;\n    color: var(--sdt-text);\n    padding: 8px;\n    text-align: left;\n    cursor: pointer;\n    font-family: var(--sdt-font);\n    user-select: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-row:hover {\n    background: var(--sdt-bg-hover);\n    transition: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-row:focus-visible {\n    outline: 2px solid var(--sdt-accent);\n    outline-offset: 2px;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-muted {\n    opacity: 0.52;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-highlighted {\n    background: rgba(250, 204, 21, 0.12);\n  }\n\n  /* Declared after -highlighted and with a :hover pair so the selection tint\n     wins over both the lead-highlight wash and the plain hover background. */\n  .hexclave-clickmap .sdt-hm-row-selected,\n  .hexclave-clickmap .sdt-hm-row-selected:hover {\n    background: var(--sdt-accent-muted);\n  }\n\n  /* Row checkbox (also reused as the list header's master checkbox). A\n     button with role=checkbox instead of a native input so it can render the\n     overlay-themed check/indeterminate icons. */\n  .hexclave-clickmap .sdt-hm-row-check {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    border: 1px solid var(--sdt-border);\n    border-radius: calc(var(--sdt-radius) - 3px);\n    background: var(--sdt-bg-elevated);\n    color: white;\n    appearance: none;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-check:hover {\n    border-color: var(--sdt-accent);\n  }\n\n  .hexclave-clickmap .sdt-hm-row-check[aria-checked=\"true\"],\n  .hexclave-clickmap .sdt-hm-row-check[aria-checked=\"mixed\"] {\n    background: var(--sdt-accent);\n    border-color: var(--sdt-accent);\n  }\n\n  .hexclave-clickmap .sdt-hm-row-check:focus-visible {\n    outline: 2px solid var(--sdt-accent);\n    outline-offset: 2px;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-check svg {\n    pointer-events: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-count {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    height: 24px;\n    border-radius: calc(var(--sdt-radius) - 2px);\n    background: var(--sdt-accent-muted);\n    color: var(--sdt-accent-hover);\n    padding: 0 7px;\n    font-size: 12px;\n    font-weight: 700;\n    font-variant-numeric: tabular-nums;\n    font-family: var(--sdt-font);\n  }\n\n  .hexclave-clickmap .sdt-hm-row-muted .sdt-hm-row-count {\n    background: var(--sdt-bg-elevated);\n    color: var(--sdt-text-tertiary);\n  }\n\n  .hexclave-clickmap .sdt-hm-row-eye {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    border: 1px solid var(--sdt-border-subtle);\n    border-radius: calc(var(--sdt-radius) - 2px);\n    background: var(--sdt-bg-elevated);\n    color: var(--sdt-text-secondary);\n    appearance: none;\n    padding: 0;\n    cursor: pointer;\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-row:hover .sdt-hm-row-eye,\n  .hexclave-clickmap .sdt-hm-row:focus-within .sdt-hm-row-eye,\n  .hexclave-clickmap .sdt-hm-row-muted .sdt-hm-row-eye {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-eye:hover {\n    background: var(--sdt-bg-hover);\n    border-color: var(--sdt-border);\n    color: var(--sdt-text);\n    transition: none;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-eye:focus-visible {\n    outline: 2px solid var(--sdt-accent);\n    outline-offset: 2px;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-meta {\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 1px;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-label-row {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    min-width: 0;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-label {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    min-width: 0;\n    font-size: 12px;\n    font-weight: 600;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-dead {\n    display: none;\n    flex: none;\n    align-items: center;\n    height: 16px;\n    border-radius: calc(var(--sdt-radius) - 3px);\n    background: var(--sdt-error-muted);\n    color: var(--sdt-error);\n    padding: 0 5px;\n    font-size: 10px;\n    font-weight: 700;\n    font-variant-numeric: tabular-nums;\n    white-space: nowrap;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-dead-visible {\n    display: inline-flex;\n  }\n\n  .hexclave-clickmap .sdt-hm-row-selector {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    font-family: var(--sdt-font-mono);\n    font-size: 10.5px;\n    color: var(--sdt-text-tertiary);\n  }\n\n  .sdt-hm-overlay-root {\n    position: fixed;\n    inset: 0;\n    z-index: 2147483646;\n    pointer-events: none;\n    --resize-dur: 320ms;\n    --resize-ease: cubic-bezier(0.22, 1, 0.36, 1);\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-marker {\n    position: fixed;\n    transform: translate(-50%, -50%);\n    min-width: 28px;\n    height: 24px;\n    border-radius: 999px;\n    padding: 0 8px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    color: rgba(10, 10, 11, 0.92);\n    font: 700 12px/1 var(--sdt-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);\n    font-variant-numeric: tabular-nums;\n    cursor: pointer;\n    pointer-events: auto;\n    transition: opacity 0.15s ease, transform 0.15s ease, filter 0.15s ease;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-marker:hover {\n    transform: translate(-50%, -50%) scale(1.06);\n    transition: none;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-marker-muted {\n    opacity: 0.18;\n    filter: saturate(0.25);\n    text-decoration: line-through;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-marker-highlighted {\n    transform: translate(-50%, -50%) scale(1.08);\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-outline {\n    position: fixed;\n    border: 1px solid;\n    border-radius: 4px;\n    background: rgba(99, 102, 241, 0.04);\n    transition: opacity 0.15s ease, background 0.15s ease, border-color 0.15s ease;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-outline-muted {\n    opacity: 0;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-outline-highlighted {\n    border-color: rgba(250, 204, 21, 0.92) !important;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-highlight {\n    position: fixed;\n    border-radius: 5px;\n    background: rgba(250, 204, 21, 0.28);\n    box-shadow: 0 0 0 1px rgba(250, 204, 21, 0.7), 0 0 0 9999px rgba(0, 0, 0, 0.04);\n    opacity: 0;\n    will-change: top, left, width, height;\n    transition: opacity 0.18s ease;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-highlight-visible {\n    opacity: 1;\n  }\n\n  .sdt-hm-overlay-root .sdt-hm-highlight-animating {\n    transition:\n      top var(--resize-dur) var(--resize-ease),\n      left var(--resize-dur) var(--resize-ease),\n      width var(--resize-dur) var(--resize-ease),\n      height var(--resize-dur) var(--resize-ease),\n      opacity 0.18s ease;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .sdt-hm-overlay-root .sdt-hm-highlight-animating {\n      transition: opacity 0.18s ease;\n    }\n  }\n`;\n"],"mappings":";;;AAgBA,MAAa,cAAc,mBAAmB,qBAAqB,GAAG"}

package/dist/esm/clickmap/index.d.ts

@@ -0,0 +1,16 @@
+import { StackClientApp } from "../lib/hexclave-app";
+
+//#region src/clickmap/index.d.ts
+/**
+ * Mounts the clickmap overlay listener on the page.
+ *
+ * The clickmap is fully independent from the dev tool. It has no ambient UI:
+ * nothing renders until a dashboard-minted token is handed over (the
+ * CLICKMAP_OVERLAY_TOKEN_UPDATED event fired by the dashboard's console
+ * snippet) or a navigation-resume sentinel is present — only then is the
+ * actual overlay code lazily loaded and shown.
+ */
+declare function mountClickmapOverlay(app: StackClientApp<true>): () => void;
+//#endregion
+export { mountClickmapOverlay };
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/clickmap/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/clickmap/index.ts"],"mappings":";;;;;AA2EA;;;;;;;iBAAgB,oBAAA,CAAqB,GAAA,EAAK,cAAA"}

package/dist/esm/clickmap/index.js

@@ -0,0 +1,72 @@
+import { CLICKMAP_OVERLAY_RESUME_STORAGE_KEY, CLICKMAP_OVERLAY_TOKEN_UPDATED_EVENT } from "@hexclave/shared/dist/utils/analytics-clickmap-overlay";
+import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
+import { canMountIntoDom } from "../in-page-ui/dom.js";
+import { captureError } from "@hexclave/shared/dist/utils/errors";
+
+//#region src/clickmap/index.ts
+function consumeResumeSentinel() {
+	try {
+		if (sessionStorage.getItem(CLICKMAP_OVERLAY_RESUME_STORAGE_KEY) !== "1") return false;
+		sessionStorage.removeItem(CLICKMAP_OVERLAY_RESUME_STORAGE_KEY);
+		return true;
+	} catch {
+		return false;
+	}
+}
+let activeApp = null;
+let activeOverlayCleanup = null;
+let openGeneration = 0;
+let tokenListenerAttached = false;
+let openClickmapOverlayPromise = null;
+function loadOpenClickmapOverlay() {
+	if (!openClickmapOverlayPromise) openClickmapOverlayPromise = import("./clickmap-core.js").then((m) => m.openClickmapOverlay).catch((err) => {
+		openClickmapOverlayPromise = null;
+		throw err;
+	});
+	return openClickmapOverlayPromise;
+}
+function tryOpenOverlay() {
+	if (activeOverlayCleanup || !activeApp || !canMountIntoDom()) return;
+	const generation = ++openGeneration;
+	const app = activeApp;
+	runAsynchronously(async () => {
+		const openClickmapOverlay = await loadOpenClickmapOverlay();
+		if (generation !== openGeneration) return;
+		if (activeOverlayCleanup || activeApp !== app || !canMountIntoDom()) return;
+		activeOverlayCleanup = openClickmapOverlay(app, () => {
+			activeOverlayCleanup = null;
+		});
+	}, {
+		noErrorLogging: true,
+		onError: (error) => {
+			captureError("clickmap-mount", error);
+		}
+	});
+}
+/**
+* Mounts the clickmap overlay listener on the page.
+*
+* The clickmap is fully independent from the dev tool. It has no ambient UI:
+* nothing renders until a dashboard-minted token is handed over (the
+* CLICKMAP_OVERLAY_TOKEN_UPDATED event fired by the dashboard's console
+* snippet) or a navigation-resume sentinel is present — only then is the
+* actual overlay code lazily loaded and shown.
+*/
+function mountClickmapOverlay(app) {
+	activeApp = app;
+	if (typeof window !== "undefined" && !tokenListenerAttached) {
+		tokenListenerAttached = true;
+		window.addEventListener(CLICKMAP_OVERLAY_TOKEN_UPDATED_EVENT, tryOpenOverlay);
+	}
+	if (canMountIntoDom() && consumeResumeSentinel()) tryOpenOverlay();
+	return () => {
+		if (activeApp !== app) return;
+		activeApp = null;
+		openGeneration++;
+		activeOverlayCleanup?.();
+	};
+}
+
+//#endregion
+export { mountClickmapOverlay };
+//# sourceMappingURL=index.js.map

package/dist/esm/clickmap/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/clickmap/index.ts"],"sourcesContent":["\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport {\n  CLICKMAP_OVERLAY_RESUME_STORAGE_KEY,\n  CLICKMAP_OVERLAY_TOKEN_UPDATED_EVENT,\n} from \"@hexclave/shared/dist/utils/analytics-clickmap-overlay\";\nimport { captureError } from \"@hexclave/shared/dist/utils/errors\";\nimport { runAsynchronously } from \"@hexclave/shared/dist/utils/promises\";\nimport { canMountIntoDom } from \"../in-page-ui/dom\";\nimport type { StackClientApp } from \"../lib/hexclave-app\";\nimport type { openClickmapOverlay as OpenClickmapOverlayFn } from \"./clickmap-core\";\n\n// While the overlay is open it drops a sentinel into sessionStorage on unload\n// (see clickmap-core); consuming it here reopens the clickmap on the next page\n// so the user picks up where they left off.\nfunction consumeResumeSentinel(): boolean {\n  try {\n    if (sessionStorage.getItem(CLICKMAP_OVERLAY_RESUME_STORAGE_KEY) !== '1') return false;\n    sessionStorage.removeItem(CLICKMAP_OVERLAY_RESUME_STORAGE_KEY);\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nlet activeApp: StackClientApp<true> | null = null;\nlet activeOverlayCleanup: (() => void) | null = null;\nlet openGeneration = 0;\nlet tokenListenerAttached = false;\n\nlet openClickmapOverlayPromise: Promise<typeof OpenClickmapOverlayFn> | null = null;\nfunction loadOpenClickmapOverlay(): Promise<typeof OpenClickmapOverlayFn> {\n  if (!openClickmapOverlayPromise) {\n    openClickmapOverlayPromise = import(\"./clickmap-core\").then(m => m.openClickmapOverlay).catch((err) => {\n      openClickmapOverlayPromise = null;\n      throw err;\n    });\n  }\n  return openClickmapOverlayPromise;\n}\n\nfunction tryOpenOverlay() {\n  // Already open: the panel listens for the token event itself and refetches.\n  if (activeOverlayCleanup || !activeApp || !canMountIntoDom()) return;\n\n  const generation = ++openGeneration;\n  const app = activeApp;\n\n  runAsynchronously(async () => {\n    const openClickmapOverlay = await loadOpenClickmapOverlay();\n    if (generation !== openGeneration) return;\n    if (activeOverlayCleanup || activeApp !== app || !canMountIntoDom()) return;\n    activeOverlayCleanup = openClickmapOverlay(app, () => {\n      activeOverlayCleanup = null;\n    });\n  }, {\n    noErrorLogging: true,\n    onError: (error) => {\n      captureError(\"clickmap-mount\", error);\n    },\n  });\n}\n\n/**\n * Mounts the clickmap overlay listener on the page.\n *\n * The clickmap is fully independent from the dev tool. It has no ambient UI:\n * nothing renders until a dashboard-minted token is handed over (the\n * CLICKMAP_OVERLAY_TOKEN_UPDATED event fired by the dashboard's console\n * snippet) or a navigation-resume sentinel is present — only then is the\n * actual overlay code lazily loaded and shown.\n */\nexport function mountClickmapOverlay(app: StackClientApp<true>): () => void {\n  activeApp = app;\n\n  if (typeof window !== 'undefined' && !tokenListenerAttached) {\n    tokenListenerAttached = true;\n    window.addEventListener(CLICKMAP_OVERLAY_TOKEN_UPDATED_EVENT, tryOpenOverlay);\n  }\n\n  if (canMountIntoDom() && consumeResumeSentinel()) {\n    tryOpenOverlay();\n  }\n\n  return () => {\n    if (activeApp !== app) return;\n    activeApp = null;\n    openGeneration++;\n    activeOverlayCleanup?.();\n  };\n}\n\n"],"mappings":";;;;;;AAkBA,SAAS,wBAAiC;AACxC,KAAI;AACF,MAAI,eAAe,QAAQ,oCAAoC,KAAK,IAAK,QAAO;AAChF,iBAAe,WAAW,oCAAoC;AAC9D,SAAO;SACD;AACN,SAAO;;;AAIX,IAAI,YAAyC;AAC7C,IAAI,uBAA4C;AAChD,IAAI,iBAAiB;AACrB,IAAI,wBAAwB;AAE5B,IAAI,6BAA2E;AAC/E,SAAS,0BAAiE;AACxE,KAAI,CAAC,2BACH,8BAA6B,OAAO,sBAAmB,MAAK,MAAK,EAAE,oBAAoB,CAAC,OAAO,QAAQ;AACrG,+BAA6B;AAC7B,QAAM;GACN;AAEJ,QAAO;;AAGT,SAAS,iBAAiB;AAExB,KAAI,wBAAwB,CAAC,aAAa,CAAC,iBAAiB,CAAE;CAE9D,MAAM,aAAa,EAAE;CACrB,MAAM,MAAM;AAEZ,mBAAkB,YAAY;EAC5B,MAAM,sBAAsB,MAAM,yBAAyB;AAC3D,MAAI,eAAe,eAAgB;AACnC,MAAI,wBAAwB,cAAc,OAAO,CAAC,iBAAiB,CAAE;AACrE,yBAAuB,oBAAoB,WAAW;AACpD,0BAAuB;IACvB;IACD;EACD,gBAAgB;EAChB,UAAU,UAAU;AAClB,gBAAa,kBAAkB,MAAM;;EAExC,CAAC;;;;;;;;;;;AAYJ,SAAgB,qBAAqB,KAAuC;AAC1E,aAAY;AAEZ,KAAI,OAAO,WAAW,eAAe,CAAC,uBAAuB;AAC3D,0BAAwB;AACxB,SAAO,iBAAiB,sCAAsC,eAAe;;AAG/E,KAAI,iBAAiB,IAAI,uBAAuB,CAC9C,iBAAgB;AAGlB,cAAa;AACX,MAAI,cAAc,IAAK;AACvB,cAAY;AACZ;AACA,0BAAwB"}

package/dist/esm/components/api-key-dialogs.js

@@ -1,9 +1,9 @@
 'use client';
 
+import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
+import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { yupObject, yupString } from "@hexclave/shared/dist/schema-fields";
-import { captureError } from "@hexclave/shared/dist/utils/errors";
-import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
 import { ActionDialog, Button, CopyField, Input, Label, Typography } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components/credential-sign-in.js

@@ -1,8 +1,8 @@
 'use client';
 
+import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { passwordSchema, strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, Label, PasswordInput } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components/credential-sign-up.js

@@ -1,8 +1,8 @@
 'use client';
 
+import { runAsynchronously, runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { passwordSchema, strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronously, runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, Label, PasswordInput } from "@hexclave/ui";
 import React, { useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components/magic-link-sign-in.js

@@ -1,8 +1,8 @@
 'use client';
 
+import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, InputOTP, InputOTPGroup, InputOTPSlot, Label, Typography } from "@hexclave/ui";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components/team-switcher.js

@@ -1,7 +1,7 @@
 'use client';
 
-import { HexclaveAssertionError } from "@hexclave/shared/dist/utils/errors";
 import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
+import { HexclaveAssertionError } from "@hexclave/shared/dist/utils/errors";
 import { Button, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Skeleton, Typography, cn } from "@hexclave/ui";
 import { Suspense, useMemo } from "react";
 import { useStackApp, useUser } from "../index.js";

package/dist/esm/components-page/account-settings/active-sessions/active-sessions-page.js

@@ -1,5 +1,5 @@
-import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
+import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { ActionCell, Badge, Button, Skeleton, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Typography } from "@hexclave/ui";
 import { useEffect, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/esm/components-page/account-settings/email-and-auth/emails-section.js

@@ -1,6 +1,6 @@
+import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
 import { ActionCell, Badge, Button, Input, Table, TableBody, TableCell, TableRow, Typography } from "@hexclave/ui";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components-page/account-settings/email-and-auth/mfa-section.js

@@ -1,5 +1,5 @@
-import { throwErr } from "@hexclave/shared/dist/utils/errors";
 import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
+import { throwErr } from "@hexclave/shared/dist/utils/errors";
 import { Button, Input, Typography } from "@hexclave/ui";
 import { useEffect, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/esm/components-page/account-settings/email-and-auth/password-section.js

@@ -1,6 +1,6 @@
+import { runAsynchronously, runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { passwordSchema, yupObject, yupString } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronously, runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, Label, PasswordInput, Typography } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components-page/account-settings/teams/team-creation-page.js

@@ -1,6 +1,6 @@
+import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { yupObject, yupString } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components-page/account-settings/teams/team-member-invitation-section.js

@@ -1,6 +1,6 @@
+import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Typography } from "@hexclave/ui";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components-page/auth-page.js

@@ -1,7 +1,7 @@
 'use client';
 
-import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
+import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { Skeleton, Tabs, TabsContent, TabsList, TabsTrigger, Typography, cn } from "@hexclave/ui";
 import { Suspense, useMemo } from "react";
 import { useStackApp, useUser } from "../index.js";

package/dist/esm/components-page/cli-auth-confirm.js

@@ -1,13 +1,13 @@
 'use client';
 
 import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
+import { hexclaveAppInternalsSymbol } from "../lib/hexclave-app/common.js";
 import { Typography } from "@hexclave/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { useTranslation } from "../lib/translations.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useStackApp } from "../lib/hooks.js";
 import { MessageCard } from "../components/message-cards/message-card.js";
-import { hexclaveAppInternalsSymbol } from "../lib/hexclave-app/common.js";
 
 //#region src/components-page/cli-auth-confirm.tsx
 async function postCliAuthComplete(app, body) {

package/dist/esm/components-page/cli-auth-confirm.test.js

@@ -1,9 +1,9 @@
 import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
+import { hexclaveAppInternalsSymbol } from "../lib/hexclave-app/common.js";
 import React, { act } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createRoot } from "react-dom/client";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-import { hexclaveAppInternalsSymbol } from "../lib/hexclave-app/common.js";
 import { HexclaveContext } from "../providers/hexclave-context.js";
 import { useCliAuthConfirmation } from "./cli-auth-confirm.js";
 

package/dist/esm/components-page/forgot-password.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"forgot-password.d.ts","names":[],"sources":["../../../src/components-page/forgot-password.tsx"],"mappings":";;;iBAqBgB,kBAAA,CAAA;EAAqB;AAAA;EAAY,MAAA;AAAA,IAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAgDtD,cAAA,CAAe,KAAA;EAAS,QAAA;AAAA,IAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"forgot-password.d.ts","names":[],"sources":["../../../src/components-page/forgot-password.tsx"],"mappings":";;;iBAqBgB,kBAAA,CAAA;EAAqB;AAAA;EAAY,MAAA;AAAA,IAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBA+CtD,cAAA,CAAe,KAAA;EAAS,QAAA;AAAA,IAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/esm/components-page/forgot-password.js

@@ -1,8 +1,8 @@
 'use client';
 
+import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, Label, Typography, cn } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
@@ -44,8 +44,7 @@ function ForgotPasswordForm({ onSent }) {
 				id: "email",
 				type: "email",
 				autoComplete: "email",
-				...register("email"),
-				onChange: () => clearErrors("email")
+				...register("email", { onChange: () => clearErrors("email") })
 			}),
 			/* @__PURE__ */ jsx(FormWarningText, { text: errors.email?.message?.toString() }),
 			/* @__PURE__ */ jsx(Button, {

package/dist/esm/components-page/forgot-password.js.map

@@ -1 +1 @@
-{"version":3,"file":"forgot-password.js","names":[],"sources":["../../../src/components-page/forgot-password.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport { strictEmailSchema, yupObject } from \"@hexclave/shared/dist/schema-fields\";\nimport { runAsynchronouslyWithAlert } from \"@hexclave/shared/dist/utils/promises\";\nimport { Button, Input, Label, Typography, cn } from \"@hexclave/ui\";\nimport { useState } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport * as yup from \"yup\";\nimport { useStackApp, useUser } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { StyledLink } from \"../components/link\";\nimport { PredefinedMessageCard } from \"../components/message-cards/predefined-message-card\";\nimport { useTranslation } from \"../lib/translations\";\n\nexport function ForgotPasswordForm({ onSent }: { onSent?: () => void }) {\n  const { t } = useTranslation();\n\n  const schema = yupObject({\n    email: strictEmailSchema(t(\"Please enter a valid email\")).defined().nonEmpty(t(\"Please enter your email\"))\n  });\n\n  const { register, handleSubmit, formState: { errors }, clearErrors } = useForm({\n    resolver: yupResolver(schema)\n  });\n  const hexclaveApp = useStackApp();\n  const [loading, setLoading] = useState(false);\n\n  const onSubmit = async (data: yup.InferType<typeof schema>) => {\n    setLoading(true);\n    try {\n      const { email } = data;\n      await hexclaveApp.sendForgotPasswordEmail(email);\n    onSent?.();\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    <form\n      className=\"flex flex-col items-stretch stack-scope\"\n      onSubmit={e => runAsynchronouslyWithAlert(handleSubmit(onSubmit)(e))}\n      noValidate\n    >\n      <Label htmlFor=\"email\" className=\"mb-1\">{t(\"Your Email\")}</Label>\n      <Input\n        id=\"email\"\n        type=\"email\"\n        autoComplete=\"email\"\n        {...register('email')}\n        onChange={() => clearErrors('email')}\n      />\n      <FormWarningText text={errors.email?.message?.toString()} />\n\n      <Button type=\"submit\" className=\"mt-6\" loading={loading}>\n        {t(\"Send Email\")}\n      </Button>\n    </form>\n  );\n}\n\n\nexport function ForgotPassword(props: { fullPage?: boolean }) {\n  const { t } = useTranslation();\n  const hexclaveApp = useStackApp();\n  const user = useUser();\n  const [sent, setSent] = useState(false);\n\n  if (user) {\n    return <PredefinedMessageCard type='signedIn' fullPage={!!props.fullPage} />;\n  }\n\n  if (sent) {\n    return <PredefinedMessageCard type='emailSent' fullPage={!!props.fullPage} />;\n  }\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className={cn(\n        \"stack-scope max-w-[380px] flex-basis-[380px]\",\n        props.fullPage ? \"p-4\" : \"p-0\"\n      )}>\n        <div className=\"text-center\">\n          <Typography type='h2'>{t(\"Reset Your Password\")}</Typography>\n          <Typography>\n            {t(\"Don't need to reset?\")}{\" \"}\n            <StyledLink href={hexclaveApp.urls['signIn']}>\n              {t(\"Sign in\")}\n            </StyledLink>\n          </Typography>\n        </div>\n        <div className=\"mt-6\">\n          <ForgotPasswordForm onSent={() => setSent(true)} />\n        </div>\n      </div>\n    </MaybeFullPage>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAqBA,SAAgB,mBAAmB,EAAE,UAAmC;CACtE,MAAM,EAAE,MAAM,gBAAgB;CAM9B,MAAM,EAAE,UAAU,cAAc,WAAW,EAAE,UAAU,gBAAgB,QAAQ,EAC7E,UAAU,YALG,UAAU,EACvB,OAAO,kBAAkB,EAAE,6BAA6B,CAAC,CAAC,SAAS,CAAC,SAAS,EAAE,0BAA0B,CAAC,EAC3G,CAAC,CAG6B,EAC9B,CAAC;CACF,MAAM,cAAc,aAAa;CACjC,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,WAAW,OAAO,SAAuC;AAC7D,aAAW,KAAK;AAChB,MAAI;GACF,MAAM,EAAE,UAAU;AAClB,SAAM,YAAY,wBAAwB,MAAM;AAClD,aAAU;YACA;AACR,cAAW,MAAM;;;AAIrB,QACE,qBAAC;EACC,WAAU;EACV,WAAU,MAAK,2BAA2B,aAAa,SAAS,CAAC,EAAE,CAAC;EACpE;;GAEA,oBAAC;IAAM,SAAQ;IAAQ,WAAU;cAAQ,EAAE,aAAa;KAAS;GACjE,oBAAC;IACC,IAAG;IACH,MAAK;IACL,cAAa;IACb,GAAI,SAAS,QAAQ;IACrB,gBAAgB,YAAY,QAAQ;KACpC;GACF,oBAAC,mBAAgB,MAAM,OAAO,OAAO,SAAS,UAAU,GAAI;GAE5D,oBAAC;IAAO,MAAK;IAAS,WAAU;IAAgB;cAC7C,EAAE,aAAa;KACT;;GACJ;;AAKX,SAAgB,eAAe,OAA+B;CAC5D,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,cAAc,aAAa;CACjC,MAAM,OAAO,SAAS;CACtB,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;AAEvC,KAAI,KACF,QAAO,oBAAC;EAAsB,MAAK;EAAW,UAAU,CAAC,CAAC,MAAM;GAAY;AAG9E,KAAI,KACF,QAAO,oBAAC;EAAsB,MAAK;EAAY,UAAU,CAAC,CAAC,MAAM;GAAY;AAG/E,QACE,oBAAC;EAAc,UAAU,CAAC,CAAC,MAAM;YAC/B,qBAAC;GAAI,WAAW,GACd,gDACA,MAAM,WAAW,QAAQ,MAC1B;cACC,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAW,MAAK;eAAM,EAAE,sBAAsB;MAAc,EAC7D,qBAAC;KACE,EAAE,uBAAuB;KAAE;KAC5B,oBAAC;MAAW,MAAM,YAAY,KAAK;gBAChC,EAAE,UAAU;OACF;QACF;KACT,EACN,oBAAC;IAAI,WAAU;cACb,oBAAC,sBAAmB,cAAc,QAAQ,KAAK,GAAI;KAC/C;IACF;GACQ"}
+{"version":3,"file":"forgot-password.js","names":[],"sources":["../../../src/components-page/forgot-password.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport { strictEmailSchema, yupObject } from \"@hexclave/shared/dist/schema-fields\";\nimport { runAsynchronouslyWithAlert } from \"@hexclave/shared/dist/utils/promises\";\nimport { Button, Input, Label, Typography, cn } from \"@hexclave/ui\";\nimport { useState } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport * as yup from \"yup\";\nimport { useStackApp, useUser } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { StyledLink } from \"../components/link\";\nimport { PredefinedMessageCard } from \"../components/message-cards/predefined-message-card\";\nimport { useTranslation } from \"../lib/translations\";\n\nexport function ForgotPasswordForm({ onSent }: { onSent?: () => void }) {\n  const { t } = useTranslation();\n\n  const schema = yupObject({\n    email: strictEmailSchema(t(\"Please enter a valid email\")).defined().nonEmpty(t(\"Please enter your email\"))\n  });\n\n  const { register, handleSubmit, formState: { errors }, clearErrors } = useForm({\n    resolver: yupResolver(schema)\n  });\n  const hexclaveApp = useStackApp();\n  const [loading, setLoading] = useState(false);\n\n  const onSubmit = async (data: yup.InferType<typeof schema>) => {\n    setLoading(true);\n    try {\n      const { email } = data;\n      await hexclaveApp.sendForgotPasswordEmail(email);\n    onSent?.();\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    <form\n      className=\"flex flex-col items-stretch stack-scope\"\n      onSubmit={e => runAsynchronouslyWithAlert(handleSubmit(onSubmit)(e))}\n      noValidate\n    >\n      <Label htmlFor=\"email\" className=\"mb-1\">{t(\"Your Email\")}</Label>\n      <Input\n        id=\"email\"\n        type=\"email\"\n        autoComplete=\"email\"\n        {...register('email', { onChange: () => clearErrors('email') })}\n      />\n      <FormWarningText text={errors.email?.message?.toString()} />\n\n      <Button type=\"submit\" className=\"mt-6\" loading={loading}>\n        {t(\"Send Email\")}\n      </Button>\n    </form>\n  );\n}\n\n\nexport function ForgotPassword(props: { fullPage?: boolean }) {\n  const { t } = useTranslation();\n  const hexclaveApp = useStackApp();\n  const user = useUser();\n  const [sent, setSent] = useState(false);\n\n  if (user) {\n    return <PredefinedMessageCard type='signedIn' fullPage={!!props.fullPage} />;\n  }\n\n  if (sent) {\n    return <PredefinedMessageCard type='emailSent' fullPage={!!props.fullPage} />;\n  }\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className={cn(\n        \"stack-scope max-w-[380px] flex-basis-[380px]\",\n        props.fullPage ? \"p-4\" : \"p-0\"\n      )}>\n        <div className=\"text-center\">\n          <Typography type='h2'>{t(\"Reset Your Password\")}</Typography>\n          <Typography>\n            {t(\"Don't need to reset?\")}{\" \"}\n            <StyledLink href={hexclaveApp.urls['signIn']}>\n              {t(\"Sign in\")}\n            </StyledLink>\n          </Typography>\n        </div>\n        <div className=\"mt-6\">\n          <ForgotPasswordForm onSent={() => setSent(true)} />\n        </div>\n      </div>\n    </MaybeFullPage>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAqBA,SAAgB,mBAAmB,EAAE,UAAmC;CACtE,MAAM,EAAE,MAAM,gBAAgB;CAM9B,MAAM,EAAE,UAAU,cAAc,WAAW,EAAE,UAAU,gBAAgB,QAAQ,EAC7E,UAAU,YALG,UAAU,EACvB,OAAO,kBAAkB,EAAE,6BAA6B,CAAC,CAAC,SAAS,CAAC,SAAS,EAAE,0BAA0B,CAAC,EAC3G,CAAC,CAG6B,EAC9B,CAAC;CACF,MAAM,cAAc,aAAa;CACjC,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,WAAW,OAAO,SAAuC;AAC7D,aAAW,KAAK;AAChB,MAAI;GACF,MAAM,EAAE,UAAU;AAClB,SAAM,YAAY,wBAAwB,MAAM;AAClD,aAAU;YACA;AACR,cAAW,MAAM;;;AAIrB,QACE,qBAAC;EACC,WAAU;EACV,WAAU,MAAK,2BAA2B,aAAa,SAAS,CAAC,EAAE,CAAC;EACpE;;GAEA,oBAAC;IAAM,SAAQ;IAAQ,WAAU;cAAQ,EAAE,aAAa;KAAS;GACjE,oBAAC;IACC,IAAG;IACH,MAAK;IACL,cAAa;IACb,GAAI,SAAS,SAAS,EAAE,gBAAgB,YAAY,QAAQ,EAAE,CAAC;KAC/D;GACF,oBAAC,mBAAgB,MAAM,OAAO,OAAO,SAAS,UAAU,GAAI;GAE5D,oBAAC;IAAO,MAAK;IAAS,WAAU;IAAgB;cAC7C,EAAE,aAAa;KACT;;GACJ;;AAKX,SAAgB,eAAe,OAA+B;CAC5D,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,cAAc,aAAa;CACjC,MAAM,OAAO,SAAS;CACtB,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;AAEvC,KAAI,KACF,QAAO,oBAAC;EAAsB,MAAK;EAAW,UAAU,CAAC,CAAC,MAAM;GAAY;AAG9E,KAAI,KACF,QAAO,oBAAC;EAAsB,MAAK;EAAY,UAAU,CAAC,CAAC,MAAM;GAAY;AAG/E,QACE,oBAAC;EAAc,UAAU,CAAC,CAAC,MAAM;YAC/B,qBAAC;GAAI,WAAW,GACd,gDACA,MAAM,WAAW,QAAQ,MAC1B;cACC,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAW,MAAK;eAAM,EAAE,sBAAsB;MAAc,EAC7D,qBAAC;KACE,EAAE,uBAAuB;KAAE;KAC5B,oBAAC;MAAW,MAAM,YAAY,KAAK;gBAChC,EAAE,UAAU;OACF;QACF;KACT,EACN,oBAAC;IAAI,WAAU;cACb,oBAAC,sBAAmB,cAAc,QAAQ,KAAK,GAAI;KAC/C;IACF;GACQ"}

package/dist/esm/components-page/hexclave-handler-client.d.ts

@@ -1,6 +1,6 @@
 import { KnownError } from "@hexclave/shared";
-import { SignIn, SignUp } from "..";
 import { HandlerUrls, StackClientApp } from "../lib/hexclave-app";
+import { SignIn, SignUp } from "..";
 import { AccountSettings } from "./account-settings";
 import { CliAuthConfirmation } from "./cli-auth-confirm";
 import { EmailVerification } from "./email-verification";

package/dist/esm/components-page/mfa.js

@@ -126,22 +126,17 @@ function MFA(props) {
 	const { t } = useTranslation();
 	const headerText = t("Multi-Factor Authentication");
 	const instructionText = t("Enter the six-digit code from your authenticator app");
-	if (props.fullPage) return /* @__PURE__ */ jsx(MaybeFullPage, {
-		fullPage: true,
+	return /* @__PURE__ */ jsx(MaybeFullPage, {
+		fullPage: !!props.fullPage,
 		children: /* @__PURE__ */ jsxs("div", {
-			className: "stack-scope flex flex-col items-stretch",
-			style: {
-				maxWidth: "380px",
-				flexBasis: "380px",
-				padding: "1rem"
-			},
+			className: cn("stack-scope max-w-[380px] flex-basis-[380px]", props.fullPage ? "p-4" : "p-0"),
 			children: [/* @__PURE__ */ jsxs("div", {
 				className: "text-center mb-6",
 				children: [/* @__PURE__ */ jsx(Typography, {
 					type: "h2",
 					children: headerText
 				}), /* @__PURE__ */ jsx(Typography, {
-					className: "mt-2",
+					className: "mt-2 text-sm text-muted-foreground",
 					children: instructionText
 				})]
 			}), /* @__PURE__ */ jsx(MfaForm, {
@@ -150,16 +145,6 @@ function MFA(props) {
 			})]
 		})
 	});
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col items-stretch stack-scope",
-		children: [/* @__PURE__ */ jsx(Typography, {
-			className: "mb-4 text-center",
-			children: instructionText
-		}), /* @__PURE__ */ jsx(MfaForm, {
-			onSuccess: props.onSuccess,
-			onCancel: props.onCancel
-		})]
-	});
 }
 
 //#endregion

package/dist/esm/components-page/mfa.js.map

@@ -1 +1 @@
-{"version":3,"file":"mfa.js","names":[],"sources":["../../../src/components-page/mfa.tsx"],"sourcesContent":["\"use client\";\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { KnownErrors } from \"@hexclave/shared\";\nimport {\n  Button,\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  Spinner,\n  Typography,\n  cn,\n} from \"@hexclave/ui\";\nimport { CheckIcon } from \"lucide-react\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { useStackApp } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { useTranslation } from \"../lib/translations\";\n\nfunction MfaForm({ onSuccess, onCancel }: {\n  onSuccess?: () => void,\n  onCancel?: () => void,\n}) {\n  const hexclaveApp = useStackApp();\n  const { t } = useTranslation();\n  const [otp, setOtp] = useState<string>(\"\");\n  const formRef = useRef<HTMLFormElement>(null);\n\n  const [submitting, setSubmitting] = useState<boolean>(false);\n  const [error, setError] = useState<string | null>(null);\n  const [verified, setVerified] = useState<boolean>(false);\n\n  const [attemptCode, setAttemptCode] = useState<string | null>(null);\n\n  useEffect(() => {\n    if (!attemptCode && typeof window !== \"undefined\") {\n      // Hexclave rebrand: prefer the new MFA attempt code key, fall back to the legacy key.\n      const code = window.sessionStorage.getItem(\"hexclave_mfa_attempt_code\") ?? window.sessionStorage.getItem(\"stack_mfa_attempt_code\");\n      if (code) {\n        setAttemptCode(code);\n      }\n    }\n  }, [ attemptCode]);\n\n  // Handle OTP verification when code is complete\n  useEffect(() => {\n    if (otp.length === 6 && !submitting) {\n      // Blur any focused inputs\n      if (document.activeElement instanceof HTMLElement) {\n        document.activeElement.blur();\n      }\n      if (formRef.current) {\n        const inputs = formRef.current.querySelectorAll('input');\n        for (const input of inputs) {\n          input.blur();\n        }\n      }\n\n      setSubmitting(true);\n      setError(null);\n\n      if (attemptCode) {\n        hexclaveApp\n          .signInWithMfa(otp, attemptCode, { noRedirect: true })\n          .then(async (result) => {\n            if (result.status === \"ok\") {\n              setVerified(true);\n\n              // Cleanup session storage\n              if (typeof window !== \"undefined\") {\n                // Hexclave rebrand: remove both the new and legacy MFA attempt code keys.\n                window.sessionStorage.removeItem(\"hexclave_mfa_attempt_code\");\n                window.sessionStorage.removeItem(\"stack_mfa_attempt_code\");\n              }\n\n              if (onSuccess) {\n                onSuccess();\n              } else {\n                await hexclaveApp.redirectToAfterSignIn();\n              }\n            } else {\n              throw result.error;\n            }\n          })\n          .catch((e) => {\n            if (e instanceof KnownErrors.InvalidTotpCode) {\n              setError(t(\"Invalid TOTP code\"));\n            } else {\n              setError(t(\"Verification failed\"));\n            }\n          })\n          .finally(() => {\n            setSubmitting(false);\n            if (!verified) {\n              setOtp(\"\");\n            }\n          });\n      } else {\n        setSubmitting(false);\n        setError(t(\"Missing verification information\"));\n      }\n    }\n\n    // Clear error when user is typing\n    if (otp.length !== 0 && otp.length !== 6) {\n      setError(null);\n    }\n  }, [otp, submitting, onSuccess, attemptCode, hexclaveApp, t, verified]);\n\n\n  const inputStyleClass = useMemo(() => {\n    if (verified) {\n      return \"opacity-85 transition-all duration-300\";\n    }\n\n    if (error) {\n      return \"ring-red-500 border-red-500\";\n    }\n\n    return \"focus:ring-primary/50\";\n  }, [error, verified]);\n\n  return (\n    <div className=\"flex flex-col items-stretch stack-scope\">\n      <form ref={formRef} className=\"w-full flex flex-col items-center gap-4\">\n        <InputOTP\n          maxLength={6}\n          type=\"text\"\n          inputMode=\"numeric\"\n          placeholder=\"······\"\n          value={otp}\n          onChange={(value) => setOtp(value.toUpperCase())}\n          disabled={submitting || verified}\n        >\n          <InputOTPGroup>\n            {[0, 1, 2, 3, 4, 5].map((index) => (\n              <InputOTPSlot\n                key={index}\n                index={index}\n                size=\"lg\"\n                className={cn(\n                  \"border focus:ring-2 transition-all\",\n                  inputStyleClass,\n                )}\n              />\n            ))}\n          </InputOTPGroup>\n        </InputOTP>\n\n        {/* Verification Status */}\n        <div className=\"h-8 flex flex-col gap-4 items-center justify-center w-full\">\n          {verified ? (\n            <div className=\"flex items-center gap-2 animate-in fade-in duration-300 slide-in-from-bottom-2\">\n              <CheckIcon className=\"w-5 h-5 text-green-600 animate-in zoom-in duration-300\" />\n              <Typography className=\"text-sm font-medium\">{t(\"Verified! Redirecting...\")}</Typography>\n            </div>\n          ) : submitting ? (\n            <div className=\"flex items-center gap-2\">\n              <Spinner className=\"text-primary h-4 w-4\" />\n              <Typography className=\"text-sm\">{t(\"Verifying...\")}</Typography>\n            </div>\n          ) : null}\n\n          {/* Error reporting */}\n          {error !== null && !submitting && !verified ? <FormWarningText text={error} /> : null}\n        </div>\n      </form>\n\n      {/* Cancel Button */}\n      {onCancel && !verified && (\n        <Button\n          variant=\"link\"\n          onClick={onCancel}\n          className=\"underline mt-4 self-center\"\n          disabled={submitting || verified}\n        >\n          {t(\"Cancel\")}\n        </Button>\n      )}\n    </div>\n  );\n}\n\nexport function MFA(props: {\n  fullPage?: boolean,\n  onSuccess?: () => void,\n  onCancel?: () => void,\n}) {\n  const { t } = useTranslation();\n\n  const headerText = t(\"Multi-Factor Authentication\");\n  const instructionText = t(\"Enter the six-digit code from your authenticator app\");\n\n  if (props.fullPage) {\n    return (\n      <MaybeFullPage fullPage={true}>\n        <div\n          className=\"stack-scope flex flex-col items-stretch\"\n          style={{ maxWidth: \"380px\", flexBasis: \"380px\", padding: \"1rem\" }}\n        >\n          <div className=\"text-center mb-6\">\n            <Typography type=\"h2\">{headerText}</Typography>\n            <Typography className=\"mt-2\">{instructionText}</Typography>\n          </div>\n          <MfaForm onSuccess={props.onSuccess} onCancel={props.onCancel} />\n        </div>\n      </MaybeFullPage>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col items-stretch stack-scope\">\n      <Typography className=\"mb-4 text-center\">{instructionText}</Typography>\n      <MfaForm onSuccess={props.onSuccess} onCancel={props.onCancel} />\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"mfa.js","names":[],"sources":["../../../src/components-page/mfa.tsx"],"sourcesContent":["\"use client\";\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { KnownErrors } from \"@hexclave/shared\";\nimport {\n  Button,\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  Spinner,\n  Typography,\n  cn,\n} from \"@hexclave/ui\";\nimport { CheckIcon } from \"lucide-react\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { useStackApp } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { useTranslation } from \"../lib/translations\";\n\nfunction MfaForm({ onSuccess, onCancel }: {\n  onSuccess?: () => void,\n  onCancel?: () => void,\n}) {\n  const hexclaveApp = useStackApp();\n  const { t } = useTranslation();\n  const [otp, setOtp] = useState<string>(\"\");\n  const formRef = useRef<HTMLFormElement>(null);\n\n  const [submitting, setSubmitting] = useState<boolean>(false);\n  const [error, setError] = useState<string | null>(null);\n  const [verified, setVerified] = useState<boolean>(false);\n\n  const [attemptCode, setAttemptCode] = useState<string | null>(null);\n\n  useEffect(() => {\n    if (!attemptCode && typeof window !== \"undefined\") {\n      // Hexclave rebrand: prefer the new MFA attempt code key, fall back to the legacy key.\n      const code = window.sessionStorage.getItem(\"hexclave_mfa_attempt_code\") ?? window.sessionStorage.getItem(\"stack_mfa_attempt_code\");\n      if (code) {\n        setAttemptCode(code);\n      }\n    }\n  }, [ attemptCode]);\n\n  // Handle OTP verification when code is complete\n  useEffect(() => {\n    if (otp.length === 6 && !submitting) {\n      // Blur any focused inputs\n      if (document.activeElement instanceof HTMLElement) {\n        document.activeElement.blur();\n      }\n      if (formRef.current) {\n        const inputs = formRef.current.querySelectorAll('input');\n        for (const input of inputs) {\n          input.blur();\n        }\n      }\n\n      setSubmitting(true);\n      setError(null);\n\n      if (attemptCode) {\n        hexclaveApp\n          .signInWithMfa(otp, attemptCode, { noRedirect: true })\n          .then(async (result) => {\n            if (result.status === \"ok\") {\n              setVerified(true);\n\n              // Cleanup session storage\n              if (typeof window !== \"undefined\") {\n                // Hexclave rebrand: remove both the new and legacy MFA attempt code keys.\n                window.sessionStorage.removeItem(\"hexclave_mfa_attempt_code\");\n                window.sessionStorage.removeItem(\"stack_mfa_attempt_code\");\n              }\n\n              if (onSuccess) {\n                onSuccess();\n              } else {\n                await hexclaveApp.redirectToAfterSignIn();\n              }\n            } else {\n              throw result.error;\n            }\n          })\n          .catch((e) => {\n            if (e instanceof KnownErrors.InvalidTotpCode) {\n              setError(t(\"Invalid TOTP code\"));\n            } else {\n              setError(t(\"Verification failed\"));\n            }\n          })\n          .finally(() => {\n            setSubmitting(false);\n            if (!verified) {\n              setOtp(\"\");\n            }\n          });\n      } else {\n        setSubmitting(false);\n        setError(t(\"Missing verification information\"));\n      }\n    }\n\n    // Clear error when user is typing\n    if (otp.length !== 0 && otp.length !== 6) {\n      setError(null);\n    }\n  }, [otp, submitting, onSuccess, attemptCode, hexclaveApp, t, verified]);\n\n\n  const inputStyleClass = useMemo(() => {\n    if (verified) {\n      return \"opacity-85 transition-all duration-300\";\n    }\n\n    if (error) {\n      return \"ring-red-500 border-red-500\";\n    }\n\n    return \"focus:ring-primary/50\";\n  }, [error, verified]);\n\n  return (\n    <div className=\"flex flex-col items-stretch stack-scope\">\n      <form ref={formRef} className=\"w-full flex flex-col items-center gap-4\">\n        <InputOTP\n          maxLength={6}\n          type=\"text\"\n          inputMode=\"numeric\"\n          placeholder=\"······\"\n          value={otp}\n          onChange={(value) => setOtp(value.toUpperCase())}\n          disabled={submitting || verified}\n        >\n          <InputOTPGroup>\n            {[0, 1, 2, 3, 4, 5].map((index) => (\n              <InputOTPSlot\n                key={index}\n                index={index}\n                size=\"lg\"\n                className={cn(\n                  \"border focus:ring-2 transition-all\",\n                  inputStyleClass,\n                )}\n              />\n            ))}\n          </InputOTPGroup>\n        </InputOTP>\n\n        {/* Verification Status */}\n        <div className=\"h-8 flex flex-col gap-4 items-center justify-center w-full\">\n          {verified ? (\n            <div className=\"flex items-center gap-2 animate-in fade-in duration-300 slide-in-from-bottom-2\">\n              <CheckIcon className=\"w-5 h-5 text-green-600 animate-in zoom-in duration-300\" />\n              <Typography className=\"text-sm font-medium\">{t(\"Verified! Redirecting...\")}</Typography>\n            </div>\n          ) : submitting ? (\n            <div className=\"flex items-center gap-2\">\n              <Spinner className=\"text-primary h-4 w-4\" />\n              <Typography className=\"text-sm\">{t(\"Verifying...\")}</Typography>\n            </div>\n          ) : null}\n\n          {/* Error reporting */}\n          {error !== null && !submitting && !verified ? <FormWarningText text={error} /> : null}\n        </div>\n      </form>\n\n      {/* Cancel Button */}\n      {onCancel && !verified && (\n        <Button\n          variant=\"link\"\n          onClick={onCancel}\n          className=\"underline mt-4 self-center\"\n          disabled={submitting || verified}\n        >\n          {t(\"Cancel\")}\n        </Button>\n      )}\n    </div>\n  );\n}\n\nexport function MFA(props: {\n  fullPage?: boolean,\n  onSuccess?: () => void,\n  onCancel?: () => void,\n}) {\n  const { t } = useTranslation();\n\n  const headerText = t(\"Multi-Factor Authentication\");\n  const instructionText = t(\"Enter the six-digit code from your authenticator app\");\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className={cn(\n        \"stack-scope max-w-[380px] flex-basis-[380px]\",\n        props.fullPage ? \"p-4\" : \"p-0\"\n      )}>\n        <div className=\"text-center mb-6\">\n          <Typography type=\"h2\">{headerText}</Typography>\n          <Typography className=\"mt-2 text-sm text-muted-foreground\">{instructionText}</Typography>\n        </div>\n        <MfaForm onSuccess={props.onSuccess} onCancel={props.onCancel} />\n      </div>\n    </MaybeFullPage>\n  );\n}\n"],"mappings":"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"}

package/dist/esm/components-page/oauth-callback.js

@@ -1,7 +1,7 @@
 'use client';
 
-import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { runAsynchronously } from "@hexclave/shared/dist/utils/promises";
+import { captureError } from "@hexclave/shared/dist/utils/errors";
 import { Spinner, cn } from "@hexclave/ui";
 import { useEffect, useRef, useState } from "react";
 import { useStackApp } from "../index.js";

package/dist/esm/components-page/onboarding.js

@@ -1,8 +1,8 @@
 'use client';
 
+import { runAsynchronously, runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { strictEmailSchema, yupObject } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronously, runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Input, Typography } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";

package/dist/esm/components-page/password-reset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"password-reset.d.ts","names":[],"sources":["../../../src/components-page/password-reset.tsx"],"mappings":";;;iBAyBwB,iBAAA,CAAkB,KAAA;EACxC,IAAA;EACA,QAAA;AAAA,IACD,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBA4Ge,aAAA,CAAA;EACd,YAAA;EACA;AAAA;EAEA,YAAA,EAAc,MAAA;EACd,QAAA;AAAA,IACD,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"password-reset.d.ts","names":[],"sources":["../../../src/components-page/password-reset.tsx"],"mappings":";;;iBAyBwB,iBAAA,CAAkB,KAAA;EACxC,IAAA;EACA,QAAA;AAAA,IACD,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBA0Ge,aAAA,CAAA;EACd,YAAA;EACA;AAAA;EAEA,YAAA,EAAc,MAAA;EACd,QAAA;AAAA,IACD,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/esm/components-page/password-reset.js

@@ -1,8 +1,8 @@
 'use client';
 
+import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { passwordSchema, yupObject, yupString } from "@hexclave/shared/dist/schema-fields";
-import { runAsynchronouslyWithAlert } from "@hexclave/shared/dist/utils/promises";
 import { Button, Label, PasswordInput, Typography, cn } from "@hexclave/ui";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
@@ -85,11 +85,10 @@ function PasswordResetForm(props) {
 					/* @__PURE__ */ jsx(PasswordInput, {
 						id: "password",
 						autoComplete: "new-password",
-						...register("password"),
-						onChange: () => {
+						...register("password", { onChange: () => {
 							clearErrors("password");
 							clearErrors("passwordRepeat");
-						}
+						} })
 					}),
 					/* @__PURE__ */ jsx(FormWarningText, { text: errors.password?.message?.toString() }),
 					/* @__PURE__ */ jsx(Label, {
@@ -100,11 +99,10 @@ function PasswordResetForm(props) {
 					/* @__PURE__ */ jsx(PasswordInput, {
 						id: "repeat-password",
 						autoComplete: "new-password",
-						...register("passwordRepeat"),
-						onChange: () => {
+						...register("passwordRepeat", { onChange: () => {
 							clearErrors("password");
 							clearErrors("passwordRepeat");
-						}
+						} })
 					}),
 					/* @__PURE__ */ jsx(FormWarningText, { text: errors.passwordRepeat?.message?.toString() }),
 					/* @__PURE__ */ jsx(Button, {

package/dist/esm/components-page/password-reset.js.map

@@ -1 +1 @@
-{"version":3,"file":"password-reset.js","names":["MessageCard"],"sources":["../../../src/components-page/password-reset.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport { KnownErrors } from \"@hexclave/shared\";\nimport { getPasswordError } from \"@hexclave/shared/dist/helpers/password\";\nimport { passwordSchema, yupObject, yupString } from \"@hexclave/shared/dist/schema-fields\";\nimport { cacheFunction } from \"@hexclave/shared/dist/utils/caches\";\nimport { runAsynchronouslyWithAlert } from \"@hexclave/shared/dist/utils/promises\";\nimport { use } from \"@hexclave/shared/dist/utils/react\";\nimport { Button, Label, PasswordInput, Typography, cn } from \"@hexclave/ui\";\nimport { useState } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport * as yup from \"yup\";\nimport { StackClientApp, useStackApp } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { MessageCard } from \"../components/message-cards/message-card\";\nimport { PredefinedMessageCard } from \"../components/message-cards/predefined-message-card\";\nimport { useTranslation } from \"../lib/translations\";\n\nexport default function PasswordResetForm(props: {\n  code: string,\n  fullPage?: boolean,\n}) {\n  const { t } = useTranslation();\n\n  const schema = yupObject({\n    password: passwordSchema.defined(t(\"Please enter your password\")).nonEmpty(t(\"Please enter your password\")).test({\n      name: 'is-valid-password',\n      test: (value, ctx) => {\n        const error = getPasswordError(value);\n        if (error) {\n          return ctx.createError({ message: error.message });\n        } else {\n          return true;\n        }\n      }\n    }),\n    passwordRepeat: yupString().nullable().oneOf([yup.ref('password'), null], t(\"Passwords do not match\")).defined().nonEmpty(t(\"Please repeat your password\"))\n  });\n\n  const { register, handleSubmit, formState: { errors }, clearErrors } = useForm({\n    resolver: yupResolver(schema)\n  });\n  const hexclaveApp = useStackApp();\n  const [finished, setFinished] = useState(false);\n  const [resetError, setResetError] = useState(false);\n  const [loading, setLoading] = useState(false);\n\n  const onSubmit = async (data: yup.InferType<typeof schema>) => {\n    setLoading(true);\n    try {\n      const { password } = data;\n      const result = await hexclaveApp.resetPassword({ password, code: props.code });\n      if (result.status === 'error') {\n        setResetError(true);\n        return;\n      }\n\n      setFinished(true);\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  if (finished) {\n    return <PredefinedMessageCard type='passwordReset' fullPage={!!props.fullPage} />;\n  }\n\n  if (resetError) {\n    return (\n      <MessageCard title={t(\"Failed to reset password\")} fullPage={!!props.fullPage}>\n        {t(\"Failed to reset password. Please request a new password reset link\")}\n      </MessageCard>\n    );\n  }\n\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className={cn(\n        \"flex flex-col items-stretch max-w-[380px] flex-basis-[380px]\",\n        props.fullPage ? \"p-4\" : \"p-0\"\n      )}>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>{t(\"Reset Your Password\")}</Typography>\n        </div>\n\n        <form\n          className=\"flex flex-col items-stretch\"\n          onSubmit={e => runAsynchronouslyWithAlert(handleSubmit(onSubmit)(e))}\n          noValidate\n        >\n          <Label htmlFor=\"password\" className=\"mb-1\">{t(\"New Password\")}</Label>\n          <PasswordInput\n            id=\"password\"\n            autoComplete=\"new-password\"\n            {...register('password')}\n            onChange={() => {\n              clearErrors('password');\n              clearErrors('passwordRepeat');\n            }}\n          />\n          <FormWarningText text={errors.password?.message?.toString()} />\n\n          <Label htmlFor=\"repeat-password\" className=\"mt-4 mb-1\">{t(\"Repeat New Password\")}</Label>\n          <PasswordInput\n            id=\"repeat-password\"\n            autoComplete=\"new-password\"\n            {...register('passwordRepeat')}\n            onChange={() => {\n              clearErrors('password');\n              clearErrors('passwordRepeat');\n            }}\n          />\n          <FormWarningText text={errors.passwordRepeat?.message?.toString()} />\n\n          <Button type=\"submit\" className=\"mt-6\" loading={loading}>\n            {t(\"Reset Password\")}\n          </Button>\n        </form>\n      </div>\n    </MaybeFullPage>\n  );\n}\n\n\nconst cachedVerifyPasswordResetCode = cacheFunction(async (hexclaveApp: StackClientApp<true>, code: string) => {\n  return await hexclaveApp.verifyPasswordResetCode(code);\n});\n\nexport function PasswordReset({\n  searchParams,\n  fullPage = false,\n}: {\n  searchParams: Record<string, string>,\n  fullPage?: boolean,\n}) {\n  const { t } = useTranslation();\n  const hexclaveApp = useStackApp();\n\n  const invalidJsx = (\n    <MessageCard title={t(\"Invalid Password Reset Link\")} fullPage={fullPage}>\n      <Typography>{t(\"Please double check if you have the correct password reset link.\")}</Typography>\n    </MessageCard>\n  );\n\n  const expiredJsx = (\n    <MessageCard title={t(\"Expired Password Reset Link\")} fullPage={fullPage}>\n      <Typography>{t(\"Your password reset link has expired. Please request a new password reset link from the login page.\")}</Typography>\n    </MessageCard>\n  );\n\n  const usedJsx = (\n    <MessageCard title={t(\"Used Password Reset Link\")} fullPage={fullPage}>\n      <Typography>{t(\"This password reset link has already been used. If you need to reset your password again, please request a new password reset link from the login page.\")}</Typography>\n    </MessageCard>\n  );\n\n  const code = searchParams.code;\n  if (!code) {\n    return invalidJsx;\n  }\n\n  const result = use(cachedVerifyPasswordResetCode(hexclaveApp, code));\n\n  if (result.status === 'error') {\n    if (KnownErrors.VerificationCodeNotFound.isInstance(result.error)) {\n      return invalidJsx;\n    } else if (KnownErrors.VerificationCodeExpired.isInstance(result.error)) {\n      return expiredJsx;\n    } else if (KnownErrors.VerificationCodeAlreadyUsed.isInstance(result.error)) {\n      return usedJsx;\n    } else {\n      throw result.error;\n    }\n  }\n\n  return <PasswordResetForm code={code} fullPage={fullPage} />;\n}\n"],"mappings":"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"}
+{"version":3,"file":"password-reset.js","names":["MessageCard"],"sources":["../../../src/components-page/password-reset.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY UNLESS YOU ALSO EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport { KnownErrors } from \"@hexclave/shared\";\nimport { getPasswordError } from \"@hexclave/shared/dist/helpers/password\";\nimport { passwordSchema, yupObject, yupString } from \"@hexclave/shared/dist/schema-fields\";\nimport { cacheFunction } from \"@hexclave/shared/dist/utils/caches\";\nimport { runAsynchronouslyWithAlert } from \"@hexclave/shared/dist/utils/promises\";\nimport { use } from \"@hexclave/shared/dist/utils/react\";\nimport { Button, Label, PasswordInput, Typography, cn } from \"@hexclave/ui\";\nimport { useState } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport * as yup from \"yup\";\nimport { StackClientApp, useStackApp } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { MessageCard } from \"../components/message-cards/message-card\";\nimport { PredefinedMessageCard } from \"../components/message-cards/predefined-message-card\";\nimport { useTranslation } from \"../lib/translations\";\n\nexport default function PasswordResetForm(props: {\n  code: string,\n  fullPage?: boolean,\n}) {\n  const { t } = useTranslation();\n\n  const schema = yupObject({\n    password: passwordSchema.defined(t(\"Please enter your password\")).nonEmpty(t(\"Please enter your password\")).test({\n      name: 'is-valid-password',\n      test: (value, ctx) => {\n        const error = getPasswordError(value);\n        if (error) {\n          return ctx.createError({ message: error.message });\n        } else {\n          return true;\n        }\n      }\n    }),\n    passwordRepeat: yupString().nullable().oneOf([yup.ref('password'), null], t(\"Passwords do not match\")).defined().nonEmpty(t(\"Please repeat your password\"))\n  });\n\n  const { register, handleSubmit, formState: { errors }, clearErrors } = useForm({\n    resolver: yupResolver(schema)\n  });\n  const hexclaveApp = useStackApp();\n  const [finished, setFinished] = useState(false);\n  const [resetError, setResetError] = useState(false);\n  const [loading, setLoading] = useState(false);\n\n  const onSubmit = async (data: yup.InferType<typeof schema>) => {\n    setLoading(true);\n    try {\n      const { password } = data;\n      const result = await hexclaveApp.resetPassword({ password, code: props.code });\n      if (result.status === 'error') {\n        setResetError(true);\n        return;\n      }\n\n      setFinished(true);\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  if (finished) {\n    return <PredefinedMessageCard type='passwordReset' fullPage={!!props.fullPage} />;\n  }\n\n  if (resetError) {\n    return (\n      <MessageCard title={t(\"Failed to reset password\")} fullPage={!!props.fullPage}>\n        {t(\"Failed to reset password. Please request a new password reset link\")}\n      </MessageCard>\n    );\n  }\n\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className={cn(\n        \"flex flex-col items-stretch max-w-[380px] flex-basis-[380px]\",\n        props.fullPage ? \"p-4\" : \"p-0\"\n      )}>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>{t(\"Reset Your Password\")}</Typography>\n        </div>\n\n        <form\n          className=\"flex flex-col items-stretch\"\n          onSubmit={e => runAsynchronouslyWithAlert(handleSubmit(onSubmit)(e))}\n          noValidate\n        >\n          <Label htmlFor=\"password\" className=\"mb-1\">{t(\"New Password\")}</Label>\n          <PasswordInput\n            id=\"password\"\n            autoComplete=\"new-password\"\n            {...register('password', { onChange: () => {\n              clearErrors('password');\n              clearErrors('passwordRepeat');\n            } })}\n          />\n          <FormWarningText text={errors.password?.message?.toString()} />\n\n          <Label htmlFor=\"repeat-password\" className=\"mt-4 mb-1\">{t(\"Repeat New Password\")}</Label>\n          <PasswordInput\n            id=\"repeat-password\"\n            autoComplete=\"new-password\"\n            {...register('passwordRepeat', { onChange: () => {\n              clearErrors('password');\n              clearErrors('passwordRepeat');\n            } })}\n          />\n          <FormWarningText text={errors.passwordRepeat?.message?.toString()} />\n\n          <Button type=\"submit\" className=\"mt-6\" loading={loading}>\n            {t(\"Reset Password\")}\n          </Button>\n        </form>\n      </div>\n    </MaybeFullPage>\n  );\n}\n\n\nconst cachedVerifyPasswordResetCode = cacheFunction(async (hexclaveApp: StackClientApp<true>, code: string) => {\n  return await hexclaveApp.verifyPasswordResetCode(code);\n});\n\nexport function PasswordReset({\n  searchParams,\n  fullPage = false,\n}: {\n  searchParams: Record<string, string>,\n  fullPage?: boolean,\n}) {\n  const { t } = useTranslation();\n  const hexclaveApp = useStackApp();\n\n  const invalidJsx = (\n    <MessageCard title={t(\"Invalid Password Reset Link\")} fullPage={fullPage}>\n      <Typography>{t(\"Please double check if you have the correct password reset link.\")}</Typography>\n    </MessageCard>\n  );\n\n  const expiredJsx = (\n    <MessageCard title={t(\"Expired Password Reset Link\")} fullPage={fullPage}>\n      <Typography>{t(\"Your password reset link has expired. Please request a new password reset link from the login page.\")}</Typography>\n    </MessageCard>\n  );\n\n  const usedJsx = (\n    <MessageCard title={t(\"Used Password Reset Link\")} fullPage={fullPage}>\n      <Typography>{t(\"This password reset link has already been used. If you need to reset your password again, please request a new password reset link from the login page.\")}</Typography>\n    </MessageCard>\n  );\n\n  const code = searchParams.code;\n  if (!code) {\n    return invalidJsx;\n  }\n\n  const result = use(cachedVerifyPasswordResetCode(hexclaveApp, code));\n\n  if (result.status === 'error') {\n    if (KnownErrors.VerificationCodeNotFound.isInstance(result.error)) {\n      return invalidJsx;\n    } else if (KnownErrors.VerificationCodeExpired.isInstance(result.error)) {\n      return expiredJsx;\n    } else if (KnownErrors.VerificationCodeAlreadyUsed.isInstance(result.error)) {\n      return usedJsx;\n    } else {\n      throw result.error;\n    }\n  }\n\n  return <PasswordResetForm code={code} fullPage={fullPage} />;\n}\n"],"mappings":"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"}