@getgreenline/blaze-ui 1.0.24 → 1.0.26

package/dist/components/login-screen.js

@@ -0,0 +1,299 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { cn } from '../lib/utils.js';
+import { SignInView, ForgotPasswordView, ForgotPasswordSentView, SsoEmailView, FooterLinks, SplitMediaPane } from './login-screen.views.js';
+
+const DEFAULT_FOOTER_LINKS = [
+    { label: "Help", href: "#" },
+    { label: "Privacy", href: "#" },
+    { label: "Terms", href: "#" },
+];
+const DEFAULT_TESTIMONIAL = {
+    quote: '"BLAZE has completely transformed how we manage our dispensary. The platform is intuitive, fast, and our team loves it."',
+    authorName: "Sarah Johnson",
+    authorTitle: "Operations Director, Green Valley Dispensary",
+};
+const DEFAULT_LEGAL_NOTICE = (jsxs(Fragment, { children: ["By continuing, you agree to our", " ", jsx("a", { href: "#", className: "tw:underline tw:hover:text-foreground", children: "Terms of Service" }), " ", "and", " ", jsx("a", { href: "#", className: "tw:underline tw:hover:text-foreground", children: "Privacy Policy" })] }));
+function clampPercent(value) {
+    if (Number.isNaN(value)) {
+        return 40;
+    }
+    return Math.min(100, Math.max(0, value));
+}
+function clampOpacity(value) {
+    if (Number.isNaN(value)) {
+        return 0.35;
+    }
+    return Math.min(1, Math.max(0, value));
+}
+function getIdentifierInputType(mode) {
+    if (mode === "phone") {
+        return "tel";
+    }
+    if (mode === "email-or-phone") {
+        return "text";
+    }
+    return "email";
+}
+function getIdentifierDefaults(mode) {
+    if (mode === "phone") {
+        return {
+            label: "Phone number",
+            placeholder: "Enter your phone number",
+        };
+    }
+    if (mode === "email-or-phone") {
+        return {
+            label: "Email or phone",
+            placeholder: "Enter your email or phone number",
+        };
+    }
+    return {
+        label: "Email",
+        placeholder: "Enter your email address",
+    };
+}
+function LoginScreen({ className, splitLayout = true, splitImageWidthPercent = 40, imageSrc = "/login-bg.jpg", imageAlt = "Login background", imageOverlayContent, testimonial = DEFAULT_TESTIMONIAL, imageOverlayOpacity = 0.35, logo, title = "Welcome to Blaze", description = "Sign in with your email and password", tabs = [], defaultTabId, tabId, onTabChange, identifierMode = "email", identifierLabel, identifierPlaceholder, passwordLabel = "Password", passwordPlaceholder = "Enter your password", rememberMeLabel = "Remember Me", forgotPasswordLabel = "Forgot Password?", forgotPasswordTitle = "Reset your password", forgotPasswordDescription = "Enter your email and we will send reset instructions.", forgotPasswordEmailLabel = "Email", forgotPasswordEmailPlaceholder = "Enter your email address", forgotPasswordSubmitLabel = "Send Reset Link", forgotPasswordBackLabel = "Back to sign in", forgotPasswordSentTitle = "Check your email", forgotPasswordSentDescriptionPrefix = "We sent a password reset link to", forgotPasswordSentInstructions = "Click the link in the email to reset your password. If you don't see it, check your spam folder.", forgotPasswordResendLabel = "Resend email", forgotPasswordResendDelaySeconds = 60, submitLabel = "Log In", submitLoadingLabel = "Signing in...", ssoLabel = "Or", ssoButtonLabel = "Continue with Enterprise SSO", ssoEmailTitle = "Enter your email", ssoEmailDescription = "We'll check if you have an existing account or need to create one", ssoEmailLabel = "Email address", ssoEmailPlaceholder = "name@company.com", ssoEmailSubmitLabel = "Continue", ssoEmailHint = "Enterprise users will be redirected to their company's SSO portal", ssoEmailBackAriaLabel = "Go back", legalNotice, footerLinks = DEFAULT_FOOTER_LINKS, isSubmitting = false, isForgotPasswordSubmitting = false, isSsoSubmitting = false, onSubmit, onForgotPasswordSubmit, onSsoClick, onSsoSubmit, }) {
+    const id = React.useId();
+    const identifierId = `${id}-identifier`;
+    const passwordId = `${id}-password`;
+    const rememberId = `${id}-remember`;
+    const forgotEmailId = `${id}-forgot-email`;
+    const ssoEmailId = `${id}-sso-email`;
+    const [mode, setMode] = React.useState("sign-in");
+    const [identifier, setIdentifier] = React.useState("");
+    const [password, setPassword] = React.useState("");
+    const [forgotEmail, setForgotEmail] = React.useState("");
+    const [ssoEmail, setSsoEmail] = React.useState("");
+    const [rememberMe, setRememberMe] = React.useState(false);
+    const [showPassword, setShowPassword] = React.useState(false);
+    const [isResending, setIsResending] = React.useState(false);
+    const [imageLoadError, setImageLoadError] = React.useState(false);
+    const [logoLoadError, setLogoLoadError] = React.useState(false);
+    const [isSplitViewport, setIsSplitViewport] = React.useState(true);
+    const [forgotPasswordError, setForgotPasswordError] = React.useState(null);
+    const tabListRef = React.useRef(null);
+    const resendDelaySeconds = React.useMemo(() => {
+        if (Number.isNaN(forgotPasswordResendDelaySeconds)) {
+            return 60;
+        }
+        return Math.max(0, Math.floor(forgotPasswordResendDelaySeconds));
+    }, [forgotPasswordResendDelaySeconds]);
+    const [resendCountdown, setResendCountdown] = React.useState(resendDelaySeconds);
+    const firstTabId = tabs[0]?.id ?? null;
+    const [internalTabId, setInternalTabId] = React.useState(defaultTabId ?? firstTabId);
+    React.useEffect(() => {
+        if (tabId !== undefined) {
+            return;
+        }
+        if (!internalTabId && firstTabId) {
+            setInternalTabId(firstTabId);
+        }
+    }, [firstTabId, internalTabId, tabId]);
+    React.useEffect(() => {
+        setImageLoadError(false);
+    }, [imageSrc]);
+    React.useEffect(() => {
+        const handleResize = () => {
+            setIsSplitViewport(window.innerWidth >= 768);
+        };
+        handleResize();
+        window.addEventListener("resize", handleResize);
+        return () => {
+            window.removeEventListener("resize", handleResize);
+        };
+    }, []);
+    const activeTabId = tabId ?? internalTabId ?? firstTabId;
+    const shouldShowSplitPane = splitLayout && isSplitViewport;
+    const hasSplitImage = Boolean(imageSrc) && !imageLoadError;
+    const imageWidth = clampPercent(splitImageWidthPercent);
+    const overlayOpacity = clampOpacity(imageOverlayOpacity);
+    const resolvedTestimonial = testimonial === null
+        ? null
+        : {
+            quote: testimonial?.quote || DEFAULT_TESTIMONIAL.quote,
+            authorName: testimonial?.authorName || DEFAULT_TESTIMONIAL.authorName,
+            authorTitle: testimonial?.authorTitle === undefined
+                ? DEFAULT_TESTIMONIAL.authorTitle
+                : testimonial.authorTitle,
+        };
+    const identifierDefaults = React.useMemo(() => getIdentifierDefaults(identifierMode), [identifierMode]);
+    const resolvedIdentifierLabel = identifierLabel ?? identifierDefaults.label;
+    const resolvedIdentifierPlaceholder = identifierPlaceholder ?? identifierDefaults.placeholder;
+    const setTabSelection = React.useCallback((tab) => {
+        if (tab.disabled) {
+            return;
+        }
+        if (tabId === undefined) {
+            setInternalTabId(tab.id);
+        }
+        onTabChange?.(tab.id);
+    }, [onTabChange, tabId]);
+    const handleTabClick = React.useCallback((tab, options = {}) => {
+        if (tab.disabled) {
+            return;
+        }
+        setTabSelection(tab);
+        if (tab.onSelect) {
+            tab.onSelect(tab.id);
+            return;
+        }
+        if (options.allowNavigation === false ||
+            !tab.href ||
+            typeof window === "undefined") {
+            return;
+        }
+        if (tab.external) {
+            window.open(tab.href, "_blank", "noopener,noreferrer");
+            return;
+        }
+        window.location.assign(tab.href);
+    }, [setTabSelection]);
+    const handleTabKeyDown = React.useCallback((event, currentIndex) => {
+        const enabledTabIndices = tabs.reduce((acc, tab, index) => {
+            if (!tab.disabled) {
+                acc.push(index);
+            }
+            return acc;
+        }, []);
+        if (enabledTabIndices.length === 0) {
+            return;
+        }
+        const isPrev = event.key === "ArrowLeft" || event.key === "ArrowUp";
+        const isNext = event.key === "ArrowRight" || event.key === "ArrowDown";
+        const isHome = event.key === "Home";
+        const isEnd = event.key === "End";
+        if (!isPrev && !isNext && !isHome && !isEnd) {
+            return;
+        }
+        event.preventDefault();
+        let nextIndex = currentIndex;
+        if (isHome) {
+            nextIndex = enabledTabIndices[0] ?? currentIndex;
+        }
+        else if (isEnd) {
+            nextIndex = enabledTabIndices[enabledTabIndices.length - 1] ?? currentIndex;
+        }
+        else {
+            const enabledPosition = enabledTabIndices.indexOf(currentIndex);
+            const currentEnabledPosition = enabledPosition === -1 ? 0 : enabledPosition;
+            const delta = isNext ? 1 : -1;
+            const nextEnabledPosition = (currentEnabledPosition + delta + enabledTabIndices.length) %
+                enabledTabIndices.length;
+            nextIndex = enabledTabIndices[nextEnabledPosition] ?? currentIndex;
+        }
+        const nextTab = tabs[nextIndex];
+        if (!nextTab) {
+            return;
+        }
+        handleTabClick(nextTab, { allowNavigation: false });
+        const tabButtons = tabListRef.current?.querySelectorAll('[role="tab"]');
+        tabButtons?.[nextIndex]?.focus();
+    }, [handleTabClick, tabs]);
+    const handleSignInSubmit = async (event) => {
+        event.preventDefault();
+        const nextIdentifier = identifier.trim();
+        const nextPassword = password.trim();
+        if (!nextIdentifier || !nextPassword) {
+            return;
+        }
+        await onSubmit?.({
+            identifier: nextIdentifier,
+            password: nextPassword,
+            rememberMe,
+            tabId: activeTabId,
+        });
+    };
+    const handleForgotPasswordClick = () => {
+        if (identifier.includes("@")) {
+            setForgotEmail(identifier.trim());
+        }
+        setForgotPasswordError(null);
+        setMode("forgot-password");
+    };
+    const handleBackToSignIn = () => {
+        setForgotPasswordError(null);
+        setMode("sign-in");
+    };
+    const handleForgotPasswordSubmit = async (event) => {
+        event.preventDefault();
+        const nextForgotEmail = forgotEmail.trim();
+        if (!nextForgotEmail) {
+            return;
+        }
+        setForgotPasswordError(null);
+        try {
+            await onForgotPasswordSubmit?.(nextForgotEmail);
+        }
+        catch (error) {
+            const message = error instanceof Error && error.message
+                ? error.message
+                : "Failed to send reset email. Please try again.";
+            setForgotPasswordError(message);
+            return;
+        }
+        setResendCountdown(resendDelaySeconds);
+        setMode("forgot-password-sent");
+    };
+    const handleSsoClick = async () => {
+        if (onSsoClick) {
+            await onSsoClick();
+            return;
+        }
+        if (identifier.includes("@")) {
+            setSsoEmail(identifier.trim());
+        }
+        setMode("sso-email");
+    };
+    const handleSsoEmailSubmit = async (event) => {
+        event.preventDefault();
+        const nextSsoEmail = ssoEmail.trim();
+        if (!nextSsoEmail) {
+            return;
+        }
+        await onSsoSubmit?.(nextSsoEmail);
+    };
+    const handleResendEmail = async () => {
+        const nextForgotEmail = forgotEmail.trim();
+        if (!nextForgotEmail) {
+            return;
+        }
+        setForgotPasswordError(null);
+        setIsResending(true);
+        try {
+            await onForgotPasswordSubmit?.(nextForgotEmail);
+            setResendCountdown(resendDelaySeconds);
+        }
+        catch (error) {
+            const message = error instanceof Error && error.message
+                ? error.message
+                : "Failed to resend reset email. Please try again.";
+            setForgotPasswordError(message);
+        }
+        finally {
+            setIsResending(false);
+        }
+    };
+    React.useEffect(() => {
+        if (mode !== "forgot-password-sent") {
+            return;
+        }
+        if (resendCountdown <= 0) {
+            return;
+        }
+        const timeoutId = window.setTimeout(() => {
+            setResendCountdown((previous) => Math.max(0, previous - 1));
+        }, 1000);
+        return () => {
+            window.clearTimeout(timeoutId);
+        };
+    }, [mode, resendCountdown]);
+    const modeView = mode === "sign-in" ? (jsx(SignInView, { tabs: tabs, activeTabId: activeTabId, tabListRef: tabListRef, onTabClick: (tab) => handleTabClick(tab), onTabKeyDown: handleTabKeyDown, identifierId: identifierId, identifierLabel: resolvedIdentifierLabel, identifierType: getIdentifierInputType(identifierMode), identifierPlaceholder: resolvedIdentifierPlaceholder, identifier: identifier, onIdentifierChange: setIdentifier, passwordId: passwordId, passwordLabel: passwordLabel, passwordPlaceholder: passwordPlaceholder, password: password, onPasswordChange: setPassword, showPassword: showPassword, onTogglePassword: () => setShowPassword((previous) => !previous), rememberId: rememberId, rememberMe: rememberMe, onRememberMeChange: setRememberMe, rememberMeLabel: rememberMeLabel, forgotPasswordLabel: forgotPasswordLabel, onForgotPasswordClick: handleForgotPasswordClick, isSubmitting: isSubmitting, submitLabel: submitLabel, submitLoadingLabel: submitLoadingLabel, onSubmit: handleSignInSubmit, ssoLabel: ssoLabel, ssoButtonLabel: ssoButtonLabel, onSsoClick: handleSsoClick, legalNotice: legalNotice ?? DEFAULT_LEGAL_NOTICE, logo: logo, logoLoadError: logoLoadError, onLogoError: () => setLogoLoadError(true), title: title, description: description, autoCompleteIdentifier: identifierMode === "phone" ? "tel" : "email" })) : mode === "forgot-password" ? (jsx(ForgotPasswordView, { title: forgotPasswordTitle, description: forgotPasswordDescription, emailId: forgotEmailId, emailLabel: forgotPasswordEmailLabel, email: forgotEmail, onEmailChange: setForgotEmail, emailPlaceholder: forgotPasswordEmailPlaceholder, submitLabel: forgotPasswordSubmitLabel, backLabel: forgotPasswordBackLabel, isSubmitting: isForgotPasswordSubmitting, onSubmit: handleForgotPasswordSubmit, onBack: handleBackToSignIn, error: forgotPasswordError })) : mode === "forgot-password-sent" ? (jsx(ForgotPasswordSentView, { backAriaLabel: ssoEmailBackAriaLabel, onBack: handleBackToSignIn, title: forgotPasswordSentTitle, descriptionPrefix: forgotPasswordSentDescriptionPrefix, email: forgotEmail, instructions: forgotPasswordSentInstructions, resendLabel: forgotPasswordResendLabel, resendCountdown: resendCountdown, onResend: handleResendEmail, isResending: isResending, error: forgotPasswordError, backLabel: forgotPasswordBackLabel })) : (jsx(SsoEmailView, { backAriaLabel: ssoEmailBackAriaLabel, onBack: () => setMode("sign-in"), title: ssoEmailTitle, description: ssoEmailDescription, emailId: ssoEmailId, emailLabel: ssoEmailLabel, email: ssoEmail, onEmailChange: setSsoEmail, emailPlaceholder: ssoEmailPlaceholder, submitLabel: ssoEmailSubmitLabel, isSubmitting: isSsoSubmitting, onSubmit: handleSsoEmailSubmit, hint: ssoEmailHint }));
+    const content = (jsxs("div", { className: "tw:w-full tw:max-w-md", children: [jsx("div", { className: "tw:rounded-xl tw:border tw:border-border tw:bg-card tw:p-6 tw:shadow-sm sm:tw:p-8", children: jsx("div", { className: "tw:flex tw:flex-col tw:gap-8", children: modeView }) }), jsx(FooterLinks, { links: footerLinks })] }));
+    if (!splitLayout) {
+        return (jsx("div", { className: cn("tw:min-h-svh tw:w-full tw:bg-background", className), children: jsx("div", { className: "tw:flex tw:min-h-svh tw:w-full tw:items-center tw:justify-center tw:p-6 sm:tw:p-12", children: content }) }));
+    }
+    return (jsx("div", { className: cn("tw:min-h-svh tw:w-full tw:bg-background", className), children: jsxs("div", { className: "tw:flex tw:min-h-svh tw:w-full", children: [shouldShowSplitPane ? (jsx(SplitMediaPane, { widthPercent: imageWidth, hasSplitImage: hasSplitImage, imageSrc: imageSrc, imageAlt: imageAlt, onImageError: () => setImageLoadError(true), overlayOpacity: overlayOpacity, imageOverlayContent: imageOverlayContent, testimonial: resolvedTestimonial })) : null, jsx("div", { className: cn("tw:flex tw:w-full tw:items-center tw:justify-center tw:p-6 sm:tw:p-12", shouldShowSplitPane && "tw:flex-1"), children: content })] }) }));
+}
+
+export { LoginScreen };

package/dist/components/login-screen.types.d.ts

@@ -0,0 +1,82 @@
+import type * as React from "react";
+export type LoginScreenIdentifierMode = "email" | "phone" | "email-or-phone";
+export type LoginScreenTab = {
+    id: string;
+    label: string;
+    href?: string;
+    external?: boolean;
+    onSelect?: (tabId: string) => void;
+    disabled?: boolean;
+};
+export type LoginScreenFooterLink = {
+    label: string;
+    href: string;
+    external?: boolean;
+};
+export type LoginScreenSubmitPayload = {
+    identifier: string;
+    password: string;
+    rememberMe: boolean;
+    tabId: string | null;
+};
+export type LoginScreenTestimonial = {
+    quote: string;
+    authorName: string;
+    authorTitle?: string;
+};
+export interface LoginScreenProps {
+    className?: string;
+    splitLayout?: boolean;
+    splitImageWidthPercent?: number;
+    imageSrc?: string;
+    imageAlt?: string;
+    imageOverlayContent?: React.ReactNode;
+    testimonial?: LoginScreenTestimonial | null;
+    imageOverlayOpacity?: number;
+    logo?: React.ReactNode;
+    title?: string;
+    description?: string;
+    tabs?: LoginScreenTab[];
+    defaultTabId?: string;
+    tabId?: string;
+    onTabChange?: (tabId: string) => void;
+    identifierMode?: LoginScreenIdentifierMode;
+    identifierLabel?: string;
+    identifierPlaceholder?: string;
+    passwordLabel?: string;
+    passwordPlaceholder?: string;
+    rememberMeLabel?: string;
+    forgotPasswordLabel?: string;
+    forgotPasswordTitle?: string;
+    forgotPasswordDescription?: string;
+    forgotPasswordEmailLabel?: string;
+    forgotPasswordEmailPlaceholder?: string;
+    forgotPasswordSubmitLabel?: string;
+    forgotPasswordBackLabel?: string;
+    forgotPasswordSentTitle?: string;
+    forgotPasswordSentDescriptionPrefix?: string;
+    forgotPasswordSentInstructions?: string;
+    forgotPasswordResendLabel?: string;
+    forgotPasswordResendDelaySeconds?: number;
+    submitLabel?: string;
+    submitLoadingLabel?: string;
+    ssoLabel?: string | null;
+    ssoButtonLabel?: string;
+    ssoEmailTitle?: string;
+    ssoEmailDescription?: string;
+    ssoEmailLabel?: string;
+    ssoEmailPlaceholder?: string;
+    ssoEmailSubmitLabel?: string;
+    ssoEmailHint?: string;
+    ssoEmailBackAriaLabel?: string;
+    legalNotice?: React.ReactNode;
+    footerLinks?: LoginScreenFooterLink[];
+    isSubmitting?: boolean;
+    isForgotPasswordSubmitting?: boolean;
+    isSsoSubmitting?: boolean;
+    onSubmit?: (payload: LoginScreenSubmitPayload) => void | Promise<void>;
+    onForgotPasswordSubmit?: (email: string) => void | Promise<void>;
+    onSsoClick?: () => void;
+    onSsoSubmit?: (email: string) => void | Promise<void>;
+}
+//# sourceMappingURL=login-screen.types.d.ts.map

package/dist/components/login-screen.types.d.ts.map

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

package/dist/components/login-screen.views.d.ts

@@ -0,0 +1,114 @@
+import * as React from "react";
+import type { LoginScreenFooterLink, LoginScreenTab, LoginScreenTestimonial } from "./login-screen.types";
+interface BrandHeaderProps {
+    logo?: React.ReactNode;
+    logoLoadError: boolean;
+    onLogoError: () => void;
+    title: string;
+    description?: string;
+}
+interface SignInViewProps {
+    tabs: LoginScreenTab[];
+    activeTabId: string | null;
+    tabListRef: React.RefObject<HTMLDivElement | null>;
+    onTabClick: (tab: LoginScreenTab) => void;
+    onTabKeyDown: (event: React.KeyboardEvent<HTMLButtonElement>, currentIndex: number) => void;
+    identifierId: string;
+    identifierLabel: string;
+    identifierType: React.HTMLInputTypeAttribute;
+    identifierPlaceholder: string;
+    identifier: string;
+    onIdentifierChange: (value: string) => void;
+    passwordId: string;
+    passwordLabel: string;
+    passwordPlaceholder: string;
+    password: string;
+    onPasswordChange: (value: string) => void;
+    showPassword: boolean;
+    onTogglePassword: () => void;
+    rememberId: string;
+    rememberMe: boolean;
+    onRememberMeChange: (checked: boolean) => void;
+    rememberMeLabel: string;
+    forgotPasswordLabel: string;
+    onForgotPasswordClick: () => void;
+    isSubmitting: boolean;
+    submitLabel: string;
+    submitLoadingLabel: string;
+    onSubmit: (event: React.FormEvent<HTMLFormElement>) => void | Promise<void>;
+    ssoLabel: string | null;
+    ssoButtonLabel: string;
+    onSsoClick: () => void | Promise<void>;
+    legalNotice: React.ReactNode;
+    logo?: React.ReactNode;
+    logoLoadError: boolean;
+    onLogoError: () => void;
+    title: string;
+    description?: string;
+    autoCompleteIdentifier?: string;
+}
+interface ForgotPasswordViewProps {
+    title: string;
+    description: string;
+    emailId: string;
+    emailLabel: string;
+    email: string;
+    onEmailChange: (value: string) => void;
+    emailPlaceholder: string;
+    submitLabel: string;
+    backLabel: string;
+    isSubmitting: boolean;
+    onSubmit: (event: React.FormEvent<HTMLFormElement>) => void | Promise<void>;
+    onBack: () => void;
+    error: string | null;
+}
+interface ForgotPasswordSentViewProps {
+    backAriaLabel: string;
+    onBack: () => void;
+    title: string;
+    descriptionPrefix: string;
+    email: string;
+    instructions: string;
+    resendLabel: string;
+    resendCountdown: number;
+    onResend: () => void | Promise<void>;
+    isResending: boolean;
+    error: string | null;
+    backLabel: string;
+}
+interface SsoEmailViewProps {
+    backAriaLabel: string;
+    onBack: () => void;
+    title: string;
+    description: string;
+    emailId: string;
+    emailLabel: string;
+    email: string;
+    onEmailChange: (value: string) => void;
+    emailPlaceholder: string;
+    submitLabel: string;
+    isSubmitting: boolean;
+    onSubmit: (event: React.FormEvent<HTMLFormElement>) => void | Promise<void>;
+    hint: string;
+}
+interface SplitMediaPaneProps {
+    widthPercent: number;
+    hasSplitImage: boolean;
+    imageSrc?: string;
+    imageAlt: string;
+    onImageError: () => void;
+    overlayOpacity: number;
+    imageOverlayContent?: React.ReactNode;
+    testimonial: LoginScreenTestimonial | null;
+}
+export declare function BrandHeader({ logo, logoLoadError, onLogoError, title, description, }: BrandHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function SignInView({ tabs, activeTabId, tabListRef, onTabClick, onTabKeyDown, identifierId, identifierLabel, identifierType, identifierPlaceholder, identifier, onIdentifierChange, passwordId, passwordLabel, passwordPlaceholder, password, onPasswordChange, showPassword, onTogglePassword, rememberId, rememberMe, onRememberMeChange, rememberMeLabel, forgotPasswordLabel, onForgotPasswordClick, isSubmitting, submitLabel, submitLoadingLabel, onSubmit, ssoLabel, ssoButtonLabel, onSsoClick, legalNotice, logo, logoLoadError, onLogoError, title, description, autoCompleteIdentifier, }: SignInViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function ForgotPasswordView({ title, description, emailId, emailLabel, email, onEmailChange, emailPlaceholder, submitLabel, backLabel, isSubmitting, onSubmit, onBack, error, }: ForgotPasswordViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function ForgotPasswordSentView({ backAriaLabel, onBack, title, descriptionPrefix, email, instructions, resendLabel, resendCountdown, onResend, isResending, error, backLabel, }: ForgotPasswordSentViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function SsoEmailView({ backAriaLabel, onBack, title, description, emailId, emailLabel, email, onEmailChange, emailPlaceholder, submitLabel, isSubmitting, onSubmit, hint, }: SsoEmailViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function SplitMediaPane({ widthPercent, hasSplitImage, imageSrc, imageAlt, onImageError, overlayOpacity, imageOverlayContent, testimonial, }: SplitMediaPaneProps): import("react/jsx-runtime").JSX.Element;
+export declare function FooterLinks({ links }: {
+    links: LoginScreenFooterLink[];
+}): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=login-screen.views.d.ts.map

package/dist/components/login-screen.views.d.ts.map

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

package/dist/components/login-screen.views.js

@@ -0,0 +1,53 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { EyeOff, Eye, Building2, ArrowLeft, LockKeyhole } from 'lucide-react';
+import { cn } from '../lib/utils.js';
+import { Button } from './button.js';
+import { Checkbox } from './checkbox.js';
+import { Input } from './input.js';
+import { Label } from './label.js';
+
+function getLinkAttributes(external) {
+    if (!external) {
+        return {};
+    }
+    return {
+        target: "_blank",
+        rel: "noopener noreferrer",
+    };
+}
+function BrandHeader({ logo, logoLoadError, onLogoError, title, description, }) {
+    return (jsxs("div", { className: "tw:flex tw:flex-col tw:items-center tw:gap-4 tw:text-center", children: [logo ??
+                (logoLoadError ? (jsx("div", { className: "tw:flex tw:size-16 tw:items-center tw:justify-center tw:rounded-xl tw:bg-sky-100 tw:text-xl tw:font-semibold tw:text-primary", children: "B" })) : (jsx("img", { src: "/blaze-logo.png", alt: "Blaze", className: "tw:h-16 tw:w-16", onError: onLogoError }))), jsxs("div", { className: "tw:space-y-2", children: [jsx("h1", { className: "tw:text-3xl tw:font-semibold tw:tracking-tight", children: title }), description ? (jsx("p", { className: "tw:text-sm tw:text-muted-foreground", children: description })) : null] })] }));
+}
+function SignInView({ tabs, activeTabId, tabListRef, onTabClick, onTabKeyDown, identifierId, identifierLabel, identifierType, identifierPlaceholder, identifier, onIdentifierChange, passwordId, passwordLabel, passwordPlaceholder, password, onPasswordChange, showPassword, onTogglePassword, rememberId, rememberMe, onRememberMeChange, rememberMeLabel, forgotPasswordLabel, onForgotPasswordClick, isSubmitting, submitLabel, submitLoadingLabel, onSubmit, ssoLabel, ssoButtonLabel, onSsoClick, legalNotice, logo, logoLoadError, onLogoError, title, description, autoCompleteIdentifier, }) {
+    return (jsxs(Fragment, { children: [jsx(BrandHeader, { logo: logo, logoLoadError: logoLoadError, onLogoError: onLogoError, title: title, description: description }), tabs.length > 0 ? (jsx("div", { role: "tablist", ref: tabListRef, "aria-label": "Login destinations", className: "tw:inline-flex tw:w-full tw:items-center tw:rounded-lg tw:bg-muted tw:p-1", children: tabs.map((tab, index) => {
+                    const isActive = tab.id === activeTabId;
+                    return (jsx("button", { type: "button", role: "tab", "aria-selected": isActive, "aria-disabled": tab.disabled, tabIndex: isActive ? 0 : -1, disabled: tab.disabled, onClick: () => onTabClick(tab), onKeyDown: (event) => onTabKeyDown(event, index), className: cn("tw:flex-1 tw:rounded-md tw:px-3 tw:py-2 tw:text-sm tw:font-medium tw:transition-colors", "tw:outline-none tw:focus-visible:ring-2 tw:focus-visible:ring-ring tw:focus-visible:ring-offset-2", isActive
+                            ? "tw:bg-background tw:text-foreground tw:shadow-sm"
+                            : "tw:text-muted-foreground hover:tw:text-foreground", tab.disabled && "tw:cursor-not-allowed tw:opacity-50"), children: tab.label }, tab.id));
+                }) })) : null, jsxs("form", { onSubmit: onSubmit, className: "tw:flex tw:flex-col tw:gap-5", children: [jsxs("div", { className: "tw:flex tw:flex-col tw:gap-2", children: [jsx(Label, { htmlFor: identifierId, children: identifierLabel }), jsx(Input, { id: identifierId, type: identifierType, placeholder: identifierPlaceholder, value: identifier, onChange: (event) => onIdentifierChange(event.target.value), autoComplete: autoCompleteIdentifier, className: "tw:h-12", disabled: isSubmitting, required: true })] }), jsxs("div", { className: "tw:flex tw:flex-col tw:gap-2", children: [jsx(Label, { htmlFor: passwordId, children: passwordLabel }), jsxs("div", { className: "tw:relative", children: [jsx(Input, { id: passwordId, type: showPassword ? "text" : "password", placeholder: passwordPlaceholder, value: password, onChange: (event) => onPasswordChange(event.target.value), autoComplete: "current-password", className: "tw:h-12 tw:pr-10", disabled: isSubmitting, required: true }), jsx("button", { type: "button", className: "tw:absolute tw:right-3 tw:top-1/2 tw:-translate-y-1/2 tw:text-muted-foreground hover:tw:text-foreground", onClick: onTogglePassword, "aria-label": showPassword ? "Hide password" : "Show password", children: showPassword ? (jsx(EyeOff, { className: "tw:size-4" })) : (jsx(Eye, { className: "tw:size-4" })) })] })] }), jsxs("div", { className: "tw:flex tw:items-center tw:justify-between", children: [jsxs("div", { className: "tw:flex tw:items-center tw:gap-2", children: [jsx(Checkbox, { id: rememberId, checked: rememberMe, onCheckedChange: (checked) => onRememberMeChange(checked === true), disabled: isSubmitting }), jsx(Label, { htmlFor: rememberId, className: "tw:cursor-pointer tw:text-sm tw:font-normal", children: rememberMeLabel })] }), jsx("button", { type: "button", className: "tw:text-sm tw:text-primary hover:tw:underline", onClick: onForgotPasswordClick, disabled: isSubmitting, children: forgotPasswordLabel })] }), jsx(Button, { type: "submit", className: "tw:h-12 tw:w-full", loading: isSubmitting, loadingText: submitLoadingLabel, disabled: !identifier.trim() || !password.trim(), children: submitLabel })] }), ssoLabel !== null ? (jsxs(Fragment, { children: [jsxs("div", { className: "tw:relative", children: [jsx("div", { className: "tw:absolute tw:inset-0 tw:flex tw:items-center", children: jsx("span", { className: "tw:w-full tw:border-t tw:border-border" }) }), jsx("div", { className: "tw:relative tw:flex tw:justify-center tw:text-xs tw:uppercase", children: jsx("span", { className: "tw:bg-card tw:px-2 tw:text-muted-foreground", children: ssoLabel }) })] }), jsxs(Button, { type: "button", variant: "outline", className: "tw:h-12 tw:w-full", onClick: onSsoClick, disabled: isSubmitting, children: [jsx(Building2, { className: "tw:size-4" }), ssoButtonLabel] })] })) : null, jsx("p", { className: "tw:text-center tw:text-xs tw:text-muted-foreground", children: legalNotice })] }));
+}
+function ForgotPasswordView({ title, description, emailId, emailLabel, email, onEmailChange, emailPlaceholder, submitLabel, backLabel, isSubmitting, onSubmit, onBack, error, }) {
+    return (jsxs("form", { onSubmit: onSubmit, className: "tw:flex tw:flex-col tw:gap-5", children: [jsxs("div", { className: "tw:space-y-2 tw:text-center", children: [jsx("h2", { className: "tw:text-xl tw:font-semibold", children: title }), jsx("p", { className: "tw:text-sm tw:text-muted-foreground", children: description })] }), jsxs("div", { className: "tw:flex tw:flex-col tw:gap-2", children: [jsx(Label, { htmlFor: emailId, children: emailLabel }), jsx(Input, { id: emailId, type: "email", value: email, onChange: (event) => onEmailChange(event.target.value), placeholder: emailPlaceholder, autoComplete: "email", className: "tw:h-12", disabled: isSubmitting, required: true })] }), jsx(Button, { type: "submit", className: "tw:h-12 tw:w-full", loading: isSubmitting, loadingText: submitLabel, disabled: !email.trim(), children: submitLabel }), error ? jsx("p", { className: "tw:text-center tw:text-sm tw:text-destructive", children: error }) : null, jsx(Button, { type: "button", variant: "ghost", className: "tw:w-full", onClick: onBack, disabled: isSubmitting, children: backLabel })] }));
+}
+function ForgotPasswordSentView({ backAriaLabel, onBack, title, descriptionPrefix, email, instructions, resendLabel, resendCountdown, onResend, isResending, error, backLabel, }) {
+    return (jsxs("div", { className: "tw:flex tw:flex-col tw:gap-8", children: [jsx("div", { className: "tw:flex tw:items-center", children: jsx(Button, { type: "button", variant: "ghost", size: "icon", onClick: onBack, "aria-label": backAriaLabel, children: jsx(ArrowLeft, { className: "tw:size-4" }) }) }), jsxs("div", { className: "tw:flex tw:flex-col tw:items-center tw:gap-4 tw:text-center", children: [jsx("div", { className: "tw:flex tw:size-12 tw:items-center tw:justify-center tw:rounded-xl tw:bg-sky-100 tw:text-primary", children: jsx(LockKeyhole, { className: "tw:size-6" }) }), jsx("h2", { className: "tw:text-3xl tw:font-semibold tw:tracking-tight", children: title }), jsxs("p", { className: "tw:text-sm tw:text-muted-foreground", children: [descriptionPrefix, jsx("br", {}), email] })] }), jsxs("div", { className: "tw:flex tw:flex-col tw:gap-4 tw:text-center", children: [jsx("p", { className: "tw:text-sm tw:text-muted-foreground", children: instructions }), resendCountdown > 0 ? (jsxs("p", { className: "tw:text-sm tw:text-muted-foreground", children: [resendLabel, " in ", resendCountdown, "s"] })) : (jsx(Button, { type: "button", variant: "outline", className: "tw:mx-auto", loading: isResending, loadingText: `${resendLabel}...`, onClick: onResend, children: resendLabel })), error ? jsx("p", { className: "tw:text-center tw:text-sm tw:text-destructive", children: error }) : null, jsx(Button, { type: "button", variant: "ghost", className: "tw:w-full", onClick: onBack, disabled: isResending, children: backLabel })] })] }));
+}
+function SsoEmailView({ backAriaLabel, onBack, title, description, emailId, emailLabel, email, onEmailChange, emailPlaceholder, submitLabel, isSubmitting, onSubmit, hint, }) {
+    return (jsxs("div", { className: "tw:flex tw:flex-col tw:gap-8", children: [jsx("div", { className: "tw:flex tw:items-center", children: jsx(Button, { type: "button", variant: "ghost", size: "icon", onClick: onBack, "aria-label": backAriaLabel, children: jsx(ArrowLeft, { className: "tw:size-4" }) }) }), jsxs("div", { className: "tw:flex tw:flex-col tw:items-center tw:gap-4 tw:text-center", children: [jsx("div", { className: "tw:flex tw:size-12 tw:items-center tw:justify-center tw:rounded-xl tw:bg-sky-100 tw:text-primary", children: jsx(LockKeyhole, { className: "tw:size-6" }) }), jsxs("div", { className: "tw:space-y-2", children: [jsx("h2", { className: "tw:text-3xl tw:font-semibold tw:tracking-tight", children: title }), jsx("p", { className: "tw:text-sm tw:text-muted-foreground", children: description })] })] }), jsxs("form", { onSubmit: onSubmit, className: "tw:flex tw:flex-col tw:gap-5", children: [jsxs("div", { className: "tw:flex tw:flex-col tw:gap-2", children: [jsx(Label, { htmlFor: emailId, children: emailLabel }), jsx(Input, { id: emailId, type: "email", value: email, onChange: (event) => onEmailChange(event.target.value), placeholder: emailPlaceholder, autoComplete: "email", className: "tw:h-12", disabled: isSubmitting, required: true })] }), jsx(Button, { type: "submit", className: "tw:h-12 tw:w-full", loading: isSubmitting, loadingText: submitLabel, disabled: !email.trim(), children: submitLabel })] }), jsx("p", { className: "tw:text-center tw:text-sm tw:text-muted-foreground", children: hint })] }));
+}
+function SplitMediaPane({ widthPercent, hasSplitImage, imageSrc, imageAlt, onImageError, overlayOpacity, imageOverlayContent, testimonial, }) {
+    const splitImageStyle = {
+        width: `${widthPercent}%`,
+    };
+    return (jsxs("div", { className: "tw:relative tw:overflow-hidden tw:shrink-0", style: splitImageStyle, children: [hasSplitImage ? (jsx("img", { src: imageSrc, alt: imageAlt, className: "tw:h-full tw:w-full tw:object-cover", onError: onImageError })) : (jsx("div", { className: "tw:h-full tw:w-full tw:bg-gradient-to-br tw:from-slate-700 tw:via-slate-600 tw:to-slate-900" })), jsx("div", { className: "tw:absolute tw:inset-0 tw:bg-black", style: { opacity: overlayOpacity } }), jsx("div", { className: "tw:absolute tw:inset-0 tw:bg-gradient-to-t tw:from-black/85 tw:via-black/45 tw:to-black/20" }), imageOverlayContent || testimonial ? (jsx("div", { className: "tw:absolute tw:inset-x-0 tw:bottom-0 tw:z-10 tw:p-8 tw:pb-12", children: imageOverlayContent ?? (jsxs("blockquote", { className: "tw:text-white", children: [jsx("p", { className: "tw:text-lg tw:font-medium tw:leading-relaxed tw:[text-shadow:0_2px_12px_rgba(0,0,0,0.85)]", children: testimonial?.quote }), jsxs("footer", { className: "tw:mt-4 tw:[text-shadow:0_2px_8px_rgba(0,0,0,0.8)]", children: [jsx("p", { className: "tw:text-sm tw:font-semibold tw:text-white", children: testimonial?.authorName }), testimonial?.authorTitle ? (jsx("p", { className: "tw:text-sm tw:text-white/80", children: testimonial.authorTitle })) : null] })] })) })) : null] }));
+}
+function FooterLinks({ links }) {
+    if (links.length === 0) {
+        return null;
+    }
+    return (jsx("div", { className: "tw:mt-6 tw:flex tw:flex-wrap tw:items-center tw:justify-center tw:gap-4 tw:text-xs tw:text-muted-foreground", children: links.map((link, index) => (jsxs(React.Fragment, { children: [index > 0 ? jsx("span", { "aria-hidden": "true", children: "·" }) : null, jsx("a", { href: link.href, ...getLinkAttributes(link.external), className: "hover:tw:text-foreground hover:tw:underline", children: link.label })] }, `${link.label}-${index}`))) }));
+}
+
+export { BrandHeader, FooterLinks, ForgotPasswordSentView, ForgotPasswordView, SignInView, SplitMediaPane, SsoEmailView };

package/dist/components/search-bar.d.ts

@@ -0,0 +1,15 @@
+export interface SearchBarProps {
+    value: string;
+    onChange: (value: string) => void;
+    onSearch: (value: string) => void;
+    onClear: () => void;
+    placeholder?: string;
+    disabled?: boolean;
+    loading?: boolean;
+    applyLabel?: string;
+    clearLabel?: string;
+    className?: string;
+    inputAriaLabel?: string;
+}
+export declare function SearchBar({ value, onChange, onSearch, onClear, placeholder, disabled, loading, applyLabel, clearLabel, className, inputAriaLabel, }: SearchBarProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=search-bar.d.ts.map

package/dist/components/search-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-bar.d.ts","sourceRoot":"","sources":["../../src/components/search-bar.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,WAAyB,EACzB,QAAgB,EAChB,OAAe,EACf,UAAoB,EACpB,UAAoB,EACpB,SAAS,EACT,cAA+B,GAChC,EAAE,cAAc,2CAsEhB"}

package/dist/components/search-bar.js

@@ -0,0 +1,25 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { SearchIcon, XIcon } from 'lucide-react';
+import { cn } from '../lib/utils.js';
+import { Input } from './input.js';
+import { Button } from './button.js';
+
+function SearchBar({ value, onChange, onSearch, onClear, placeholder = "Search...", disabled = false, loading = false, applyLabel = "Apply", clearLabel = "Clear", className, inputAriaLabel = "Search input", }) {
+    const handleKeyDown = (e) => {
+        if (e.key === "Enter") {
+            e.preventDefault();
+            onSearch(value);
+        }
+        else if (e.key === "Escape") {
+            e.preventDefault();
+            onClear();
+        }
+    };
+    const handleClearClick = () => {
+        onChange("");
+        onClear();
+    };
+    return (jsxs("div", { "data-slot": "search-bar", className: cn("tw:!flex tw:!w-full tw:!gap-2", className), children: [jsxs("div", { className: "tw:!relative tw:!flex-1", children: [jsx(SearchIcon, { className: "tw:!absolute tw:!left-3 tw:!top-1/2 tw:!-translate-y-1/2 tw:!h-4 tw:!w-4 tw:text-muted-foreground tw:!pointer-events-none", "aria-hidden": "true" }), jsx(Input, { type: "text", value: value, onChange: (e) => onChange(e.target.value), onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled, className: "tw:!pl-9", "aria-label": inputAriaLabel }), value && !disabled && (jsx("button", { type: "button", onClick: handleClearClick, className: "tw:!absolute tw:!right-3 tw:!top-1/2 tw:!-translate-y-1/2 tw:!h-4 tw:!w-4 tw:text-muted-foreground hover:tw:text-foreground tw:transition-colors tw:!cursor-pointer", "aria-label": "Clear search", children: jsx(XIcon, { className: "tw:!h-4 tw:!w-4" }) }))] }), jsx(Button, { variant: "default", size: "sm", onClick: () => onSearch(value), disabled: disabled || !value, loading: loading, className: "tw:!min-w-[80px]", "aria-label": "Apply search", children: applyLabel }), jsx(Button, { variant: "outline", size: "sm", onClick: handleClearClick, disabled: disabled || !value, className: "tw:!min-w-[80px]", "aria-label": "Clear search", children: clearLabel })] }));
+}
+
+export { SearchBar };