@atlasauth/embed 0.11.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/embed.js +25 -22
  3. package/dist/styles.d.ts +1 -15
  4. package/dist/styles.js +27 -15
  5. package/dist/styles.js.map +1 -1
  6. package/dist/version.d.ts +1 -1
  7. package/dist/version.js +1 -1
  8. package/dist/widget/dom.js +5 -0
  9. package/dist/widget/dom.js.map +1 -1
  10. package/dist/widget.js +4 -0
  11. package/dist/widget.js.map +1 -1
  12. package/package.json +4 -3
package/dist/styles.d.ts CHANGED
@@ -1,17 +1,3 @@
1
- /**
2
- * Minimal, scoped stylesheet for the widget.
3
- *
4
- * Injected once into the document head (keyed by a data attribute so mounting
5
- * two widgets does not duplicate it) rather than an inline `style` per element —
6
- * a single sheet is what a tenant can override with their own CSS, which is the
7
- * whole reason the widget renders in the host DOM instead of an iframe.
8
- *
9
- * Every class is namespaced `atlas-embed-*` so it cannot collide with the host
10
- * page, and every colour/radius/font reads a `--atlas-embed-*` custom property
11
- * with a hard-coded fallback, so the widget looks right the instant it mounts —
12
- * before `GET /v1/appearance` resolves — and re-themes when it does.
13
- */
14
1
  export declare const STYLE_MARKER = "atlas-embed-styles";
15
- export declare const EMBED_CSS = "\n.atlas-embed-root {\n --_bg: var(--atlas-embed-color-background, #ffffff);\n --_card: var(--atlas-embed-color-card, #ffffff);\n --_text: var(--atlas-embed-color-text, #1c1c1f);\n --_primary: var(--atlas-embed-color-primary, #5b5bd6);\n --_on-primary: var(--atlas-embed-color-text-on-primary, #ffffff);\n /* Keyboard focus ring \u2014 a solid outline. The widget sets it to the primary\n adjusted to 3:1 on the card/background (or the page's explicit ring). */\n --_focus: var(--atlas-embed-color-focus-ring, var(--_primary));\n --_border: var(--atlas-embed-color-border, #e4e4e9);\n --_radius: var(--atlas-embed-border-radius, 10px);\n /* Transition tempo \u2014 the widget sets --atlas-embed-motion from motionSpeed and\n to 0s when animations are off; reduced-motion forces 0s below regardless. */\n --_motion: var(--atlas-embed-motion, 0.16s);\n font-family: var(--atlas-embed-font-family, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif);\n color: var(--_text);\n box-sizing: border-box;\n display: block;\n}\n.atlas-embed-root *, .atlas-embed-root *::before, .atlas-embed-root *::after { box-sizing: border-box; }\n.atlas-embed-card {\n max-width: 400px;\n margin: 0 auto;\n padding: 28px 26px;\n background: var(--_card);\n border: 1px solid var(--_border);\n border-radius: calc(var(--_radius) + 4px);\n box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 8px 28px rgba(0,0,0,0.06);\n}\n.atlas-embed-logo { display: block; max-height: 40px; margin: 0 auto 16px; }\n.atlas-embed-title { font-size: 20px; font-weight: 650; text-align: center; margin: 0 0 4px; }\n.atlas-embed-subtitle { font-size: 14px; color: #6b7280; text-align: center; margin: 0 0 20px; }\n.atlas-embed-social { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }\n.atlas-embed-social-button {\n display: flex; align-items: center; justify-content: center; gap: 8px;\n width: 100%; padding: 10px 12px; font-size: 14px; font-weight: 550; cursor: pointer;\n color: var(--_text); background: var(--_card);\n border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-social-button:hover { filter: brightness(0.97); }\n.atlas-embed-social-icon { display: inline-flex; flex: none; line-height: 0; }\n.atlas-embed-social-icon svg { width: 18px; height: 18px; display: block; }\n.atlas-embed-social-label { display: inline-block; }\n\n/* Size \u2014 button scale and icon size together. */\n.atlas-embed-social[data-size=\"sm\"] .atlas-embed-social-button { padding: 8px 10px; font-size: 13px; }\n.atlas-embed-social[data-size=\"sm\"] .atlas-embed-social-icon svg { width: 16px; height: 16px; }\n.atlas-embed-social[data-size=\"lg\"] .atlas-embed-social-button { padding: 13px 16px; font-size: 15px; }\n.atlas-embed-social[data-size=\"lg\"] .atlas-embed-social-icon svg { width: 22px; height: 22px; }\n\n/* Icon-only variant: a square button, name in the tooltip. Always laid out as a\n centred wrap (or a carousel), never a full-width bar. */\n.atlas-embed-social-button[data-variant=\"icon\"] { width: auto; padding: 10px; aspect-ratio: 1; }\n.atlas-embed-social[data-size=\"sm\"] .atlas-embed-social-button[data-variant=\"icon\"] { padding: 8px; }\n.atlas-embed-social[data-size=\"lg\"] .atlas-embed-social-button[data-variant=\"icon\"] { padding: 13px; }\n.atlas-embed-social[data-variant=\"icon\"]:not([data-layout=\"carousel\"]) {\n flex-direction: row; flex-wrap: wrap; justify-content: center;\n}\n\n/* Grid \u2014 bars share a row and wrap. */\n.atlas-embed-social[data-layout=\"grid\"] { flex-direction: row; flex-wrap: wrap; }\n.atlas-embed-social[data-layout=\"grid\"] .atlas-embed-social-button { width: auto; flex: 1 1 auto; }\n.atlas-embed-social[data-layout=\"grid\"] .atlas-embed-social-button[data-variant=\"icon\"] { flex: 0 0 auto; }\n\n/* Carousel \u2014 one swipeable, scroll-snapped row. The raw scrollbar is hidden; the\n arrow buttons (below) are the affordance instead. */\n.atlas-embed-social[data-layout=\"carousel\"] {\n flex-direction: row; flex-wrap: nowrap; overflow-x: auto;\n scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scroll-behavior: smooth;\n scrollbar-width: none;\n}\n.atlas-embed-social[data-layout=\"carousel\"]::-webkit-scrollbar { display: none; }\n.atlas-embed-social[data-layout=\"carousel\"] .atlas-embed-social-button { width: auto; flex: 0 0 auto; scroll-snap-align: start; }\n.atlas-embed-social[data-layout=\"carousel\"] .atlas-embed-social-button[data-variant=\"block\"] { min-width: 60%; }\n\n/* Carousel shell \u2014 prev/next controls flanking the scroll row. */\n.atlas-embed-carousel { position: relative; display: flex; align-items: center; gap: 4px; margin-bottom: 16px; }\n.atlas-embed-carousel .atlas-embed-social { flex: 1 1 auto; min-width: 0; margin-bottom: 0; }\n.atlas-embed-carousel-nav {\n flex: none; display: inline-flex; align-items: center; justify-content: center;\n width: 30px; height: 30px; padding: 0; cursor: pointer;\n color: var(--_text); background: var(--_card);\n border: 1px solid var(--_border); border-radius: 999px; transition: opacity 0.15s;\n}\n.atlas-embed-carousel-nav svg { width: 16px; height: 16px; display: block; }\n.atlas-embed-carousel-nav:hover:not(:disabled) { filter: brightness(0.97); }\n.atlas-embed-carousel-nav:disabled { opacity: 0.35; cursor: default; }\n/* Nothing overflows \u2192 no controls at all. */\n.atlas-embed-carousel[data-overflow=\"false\"] .atlas-embed-carousel-nav { display: none; }\n/* When the carousel sits inside a search field, the field owns the bottom margin. */\n.atlas-embed-social-field .atlas-embed-carousel { margin-bottom: 0; }\n\n/* Search \u2014 a filter box above a long provider list (socialButtons.search). The\n field wraps the button container so its own margin replaces the button block's. */\n.atlas-embed-social-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }\n.atlas-embed-social-field .atlas-embed-social { margin-bottom: 0; }\n.atlas-embed-social-search {\n width: 100%; padding: 9px 12px; font-size: 16px; color: var(--_text);\n background: var(--_bg); border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-social-search:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }\n.atlas-embed-social-button[hidden] { display: none; }\n.atlas-embed-social-empty { font-size: 13px; color: #9ca3af; text-align: center; padding: 6px 0; }\n.atlas-embed-social-empty[hidden] { display: none; }\n.atlas-embed-divider {\n display: flex; align-items: center; text-align: center; gap: 10px;\n color: #9ca3af; font-size: 12px; margin: 14px 0;\n}\n.atlas-embed-divider::before, .atlas-embed-divider::after {\n content: \"\"; flex: 1; height: 1px; background: var(--_border);\n}\n.atlas-embed-field { display: block; margin: 0 0 12px; }\n.atlas-embed-label { display: block; font-size: 13px; margin: 0 0 5px; color: var(--_text); }\n.atlas-embed-input {\n /* 16px: iOS Safari zooms the page when a smaller field takes focus. */\n width: 100%; padding: 10px 12px; font-size: 16px; color: var(--_text);\n background: var(--_bg); border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-input:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }\n/* Password field with a show/hide toggle. */\n.atlas-embed-password { position: relative; display: flex; align-items: center; }\n.atlas-embed-password .atlas-embed-input { width: 100%; padding-right: 54px; }\n.atlas-embed-password-toggle {\n position: absolute; right: 6px; padding: 4px 7px; font: inherit; font-size: 12px; font-weight: 600;\n cursor: pointer; color: var(--_primary); background: none; border: 0; border-radius: 6px;\n}\n.atlas-embed-password-toggle:hover { text-decoration: underline; }\nselect.atlas-embed-input { appearance: auto; }\n.atlas-embed-field-checkbox { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; gap: 8px; }\n.atlas-embed-field-checkbox .atlas-embed-label { margin: 0; }\n.atlas-embed-checkbox { width: 16px; height: 16px; margin: 0; flex: none; }\ntextarea.atlas-embed-input { min-height: 72px; resize: vertical; font-family: inherit; }\nfieldset.atlas-embed-field { border: 0; padding: 0; margin: 0 0 12px; }\n.atlas-embed-choices { display: flex; flex-direction: column; gap: 6px; }\n.atlas-embed-choice { display: flex; flex-direction: row; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }\n.atlas-embed-choice input { width: 16px; height: 16px; margin: 0; flex: none; accent-color: var(--_primary); }\n.atlas-embed-button {\n width: 100%; margin-top: 6px; padding: 11px 12px; font-size: 14px; font-weight: 650;\n cursor: pointer; color: var(--_on-primary); background: var(--_primary);\n border: 0; border-radius: var(--_radius);\n}\n.atlas-embed-button:disabled { opacity: 0.6; cursor: default; }\n.atlas-embed-button:focus-visible, .atlas-embed-social-button:focus-visible,\n.atlas-embed-handle-back:focus-visible, .atlas-embed-step-back:focus-visible,\n.atlas-embed-password-toggle:focus-visible, .atlas-embed-carousel-nav:focus-visible {\n outline: 2px solid var(--_focus); outline-offset: 2px;\n}\n.atlas-embed-handle-back {\n width: 100%; margin-top: 8px; padding: 6px; font-size: 13px; font-weight: 550;\n cursor: pointer; color: #6b7280; background: none; border: 0;\n}\n.atlas-embed-handle-back:hover { color: #374151; }\n.atlas-embed-error { display: block; font-size: 13px; color: #d64545; margin: 6px 0 0; }\n.atlas-embed-form-error { font-size: 13px; color: #d64545; margin: 0 0 12px; min-height: 0; }\n/* A success/confirmation banner (e.g. after a force-login password reset). */\n.atlas-embed-flash {\n font-size: 13px; color: #0f7a4d; background: rgba(16,163,101,0.08);\n border: 1px solid rgba(16,163,101,0.25); border-radius: var(--_radius);\n padding: 9px 11px; margin: 0 0 14px; text-align: center;\n}\n.atlas-embed-footer { font-size: 13px; color: #6b7280; text-align: center; margin: 16px 0 0; }\n/* \u00A75.1 legal consent row on sign-up. */\n.atlas-embed-consent { display: flex; align-items: flex-start; gap: 8px; margin: 2px 0 14px; font-size: 13px; color: #6b7280; }\n.atlas-embed-consent-check { margin: 2px 0 0; width: 15px; height: 15px; flex: none; accent-color: var(--_primary); cursor: pointer; }\n.atlas-embed-consent-link { color: var(--_primary); text-decoration: underline; }\n/* \u00A77.5 Remember-me row. */\n.atlas-embed-remember { display: flex; align-items: center; gap: 8px; margin: -2px 0 14px; font-size: 13px; color: var(--_text); cursor: pointer; }\n.atlas-embed-remember-check { width: 15px; height: 15px; flex: none; accent-color: var(--_primary); cursor: pointer; }\n.atlas-embed-note { font-size: 14px; color: #6b7280; text-align: center; margin: 8px 0; }\n.atlas-embed-mfa-qr { display: block; margin: 8px auto; width: 180px; height: 180px; image-rendering: pixelated; }\n.atlas-embed-mfa-key { font-family: ui-monospace, monospace; letter-spacing: 0.05em; }\n\n/* Verification step \u2014 a continuation of the email panel, not a new screen: the\n context line (\"Enter the code we sent to \u2026\") + a way back, then a segmented\n one-box-per-digit code input that spawns in. */\n.atlas-embed-step-context { text-align: center; margin: 0 0 20px; }\n.atlas-embed-step-context .atlas-embed-subtitle { margin: 0 0 6px; }\n.atlas-embed-step-back {\n display: inline-block; padding: 2px 4px; font: inherit; font-size: 13px; font-weight: 550;\n cursor: pointer; color: var(--_primary); background: none; border: 0;\n}\n.atlas-embed-step-back:hover { text-decoration: underline; }\n/* A standalone action under the submit button (Forgot password?, Back to sign in,\n the 2FA toggle) reads as a centred link, not a left-aligned fragment. */\nform > .atlas-embed-step-back { display: block; width: 100%; text-align: center; margin-top: 10px; }\n.atlas-embed-code { display: flex; gap: 8px; justify-content: space-between; }\n.atlas-embed-code-box {\n flex: 1 1 0; min-width: 0; aspect-ratio: 1 / 1.15; padding: 0; text-align: center;\n font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--_text);\n background: var(--_bg); border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-code-box:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }\n/* A real step change eases its content in; error/busy re-renders (same step) do\n not, and a reduced-motion viewer gets no animation at all. */\n@media (prefers-reduced-motion: no-preference) {\n .atlas-embed-card[data-enter] > form,\n .atlas-embed-card[data-enter] > .atlas-embed-step-context {\n animation: atlas-embed-spawn 0.26s cubic-bezier(0.22, 0.61, 0.36, 1) both;\n }\n}\n@keyframes atlas-embed-spawn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n Interaction / polish layer \u2014 how controls FEEL. Driven by data-attributes on\n the root (data-button-style / -button-effect / -shadow / -density /\n -input-style) that the widget sets from the resolved interaction config, plus\n the --_motion tempo var. Every rule is additive: with no attributes set the\n widget looks exactly as it did before this layer existed.\n \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n/* Smooth every interactive control at the configured tempo. */\n.atlas-embed-button, .atlas-embed-social-button, .atlas-embed-carousel-nav,\n.atlas-embed-handle-back, .atlas-embed-step-back, .atlas-embed-password-toggle,\n.atlas-embed-input, .atlas-embed-code-box {\n transition:\n transform var(--_motion) ease, box-shadow var(--_motion) ease,\n background-color var(--_motion) ease, border-color var(--_motion) ease,\n color var(--_motion) ease, filter var(--_motion) ease, outline-color var(--_motion) ease;\n}\n\n/* Primary CTA \u2014 a subtle hover darken by default (was static). */\n.atlas-embed-button:hover:not(:disabled) { filter: brightness(1.06); }\n\n/* Button fill style (primary CTA only \u2014 social buttons keep provider styling). */\n.atlas-embed-root[data-button-style=\"outline\"] .atlas-embed-button {\n background: transparent; color: var(--_primary); border: 1px solid var(--_primary);\n}\n.atlas-embed-root[data-button-style=\"outline\"] .atlas-embed-button:hover:not(:disabled) {\n filter: none; background: color-mix(in srgb, var(--_primary) 10%, transparent);\n}\n.atlas-embed-root[data-button-style=\"soft\"] .atlas-embed-button {\n background: color-mix(in srgb, var(--_primary) 14%, transparent); color: var(--_primary);\n}\n.atlas-embed-root[data-button-style=\"soft\"] .atlas-embed-button:hover:not(:disabled) {\n filter: none; background: color-mix(in srgb, var(--_primary) 22%, transparent);\n}\n.atlas-embed-root[data-button-style=\"ghost\"] .atlas-embed-button {\n background: transparent; color: var(--_primary);\n}\n.atlas-embed-root[data-button-style=\"ghost\"] .atlas-embed-button:hover:not(:disabled) {\n filter: none; background: color-mix(in srgb, var(--_primary) 12%, transparent);\n}\n\n/* Press/hover effect \u2014 applies to every button. */\n.atlas-embed-root[data-button-effect=\"scale\"] .atlas-embed-button:active:not(:disabled),\n.atlas-embed-root[data-button-effect=\"scale\"] .atlas-embed-social-button:active,\n.atlas-embed-root[data-button-effect=\"scale\"] .atlas-embed-carousel-nav:active:not(:disabled) {\n transform: scale(0.97);\n}\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-button:hover:not(:disabled),\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-social-button:hover {\n transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,0.14); filter: none;\n}\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-button:active:not(:disabled),\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-social-button:active { transform: translateY(0); }\n.atlas-embed-root[data-button-effect=\"glow\"] .atlas-embed-button:hover:not(:disabled),\n.atlas-embed-root[data-button-effect=\"glow\"] .atlas-embed-social-button:hover {\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--_primary) 35%, transparent); filter: none;\n}\n/* Ripple \u2014 the widget appends a span on pointer-down; buttons must clip it. */\n.atlas-embed-root[data-button-effect=\"ripple\"] .atlas-embed-button,\n.atlas-embed-root[data-button-effect=\"ripple\"] .atlas-embed-social-button {\n position: relative; overflow: hidden;\n}\n.atlas-embed-ripple {\n position: absolute; border-radius: 50%; transform: scale(0);\n background: currentColor; opacity: 0.28; pointer-events: none;\n animation: atlas-embed-ripple 0.55s ease-out;\n}\n@keyframes atlas-embed-ripple { to { transform: scale(2.6); opacity: 0; } }\n\n/* Card + solid-button elevation. */\n.atlas-embed-root[data-shadow=\"none\"] .atlas-embed-card { box-shadow: none; }\n.atlas-embed-root[data-shadow=\"sm\"] .atlas-embed-card { box-shadow: 0 1px 2px rgba(0,0,0,0.05); }\n.atlas-embed-root[data-shadow=\"lg\"] .atlas-embed-card {\n box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 16px 48px rgba(0,0,0,0.12);\n}\n\n/* Density \u2014 compact tightens padding and gaps. */\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-card { padding: 20px 18px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-social { gap: 6px; margin-bottom: 12px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-field { margin-bottom: 9px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-button { padding: 9px 12px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-social-button { padding: 8px 10px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-subtitle { margin-bottom: 14px; }\n\n/* Input style \u2014 filled and underline treatments (default is the outlined field). */\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-input,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-code-box,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-social-search {\n background: color-mix(in srgb, var(--_border) 24%, transparent); border-color: transparent;\n}\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-input:focus,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-code-box:focus,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-social-search:focus {\n background: var(--_bg); border-color: var(--_primary);\n}\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-input,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-code-box,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-social-search {\n background: transparent; border: 0; border-bottom: 1.5px solid var(--_border);\n border-radius: 0; padding-left: 2px; padding-right: 2px;\n}\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-input:focus,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-code-box:focus,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-social-search:focus {\n outline: none; border-bottom-color: var(--_primary);\n}\n\n/* \u2500\u2500 Loading states \u2014 spinner / skeleton / dots / bar (interaction.loading).\n Shown while appearance resolves, while a redirect ticket is exchanged, and the\n button spinner while a form submits \u2014 so the widget never flashes blank. \u2500\u2500 */\n.atlas-embed-button { display: flex; align-items: center; justify-content: center; gap: 8px; }\n.atlas-embed-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 168px; padding: 12px 0; }\n.atlas-embed-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }\n\n/* Spinner (default) + the in-button spinner. */\n.atlas-embed-spinner, .atlas-embed-btn-spinner {\n border-radius: 50%; border-style: solid; flex: none;\n animation: atlas-embed-spin 0.7s linear infinite;\n}\n.atlas-embed-spinner { width: 30px; height: 30px; border-width: 3px;\n border-color: color-mix(in srgb, var(--_primary) 22%, transparent); border-top-color: var(--_primary); }\n.atlas-embed-btn-spinner { width: 17px; height: 17px; border-width: 2px;\n border-color: color-mix(in srgb, currentColor 35%, transparent); border-top-color: currentColor; }\n@keyframes atlas-embed-spin { to { transform: rotate(360deg); } }\n\n/* Dots. */\n.atlas-embed-loading[data-loading=\"dots\"] { flex-direction: row; }\n.atlas-embed-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--_primary);\n animation: atlas-embed-bounce 1.2s ease-in-out infinite; }\n.atlas-embed-dot:nth-child(2) { animation-delay: 0.15s; }\n.atlas-embed-dot:nth-child(3) { animation-delay: 0.30s; }\n@keyframes atlas-embed-bounce { 0%,80%,100% { transform: scale(0.5); opacity: 0.4; } 40% { transform: scale(1); opacity: 1; } }\n\n/* Indeterminate bar. */\n.atlas-embed-loading[data-loading=\"bar\"] { min-height: 132px; }\n.atlas-embed-loadbar { position: relative; width: 64%; height: 4px; border-radius: 999px; overflow: hidden;\n background: color-mix(in srgb, var(--_border) 60%, transparent); }\n.atlas-embed-loadbar::before { content: \"\"; position: absolute; top: 0; bottom: 0; width: 40%; border-radius: 999px;\n background: var(--_primary); animation: atlas-embed-slide 1.1s ease-in-out infinite; }\n@keyframes atlas-embed-slide { 0% { left: -45%; } 100% { left: 105%; } }\n\n/* Skeleton \u2014 placeholders shaped like the form. */\n.atlas-embed-loading[data-loading=\"skeleton\"] { align-items: stretch; min-height: 0; gap: 12px; }\n.atlas-embed-skel { border-radius: var(--_radius); position: relative; overflow: hidden;\n background: color-mix(in srgb, var(--_border) 55%, transparent); }\n.atlas-embed-skel::after { content: \"\"; position: absolute; inset: 0; transform: translateX(-100%);\n background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--_text) 8%, transparent), transparent);\n animation: atlas-embed-shimmer 1.3s infinite; }\n.atlas-embed-skel-title { height: 22px; width: 55%; margin: 2px auto 2px; }\n.atlas-embed-skel-sub { height: 13px; width: 75%; margin: 0 auto 8px; }\n.atlas-embed-skel-input { height: 42px; }\n.atlas-embed-skel-button { height: 44px; margin-top: 6px; }\n@keyframes atlas-embed-shimmer { to { transform: translateX(100%); } }\n\n/* Reduced motion always wins \u2014 no transitions, presses, ripples, or spawn; and\n loaders swap their spin/bounce/slide/shimmer for a minimal opacity pulse. */\n@media (prefers-reduced-motion: reduce) {\n .atlas-embed-root { --_motion: 0s; }\n .atlas-embed-root [class^=\"atlas-embed-\"] { transition: none !important; }\n .atlas-embed-root .atlas-embed-button:active,\n .atlas-embed-root .atlas-embed-social-button:active { transform: none !important; }\n .atlas-embed-ripple { display: none; }\n .atlas-embed-spinner, .atlas-embed-btn-spinner, .atlas-embed-dot,\n .atlas-embed-loadbar::before, .atlas-embed-skel::after {\n animation: atlas-embed-pulse 1.4s ease-in-out infinite !important;\n }\n .atlas-embed-loadbar::before { position: static; width: 100%; }\n}\n@keyframes atlas-embed-pulse { 0%,100% { opacity: 0.4; } 50% { opacity: 1; } }\n";
16
- /** Inject the sheet once per document. Safe to call on every mount. */
2
+ export declare const EMBED_CSS = "\n/* The host page's --atlas-host-* variables (shared UI-kit names) restyle the widget\n where the page sets them; explicit --atlas-embed-* settings still win. */\n.atlas-embed-root {\n --_bg: var(--atlas-embed-color-background, var(--atlas-host-surface, #ffffff));\n --_card: var(--atlas-embed-color-card, var(--atlas-host-surface, #ffffff));\n --_text: var(--atlas-embed-color-text, var(--atlas-host-ink, #1c1c1f));\n --_primary: var(--atlas-embed-color-primary, var(--atlas-host-accent, #5b5bd6));\n --_on-primary: var(--atlas-embed-color-text-on-primary, var(--atlas-host-accent-ink, #ffffff));\n /* Keyboard focus ring \u2014 a solid outline. The widget sets it to the primary\n adjusted to 3:1 on the card/background (or the page's explicit ring). */\n --_focus: var(--atlas-embed-color-focus-ring, var(--atlas-host-focus-ring, var(--_primary)));\n --_border: var(--atlas-embed-color-border, var(--atlas-host-line, #e4e4e9));\n --_radius: var(--atlas-embed-border-radius, var(--atlas-host-radius, 10px));\n /* Transition tempo \u2014 the widget sets --atlas-embed-motion from motionSpeed and\n to 0s when animations are off; reduced-motion forces 0s below regardless. */\n --_motion: var(--atlas-embed-motion, 0.16s);\n font-family: var(--atlas-embed-font-family, var(--atlas-host-font, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif));\n color: var(--_text);\n box-sizing: border-box;\n display: block;\n}\n.atlas-embed-root *, .atlas-embed-root *::before, .atlas-embed-root *::after { box-sizing: border-box; }\n.atlas-embed-card {\n max-width: 400px;\n margin: 0 auto;\n padding: 28px 26px;\n background: var(--_card);\n border: 1px solid var(--_border);\n border-radius: calc(var(--_radius) + 4px);\n box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 8px 28px rgba(0,0,0,0.06);\n}\n.atlas-embed-logo { display: block; max-height: 40px; margin: 0 auto 16px; }\n.atlas-embed-title { font-size: 20px; font-weight: 650; text-align: center; margin: 0 0 4px; }\n.atlas-embed-subtitle { font-size: 14px; color: #6b7280; text-align: center; margin: 0 0 20px; }\n.atlas-embed-social { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }\n.atlas-embed-social-button {\n display: flex; align-items: center; justify-content: center; gap: 8px;\n width: 100%; padding: 10px 12px; font-size: 14px; font-weight: 550; cursor: pointer;\n color: var(--_text); background: var(--_card);\n border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-social-button:hover { filter: brightness(0.97); }\n.atlas-embed-social-icon { display: inline-flex; flex: none; line-height: 0; }\n.atlas-embed-social-icon svg { width: 18px; height: 18px; display: block; }\n.atlas-embed-social-label { display: inline-block; }\n\n/* Size \u2014 button scale and icon size together. */\n.atlas-embed-social[data-size=\"sm\"] .atlas-embed-social-button { padding: 8px 10px; font-size: 13px; }\n.atlas-embed-social[data-size=\"sm\"] .atlas-embed-social-icon svg { width: 16px; height: 16px; }\n.atlas-embed-social[data-size=\"lg\"] .atlas-embed-social-button { padding: 13px 16px; font-size: 15px; }\n.atlas-embed-social[data-size=\"lg\"] .atlas-embed-social-icon svg { width: 22px; height: 22px; }\n\n/* Icon-only variant: a square button, name in the tooltip. Always laid out as a\n centred wrap (or a carousel), never a full-width bar. */\n.atlas-embed-social-button[data-variant=\"icon\"] { width: auto; padding: 10px; aspect-ratio: 1; }\n.atlas-embed-social[data-size=\"sm\"] .atlas-embed-social-button[data-variant=\"icon\"] { padding: 8px; }\n.atlas-embed-social[data-size=\"lg\"] .atlas-embed-social-button[data-variant=\"icon\"] { padding: 13px; }\n.atlas-embed-social[data-variant=\"icon\"]:not([data-layout=\"carousel\"]) {\n flex-direction: row; flex-wrap: wrap; justify-content: center;\n}\n\n/* Grid \u2014 bars share a row and wrap. */\n.atlas-embed-social[data-layout=\"grid\"] { flex-direction: row; flex-wrap: wrap; }\n.atlas-embed-social[data-layout=\"grid\"] .atlas-embed-social-button { width: auto; flex: 1 1 auto; }\n.atlas-embed-social[data-layout=\"grid\"] .atlas-embed-social-button[data-variant=\"icon\"] { flex: 0 0 auto; }\n\n/* Carousel \u2014 one swipeable, scroll-snapped row. The raw scrollbar is hidden; the\n arrow buttons (below) are the affordance instead. */\n.atlas-embed-social[data-layout=\"carousel\"] {\n flex-direction: row; flex-wrap: nowrap; overflow-x: auto;\n scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scroll-behavior: smooth;\n scrollbar-width: none;\n}\n.atlas-embed-social[data-layout=\"carousel\"]::-webkit-scrollbar { display: none; }\n.atlas-embed-social[data-layout=\"carousel\"] .atlas-embed-social-button { width: auto; flex: 0 0 auto; scroll-snap-align: start; }\n.atlas-embed-social[data-layout=\"carousel\"] .atlas-embed-social-button[data-variant=\"block\"] { min-width: 60%; }\n\n/* Carousel shell \u2014 prev/next controls flanking the scroll row. */\n.atlas-embed-carousel { position: relative; display: flex; align-items: center; gap: 4px; margin-bottom: 16px; }\n.atlas-embed-carousel .atlas-embed-social { flex: 1 1 auto; min-width: 0; margin-bottom: 0; }\n.atlas-embed-carousel-nav {\n flex: none; display: inline-flex; align-items: center; justify-content: center;\n width: 30px; height: 30px; padding: 0; cursor: pointer;\n color: var(--_text); background: var(--_card);\n border: 1px solid var(--_border); border-radius: 999px; transition: opacity 0.15s;\n}\n.atlas-embed-carousel-nav svg { width: 16px; height: 16px; display: block; }\n.atlas-embed-carousel-nav:hover:not(:disabled) { filter: brightness(0.97); }\n.atlas-embed-carousel-nav:disabled { opacity: 0.35; cursor: default; }\n/* Nothing overflows \u2192 no controls at all. */\n.atlas-embed-carousel[data-overflow=\"false\"] .atlas-embed-carousel-nav { display: none; }\n/* When the carousel sits inside a search field, the field owns the bottom margin. */\n.atlas-embed-social-field .atlas-embed-carousel { margin-bottom: 0; }\n\n/* Search \u2014 a filter box above a long provider list (socialButtons.search). The\n field wraps the button container so its own margin replaces the button block's. */\n.atlas-embed-social-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }\n.atlas-embed-social-field .atlas-embed-social { margin-bottom: 0; }\n.atlas-embed-social-search {\n width: 100%; padding: 9px 12px; font-size: 16px; color: var(--_text);\n background: var(--_bg); border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-social-search:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }\n.atlas-embed-social-button[hidden] { display: none; }\n.atlas-embed-social-empty { font-size: 13px; color: #6b7280; color: color-mix(in srgb, var(--_text) 72%, transparent); text-align: center; padding: 6px 0; }\n.atlas-embed-social-empty[hidden] { display: none; }\n.atlas-embed-divider {\n display: flex; align-items: center; text-align: center; gap: 10px;\n /* 4.5:1 on the card (WCAG 1.4.3); follows the theme's text colour. */\n color: #6b7280; color: color-mix(in srgb, var(--_text) 72%, transparent); font-size: 12px; margin: 14px 0;\n}\n.atlas-embed-divider::before, .atlas-embed-divider::after {\n content: \"\"; flex: 1; height: 1px; background: var(--_border);\n}\n.atlas-embed-field { display: block; margin: 0 0 12px; }\n.atlas-embed-label { display: block; font-size: 13px; margin: 0 0 5px; color: var(--_text); }\n.atlas-embed-input {\n /* 16px: iOS Safari zooms the page when a smaller field takes focus. */\n width: 100%; padding: 10px 12px; font-size: 16px; color: var(--_text);\n background: var(--_bg); border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-input:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }\n/* Password field with a show/hide toggle. */\n.atlas-embed-password { position: relative; display: flex; align-items: center; }\n.atlas-embed-password .atlas-embed-input { width: 100%; padding-right: 54px; }\n.atlas-embed-password-toggle {\n position: absolute; right: 6px; padding: 4px 7px; min-height: 24px; min-width: 24px; font: inherit; font-size: 12px; font-weight: 600;\n cursor: pointer; color: var(--_primary); background: none; border: 0; border-radius: 6px;\n}\n.atlas-embed-password-toggle:hover { text-decoration: underline; }\nselect.atlas-embed-input { appearance: auto; }\n.atlas-embed-field-checkbox { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; gap: 8px; }\n.atlas-embed-field-checkbox .atlas-embed-label { margin: 0; }\n.atlas-embed-checkbox { width: 16px; height: 16px; margin: 0; flex: none; }\ntextarea.atlas-embed-input { min-height: 72px; resize: vertical; font-family: inherit; }\nfieldset.atlas-embed-field { border: 0; padding: 0; margin: 0 0 12px; }\n.atlas-embed-choices { display: flex; flex-direction: column; gap: 6px; }\n.atlas-embed-choice { display: flex; flex-direction: row; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }\n.atlas-embed-choice input { width: 16px; height: 16px; margin: 0; flex: none; accent-color: var(--_primary); }\n.atlas-embed-button {\n width: 100%; margin-top: 6px; padding: 11px 12px; font-size: 14px; font-weight: 650;\n cursor: pointer; color: var(--_on-primary); background: var(--_primary);\n border: 0; border-radius: var(--_radius);\n}\n.atlas-embed-button:disabled { opacity: 0.6; cursor: default; }\n.atlas-embed-button:focus-visible, .atlas-embed-social-button:focus-visible,\n.atlas-embed-handle-back:focus-visible, .atlas-embed-step-back:focus-visible,\n.atlas-embed-password-toggle:focus-visible, .atlas-embed-carousel-nav:focus-visible {\n outline: 2px solid var(--_focus); outline-offset: 2px;\n}\n.atlas-embed-handle-back {\n width: 100%; margin-top: 8px; padding: 6px; font-size: 13px; font-weight: 550;\n cursor: pointer; color: #6b7280; background: none; border: 0;\n}\n.atlas-embed-handle-back:hover { color: #374151; }\n.atlas-embed-error { display: block; font-size: 13px; color: #c53030; margin: 6px 0 0; }\n.atlas-embed-form-error { font-size: 13px; color: #c53030; margin: 0 0 12px; min-height: 0; }\n/* A success/confirmation banner (e.g. after a force-login password reset). */\n.atlas-embed-flash {\n font-size: 13px; color: #0f7a4d; background: rgba(16,163,101,0.08);\n border: 1px solid rgba(16,163,101,0.25); border-radius: var(--_radius);\n padding: 9px 11px; margin: 0 0 14px; text-align: center;\n}\n.atlas-embed-footer { font-size: 13px; color: #6b7280; text-align: center; margin: 16px 0 0; }\n/* \u00A75.1 legal consent row on sign-up. */\n.atlas-embed-consent { display: flex; align-items: flex-start; gap: 8px; margin: 2px 0 14px; font-size: 13px; color: #6b7280; }\n.atlas-embed-consent-check { margin: 2px 0 0; width: 15px; height: 15px; flex: none; accent-color: var(--_primary); cursor: pointer; }\n.atlas-embed-consent-link { color: var(--_primary); text-decoration: underline; }\n/* \u00A77.5 Remember-me row. */\n.atlas-embed-remember { display: flex; align-items: center; gap: 8px; margin: -2px 0 14px; font-size: 13px; color: var(--_text); cursor: pointer; }\n.atlas-embed-remember-check { width: 15px; height: 15px; flex: none; accent-color: var(--_primary); cursor: pointer; }\n.atlas-embed-note { font-size: 14px; color: #6b7280; text-align: center; margin: 8px 0; }\n.atlas-embed-mfa-qr { display: block; margin: 8px auto; width: 180px; height: 180px; image-rendering: pixelated; }\n.atlas-embed-mfa-key { font-family: ui-monospace, monospace; letter-spacing: 0.05em; }\n\n/* Verification step \u2014 a continuation of the email panel, not a new screen: the\n context line (\"Enter the code we sent to \u2026\") + a way back, then a segmented\n one-box-per-digit code input that spawns in. */\n.atlas-embed-step-context { text-align: center; margin: 0 0 20px; }\n.atlas-embed-step-context .atlas-embed-subtitle { margin: 0 0 6px; }\n.atlas-embed-step-back {\n display: inline-block; padding: 2px 4px; font: inherit; font-size: 13px; font-weight: 550;\n cursor: pointer; color: var(--_primary); background: none; border: 0;\n}\n.atlas-embed-step-back:hover { text-decoration: underline; }\n/* A standalone action under the submit button (Forgot password?, Back to sign in,\n the 2FA toggle) reads as a centred link, not a left-aligned fragment. */\nform > .atlas-embed-step-back { display: block; width: 100%; text-align: center; margin-top: 10px; }\n.atlas-embed-code { display: flex; gap: 8px; justify-content: space-between; }\n.atlas-embed-code-box {\n flex: 1 1 0; min-width: 0; aspect-ratio: 1 / 1.15; padding: 0; text-align: center;\n font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--_text);\n background: var(--_bg); border: 1px solid var(--_border); border-radius: var(--_radius);\n}\n.atlas-embed-code-box:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }\n/* A real step change eases its content in; error/busy re-renders (same step) do\n not, and a reduced-motion viewer gets no animation at all. */\n@media (prefers-reduced-motion: no-preference) {\n .atlas-embed-card[data-enter] > form,\n .atlas-embed-card[data-enter] > .atlas-embed-step-context {\n animation: atlas-embed-spawn 0.26s cubic-bezier(0.22, 0.61, 0.36, 1) both;\n }\n}\n@keyframes atlas-embed-spawn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n Interaction / polish layer \u2014 how controls FEEL. Driven by data-attributes on\n the root (data-button-style / -button-effect / -shadow / -density /\n -input-style) that the widget sets from the resolved interaction config, plus\n the --_motion tempo var. Every rule is additive: with no attributes set the\n widget looks exactly as it did before this layer existed.\n \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n/* Smooth every interactive control at the configured tempo. */\n.atlas-embed-button, .atlas-embed-social-button, .atlas-embed-carousel-nav,\n.atlas-embed-handle-back, .atlas-embed-step-back, .atlas-embed-password-toggle,\n.atlas-embed-input, .atlas-embed-code-box {\n transition:\n transform var(--_motion) ease, box-shadow var(--_motion) ease,\n background-color var(--_motion) ease, border-color var(--_motion) ease,\n color var(--_motion) ease, filter var(--_motion) ease, outline-color var(--_motion) ease;\n}\n\n/* Primary CTA \u2014 a subtle hover darken by default (was static). */\n.atlas-embed-button:hover:not(:disabled) { filter: brightness(1.06); }\n\n/* Button fill style (primary CTA only \u2014 social buttons keep provider styling). */\n.atlas-embed-root[data-button-style=\"outline\"] .atlas-embed-button {\n background: transparent; color: var(--_primary); border: 1px solid var(--_primary);\n}\n.atlas-embed-root[data-button-style=\"outline\"] .atlas-embed-button:hover:not(:disabled) {\n filter: none; background: color-mix(in srgb, var(--_primary) 10%, transparent);\n}\n.atlas-embed-root[data-button-style=\"soft\"] .atlas-embed-button {\n background: color-mix(in srgb, var(--_primary) 14%, transparent); color: var(--_primary);\n}\n.atlas-embed-root[data-button-style=\"soft\"] .atlas-embed-button:hover:not(:disabled) {\n filter: none; background: color-mix(in srgb, var(--_primary) 22%, transparent);\n}\n.atlas-embed-root[data-button-style=\"ghost\"] .atlas-embed-button {\n background: transparent; color: var(--_primary);\n}\n.atlas-embed-root[data-button-style=\"ghost\"] .atlas-embed-button:hover:not(:disabled) {\n filter: none; background: color-mix(in srgb, var(--_primary) 12%, transparent);\n}\n\n/* Press/hover effect \u2014 applies to every button. */\n.atlas-embed-root[data-button-effect=\"scale\"] .atlas-embed-button:active:not(:disabled),\n.atlas-embed-root[data-button-effect=\"scale\"] .atlas-embed-social-button:active,\n.atlas-embed-root[data-button-effect=\"scale\"] .atlas-embed-carousel-nav:active:not(:disabled) {\n transform: scale(0.97);\n}\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-button:hover:not(:disabled),\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-social-button:hover {\n transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,0.14); filter: none;\n}\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-button:active:not(:disabled),\n.atlas-embed-root[data-button-effect=\"lift\"] .atlas-embed-social-button:active { transform: translateY(0); }\n.atlas-embed-root[data-button-effect=\"glow\"] .atlas-embed-button:hover:not(:disabled),\n.atlas-embed-root[data-button-effect=\"glow\"] .atlas-embed-social-button:hover {\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--_primary) 35%, transparent); filter: none;\n}\n/* Ripple \u2014 the widget appends a span on pointer-down; buttons must clip it. */\n.atlas-embed-root[data-button-effect=\"ripple\"] .atlas-embed-button,\n.atlas-embed-root[data-button-effect=\"ripple\"] .atlas-embed-social-button {\n position: relative; overflow: hidden;\n}\n.atlas-embed-ripple {\n position: absolute; border-radius: 50%; transform: scale(0);\n background: currentColor; opacity: 0.28; pointer-events: none;\n animation: atlas-embed-ripple 0.55s ease-out;\n}\n@keyframes atlas-embed-ripple { to { transform: scale(2.6); opacity: 0; } }\n\n/* Card + solid-button elevation. */\n.atlas-embed-root[data-shadow=\"none\"] .atlas-embed-card { box-shadow: none; }\n.atlas-embed-root[data-shadow=\"sm\"] .atlas-embed-card { box-shadow: 0 1px 2px rgba(0,0,0,0.05); }\n.atlas-embed-root[data-shadow=\"lg\"] .atlas-embed-card {\n box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 16px 48px rgba(0,0,0,0.12);\n}\n\n/* Density \u2014 compact tightens padding and gaps. */\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-card { padding: 20px 18px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-social { gap: 6px; margin-bottom: 12px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-field { margin-bottom: 9px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-button { padding: 9px 12px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-social-button { padding: 8px 10px; }\n.atlas-embed-root[data-density=\"compact\"] .atlas-embed-subtitle { margin-bottom: 14px; }\n\n/* Input style \u2014 filled and underline treatments (default is the outlined field). */\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-input,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-code-box,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-social-search {\n background: color-mix(in srgb, var(--_border) 24%, transparent); border-color: transparent;\n}\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-input:focus,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-code-box:focus,\n.atlas-embed-root[data-input-style=\"filled\"] .atlas-embed-social-search:focus {\n background: var(--_bg); border-color: var(--_primary);\n}\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-input,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-code-box,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-social-search {\n background: transparent; border: 0; border-bottom: 1.5px solid var(--_border);\n border-radius: 0; padding-left: 2px; padding-right: 2px;\n}\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-input:focus,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-code-box:focus,\n.atlas-embed-root[data-input-style=\"underline\"] .atlas-embed-social-search:focus {\n outline: none; border-bottom-color: var(--_primary);\n}\n\n/* \u2500\u2500 Loading states \u2014 spinner / skeleton / dots / bar (interaction.loading).\n Shown while appearance resolves, while a redirect ticket is exchanged, and the\n button spinner while a form submits \u2014 so the widget never flashes blank. \u2500\u2500 */\n.atlas-embed-button { display: flex; align-items: center; justify-content: center; gap: 8px; }\n.atlas-embed-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 168px; padding: 12px 0; }\n.atlas-embed-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }\n\n/* Spinner (default) + the in-button spinner. */\n.atlas-embed-spinner, .atlas-embed-btn-spinner {\n border-radius: 50%; border-style: solid; flex: none;\n animation: atlas-embed-spin 0.7s linear infinite;\n}\n.atlas-embed-spinner { width: 30px; height: 30px; border-width: 3px;\n border-color: color-mix(in srgb, var(--_primary) 22%, transparent); border-top-color: var(--_primary); }\n.atlas-embed-btn-spinner { width: 17px; height: 17px; border-width: 2px;\n border-color: color-mix(in srgb, currentColor 35%, transparent); border-top-color: currentColor; }\n@keyframes atlas-embed-spin { to { transform: rotate(360deg); } }\n\n/* Dots. */\n.atlas-embed-loading[data-loading=\"dots\"] { flex-direction: row; }\n.atlas-embed-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--_primary);\n animation: atlas-embed-bounce 1.2s ease-in-out infinite; }\n.atlas-embed-dot:nth-child(2) { animation-delay: 0.15s; }\n.atlas-embed-dot:nth-child(3) { animation-delay: 0.30s; }\n@keyframes atlas-embed-bounce { 0%,80%,100% { transform: scale(0.5); opacity: 0.4; } 40% { transform: scale(1); opacity: 1; } }\n\n/* Indeterminate bar. */\n.atlas-embed-loading[data-loading=\"bar\"] { min-height: 132px; }\n.atlas-embed-loadbar { position: relative; width: 64%; height: 4px; border-radius: 999px; overflow: hidden;\n background: color-mix(in srgb, var(--_border) 60%, transparent); }\n.atlas-embed-loadbar::before { content: \"\"; position: absolute; top: 0; bottom: 0; width: 40%; border-radius: 999px;\n background: var(--_primary); animation: atlas-embed-slide 1.1s ease-in-out infinite; }\n@keyframes atlas-embed-slide { 0% { left: -45%; } 100% { left: 105%; } }\n\n/* Skeleton \u2014 placeholders shaped like the form. */\n.atlas-embed-loading[data-loading=\"skeleton\"] { align-items: stretch; min-height: 0; gap: 12px; }\n.atlas-embed-skel { border-radius: var(--_radius); position: relative; overflow: hidden;\n background: color-mix(in srgb, var(--_border) 55%, transparent); }\n.atlas-embed-skel::after { content: \"\"; position: absolute; inset: 0; transform: translateX(-100%);\n background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--_text) 8%, transparent), transparent);\n animation: atlas-embed-shimmer 1.3s infinite; }\n.atlas-embed-skel-title { height: 22px; width: 55%; margin: 2px auto 2px; }\n.atlas-embed-skel-sub { height: 13px; width: 75%; margin: 0 auto 8px; }\n.atlas-embed-skel-input { height: 42px; }\n.atlas-embed-skel-button { height: 44px; margin-top: 6px; }\n@keyframes atlas-embed-shimmer { to { transform: translateX(100%); } }\n\n/* Reduced motion always wins \u2014 no transitions, presses, ripples, or spawn; and\n loaders swap their spin/bounce/slide/shimmer for a minimal opacity pulse. */\n@media (prefers-reduced-motion: reduce) {\n .atlas-embed-root { --_motion: 0s; }\n .atlas-embed-root [class^=\"atlas-embed-\"] { transition: none !important; }\n .atlas-embed-root .atlas-embed-button:active,\n .atlas-embed-root .atlas-embed-social-button:active { transform: none !important; }\n .atlas-embed-ripple { display: none; }\n .atlas-embed-spinner, .atlas-embed-btn-spinner, .atlas-embed-dot,\n .atlas-embed-loadbar::before, .atlas-embed-skel::after {\n animation: atlas-embed-pulse 1.4s ease-in-out infinite !important;\n }\n .atlas-embed-loadbar::before { position: static; width: 100%; }\n}\n@keyframes atlas-embed-pulse { 0%,100% { opacity: 0.4; } 50% { opacity: 1; } }\n";
17
3
  export declare function injectStyles(doc?: Document): void;
package/dist/styles.js CHANGED
@@ -15,23 +15,26 @@ exports.injectStyles = injectStyles;
15
15
  * with a hard-coded fallback, so the widget looks right the instant it mounts —
16
16
  * before `GET /v1/appearance` resolves — and re-themes when it does.
17
17
  */
18
+ const runtime_1 = require("@atlasauth/design/runtime");
18
19
  exports.STYLE_MARKER = 'atlas-embed-styles';
19
20
  exports.EMBED_CSS = `
21
+ /* The host page's --atlas-host-* variables (shared UI-kit names) restyle the widget
22
+ where the page sets them; explicit --atlas-embed-* settings still win. */
20
23
  .atlas-embed-root {
21
- --_bg: var(--atlas-embed-color-background, #ffffff);
22
- --_card: var(--atlas-embed-color-card, #ffffff);
23
- --_text: var(--atlas-embed-color-text, #1c1c1f);
24
- --_primary: var(--atlas-embed-color-primary, #5b5bd6);
25
- --_on-primary: var(--atlas-embed-color-text-on-primary, #ffffff);
24
+ --_bg: var(--atlas-embed-color-background, var(--atlas-host-surface, #ffffff));
25
+ --_card: var(--atlas-embed-color-card, var(--atlas-host-surface, #ffffff));
26
+ --_text: var(--atlas-embed-color-text, var(--atlas-host-ink, #1c1c1f));
27
+ --_primary: var(--atlas-embed-color-primary, var(--atlas-host-accent, #5b5bd6));
28
+ --_on-primary: var(--atlas-embed-color-text-on-primary, var(--atlas-host-accent-ink, #ffffff));
26
29
  /* Keyboard focus ring — a solid outline. The widget sets it to the primary
27
30
  adjusted to 3:1 on the card/background (or the page's explicit ring). */
28
- --_focus: var(--atlas-embed-color-focus-ring, var(--_primary));
29
- --_border: var(--atlas-embed-color-border, #e4e4e9);
30
- --_radius: var(--atlas-embed-border-radius, 10px);
31
+ --_focus: var(--atlas-embed-color-focus-ring, var(--atlas-host-focus-ring, var(--_primary)));
32
+ --_border: var(--atlas-embed-color-border, var(--atlas-host-line, #e4e4e9));
33
+ --_radius: var(--atlas-embed-border-radius, var(--atlas-host-radius, 10px));
31
34
  /* Transition tempo — the widget sets --atlas-embed-motion from motionSpeed and
32
35
  to 0s when animations are off; reduced-motion forces 0s below regardless. */
33
36
  --_motion: var(--atlas-embed-motion, 0.16s);
34
- font-family: var(--atlas-embed-font-family, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
37
+ font-family: var(--atlas-embed-font-family, var(--atlas-host-font, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif));
35
38
  color: var(--_text);
36
39
  box-sizing: border-box;
37
40
  display: block;
@@ -119,11 +122,12 @@ exports.EMBED_CSS = `
119
122
  }
120
123
  .atlas-embed-social-search:focus { outline: 2px solid var(--_focus); outline-offset: -1px; }
121
124
  .atlas-embed-social-button[hidden] { display: none; }
122
- .atlas-embed-social-empty { font-size: 13px; color: #9ca3af; text-align: center; padding: 6px 0; }
125
+ .atlas-embed-social-empty { font-size: 13px; color: #6b7280; color: color-mix(in srgb, var(--_text) 72%, transparent); text-align: center; padding: 6px 0; }
123
126
  .atlas-embed-social-empty[hidden] { display: none; }
124
127
  .atlas-embed-divider {
125
128
  display: flex; align-items: center; text-align: center; gap: 10px;
126
- color: #9ca3af; font-size: 12px; margin: 14px 0;
129
+ /* 4.5:1 on the card (WCAG 1.4.3); follows the theme's text colour. */
130
+ color: #6b7280; color: color-mix(in srgb, var(--_text) 72%, transparent); font-size: 12px; margin: 14px 0;
127
131
  }
128
132
  .atlas-embed-divider::before, .atlas-embed-divider::after {
129
133
  content: ""; flex: 1; height: 1px; background: var(--_border);
@@ -140,7 +144,7 @@ exports.EMBED_CSS = `
140
144
  .atlas-embed-password { position: relative; display: flex; align-items: center; }
141
145
  .atlas-embed-password .atlas-embed-input { width: 100%; padding-right: 54px; }
142
146
  .atlas-embed-password-toggle {
143
- position: absolute; right: 6px; padding: 4px 7px; font: inherit; font-size: 12px; font-weight: 600;
147
+ position: absolute; right: 6px; padding: 4px 7px; min-height: 24px; min-width: 24px; font: inherit; font-size: 12px; font-weight: 600;
144
148
  cursor: pointer; color: var(--_primary); background: none; border: 0; border-radius: 6px;
145
149
  }
146
150
  .atlas-embed-password-toggle:hover { text-decoration: underline; }
@@ -169,8 +173,8 @@ fieldset.atlas-embed-field { border: 0; padding: 0; margin: 0 0 12px; }
169
173
  cursor: pointer; color: #6b7280; background: none; border: 0;
170
174
  }
171
175
  .atlas-embed-handle-back:hover { color: #374151; }
172
- .atlas-embed-error { display: block; font-size: 13px; color: #d64545; margin: 6px 0 0; }
173
- .atlas-embed-form-error { font-size: 13px; color: #d64545; margin: 0 0 12px; min-height: 0; }
176
+ .atlas-embed-error { display: block; font-size: 13px; color: #c53030; margin: 6px 0 0; }
177
+ .atlas-embed-form-error { font-size: 13px; color: #c53030; margin: 0 0 12px; min-height: 0; }
174
178
  /* A success/confirmation banner (e.g. after a force-login password reset). */
175
179
  .atlas-embed-flash {
176
180
  font-size: 13px; color: #0f7a4d; background: rgba(16,163,101,0.08);
@@ -390,11 +394,19 @@ form > .atlas-embed-step-back { display: block; width: 100%; text-align: center;
390
394
  @keyframes atlas-embed-pulse { 0%,100% { opacity: 0.4; } 50% { opacity: 1; } }
391
395
  `;
392
396
  /** Inject the sheet once per document. Safe to call on every mount. */
397
+ const adoptedDocs = new WeakSet();
393
398
  function injectStyles(doc = document) {
394
- if (doc.querySelector(`style[data-${exports.STYLE_MARKER}]`))
399
+ if (adoptedDocs.has(doc) || doc.querySelector(`style[data-${exports.STYLE_MARKER}]`))
395
400
  return;
401
+ // A constructable stylesheet needs no style-src under a strict CSP; else a
402
+ // <style> carrying the page's CSP nonce.
403
+ if ((0, runtime_1.adoptConstructable)(doc, exports.STYLE_MARKER, exports.EMBED_CSS)) {
404
+ adoptedDocs.add(doc);
405
+ return;
406
+ }
396
407
  const style = doc.createElement('style');
397
408
  style.setAttribute(`data-${exports.STYLE_MARKER}`, '');
409
+ (0, runtime_1.applyStyleNonce)(doc, style);
398
410
  style.textContent = exports.EMBED_CSS;
399
411
  (doc.head ?? doc.documentElement).appendChild(style);
400
412
  }
package/dist/styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":";;;AAsYA,oCAMC;AA5YD;;;;;;;;;;;;GAYG;AACU,QAAA,YAAY,GAAG,oBAAoB,CAAC;AAEpC,QAAA,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoXxB,CAAC;AAEF,uEAAuE;AACvE,SAAgB,YAAY,CAAC,MAAgB,QAAQ;IACnD,IAAI,GAAG,CAAC,aAAa,CAAC,cAAc,oBAAY,GAAG,CAAC;QAAE,OAAO;IAC7D,MAAM,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACzC,KAAK,CAAC,YAAY,CAAC,QAAQ,oBAAY,EAAE,EAAE,EAAE,CAAC,CAAC;IAC/C,KAAK,CAAC,WAAW,GAAG,iBAAS,CAAC;IAC9B,CAAC,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,eAAe,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AACvD,CAAC"}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":";;;AA4YA,oCAaC;AAzZD;;;;;;;;;;;;GAYG;AACH,uDAAgF;AACnE,QAAA,YAAY,GAAG,oBAAoB,CAAC;AAEpC,QAAA,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuXxB,CAAC;AAEF,uEAAuE;AACvE,MAAM,WAAW,GAAG,IAAI,OAAO,EAAY,CAAC;AAE5C,SAAgB,YAAY,CAAC,MAAgB,QAAQ;IACnD,IAAI,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,aAAa,CAAC,cAAc,oBAAY,GAAG,CAAC;QAAE,OAAO;IACrF,2EAA2E;IAC3E,yCAAyC;IACzC,IAAI,IAAA,4BAAkB,EAAC,GAAG,EAAE,oBAAY,EAAE,iBAAS,CAAC,EAAE,CAAC;QACrD,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QACrB,OAAO;IACT,CAAC;IACD,MAAM,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACzC,KAAK,CAAC,YAAY,CAAC,QAAQ,oBAAY,EAAE,EAAE,EAAE,CAAC,CAAC;IAC/C,IAAA,yBAAe,EAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IAC5B,KAAK,CAAC,WAAW,GAAG,iBAAS,CAAC;IAC9B,CAAC,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,eAAe,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AACvD,CAAC"}
package/dist/version.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import type { AtlasSdkInfo } from '@atlasauth/js';
2
2
  /** This package's version, sent as `X-Atlas-SDK` (kept in step with package.json by a test). */
3
- export declare const ATLAS_EMBED_VERSION = "0.11.0";
3
+ export declare const ATLAS_EMBED_VERSION = "0.13.0";
4
4
  export declare const ATLAS_EMBED_SDK: AtlasSdkInfo;
package/dist/version.js CHANGED
@@ -2,6 +2,6 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.ATLAS_EMBED_SDK = exports.ATLAS_EMBED_VERSION = void 0;
4
4
  /** This package's version, sent as `X-Atlas-SDK` (kept in step with package.json by a test). */
5
- exports.ATLAS_EMBED_VERSION = '0.11.0';
5
+ exports.ATLAS_EMBED_VERSION = '0.13.0';
6
6
  exports.ATLAS_EMBED_SDK = { name: '@atlasauth/embed', version: exports.ATLAS_EMBED_VERSION };
7
7
  //# sourceMappingURL=version.js.map
package/dist/widget/dom.js CHANGED
@@ -15,6 +15,11 @@ function el(w, tag, className, text) {
15
15
  node.className = className;
16
16
  if (text != null)
17
17
  node.textContent = text;
18
+ // Validation and server errors are announced the moment they appear (WCAG 4.1.3).
19
+ if (node.classList.contains('atlas-embed-form-error') ||
20
+ node.classList.contains('atlas-embed-error')) {
21
+ node.setAttribute('role', 'alert');
22
+ }
18
23
  // The two button classes the ripple stylesheet clips — bind the tap ripple
19
24
  // here so every submit/social button gets it without touching each call site.
20
25
  if (node.classList.contains('atlas-embed-button') ||
package/dist/widget/dom.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"dom.js","sourceRoot":"","sources":["../../src/widget/dom.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"dom.js","sourceRoot":"","sources":["../../src/widget/dom.ts"],"names":[],"mappings":"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"}
package/dist/widget.js CHANGED
@@ -141,6 +141,10 @@ class AtlasWidget {
141
141
  async mount() {
142
142
  (0, styles_1.injectStyles)(this.root.ownerDocument ?? document);
143
143
  this.root.classList.add('atlas-embed-root');
144
+ // The panel speaks the language it was given, so assistive technology reads
145
+ // it in that language even when the host page is in another (WCAG 3.1.2).
146
+ if (this.options.locale && !this.root.hasAttribute('lang'))
147
+ this.root.setAttribute('lang', this.options.locale);
144
148
  // An inline preset/design themes the very first (loading) paint.
145
149
  this.resolveDesign(null);
146
150
  this.applyTheme();
package/dist/widget.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"widget.js","sourceRoot":"","sources":["../src/widget.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"widget.js","sourceRoot":"","sources":["../src/widget.ts"],"names":[],"mappings":";;;AACA,sCAkBuB;AACvB,6CAmBsB;AACtB,qCAAyD;AACzD,qCAAwC;AACxC,uDAAkI;AAClI,qCAA2D;AAC3D,4CAAwD;AACxD,wCAAsD;AACtD,8CAA2D;AAC3D,gDAAuD;AA+DvD,MAAa,WAAW;IAyGX;IACA;IAzGF,MAAM,CAAa;IACnB,IAAI,CAAwB;IACrC,UAAU,GAA4B,IAAI,CAAC;IAC3C,mFAAmF;IACnF,MAAM,GAAwB,IAAI,CAAC;IAC3B,aAAa,CAAqB;IAC1C,SAAS,GAAa,EAAE,CAAC;IACzB,mFAAmF;IACnF,eAAe,GAA8C,EAAE,CAAC;IAChE,6EAA6E;IAC7E,eAAe,GAAiD,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IACnF,yFAAyF;IACzF,MAAM,GAA0B,IAAA,iCAAoB,EAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAC3E,oFAAoF;IACpF,cAAc,GAAmB,OAAO,CAAC;IACzC,qFAAqF;IACrF,WAAW,GAAwB,IAAA,+BAAkB,EAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAC5E;;;;;OAKG;IACH,cAAc,GAAG,KAAK,CAAC;IACvB,uFAAuF;IACvF,QAAQ,GAAG,IAAI,+BAA0B,CAAC,EAAE,CAAC,CAAC;IAC9C,gGAAgG;IAChG,eAAe,GAAuF,IAAI,CAAC;IAC3G,kFAAkF;IAClF,aAAa,GAAmB,EAAE,CAAC;IACnC,kGAAkG;IAClG,UAAU,GAAmC,IAAI,CAAC;IAClD,4GAA4G;IAC5G,gBAAgB,GAAkH,IAAI,CAAC;IACvI;;;;OAIG;IACH,iBAAiB,GAAkB,IAAI,CAAC;IACxC,uGAAuG;IACvG,YAAY,GAAkB,IAAI,CAAC;IACnC,gFAAgF;IAChF,YAAY,GAAwB,EAAE,CAAC;IACvC,kFAAkF;IAClF,eAAe,GAAG,IAAI,CAAC;IACvB,iFAAiF;IACjF,gBAAgB,GAAG,KAAK,CAAC;IACzB,gBAAgB,GAAG,KAAK,CAAC;IACzB,sFAAsF;IACtF,sBAAsB,GAAG,IAAI,CAAC;IAC9B,6FAA6F;IAC7F,cAAc,GAAG,KAAK,CAAC;IACvB,iFAAiF;IACjF,oBAAoB,GAAG,IAAI,CAAC;IAC5B,gHAAgH;IAChH,qBAAqB,GAAG,IAAI,CAAC;IAC7B,+FAA+F;IAC/F,gBAAgB,CAAmB;IACnC,gFAAgF;IAChF,QAAQ,GAA0C,IAAI,CAAC;IACvD;;;;OAIG;IACH,OAAO,GAAc,EAAE,GAAG,uBAAkB,EAAE,CAAC;IAC/C,4EAA4E;IAC5E,iBAAiB,GAAG,KAAK,CAAC;IAC1B,+EAA+E;IAC/E,QAAQ,GAAG,IAAI,CAAC;IAChB,iFAAiF;IACjF,oBAAoB,GAAG,KAAK,CAAC;IAC7B,8EAA8E;IAC9E,cAAc,GAAG,KAAK,CAAC;IACvB;;;;OAIG;IACH,YAAY,GAAiD,EAAE,CAAC;IAChE,mEAAmE;IACnE,WAAW,CAAe;IAC1B,KAAK,GAAc,gBAAW,CAAC;IAC/B;;;;OAIG;IACH,SAAS,GAA0B,IAAI,CAAC;IACxC;;;;OAIG;IACH,KAAK,GAAkB,IAAI,CAAC;IAC5B;kFAC8E;IAC9E,YAAY,GAAkB,IAAI,CAAC;IACnC,IAAI,GAAG,KAAK,CAAC;IACb,0EAA0E;IAC1E,QAAQ,CAAoB;IAE5B,YACW,IAAiB,EACjB,OAAsB;QADtB,SAAI,GAAJ,IAAI,CAAa;QACjB,YAAO,GAAP,OAAO,CAAe;QAE/B,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,IAAI,SAAS,CAAC;QACtC,+EAA+E;QAC/E,0EAA0E;QAC1E,6EAA6E;QAC7E,IAAI,CAAC,WAAW,GAAG,IAAA,+BAAkB,EAAC,SAAS,EAAE,OAAO,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QAClF,IAAI,CAAC,MAAM,GAAG,IAAA,qBAAY,EAAC;YACzB,cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,WAAW,EAAE,OAAO,CAAC,WAAW;YAChC,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,MAAM,EAAE,OAAO,CAAC,MAAM,IAAI,IAAA,kBAAa,EAAC,OAAO,CAAC,YAAY,CAAC;YAC7D,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,eAAe,EAAE,OAAO,CAAC,eAAe;SACzC,CAAC,CAAC;IACL,CAAC;IAED,6GAA6G;IAC7G,SAAS,CAAC,KAAgB;QACxB,OAAO,IAAA,0BAAqB,EAAC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IACjE,CAAC;IAED,wEAAwE;IACxE,KAAK,CAAC,KAAK;QACT,IAAA,qBAAY,EAAC,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,QAAQ,CAAC,CAAC;QAClD,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;QAC5C,4EAA4E;QAC5E,0EAA0E;QAC1E,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;YAAE,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAChH,iEAAiE;QACjE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACzB,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAA,sBAAa,EAAC,IAAI,CAAC,CAAC;QAEpB,2EAA2E;QAC3E,uEAAuE;QACvE,MAAM,OAAO,GAAG,MAAM,IAAA,4BAAqB,EAAC,IAAI,CAAC,CAAC;QAClD,IAAI,OAAO;YAAE,OAAO;QAEpB,MAAM,IAAI,GAA8B,MAAM,IAAA,wBAAe,EAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC3E,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;YAClC,qEAAqE;YACrE,qEAAqE;YACrE,qEAAqE;YACrE,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,IAAI,EAAE,CAAC;YAC1C,MAAM,cAAc,GAAG,CAAC,EAAU,EAAW,EAAE;gBAC7C,MAAM,CAAC,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;gBACrB,IAAI,CAAC,CAAC;oBAAE,OAAO,IAAI,CAAC;gBACpB,OAAO,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;YACzD,CAAC,CAAC;YACF,IAAI,CAAC,SAAS,GAAG,IAAA,6BAAgB,EAAC,IAAI,CAAC,SAAS,IAAI,EAAE,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM,CAC7E,cAAc,CACf,CAAC;YACF,IAAI,CAAC,eAAe,GAAG,CAAC,IAAI,CAAC,gBAAgB,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;YAC/F,6EAA6E;YAC7E,2EAA2E;YAC3E,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,UAAU,EAAE,QAAQ,IAAI,IAAI,CAAC;YACzD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,OAAO,IAAI,KAAK,CAAC;YACxD,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,UAAU,EAAE,SAAS,IAAI,KAAK,CAAC;YAC5D,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,UAAU,EAAE,SAAS,IAAI,KAAK,CAAC;YAC5D,qEAAqE;YACrE,2DAA2D;YAC3D,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,cAAc,EAAE,cAAc,IAAI,IAAI,CAAC;YACxE,6FAA6F;YAC7F,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,cAAc,EAAE,SAAS,IAAI,IAAI,CAAC;YACrE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,cAAc,EAAE,gBAAgB,IAAI,IAAI,CAAC;YAC3E,IAAI,CAAC,OAAO,GAAG,IAAA,kBAAa,EAAC,IAAI,CAAC,CAAC;YACnC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,kBAAkB,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;YACrE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,UAAU,KAAK,IAAI,CAAC;YAClD,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,cAAc,KAAK,IAAI,CAAC;YACzD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC;YAC5C,qEAAqE;YACrE,sEAAsE;YACtE,IAAI,MAAM,IAAA,8BAAyB,EAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;gBACjD,IAAI,CAAC,YAAY,GAAG,IAAA,2BAAsB,EAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YAChE,CAAC;YACD,IAAI,CAAC,aAAa,CAAC,IAAA,4BAAkB,EAAC,IAAI,CAAC,CAAC,CAAC;YAC7C,IAAI,CAAC,UAAU,EAAE,CAAC;QACpB,CAAC;QACD,4EAA4E;QAC5E,iDAAiD;QACjD,+EAA+E;QAC/E,IAAI,CAAC,MAAM,GAAG,IAAA,iCAAoB,EAChC,IAAI,CAAC,MAAM;YACT,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE;YACrE,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,aAAa,EAClC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,aAAa,CACvC,CAAC;QACF,IAAI,CAAC,cAAc,GAAG,IAAA,6BAAgB,EACpC,IAAI,CAAC,UAAU,EAAE,SAAS,EAC1B,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,SAAS,CACnC,CAAC;QACF,IAAI,CAAC,WAAW,GAAG,IAAA,+BAAkB,EACnC,IAAI,CAAC,MAAM;YACT,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE;YACjE,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,EAChC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,WAAW,CACrC,CAAC;QACF,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,UAAU,EAAE,YAAY,IAAI,EAAE,CAAC;QACxD,MAAM,IAAA,6BAAkB,EAAC,IAAI,CAAC,CAAC;QAC/B,yEAAyE;QACzE,0DAA0D;QAC1D,IAAI,CAAC;YACH,IAAI,CAAC,QAAQ,GAAG,IAAI,qBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,QAAQ,CAAC,CAAC;QAC5E,CAAC;QAAC,MAAM,CAAC;YACP,8BAA8B;QAChC,CAAC;QACD,IAAA,eAAM,EAAC,IAAI,CAAC,CAAC;QACb,+EAA+E;QAC/E,wEAAwE;QACxE,yEAAyE;QACzE,KAAK,IAAA,iCAAuB,EAAC,IAAI,CAAC,CAAC;IACrC,CAAC;IAEO,UAAU;QAChB,6EAA6E;QAC7E,2EAA2E;QAC3E,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,MAAM,IAAI,IAAA,0BAAa,EAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;QAC9F,MAAM,IAAI,GAAG,IAAA,yBAAY,EAAC,MAAM,CAAC,CAAC;QAClC,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;YAAE,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;QACzF,mFAAmF;QACnF,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,qCAAqC,EAAE,IAAA,0BAAa,EAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;QACvG,8EAA8E;QAC9E,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CACzB,gCAAgC,EAChC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,SAAS,EAAE,cAAc;YAChD,IAAA,wBAAW,EAAC,MAAM,CAAC,YAAY,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,CAC/E,CAAC;QACF,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,IAAI,CAAC,aAAa,GAAG,IAAA,8BAAoB,EACvC,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,QAAQ,EACnC,IAAI,CAAC,IAAI,EACT,IAAI,CAAC,MAAM,CAAC,MAAM,EAClB,IAAI,CAAC,aAAa,CACnB,CAAC;QACJ,CAAC;IACH,CAAC;IAED,0DAA0D;IAClD,aAAa,CAAC,QAA+B;QACnD,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,WAAW,IAAI,CAAC,OAAO,MAAM,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;QACpG,IAAI,WAAW,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC;YACH,WAAW,GAAG,CAAC,CAAC,GAAG,EAAE,UAAU,EAAE,CAAC,8BAA8B,CAAC,CAAC,OAAO,CAAC;QAC5E,CAAC;QAAC,MAAM,CAAC;YACP,6BAA6B;QAC/B,CAAC;QACD,IAAI,CAAC,MAAM,GAAG,IAAA,qBAAY,EAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;YAC5D,WAAW,EAAE,IAAI,CAAC,OAAO,CAAC,WAAW;YACrC,WAAW;SACZ,CAAC,CAAC;IACL,CAAC;IAED;;;;;OAKG;IACK,gBAAgB;QACtB,MAAM,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC;QAC3B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,mBAAmB,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC;QAC3D,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,oBAAoB,EAAE,CAAC,CAAC,YAAY,CAAC,CAAC;QAC7D,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;QAChD,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;QAClD,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAkB,EAAE,CAAC,CAAC,UAAU,CAAC,CAAC;QACzD,MAAM,EAAE,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,sBAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACvD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;IACjE,CAAC;CACF;AAtRD,kCAsRC"}
package/package.json CHANGED
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "name": "@atlasauth/embed",
3
- "version": "0.11.0",
3
+ "version": "0.13.0",
4
4
  "main": "./dist/index.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "dependencies": {
7
- "@atlasauth/design": "0.2.0",
8
- "@atlasauth/js": "0.19.0"
7
+ "@atlasauth/design": "0.3.0",
8
+ "@atlasauth/js": "0.21.0"
9
9
  },
10
10
  "devDependencies": {
11
11
  "esbuild": "^0.21.5",
@@ -18,6 +18,7 @@
18
18
  },
19
19
  "files": [
20
20
  "dist",
21
+ "!dist/*.tsbuildinfo",
21
22
  "README.md",
22
23
  "CHANGELOG.md"
23
24
  ],