@jirawatpyk/aura-tokens 5.7.2 → 5.7.3

package/aura-tailwind.css

@@ -1,4 +1,4 @@
-/* AURA v5.7.2 — Tailwind v4 theme. GENERATED by scripts/build-tokens.mts from tokens.json. Do not edit by hand.
+/* AURA v5.7.3 — Tailwind v4 theme. GENERATED by scripts/build-tokens.mts from tokens.json. Do not edit by hand.
  *   @import "tailwindcss";
  *   @import "@jirawatpyk/aura-tokens/tailwind.css";
  * Gives bg-bg-surface, text-fg-primary, border-border-strong, p-aura-6, rounded-aura-xl, shadow-aura-overlay,

package/aura-tailwind.prefixed.css

@@ -1,4 +1,4 @@
-/* AURA v5.7.2 — Tailwind v4 theme with aura- prefixed names. GENERATED by scripts/build-tokens.mts. Do not edit by hand.
+/* AURA v5.7.3 — Tailwind v4 theme with aura- prefixed names. GENERATED by scripts/build-tokens.mts. Do not edit by hand.
  * For apps that already have a Tailwind theme (shadcn): nothing here redefines an existing name.
  *   @layer aura-tokens, theme, base, aura, components, utilities;
  *   @import "tailwindcss";

package/aura.css

@@ -1,4 +1,4 @@
-/* AURA v5.7.2 — GENERATED by scripts/build-tokens.mts from tokens.json. Do not edit by hand. */
+/* AURA v5.7.3 — GENERATED by scripts/build-tokens.mts from tokens.json. Do not edit by hand. */
 /* Fonts: load aura-fonts.css (or the <link> tags in README) separately, so a blocked Google Fonts never breaks this file. */
 
 :root, [data-theme="light"] {

package/components/aura.bundle.js

@@ -3394,14 +3394,50 @@ window.Aura = (() => {
       const auto = uid(), id = props.id || auto;
       const list = items(props.errors);
       const box = React21.useRef(null);
+      const keyed = props.focusKey !== void 0;
+      const lastKey = React21.useRef(null), armed = React21.useRef(false), hadErrors = React21.useRef(false);
+      const has = list.length > 0;
       React21.useEffect(
         function() {
-          const has = list.length > 0;
-          if (has && box.current) box.current.focus();
+          const appeared = has && !hadErrors.current;
+          hadErrors.current = has;
+          if (!keyed) {
+            lastKey.current = null;
+            if (appeared && box.current) box.current.focus();
+            return;
+          }
+          if (!lastKey.current) {
+            lastKey.current = { v: props.focusKey };
+            armed.current = has;
+          } else if (!Object.is(lastKey.current.v, props.focusKey)) {
+            lastKey.current = { v: props.focusKey };
+            armed.current = true;
+          }
+          if (armed.current && has && box.current) {
+            armed.current = false;
+            box.current.focus();
+          }
         },
-        /* focus when errors first appear, and again whenever focusKey changes (each submit) */
         // eslint-disable-next-line react-hooks/exhaustive-deps
-        [list.length > 0, props.focusKey]
+        [has, props.focusKey, keyed]
+      );
+      React21.useEffect(
+        function() {
+          if (!keyed) return;
+          function disarm() {
+            armed.current = false;
+          }
+          const events = ["input", "change", "keydown", "pointerdown"];
+          events.forEach(function(n2) {
+            document.addEventListener(n2, disarm, true);
+          });
+          return function() {
+            events.forEach(function(n2) {
+              document.removeEventListener(n2, disarm, true);
+            });
+          };
+        },
+        [keyed]
       );
       if (!list.length) return null;
       return /* @__PURE__ */ React21.createElement(

package/components/index.d.ts

@@ -355,7 +355,10 @@ export interface FormErrorSummaryProps {
 	title?: React$1.ReactNode | undefined;
 	/** Called with the field when a link is followed, e.g. react-hook-form's `setFocus`. Default: focus the element whose id (or name) is the field. */
 	onSelect?: ((field: string) => void) | undefined;
-	/** Change it on every submit (e.g. `formState.submitCount`) to move focus to the summary again. It also takes focus when errors first appear. */
+	/** Change it on every submit (e.g. `formState.submitCount`). With it, the summary takes focus only after a submit —
+	 * never while someone types and live errors come and go (5.7.3). Without it, it takes focus whenever errors
+	 * first appear; with react-hook-form's live `errors`, always pass `focusKey={formState.submitCount}` (a primitive, not a new object
+	 * each render) and `useForm({ shouldFocusError: false })`, so RHF doesn't move focus to the field first. */
 	focusKey?: unknown;
 	className?: string | undefined;
 	id?: string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jirawatpyk/aura-tokens",
-  "version": "5.7.2",
+  "version": "5.7.3",
   "description": "AURA Design System — tokens (CSS variables, Tailwind preset, Figma variables), theme contrast checks and token lint.",
   "main": "tailwind.tokens.cjs",
   "types": "components/index.d.ts",

package/tokens.json

@@ -1,5 +1,5 @@
 {
-  "version": "5.7.2",
+  "version": "5.7.3",
   "meta": {
     "name": "AURA Design System",
     "tier": "3-tier",