@puzzle-ui/fullstack 0.0.0-stage → 0.5.1

package/dist/auth/client/experience.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"experience.cjs","names":["useId","FormField","TextAreaInput","Select","Checkbox","TextInput","useAuth","useState","Heading","Text","SignInForm","Alert","Button"],"sources":["../../../src/auth/client/experience.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  useEffect,\n  useId,\n  useState,\n  type CSSProperties,\n  type FormEvent,\n  type ReactNode,\n} from \"react\";\n\nimport {\n  Alert,\n  Button,\n  Checkbox,\n  FormField,\n  Heading,\n  Select,\n  Text,\n  TextAreaInput,\n  TextInput,\n} from \"@puzzle-ui/ui\";\n\nimport type { AuthClient, AuthClientSnapshot } from \"./index\";\nimport { SignInForm, useAuth } from \"./react\";\n\nexport type AuthFieldValue = string | boolean;\n\nexport type AuthFieldValues = Readonly<Record<string, AuthFieldValue>>;\n\nexport type AuthFieldOption = {\n  readonly label: string;\n  readonly value: string;\n};\n\nexport type AuthCustomField = {\n  readonly name: string;\n  readonly label: string;\n  readonly type:\n    | \"text\"\n    | \"email\"\n    | \"tel\"\n    | \"url\"\n    | \"number\"\n    | \"checkbox\"\n    | \"select\"\n    | \"textarea\";\n  readonly description?: string;\n  readonly placeholder?: string;\n  readonly autoComplete?: string;\n  readonly required?: boolean;\n  readonly disabled?: boolean;\n  readonly defaultValue?: AuthFieldValue;\n  readonly options?: readonly AuthFieldOption[];\n  readonly validate?: (\n    value: AuthFieldValue,\n    values: AuthFieldValues,\n  ) => string | null | undefined | Promise<string | null | undefined>;\n};\n\nexport type AuthRegistrationInput = {\n  readonly name: string | null;\n  readonly email: string;\n  readonly password: string;\n};\n\nexport type AuthExperienceSubmitInput = {\n  readonly registration: AuthRegistrationInput;\n  readonly fields: AuthFieldValues;\n  readonly signUp: AuthClient[\"register\"];\n};\n\nexport type AuthExperienceBranding = {\n  readonly logo?: ReactNode;\n  readonly title?: ReactNode;\n  readonly description?: ReactNode;\n};\n\nexport type AuthExperienceLayout = {\n  readonly className?: string;\n  readonly contentClassName?: string;\n  readonly header?: ReactNode;\n  readonly footer?: ReactNode;\n  readonly width?: \"sm\" | \"md\" | \"lg\" | \"full\";\n  readonly align?: \"left\" | \"center\";\n};\n\nexport type AuthExperienceRedirects = {\n  readonly afterSignIn?: string;\n  readonly afterSignUp?: string;\n};\n\nexport type AuthExperienceConfig = {\n  readonly branding?: AuthExperienceBranding;\n  readonly layout?: AuthExperienceLayout;\n  readonly redirects?: AuthExperienceRedirects;\n  readonly fields?: readonly AuthCustomField[];\n};\n\nexport type AuthExperienceProps = {\n  readonly mode?: \"sign-in\" | \"sign-up\";\n  readonly config?: AuthExperienceConfig;\n  readonly className?: string;\n  readonly onSubmit?: (\n    input: AuthExperienceSubmitInput,\n  ) => Promise<AuthClientSnapshot>;\n  readonly onSuccess?: () => void;\n  readonly onSignIn?: () => void;\n  readonly onSignUp?: () => void;\n  readonly onForgotPassword?: () => void;\n};\n\ntype FieldErrors = Readonly<Record<string, string>>;\n\nconst EMPTY_FIELDS: readonly AuthCustomField[] = [];\n\nconst EMAIL_PATTERN = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\n\nconst isValidEmail = (value: string): boolean => {\n  const email = value.trim();\n\n  return email.length <= 254 && EMAIL_PATTERN.test(email);\n};\n\nconst getEmailError = (\n  value: string,\n  messages: ReturnType<typeof useAuth>[\"messages\"],\n): string | null => {\n  const email = value.trim();\n\n  if (!email) {\n    return messages.emailRequired;\n  }\n\n  if (!isValidEmail(email)) {\n    return \"Enter a valid email address.\";\n  }\n\n  return null;\n};\n\nconst isSafeRedirect = (value: string | undefined): value is string =>\n  Boolean(\n    value &&\n    value.startsWith(\"/\") &&\n    !value.startsWith(\"//\") &&\n    !value.includes(\"\\\\\") &&\n    !/[\\u0000-\\u001f\\u007f]/.test(value),\n  );\n\nconst redirectAfterSuccess = (value: string | undefined) => {\n  if (!isSafeRedirect(value) || typeof window === \"undefined\") {\n    return;\n  }\n\n  window.location.assign(value);\n};\n\nconst getInitialValues = (\n  fields: readonly AuthCustomField[],\n): Record<string, AuthFieldValue> =>\n  Object.fromEntries(\n    fields.map((field) => [\n      field.name,\n      field.defaultValue ?? (field.type === \"checkbox\" ? false : \"\"),\n    ]),\n  );\n\nconst validateFieldDefinition = (fields: readonly AuthCustomField[]): void => {\n  const names = new Set<string>();\n\n  for (const field of fields) {\n    if (!/^[a-zA-Z][a-zA-Z0-9_-]*$/.test(field.name)) {\n      throw new Error(`Invalid custom auth field name: \"${field.name}\".`);\n    }\n\n    if ([\"name\", \"email\", \"password\", \"confirmPassword\"].includes(field.name)) {\n      throw new Error(`Custom auth field name \"${field.name}\" is reserved.`);\n    }\n\n    if (names.has(field.name)) {\n      throw new Error(`Duplicate custom auth field name: \"${field.name}\".`);\n    }\n\n    if (\n      field.type === \"select\" &&\n      (!field.options || field.options.length === 0)\n    ) {\n      throw new Error(\n        `Select field \"${field.name}\" requires at least one option.`,\n      );\n    }\n\n    names.add(field.name);\n  }\n};\n\nconst validateFields = async (\n  fields: readonly AuthCustomField[],\n  values: AuthFieldValues,\n): Promise<FieldErrors> => {\n  const errors: Record<string, string> = {};\n\n  for (const field of fields) {\n    const value = values[field.name];\n\n    if (\n      field.required &&\n      (value === undefined ||\n        value === \"\" ||\n        (typeof value === \"boolean\" && !value))\n    ) {\n      errors[field.name] = `${field.label} is required.`;\n      continue;\n    }\n\n    if (!field.validate) continue;\n\n    const message = await field.validate(value ?? \"\", values);\n\n    if (message) {\n      errors[field.name] = message;\n    }\n  }\n\n  return errors;\n};\n\nconst AuthCustomFields = ({\n  fields,\n  values,\n  errors,\n  disabled,\n  onChange,\n}: {\n  readonly fields: readonly AuthCustomField[];\n  readonly values: AuthFieldValues;\n  readonly errors: FieldErrors;\n  readonly disabled: boolean;\n  readonly onChange: (name: string, value: AuthFieldValue) => void;\n}) => {\n  const generatedId = useId();\n\n  return (\n    <>\n      {fields.map((field) => {\n        const id = `${generatedId}-${field.name}`;\n        const value = values[field.name] ?? \"\";\n        const error = errors[field.name];\n\n        const commonProps = {\n          name: field.name,\n          disabled: disabled || field.disabled,\n          required: field.required,\n        };\n\n        return (\n          <FormField\n            key={field.name}\n            controlId={id}\n            label={field.label}\n            description={field.description}\n            error={error}\n            required={field.required}\n            disabled={commonProps.disabled}\n            className={\n              field.type === \"url\" || field.type === \"number\"\n                ? \"puzzle-auth__custom-field\"\n                : undefined\n            }\n          >\n            {field.type === \"textarea\" ? (\n              <TextAreaInput\n                {...commonProps}\n                value={String(value)}\n                placeholder={field.placeholder}\n                resizable\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.value)\n                }\n              />\n            ) : field.type === \"select\" ? (\n              <Select\n                {...commonProps}\n                fullWidth\n                value={String(value)}\n                placeholder={field.placeholder ?? \"Select an option\"}\n                options={field.options ?? []}\n                onChange={(value) => onChange(field.name, value ?? \"\")}\n              />\n            ) : field.type === \"checkbox\" ? (\n              <Checkbox\n                {...commonProps}\n                checked={Boolean(value)}\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.checked)\n                }\n              />\n            ) : field.type === \"url\" || field.type === \"number\" ? (\n              <input\n                {...commonProps}\n                type={field.type}\n                value={String(value)}\n                placeholder={field.placeholder}\n                autoComplete={field.autoComplete}\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.value)\n                }\n              />\n            ) : (\n              <TextInput\n                {...commonProps}\n                type={field.type === \"tel\" ? \"phone\" : field.type}\n                value={String(value)}\n                placeholder={field.placeholder}\n                autoComplete={field.autoComplete}\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.value)\n                }\n              />\n            )}\n          </FormField>\n        );\n      })}\n    </>\n  );\n};\n\nconst AuthExperience = ({\n  mode = \"sign-in\",\n  config = {},\n  className,\n  onSubmit,\n  onSuccess,\n  onSignIn,\n  onSignUp,\n  onForgotPassword,\n}: AuthExperienceProps) => {\n  const { signUp, messages } = useAuth();\n\n  const fields = config.fields ?? EMPTY_FIELDS;\n  const branding = config.branding;\n  const layout = config.layout;\n  const redirects = config.redirects;\n\n  validateFieldDefinition(fields);\n\n  const [values, setValues] = useState<Record<string, AuthFieldValue>>(() =>\n    getInitialValues(fields),\n  );\n  const [errors, setErrors] = useState<FieldErrors>({});\n  const [formError, setFormError] = useState<string | null>(null);\n  const [emailError, setEmailError] = useState<string | null>(null);\n  const [loading, setLoading] = useState(false);\n\n  const [name, setName] = useState(\"\");\n  const [email, setEmail] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n  const [confirmation, setConfirmation] = useState(\"\");\n\n  useEffect(() => {\n    setValues((current) => {\n      const next: Record<string, AuthFieldValue> = {};\n\n      for (const field of fields) {\n        const currentValue = Object.prototype.hasOwnProperty.call(\n          current,\n          field.name,\n        )\n          ? current[field.name]\n          : undefined;\n\n        next[field.name] =\n          currentValue ??\n          field.defaultValue ??\n          (field.type === \"checkbox\" ? false : \"\");\n      }\n\n      const currentNames = Object.keys(current);\n      const nextNames = Object.keys(next);\n\n      const unchanged =\n        currentNames.length === nextNames.length &&\n        nextNames.every((fieldName) => current[fieldName] === next[fieldName]);\n\n      return unchanged ? current : next;\n    });\n\n    setErrors((current) => {\n      const activeNames = new Set(fields.map((field) => field.name));\n\n      const next = Object.fromEntries(\n        Object.entries(current).filter(([fieldName]) =>\n          activeNames.has(fieldName),\n        ),\n      );\n\n      return Object.keys(next).length === Object.keys(current).length\n        ? current\n        : next;\n    });\n  }, [fields]);\n\n  const updateField = (fieldName: string, value: AuthFieldValue) => {\n    setValues((current) => ({\n      ...current,\n      [fieldName]: value,\n    }));\n\n    setErrors((current) => {\n      if (!(fieldName in current)) return current;\n\n      const next = { ...current };\n      delete next[fieldName];\n      return next;\n    });\n  };\n\n  const handleEmailChange = (value: string) => {\n    setEmail(value);\n\n    if (emailError) {\n      setEmailError(getEmailError(value, messages));\n    }\n  };\n\n  const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n    setFormError(null);\n    setErrors({});\n\n    const nextEmailError = getEmailError(email, messages);\n\n    setEmailError(nextEmailError);\n\n    if (nextEmailError) {\n      return;\n    }\n\n    if (password !== confirmation) {\n      setFormError(messages.passwordMismatch);\n      return;\n    }\n\n    if (!password) {\n      setFormError(messages.passwordRequired);\n      return;\n    }\n\n    setLoading(true);\n\n    try {\n      const nextErrors = await validateFields(fields, values);\n\n      if (Object.keys(nextErrors).length > 0) {\n        setErrors(nextErrors);\n        return;\n      }\n\n      const registration: AuthRegistrationInput = {\n        name: name.trim() || null,\n        email: email.trim(),\n        password,\n      };\n\n      const result = onSubmit\n        ? await onSubmit({\n            registration,\n            fields: { ...values },\n            signUp,\n          })\n        : await signUp(registration);\n\n      if (result.status === \"authenticated\") {\n        onSuccess?.();\n        redirectAfterSuccess(redirects?.afterSignUp);\n      }\n    } catch (cause) {\n      setFormError(\n        cause instanceof Error ? cause.message : messages.unexpectedError,\n      );\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  const wrapperClassName = [\n    \"puzzle-auth\",\n    \"puzzle-auth-experience\",\n    layout?.className,\n    className,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  const contentClassName = [\n    \"puzzle-auth-experience__content\",\n    layout?.contentClassName,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  const style = {\n    \"--puzzle-auth-experience-width\":\n      layout?.width === \"sm\"\n        ? \"24rem\"\n        : layout?.width === \"lg\"\n          ? \"48rem\"\n          : layout?.width === \"full\"\n            ? \"100%\"\n            : \"32rem\",\n    \"--puzzle-auth-experience-align\":\n      layout?.align === \"left\" ? \"flex-start\" : \"center\",\n  } as CSSProperties;\n\n  return (\n    <section className={wrapperClassName} style={style}>\n      {layout?.header}\n\n      <div className=\"puzzle-auth-experience__branding\">\n        {branding?.logo}\n        {branding?.title ? (\n          <Heading as=\"h1\" level=\"headline2\">\n            {branding.title}\n          </Heading>\n        ) : null}\n        {branding?.description ? <Text as=\"p\">{branding.description}</Text> : null}\n      </div>\n\n      <div className={contentClassName}>\n        {mode === \"sign-in\" ? (\n          <SignInForm\n            redirectTo={redirects?.afterSignIn}\n            onSuccess={onSuccess}\n            onForgotPassword={onForgotPassword}\n            onSignUp={onSignUp}\n          />\n        ) : (\n          <>\n            {formError ? (\n              <div role=\"alert\" aria-live=\"assertive\">\n                <Alert severity=\"error\">{formError}</Alert>\n              </div>\n            ) : null}\n\n            <form\n              className=\"puzzle-auth__form\"\n              onSubmit={(event) => void handleSubmit(event)}\n              noValidate\n            >\n              <FormField\n                label={messages.name}\n                controlId=\"puzzle-auth-experience-name\"\n              >\n                <TextInput\n                  name=\"name\"\n                  type=\"text\"\n                  autoComplete=\"name\"\n                  value={name}\n                  disabled={loading}\n                  onChange={(event) => setName(event.currentTarget.value)}\n                />\n              </FormField>\n\n              <FormField\n                label={messages.email}\n                controlId=\"puzzle-auth-experience-email\"\n                required\n                error={emailError}\n              >\n                <TextInput\n                  name=\"email\"\n                  type=\"email\"\n                  autoComplete=\"email\"\n                  required\n                  value={email}\n                  disabled={loading}\n                  onChange={(event) =>\n                    handleEmailChange(event.currentTarget.value)\n                  }\n                />\n\n              </FormField>\n\n              <FormField\n                label={messages.password}\n                controlId=\"puzzle-auth-experience-password\"\n                required\n              >\n                <TextInput\n                  name=\"new-password\"\n                  type=\"password\"\n                  suffix={null}\n                  autoComplete=\"new-password\"\n                  required\n                  value={password}\n                  disabled={loading}\n                  onChange={(event) => setPassword(event.currentTarget.value)}\n                />\n              </FormField>\n\n              <FormField\n                label={messages.confirmPassword}\n                controlId=\"puzzle-auth-experience-confirm\"\n                required\n              >\n                <TextInput\n                  name=\"confirm-password\"\n                  type=\"password\"\n                  suffix={null}\n                  autoComplete=\"new-password\"\n                  required\n                  value={confirmation}\n                  disabled={loading}\n                  onChange={(event) =>\n                    setConfirmation(event.currentTarget.value)\n                  }\n                />\n              </FormField>\n\n              <AuthCustomFields\n                fields={fields}\n                values={values}\n                errors={errors}\n                disabled={loading}\n                onChange={updateField}\n              />\n\n              <Button\n                type=\"submit\"\n                fullWidth\n                loading={loading}\n                disabled={\n                  loading || !email.trim() || !password || !confirmation\n                }\n              >\n                {loading ? messages.signingUp : messages.createAccount}\n              </Button>\n            </form>\n\n            {onSignIn ? (\n              <footer className=\"puzzle-auth__footer\">\n                <Text>{messages.existingAccount}</Text>\n                <Button\n                  type=\"button\"\n                  variant=\"link\"\n                  onClick={onSignIn}\n                >\n                  {messages.signIn}\n                </Button>\n              </footer>\n            ) : null}\n          </>\n        )}\n      </div>\n\n      {layout?.footer}\n    </section>\n  );\n};\n\nexport { AuthExperience };\n"],"mappings":"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"}

package/dist/auth/client/experience.d.cts

@@ -0,0 +1,67 @@
+import { AuthClientSnapshot } from "../shared/index.cjs";
+import { AuthClient } from "./index.cjs";
+import { ReactNode } from "react";
+export type AuthFieldValue = string | boolean;
+export type AuthFieldValues = Readonly<Record<string, AuthFieldValue>>;
+export type AuthFieldOption = {
+  readonly label: string;
+  readonly value: string;
+};
+export type AuthCustomField = {
+  readonly name: string;
+  readonly label: string;
+  readonly type: "text" | "email" | "tel" | "url" | "number" | "checkbox" | "select" | "textarea";
+  readonly description?: string;
+  readonly placeholder?: string;
+  readonly autoComplete?: string;
+  readonly required?: boolean;
+  readonly disabled?: boolean;
+  readonly defaultValue?: AuthFieldValue;
+  readonly options?: readonly AuthFieldOption[];
+  readonly validate?: (value: AuthFieldValue, values: AuthFieldValues) => string | null | undefined | Promise<string | null | undefined>;
+};
+export type AuthRegistrationInput = {
+  readonly name: string | null;
+  readonly email: string;
+  readonly password: string;
+};
+export type AuthExperienceSubmitInput = {
+  readonly registration: AuthRegistrationInput;
+  readonly fields: AuthFieldValues;
+  readonly signUp: AuthClient["register"];
+};
+export type AuthExperienceBranding = {
+  readonly logo?: ReactNode;
+  readonly title?: ReactNode;
+  readonly description?: ReactNode;
+};
+export type AuthExperienceLayout = {
+  readonly className?: string;
+  readonly contentClassName?: string;
+  readonly header?: ReactNode;
+  readonly footer?: ReactNode;
+  readonly width?: "sm" | "md" | "lg" | "full";
+  readonly align?: "left" | "center";
+};
+export type AuthExperienceRedirects = {
+  readonly afterSignIn?: string;
+  readonly afterSignUp?: string;
+};
+export type AuthExperienceConfig = {
+  readonly branding?: AuthExperienceBranding;
+  readonly layout?: AuthExperienceLayout;
+  readonly redirects?: AuthExperienceRedirects;
+  readonly fields?: readonly AuthCustomField[];
+};
+export type AuthExperienceProps = {
+  readonly mode?: "sign-in" | "sign-up";
+  readonly config?: AuthExperienceConfig;
+  readonly className?: string;
+  readonly onSubmit?: (input: AuthExperienceSubmitInput) => Promise<AuthClientSnapshot>;
+  readonly onSuccess?: () => void;
+  readonly onSignIn?: () => void;
+  readonly onSignUp?: () => void;
+  readonly onForgotPassword?: () => void;
+};
+declare const AuthExperience: ({ mode, config, className, onSubmit, onSuccess, onSignIn, onSignUp, onForgotPassword }: AuthExperienceProps) => import("react").JSX.Element;
+export { AuthExperience };

package/dist/auth/client/experience.d.ts

@@ -0,0 +1,67 @@
+import { AuthClientSnapshot } from "../shared/index.js";
+import { AuthClient } from "./index.js";
+import { ReactNode } from "react";
+export type AuthFieldValue = string | boolean;
+export type AuthFieldValues = Readonly<Record<string, AuthFieldValue>>;
+export type AuthFieldOption = {
+  readonly label: string;
+  readonly value: string;
+};
+export type AuthCustomField = {
+  readonly name: string;
+  readonly label: string;
+  readonly type: "text" | "email" | "tel" | "url" | "number" | "checkbox" | "select" | "textarea";
+  readonly description?: string;
+  readonly placeholder?: string;
+  readonly autoComplete?: string;
+  readonly required?: boolean;
+  readonly disabled?: boolean;
+  readonly defaultValue?: AuthFieldValue;
+  readonly options?: readonly AuthFieldOption[];
+  readonly validate?: (value: AuthFieldValue, values: AuthFieldValues) => string | null | undefined | Promise<string | null | undefined>;
+};
+export type AuthRegistrationInput = {
+  readonly name: string | null;
+  readonly email: string;
+  readonly password: string;
+};
+export type AuthExperienceSubmitInput = {
+  readonly registration: AuthRegistrationInput;
+  readonly fields: AuthFieldValues;
+  readonly signUp: AuthClient["register"];
+};
+export type AuthExperienceBranding = {
+  readonly logo?: ReactNode;
+  readonly title?: ReactNode;
+  readonly description?: ReactNode;
+};
+export type AuthExperienceLayout = {
+  readonly className?: string;
+  readonly contentClassName?: string;
+  readonly header?: ReactNode;
+  readonly footer?: ReactNode;
+  readonly width?: "sm" | "md" | "lg" | "full";
+  readonly align?: "left" | "center";
+};
+export type AuthExperienceRedirects = {
+  readonly afterSignIn?: string;
+  readonly afterSignUp?: string;
+};
+export type AuthExperienceConfig = {
+  readonly branding?: AuthExperienceBranding;
+  readonly layout?: AuthExperienceLayout;
+  readonly redirects?: AuthExperienceRedirects;
+  readonly fields?: readonly AuthCustomField[];
+};
+export type AuthExperienceProps = {
+  readonly mode?: "sign-in" | "sign-up";
+  readonly config?: AuthExperienceConfig;
+  readonly className?: string;
+  readonly onSubmit?: (input: AuthExperienceSubmitInput) => Promise<AuthClientSnapshot>;
+  readonly onSuccess?: () => void;
+  readonly onSignIn?: () => void;
+  readonly onSignUp?: () => void;
+  readonly onForgotPassword?: () => void;
+};
+declare const AuthExperience: ({ mode, config, className, onSubmit, onSuccess, onSignIn, onSignUp, onForgotPassword }: AuthExperienceProps) => import("react").JSX.Element;
+export { AuthExperience };

package/dist/auth/client/experience.js

@@ -0,0 +1,340 @@
+"use client";
+import { SignInForm, useAuth } from "./react.js";
+import { useEffect, useId, useState } from "react";
+import { Alert, Button, Checkbox, FormField, Heading, Select, Text, TextAreaInput, TextInput } from "@puzzle-ui/ui";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+// src/auth/client/experience.tsx
+const EMPTY_FIELDS = [];
+const EMAIL_PATTERN = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+const isValidEmail = (value) => {
+	const email = value.trim();
+	return email.length <= 254 && EMAIL_PATTERN.test(email);
+};
+const getEmailError = (value, messages) => {
+	const email = value.trim();
+	if (!email) return messages.emailRequired;
+	if (!isValidEmail(email)) return "Enter a valid email address.";
+	return null;
+};
+const isSafeRedirect = (value) => Boolean(value && value.startsWith("/") && !value.startsWith("//") && !value.includes("\\") && !/[\u0000-\u001f\u007f]/.test(value));
+const redirectAfterSuccess = (value) => {
+	if (!isSafeRedirect(value) || typeof window === "undefined") return;
+	window.location.assign(value);
+};
+const getInitialValues = (fields) => Object.fromEntries(fields.map((field) => [field.name, field.defaultValue ?? (field.type === "checkbox" ? false : "")]));
+const validateFieldDefinition = (fields) => {
+	const names = /* @__PURE__ */ new Set();
+	for (const field of fields) {
+		if (!/^[a-zA-Z][a-zA-Z0-9_-]*$/.test(field.name)) throw new Error(`Invalid custom auth field name: "${field.name}".`);
+		if ([
+			"name",
+			"email",
+			"password",
+			"confirmPassword"
+		].includes(field.name)) throw new Error(`Custom auth field name "${field.name}" is reserved.`);
+		if (names.has(field.name)) throw new Error(`Duplicate custom auth field name: "${field.name}".`);
+		if (field.type === "select" && (!field.options || field.options.length === 0)) throw new Error(`Select field "${field.name}" requires at least one option.`);
+		names.add(field.name);
+	}
+};
+const validateFields = async (fields, values) => {
+	const errors = {};
+	for (const field of fields) {
+		const value = values[field.name];
+		if (field.required && (value === void 0 || value === "" || typeof value === "boolean" && !value)) {
+			errors[field.name] = `${field.label} is required.`;
+			continue;
+		}
+		if (!field.validate) continue;
+		const message = await field.validate(value ?? "", values);
+		if (message) errors[field.name] = message;
+	}
+	return errors;
+};
+const AuthCustomFields = ({ fields, values, errors, disabled, onChange }) => {
+	const generatedId = useId();
+	return /* @__PURE__ */ jsx(Fragment, { children: fields.map((field) => {
+		const id = `${generatedId}-${field.name}`;
+		const value = values[field.name] ?? "";
+		const error = errors[field.name];
+		const commonProps = {
+			name: field.name,
+			disabled: disabled || field.disabled,
+			required: field.required
+		};
+		return /* @__PURE__ */ jsx(FormField, {
+			controlId: id,
+			label: field.label,
+			description: field.description,
+			error,
+			required: field.required,
+			disabled: commonProps.disabled,
+			className: field.type === "url" || field.type === "number" ? "puzzle-auth__custom-field" : void 0,
+			children: field.type === "textarea" ? /* @__PURE__ */ jsx(TextAreaInput, {
+				...commonProps,
+				value: String(value),
+				placeholder: field.placeholder,
+				resizable: true,
+				onChange: (event) => onChange(field.name, event.currentTarget.value)
+			}) : field.type === "select" ? /* @__PURE__ */ jsx(Select, {
+				...commonProps,
+				fullWidth: true,
+				value: String(value),
+				placeholder: field.placeholder ?? "Select an option",
+				options: field.options ?? [],
+				onChange: (value) => onChange(field.name, value ?? "")
+			}) : field.type === "checkbox" ? /* @__PURE__ */ jsx(Checkbox, {
+				...commonProps,
+				checked: Boolean(value),
+				onChange: (event) => onChange(field.name, event.currentTarget.checked)
+			}) : field.type === "url" || field.type === "number" ? /* @__PURE__ */ jsx("input", {
+				...commonProps,
+				type: field.type,
+				value: String(value),
+				placeholder: field.placeholder,
+				autoComplete: field.autoComplete,
+				onChange: (event) => onChange(field.name, event.currentTarget.value)
+			}) : /* @__PURE__ */ jsx(TextInput, {
+				...commonProps,
+				type: field.type === "tel" ? "phone" : field.type,
+				value: String(value),
+				placeholder: field.placeholder,
+				autoComplete: field.autoComplete,
+				onChange: (event) => onChange(field.name, event.currentTarget.value)
+			})
+		}, field.name);
+	}) });
+};
+const AuthExperience = ({ mode = "sign-in", config = {}, className, onSubmit, onSuccess, onSignIn, onSignUp, onForgotPassword }) => {
+	const { signUp, messages } = useAuth();
+	const fields = config.fields ?? EMPTY_FIELDS;
+	const branding = config.branding;
+	const layout = config.layout;
+	const redirects = config.redirects;
+	validateFieldDefinition(fields);
+	const [values, setValues] = useState(() => getInitialValues(fields));
+	const [errors, setErrors] = useState({});
+	const [formError, setFormError] = useState(null);
+	const [emailError, setEmailError] = useState(null);
+	const [loading, setLoading] = useState(false);
+	const [name, setName] = useState("");
+	const [email, setEmail] = useState("");
+	const [password, setPassword] = useState("");
+	const [confirmation, setConfirmation] = useState("");
+	useEffect(() => {
+		setValues((current) => {
+			const next = {};
+			for (const field of fields) {
+				const currentValue = Object.prototype.hasOwnProperty.call(current, field.name) ? current[field.name] : void 0;
+				next[field.name] = currentValue ?? field.defaultValue ?? (field.type === "checkbox" ? false : "");
+			}
+			const currentNames = Object.keys(current);
+			const nextNames = Object.keys(next);
+			return currentNames.length === nextNames.length && nextNames.every((fieldName) => current[fieldName] === next[fieldName]) ? current : next;
+		});
+		setErrors((current) => {
+			const activeNames = new Set(fields.map((field) => field.name));
+			const next = Object.fromEntries(Object.entries(current).filter(([fieldName]) => activeNames.has(fieldName)));
+			return Object.keys(next).length === Object.keys(current).length ? current : next;
+		});
+	}, [fields]);
+	const updateField = (fieldName, value) => {
+		setValues((current) => ({
+			...current,
+			[fieldName]: value
+		}));
+		setErrors((current) => {
+			if (!(fieldName in current)) return current;
+			const next = { ...current };
+			delete next[fieldName];
+			return next;
+		});
+	};
+	const handleEmailChange = (value) => {
+		setEmail(value);
+		if (emailError) setEmailError(getEmailError(value, messages));
+	};
+	const handleSubmit = async (event) => {
+		event.preventDefault();
+		setFormError(null);
+		setErrors({});
+		const nextEmailError = getEmailError(email, messages);
+		setEmailError(nextEmailError);
+		if (nextEmailError) return;
+		if (password !== confirmation) {
+			setFormError(messages.passwordMismatch);
+			return;
+		}
+		if (!password) {
+			setFormError(messages.passwordRequired);
+			return;
+		}
+		setLoading(true);
+		try {
+			const nextErrors = await validateFields(fields, values);
+			if (Object.keys(nextErrors).length > 0) {
+				setErrors(nextErrors);
+				return;
+			}
+			const registration = {
+				name: name.trim() || null,
+				email: email.trim(),
+				password
+			};
+			if ((onSubmit ? await onSubmit({
+				registration,
+				fields: { ...values },
+				signUp
+			}) : await signUp(registration)).status === "authenticated") {
+				onSuccess?.();
+				redirectAfterSuccess(redirects?.afterSignUp);
+			}
+		} catch (cause) {
+			setFormError(cause instanceof Error ? cause.message : messages.unexpectedError);
+		} finally {
+			setLoading(false);
+		}
+	};
+	const wrapperClassName = [
+		"puzzle-auth",
+		"puzzle-auth-experience",
+		layout?.className,
+		className
+	].filter(Boolean).join(" ");
+	const contentClassName = ["puzzle-auth-experience__content", layout?.contentClassName].filter(Boolean).join(" ");
+	const style = {
+		"--puzzle-auth-experience-width": layout?.width === "sm" ? "24rem" : layout?.width === "lg" ? "48rem" : layout?.width === "full" ? "100%" : "32rem",
+		"--puzzle-auth-experience-align": layout?.align === "left" ? "flex-start" : "center"
+	};
+	return /* @__PURE__ */ jsxs("section", {
+		className: wrapperClassName,
+		style,
+		children: [
+			layout?.header,
+			/* @__PURE__ */ jsxs("div", {
+				className: "puzzle-auth-experience__branding",
+				children: [
+					branding?.logo,
+					branding?.title ? /* @__PURE__ */ jsx(Heading, {
+						as: "h1",
+						level: "headline2",
+						children: branding.title
+					}) : null,
+					branding?.description ? /* @__PURE__ */ jsx(Text, {
+						as: "p",
+						children: branding.description
+					}) : null
+				]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: contentClassName,
+				children: mode === "sign-in" ? /* @__PURE__ */ jsx(SignInForm, {
+					redirectTo: redirects?.afterSignIn,
+					onSuccess,
+					onForgotPassword,
+					onSignUp
+				}) : /* @__PURE__ */ jsxs(Fragment, { children: [
+					formError ? /* @__PURE__ */ jsx("div", {
+						role: "alert",
+						"aria-live": "assertive",
+						children: /* @__PURE__ */ jsx(Alert, {
+							severity: "error",
+							children: formError
+						})
+					}) : null,
+					/* @__PURE__ */ jsxs("form", {
+						className: "puzzle-auth__form",
+						onSubmit: (event) => void handleSubmit(event),
+						noValidate: true,
+						children: [
+							/* @__PURE__ */ jsx(FormField, {
+								label: messages.name,
+								controlId: "puzzle-auth-experience-name",
+								children: /* @__PURE__ */ jsx(TextInput, {
+									name: "name",
+									type: "text",
+									autoComplete: "name",
+									value: name,
+									disabled: loading,
+									onChange: (event) => setName(event.currentTarget.value)
+								})
+							}),
+							/* @__PURE__ */ jsx(FormField, {
+								label: messages.email,
+								controlId: "puzzle-auth-experience-email",
+								required: true,
+								error: emailError,
+								children: /* @__PURE__ */ jsx(TextInput, {
+									name: "email",
+									type: "email",
+									autoComplete: "email",
+									required: true,
+									value: email,
+									disabled: loading,
+									onChange: (event) => handleEmailChange(event.currentTarget.value)
+								})
+							}),
+							/* @__PURE__ */ jsx(FormField, {
+								label: messages.password,
+								controlId: "puzzle-auth-experience-password",
+								required: true,
+								children: /* @__PURE__ */ jsx(TextInput, {
+									name: "new-password",
+									type: "password",
+									suffix: null,
+									autoComplete: "new-password",
+									required: true,
+									value: password,
+									disabled: loading,
+									onChange: (event) => setPassword(event.currentTarget.value)
+								})
+							}),
+							/* @__PURE__ */ jsx(FormField, {
+								label: messages.confirmPassword,
+								controlId: "puzzle-auth-experience-confirm",
+								required: true,
+								children: /* @__PURE__ */ jsx(TextInput, {
+									name: "confirm-password",
+									type: "password",
+									suffix: null,
+									autoComplete: "new-password",
+									required: true,
+									value: confirmation,
+									disabled: loading,
+									onChange: (event) => setConfirmation(event.currentTarget.value)
+								})
+							}),
+							/* @__PURE__ */ jsx(AuthCustomFields, {
+								fields,
+								values,
+								errors,
+								disabled: loading,
+								onChange: updateField
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								type: "submit",
+								fullWidth: true,
+								loading,
+								disabled: loading || !email.trim() || !password || !confirmation,
+								children: loading ? messages.signingUp : messages.createAccount
+							})
+						]
+					}),
+					onSignIn ? /* @__PURE__ */ jsxs("footer", {
+						className: "puzzle-auth__footer",
+						children: [/* @__PURE__ */ jsx(Text, { children: messages.existingAccount }), /* @__PURE__ */ jsx(Button, {
+							type: "button",
+							variant: "link",
+							onClick: onSignIn,
+							children: messages.signIn
+						})]
+					}) : null
+				] })
+			}),
+			layout?.footer
+		]
+	});
+};
+export { AuthExperience };
+
+//# sourceMappingURL=experience.js.map

package/dist/auth/client/experience.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"experience.js","names":[],"sources":["../../../src/auth/client/experience.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  useEffect,\n  useId,\n  useState,\n  type CSSProperties,\n  type FormEvent,\n  type ReactNode,\n} from \"react\";\n\nimport {\n  Alert,\n  Button,\n  Checkbox,\n  FormField,\n  Heading,\n  Select,\n  Text,\n  TextAreaInput,\n  TextInput,\n} from \"@puzzle-ui/ui\";\n\nimport type { AuthClient, AuthClientSnapshot } from \"./index\";\nimport { SignInForm, useAuth } from \"./react\";\n\nexport type AuthFieldValue = string | boolean;\n\nexport type AuthFieldValues = Readonly<Record<string, AuthFieldValue>>;\n\nexport type AuthFieldOption = {\n  readonly label: string;\n  readonly value: string;\n};\n\nexport type AuthCustomField = {\n  readonly name: string;\n  readonly label: string;\n  readonly type:\n    | \"text\"\n    | \"email\"\n    | \"tel\"\n    | \"url\"\n    | \"number\"\n    | \"checkbox\"\n    | \"select\"\n    | \"textarea\";\n  readonly description?: string;\n  readonly placeholder?: string;\n  readonly autoComplete?: string;\n  readonly required?: boolean;\n  readonly disabled?: boolean;\n  readonly defaultValue?: AuthFieldValue;\n  readonly options?: readonly AuthFieldOption[];\n  readonly validate?: (\n    value: AuthFieldValue,\n    values: AuthFieldValues,\n  ) => string | null | undefined | Promise<string | null | undefined>;\n};\n\nexport type AuthRegistrationInput = {\n  readonly name: string | null;\n  readonly email: string;\n  readonly password: string;\n};\n\nexport type AuthExperienceSubmitInput = {\n  readonly registration: AuthRegistrationInput;\n  readonly fields: AuthFieldValues;\n  readonly signUp: AuthClient[\"register\"];\n};\n\nexport type AuthExperienceBranding = {\n  readonly logo?: ReactNode;\n  readonly title?: ReactNode;\n  readonly description?: ReactNode;\n};\n\nexport type AuthExperienceLayout = {\n  readonly className?: string;\n  readonly contentClassName?: string;\n  readonly header?: ReactNode;\n  readonly footer?: ReactNode;\n  readonly width?: \"sm\" | \"md\" | \"lg\" | \"full\";\n  readonly align?: \"left\" | \"center\";\n};\n\nexport type AuthExperienceRedirects = {\n  readonly afterSignIn?: string;\n  readonly afterSignUp?: string;\n};\n\nexport type AuthExperienceConfig = {\n  readonly branding?: AuthExperienceBranding;\n  readonly layout?: AuthExperienceLayout;\n  readonly redirects?: AuthExperienceRedirects;\n  readonly fields?: readonly AuthCustomField[];\n};\n\nexport type AuthExperienceProps = {\n  readonly mode?: \"sign-in\" | \"sign-up\";\n  readonly config?: AuthExperienceConfig;\n  readonly className?: string;\n  readonly onSubmit?: (\n    input: AuthExperienceSubmitInput,\n  ) => Promise<AuthClientSnapshot>;\n  readonly onSuccess?: () => void;\n  readonly onSignIn?: () => void;\n  readonly onSignUp?: () => void;\n  readonly onForgotPassword?: () => void;\n};\n\ntype FieldErrors = Readonly<Record<string, string>>;\n\nconst EMPTY_FIELDS: readonly AuthCustomField[] = [];\n\nconst EMAIL_PATTERN = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\n\nconst isValidEmail = (value: string): boolean => {\n  const email = value.trim();\n\n  return email.length <= 254 && EMAIL_PATTERN.test(email);\n};\n\nconst getEmailError = (\n  value: string,\n  messages: ReturnType<typeof useAuth>[\"messages\"],\n): string | null => {\n  const email = value.trim();\n\n  if (!email) {\n    return messages.emailRequired;\n  }\n\n  if (!isValidEmail(email)) {\n    return \"Enter a valid email address.\";\n  }\n\n  return null;\n};\n\nconst isSafeRedirect = (value: string | undefined): value is string =>\n  Boolean(\n    value &&\n    value.startsWith(\"/\") &&\n    !value.startsWith(\"//\") &&\n    !value.includes(\"\\\\\") &&\n    !/[\\u0000-\\u001f\\u007f]/.test(value),\n  );\n\nconst redirectAfterSuccess = (value: string | undefined) => {\n  if (!isSafeRedirect(value) || typeof window === \"undefined\") {\n    return;\n  }\n\n  window.location.assign(value);\n};\n\nconst getInitialValues = (\n  fields: readonly AuthCustomField[],\n): Record<string, AuthFieldValue> =>\n  Object.fromEntries(\n    fields.map((field) => [\n      field.name,\n      field.defaultValue ?? (field.type === \"checkbox\" ? false : \"\"),\n    ]),\n  );\n\nconst validateFieldDefinition = (fields: readonly AuthCustomField[]): void => {\n  const names = new Set<string>();\n\n  for (const field of fields) {\n    if (!/^[a-zA-Z][a-zA-Z0-9_-]*$/.test(field.name)) {\n      throw new Error(`Invalid custom auth field name: \"${field.name}\".`);\n    }\n\n    if ([\"name\", \"email\", \"password\", \"confirmPassword\"].includes(field.name)) {\n      throw new Error(`Custom auth field name \"${field.name}\" is reserved.`);\n    }\n\n    if (names.has(field.name)) {\n      throw new Error(`Duplicate custom auth field name: \"${field.name}\".`);\n    }\n\n    if (\n      field.type === \"select\" &&\n      (!field.options || field.options.length === 0)\n    ) {\n      throw new Error(\n        `Select field \"${field.name}\" requires at least one option.`,\n      );\n    }\n\n    names.add(field.name);\n  }\n};\n\nconst validateFields = async (\n  fields: readonly AuthCustomField[],\n  values: AuthFieldValues,\n): Promise<FieldErrors> => {\n  const errors: Record<string, string> = {};\n\n  for (const field of fields) {\n    const value = values[field.name];\n\n    if (\n      field.required &&\n      (value === undefined ||\n        value === \"\" ||\n        (typeof value === \"boolean\" && !value))\n    ) {\n      errors[field.name] = `${field.label} is required.`;\n      continue;\n    }\n\n    if (!field.validate) continue;\n\n    const message = await field.validate(value ?? \"\", values);\n\n    if (message) {\n      errors[field.name] = message;\n    }\n  }\n\n  return errors;\n};\n\nconst AuthCustomFields = ({\n  fields,\n  values,\n  errors,\n  disabled,\n  onChange,\n}: {\n  readonly fields: readonly AuthCustomField[];\n  readonly values: AuthFieldValues;\n  readonly errors: FieldErrors;\n  readonly disabled: boolean;\n  readonly onChange: (name: string, value: AuthFieldValue) => void;\n}) => {\n  const generatedId = useId();\n\n  return (\n    <>\n      {fields.map((field) => {\n        const id = `${generatedId}-${field.name}`;\n        const value = values[field.name] ?? \"\";\n        const error = errors[field.name];\n\n        const commonProps = {\n          name: field.name,\n          disabled: disabled || field.disabled,\n          required: field.required,\n        };\n\n        return (\n          <FormField\n            key={field.name}\n            controlId={id}\n            label={field.label}\n            description={field.description}\n            error={error}\n            required={field.required}\n            disabled={commonProps.disabled}\n            className={\n              field.type === \"url\" || field.type === \"number\"\n                ? \"puzzle-auth__custom-field\"\n                : undefined\n            }\n          >\n            {field.type === \"textarea\" ? (\n              <TextAreaInput\n                {...commonProps}\n                value={String(value)}\n                placeholder={field.placeholder}\n                resizable\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.value)\n                }\n              />\n            ) : field.type === \"select\" ? (\n              <Select\n                {...commonProps}\n                fullWidth\n                value={String(value)}\n                placeholder={field.placeholder ?? \"Select an option\"}\n                options={field.options ?? []}\n                onChange={(value) => onChange(field.name, value ?? \"\")}\n              />\n            ) : field.type === \"checkbox\" ? (\n              <Checkbox\n                {...commonProps}\n                checked={Boolean(value)}\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.checked)\n                }\n              />\n            ) : field.type === \"url\" || field.type === \"number\" ? (\n              <input\n                {...commonProps}\n                type={field.type}\n                value={String(value)}\n                placeholder={field.placeholder}\n                autoComplete={field.autoComplete}\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.value)\n                }\n              />\n            ) : (\n              <TextInput\n                {...commonProps}\n                type={field.type === \"tel\" ? \"phone\" : field.type}\n                value={String(value)}\n                placeholder={field.placeholder}\n                autoComplete={field.autoComplete}\n                onChange={(event) =>\n                  onChange(field.name, event.currentTarget.value)\n                }\n              />\n            )}\n          </FormField>\n        );\n      })}\n    </>\n  );\n};\n\nconst AuthExperience = ({\n  mode = \"sign-in\",\n  config = {},\n  className,\n  onSubmit,\n  onSuccess,\n  onSignIn,\n  onSignUp,\n  onForgotPassword,\n}: AuthExperienceProps) => {\n  const { signUp, messages } = useAuth();\n\n  const fields = config.fields ?? EMPTY_FIELDS;\n  const branding = config.branding;\n  const layout = config.layout;\n  const redirects = config.redirects;\n\n  validateFieldDefinition(fields);\n\n  const [values, setValues] = useState<Record<string, AuthFieldValue>>(() =>\n    getInitialValues(fields),\n  );\n  const [errors, setErrors] = useState<FieldErrors>({});\n  const [formError, setFormError] = useState<string | null>(null);\n  const [emailError, setEmailError] = useState<string | null>(null);\n  const [loading, setLoading] = useState(false);\n\n  const [name, setName] = useState(\"\");\n  const [email, setEmail] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n  const [confirmation, setConfirmation] = useState(\"\");\n\n  useEffect(() => {\n    setValues((current) => {\n      const next: Record<string, AuthFieldValue> = {};\n\n      for (const field of fields) {\n        const currentValue = Object.prototype.hasOwnProperty.call(\n          current,\n          field.name,\n        )\n          ? current[field.name]\n          : undefined;\n\n        next[field.name] =\n          currentValue ??\n          field.defaultValue ??\n          (field.type === \"checkbox\" ? false : \"\");\n      }\n\n      const currentNames = Object.keys(current);\n      const nextNames = Object.keys(next);\n\n      const unchanged =\n        currentNames.length === nextNames.length &&\n        nextNames.every((fieldName) => current[fieldName] === next[fieldName]);\n\n      return unchanged ? current : next;\n    });\n\n    setErrors((current) => {\n      const activeNames = new Set(fields.map((field) => field.name));\n\n      const next = Object.fromEntries(\n        Object.entries(current).filter(([fieldName]) =>\n          activeNames.has(fieldName),\n        ),\n      );\n\n      return Object.keys(next).length === Object.keys(current).length\n        ? current\n        : next;\n    });\n  }, [fields]);\n\n  const updateField = (fieldName: string, value: AuthFieldValue) => {\n    setValues((current) => ({\n      ...current,\n      [fieldName]: value,\n    }));\n\n    setErrors((current) => {\n      if (!(fieldName in current)) return current;\n\n      const next = { ...current };\n      delete next[fieldName];\n      return next;\n    });\n  };\n\n  const handleEmailChange = (value: string) => {\n    setEmail(value);\n\n    if (emailError) {\n      setEmailError(getEmailError(value, messages));\n    }\n  };\n\n  const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n    setFormError(null);\n    setErrors({});\n\n    const nextEmailError = getEmailError(email, messages);\n\n    setEmailError(nextEmailError);\n\n    if (nextEmailError) {\n      return;\n    }\n\n    if (password !== confirmation) {\n      setFormError(messages.passwordMismatch);\n      return;\n    }\n\n    if (!password) {\n      setFormError(messages.passwordRequired);\n      return;\n    }\n\n    setLoading(true);\n\n    try {\n      const nextErrors = await validateFields(fields, values);\n\n      if (Object.keys(nextErrors).length > 0) {\n        setErrors(nextErrors);\n        return;\n      }\n\n      const registration: AuthRegistrationInput = {\n        name: name.trim() || null,\n        email: email.trim(),\n        password,\n      };\n\n      const result = onSubmit\n        ? await onSubmit({\n            registration,\n            fields: { ...values },\n            signUp,\n          })\n        : await signUp(registration);\n\n      if (result.status === \"authenticated\") {\n        onSuccess?.();\n        redirectAfterSuccess(redirects?.afterSignUp);\n      }\n    } catch (cause) {\n      setFormError(\n        cause instanceof Error ? cause.message : messages.unexpectedError,\n      );\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  const wrapperClassName = [\n    \"puzzle-auth\",\n    \"puzzle-auth-experience\",\n    layout?.className,\n    className,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  const contentClassName = [\n    \"puzzle-auth-experience__content\",\n    layout?.contentClassName,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  const style = {\n    \"--puzzle-auth-experience-width\":\n      layout?.width === \"sm\"\n        ? \"24rem\"\n        : layout?.width === \"lg\"\n          ? \"48rem\"\n          : layout?.width === \"full\"\n            ? \"100%\"\n            : \"32rem\",\n    \"--puzzle-auth-experience-align\":\n      layout?.align === \"left\" ? \"flex-start\" : \"center\",\n  } as CSSProperties;\n\n  return (\n    <section className={wrapperClassName} style={style}>\n      {layout?.header}\n\n      <div className=\"puzzle-auth-experience__branding\">\n        {branding?.logo}\n        {branding?.title ? (\n          <Heading as=\"h1\" level=\"headline2\">\n            {branding.title}\n          </Heading>\n        ) : null}\n        {branding?.description ? <Text as=\"p\">{branding.description}</Text> : null}\n      </div>\n\n      <div className={contentClassName}>\n        {mode === \"sign-in\" ? (\n          <SignInForm\n            redirectTo={redirects?.afterSignIn}\n            onSuccess={onSuccess}\n            onForgotPassword={onForgotPassword}\n            onSignUp={onSignUp}\n          />\n        ) : (\n          <>\n            {formError ? (\n              <div role=\"alert\" aria-live=\"assertive\">\n                <Alert severity=\"error\">{formError}</Alert>\n              </div>\n            ) : null}\n\n            <form\n              className=\"puzzle-auth__form\"\n              onSubmit={(event) => void handleSubmit(event)}\n              noValidate\n            >\n              <FormField\n                label={messages.name}\n                controlId=\"puzzle-auth-experience-name\"\n              >\n                <TextInput\n                  name=\"name\"\n                  type=\"text\"\n                  autoComplete=\"name\"\n                  value={name}\n                  disabled={loading}\n                  onChange={(event) => setName(event.currentTarget.value)}\n                />\n              </FormField>\n\n              <FormField\n                label={messages.email}\n                controlId=\"puzzle-auth-experience-email\"\n                required\n                error={emailError}\n              >\n                <TextInput\n                  name=\"email\"\n                  type=\"email\"\n                  autoComplete=\"email\"\n                  required\n                  value={email}\n                  disabled={loading}\n                  onChange={(event) =>\n                    handleEmailChange(event.currentTarget.value)\n                  }\n                />\n\n              </FormField>\n\n              <FormField\n                label={messages.password}\n                controlId=\"puzzle-auth-experience-password\"\n                required\n              >\n                <TextInput\n                  name=\"new-password\"\n                  type=\"password\"\n                  suffix={null}\n                  autoComplete=\"new-password\"\n                  required\n                  value={password}\n                  disabled={loading}\n                  onChange={(event) => setPassword(event.currentTarget.value)}\n                />\n              </FormField>\n\n              <FormField\n                label={messages.confirmPassword}\n                controlId=\"puzzle-auth-experience-confirm\"\n                required\n              >\n                <TextInput\n                  name=\"confirm-password\"\n                  type=\"password\"\n                  suffix={null}\n                  autoComplete=\"new-password\"\n                  required\n                  value={confirmation}\n                  disabled={loading}\n                  onChange={(event) =>\n                    setConfirmation(event.currentTarget.value)\n                  }\n                />\n              </FormField>\n\n              <AuthCustomFields\n                fields={fields}\n                values={values}\n                errors={errors}\n                disabled={loading}\n                onChange={updateField}\n              />\n\n              <Button\n                type=\"submit\"\n                fullWidth\n                loading={loading}\n                disabled={\n                  loading || !email.trim() || !password || !confirmation\n                }\n              >\n                {loading ? messages.signingUp : messages.createAccount}\n              </Button>\n            </form>\n\n            {onSignIn ? (\n              <footer className=\"puzzle-auth__footer\">\n                <Text>{messages.existingAccount}</Text>\n                <Button\n                  type=\"button\"\n                  variant=\"link\"\n                  onClick={onSignIn}\n                >\n                  {messages.signIn}\n                </Button>\n              </footer>\n            ) : null}\n          </>\n        )}\n      </div>\n\n      {layout?.footer}\n    </section>\n  );\n};\n\nexport { AuthExperience };\n"],"mappings":"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"}