@timmbr/ui 1.4.1 → 1.5.0

package/dist/components/Accordion/Accordion.js

@@ -25,7 +25,7 @@ const AccordionTrigger = React.forwardRef(({ className, children, ...props }, re
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-slate-500 transition-transform duration-200" })
+      /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-grey-500 transition-transform duration-200" })
     ]
   }
 ) }));

package/dist/components/Accordion/Accordion.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,oFAAyD,CAAC;AAE5F,eAAO,MAAM,wBAAwB,oFAEpC,CAAC;AAEF,eAAO,MAAM,wBAAwB,oFAEpC,CAAC"}
+{"version":3,"file":"Accordion.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,oFAAuD,CAAC;AAE1F,eAAO,MAAM,wBAAwB,oFAEpC,CAAC;AAEF,eAAO,MAAM,wBAAwB,oFAEpC,CAAC"}

package/dist/components/Accordion/Accordion.styles.js

@@ -1,11 +1,11 @@
 import { cva } from 'class-variance-authority';
 
-const accordionItemVariants = cva("border-b border-slate-200 dark:border-slate-800");
+const accordionItemVariants = cva("border-b border-grey-100 dark:border-grey-800");
 const accordionTriggerVariants = cva(
-  "flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180 cursor-pointer"
+  "flex flex-1 items-center justify-between py-4 text-body-2 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180 cursor-pointer"
 );
 const accordionContentVariants = cva(
-  "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+  "overflow-hidden text-body-2 data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
 );
 
 export { accordionContentVariants, accordionItemVariants, accordionTriggerVariants };

package/dist/components/Alert/Alert.js

@@ -61,7 +61,7 @@ const Alert = React.forwardRef(
               type: "button",
               onClick: handleDismiss,
               "aria-label": "Dismiss alert",
-              className: "shrink-0 p-1 -mr-1 -mt-1 text-muted-foreground hover:text-foreground rounded-sm transition-colors hover:bg-black/5 dark:hover:bg-white/5 cursor-pointer active:scale-95",
+              className: "shrink-0 p-1 -mr-1 -mt-1 text-muted-foreground hover:text-foreground rounded-sm transition-colors hover:bg-grey-1000/5 dark:hover:bg-grey-50/5 cursor-pointer active:scale-95",
               children: /* @__PURE__ */ jsx(X, { className: "size-4" })
             }
           )
@@ -89,7 +89,7 @@ const AlertDescription = React.forwardRef(
     {
       ref,
       "data-slot": "alert-description",
-      className: cn("text-xs text-muted-foreground leading-relaxed", className),
+      className: cn("text-body-3 text-muted-foreground leading-relaxed", className),
       ...props
     }
   )

package/dist/components/Alert/Alert.styles.js

@@ -1,7 +1,7 @@
 import { cva } from 'class-variance-authority';
 
 const alertVariants = cva(
-  "relative flex w-full gap-3 p-4 rounded-lg border text-sm font-sans transition-all duration-200",
+  "relative flex w-full gap-3 p-4 rounded-lg border text-body-2 transition-all duration-200",
   {
     variants: {
       variant: {
@@ -12,9 +12,9 @@ const alertVariants = cva(
         destructive: "border-destructive/30 bg-destructive/10 text-foreground dark:border-destructive/40 dark:bg-destructive/15"
       },
       size: {
-        sm: "p-3 text-xs gap-2.5",
-        default: "p-4 text-sm gap-3",
-        lg: "p-5 text-base gap-3.5"
+        sm: "p-3 text-body-3 gap-2.5",
+        default: "p-4 text-body-2 gap-3",
+        lg: "p-5 text-body-1 gap-3.5"
       }
     },
     defaultVariants: {

package/dist/components/AlertDialog/AlertDialog.styles.js

@@ -1,10 +1,10 @@
 import { cva } from 'class-variance-authority';
 
 const alertDialogOverlayVariants = cva(
-  "fixed inset-0 z-50 bg-black/60 backdrop-blur-xs transition-opacity duration-200 data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out"
+  "fixed inset-0 z-50 bg-grey-1000/60 backdrop-blur-xs transition-opacity duration-200 data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out"
 );
 const alertDialogContentVariants = cva(
-  "relative pointer-events-auto flex flex-col w-full max-w-lg rounded-xl border border-grey-200 dark:border-grey-800 bg-white dark:bg-grey-900 shadow-xl font-sans text-foreground overflow-hidden p-6 gap-4 data-[state=open]:animate-dialog-scale-in data-[state=closed]:animate-dialog-scale-out"
+  "relative pointer-events-auto flex flex-col w-full max-w-lg rounded-xl border border-grey-200 dark:border-grey-800 bg-grey-50 dark:bg-grey-900 shadow-xl font-sans text-foreground overflow-hidden p-6 gap-4 data-[state=open]:animate-dialog-scale-in data-[state=closed]:animate-dialog-scale-out"
 );
 const alertDialogHeaderVariants = cva(
   "flex flex-col space-y-1.5 text-left"
@@ -16,10 +16,10 @@ const alertDialogFooterVariants = cva(
   "flex flex-col-reverse sm:flex-row sm:justify-end gap-2.5 pt-2"
 );
 const alertDialogTitleVariants = cva(
-  "text-lg font-display font-semibold leading-none tracking-tight text-foreground"
+  "text-h6 font-semibold leading-none tracking-tight text-foreground"
 );
 const alertDialogDescriptionVariants = cva(
-  "text-sm text-muted-foreground font-sans leading-relaxed"
+  "text-body-2 text-muted-foreground leading-relaxed"
 );
 
 export { alertDialogBodyVariants, alertDialogContentVariants, alertDialogDescriptionVariants, alertDialogFooterVariants, alertDialogHeaderVariants, alertDialogOverlayVariants, alertDialogTitleVariants };

package/dist/components/AuthModal/AuthModal.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import type { AuthModalProps } from './AuthModal.types';
+export declare const AuthModal: React.ForwardRefExoticComponent<AuthModalProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=AuthModal.d.ts.map

package/dist/components/AuthModal/AuthModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthModal.d.ts","sourceRoot":"","sources":["../../../src/components/AuthModal/AuthModal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAWxD,eAAO,MAAM,SAAS,uFA6ErB,CAAC"}

package/dist/components/AuthModal/AuthModal.js

@@ -0,0 +1,89 @@
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { X } from '@timmbr/icons';
+import { cn } from '@timmbr/utils';
+import { DEFAULT_AUTH_MODAL_LABELS, AuthModalLabelsContext } from './AuthModal.labels.js';
+import { authModalCardVariants, authModalContainerVariants } from './AuthModal.styles.js';
+import { AuthModalBanner } from './subcomponents/AuthModalBanner.js';
+import { AuthModalIdentifierForm } from './subcomponents/AuthModalIdentifierForm.js';
+import { AuthModalOAuth } from './subcomponents/AuthModalOAuth.js';
+import { AuthModalSuccess } from './subcomponents/AuthModalSuccess.js';
+import { AuthModalSetPasswordForm } from './subcomponents/AuthModalSetPasswordForm.js';
+import { AuthModalPasswordForm } from './subcomponents/AuthModalPasswordForm.js';
+import { AuthModalOtpForm } from './subcomponents/AuthModalOtpForm.js';
+
+const AuthModal = React.forwardRef(
+  ({ isOpen, onClose, banner, form, oauth, legal, labels: labelOverrides, className }, ref) => {
+    const step = form.step ?? "IDENTIFIER";
+    const labels = React.useMemo(
+      () => ({ ...DEFAULT_AUTH_MODAL_LABELS, ...labelOverrides }),
+      [labelOverrides]
+    );
+    const renderStep = () => {
+      switch (step) {
+        case "OTP":
+          return /* @__PURE__ */ jsx(AuthModalOtpForm, { form });
+        case "PASSWORD":
+          return /* @__PURE__ */ jsx(AuthModalPasswordForm, { form });
+        case "SET_PASSWORD":
+          return /* @__PURE__ */ jsx(AuthModalSetPasswordForm, { form });
+        case "SUCCESS":
+          return /* @__PURE__ */ jsx(AuthModalSuccess, { form });
+        case "IDENTIFIER":
+        default:
+          return /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(AuthModalIdentifierForm, { form, legal }),
+            /* @__PURE__ */ jsx(AuthModalOAuth, { providers: oauth?.providers, disabled: form.isLoading })
+          ] });
+      }
+    };
+    return /* @__PURE__ */ jsx(AuthModalLabelsContext.Provider, { value: labels, children: /* @__PURE__ */ jsx(DialogPrimitive.Root, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { children: [
+      /* @__PURE__ */ jsx(
+        DialogPrimitive.Overlay,
+        {
+          "data-slot": "auth-modal-overlay",
+          className: "fixed inset-0 z-50 bg-grey-1000/50 backdrop-blur-[2px] transition-opacity data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-3 sm:p-4 pointer-events-none", children: /* @__PURE__ */ jsxs(
+        DialogPrimitive.Content,
+        {
+          ref,
+          "data-slot": "auth-modal-content",
+          className: cn(
+            authModalContainerVariants(),
+            "pointer-events-auto transition-all data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsx(DialogPrimitive.Title, { className: "sr-only", children: labels.dialogTitle }),
+            /* @__PURE__ */ jsx(DialogPrimitive.Description, { className: "sr-only", children: labels.dialogDescription }),
+            /* @__PURE__ */ jsx(
+              DialogPrimitive.Close,
+              {
+                "data-slot": "auth-modal-close",
+                "aria-label": labels.close,
+                className: "absolute right-3 top-3 z-30 rounded-sm p-1.5 text-grey-700 hover:text-grey-950 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-primary cursor-pointer",
+                children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4", "aria-hidden": "true" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              AuthModalBanner,
+              {
+                data: banner?.data,
+                promoTermsUrl: banner?.promoTermsUrl,
+                className: banner?.className
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { "data-slot": "auth-modal-card", className: authModalCardVariants(), children: /* @__PURE__ */ jsx("div", { children: renderStep() }) })
+          ]
+        }
+      ) })
+    ] }) }) });
+  }
+);
+AuthModal.displayName = "AuthModal";
+
+export { AuthModal };

package/dist/components/AuthModal/AuthModal.labels.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import type { AuthModalLabels } from './AuthModal.types';
+export declare const DEFAULT_AUTH_MODAL_LABELS: AuthModalLabels;
+export declare const AuthModalLabelsContext: React.Context<AuthModalLabels>;
+export declare function useAuthModalLabels(): AuthModalLabels;
+//# sourceMappingURL=AuthModal.labels.d.ts.map

package/dist/components/AuthModal/AuthModal.labels.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthModal.labels.d.ts","sourceRoot":"","sources":["../../../src/components/AuthModal/AuthModal.labels.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD,eAAO,MAAM,yBAAyB,EAAE,eA6CvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,gCAElC,CAAC;AAEF,wBAAgB,kBAAkB,oBAEjC"}

package/dist/components/AuthModal/AuthModal.labels.js

@@ -0,0 +1,52 @@
+"use client";
+import * as React from 'react';
+
+const DEFAULT_AUTH_MODAL_LABELS = {
+  dialogTitle: "Sign in",
+  dialogDescription: "Sign in or create an account with your email or mobile number.",
+  close: "Close",
+  identifierTitle: "Log in or Sign up",
+  identifierSubtitle: "Enter your email or mobile number to continue",
+  identifierLabel: "Email or mobile number",
+  identifierPlaceholder: "Email or Mobile number",
+  continue: "Continue",
+  usePassword: "Use password instead",
+  legalPrefix: "By continuing, you agree to our",
+  termsOfUse: "Terms of Use",
+  privacyPolicy: "Privacy Policy",
+  oauthDivider: "or",
+  oauthContinueWith: (name) => `Continue with ${name}`,
+  otpTitle: "Verify with OTP",
+  otpSentTo: "Sent to",
+  otpLabel: "Verification code",
+  otpSubmit: "Verify & Proceed",
+  otpResend: "Resend OTP",
+  otpResendIn: (s) => `Resend OTP in ${s}s`,
+  edit: "Edit",
+  passwordTitle: "Enter your password",
+  passwordLabel: "Password",
+  passwordPlaceholder: "Password",
+  passwordSubmit: "Log in",
+  forgotPassword: "Forgot password? Log in with OTP",
+  showPassword: "Show password",
+  hidePassword: "Hide password",
+  setPasswordCreateTitle: "Create a password",
+  setPasswordCreateSubtitle: "Sign in faster next time with your password.",
+  setPasswordResetTitle: "Set a new password",
+  setPasswordResetSubtitle: "You're verified. Choose a new password for your account.",
+  newPasswordLabel: "New password",
+  confirmPasswordLabel: "Confirm password",
+  passwordHint: "At least 8 characters, with an uppercase letter, a number and a symbol.",
+  passwordMismatch: "Passwords don't match.",
+  setPasswordSubmit: "Save password",
+  skipForNow: "Skip for now",
+  successTitle: "You're signed in"
+};
+const AuthModalLabelsContext = React.createContext(
+  DEFAULT_AUTH_MODAL_LABELS
+);
+function useAuthModalLabels() {
+  return React.useContext(AuthModalLabelsContext);
+}
+
+export { AuthModalLabelsContext, DEFAULT_AUTH_MODAL_LABELS, useAuthModalLabels };

package/dist/components/AuthModal/AuthModal.styles.d.ts

@@ -0,0 +1,12 @@
+export declare const authModalContainerVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalBannerVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalCardVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalHeadingVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalSubtitleVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalInputVariants: (props?: ({
+    invalid?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const authModalSubmitButtonVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalSecondaryButtonVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const authModalLinkVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+//# sourceMappingURL=AuthModal.styles.d.ts.map

package/dist/components/AuthModal/AuthModal.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthModal.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AuthModal/AuthModal.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,0BAA0B,oFAEtC,CAAC;AAEF,eAAO,MAAM,uBAAuB,oFAEnC,CAAC;AAEF,eAAO,MAAM,qBAAqB,oFAEjC,CAAC;AAEF,eAAO,MAAM,wBAAwB,oFAEpC,CAAC;AAEF,eAAO,MAAM,yBAAyB,oFAA0C,CAAC;AAEjF,eAAO,MAAM,sBAAsB;;8EAWlC,CAAC;AAEF,eAAO,MAAM,6BAA6B,oFAEzC,CAAC;AAEF,eAAO,MAAM,gCAAgC,oFAE5C,CAAC;AAEF,eAAO,MAAM,qBAAqB,oFAEjC,CAAC"}

package/dist/components/AuthModal/AuthModal.styles.js

@@ -0,0 +1,38 @@
+import { cva } from 'class-variance-authority';
+
+const authModalContainerVariants = cva(
+  "relative flex w-full max-w-[675px] bg-grey-50 overflow-hidden rounded-sm shadow-[0px_12px_24px_-4px_rgba(0,0,0,0.15)] flex-col sm:flex-row sm:min-h-[454px] max-h-[calc(100dvh-24px)] sm:max-h-[calc(100dvh-32px)]"
+);
+const authModalBannerVariants = cva(
+  "relative hidden sm:flex shrink-0 w-[320px] flex-col justify-between p-8 overflow-hidden select-none"
+);
+const authModalCardVariants = cva(
+  "flex-1 min-w-0 min-h-0 p-6 sm:p-8 flex flex-col justify-between overflow-y-auto"
+);
+const authModalHeadingVariants = cva(
+  "text-h4 text-grey-950 tracking-tight outline-none"
+);
+const authModalSubtitleVariants = cva("text-body-2 text-grey-600 mt-1.5");
+const authModalInputVariants = cva(
+  "w-full px-4 py-3 rounded-lg border bg-grey-50 text-body-1 text-grey-950 placeholder:text-sand-muted focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent transition-all disabled:opacity-50",
+  {
+    variants: {
+      invalid: {
+        true: "border-destructive",
+        false: "border-border-warm"
+      }
+    },
+    defaultVariants: { invalid: false }
+  }
+);
+const authModalSubmitButtonVariants = cva(
+  "w-full py-3 px-4 rounded-lg bg-primary text-grey-50 font-medium text-body-1 hover:bg-primary-600 active:bg-primary-700 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2 cursor-pointer shadow-sm"
+);
+const authModalSecondaryButtonVariants = cva(
+  "w-full py-3 px-4 rounded-lg border border-border-warm bg-grey-50 text-grey-950 font-medium text-body-2 hover:bg-bg-2 active:bg-bg-1 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-3 cursor-pointer"
+);
+const authModalLinkVariants = cva(
+  "font-sans font-medium text-primary hover:underline cursor-pointer disabled:opacity-50 disabled:no-underline disabled:cursor-not-allowed focus:outline-none focus-visible:underline"
+);
+
+export { authModalBannerVariants, authModalCardVariants, authModalContainerVariants, authModalHeadingVariants, authModalInputVariants, authModalLinkVariants, authModalSecondaryButtonVariants, authModalSubmitButtonVariants, authModalSubtitleVariants };

package/dist/components/AuthModal/AuthModal.types.d.ts

@@ -0,0 +1,158 @@
+import type { ReactNode, FormEvent } from 'react';
+export interface AuthModalBannerData {
+    title?: string;
+    subtitle?: string;
+    promoBadge?: string;
+    termsNotice?: string;
+    imageUrl?: string;
+    iconUrl?: string;
+    logoUrl?: string;
+}
+/**
+ * IDENTIFIER → OTP | PASSWORD → [SET_PASSWORD] → SUCCESS
+ * - IDENTIFIER: email or phone, "Continue" (OTP) or "Use password instead"
+ * - OTP: one-time code
+ * - PASSWORD: password sign-in, with "Forgot password?"
+ * - SET_PASSWORD: create (new account, skippable) or reset (forgot password)
+ * - SUCCESS: signed-in confirmation
+ */
+export type AuthModalStep = 'IDENTIFIER' | 'OTP' | 'PASSWORD' | 'SET_PASSWORD' | 'SUCCESS';
+export type AuthModalSetPasswordMode = 'create' | 'reset';
+export interface AuthOAuthProvider {
+    /** Provider identifier, e.g. 'google', 'apple', 'github', or custom */
+    id: 'google' | 'apple' | 'github' | string;
+    /** Display label for the provider, e.g. 'Google', 'Apple', 'GitHub' */
+    name: string;
+    /** Custom icon ReactNode. If omitted, built-in icon is used for google, apple, github */
+    icon?: ReactNode;
+    /** Click handler for initiating OAuth flow */
+    onClick: () => void;
+    /** Whether this provider is currently in a loading state */
+    isLoading?: boolean;
+    /** Whether this provider is disabled */
+    disabled?: boolean;
+}
+export interface AuthModalBannerProps {
+    /** Promotional banner content. The banner is hidden when no image is provided. */
+    data?: AuthModalBannerData;
+    /** Link for the promo's terms notice (e.g. "*T&C Apply"); not the site's Terms of Use */
+    promoTermsUrl?: string;
+    /** Custom banner wrapper class */
+    className?: string;
+}
+export interface AuthModalFormProps {
+    /** Current step (see AuthModalStep) */
+    step?: AuthModalStep;
+    /** Whether an async request is currently loading */
+    isLoading?: boolean;
+    /** Error message for the current step */
+    error?: string | null;
+    /** Identifier input value (phone number or email) */
+    identifier?: string;
+    onIdentifierChange?: (value: string) => void;
+    /** Primary action: send a one-time code */
+    onIdentifierSubmit?: (e: FormEvent) => void;
+    /** Secondary action: switch to the PASSWORD step. Hidden when omitted. */
+    onUsePassword?: () => void;
+    /** One-time code value */
+    otp?: string;
+    onOtpChange?: (value: string) => void;
+    onOtpSubmit?: (e: FormEvent) => void;
+    /** Number of digits in the code. Defaults to 6 */
+    otpLength?: number;
+    onResendOtp?: () => void;
+    /** Resend countdown in seconds (0 = enabled) */
+    resendCountdown?: number;
+    /** Masked destination where the code was sent (e.g. a***x@gmail.com) */
+    destination?: string;
+    /** "Edit" link on OTP/PASSWORD steps: go back to IDENTIFIER */
+    onEditIdentifier?: () => void;
+    password?: string;
+    onPasswordChange?: (value: string) => void;
+    onPasswordSubmit?: (e: FormEvent) => void;
+    /** "Forgot password?" — typically sends a one-time code instead */
+    onForgotPassword?: () => void;
+    setPasswordMode?: AuthModalSetPasswordMode;
+    newPassword?: string;
+    onNewPasswordChange?: (value: string) => void;
+    confirmPassword?: string;
+    onConfirmPasswordChange?: (value: string) => void;
+    onSetPasswordSubmit?: (e: FormEvent) => void;
+    /** "Skip for now" (create mode only). Hidden when omitted. */
+    onSkipSetPassword?: () => void;
+    /** Heading shown on the SUCCESS step */
+    successTitle?: string;
+    /** Supporting text shown on the SUCCESS step */
+    successMessage?: string;
+}
+export interface AuthModalOAuthProps {
+    /** List of OAuth providers to display */
+    providers?: AuthOAuthProvider[];
+}
+export interface AuthModalLegalProps {
+    /** Terms of Service URL. Defaults to '/terms' */
+    termsUrl?: string;
+    /** Privacy Policy URL. Defaults to '/privacy' */
+    privacyUrl?: string;
+}
+/** All user-facing copy. Every key has an English default. */
+export interface AuthModalLabels {
+    dialogTitle: string;
+    dialogDescription: string;
+    close: string;
+    identifierTitle: string;
+    identifierSubtitle: string;
+    identifierLabel: string;
+    identifierPlaceholder: string;
+    continue: string;
+    usePassword: string;
+    legalPrefix: string;
+    termsOfUse: string;
+    privacyPolicy: string;
+    oauthDivider: string;
+    oauthContinueWith: (providerName: string) => string;
+    otpTitle: string;
+    otpSentTo: string;
+    otpLabel: string;
+    otpSubmit: string;
+    otpResend: string;
+    otpResendIn: (seconds: number) => string;
+    edit: string;
+    passwordTitle: string;
+    passwordLabel: string;
+    passwordPlaceholder: string;
+    passwordSubmit: string;
+    forgotPassword: string;
+    showPassword: string;
+    hidePassword: string;
+    setPasswordCreateTitle: string;
+    setPasswordCreateSubtitle: string;
+    setPasswordResetTitle: string;
+    setPasswordResetSubtitle: string;
+    newPasswordLabel: string;
+    confirmPasswordLabel: string;
+    passwordHint: string;
+    passwordMismatch: string;
+    setPasswordSubmit: string;
+    skipForNow: string;
+    successTitle: string;
+}
+export interface AuthModalProps {
+    /** Controlled open state */
+    isOpen: boolean;
+    /** Callback fired when modal is closed */
+    onClose: () => void;
+    /** Promotional banner section configuration */
+    banner?: AuthModalBannerProps;
+    /** Form state, inputs, and submission callbacks */
+    form: AuthModalFormProps;
+    /** OAuth social login configuration (shown on the IDENTIFIER step) */
+    oauth?: AuthModalOAuthProps;
+    /** Legal links configuration */
+    legal?: AuthModalLegalProps;
+    /** Override any user-facing copy */
+    labels?: Partial<AuthModalLabels>;
+    /** Optional custom class name for dialog container */
+    className?: string;
+}
+//# sourceMappingURL=AuthModal.types.d.ts.map

package/dist/components/AuthModal/AuthModal.types.d.ts.map

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

package/dist/components/AuthModal/index.d.ts

@@ -0,0 +1,6 @@
+export * from './AuthModal';
+export * from './AuthModal.types';
+export * from './AuthModal.styles';
+export { DEFAULT_AUTH_MODAL_LABELS } from './AuthModal.labels';
+export * from './subcomponents';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/AuthModal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/AuthModal/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,cAAc,iBAAiB,CAAC"}

package/dist/components/AuthModal/subcomponents/AuthModalBanner.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { AuthModalBannerProps } from '../AuthModal.types';
+/**
+ * Promotional side panel (≥ sm). All content comes from the consumer (CMS);
+ * without an image the banner isn't rendered at all.
+ */
+export declare function AuthModalBanner({ data, promoTermsUrl, className }: AuthModalBannerProps): React.JSX.Element | null;
+export declare namespace AuthModalBanner {
+    var displayName: string;
+}
+//# sourceMappingURL=AuthModalBanner.d.ts.map

package/dist/components/AuthModal/subcomponents/AuthModalBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthModalBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/AuthModal/subcomponents/AuthModalBanner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAE/D;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,SAAS,EAAE,EAAE,oBAAoB,4BAqEvF;yBArEe,eAAe"}

package/dist/components/AuthModal/subcomponents/AuthModalBanner.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { cn } from '@timmbr/utils';
+import { authModalBannerVariants } from '../AuthModal.styles.js';
+
+function AuthModalBanner({ data, promoTermsUrl, className }) {
+  if (!data?.imageUrl) return null;
+  const brandIcon = data.iconUrl || data.logoUrl;
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "auth-modal-banner", className: cn(authModalBannerVariants(), className), children: [
+    /* @__PURE__ */ jsxs("div", { "aria-hidden": "true", className: "absolute inset-0 pointer-events-none z-0", children: [
+      /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: data.imageUrl,
+          alt: "",
+          width: 320,
+          height: 454,
+          loading: "lazy",
+          decoding: "async",
+          className: "h-full w-full object-cover object-center"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-grey-1000/20" })
+    ] }),
+    (brandIcon || data.title || data.subtitle) && /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex items-center gap-3 pt-2", children: [
+      brandIcon && /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: brandIcon,
+          alt: "",
+          width: 56,
+          height: 56,
+          loading: "lazy",
+          decoding: "async",
+          className: "size-14 object-contain"
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "text-grey-50 text-left leading-tight", children: [
+        data.title && /* @__PURE__ */ jsx("p", { className: "text-h4 tracking-[1.4px]", children: data.title }),
+        data.subtitle && /* @__PURE__ */ jsx("p", { className: "font-medium text-body-2 tracking-[0.7px]", children: data.subtitle })
+      ] })
+    ] }),
+    (data.promoBadge || data.termsNotice) && /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex flex-col items-start gap-4 pb-2", children: [
+      data.promoBadge && /* @__PURE__ */ jsx("div", { className: "bg-primary-400 px-3.5 py-1.5 rounded-sm shadow-sm", children: /* @__PURE__ */ jsx("span", { className: "text-grey-50 font-semibold text-body-3 tracking-wider uppercase", children: data.promoBadge }) }),
+      data.termsNotice && (promoTermsUrl ? /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: promoTermsUrl,
+          className: "text-grey-50/80 hover:text-grey-50 text-body-3 underline underline-offset-2 transition-colors",
+          children: data.termsNotice
+        }
+      ) : /* @__PURE__ */ jsx("p", { className: "text-grey-50/80 text-body-3", children: data.termsNotice }))
+    ] })
+  ] });
+}
+AuthModalBanner.displayName = "AuthModalBanner";
+
+export { AuthModalBanner };

package/dist/components/AuthModal/subcomponents/AuthModalIdentifierForm.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { AuthModalFormProps, AuthModalLegalProps } from '../AuthModal.types';
+export interface AuthModalIdentifierFormProps {
+    form: AuthModalFormProps;
+    legal?: AuthModalLegalProps;
+}
+export declare function AuthModalIdentifierForm({ form, legal }: AuthModalIdentifierFormProps): React.JSX.Element;
+export declare namespace AuthModalIdentifierForm {
+    var displayName: string;
+}
+//# sourceMappingURL=AuthModalIdentifierForm.d.ts.map

package/dist/components/AuthModal/subcomponents/AuthModalIdentifierForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthModalIdentifierForm.d.ts","sourceRoot":"","sources":["../../../../src/components/AuthModal/subcomponents/AuthModalIdentifierForm.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAGlF,MAAM,WAAW,4BAA4B;IAC3C,IAAI,EAAE,kBAAkB,CAAC;IACzB,KAAK,CAAC,EAAE,mBAAmB,CAAC;CAC7B;AAKD,wBAAgB,uBAAuB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,4BAA4B,qBAkEpF;yBAlEe,uBAAuB"}