@atlasauth/embed 0.1.0

package/dist/appearance.d.ts

@@ -0,0 +1,293 @@
+/**
+ * The widget's theming model, mirroring the React SDK's appearance system
+ * (packages/react/src/appearance.ts) but for a framework-agnostic custom
+ * element: design tokens become CSS custom properties on the widget root, and
+ * per-element class overrides are APPENDED to ours so a tenant's `class` makes
+ * a rounder button rather than an unstyled one.
+ *
+ * Two sources feed it:
+ *   - the tenant's PUBLIC appearance, fetched from `GET /v1/appearance` — the
+ *     same resolved/sanitised branding the hosted page uses, minus anything
+ *     that is not safe to hand a third-party origin (see the endpoint).
+ *   - an inline `appearance` option the embedding page passes, which wins.
+ */
+/** Design tokens a tenant (or the inline override) can set. */
+export interface DesignTokens {
+    colorPrimary?: string;
+    colorText?: string;
+    colorBackground?: string;
+    colorAccent?: string;
+    colorCard?: string;
+    colorBorder?: string;
+    borderRadius?: string;
+    fontFamily?: string;
+}
+/** Every element a page may target with an appended class. */
+export type ElementKey = 'root' | 'card' | 'title' | 'subtitle' | 'field' | 'label' | 'input' | 'error' | 'buttonPrimary' | 'socialButton' | 'divider' | 'footer';
+/**
+ * How the social sign-in buttons are drawn — the knobs a page opens up so a
+ * tenant can make them their own without writing CSS.
+ *
+ *   variant — `block` is the full "Continue with Google" bar (default); `compact`
+ *     is the brand mark + short name ("Google"); `icon` is the mark alone (great
+ *     for a dense grid or carousel of many providers).
+ *   size    — button height/scale: `sm` | `md` (default) | `lg`.
+ *   layout  — `list` stacks them (default); `grid` wraps them into rows;
+ *     `carousel` is a single swipeable, scroll-snapped row.
+ *   labels  — per-provider text override, e.g. `{ github: 'Sign in with GitHub' }`.
+ *     Ignored by the `icon` variant, where the name becomes the tooltip / a11y label.
+ *   search  — a filter box above the buttons so a user can type to narrow a long
+ *     provider list. `auto` (default) shows it only once there are more than
+ *     {@link SEARCH_AUTO_THRESHOLD} social providers — so a handful stays clean but
+ *     a wall of 20 becomes searchable; `always` forces it; `never` hides it.
+ */
+export type SocialButtonVariant = 'block' | 'compact' | 'icon';
+export type SocialButtonSize = 'sm' | 'md' | 'lg';
+export type SocialButtonLayout = 'list' | 'grid' | 'carousel';
+export type SocialButtonSearch = 'auto' | 'always' | 'never';
+/**
+ * How a verification code (email code, 2FA) is entered. `boxes` (default) is the
+ * segmented one-box-per-digit input that auto-advances and accepts a paste;
+ * `single` is one plain text field. Purely presentational — both submit the same
+ * `code`.
+ */
+export type CodeInputStyle = 'boxes' | 'single';
+/** Resolve the code-input style: inline override wins, then server, then `boxes`. */
+export declare function resolveCodeInput(server: CodeInputStyle | undefined, inline: CodeInputStyle | undefined): CodeInputStyle;
+/**
+ * At more than this many social providers, `search: 'auto'` reveals the filter
+ * box. Chosen so the common handful (Google/GitHub/…) stays button-only while a
+ * genuinely long list gets a way to fit.
+ */
+export declare const SEARCH_AUTO_THRESHOLD = 8;
+export interface SocialButtonsConfig {
+    variant?: SocialButtonVariant;
+    size?: SocialButtonSize;
+    layout?: SocialButtonLayout;
+    labels?: Record<string, string>;
+    search?: SocialButtonSearch;
+}
+/**
+ * The interaction / micro-polish layer — how controls *feel*, independent of the
+ * colour tokens. Every knob has a flattering default so the widget looks polished
+ * out of the box, and every one is a closed allow-list so a bad stored value can
+ * only fall back, never render a broken attribute.
+ *
+ *   buttonStyle  — the primary CTA's fill: `solid` (default), `outline`, `soft`
+ *     (tinted primary at low alpha), or `ghost` (text-only until hover). Social
+ *     buttons keep their neutral provider styling regardless — recognisability.
+ *   buttonEffect — press/hover feedback on every button: `scale` (subtle press-in,
+ *     default), `lift` (raises on hover), `glow` (primary halo on hover), `ripple`
+ *     (a material tap ripple), or `none`.
+ *   shadow       — elevation of the card (and solid buttons): `none | sm | md | lg`.
+ *   density      — spacing scale: `comfortable` (default) or `compact`.
+ *   inputStyle   — field treatment: `outline` (default), `filled`, or `underline`.
+ *   animations   — master motion switch (default on). `prefers-reduced-motion` is
+ *     always honoured on top of this, never overridden by it.
+ *   motionSpeed  — transition tempo: `slow | normal | fast`.
+ */
+export type ButtonStyle = 'solid' | 'outline' | 'soft' | 'ghost';
+export type ButtonEffect = 'none' | 'scale' | 'lift' | 'glow' | 'ripple';
+export type ShadowDepth = 'none' | 'sm' | 'md' | 'lg';
+export type Density = 'comfortable' | 'compact';
+export type InputStyle = 'outline' | 'filled' | 'underline';
+export type MotionSpeed = 'slow' | 'normal' | 'fast';
+/**
+ * How the widget shows it is working — while it fetches the tenant's appearance,
+ * exchanges an OAuth/hosted ticket on redirect-back, or a form is submitting.
+ *   spinner  — a centred brand spinner (default).
+ *   skeleton — shimmer placeholders shaped like the form (title + fields + button).
+ *   dots     — three pulsing dots.
+ *   bar      — an indeterminate progress bar across the top of the card.
+ */
+export type LoadingStyle = 'spinner' | 'skeleton' | 'dots' | 'bar';
+export interface InteractionConfig {
+    buttonStyle?: ButtonStyle;
+    buttonEffect?: ButtonEffect;
+    shadow?: ShadowDepth;
+    density?: Density;
+    inputStyle?: InputStyle;
+    animations?: boolean;
+    motionSpeed?: MotionSpeed;
+    loading?: LoadingStyle;
+}
+export interface ResolvedInteraction {
+    buttonStyle: ButtonStyle;
+    buttonEffect: ButtonEffect;
+    shadow: ShadowDepth;
+    density: Density;
+    inputStyle: InputStyle;
+    animations: boolean;
+    motionSpeed: MotionSpeed;
+    loading: LoadingStyle;
+}
+/** Transition duration (ms) per tempo — read by the widget into a CSS var. */
+export declare const MOTION_MS: Record<MotionSpeed, number>;
+/**
+ * Resolve the interaction config: inline override wins over the tenant's
+ * server-side default, each validated against its allow-list, else a flattering
+ * default. `buttonEffect: 'scale'` and `animations: true` are the defaults so the
+ * widget feels alive out of the box; a tenant can dial any of it back.
+ */
+export declare function resolveInteraction(server: InteractionConfig | undefined, inline: InteractionConfig | undefined): ResolvedInteraction;
+export interface ResolvedSocialButtons {
+    variant: SocialButtonVariant;
+    size: SocialButtonSize;
+    layout: SocialButtonLayout;
+    labels: Record<string, string>;
+    search: SocialButtonSearch;
+}
+/**
+ * Resolve the social-button config from the tenant's server-side default merged
+ * with the inline override (which wins), falling back to safe defaults. Every
+ * value is validated against its allow-list, so a bad stored value can never
+ * produce a broken `data-variant` — it just falls back.
+ */
+export declare function resolveSocialButtons(server: SocialButtonsConfig | undefined, inline: SocialButtonsConfig | undefined): ResolvedSocialButtons;
+/** The inline override an embedding page may pass as `appearance`. */
+export interface WidgetAppearance {
+    variables?: DesignTokens;
+    elements?: Partial<Record<ElementKey, string>>;
+    /** How the social buttons look — variant, size, layout, per-provider labels. */
+    socialButtons?: SocialButtonsConfig;
+    /** How a verification code is entered — segmented `boxes` (default) or `single`. */
+    codeInput?: CodeInputStyle;
+    /** How controls feel — button style/effect, shadow, density, input style, motion. */
+    interaction?: InteractionConfig;
+}
+/** First-party strategies the instance has switched on. */
+export interface PublicStrategies {
+    password: boolean;
+    emailCode: boolean;
+    emailLink: boolean;
+    passkey: boolean;
+    phoneCode: boolean;
+    siwe: boolean;
+}
+/**
+ * The tenant's public appearance, exactly the shape `GET /v1/appearance`
+ * returns under `appearance`. Every value is already resolved and sanitised
+ * server-side; NONE of it is a secret.
+ */
+export interface PublicAppearance {
+    applicationName: string;
+    logoUrl: string | null;
+    colorPrimary: string;
+    colorBackground: string;
+    colorText: string;
+    colorAccent: string;
+    colorCard: string;
+    colorBorder: string;
+    borderRadius: string;
+    theme: 'light' | 'dark' | 'auto';
+    fontStack: string;
+    layout: 'centered' | 'split' | 'wall';
+    headline: string | null;
+    subheadline: string | null;
+    footer: string | null;
+    providerOrder: string[];
+    providerHidden: string[];
+    /** Tenant's server-side default for the social buttons; the inline override wins. */
+    socialButtons?: SocialButtonsConfig;
+    /** Tenant's server-side default for the code-input style; the inline override wins. */
+    codeInput?: CodeInputStyle;
+    /** Tenant's server-side interaction/polish defaults; the inline override wins. */
+    interaction?: InteractionConfig;
+    /** §5.1 legal consent on sign-up — Terms/Privacy links + whether it is required. */
+    legal?: {
+        termsUrl: string | null;
+        privacyUrl: string | null;
+        required: boolean;
+    };
+    /** §5 extra fields the create-account form collects (name, company, custom…). */
+    signUpFields?: PublicSignUpField[];
+}
+/** One configurable sign-up field, exactly as `/v1/appearance` resolves it. */
+export interface PublicSignUpField {
+    key: string;
+    label: string;
+    type: 'text' | 'email' | 'tel' | 'url' | 'number' | 'date' | 'textarea' | 'checkbox' | 'select' | 'radio' | 'multiselect';
+    required: boolean;
+    placeholder: string | null;
+    options: string[];
+    builtin: boolean;
+}
+/** The full `GET /v1/appearance` envelope. */
+export interface AppearanceResponse {
+    object: 'appearance';
+    appearance: PublicAppearance;
+    /** ENABLED social provider ids (keys only), e.g. `['google','github']`. */
+    providers: string[];
+    /**
+     * Enabled providers that support native / One-Tap sign-in, WITH their public
+     * client_id — a subset of `providers`. The widget uses this to render the
+     * official Google Identity Services button instead of the redirect flow. A
+     * client_id is public; no secret is ever here.
+     */
+    native_providers?: {
+        provider: string;
+        client_id: string;
+    }[];
+    /**
+     * §6.5 per-provider sign-in / sign-up scope. A provider absent from this map
+     * is unscoped (shows on both screens). The widget uses it with its `mode` to
+     * render a provider only on the screen it belongs on — the server enforces
+     * the same at the resolver, so the button and the outcome always agree.
+     */
+    provider_scopes?: Record<string, {
+        sign_in: boolean;
+        sign_up: boolean;
+    }>;
+    strategies: PublicStrategies;
+    /**
+     * "Sign in with Atlas" — the preset OIDC connection's state. When enabled, the
+     * widget renders a "Sign in with Atlas" button that starts the SSO flow for
+     * `connection_id`. Off (no button) when absent or `{ enabled: false }`.
+     */
+    sign_in_with_atlas?: {
+        enabled: boolean;
+        connection_id?: string;
+    };
+    /** §7.5 whether the widget shows a "Remember me" checkbox at sign-in. */
+    rememberMe?: boolean;
+    /** §5.3 whether the widget shows a "Remember this device" checkbox at 2FA. */
+    rememberDevice?: boolean;
+    /**
+     * §5 per-flow captcha the widget renders. Public fields only (provider, site
+     * key, render mode) — the secret stays server-side. A disabled flow reports
+     * `{ enabled: false }`, so the widget draws nothing there.
+     */
+    captchaFlows?: Partial<Record<CaptchaFlowKey, FlowCaptcha>>;
+}
+export type CaptchaFlowKey = 'signUp' | 'signIn' | 'guest' | 'passwordReset';
+export type CaptchaWidgetMode = 'invisible' | 'managed' | 'visible';
+export interface FlowCaptcha {
+    enabled: boolean;
+    provider?: string;
+    siteKey?: string | null;
+    widget?: CaptchaWidgetMode;
+}
+/** The unstyled defaults, so the widget looks right before any fetch resolves. */
+export declare const DEFAULT_TOKENS: Required<DesignTokens>;
+/** Tokens implied by a fetched public appearance. */
+export declare function tokensFromAppearance(appearance: PublicAppearance | null): Required<DesignTokens>;
+/**
+ * Resolve final tokens: defaults, then the tenant's appearance, then the inline
+ * override. Later wins and `undefined` never overwrites — a page setting one
+ * variable keeps the other seven from the tenant.
+ */
+export declare function resolveTokens(appearance: PublicAppearance | null, override?: WidgetAppearance): Required<DesignTokens>;
+/** Tokens as `--atlas-embed-*` custom properties for the root element. */
+export declare function cssVariables(tokens: Required<DesignTokens>): Record<string, string>;
+/** Our base class plus the page's override, appended so theirs wins on ties. */
+export declare function classFor(element: ElementKey, base: string, override?: WidgetAppearance): string;
+/**
+ * The provider ids to render, in order, with hidden ones removed.
+ *
+ * The server already returns only ENABLED providers; `providerOrder` is the
+ * tenant's display preference and `providerHidden` a suppression list, both
+ * cosmetic. Ordered providers come first (in the tenant's order), then any
+ * remaining enabled providers in their original order.
+ */
+export declare function orderedProviders(enabled: readonly string[], appearance: PublicAppearance | null): string[];
+export declare function providerLabel(id: string): string;

package/dist/appearance.js

@@ -0,0 +1,206 @@
+"use strict";
+/**
+ * The widget's theming model, mirroring the React SDK's appearance system
+ * (packages/react/src/appearance.ts) but for a framework-agnostic custom
+ * element: design tokens become CSS custom properties on the widget root, and
+ * per-element class overrides are APPENDED to ours so a tenant's `class` makes
+ * a rounder button rather than an unstyled one.
+ *
+ * Two sources feed it:
+ *   - the tenant's PUBLIC appearance, fetched from `GET /v1/appearance` — the
+ *     same resolved/sanitised branding the hosted page uses, minus anything
+ *     that is not safe to hand a third-party origin (see the endpoint).
+ *   - an inline `appearance` option the embedding page passes, which wins.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_TOKENS = exports.MOTION_MS = exports.SEARCH_AUTO_THRESHOLD = void 0;
+exports.resolveCodeInput = resolveCodeInput;
+exports.resolveInteraction = resolveInteraction;
+exports.resolveSocialButtons = resolveSocialButtons;
+exports.tokensFromAppearance = tokensFromAppearance;
+exports.resolveTokens = resolveTokens;
+exports.cssVariables = cssVariables;
+exports.classFor = classFor;
+exports.orderedProviders = orderedProviders;
+exports.providerLabel = providerLabel;
+const CODE_INPUT_STYLES = ['boxes', 'single'];
+/** Resolve the code-input style: inline override wins, then server, then `boxes`. */
+function resolveCodeInput(server, inline) {
+    for (const v of [inline, server])
+        if (v && CODE_INPUT_STYLES.includes(v))
+            return v;
+    return 'boxes';
+}
+/**
+ * At more than this many social providers, `search: 'auto'` reveals the filter
+ * box. Chosen so the common handful (Google/GitHub/…) stays button-only while a
+ * genuinely long list gets a way to fit.
+ */
+exports.SEARCH_AUTO_THRESHOLD = 8;
+const BUTTON_STYLES = ['solid', 'outline', 'soft', 'ghost'];
+const BUTTON_EFFECTS = ['none', 'scale', 'lift', 'glow', 'ripple'];
+const SHADOWS = ['none', 'sm', 'md', 'lg'];
+const DENSITIES = ['comfortable', 'compact'];
+const INPUT_STYLES = ['outline', 'filled', 'underline'];
+const MOTION_SPEEDS = ['slow', 'normal', 'fast'];
+const LOADING_STYLES = ['spinner', 'skeleton', 'dots', 'bar'];
+/** Transition duration (ms) per tempo — read by the widget into a CSS var. */
+exports.MOTION_MS = { slow: 280, normal: 160, fast: 80 };
+/**
+ * Resolve the interaction config: inline override wins over the tenant's
+ * server-side default, each validated against its allow-list, else a flattering
+ * default. `buttonEffect: 'scale'` and `animations: true` are the defaults so the
+ * widget feels alive out of the box; a tenant can dial any of it back.
+ */
+function resolveInteraction(server, inline) {
+    const pick = (allowed, fallback, ...vals) => {
+        for (const v of vals)
+            if (v !== undefined && allowed.includes(v))
+                return v;
+        return fallback;
+    };
+    return {
+        buttonStyle: pick(BUTTON_STYLES, 'solid', inline?.buttonStyle, server?.buttonStyle),
+        buttonEffect: pick(BUTTON_EFFECTS, 'scale', inline?.buttonEffect, server?.buttonEffect),
+        shadow: pick(SHADOWS, 'md', inline?.shadow, server?.shadow),
+        density: pick(DENSITIES, 'comfortable', inline?.density, server?.density),
+        inputStyle: pick(INPUT_STYLES, 'outline', inline?.inputStyle, server?.inputStyle),
+        animations: typeof inline?.animations === 'boolean'
+            ? inline.animations
+            : typeof server?.animations === 'boolean'
+                ? server.animations
+                : true,
+        motionSpeed: pick(MOTION_SPEEDS, 'normal', inline?.motionSpeed, server?.motionSpeed),
+        loading: pick(LOADING_STYLES, 'spinner', inline?.loading, server?.loading),
+    };
+}
+const VARIANTS = ['block', 'compact', 'icon'];
+const SIZES = ['sm', 'md', 'lg'];
+const LAYOUTS = ['list', 'grid', 'carousel'];
+const SEARCH_MODES = ['auto', 'always', 'never'];
+/**
+ * Resolve the social-button config from the tenant's server-side default merged
+ * with the inline override (which wins), falling back to safe defaults. Every
+ * value is validated against its allow-list, so a bad stored value can never
+ * produce a broken `data-variant` — it just falls back.
+ */
+function resolveSocialButtons(server, inline) {
+    const pick = (allowed, ...vals) => {
+        for (const v of vals)
+            if (v !== undefined && allowed.includes(v))
+                return v;
+        return allowed[0];
+    };
+    return {
+        variant: pick(VARIANTS, inline?.variant, server?.variant),
+        size: pick(SIZES, inline?.size ?? 'md', server?.size, 'md'),
+        layout: pick(LAYOUTS, inline?.layout, server?.layout),
+        labels: { ...(server?.labels ?? {}), ...(inline?.labels ?? {}) },
+        search: pick(SEARCH_MODES, inline?.search, server?.search),
+    };
+}
+/** The unstyled defaults, so the widget looks right before any fetch resolves. */
+exports.DEFAULT_TOKENS = {
+    colorPrimary: '#5b5bd6',
+    colorText: '#1c1c1f',
+    colorBackground: '#ffffff',
+    colorAccent: '#5b5bd6',
+    colorCard: '#ffffff',
+    colorBorder: '#e4e4e9',
+    borderRadius: '10px',
+    fontFamily: 'ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
+};
+/** Tokens implied by a fetched public appearance. */
+function tokensFromAppearance(appearance) {
+    if (!appearance)
+        return exports.DEFAULT_TOKENS;
+    return {
+        colorPrimary: appearance.colorPrimary || exports.DEFAULT_TOKENS.colorPrimary,
+        colorText: appearance.colorText || exports.DEFAULT_TOKENS.colorText,
+        colorBackground: appearance.colorBackground || exports.DEFAULT_TOKENS.colorBackground,
+        colorAccent: appearance.colorAccent || appearance.colorPrimary || exports.DEFAULT_TOKENS.colorAccent,
+        colorCard: appearance.colorCard || appearance.colorBackground || exports.DEFAULT_TOKENS.colorCard,
+        colorBorder: appearance.colorBorder || exports.DEFAULT_TOKENS.colorBorder,
+        borderRadius: appearance.borderRadius || exports.DEFAULT_TOKENS.borderRadius,
+        fontFamily: appearance.fontStack || exports.DEFAULT_TOKENS.fontFamily,
+    };
+}
+/**
+ * Resolve final tokens: defaults, then the tenant's appearance, then the inline
+ * override. Later wins and `undefined` never overwrites — a page setting one
+ * variable keeps the other seven from the tenant.
+ */
+function resolveTokens(appearance, override) {
+    const resolved = { ...tokensFromAppearance(appearance) };
+    const overrides = override?.variables ?? {};
+    for (const [key, value] of Object.entries(overrides)) {
+        if (value !== undefined)
+            resolved[key] = value;
+    }
+    return resolved;
+}
+/** Tokens as `--atlas-embed-*` custom properties for the root element. */
+function cssVariables(tokens) {
+    const vars = {};
+    for (const [key, value] of Object.entries(tokens)) {
+        vars[`--atlas-embed-${key.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`)}`] = value;
+    }
+    return vars;
+}
+/** Our base class plus the page's override, appended so theirs wins on ties. */
+function classFor(element, base, override) {
+    const extra = override?.elements?.[element];
+    return extra ? `${base} ${extra}` : base;
+}
+/**
+ * The provider ids to render, in order, with hidden ones removed.
+ *
+ * The server already returns only ENABLED providers; `providerOrder` is the
+ * tenant's display preference and `providerHidden` a suppression list, both
+ * cosmetic. Ordered providers come first (in the tenant's order), then any
+ * remaining enabled providers in their original order.
+ */
+function orderedProviders(enabled, appearance) {
+    const order = appearance?.providerOrder ?? [];
+    const hidden = new Set(appearance?.providerHidden ?? []);
+    const enabledSet = new Set(enabled.filter((id) => !hidden.has(id)));
+    const out = [];
+    for (const id of order) {
+        if (enabledSet.has(id) && !out.includes(id))
+            out.push(id);
+    }
+    for (const id of enabled) {
+        if (enabledSet.has(id) && !out.includes(id))
+            out.push(id);
+    }
+    return out;
+}
+/** A human label for a provider id, for the "Continue with …" buttons. */
+const PROVIDER_LABELS = {
+    google: 'Google',
+    github: 'GitHub',
+    gitlab: 'GitLab',
+    facebook: 'Facebook',
+    apple: 'Apple',
+    microsoft: 'Microsoft',
+    discord: 'Discord',
+    linkedin: 'LinkedIn',
+    twitter: 'X',
+    twitter_v1: 'X',
+    x: 'X',
+    slack: 'Slack',
+    spotify: 'Spotify',
+    twitch: 'Twitch',
+    notion: 'Notion',
+    linear: 'Linear',
+    steam: 'Steam',
+};
+function providerLabel(id) {
+    if (PROVIDER_LABELS[id])
+        return PROVIDER_LABELS[id];
+    return id
+        .split(/[_-]/)
+        .map((part) => (part ? part[0].toUpperCase() + part.slice(1) : part))
+        .join(' ');
+}
+//# sourceMappingURL=appearance.js.map

package/dist/appearance.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"appearance.js","sourceRoot":"","sources":["../src/appearance.ts"],"names":[],"mappings":"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"}

package/dist/client.d.ts

@@ -0,0 +1,12 @@
+import { FapiClient } from '@atlasauth/js';
+import type { AppearanceResponse } from './appearance';
+export interface WidgetClientOptions {
+    publishableKey: string;
+    /** The instance's FAPI origin, e.g. `https://accounts.acme.com`. */
+    frontendApi: string;
+    fetchImpl?: typeof fetch;
+}
+/** A FAPI client wired for the widget: shared @atlasauth/js driver, pk in the query. */
+export declare function createClient(options: WidgetClientOptions): FapiClient;
+/** Fetch the tenant's public appearance + enabled providers/strategies. */
+export declare function fetchAppearance(client: FapiClient): Promise<AppearanceResponse | null>;

package/dist/client.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createClient = createClient;
+exports.fetchAppearance = fetchAppearance;
+const js_1 = require("@atlasauth/js");
+/**
+ * The widget talks to FAPI cross-origin, so the browser sends a CORS preflight
+ * before every non-simple request. A preflight `OPTIONS` carries NO custom
+ * headers — the `x-publishable-key` the SDK normally sends is stripped — so the
+ * API could not tell WHICH instance the request targets and could not decide
+ * whether the page's Origin is allow-listed for it.
+ *
+ * The fix is to also carry the publishable key in the query string. The
+ * preflight is sent to the same URL (query included), so the CORS gate resolves
+ * the exact instance and checks THAT instance's `allowedOrigins` — never a
+ * cross-tenant guess. The header is still sent on the real request; this only
+ * adds the query param the preflight needs.
+ */
+function widgetFetch(publishableKey, base) {
+    return ((input, init) => {
+        const href = typeof input === 'string' ? input : input.toString();
+        let url;
+        try {
+            url = new URL(href);
+        }
+        catch {
+            return base(input, init);
+        }
+        if (!url.searchParams.has('publishable_key')) {
+            url.searchParams.set('publishable_key', publishableKey);
+        }
+        return base(url.toString(), init);
+    });
+}
+/** A FAPI client wired for the widget: shared @atlasauth/js driver, pk in the query. */
+function createClient(options) {
+    const base = options.fetchImpl ?? fetch;
+    return new js_1.FapiClient({
+        publishableKey: options.publishableKey,
+        baseUrl: options.frontendApi.replace(/\/$/, ''),
+        fetchImpl: widgetFetch(options.publishableKey, base),
+    });
+}
+/** Fetch the tenant's public appearance + enabled providers/strategies. */
+async function fetchAppearance(client) {
+    const response = await client.get('/v1/appearance');
+    return response.ok ? response.data : null;
+}
+//# sourceMappingURL=client.js.map

package/dist/client.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.js","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":";;AAwCA,oCAOC;AAGD,0CAGC;AArDD,sCAA2C;AAG3C;;;;;;;;;;;;GAYG;AACH,SAAS,WAAW,CAAC,cAAsB,EAAE,IAAkB;IAC7D,OAAO,CAAC,CAAC,KAAwB,EAAE,IAAkB,EAAE,EAAE;QACvD,MAAM,IAAI,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;QAClE,IAAI,GAAQ,CAAC;QACb,IAAI,CAAC;YACH,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;QAAC,MAAM,CAAC;YACP,OAAO,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QAC3B,CAAC;QACD,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,iBAAiB,CAAC,EAAE,CAAC;YAC7C,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,iBAAiB,EAAE,cAAc,CAAC,CAAC;QAC1D,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,CAAC;IACpC,CAAC,CAAiB,CAAC;AACrB,CAAC;AASD,wFAAwF;AACxF,SAAgB,YAAY,CAAC,OAA4B;IACvD,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,IAAI,KAAK,CAAC;IACxC,OAAO,IAAI,eAAU,CAAC;QACpB,cAAc,EAAE,OAAO,CAAC,cAAc;QACtC,OAAO,EAAE,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;QAC/C,SAAS,EAAE,WAAW,CAAC,OAAO,CAAC,cAAc,EAAE,IAAI,CAAC;KACrD,CAAC,CAAC;AACL,CAAC;AAED,2EAA2E;AACpE,KAAK,UAAU,eAAe,CAAC,MAAkB;IACtD,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,GAAG,CAAqB,gBAAgB,CAAC,CAAC;IACxE,OAAO,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;AAC5C,CAAC"}

package/dist/config.d.ts

@@ -0,0 +1,27 @@
+import type { WidgetOptions } from './widget';
+/**
+ * Resolving widget options from the DOM.
+ *
+ * Configuration can come from three places, most specific first:
+ *   1. the element's own attributes (`data-atlas-key`, `publishable-key`, …),
+ *   2. the imperative `mount*()` options,
+ *   3. the `<script>` tag that loaded the widget (`data-atlas-key`, …), which
+ *      supplies defaults every element on the page inherits.
+ */
+export interface ScriptDefaults {
+    publishableKey?: string;
+    frontendApi?: string;
+    redirect?: string;
+}
+export declare function setScriptDefaults(defaults: ScriptDefaults): void;
+export declare function getScriptDefaults(): ScriptDefaults;
+/** Read the `data-atlas-*` attributes off the loading script tag. */
+export declare function readScriptTag(script: HTMLScriptElement | null | undefined): ScriptDefaults;
+/**
+ * Build widget options for an element in a given mode, falling back through the
+ * element's attributes to the script-tag defaults. Returns null when the two
+ * required values — publishable key and FAPI origin — cannot be resolved.
+ */
+export declare function optionsFromElement(el: Element, mode: 'sign-in' | 'sign-up'): WidgetOptions | null;
+/** Merge imperative options over the script-tag defaults. */
+export declare function optionsFromApi(mode: 'sign-in' | 'sign-up', overrides?: Partial<WidgetOptions>): WidgetOptions | null;

package/dist/config.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setScriptDefaults = setScriptDefaults;
+exports.getScriptDefaults = getScriptDefaults;
+exports.readScriptTag = readScriptTag;
+exports.optionsFromElement = optionsFromElement;
+exports.optionsFromApi = optionsFromApi;
+let scriptDefaults = {};
+function setScriptDefaults(defaults) {
+    scriptDefaults = defaults;
+}
+function getScriptDefaults() {
+    return scriptDefaults;
+}
+/** Read the `data-atlas-*` attributes off the loading script tag. */
+function readScriptTag(script) {
+    if (!script)
+        return {};
+    const d = script.dataset;
+    const out = {};
+    if (d.atlasKey)
+        out.publishableKey = d.atlasKey;
+    if (d.atlasFapi)
+        out.frontendApi = d.atlasFapi;
+    if (d.atlasRedirect)
+        out.redirect = d.atlasRedirect;
+    return out;
+}
+/**
+ * Build widget options for an element in a given mode, falling back through the
+ * element's attributes to the script-tag defaults. Returns null when the two
+ * required values — publishable key and FAPI origin — cannot be resolved.
+ */
+function optionsFromElement(el, mode) {
+    const dataset = el.dataset;
+    const attr = (name) => el.getAttribute(name) ?? undefined;
+    const publishableKey = dataset.atlasKey ?? attr('publishable-key') ?? scriptDefaults.publishableKey;
+    const frontendApi = dataset.atlasFapi ?? attr('frontend-api') ?? scriptDefaults.frontendApi;
+    const redirect = dataset.atlasRedirect ?? attr('redirect') ?? scriptDefaults.redirect;
+    if (!publishableKey || !frontendApi)
+        return null;
+    const options = { publishableKey, frontendApi, mode };
+    if (redirect)
+        options.redirect = redirect;
+    return options;
+}
+/** Merge imperative options over the script-tag defaults. */
+function optionsFromApi(mode, overrides = {}) {
+    const publishableKey = overrides.publishableKey ?? scriptDefaults.publishableKey;
+    const frontendApi = overrides.frontendApi ?? scriptDefaults.frontendApi;
+    if (!publishableKey || !frontendApi)
+        return null;
+    return {
+        ...overrides,
+        publishableKey,
+        frontendApi,
+        redirect: overrides.redirect ?? scriptDefaults.redirect,
+        mode,
+    };
+}
+//# sourceMappingURL=config.js.map