@funstack/ui 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/form/form-root.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-root.mjs","names":[],"sources":["../../src/form/form-root.tsx"],"sourcesContent":["\"use client\";\nimport { useCallback, useMemo, useRef, useState, useTransition } from \"react\";\nimport type { ComponentPropsWithRef, CSSProperties, FormEvent, ReactNode } from \"react\";\nimport { dataAttr } from \"../internal/data-attr.js\";\nimport { FormContext } from \"../internal/field-context.js\";\nimport type { FormContextValue, FormFieldRegistration } from \"../internal/field-context.js\";\nimport { announce } from \"../internal/focus-first-invalid.js\";\nimport { FormStatusWatcher } from \"../internal/form-status-watcher.js\";\nimport type { RenderProp, StateValue } from \"../internal/types.js\";\nimport { useLatest } from \"../internal/use-latest.js\";\nimport { resolveStateValue, useRender } from \"../internal/use-render.js\";\nimport { hasAnyError, sortByDocumentOrder } from \"../internal/validity.js\";\nimport type { FormErrors } from \"../internal/validity.js\";\n\nexport type { FieldErrorValue, FormErrors } from \"../internal/validity.js\";\n\nconst isDev = process.env.NODE_ENV !== \"production\";\n\nexport interface FormRootState {\n  /** A submission is in flight: the Form's own transition, or the form's status (`useFormStatus`), including the Suspense wait of the result. */\n  readonly pending: boolean;\n}\n\nexport interface FormRootProps extends Omit<\n  ComponentPropsWithRef<\"form\">,\n  \"onSubmit\" | \"method\" | \"action\" | \"className\" | \"style\" | \"children\"\n> {\n  /**\n   * React form action (`(formData) => unknown`: a Server Function, a `useActionState` dispatch,\n   * or a client function), rendered on the form unwrapped so React's progressive enhancement is\n   * kept, and run by the Form inside its own transition after hydration (no automatic reset; see\n   * `autoReset`). A string is a navigating form. A submitter with its own `formAction` is left to\n   * React (automatic reset applies to it).\n   */\n  action?: string | ((formData: FormData) => unknown);\n  /**\n   * Field errors keyed by field `name` (usually `state.errors` from `useActionState`). Each\n   * `Field.Root` with that name shows its entry, writes it into the control's custom validity,\n   * and clears it on the user's next edit; the next settled submission shows the new entries.\n   * Errors present at mount are shown without moving focus.\n   */\n  errors?: FormErrors;\n  /**\n   * Reset the form (`form.reset()`) when a submission the Form ran settles with no non-empty\n   * entry in `errors`. Default `true`. A submission that reports errors never resets, so the\n   * user's input, `:user-invalid` and custom validity stay. `false`: never reset.\n   */\n  autoReset?: boolean;\n  /** Only with a string `action`. Owned otherwise (React's own with a function action). */\n  method?: ComponentPropsWithRef<\"form\">[\"method\"];\n  className?: StateValue<string | undefined, FormRootState>;\n  style?: StateValue<CSSProperties | undefined, FormRootState>;\n  children?: StateValue<ReactNode, FormRootState>;\n  /** Must render a `<form>`. */\n  render?: RenderProp<ComponentPropsWithRef<\"form\">, FormRootState>;\n}\n\ninterface Submission {\n  /** The Form ran the action itself (`onSubmit` + its own transition). */\n  readonly intercepted: boolean;\n  readonly formData: FormData | null;\n}\n\n/**\n * A `<form>` that runs its function `action` itself after hydration (design/components/field-form.md\n * 3): `onSubmit` cancels the native submission, so react-dom neither runs the action nor schedules\n * its automatic reset, and the Form awaits `action(formData)` inside its own transition, which\n * still starts the form's status (`useFormStatus`). The action stays rendered unwrapped on the\n * element, so a Server Function posts before hydration.\n *\n * When a submission settles, the Form focuses the first Field that shows a server error (from\n * `errors`), or, when `errors` has no entry and `autoReset` is on, resets the form.\n *\n * Owned keys (conventions 1.2): `action`, `method` (except with a string `action`), `onSubmit`,\n * `data-pending`.\n */\nexport function FormRoot({\n  action,\n  errors,\n  autoReset = true,\n  method,\n  className,\n  style,\n  children,\n  render,\n  ...rest\n}: FormRootProps) {\n  const [isPending, startTransition] = useTransition();\n  const [statusPending, setStatusPending] = useState(false);\n  const pending = isPending || statusPending;\n\n  const formRef = useRef<HTMLFormElement | null>(null);\n  const submission = useRef<Submission | null>(null);\n  const fields = useRef(new Set<FormFieldRegistration>());\n  const warnedElement = useRef(false);\n  const latest = useLatest({ errors, autoReset });\n  const isFunction = typeof action === \"function\";\n\n  // A native capture listener sees every submission, React's path included (a submitter with its\n  // own `formAction`), before React's `onSubmit` runs and marks it intercepted.\n  const libraryRef = useCallback((form: HTMLFormElement) => {\n    formRef.current = form;\n    if (isDev && !warnedElement.current && form.tagName !== \"FORM\") {\n      warnedElement.current = true;\n      console.error(\n        `Form.Root: expected to render a <form> element but got <${form.tagName.toLowerCase()}>.`,\n      );\n    }\n    const onSubmit = (event: Event) => {\n      if (event.target !== form) return;\n      submission.current = { intercepted: false, formData: null };\n    };\n    form.addEventListener(\"submit\", onSubmit, true);\n    return () => {\n      form.removeEventListener(\"submit\", onSubmit, true);\n      if (formRef.current === form) formRef.current = null;\n    };\n  }, []);\n\n  const onSubmit = (event: FormEvent<HTMLFormElement>) => {\n    if (typeof action !== \"function\") return; // a navigating form: the browser's\n    // A `render` element's own `onSubmit` (merged, it runs first) vetoed the submission\n    // (conventions: a `preventDefault()` in the consumer's handler cancels the library's work).\n    if (event.defaultPrevented) {\n      submission.current = null;\n      return;\n    }\n    const native = event.nativeEvent as SubmitEvent;\n    const submitter = native.submitter;\n    // A per-button action: React's own path (and its automatic reset).\n    if (submitter?.hasAttribute(\"formaction\") === true) return;\n    // react-dom now skips its action run and its reset, and still starts the form's status.\n    event.preventDefault();\n    const formData = new FormData(event.currentTarget, submitter);\n    submission.current = { intercepted: true, formData };\n    startTransition(async () => {\n      await action(formData);\n    });\n  };\n\n  const registerField = useCallback((registration: FormFieldRegistration) => {\n    fields.current.add(registration);\n    return () => {\n      fields.current.delete(registration);\n    };\n  }, []);\n\n  // The settle (design 3.2): the form's status went `true → false`. The Fields rendered the\n  // result's errors in that commit; this effect runs after it.\n  const onSettled = useCallback(() => {\n    const settled = submission.current;\n    submission.current = null;\n    const form = formRef.current;\n    if (form === null) return;\n    const shown = [...fields.current]\n      .filter((field) => field.showsServerError())\n      .map((field) => ({ field, target: field.getFocusTarget() }))\n      .filter(\n        (entry): entry is { field: FormFieldRegistration; target: HTMLElement } =>\n          entry.target !== null && entry.target.isConnected,\n      );\n    if (shown.length > 0) {\n      const first = sortByDocumentOrder(shown, (entry) => entry.target)[0]!;\n      // Focus already there (the user pressed Enter in that field): `focus()` does nothing and\n      // nothing reads the new description, so the message is announced instead (design 5.3).\n      if (first.target.ownerDocument.activeElement === first.target) {\n        announce(first.target, first.field.serverMessages().join(\" \"));\n      } else {\n        first.target.focus();\n      }\n      return;\n    }\n    const { errors, autoReset } = latest.current;\n    if (autoReset && settled?.intercepted === true && !hasAnyError(errors)) form.reset();\n  }, [latest]);\n\n  const submittedData = useCallback(() => {\n    const current = submission.current;\n    return current?.intercepted === true ? current.formData : null;\n  }, []);\n\n  const refreshFields = useCallback((source: FormFieldRegistration | null) => {\n    for (const field of fields.current) if (field !== source) field.refresh();\n  }, []);\n\n  const context = useMemo<FormContextValue>(\n    () => ({ errors, registerField, submittedData, refreshFields }),\n    [errors, registerField, submittedData, refreshFields],\n  );\n\n  const state: FormRootState = { pending };\n\n  const element = useRender<ComponentPropsWithRef<\"form\">, FormRootState>({\n    defaultElement: \"form\",\n    render,\n    state,\n    className,\n    style,\n    children: (s) => (\n      <>\n        {resolveStateValue(children, s)}\n        {isFunction && (\n          <FormStatusWatcher onPendingChange={setStatusPending} onSettled={onSettled} />\n        )}\n      </>\n    ),\n    props: rest,\n    libraryProps: {\n      method: typeof action === \"string\" ? method : undefined,\n      // React's own type wants `void | Promise<void>`; the library's actions return `unknown`\n      // (conventions 2.2) and React ignores the result.\n      action: action as ComponentPropsWithRef<\"form\">[\"action\"],\n      onSubmit: isFunction ? onSubmit : undefined,\n      \"data-pending\": dataAttr(pending),\n    },\n    ref: libraryRef,\n  });\n\n  return <FormContext value={context}>{element}</FormContext>;\n}\n\nFormRoot.displayName = \"FormRoot\";\n"],"mappings":";;;;;;;;;;;;AAgBA,MAAM,QAAQ,QAAQ,IAAI,aAAa;;;;;;;;;;;;;;AA4DvC,SAAgB,SAAS,EACvB,QACA,QACA,YAAY,MACZ,QACA,WACA,OACA,UACA,QACA,GAAG,QACa;CAChB,MAAM,CAAC,WAAW,mBAAmB,cAAc;CACnD,MAAM,CAAC,eAAe,oBAAoB,SAAS,KAAK;CACxD,MAAM,UAAU,aAAa;CAE7B,MAAM,UAAU,OAA+B,IAAI;CACnD,MAAM,aAAa,OAA0B,IAAI;CACjD,MAAM,SAAS,uBAAO,IAAI,IAA2B,CAAC;CACtD,MAAM,gBAAgB,OAAO,KAAK;CAClC,MAAM,SAAS,UAAU;EAAE;EAAQ;CAAU,CAAC;CAC9C,MAAM,aAAa,OAAO,WAAW;CAIrC,MAAM,aAAa,aAAa,SAA0B;EACxD,QAAQ,UAAU;EAClB,IAAI,SAAS,CAAC,cAAc,WAAW,KAAK,YAAY,QAAQ;GAC9D,cAAc,UAAU;GACxB,QAAQ,MACN,2DAA2D,KAAK,QAAQ,YAAY,EAAE,GACxF;EACF;EACA,MAAM,YAAY,UAAiB;GACjC,IAAI,MAAM,WAAW,MAAM;GAC3B,WAAW,UAAU;IAAE,aAAa;IAAO,UAAU;GAAK;EAC5D;EACA,KAAK,iBAAiB,UAAU,UAAU,IAAI;EAC9C,aAAa;GACX,KAAK,oBAAoB,UAAU,UAAU,IAAI;GACjD,IAAI,QAAQ,YAAY,MAAM,QAAQ,UAAU;EAClD;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,UAAsC;EACtD,IAAI,OAAO,WAAW,YAAY;EAGlC,IAAI,MAAM,kBAAkB;GAC1B,WAAW,UAAU;GACrB;EACF;EAEA,MAAM,YADS,MAAM,YACI;EAEzB,IAAI,WAAW,aAAa,YAAY,MAAM,MAAM;EAEpD,MAAM,eAAe;EACrB,MAAM,WAAW,IAAI,SAAS,MAAM,eAAe,SAAS;EAC5D,WAAW,UAAU;GAAE,aAAa;GAAM;EAAS;EACnD,gBAAgB,YAAY;GAC1B,MAAM,OAAO,QAAQ;EACvB,CAAC;CACH;CAEA,MAAM,gBAAgB,aAAa,iBAAwC;EACzE,OAAO,QAAQ,IAAI,YAAY;EAC/B,aAAa;GACX,OAAO,QAAQ,OAAO,YAAY;EACpC;CACF,GAAG,CAAC,CAAC;CAIL,MAAM,YAAY,kBAAkB;EAClC,MAAM,UAAU,WAAW;EAC3B,WAAW,UAAU;EACrB,MAAM,OAAO,QAAQ;EACrB,IAAI,SAAS,MAAM;EACnB,MAAM,QAAQ,CAAC,GAAG,OAAO,OAAO,CAAC,CAC9B,QAAQ,UAAU,MAAM,iBAAiB,CAAC,CAAC,CAC3C,KAAK,WAAW;GAAE;GAAO,QAAQ,MAAM,eAAe;EAAE,EAAE,CAAC,CAC3D,QACE,UACC,MAAM,WAAW,QAAQ,MAAM,OAAO,WAC1C;EACF,IAAI,MAAM,SAAS,GAAG;GACpB,MAAM,QAAQ,oBAAoB,QAAQ,UAAU,MAAM,MAAM,CAAC,CAAC;GAGlE,IAAI,MAAM,OAAO,cAAc,kBAAkB,MAAM,QACrD,SAAS,MAAM,QAAQ,MAAM,MAAM,eAAe,CAAC,CAAC,KAAK,GAAG,CAAC;QAE7D,MAAM,OAAO,MAAM;GAErB;EACF;EACA,MAAM,EAAE,QAAQ,cAAc,OAAO;EACrC,IAAI,aAAa,SAAS,gBAAgB,QAAQ,CAAC,YAAY,MAAM,GAAG,KAAK,MAAM;CACrF,GAAG,CAAC,MAAM,CAAC;CAEX,MAAM,gBAAgB,kBAAkB;EACtC,MAAM,UAAU,WAAW;EAC3B,OAAO,SAAS,gBAAgB,OAAO,QAAQ,WAAW;CAC5D,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAgB,aAAa,WAAyC;EAC1E,KAAK,MAAM,SAAS,OAAO,SAAS,IAAI,UAAU,QAAQ,MAAM,QAAQ;CAC1E,GAAG,CAAC,CAAC;CAEL,MAAM,UAAU,eACP;EAAE;EAAQ;EAAe;EAAe;CAAc,IAC7D;EAAC;EAAQ;EAAe;EAAe;CAAa,CACtD;CAIA,MAAM,UAAU,UAAwD;EACtE,gBAAgB;EAChB;EACA,OAAA,EAL6B,QAKzB;EACJ;EACA;EACA,WAAW,MACT,qBAAA,UAAA,EAAA,UAAA,CACG,kBAAkB,UAAU,CAAC,GAC7B,cACC,oBAAC,mBAAD;GAAmB,iBAAiB;GAA6B;EAAY,CAAA,CAE/E,EAAA,CAAA;EAEJ,OAAO;EACP,cAAc;GACZ,QAAQ,OAAO,WAAW,WAAW,SAAS,KAAA;GAGtC;GACR,UAAU,aAAa,WAAW,KAAA;GAClC,gBAAgB,SAAS,OAAO;EAClC;EACA,KAAK;CACP,CAAC;CAED,OAAO,oBAAC,aAAD;EAAa,OAAO;EAAU,UAAA;CAAqB,CAAA;AAC5D;AAEA,SAAS,cAAc"}

package/dist/form/form-submit.d.mts

@@ -0,0 +1,31 @@
+import { RenderProp, StateValue } from "../internal/types.mjs";
+import { CSSProperties, ComponentPropsWithRef, ReactNode } from "react";
+//#region src/form/form-submit.d.ts
+export interface FormSubmitState {
+  /** The enclosing form's submission is in flight (`useFormStatus().pending`). */
+  readonly pending: boolean;
+  readonly disabled: boolean;
+}
+export interface FormSubmitProps extends Omit<ComponentPropsWithRef<"button">, "type" | "className" | "style" | "children"> {
+  /** Native `disabled`; owned. Never set by the library (conventions 3.6). */
+  disabled?: boolean;
+  className?: StateValue<string | undefined, FormSubmitState>;
+  style?: StateValue<CSSProperties | undefined, FormSubmitState>;
+  children?: StateValue<ReactNode, FormSubmitState>;
+  render?: RenderProp<ComponentPropsWithRef<"button">, FormSubmitState>;
+}
+/**
+ * The form's submit button: `<button type="submit">` with `data-pending` while the enclosing
+ * form's submission is in flight (`useFormStatus`). Works in any React-rendered form
+ * (`Form.Root`, `Dialog.Form`, a plain `<form action>`). Never disabled while pending: block
+ * repeat clicks with CSS on `[data-pending]` if you need to.
+ *
+ * Owned keys (conventions 1.2): `type` (on a `<button>`), `disabled`, `data-pending`,
+ * `data-disabled`.
+ */
+export declare function FormSubmit({ disabled, className, style, children, render, ...rest }: FormSubmitProps): ReactNode;
+export declare namespace FormSubmit {
+  var displayName: string;
+}
+//#endregion
+//# sourceMappingURL=form-submit.d.mts.map

package/dist/form/form-submit.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-submit.d.mts","names":[],"sources":["../../src/form/form-submit.tsx"],"mappings":";;;iBAUiB;;WAEN;WACA;;iBAGM,wBAAwB,KACvC;;EAIA;EACA,YAAY,+BAA+B;EAC3C,QAAQ,WAAW,2BAA2B;EAC9C,WAAW,WAAW,WAAW;EACjC,SAAS,WAAW,iCAAiC;;;;;;;;;;;wBAYvC,aACd,UACA,WACA,OACA,UACA,WACG,QACF,kBAAe;yBAPF"}

package/dist/form/form-submit.mjs

@@ -0,0 +1,53 @@
+"use client";
+import { dataAttr } from "../internal/data-attr.mjs";
+import { rendersButton } from "../internal/render-element.mjs";
+import { useRender } from "../internal/use-render.mjs";
+import { useCallback, useRef } from "react";
+import { useFormStatus } from "react-dom";
+//#region src/form/form-submit.tsx
+const isDev = process.env.NODE_ENV !== "production";
+/**
+* The form's submit button: `<button type="submit">` with `data-pending` while the enclosing
+* form's submission is in flight (`useFormStatus`). Works in any React-rendered form
+* (`Form.Root`, `Dialog.Form`, a plain `<form action>`). Never disabled while pending: block
+* repeat clicks with CSS on `[data-pending]` if you need to.
+*
+* Owned keys (conventions 1.2): `type` (on a `<button>`), `disabled`, `data-pending`,
+* `data-disabled`.
+*/
+function FormSubmit({ disabled = false, className, style, children, render, ...rest }) {
+	const { pending } = useFormStatus();
+	const warned = useRef(false);
+	const ref = useCallback((el) => {
+		const submitter = el.tagName === "BUTTON" || el.tagName === "INPUT" && ["submit", "image"].includes(el.type);
+		if (isDev && !warned.current && !submitter) {
+			warned.current = true;
+			console.error(`Form.Submit: expected to render a <button> (or <input type="submit">) but got <${el.tagName.toLowerCase()}>. Only a submit button submits the form natively.`);
+		}
+		return () => {};
+	}, []);
+	return useRender({
+		defaultElement: "button",
+		render,
+		state: {
+			pending,
+			disabled
+		},
+		className,
+		style,
+		children,
+		props: rest,
+		libraryProps: {
+			...rendersButton(render) && { type: "submit" },
+			disabled,
+			"data-pending": dataAttr(pending),
+			"data-disabled": dataAttr(disabled)
+		},
+		ref
+	});
+}
+FormSubmit.displayName = "FormSubmit";
+//#endregion
+export { FormSubmit };
+
+//# sourceMappingURL=form-submit.mjs.map

package/dist/form/form-submit.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-submit.mjs","names":[],"sources":["../../src/form/form-submit.tsx"],"sourcesContent":["\"use client\";\nimport { useCallback, useRef } from \"react\";\nimport type { ComponentPropsWithRef, CSSProperties, ReactNode } from \"react\";\nimport { useFormStatus } from \"react-dom\";\nimport { dataAttr } from \"../internal/data-attr.js\";\nimport type { RenderProp, StateValue } from \"../internal/types.js\";\nimport { rendersButton, useRender } from \"../internal/use-render.js\";\n\nconst isDev = process.env.NODE_ENV !== \"production\";\n\nexport interface FormSubmitState {\n  /** The enclosing form's submission is in flight (`useFormStatus().pending`). */\n  readonly pending: boolean;\n  readonly disabled: boolean;\n}\n\nexport interface FormSubmitProps extends Omit<\n  ComponentPropsWithRef<\"button\">,\n  \"type\" | \"className\" | \"style\" | \"children\"\n> {\n  /** Native `disabled`; owned. Never set by the library (conventions 3.6). */\n  disabled?: boolean;\n  className?: StateValue<string | undefined, FormSubmitState>;\n  style?: StateValue<CSSProperties | undefined, FormSubmitState>;\n  children?: StateValue<ReactNode, FormSubmitState>;\n  render?: RenderProp<ComponentPropsWithRef<\"button\">, FormSubmitState>;\n}\n\n/**\n * The form's submit button: `<button type=\"submit\">` with `data-pending` while the enclosing\n * form's submission is in flight (`useFormStatus`). Works in any React-rendered form\n * (`Form.Root`, `Dialog.Form`, a plain `<form action>`). Never disabled while pending: block\n * repeat clicks with CSS on `[data-pending]` if you need to.\n *\n * Owned keys (conventions 1.2): `type` (on a `<button>`), `disabled`, `data-pending`,\n * `data-disabled`.\n */\nexport function FormSubmit({\n  disabled = false,\n  className,\n  style,\n  children,\n  render,\n  ...rest\n}: FormSubmitProps) {\n  const { pending } = useFormStatus();\n  const warned = useRef(false);\n  const ref = useCallback((el: HTMLElement) => {\n    const submitter =\n      el.tagName === \"BUTTON\" ||\n      (el.tagName === \"INPUT\" && [\"submit\", \"image\"].includes((el as HTMLInputElement).type));\n    if (isDev && !warned.current && !submitter) {\n      warned.current = true;\n      console.error(\n        `Form.Submit: expected to render a <button> (or <input type=\"submit\">) but got ` +\n          `<${el.tagName.toLowerCase()}>. Only a submit button submits the form natively.`,\n      );\n    }\n    // A cleanup, so the merged ref never calls this with `null`.\n    return () => {};\n  }, []);\n  const state: FormSubmitState = { pending, disabled };\n  return useRender<ComponentPropsWithRef<\"button\">, FormSubmitState>({\n    defaultElement: \"button\",\n    render,\n    state,\n    className,\n    style,\n    children,\n    props: rest,\n    libraryProps: {\n      ...(rendersButton(render) && { type: \"submit\" as const }),\n      disabled,\n      \"data-pending\": dataAttr(pending),\n      \"data-disabled\": dataAttr(disabled),\n    },\n    ref,\n  });\n}\n\nFormSubmit.displayName = \"FormSubmit\";\n"],"mappings":";;;;;;;AAQA,MAAM,QAAQ,QAAQ,IAAI,aAAa;;;;;;;;;;AA6BvC,SAAgB,WAAW,EACzB,WAAW,OACX,WACA,OACA,UACA,QACA,GAAG,QACe;CAClB,MAAM,EAAE,YAAY,cAAc;CAClC,MAAM,SAAS,OAAO,KAAK;CAC3B,MAAM,MAAM,aAAa,OAAoB;EAC3C,MAAM,YACJ,GAAG,YAAY,YACd,GAAG,YAAY,WAAW,CAAC,UAAU,OAAO,CAAC,CAAC,SAAU,GAAwB,IAAI;EACvF,IAAI,SAAS,CAAC,OAAO,WAAW,CAAC,WAAW;GAC1C,OAAO,UAAU;GACjB,QAAQ,MACN,kFACM,GAAG,QAAQ,YAAY,EAAE,mDACjC;EACF;EAEA,aAAa,CAAC;CAChB,GAAG,CAAC,CAAC;CAEL,OAAO,UAA4D;EACjE,gBAAgB;EAChB;EACA,OAAA;GAJ+B;GAAS;EAIpC;EACJ;EACA;EACA;EACA,OAAO;EACP,cAAc;GACZ,GAAI,cAAc,MAAM,KAAK,EAAE,MAAM,SAAkB;GACvD;GACA,gBAAgB,SAAS,OAAO;GAChC,iBAAiB,SAAS,QAAQ;EACpC;EACA;CACF,CAAC;AACH;AAEA,WAAW,cAAc"}

package/dist/form/index.d.mts

@@ -0,0 +1,11 @@
+import { FieldErrorValue, FormErrors } from "../internal/validity.mjs";
+import { FormRoot, FormRootProps, FormRootState } from "./form-root.mjs";
+import { FormSubmit, FormSubmitProps, FormSubmitState } from "./form-submit.mjs";
+//#region src/form/index.d.ts
+export declare const Form: {
+  readonly Root: typeof FormRoot;
+  readonly Submit: typeof FormSubmit;
+};
+//#endregion
+export type { FieldErrorValue, FormErrors, FormRootProps, FormRootState, FormSubmitProps, FormSubmitState };
+//# sourceMappingURL=index.d.mts.map

package/dist/form/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","names":[],"sources":["../../src/form/index.ts"],"mappings":";;;;qBAGa;WAAS,aAAI;WAAY,eAAM"}

package/dist/form/index.mjs

@@ -0,0 +1,11 @@
+import { FormRoot } from "./form-root.mjs";
+import { FormSubmit } from "./form-submit.mjs";
+//#region src/form/index.ts
+const Form = {
+	Root: FormRoot,
+	Submit: FormSubmit
+};
+//#endregion
+export { Form };
+
+//# sourceMappingURL=index.mjs.map

package/dist/form/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/form/index.ts"],"sourcesContent":["import { FormRoot } from \"./form-root.js\";\nimport { FormSubmit } from \"./form-submit.js\";\n\nexport const Form = { Root: FormRoot, Submit: FormSubmit } as const;\n\nexport type { FormRootProps, FormRootState, FormErrors, FieldErrorValue } from \"./form-root.js\";\nexport type { FormSubmitProps, FormSubmitState } from \"./form-submit.js\";\n"],"mappings":";;;AAGA,MAAa,OAAO;CAAE,MAAM;CAAU,QAAQ;AAAW"}

package/dist/index.d.mts

@@ -30,8 +30,27 @@ import { DialogOpenChangeDetails, DialogRootProps, DialogRootState } from "./dia
 import { DialogTitleProps, DialogTitleState } from "./dialog/dialog-title.mjs";
 import { DialogTriggerProps, DialogTriggerState } from "./dialog/dialog-trigger.mjs";
 import { Dialog } from "./dialog/index.mjs";
+import { FieldErrorValue, FieldValidity, FormErrors } from "./internal/validity.mjs";
+import { FieldState } from "./internal/field-context.mjs";
+import { FieldControlProps } from "./field/field-control.mjs";
+import { FieldDescriptionProps } from "./field/field-description.mjs";
+import { FieldErrorProps } from "./field/field-error.mjs";
+import { FieldLabelProps } from "./field/field-label.mjs";
+import { FieldRootProps, FieldValidate } from "./field/field-root.mjs";
+import { Field } from "./field/index.mjs";
+import { FormRootProps, FormRootState } from "./form/form-root.mjs";
+import { FormSubmitProps, FormSubmitState } from "./form/form-submit.mjs";
+import { Form } from "./form/index.mjs";
 import { Toggle, TogglePressedChangeDetails, ToggleProps, ToggleState } from "./toggle/toggle.mjs";
 import "./toggle/index.mjs";
+import { ToggleGroupOrientation } from "./toggle-group/toggle-group-context.mjs";
+import { ToggleGroupItemProps, ToggleGroupItemState } from "./toggle-group/toggle-group-item.mjs";
+import { ToggleGroupExclusiveProps, ToggleGroupMultipleProps, ToggleGroupRootProps, ToggleGroupRootState, ToggleGroupValueChangeDetails } from "./toggle-group/toggle-group-root.mjs";
+import { ToggleGroup } from "./toggle-group/index.mjs";
+import { ToolbarButtonActionDetails, ToolbarButtonProps, ToolbarButtonState } from "./toolbar/toolbar-button.mjs";
+import { ToolbarOrientation, ToolbarRootProps, ToolbarRootState } from "./toolbar/toolbar-root.mjs";
+import { ToolbarSeparatorProps, ToolbarSeparatorState } from "./toolbar/toolbar-separator.mjs";
+import { Toolbar } from "./toolbar/index.mjs";
 import { TabsActivationMode, TabsOrientation } from "./tabs/tabs-context.mjs";
 import { TabsIndicatorProps, TabsIndicatorState } from "./tabs/tabs-indicator.mjs";
 import { TabsListProps, TabsListState } from "./tabs/tabs-list.mjs";
@@ -75,4 +94,37 @@ import { SelectSeparatorProps } from "./select/select-separator.mjs";
 import { SelectTriggerProps } from "./select/select-trigger.mjs";
 import { SelectValueProps } from "./select/select-value.mjs";
 import { Select } from "./select/index.mjs";
-export { Accordion, type AccordionItemProps, type AccordionItemState, type AccordionPanelProps, type AccordionPanelState, type AccordionRootExclusiveProps, type AccordionRootMultipleProps, type AccordionRootProps, type AccordionRootState, type AccordionTriggerProps, type AccordionTriggerState, type AccordionValueChangeDetails, type Action, type ActionDetails, type ChangeAction, type ChangeReason, Checkbox, type CheckboxCheckedChangeDetails, CheckboxGroup, type CheckboxGroupItemProps, type CheckboxGroupItemState, type CheckboxGroupLabelProps, type CheckboxGroupParentProps, type CheckboxGroupParentState, type CheckboxGroupRootProps, type CheckboxGroupRootState, type CheckboxGroupValueChangeDetails, type CheckboxProps, type CheckboxState, Combobox, type ComboboxClearProps, type ComboboxClearState, type ComboboxEmptyProps, type ComboboxEmptyState, type ComboboxGroupLabelProps, type ComboboxGroupLabelState, type ComboboxGroupProps, type ComboboxGroupState, type ComboboxInputProps, type ComboboxInputState, type ComboboxInputValueChangeDetails, type ComboboxLabelProps, type ComboboxLabelState, type ComboboxListProps, type ComboboxListState, type ComboboxOpenChangeDetails, type ComboboxOptionProps, type ComboboxOptionState, type ComboboxPopupProps, type ComboboxPopupState, type ComboboxRootProps, type ComboboxRootState, type ComboboxStatusProps, type ComboboxStatusState, type ComboboxTriggerProps, type ComboboxTriggerState, type ComboboxValueChangeDetails, Dialog, type DialogCloseDetails, type DialogCloseProps, type DialogCloseState, type DialogDescriptionProps, type DialogDescriptionState, type DialogFormProps, type DialogFormState, type DialogOpenChangeDetails, type DialogPopupProps, type DialogPopupState, type DialogRootProps, type DialogRootState, type DialogTitleProps, type DialogTitleState, type DialogTriggerProps, type DialogTriggerState, Menu, type MenuAlign, type MenuCheckboxItemProps, type MenuCheckboxItemState, type MenuGroupLabelProps, type MenuGroupLabelState, type MenuGroupProps, type MenuGroupState, type MenuItemDetails, type MenuItemProps, type MenuItemState, type MenuOpenChangeDetails, type MenuPopupProps, type MenuPopupState, type MenuRadioGroupProps, type MenuRadioGroupState, type MenuRadioItemProps, type MenuRadioItemState, type MenuRootProps, type MenuRootState, type MenuSeparatorProps, type MenuSeparatorState, type MenuSide, type MenuSubmenuTriggerProps, type MenuSubmenuTriggerState, type MenuTriggerProps, type MenuTriggerState, Popover, type PopoverAlign, type PopoverCloseProps, type PopoverCloseState, type PopoverDescriptionProps, type PopoverDescriptionState, type PopoverOpenChangeDetails, type PopoverPopupProps, type PopoverPopupState, type PopoverRootProps, type PopoverRootState, type PopoverSide, type PopoverTitleProps, type PopoverTitleState, type PopoverTriggerProps, type PopoverTriggerState, RadioGroup, type RadioGroupItemProps, type RadioGroupItemState, type RadioGroupLabelProps, type RadioGroupRootProps, type RadioGroupRootState, type RadioGroupValueChangeDetails, type RenderProp, Select, type SelectGroupLabelProps, type SelectGroupProps, type SelectOptionProps, type SelectOptionState, type SelectRootProps, type SelectRootState, type SelectSeparatorProps, type SelectTriggerProps, type SelectValueChangeDetails, type SelectValueProps, type StateValue, Switch, type SwitchCheckedChangeDetails, type SwitchProps, type SwitchState, Tabs, type TabsActivationMode, type TabsIndicatorProps, type TabsIndicatorState, type TabsListProps, type TabsListState, type TabsOrientation, type TabsPanelProps, type TabsPanelState, type TabsRootProps, type TabsRootState, type TabsTabProps, type TabsTabState, type TabsValueChangeDetails, Toggle, type TogglePressedChangeDetails, type ToggleProps, type ToggleState, Tooltip, type TooltipAlign, type TooltipPopupProps, type TooltipPopupState, type TooltipProvides, type TooltipRootProps, type TooltipRootState, type TooltipSide, type TooltipTriggerProps, type TooltipTriggerState, type UrgentChangeAction };
+import { ToastActionDetails, ToastActionOptions, ToastCloseDetails, ToastItem, ToastManager, ToastOptions, ToastPriority, ToastPromiseOptions, createToastManager, toast } from "./toast/toast.mjs";
+import { ToastActionProps, ToastActionState } from "./toast/toast-action.mjs";
+import { ToastCloseProps, ToastCloseState } from "./toast/toast-close.mjs";
+import { ToastRootProps, ToastRootState } from "./toast/toast-root.mjs";
+import { ToastDescriptionProps } from "./toast/toast-description.mjs";
+import { ToastTitleProps } from "./toast/toast-title.mjs";
+import { ToastViewportProps, ToastViewportState } from "./toast/toast-viewport.mjs";
+import { Toast } from "./toast/index.mjs";
+import { SliderOrientation, SliderRootProps, SliderRootState, SliderValue, SliderValueChangeDetails, SliderValueCommitDetails } from "./slider/slider-root.mjs";
+import { SliderTrackProps, SliderTrackState } from "./slider/slider-track.mjs";
+import { SliderIndicatorProps, SliderIndicatorState } from "./slider/slider-indicator.mjs";
+import { SliderLabelProps } from "./slider/slider-label.mjs";
+import { SliderThumbProps, SliderThumbState } from "./slider/slider-thumb.mjs";
+import { SliderValueProps, SliderValueState } from "./slider/slider-value.mjs";
+import { Slider } from "./slider/index.mjs";
+import { NumberFieldRootProps, NumberFieldState, NumberFieldValueChangeDetails } from "./number-field/number-field-root.mjs";
+import { NumberFieldButtonState, NumberFieldDecrementProps, NumberFieldIncrementProps } from "./number-field/number-field-increment.mjs";
+import { NumberFieldInputProps } from "./number-field/number-field-input.mjs";
+import { NumberFieldLabelProps } from "./number-field/number-field-label.mjs";
+import { NumberField } from "./number-field/index.mjs";
+import { ProgressRootProps, ProgressState } from "./progress/progress-root.mjs";
+import { ProgressIndicatorProps } from "./progress/progress-indicator.mjs";
+import { ProgressLabelProps } from "./progress/progress-label.mjs";
+import { ProgressTrackProps } from "./progress/progress-track.mjs";
+import { ProgressValueProps } from "./progress/progress-value.mjs";
+import { Progress } from "./progress/index.mjs";
+import { MeterRegion } from "./meter/meter-region.mjs";
+import { MeterRootProps, MeterState } from "./meter/meter-root.mjs";
+import { MeterIndicatorProps } from "./meter/meter-indicator.mjs";
+import { MeterLabelProps } from "./meter/meter-label.mjs";
+import { MeterTrackProps } from "./meter/meter-track.mjs";
+import { MeterValueProps } from "./meter/meter-value.mjs";
+import { Meter } from "./meter/index.mjs";
+export { Accordion, type AccordionItemProps, type AccordionItemState, type AccordionPanelProps, type AccordionPanelState, type AccordionRootExclusiveProps, type AccordionRootMultipleProps, type AccordionRootProps, type AccordionRootState, type AccordionTriggerProps, type AccordionTriggerState, type AccordionValueChangeDetails, type Action, type ActionDetails, type ChangeAction, type ChangeReason, Checkbox, type CheckboxCheckedChangeDetails, CheckboxGroup, type CheckboxGroupItemProps, type CheckboxGroupItemState, type CheckboxGroupLabelProps, type CheckboxGroupParentProps, type CheckboxGroupParentState, type CheckboxGroupRootProps, type CheckboxGroupRootState, type CheckboxGroupValueChangeDetails, type CheckboxProps, type CheckboxState, Combobox, type ComboboxClearProps, type ComboboxClearState, type ComboboxEmptyProps, type ComboboxEmptyState, type ComboboxGroupLabelProps, type ComboboxGroupLabelState, type ComboboxGroupProps, type ComboboxGroupState, type ComboboxInputProps, type ComboboxInputState, type ComboboxInputValueChangeDetails, type ComboboxLabelProps, type ComboboxLabelState, type ComboboxListProps, type ComboboxListState, type ComboboxOpenChangeDetails, type ComboboxOptionProps, type ComboboxOptionState, type ComboboxPopupProps, type ComboboxPopupState, type ComboboxRootProps, type ComboboxRootState, type ComboboxStatusProps, type ComboboxStatusState, type ComboboxTriggerProps, type ComboboxTriggerState, type ComboboxValueChangeDetails, Dialog, type DialogCloseDetails, type DialogCloseProps, type DialogCloseState, type DialogDescriptionProps, type DialogDescriptionState, type DialogFormProps, type DialogFormState, type DialogOpenChangeDetails, type DialogPopupProps, type DialogPopupState, type DialogRootProps, type DialogRootState, type DialogTitleProps, type DialogTitleState, type DialogTriggerProps, type DialogTriggerState, Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldErrorValue, type FieldLabelProps, type FieldRootProps, type FieldState, type FieldValidate, type FieldValidity, Form, type FormErrors, type FormRootProps, type FormRootState, type FormSubmitProps, type FormSubmitState, Menu, type MenuAlign, type MenuCheckboxItemProps, type MenuCheckboxItemState, type MenuGroupLabelProps, type MenuGroupLabelState, type MenuGroupProps, type MenuGroupState, type MenuItemDetails, type MenuItemProps, type MenuItemState, type MenuOpenChangeDetails, type MenuPopupProps, type MenuPopupState, type MenuRadioGroupProps, type MenuRadioGroupState, type MenuRadioItemProps, type MenuRadioItemState, type MenuRootProps, type MenuRootState, type MenuSeparatorProps, type MenuSeparatorState, type MenuSide, type MenuSubmenuTriggerProps, type MenuSubmenuTriggerState, type MenuTriggerProps, type MenuTriggerState, Meter, type MeterIndicatorProps, type MeterLabelProps, type MeterRegion, type MeterRootProps, type MeterState, type MeterTrackProps, type MeterValueProps, NumberField, type NumberFieldButtonState, type NumberFieldDecrementProps, type NumberFieldIncrementProps, type NumberFieldInputProps, type NumberFieldLabelProps, type NumberFieldRootProps, type NumberFieldState, type NumberFieldValueChangeDetails, Popover, type PopoverAlign, type PopoverCloseProps, type PopoverCloseState, type PopoverDescriptionProps, type PopoverDescriptionState, type PopoverOpenChangeDetails, type PopoverPopupProps, type PopoverPopupState, type PopoverRootProps, type PopoverRootState, type PopoverSide, type PopoverTitleProps, type PopoverTitleState, type PopoverTriggerProps, type PopoverTriggerState, Progress, type ProgressIndicatorProps, type ProgressLabelProps, type ProgressRootProps, type ProgressState, type ProgressTrackProps, type ProgressValueProps, RadioGroup, type RadioGroupItemProps, type RadioGroupItemState, type RadioGroupLabelProps, type RadioGroupRootProps, type RadioGroupRootState, type RadioGroupValueChangeDetails, type RenderProp, Select, type SelectGroupLabelProps, type SelectGroupProps, type SelectOptionProps, type SelectOptionState, type SelectRootProps, type SelectRootState, type SelectSeparatorProps, type SelectTriggerProps, type SelectValueChangeDetails, type SelectValueProps, Slider, type SliderIndicatorProps, type SliderIndicatorState, type SliderLabelProps, type SliderOrientation, type SliderRootProps, type SliderRootState, type SliderThumbProps, type SliderThumbState, type SliderTrackProps, type SliderTrackState, type SliderValue, type SliderValueChangeDetails, type SliderValueCommitDetails, type SliderValueProps, type SliderValueState, type StateValue, Switch, type SwitchCheckedChangeDetails, type SwitchProps, type SwitchState, Tabs, type TabsActivationMode, type TabsIndicatorProps, type TabsIndicatorState, type TabsListProps, type TabsListState, type TabsOrientation, type TabsPanelProps, type TabsPanelState, type TabsRootProps, type TabsRootState, type TabsTabProps, type TabsTabState, type TabsValueChangeDetails, Toast, type ToastActionDetails, type ToastActionOptions, type ToastActionProps, type ToastActionState, type ToastCloseDetails, type ToastCloseProps, type ToastCloseState, type ToastDescriptionProps, type ToastItem, type ToastManager, type ToastOptions, type ToastPriority, type ToastPromiseOptions, type ToastRootProps, type ToastRootState, type ToastTitleProps, type ToastViewportProps, type ToastViewportState, Toggle, ToggleGroup, type ToggleGroupExclusiveProps, type ToggleGroupItemProps, type ToggleGroupItemState, type ToggleGroupMultipleProps, type ToggleGroupOrientation, type ToggleGroupRootProps, type ToggleGroupRootState, type ToggleGroupValueChangeDetails, type TogglePressedChangeDetails, type ToggleProps, type ToggleState, Toolbar, type ToolbarButtonActionDetails, type ToolbarButtonProps, type ToolbarButtonState, type ToolbarOrientation, type ToolbarRootProps, type ToolbarRootState, type ToolbarSeparatorProps, type ToolbarSeparatorState, Tooltip, type TooltipAlign, type TooltipPopupProps, type TooltipPopupState, type TooltipProvides, type TooltipRootProps, type TooltipRootState, type TooltipSide, type TooltipTriggerProps, type TooltipTriggerState, type UrgentChangeAction, createToastManager, toast };

package/dist/index.mjs

@@ -1,4 +1,6 @@
 import { Toggle } from "./toggle/toggle.mjs";
+import { ToggleGroup } from "./toggle-group/index.mjs";
+import { Toolbar } from "./toolbar/index.mjs";
 import { Accordion } from "./accordion/index.mjs";
 import { Tabs } from "./tabs/index.mjs";
 import { Tooltip } from "./tooltip/index.mjs";
@@ -11,4 +13,12 @@ import { RadioGroup } from "./radio-group/index.mjs";
 import { CheckboxGroup } from "./checkbox-group/index.mjs";
 import { Select } from "./select/index.mjs";
 import { Combobox } from "./combobox/index.mjs";
-export { Accordion, Checkbox, CheckboxGroup, Combobox, Dialog, Menu, Popover, RadioGroup, Select, Switch, Tabs, Toggle, Tooltip };
+import { createToastManager, toast } from "./toast/toast.mjs";
+import { Toast } from "./toast/index.mjs";
+import { Slider } from "./slider/index.mjs";
+import { NumberField } from "./number-field/index.mjs";
+import { Field } from "./field/index.mjs";
+import { Form } from "./form/index.mjs";
+import { Progress } from "./progress/index.mjs";
+import { Meter } from "./meter/index.mjs";
+export { Accordion, Checkbox, CheckboxGroup, Combobox, Dialog, Field, Form, Menu, Meter, NumberField, Popover, Progress, RadioGroup, Select, Slider, Switch, Tabs, Toast, Toggle, ToggleGroup, Toolbar, Tooltip, createToastManager, toast };

package/dist/internal/announce.mjs

@@ -0,0 +1,53 @@
+"use client";
+//#region src/internal/announce.ts
+/** How long the fallback region keeps a message before it is cleared, so a repeat is spoken. */
+const ANNOUNCE_CLEAR_DELAY = 1e3;
+const REGION_STYLE = "position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap;";
+let region = null;
+let clearTimer;
+let writeTimer;
+function liveRegion(doc) {
+	if (region !== null && region.isConnected && region.ownerDocument === doc) return region;
+	const el = doc.createElement("div");
+	el.setAttribute("role", "status");
+	el.setAttribute("aria-live", "polite");
+	el.setAttribute("aria-atomic", "true");
+	el.setAttribute("data-fsui-announcer", "");
+	el.setAttribute("style", REGION_STYLE);
+	doc.body.append(el);
+	region = el;
+	return el;
+}
+/**
+* Speaks `message` in the context of `element`: `element.ariaNotify(message)` where it exists,
+* else the fallback live region (inserted on first use, cleared, then written
+* `ANNOUNCE_WRITE_DELAY` ms later and cleared again after `ANNOUNCE_CLEAR_DELAY`). An empty
+* message announces nothing; a newer message replaces one not yet written.
+*/
+function announce(element, message) {
+	if (message === "") return;
+	const notifying = element;
+	if (typeof notifying.ariaNotify === "function") {
+		notifying.ariaNotify(message);
+		return;
+	}
+	const doc = element.ownerDocument;
+	if (doc.body === null) return;
+	const el = liveRegion(doc);
+	el.textContent = "";
+	if (clearTimer !== void 0) clearTimeout(clearTimer);
+	if (writeTimer !== void 0) clearTimeout(writeTimer);
+	clearTimer = void 0;
+	writeTimer = setTimeout(() => {
+		writeTimer = void 0;
+		el.textContent = message;
+		clearTimer = setTimeout(() => {
+			clearTimer = void 0;
+			el.textContent = "";
+		}, ANNOUNCE_CLEAR_DELAY);
+	}, 100);
+}
+//#endregion
+export { ANNOUNCE_CLEAR_DELAY, announce };
+
+//# sourceMappingURL=announce.mjs.map

package/dist/internal/announce.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"announce.mjs","names":[],"sources":["../../src/internal/announce.ts"],"sourcesContent":["\"use client\";\n// Screen-reader announcements (design/components/number-field.md 8.3, conventions 8): through\n// `ariaNotify()` where the engine has it, otherwise through one module-level, visually hidden\n// `role=\"status\"` live region appended to `document.body` on first use. No part renders a live\n// region of its own for these announcements.\n\ntype NotifyingElement = Element & { ariaNotify?: (announcement: string) => void };\n\n/** How long the fallback region keeps a message before it is cleared, so a repeat is spoken. */\nexport const ANNOUNCE_CLEAR_DELAY = 1000;\n\nconst REGION_STYLE =\n  \"position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; \" +\n  \"overflow: hidden; clip-path: inset(50%); white-space: nowrap;\";\n\n/**\n * The delay between clearing the region and writing a message. A region inserted in the same task\n * as its first message is skipped by some screen readers, and an unchanged text is not spoken\n * again; clearing first and writing a tick later makes every message a fresh change.\n */\nexport const ANNOUNCE_WRITE_DELAY = 100;\n\nlet region: HTMLElement | null = null;\nlet clearTimer: ReturnType<typeof setTimeout> | undefined;\nlet writeTimer: ReturnType<typeof setTimeout> | undefined;\n\nfunction liveRegion(doc: Document): HTMLElement {\n  if (region !== null && region.isConnected && region.ownerDocument === doc) return region;\n  const el = doc.createElement(\"div\");\n  el.setAttribute(\"role\", \"status\");\n  el.setAttribute(\"aria-live\", \"polite\");\n  el.setAttribute(\"aria-atomic\", \"true\");\n  el.setAttribute(\"data-fsui-announcer\", \"\");\n  el.setAttribute(\"style\", REGION_STYLE);\n  doc.body.append(el);\n  region = el;\n  return el;\n}\n\n/**\n * Speaks `message` in the context of `element`: `element.ariaNotify(message)` where it exists,\n * else the fallback live region (inserted on first use, cleared, then written\n * `ANNOUNCE_WRITE_DELAY` ms later and cleared again after `ANNOUNCE_CLEAR_DELAY`). An empty\n * message announces nothing; a newer message replaces one not yet written.\n */\nexport function announce(element: Element, message: string): void {\n  if (message === \"\") return;\n  const notifying = element as NotifyingElement;\n  if (typeof notifying.ariaNotify === \"function\") {\n    notifying.ariaNotify(message);\n    return;\n  }\n  const doc = element.ownerDocument;\n  if (doc.body === null) return;\n  const el = liveRegion(doc);\n  el.textContent = \"\";\n  if (clearTimer !== undefined) clearTimeout(clearTimer);\n  if (writeTimer !== undefined) clearTimeout(writeTimer);\n  clearTimer = undefined;\n  writeTimer = setTimeout(() => {\n    writeTimer = undefined;\n    el.textContent = message;\n    clearTimer = setTimeout(() => {\n      clearTimer = undefined;\n      el.textContent = \"\";\n    }, ANNOUNCE_CLEAR_DELAY);\n  }, ANNOUNCE_WRITE_DELAY);\n}\n"],"mappings":";;;AASA,MAAa,uBAAuB;AAEpC,MAAM,eACJ;AAUF,IAAI,SAA6B;AACjC,IAAI;AACJ,IAAI;AAEJ,SAAS,WAAW,KAA4B;CAC9C,IAAI,WAAW,QAAQ,OAAO,eAAe,OAAO,kBAAkB,KAAK,OAAO;CAClF,MAAM,KAAK,IAAI,cAAc,KAAK;CAClC,GAAG,aAAa,QAAQ,QAAQ;CAChC,GAAG,aAAa,aAAa,QAAQ;CACrC,GAAG,aAAa,eAAe,MAAM;CACrC,GAAG,aAAa,uBAAuB,EAAE;CACzC,GAAG,aAAa,SAAS,YAAY;CACrC,IAAI,KAAK,OAAO,EAAE;CAClB,SAAS;CACT,OAAO;AACT;;;;;;;AAQA,SAAgB,SAAS,SAAkB,SAAuB;CAChE,IAAI,YAAY,IAAI;CACpB,MAAM,YAAY;CAClB,IAAI,OAAO,UAAU,eAAe,YAAY;EAC9C,UAAU,WAAW,OAAO;EAC5B;CACF;CACA,MAAM,MAAM,QAAQ;CACpB,IAAI,IAAI,SAAS,MAAM;CACvB,MAAM,KAAK,WAAW,GAAG;CACzB,GAAG,cAAc;CACjB,IAAI,eAAe,KAAA,GAAW,aAAa,UAAU;CACrD,IAAI,eAAe,KAAA,GAAW,aAAa,UAAU;CACrD,aAAa,KAAA;CACb,aAAa,iBAAiB;EAC5B,aAAa,KAAA;EACb,GAAG,cAAc;EACjB,aAAa,iBAAiB;GAC5B,aAAa,KAAA;GACb,GAAG,cAAc;EACnB,GAAG,oBAAoB;CACzB,GAAA,GAAuB;AACzB"}

package/dist/internal/content-focus-probe.mjs

@@ -0,0 +1,42 @@
+"use client";
+import { useCallback, useLayoutEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/internal/content-focus-probe.tsx
+/**
+* Records, from its layout-effect cleanup, whether focus is inside the popup when the content
+* goes away: React runs a deleted component's layout cleanups before it detaches the host nodes,
+* so `document.activeElement` still names the focused element there.
+*/
+function ContentFocusProbe({ onDetach, children }) {
+	useLayoutEffect(() => onDetach, [onDetach]);
+	return children;
+}
+/**
+* The content probe shared by the popover-like Popups (Popover, Menu) and Dialog.Popup: a
+* library-driven close with `transition` unmounts the content, the focused Close part included,
+* in the close commit, before the layout effect that hides the popup runs, so focus falls to
+* `<body>` and the platform may restore nothing. The probe tells the owner that this happened.
+*/
+function useContentFocusProbe(popupRef) {
+	const lostFocus = useRef(false);
+	const record = useCallback(() => {
+		const element = popupRef.current;
+		if (element === null) return;
+		const active = element.ownerDocument.activeElement;
+		if (active !== null && active !== element && element.contains(active)) lostFocus.current = true;
+	}, [popupRef]);
+	return {
+		wrapContent: useCallback((children) => /* @__PURE__ */ jsx(ContentFocusProbe, {
+			onDetach: record,
+			children
+		}), [record]),
+		hadFocus: useCallback(() => lostFocus.current, []),
+		forget: useCallback(() => {
+			lostFocus.current = false;
+		}, [])
+	};
+}
+//#endregion
+export { useContentFocusProbe };
+
+//# sourceMappingURL=content-focus-probe.mjs.map

package/dist/internal/content-focus-probe.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-focus-probe.mjs","names":[],"sources":["../../src/internal/content-focus-probe.tsx"],"sourcesContent":["\"use client\";\nimport { useCallback, useLayoutEffect, useRef } from \"react\";\nimport type { ReactNode, RefObject } from \"react\";\n\n/**\n * Records, from its layout-effect cleanup, whether focus is inside the popup when the content\n * goes away: React runs a deleted component's layout cleanups before it detaches the host nodes,\n * so `document.activeElement` still names the focused element there.\n */\nfunction ContentFocusProbe({\n  onDetach,\n  children,\n}: {\n  onDetach: () => void;\n  children?: ReactNode;\n}): ReactNode {\n  useLayoutEffect(() => onDetach, [onDetach]);\n  return children;\n}\n\nexport interface ContentFocusProbeHook {\n  /**\n   * Wraps the library-mode content of a top-layer popup: call it only while the content is\n   * shown (`visible ? wrapContent(x) : null`), or inside the `<Activity>` for `keepMounted`.\n   */\n  readonly wrapContent: (children: ReactNode) => ReactNode;\n  /**\n   * Whether the wrapped content unmounted (or was hidden by `<Activity>`) while it held focus\n   * since the last `forget()`. The owner reads it after its close\n   * (design/components/popover.md 6.2 rule 2, design/components/dialog.md 6.2 rule 2).\n   * Handlers and effects only.\n   */\n  readonly hadFocus: () => boolean;\n  /**\n   * Clear the record: on every open, after the owner used it, and whenever the content went\n   * away while the popup stays open (not a close).\n   */\n  readonly forget: () => void;\n}\n\n/**\n * The content probe shared by the popover-like Popups (Popover, Menu) and Dialog.Popup: a\n * library-driven close with `transition` unmounts the content, the focused Close part included,\n * in the close commit, before the layout effect that hides the popup runs, so focus falls to\n * `<body>` and the platform may restore nothing. The probe tells the owner that this happened.\n */\nexport function useContentFocusProbe(\n  popupRef: RefObject<HTMLElement | null>,\n): ContentFocusProbeHook {\n  const lostFocus = useRef(false);\n\n  const record = useCallback(() => {\n    const element = popupRef.current;\n    if (element === null) return;\n    const active = element.ownerDocument.activeElement;\n    if (active !== null && active !== element && element.contains(active)) {\n      lostFocus.current = true;\n    }\n  }, [popupRef]);\n\n  const wrapContent = useCallback(\n    (children: ReactNode): ReactNode => (\n      <ContentFocusProbe onDetach={record}>{children}</ContentFocusProbe>\n    ),\n    [record],\n  );\n  const hadFocus = useCallback(() => lostFocus.current, []);\n  const forget = useCallback(() => {\n    lostFocus.current = false;\n  }, []);\n\n  return { wrapContent, hadFocus, forget };\n}\n"],"mappings":";;;;;;;;;AASA,SAAS,kBAAkB,EACzB,UACA,YAIY;CACZ,sBAAsB,UAAU,CAAC,QAAQ,CAAC;CAC1C,OAAO;AACT;;;;;;;AA4BA,SAAgB,qBACd,UACuB;CACvB,MAAM,YAAY,OAAO,KAAK;CAE9B,MAAM,SAAS,kBAAkB;EAC/B,MAAM,UAAU,SAAS;EACzB,IAAI,YAAY,MAAM;EACtB,MAAM,SAAS,QAAQ,cAAc;EACrC,IAAI,WAAW,QAAQ,WAAW,WAAW,QAAQ,SAAS,MAAM,GAClE,UAAU,UAAU;CAExB,GAAG,CAAC,QAAQ,CAAC;CAab,OAAO;EAAE,aAXW,aACjB,aACC,oBAAC,mBAAD;GAAmB,UAAU;GAAS;EAA4B,CAAA,GAEpE,CAAC,MAAM,CAOU;EAAG,UALL,kBAAkB,UAAU,SAAS,CAAC,CAK1B;EAAG,QAJjB,kBAAkB;GAC/B,UAAU,UAAU;EACtB,GAAG,CAAC,CAEiC;CAAE;AACzC"}

package/dist/internal/decimal.mjs

@@ -0,0 +1,27 @@
+//#region src/internal/decimal.ts
+/** Number of decimal places of `n` as written (`0.1` → 1, `1e-7` → 7, `5` → 0). */
+function decimalsOf(n) {
+	if (!Number.isFinite(n)) return 0;
+	const text = String(n);
+	const exponent = /e-(\d+)$/i.exec(text);
+	if (exponent !== null) {
+		const mantissa = text.slice(0, exponent.index);
+		const dot = mantissa.indexOf(".");
+		return Number(exponent[1]) + (dot === -1 ? 0 : mantissa.length - dot - 1);
+	}
+	const dot = text.indexOf(".");
+	return dot === -1 ? 0 : text.length - dot - 1;
+}
+/**
+* `value` rounded to `decimals` places through `toFixed` (decimal, not binary, rounding of the
+* written digits: `roundTo(0.1 + 0.2, 1)` is `0.3`). `-0` becomes `0`.
+*/
+function roundTo(value, decimals) {
+	if (!Number.isFinite(value)) return value;
+	const result = decimals <= 0 ? Math.round(value) : Number(value.toFixed(Math.min(decimals, 100)));
+	return result === 0 ? 0 : result;
+}
+//#endregion
+export { decimalsOf, roundTo };
+
+//# sourceMappingURL=decimal.mjs.map

package/dist/internal/decimal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"decimal.mjs","names":[],"sources":["../../src/internal/decimal.ts"],"sourcesContent":["// Decimal helpers shared by Slider and NumberField (design/components/number-field.md 5.4). No\n// directive: no React, no client-only API.\n\n/** Number of decimal places of `n` as written (`0.1` → 1, `1e-7` → 7, `5` → 0). */\nexport function decimalsOf(n: number): number {\n  if (!Number.isFinite(n)) return 0;\n  const text = String(n);\n  const exponent = /e-(\\d+)$/i.exec(text);\n  if (exponent !== null) {\n    const mantissa = text.slice(0, exponent.index);\n    const dot = mantissa.indexOf(\".\");\n    return Number(exponent[1]) + (dot === -1 ? 0 : mantissa.length - dot - 1);\n  }\n  const dot = text.indexOf(\".\");\n  return dot === -1 ? 0 : text.length - dot - 1;\n}\n\n/**\n * `value` rounded to `decimals` places through `toFixed` (decimal, not binary, rounding of the\n * written digits: `roundTo(0.1 + 0.2, 1)` is `0.3`). `-0` becomes `0`.\n */\nexport function roundTo(value: number, decimals: number): number {\n  if (!Number.isFinite(value)) return value;\n  // `toFixed` takes at most 100 digits; anything near that is already exact.\n  const result = decimals <= 0 ? Math.round(value) : Number(value.toFixed(Math.min(decimals, 100)));\n  return result === 0 ? 0 : result;\n}\n"],"mappings":";;AAIA,SAAgB,WAAW,GAAmB;CAC5C,IAAI,CAAC,OAAO,SAAS,CAAC,GAAG,OAAO;CAChC,MAAM,OAAO,OAAO,CAAC;CACrB,MAAM,WAAW,YAAY,KAAK,IAAI;CACtC,IAAI,aAAa,MAAM;EACrB,MAAM,WAAW,KAAK,MAAM,GAAG,SAAS,KAAK;EAC7C,MAAM,MAAM,SAAS,QAAQ,GAAG;EAChC,OAAO,OAAO,SAAS,EAAE,KAAK,QAAQ,KAAK,IAAI,SAAS,SAAS,MAAM;CACzE;CACA,MAAM,MAAM,KAAK,QAAQ,GAAG;CAC5B,OAAO,QAAQ,KAAK,IAAI,KAAK,SAAS,MAAM;AAC9C;;;;;AAMA,SAAgB,QAAQ,OAAe,UAA0B;CAC/D,IAAI,CAAC,OAAO,SAAS,KAAK,GAAG,OAAO;CAEpC,MAAM,SAAS,YAAY,IAAI,KAAK,MAAM,KAAK,IAAI,OAAO,MAAM,QAAQ,KAAK,IAAI,UAAU,GAAG,CAAC,CAAC;CAChG,OAAO,WAAW,IAAI,IAAI;AAC5B"}

package/dist/internal/dev-warn.mjs

@@ -0,0 +1,17 @@
+//#region src/internal/dev-warn.ts
+const isDev = process.env.NODE_ENV !== "production";
+const seen = /* @__PURE__ */ new Set();
+/**
+* Logs `message` through `console.error` once per `key` in development. Called during render,
+* so a discarded render may warn; keys name the part and the condition (a Server Component has
+* no element identity to key on).
+*/
+function warnOnce(key, message) {
+	if (!isDev || seen.has(key)) return;
+	seen.add(key);
+	console.error(message);
+}
+//#endregion
+export { warnOnce };
+
+//# sourceMappingURL=dev-warn.mjs.map

package/dist/internal/dev-warn.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev-warn.mjs","names":[],"sources":["../../src/internal/dev-warn.ts"],"sourcesContent":["// No \"use client\": usable during the render of a directive-free part that may run as a Server\n// Component, where an effect (`useDevWarning`) never runs (design/components/progress.md 8.1,\n// implementation note 14.3).\n\nconst isDev = process.env.NODE_ENV !== \"production\";\n\nconst seen = new Set<string>();\n\n/**\n * Logs `message` through `console.error` once per `key` in development. Called during render,\n * so a discarded render may warn; keys name the part and the condition (a Server Component has\n * no element identity to key on).\n */\nexport function warnOnce(key: string, message: string): void {\n  if (!isDev || seen.has(key)) return;\n  seen.add(key);\n  console.error(message);\n}\n\n/** Tests only: forget every key, so the next `warnOnce` warns again. */\nexport function resetWarnOnce(): void {\n  seen.clear();\n}\n"],"mappings":";AAIA,MAAM,QAAQ,QAAQ,IAAI,aAAa;AAEvC,MAAM,uBAAO,IAAI,IAAY;;;;;;AAO7B,SAAgB,SAAS,KAAa,SAAuB;CAC3D,IAAI,CAAC,SAAS,KAAK,IAAI,GAAG,GAAG;CAC7B,KAAK,IAAI,GAAG;CACZ,QAAQ,MAAM,OAAO;AACvB"}

package/dist/internal/field-context.d.mts

@@ -0,0 +1,19 @@
+import { FieldValidity } from "./validity.mjs";
+//#region src/internal/field-context.d.ts
+/** The state every Field part receives (design/components/field-form.md 4.1). */
+export interface FieldState {
+  /** An error is shown: the control matches `:user-invalid`, or a server error for this field is shown. */
+  readonly invalid: boolean;
+  /** The messages shown: `[validationMessage]` for a native constraint, the strings `validate` returned for a custom one, the server's strings for a server error; `[]` while valid. */
+  readonly messages: readonly string[];
+  /** A snapshot of the control's `ValidityState` (all valid on the server and before the first read). */
+  readonly validity: FieldValidity;
+  /** `Field.Root disabled` or the control's own `disabled`. */
+  readonly disabled: boolean;
+  /** `Field.Root required` or the control's own `required`. */
+  readonly required: boolean;
+  /** The enclosing form's submission is in flight (`useFormStatus().pending`); `false` outside a form. */
+  readonly pending: boolean;
+}
+//#endregion
+//# sourceMappingURL=field-context.d.mts.map

package/dist/internal/field-context.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-context.d.mts","names":[],"sources":["../../src/internal/field-context.ts"],"mappings":";;;iBAKiB;;WAEN;;WAEA;;WAEA,UAAU;;WAEV;;WAEA;;WAEA"}

package/dist/internal/field-context.mjs

@@ -0,0 +1,14 @@
+"use client";
+import { createContext, use } from "react";
+//#region src/internal/field-context.ts
+const FieldContext = createContext(null);
+function useFieldContext(part) {
+	const ctx = use(FieldContext);
+	if (ctx === null) throw new Error(`${part} must be rendered inside a Field.Root.`);
+	return ctx;
+}
+const FormContext = createContext(null);
+//#endregion
+export { FieldContext, FormContext, useFieldContext };
+
+//# sourceMappingURL=field-context.mjs.map

package/dist/internal/field-context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-context.mjs","names":[],"sources":["../../src/internal/field-context.ts"],"sourcesContent":["\"use client\";\nimport { createContext, use } from \"react\";\nimport type { FieldValidity, FormErrors, ValidatableElement } from \"./validity.js\";\n\n/** The state every Field part receives (design/components/field-form.md 4.1). */\nexport interface FieldState {\n  /** An error is shown: the control matches `:user-invalid`, or a server error for this field is shown. */\n  readonly invalid: boolean;\n  /** The messages shown: `[validationMessage]` for a native constraint, the strings `validate` returned for a custom one, the server's strings for a server error; `[]` while valid. */\n  readonly messages: readonly string[];\n  /** A snapshot of the control's `ValidityState` (all valid on the server and before the first read). */\n  readonly validity: FieldValidity;\n  /** `Field.Root disabled` or the control's own `disabled`. */\n  readonly disabled: boolean;\n  /** `Field.Root required` or the control's own `required`. */\n  readonly required: boolean;\n  /** The enclosing form's submission is in flight (`useFormStatus().pending`); `false` outside a form. */\n  readonly pending: boolean;\n}\n\nexport interface FieldIds {\n  readonly control: string;\n  readonly label: string;\n  readonly description: string;\n  readonly error: string;\n}\n\n/** What a control reports to its Field (design 7.1). */\nexport interface FieldControlRegistration {\n  /** The element the Field labels, describes and listens to (the input, or a group's fieldset). */\n  readonly element: HTMLElement;\n  /** `<label for>` can target it. Groups report `false`. */\n  readonly labelable: boolean;\n  /** The control's own `required` / `disabled` props (for the Field's `data-*` state). */\n  readonly required: boolean;\n  readonly disabled: boolean;\n  /**\n   * Where `validity`, `validationMessage` and the custom-validity slot are read and written when\n   * that is not the registered element (NumberField: the hidden `input[type=number]` after the\n   * visible text input). `:user-invalid`, the listeners and the focus target stay on `element`;\n   * after writing the slot the Field mirrors this element's `validationMessage` into `element`\n   * (design/components/field-form.md, amendment `validityElement`). Resolved on every read.\n   */\n  readonly validityElement?: (() => ValidatableElement | null) | undefined;\n}\n\nexport interface FieldContextValue {\n  readonly ids: FieldIds;\n  /** `Field.Root name`. */\n  readonly name: string | undefined;\n  /** `Field.Root disabled` / `required` (the props, not the merged state). */\n  readonly disabled: boolean;\n  readonly required: boolean;\n  readonly state: FieldState;\n  /** The registered control is labelable (default `true`, also before any registration). */\n  readonly labelable: boolean;\n  /** Registers the Field's control; returns the unregister function. The first one wins. */\n  readonly registerControl: (registration: FieldControlRegistration) => () => void;\n  /** A `Field.Error` is mounted (the Field may cancel the platform bubble). */\n  readonly registerError: () => () => void;\n  /**\n   * The control's value changed in the DOM without an `input` / `change` event the Field could\n   * hear (a Combobox selection, a CheckboxGroup's derived `required`, a rolled-back optimistic\n   * value): re-reads the slot and the mirror after the commit that wrote it, and refreshes the\n   * other Fields of the `Form.Root` (cross-field rules). `edit`: the user made the change, so a\n   * shown server error is dismissed as by an `input` event. Call from a layout effect.\n   */\n  readonly notifyChange: (edit: boolean) => void;\n}\n\nexport const FieldContext = createContext<FieldContextValue | null>(null);\n\nexport function useFieldContext(part: string): FieldContextValue {\n  const ctx = use(FieldContext);\n  if (ctx === null) throw new Error(`${part} must be rendered inside a Field.Root.`);\n  return ctx;\n}\n\n/** What a Field registers with its Form (design 3.5). */\nexport interface FormFieldRegistration {\n  /** The control, or a group's first enabled (or checked) member. */\n  readonly getFocusTarget: () => HTMLElement | null;\n  /** The Field shows a server error at the latest commit. */\n  readonly showsServerError: () => boolean;\n  /** The server messages shown, for an announcement when focus does not move. */\n  readonly serverMessages: () => readonly string[];\n  /** Re-runs `validate` and re-reads validity (another Field's control changed). */\n  readonly refresh: () => void;\n}\n\nexport interface FormContextValue {\n  readonly errors: FormErrors | undefined;\n  readonly registerField: (registration: FormFieldRegistration) => () => void;\n  /**\n   * The `FormData` of the submission in flight when the Form ran it itself (the intercepted path),\n   * else `null`: the stale-value suppression of design 3.2 item 2 is computed against it.\n   */\n  readonly submittedData: () => FormData | null;\n  /** Refreshes every registered Field except `source` (a change no DOM event carried). */\n  readonly refreshFields: (source: FormFieldRegistration | null) => void;\n}\n\nexport const FormContext = createContext<FormContextValue | null>(null);\n"],"mappings":";;;AAsEA,MAAa,eAAe,cAAwC,IAAI;AAExE,SAAgB,gBAAgB,MAAiC;CAC/D,MAAM,MAAM,IAAI,YAAY;CAC5B,IAAI,QAAQ,MAAM,MAAM,IAAI,MAAM,GAAG,KAAK,uCAAuC;CACjF,OAAO;AACT;AA0BA,MAAa,cAAc,cAAuC,IAAI"}

package/dist/internal/focus-first-invalid.mjs

@@ -0,0 +1,67 @@
+import { sortByDocumentOrder } from "./validity.mjs";
+//#region src/internal/focus-first-invalid.ts
+/**
+* Speaks `message` through `element.ariaNotify()` where the browser has it (design 5.3: the
+* error is read when focus moves to the control; when focus is already there nothing would be
+* read). Does nothing without `ariaNotify` or with an empty message.
+*/
+function announce(element, message) {
+	const notifying = element;
+	if (message === "" || typeof notifying.ariaNotify !== "function") return;
+	notifying.ariaNotify(message);
+}
+/** The submission attempt in progress: every target added during the current task. */
+let batch = null;
+/**
+* Adds a control whose `invalid` event a Field cancelled during a submission attempt, and
+* focuses the first collected control in document order in a microtask, so the result does not
+* depend on the browser's dispatch order or on how many forms are on the page.
+*
+* The batch lives until the end of the task (a `setTimeout`), not just one microtask: when the
+* browser dispatches the `invalid` events itself (a click on a submit button), it runs a
+* microtask checkpoint after each listener, so the microtask of the first event runs before the
+* second event fires. Every add therefore queues a focus of the batch's first target; later ones
+* re-focus the same element, which is a no-op.
+*
+* Skips the focus when focus moved during the attempt to an element that is not one of the
+* collected targets: a plain `<input required>` with no Field kept the platform's behaviour
+* (bubble and focus), and the library does not fight it.
+*/
+function collectInvalid(target, message = "") {
+	if (target === null) return;
+	if (batch === null) {
+		batch = {
+			targets: [],
+			messages: /* @__PURE__ */ new Map(),
+			activeBefore: target.ownerDocument.activeElement,
+			moved: false,
+			announced: null
+		};
+		setTimeout(() => {
+			batch = null;
+		}, 0);
+	}
+	const current = batch;
+	if (!current.targets.includes(target)) current.targets.push(target);
+	current.messages.set(target, message);
+	queueMicrotask(() => focusFirst(current));
+}
+function focusFirst(current) {
+	const { targets, activeBefore } = current;
+	const connected = targets.filter((t) => t.isConnected);
+	if (connected.length === 0) return;
+	const active = connected[0].ownerDocument.activeElement;
+	if (active !== activeBefore && active !== null && !connected.includes(active)) return;
+	const first = sortByDocumentOrder(connected, (t) => t)[0];
+	if (active !== first) {
+		current.moved = true;
+		first.focus();
+	} else if (!current.moved && current.announced !== first) {
+		current.announced = first;
+		announce(first, current.messages.get(first) ?? "");
+	}
+}
+//#endregion
+export { announce, collectInvalid };
+
+//# sourceMappingURL=focus-first-invalid.mjs.map

package/dist/internal/focus-first-invalid.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus-first-invalid.mjs","names":[],"sources":["../../src/internal/focus-first-invalid.ts"],"sourcesContent":["// Directive-free: the module-level first-invalid collector (design/components/field-form.md 2.5).\nimport { sortByDocumentOrder } from \"./validity.js\";\n\ninterface Batch {\n  readonly targets: HTMLElement[];\n  /** The message each target's Field shows, for the announcement when focus does not move. */\n  readonly messages: Map<HTMLElement, string>;\n  /** `document.activeElement` when the first target arrived. */\n  readonly activeBefore: Element | null;\n  /** The batch moved focus (later microtasks then re-focus, never announce). */\n  moved: boolean;\n  /** The target already announced. */\n  announced: HTMLElement | null;\n}\n\ntype NotifyingElement = HTMLElement & { ariaNotify?: (announcement: string) => void };\n\n/**\n * Speaks `message` through `element.ariaNotify()` where the browser has it (design 5.3: the\n * error is read when focus moves to the control; when focus is already there nothing would be\n * read). Does nothing without `ariaNotify` or with an empty message.\n */\nexport function announce(element: HTMLElement, message: string): void {\n  const notifying = element as NotifyingElement;\n  if (message === \"\" || typeof notifying.ariaNotify !== \"function\") return;\n  notifying.ariaNotify(message);\n}\n\n/** The submission attempt in progress: every target added during the current task. */\nlet batch: Batch | null = null;\n\n/**\n * Adds a control whose `invalid` event a Field cancelled during a submission attempt, and\n * focuses the first collected control in document order in a microtask, so the result does not\n * depend on the browser's dispatch order or on how many forms are on the page.\n *\n * The batch lives until the end of the task (a `setTimeout`), not just one microtask: when the\n * browser dispatches the `invalid` events itself (a click on a submit button), it runs a\n * microtask checkpoint after each listener, so the microtask of the first event runs before the\n * second event fires. Every add therefore queues a focus of the batch's first target; later ones\n * re-focus the same element, which is a no-op.\n *\n * Skips the focus when focus moved during the attempt to an element that is not one of the\n * collected targets: a plain `<input required>` with no Field kept the platform's behaviour\n * (bubble and focus), and the library does not fight it.\n */\nexport function collectInvalid(target: HTMLElement | null, message = \"\"): void {\n  if (target === null) return;\n  if (batch === null) {\n    batch = {\n      targets: [],\n      messages: new Map(),\n      activeBefore: target.ownerDocument.activeElement,\n      moved: false,\n      announced: null,\n    };\n    setTimeout(() => {\n      batch = null;\n    }, 0);\n  }\n  const current = batch;\n  if (!current.targets.includes(target)) current.targets.push(target);\n  current.messages.set(target, message);\n  queueMicrotask(() => focusFirst(current));\n}\n\nfunction focusFirst(current: Batch): void {\n  const { targets, activeBefore } = current;\n  const connected = targets.filter((t) => t.isConnected);\n  if (connected.length === 0) return;\n  const active = connected[0]!.ownerDocument.activeElement;\n  if (active !== activeBefore && active !== null && !connected.includes(active as HTMLElement)) {\n    return;\n  }\n  const first = sortByDocumentOrder(connected, (t) => t)[0]!;\n  if (active !== first) {\n    current.moved = true;\n    first.focus();\n  } else if (!current.moved && current.announced !== first) {\n    // Focus was already on the first invalid control (an implicit submission with Enter): the\n    // cancelled bubble was the only announcement, so speak the message instead.\n    current.announced = first;\n    announce(first, current.messages.get(first) ?? \"\");\n  }\n}\n"],"mappings":";;;;;;;AAsBA,SAAgB,SAAS,SAAsB,SAAuB;CACpE,MAAM,YAAY;CAClB,IAAI,YAAY,MAAM,OAAO,UAAU,eAAe,YAAY;CAClE,UAAU,WAAW,OAAO;AAC9B;;AAGA,IAAI,QAAsB;;;;;;;;;;;;;;;;AAiB1B,SAAgB,eAAe,QAA4B,UAAU,IAAU;CAC7E,IAAI,WAAW,MAAM;CACrB,IAAI,UAAU,MAAM;EAClB,QAAQ;GACN,SAAS,CAAC;GACV,0BAAU,IAAI,IAAI;GAClB,cAAc,OAAO,cAAc;GACnC,OAAO;GACP,WAAW;EACb;EACA,iBAAiB;GACf,QAAQ;EACV,GAAG,CAAC;CACN;CACA,MAAM,UAAU;CAChB,IAAI,CAAC,QAAQ,QAAQ,SAAS,MAAM,GAAG,QAAQ,QAAQ,KAAK,MAAM;CAClE,QAAQ,SAAS,IAAI,QAAQ,OAAO;CACpC,qBAAqB,WAAW,OAAO,CAAC;AAC1C;AAEA,SAAS,WAAW,SAAsB;CACxC,MAAM,EAAE,SAAS,iBAAiB;CAClC,MAAM,YAAY,QAAQ,QAAQ,MAAM,EAAE,WAAW;CACrD,IAAI,UAAU,WAAW,GAAG;CAC5B,MAAM,SAAS,UAAU,EAAE,CAAE,cAAc;CAC3C,IAAI,WAAW,gBAAgB,WAAW,QAAQ,CAAC,UAAU,SAAS,MAAqB,GACzF;CAEF,MAAM,QAAQ,oBAAoB,YAAY,MAAM,CAAC,CAAC,CAAC;CACvD,IAAI,WAAW,OAAO;EACpB,QAAQ,QAAQ;EAChB,MAAM,MAAM;CACd,OAAO,IAAI,CAAC,QAAQ,SAAS,QAAQ,cAAc,OAAO;EAGxD,QAAQ,YAAY;EACpB,SAAS,OAAO,QAAQ,SAAS,IAAI,KAAK,KAAK,EAAE;CACnD;AACF"}

package/dist/internal/form-status-watcher.mjs

@@ -0,0 +1,31 @@
+"use client";
+import { useEffect, useRef } from "react";
+import { useFormStatus } from "react-dom";
+//#region src/internal/form-status-watcher.tsx
+/**
+* Observes React's form channel (Dialog design 8.1, Field/Form design 3.2): rendered inside a
+* `<form>`, `useFormStatus().pending` covers the action's whole transition, including the
+* Suspense wait of what it re-renders. On `true → false` the submission settled without throwing
+* (a rejection unmounts the form through the nearest Error Boundary, so the edge is never seen).
+* Used by `Dialog.Form` and `Form.Root`.
+*/
+function FormStatusWatcher({ onPendingChange, onSettled }) {
+	const { pending } = useFormStatus();
+	const previous = useRef(false);
+	useEffect(() => {
+		const was = previous.current;
+		previous.current = pending;
+		if (was === pending) return;
+		onPendingChange(pending);
+		if (was && !pending) onSettled();
+	}, [
+		pending,
+		onPendingChange,
+		onSettled
+	]);
+	return null;
+}
+//#endregion
+export { FormStatusWatcher };
+
+//# sourceMappingURL=form-status-watcher.mjs.map