@alfadocs/ui-kit-debug 1.73.2 → 1.74.0

package/dist/_chunks/subDays-xH7cpN6B.js

@@ -1,8 +0,0 @@
-import { a as o } from "./date-picker-variants-DN37Oj5-.js";
-function n(a, s, r) {
-  return o(a, -s, r);
-}
-export {
-  n as s
-};
-//# sourceMappingURL=subDays-xH7cpN6B.js.map

package/dist/_chunks/use-field-match-pdbEnKvO.js

@@ -1,28 +0,0 @@
-import { useState as w, useCallback as E, useEffect as M } from "react";
-import { useTranslation as b } from "react-i18next";
-const L = {
-  email: (s) => s.trim().toLowerCase(),
-  password: (s) => s
-};
-function C({
-  value: s,
-  confirmValue: l,
-  kind: o,
-  submitted: f = !1,
-  normalise: u
-}) {
-  const { t: r } = b("ui"), [m, a] = w(!1), p = E(() => a(!0), []), c = u ?? L[o], t = c(s), e = c(l), n = t === e, d = t !== "" && e !== "" && !n, i = t === "" && e === "";
-  M(() => {
-    i && a(!1);
-  }, [i]);
-  const h = r(o === "email" ? "fieldMatch.email" : "fieldMatch.password");
-  return {
-    matches: n,
-    error: d && (m || f) ? h : void 0,
-    confirmProps: { onBlur: p }
-  };
-}
-export {
-  C as u
-};
-//# sourceMappingURL=use-field-match-pdbEnKvO.js.map

package/dist/_chunks/use-field-match-pdbEnKvO.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-field-match-pdbEnKvO.js","sources":["../../src/hooks/use-field-match.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\n/** Which pair of fields is compared: it picks the comparison and the message. */\nexport type FieldMatchKind = 'email' | 'password';\n\nexport interface UseFieldMatchOptions {\n  /** The value of the first field. */\n  value: string;\n  /** The value of the field that repeats it. */\n  confirmValue: string;\n  /**\n   * `'email'` compares trimmed and without regard to case. `'password'`\n   * compares exactly. Each has its own translated message.\n   */\n  kind: FieldMatchKind;\n  /**\n   * True once the user has tried to submit the form. The message then\n   * shows even if the confirm field was never left.\n   */\n  submitted?: boolean;\n  /**\n   * Replaces the default preparation of both values before they are\n   * compared, e.g. to strip dots from an address.\n   */\n  normalise?: (value: string) => string;\n}\n\nexport interface UseFieldMatchReturn {\n  /**\n   * True when the two values are equal after normalising. Two empty\n   * fields match: check that they are filled in separately.\n   */\n  matches: boolean;\n  /**\n   * The translated message, ready for `FormField`'s `error`. Set only\n   * when both fields have text, they differ, and the user has left the\n   * confirm field once or tried to submit. Cleared as soon as they match.\n   * Emptying both fields starts again: the message waits for the confirm\n   * field to be left once more.\n   */\n  error: string | undefined;\n  /** Spread onto the confirm field's input. */\n  confirmProps: { onBlur: () => void };\n}\n\nconst DEFAULT_NORMALISE: Record<FieldMatchKind, (value: string) => string> = {\n  email: (value) => value.trim().toLowerCase(),\n  password: (value) => value,\n};\n\n/**\n * \"These two fields must match\", for email with confirm email and\n * password with confirm password. It compares the values and says when\n * to show the message; `FormField` shows and announces it.\n *\n * It does not block paste, copy or drop itself. A host that wants the\n * confirm field typed sets `blockPaste` on that input (any field built\n * on `TextInput` takes it); password managers still fill both fields.\n *\n * @example\n *   const match = useFieldMatch({\n *     value: email,\n *     confirmValue: emailConfirm,\n *     kind: 'email',\n *     submitted,\n *   });\n *\n *   // `disableBuiltInValidation`: the match is this field's only check.\n *   // With EmailInput's own message on too, two messages share one id.\n *   <FormField label=\"Confirm email\" required error={match.error}>\n *     <EmailInput\n *       disableBuiltInValidation\n *       value={emailConfirm}\n *       onChange={(event) => setEmailConfirm(event.target.value)}\n *       {...match.confirmProps}\n *     />\n *   </FormField>\n */\nexport function useFieldMatch({\n  value,\n  confirmValue,\n  kind,\n  submitted = false,\n  normalise,\n}: UseFieldMatchOptions): UseFieldMatchReturn {\n  const { t } = useTranslation('ui');\n  const [blurred, setBlurred] = useState(false);\n  const onBlur = useCallback(() => setBlurred(true), []);\n\n  const prepare = normalise ?? DEFAULT_NORMALISE[kind];\n  const first = prepare(value);\n  const second = prepare(confirmValue);\n  const matches = first === second;\n  const show = first !== '' && second !== '' && !matches;\n\n  // Both emptied, as after a server refuses a password: a fresh start,\n  // so the message does not jump out at the first key typed.\n  const bothEmpty = first === '' && second === '';\n  useEffect(() => {\n    if (bothEmpty) setBlurred(false);\n  }, [bothEmpty]);\n\n  // Two plain calls, not a key built from `kind`: the i18n checks read\n  // keys from the source.\n  const message =\n    kind === 'email' ? t('fieldMatch.email') : t('fieldMatch.password');\n\n  return {\n    matches,\n    error: show && (blurred || submitted) ? message : undefined,\n    confirmProps: { onBlur },\n  };\n}\n"],"names":["DEFAULT_NORMALISE","value","useFieldMatch","confirmValue","kind","submitted","normalise","t","useTranslation","blurred","setBlurred","useState","onBlur","useCallback","prepare","first","second","matches","show","bothEmpty","useEffect","message"],"mappings":";;AA8CA,MAAMA,IAAuE;AAAA,EAC3E,OAAO,CAACC,MAAUA,EAAM,KAAA,EAAO,YAAA;AAAA,EAC/B,UAAU,CAACA,MAAUA;AACvB;AA8BO,SAASC,EAAc;AAAA,EAC5B,OAAAD;AAAA,EACA,cAAAE;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC;AACF,GAA8C;AAC5C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,IAAI,GAC3B,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAASC,EAAY,MAAMH,EAAW,EAAI,GAAG,CAAA,CAAE,GAE/CI,IAAUR,KAAaN,EAAkBI,CAAI,GAC7CW,IAAQD,EAAQb,CAAK,GACrBe,IAASF,EAAQX,CAAY,GAC7Bc,IAAUF,MAAUC,GACpBE,IAAOH,MAAU,MAAMC,MAAW,MAAM,CAACC,GAIzCE,IAAYJ,MAAU,MAAMC,MAAW;AAC7C,EAAAI,EAAU,MAAM;AACd,IAAID,OAAsB,EAAK;AAAA,EACjC,GAAG,CAACA,CAAS,CAAC;AAId,QAAME,IACed,EAAnBH,MAAS,UAAY,qBAAwB,qBAAN;AAEzC,SAAO;AAAA,IACL,SAAAa;AAAA,IACA,OAAOC,MAAST,KAAWJ,KAAagB,IAAU;AAAA,IAClD,cAAc,EAAE,QAAAT,EAAA;AAAA,EAAO;AAE3B;"}

package/dist/_chunks/use-registration-submit-eWAECgUC.js

@@ -1,171 +0,0 @@
-import { jsx as p } from "react/jsx-runtime";
-import { useRef as c, useState as v, useEffect as w } from "react";
-import { c as N } from "./index-D2ZczOXr.js";
-import { A as R, P as B } from "./mark-pieces-m_rn1mAc.js";
-const F = N(
-  "ds:w-24 ds:shrink-0 ds:select-none ds:text-[color:var(--primary)] ds:forced-colors:text-[CanvasText]"
-), D = {
-  assemble: "ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*12)_ease-in-out_1]",
-  spin: "ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*8)_ease-in-out_1]",
-  pulse: "ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-pulse_calc(var(--animation-duration)*6)_ease-in-out_3]",
-  none: void 0
-}, H = {
-  top: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-top_calc(var(--animation-duration)*12)_ease-in-out_1]",
-  right: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-right_calc(var(--animation-duration)*12)_ease-in-out_1]",
-  left: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-left_calc(var(--animation-duration)*12)_ease-in-out_1]",
-  bottom: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-bottom_calc(var(--animation-duration)*12)_ease-in-out_1]"
-};
-function I({
-  motion: r = "assemble",
-  label: e,
-  className: o
-}) {
-  const t = c(null), [h, m] = v(0);
-  return w(() => {
-    const i = t.current;
-    if (!i) return;
-    const s = () => m((b) => b + 1);
-    return i.addEventListener("click", s), () => i.removeEventListener("click", s);
-  }, []), /* @__PURE__ */ p(
-    "div",
-    {
-      ref: t,
-      "data-brand-mark": "",
-      "data-motion": r,
-      role: e ? "img" : void 0,
-      "aria-label": e,
-      "aria-hidden": e ? void 0 : !0,
-      className: F({ className: o }),
-      children: /* @__PURE__ */ p(
-        "svg",
-        {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox: "-26 -26 200 200",
-          fill: "currentColor",
-          "aria-hidden": "true",
-          className: "ds:block ds:h-auto ds:w-full ds:overflow-visible",
-          children: /* @__PURE__ */ p("g", { className: D[r], children: R.map((i) => /* @__PURE__ */ p(
-            "g",
-            {
-              className: r === "assemble" ? H[i] : void 0,
-              children: /* @__PURE__ */ p(B, { name: i })
-            },
-            i
-          )) }, h)
-        }
-      )
-    }
-  );
-}
-function J(r, e, o = !1) {
-  const [t, h] = v(
-    () => o ? {} : null
-  ), [m, i] = v(null), [s, b] = v([]);
-  if (t !== m)
-    i(t), b(r.filter((n) => !!e(n)));
-  else {
-    const n = s.filter((l) => !!e(l));
-    n.length !== s.length && b(n);
-  }
-  const g = c(null), u = c(null);
-  return w(() => {
-    var n, l;
-    !t || u.current === t || (u.current = t, s.length > 0 ? (n = g.current) == null || n.focus() : (l = t.fallback) == null || l.call(t));
-  }, [t, s]), {
-    listed: s,
-    lists: (n) => s.includes(n),
-    // A new object each time, so a second refused submit moves focus again.
-    open: (n) => h({ fallback: n }),
-    ref: g
-  };
-}
-function Q(r, e) {
-  const [o, t] = v(void 0);
-  return r && e && o !== r && t(r), !r && o !== void 0 && t(void 0), r && (e || o === r) ? "off" : void 0;
-}
-const M = 8e3, O = (r) => JSON.stringify(
-  Object.entries(r ?? {}).filter(([, e]) => !!e).sort(([e], [o]) => e < o ? -1 : e > o ? 1 : 0)
-);
-function z(r) {
-  const e = c(r);
-  e.current = r;
-  const [o, t] = v(!1), [h, m] = v(!1), [i, s] = v(!1), b = r.submitting || o || h, g = c(null), u = c(!1), n = c(void 0), l = c(!1), x = c(!1), S = c(void 0), T = () => {
-    u.current = !1, clearTimeout(n.current), m(!1);
-  };
-  w(() => () => clearTimeout(n.current), []);
-  const y = (a) => {
-    e.current.native ? t(!0) : (l.current = !0, x.current = !1, S.current = e.current.errors), e.current.deliver(a);
-  }, P = (a) => {
-    if (b) {
-      a.preventDefault();
-      return;
-    }
-    s(!1);
-    const d = e.current.firstProblem();
-    if (d !== void 0) {
-      a.preventDefault(), e.current.onRefused(d);
-      return;
-    }
-    if (e.current.captcha) {
-      a.preventDefault();
-      const f = g.current;
-      if (!f) {
-        s(!0);
-        return;
-      }
-      u.current = !1, f.reset(), u.current = !0, m(!0), clearTimeout(n.current), n.current = setTimeout(
-        () => m(!1),
-        M
-      ), f.execute();
-      return;
-    }
-    if (e.current.native) {
-      t(!0);
-      return;
-    }
-    a.preventDefault(), y();
-  }, C = (a) => {
-    if (!u.current) return;
-    if (T(), !a) {
-      s(!0);
-      return;
-    }
-    const d = e.current.firstProblem();
-    if (d !== void 0) {
-      e.current.onRefused(d);
-      return;
-    }
-    y(a);
-  }, L = () => {
-    u.current && (T(), s(!0));
-  }, _ = r.errors, k = O(_), E = c(null);
-  return w(() => {
-    var f;
-    if (E.current === null) {
-      E.current = k;
-      return;
-    }
-    const a = k !== E.current;
-    E.current = k, l.current && r.submitting && (x.current = !0);
-    const d = l.current && x.current && !r.submitting && _ !== S.current;
-    !a && !d || (l.current = !1, x.current = !1, u.current = !1, clearTimeout(n.current), m(!1), (f = g.current) == null || f.reset(), e.current.onAnswer(_ ?? {}));
-  }, [_, k, r.submitting]), w(() => {
-    const a = (d) => {
-      var f, A;
-      d.persisted && (t(!1), (A = (f = e.current).onRestore) == null || A.call(f));
-    };
-    return window.addEventListener("pageshow", a), () => window.removeEventListener("pageshow", a);
-  }, []), {
-    busy: b,
-    captchaFailed: i,
-    handleSubmit: P,
-    captcha: { ref: g, onChange: C, onError: L }
-  };
-}
-export {
-  I as B,
-  Q as a,
-  z as b,
-  J as u
-};
-//# sourceMappingURL=use-registration-submit-eWAECgUC.js.map

package/dist/_chunks/use-registration-submit-eWAECgUC.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-registration-submit-eWAECgUC.js","sources":["../../src/patterns/_shared/brand-mark.tsx","../../src/patterns/_shared/use-error-summary.ts","../../src/patterns/registration-form/use-registration-submit.ts"],"sourcesContent":["/* -------------------------------------------------------------------- */\n/* BrandMark — the Alfadocs mark, arriving.                               */\n/*                                                                        */\n/* The four pieces of the mark with a short motion when the page opens:  */\n/* they fly apart, turn and come back together (`assemble`), or the      */\n/* whole mark turns once (`spin`) or beats (`pulse`). It plays once and  */\n/* then rests, so nothing moves for more than a few seconds (WCAG        */\n/* 2.2.2); a click plays it again. Every motion scales off               */\n/* --animation-duration, so reduced motion and the accessible themes     */\n/* hold it still.                                                         */\n/* -------------------------------------------------------------------- */\n\nimport { useEffect, useRef, useState, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { ALL, Piece, type PieceName } from './mark-pieces';\n\nexport type BrandMarkMotion = 'assemble' | 'spin' | 'pulse' | 'none';\n\nexport interface BrandMarkProps {\n  /** How the mark arrives. Default `assemble`. */\n  motion?: BrandMarkMotion;\n  /**\n   * The mark's accessible name, e.g. \"Alfadocs\", when it is the page's\n   * logo. Without it the mark is decoration and hidden from screen\n   * readers.\n   */\n  label?: string;\n  className?: string;\n}\n\n// The width of the mark on the development login card. The mark draws in\n// `currentColor`, so the ink is set here: the primary colour, or under\n// forced colours (Windows high contrast) the system's text colour, as Logo\n// does. A fill written as a brand colour would not be replaced and could\n// all but vanish against the system background.\nconst brandMarkVariants = cva(\n  'ds:w-24 ds:shrink-0 ds:select-none ds:text-[color:var(--primary)] ds:forced-colors:text-[CanvasText]',\n);\n\n/* Every class is written out in full: Tailwind only generates the ones\n   it can read as a whole string. The whole mark turns about the centre\n   of the drawing; each piece moves about its own centre. */\nconst WHOLE: Record<BrandMarkMotion, string | undefined> = {\n  assemble:\n    'ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  spin: 'ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*8)_ease-in-out_1]',\n  pulse:\n    'ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-pulse_calc(var(--animation-duration)*6)_ease-in-out_3]',\n  none: undefined,\n};\nconst SCATTER: Record<PieceName, string> = {\n  top: 'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-top_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  right:\n    'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-right_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  left: 'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-left_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  bottom:\n    'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-bottom_calc(var(--animation-duration)*12)_ease-in-out_1]',\n};\n\nexport function BrandMark({\n  motion = 'assemble',\n  label,\n  className,\n}: BrandMarkProps): ReactNode {\n  const ref = useRef<HTMLDivElement | null>(null);\n  const [plays, setPlays] = useState(0);\n\n  // A listener rather than onClick: the replay is for the pointer only,\n  // and the mark stays a plain image to assistive technology.\n  useEffect(() => {\n    const element = ref.current;\n    if (!element) return undefined;\n    const replay = () => setPlays((count) => count + 1);\n    element.addEventListener('click', replay);\n    return () => element.removeEventListener('click', replay);\n  }, []);\n\n  return (\n    <div\n      ref={ref}\n      data-brand-mark=\"\"\n      data-motion={motion}\n      role={label ? 'img' : undefined}\n      aria-label={label}\n      aria-hidden={label ? undefined : true}\n      className={brandMarkVariants({ className })}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"-26 -26 200 200\"\n        fill=\"currentColor\"\n        aria-hidden=\"true\"\n        className=\"ds:block ds:h-auto ds:w-full ds:overflow-visible\"\n      >\n        {/* A new key starts the motion again from its first frame. */}\n        <g key={plays} className={WHOLE[motion]}>\n          {ALL.map((name) => (\n            <g\n              key={name}\n              className={motion === 'assemble' ? SCATTER[name] : undefined}\n            >\n              <Piece name={name} />\n            </g>\n          ))}\n        </g>\n      </svg>\n    </div>\n  );\n}\n","/* -------------------------------------------------------------------- */\n/* useErrorSummary: what the signed-out forms' ErrorSummary lists, and   */\n/* when it takes focus.                                                   */\n/*                                                                        */\n/* A refused submit, or a server answer with messages for fields, opens  */\n/* the summary: it lists every field then in error and takes focus. A    */\n/* field leaves the list once it has no message, and does not come back  */\n/* until the next submit: an error made later, on leaving that field, is */\n/* the field's own to announce. A listed field stays quiet.              */\n/*                                                                        */\n/* Shipped with the patterns that import it; not an export of its own.   */\n/* -------------------------------------------------------------------- */\n\nimport { useEffect, useRef, useState, type RefObject } from 'react';\nimport type { AlertAnnounce } from '../../components/alert';\n\ninterface OpenRequest {\n  /** Called instead of focusing the summary when no field has a message. */\n  fallback?: () => void;\n}\n\nexport interface UseErrorSummaryReturn<Field extends string> {\n  /** The fields the summary lists now, in the form's order. */\n  listed: readonly Field[];\n  /** True while the summary lists the field: its own message then stays\n   *  quiet (FormField's `announceError`). */\n  lists: (field: Field) => boolean;\n  /**\n   * Lists every field in error after this render and moves focus to the\n   * summary. When no field has a message, calls `fallback` instead (a\n   * message about the whole form, say).\n   */\n  open: (fallback?: () => void) => void;\n  /** For the `ErrorSummary`. */\n  ref: RefObject<HTMLDivElement | null>;\n}\n\n/**\n * @param order the fields the form shows, in order.\n * @param messageFor the message a field shows in this render, if any.\n * @param openAtMount open at once: the form arrived with messages from\n *   the server (a page it rendered after a failed post).\n */\nexport function useErrorSummary<Field extends string>(\n  order: readonly Field[],\n  messageFor: (field: Field) => string | undefined,\n  openAtMount = false,\n): UseErrorSummaryReturn<Field> {\n  const [request, setRequest] = useState<OpenRequest | null>(() =>\n    openAtMount ? {} : null,\n  );\n  const [handled, setHandled] = useState<OpenRequest | null>(null);\n  const [listed, setListed] = useState<readonly Field[]>([]);\n\n  // Worked out while rendering, not in an effect: the messages and the\n  // summary must reach the page in the same commit. A message drawn one\n  // commit before the summary would still be announced on its own.\n  if (request !== handled) {\n    setHandled(request);\n    setListed(order.filter((field) => Boolean(messageFor(field))));\n  } else {\n    const kept = listed.filter((field) => Boolean(messageFor(field)));\n    if (kept.length !== listed.length) setListed(kept);\n  }\n\n  const ref = useRef<HTMLDivElement | null>(null);\n  const focusedFor = useRef<OpenRequest | null>(null);\n  useEffect(() => {\n    if (!request || focusedFor.current === request) return;\n    focusedFor.current = request;\n    if (listed.length > 0) ref.current?.focus();\n    else request.fallback?.();\n  }, [request, listed]);\n\n  return {\n    listed,\n    lists: (field) => listed.includes(field),\n    // A new object each time, so a second refused submit moves focus again.\n    open: (fallback) => setRequest({ fallback }),\n    ref,\n  };\n}\n\n/**\n * How the message about the whole form is announced, beside the summary.\n * While the summary lists a field it takes focus and reads that message\n * too (its `aria-describedby`), so an alert as well would be read over it:\n * the message stays quiet. It stays quiet until its text changes, because\n * a role=\"alert\" added to text already on screen can be read out of turn.\n * Otherwise the Alert's own default applies.\n */\nexport function useFormMessageAnnounce(\n  message: string | undefined,\n  summaryOpen: boolean,\n): AlertAnnounce | undefined {\n  const [quietFor, setQuietFor] = useState<string | undefined>(undefined);\n  // Worked out while rendering, so the message mounts quiet in the same\n  // commit as the summary.\n  if (message && summaryOpen && quietFor !== message) setQuietFor(message);\n  if (!message && quietFor !== undefined) setQuietFor(undefined);\n  return message && (summaryOpen || quietFor === message) ? 'off' : undefined;\n}\n","/* -------------------------------------------------------------------- */\n/* useRegistrationSubmit — what happens between \"the user pressed the    */\n/* button\" and \"the values left the page\".                               */\n/*                                                                        */\n/* Three things that are easy to get wrong live here, away from the      */\n/* form's markup so they can be tested on their own:                     */\n/*                                                                        */\n/*  1. The submit itself: refuse while busy or invalid, otherwise hand   */\n/*     over to the host or let the browser post.                         */\n/*  2. The reCAPTCHA wait: the token arrives later, and the fields stay  */\n/*     live meanwhile, so the form is checked again when it does.        */\n/*  3. The server's answer: telling a new `errors` object that carries   */\n/*     an answer from one the host merely rebuilt while rendering.       */\n/* -------------------------------------------------------------------- */\n\nimport { useEffect, useRef, useState, type RefObject } from 'react';\nimport type { RecaptchaWidgetHandle } from '../../components/recaptcha-widget';\n\ntype Messages = Readonly<Record<string, string | undefined>>;\n\n/**\n * How long the button stays busy waiting for a reCAPTCHA token. Google\n * sends no event when the user closes a challenge, so the wait cannot be\n * open-ended: after this the button comes back and the user can try\n * again. A token that arrives later is still used.\n */\nexport const CAPTCHA_PATIENCE = 8000;\n\nexport interface UseRegistrationSubmitOptions<Field extends string> {\n  /** The host's `errors` prop. */\n  errors: Messages | undefined;\n  /** The host's `submitting` prop. */\n  submitting: boolean;\n  /** True when the browser posts the form itself. */\n  native: boolean;\n  /** True when a reCAPTCHA check guards the submit. */\n  captcha: boolean;\n  /**\n   * The first field that stops a submit, or `undefined` when every field\n   * is valid. Called when the answer is needed, so it must read the\n   * latest values.\n   */\n  firstProblem: () => Field | undefined;\n  /** A submit was refused because of this field. */\n  onRefused: (field: Field) => void;\n  /**\n   * Hand the values over. For a React host, call its `onSubmit`. For a\n   * native post this is only called when a reCAPTCHA token arrives (put\n   * the token in its field and call `form.submit()`); without reCAPTCHA\n   * the browser posts on its own and this is not called.\n   */\n  deliver: (captchaToken?: string) => void;\n  /** The server has answered with these messages. */\n  onAnswer: (errors: Messages) => void;\n  /** The browser restored the page from its back-forward cache. */\n  onRestore?: () => void;\n}\n\nexport interface UseRegistrationSubmitReturn {\n  /** True while a submit is on its way: the host is sending, the browser\n   *  is posting, or a reCAPTCHA token is awaited. */\n  busy: boolean;\n  /** True when the last reCAPTCHA check failed or expired. */\n  captchaFailed: boolean;\n  /** The form's `onSubmit`. */\n  handleSubmit: (event: { preventDefault: () => void }) => void;\n  /** Props for the `RecaptchaWidget`. */\n  captcha: {\n    ref: RefObject<RecaptchaWidgetHandle | null>;\n    onChange: (token: string | null) => void;\n    onError: () => void;\n  };\n}\n\n/** The messages a host's `errors` carries, whatever order it lists them\n *  in and however it spells \"no message\". */\nconst signatureOf = (errors: Messages | undefined): string =>\n  JSON.stringify(\n    Object.entries(errors ?? {})\n      .filter(([, message]) => Boolean(message))\n      .sort(([a], [b]) => (a < b ? -1 : a > b ? 1 : 0)),\n  );\n\nexport function useRegistrationSubmit<Field extends string>(\n  options: UseRegistrationSubmitOptions<Field>,\n): UseRegistrationSubmitReturn {\n  // The handlers below run long after the render that made them (a token\n  // arrives seconds later), so they read the options of the latest render.\n  const latest = useRef(options);\n  latest.current = options;\n\n  // A native post is on its way: the page is about to change.\n  const [posting, setPosting] = useState(false);\n  // Waiting for a reCAPTCHA token, within the patience above.\n  const [verifying, setVerifying] = useState(false);\n  const [captchaFailed, setCaptchaFailed] = useState(false);\n  const busy = options.submitting || posting || verifying;\n\n  const widget = useRef<RecaptchaWidgetHandle | null>(null);\n  /** True between asking for a token and the widget's answer. */\n  const expecting = useRef(false);\n  const patience = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  /** True between handing the values to the host and its next answer. */\n  const awaitingAnswer = useRef(false);\n  /** The host has shown `submitting` since the values were handed over. */\n  const sawSending = useRef(false);\n  /** The `errors` object the form was sent with. */\n  const sentWith = useRef<Messages | undefined>(undefined);\n\n  const stopWaiting = () => {\n    expecting.current = false;\n    clearTimeout(patience.current);\n    setVerifying(false);\n  };\n  useEffect(() => () => clearTimeout(patience.current), []);\n\n  const send = (captchaToken?: string) => {\n    if (latest.current.native) {\n      setPosting(true);\n    } else {\n      awaitingAnswer.current = true;\n      sawSending.current = false;\n      sentWith.current = latest.current.errors;\n    }\n    latest.current.deliver(captchaToken);\n  };\n\n  const handleSubmit = (event: { preventDefault: () => void }) => {\n    if (busy) {\n      event.preventDefault();\n      return;\n    }\n    setCaptchaFailed(false);\n    const problem = latest.current.firstProblem();\n    if (problem !== undefined) {\n      event.preventDefault();\n      latest.current.onRefused(problem);\n      return;\n    }\n    if (latest.current.captcha) {\n      // The token arrives later, in `onChange`.\n      event.preventDefault();\n      const handle = widget.current;\n      if (!handle) {\n        setCaptchaFailed(true);\n        return;\n      }\n      // A token works once, so start clean. The widget reports the\n      // reset as \"no token\": that is not the answer to this request.\n      expecting.current = false;\n      handle.reset();\n      expecting.current = true;\n      setVerifying(true);\n      clearTimeout(patience.current);\n      patience.current = setTimeout(\n        () => setVerifying(false),\n        CAPTCHA_PATIENCE,\n      );\n      // Queued by the widget if its script is still loading; loads the\n      // script again if it failed to.\n      handle.execute();\n      return;\n    }\n    if (latest.current.native) {\n      // Not prevented: the browser posts the form.\n      setPosting(true);\n      return;\n    }\n    event.preventDefault();\n    send();\n  };\n\n  const onChange = (token: string | null) => {\n    if (!expecting.current) return;\n    stopWaiting();\n    if (!token) {\n      setCaptchaFailed(true);\n      return;\n    }\n    // The fields stayed live during the wait: check them again, so an\n    // edit made meanwhile cannot go out unchecked.\n    const problem = latest.current.firstProblem();\n    if (problem !== undefined) {\n      latest.current.onRefused(problem);\n      return;\n    }\n    send(token);\n  };\n\n  const onError = () => {\n    // A failure nobody is waiting on (the script was blocked when the\n    // page loaded) says nothing yet: the next submit tries again.\n    if (!expecting.current) return;\n    stopWaiting();\n    setCaptchaFailed(true);\n  };\n\n  // The server has answered when `errors` says something new. The same\n  // messages can also come back twice (another address, also taken), and\n  // then the content cannot tell. A new object alone is no proof either:\n  // a host that writes `errors={{ email: emailError }}` makes one on\n  // every render, in flight or not. What settles it is `submitting`: a\n  // host that sets it while it sends has an answer once it is false\n  // again and `errors` is no longer the object the form was sent with.\n  const errors = options.errors;\n  const signature = signatureOf(errors);\n  const lastSignature = useRef<string | null>(null);\n  useEffect(() => {\n    if (lastSignature.current === null) {\n      // The messages the form opened with are not an answer.\n      lastSignature.current = signature;\n      return;\n    }\n    const saysSomethingNew = signature !== lastSignature.current;\n    lastSignature.current = signature;\n    if (awaitingAnswer.current && options.submitting) sawSending.current = true;\n    const settled =\n      awaitingAnswer.current &&\n      sawSending.current &&\n      !options.submitting &&\n      errors !== sentWith.current;\n    if (!saysSomethingNew && !settled) return;\n    awaitingAnswer.current = false;\n    sawSending.current = false;\n    // The token, if any, has been used.\n    expecting.current = false;\n    clearTimeout(patience.current);\n    setVerifying(false);\n    widget.current?.reset();\n    latest.current.onAnswer(errors ?? {});\n  }, [errors, signature, options.submitting]);\n\n  // Back from the next page, the browser may restore this one as it was\n  // left: mid-post, with the button spinning.\n  useEffect(() => {\n    const onPageShow = (event: PageTransitionEvent) => {\n      if (!event.persisted) return;\n      setPosting(false);\n      latest.current.onRestore?.();\n    };\n    window.addEventListener('pageshow', onPageShow);\n    return () => window.removeEventListener('pageshow', onPageShow);\n  }, []);\n\n  return {\n    busy,\n    captchaFailed,\n    handleSubmit,\n    captcha: { ref: widget, onChange, onError },\n  };\n}\n"],"names":["brandMarkVariants","cva","WHOLE","SCATTER","BrandMark","motion","label","className","ref","useRef","plays","setPlays","useState","useEffect","element","replay","count","jsx","ALL","name","Piece","useErrorSummary","order","messageFor","openAtMount","request","setRequest","handled","setHandled","listed","setListed","field","kept","focusedFor","_a","fallback","useFormMessageAnnounce","message","summaryOpen","quietFor","setQuietFor","CAPTCHA_PATIENCE","signatureOf","errors","a","b","useRegistrationSubmit","options","latest","posting","setPosting","verifying","setVerifying","captchaFailed","setCaptchaFailed","busy","widget","expecting","patience","awaitingAnswer","sawSending","sentWith","stopWaiting","send","captchaToken","handleSubmit","event","problem","handle","onChange","token","onError","signature","lastSignature","saysSomethingNew","settled","onPageShow","_b"],"mappings":"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"}