@ai-matrx/design-system 0.86.355 → 0.86.357

package/dist/swipe-deck.css

@@ -67,6 +67,8 @@
 @media (pointer: coarse) {
   .matrx-sd[data-layout="inline"] { height: var(--sd-inline-height, clamp(400px, 58dvh, 540px)); }
 }
+/* A full deck takes focus back after an answer (keys keep working); it draws no ring for it. */
+.matrx-sd:not([data-layout="inline"]):focus { outline: none; }
 .matrx-sd[data-layout="inline"]:focus-visible { outline: 2px solid var(--sd-sel); outline-offset: 2px; }
 .matrx-sd[data-layout="inline"] .matrx-sd-frame { padding: 12px 10px 10px; }
 .matrx-sd[data-layout="inline"] .matrx-sd-progress { left: 12px; right: 12px; top: 5px; }

package/dist/swipe-deck.js

@@ -1,7 +1,8 @@
 "use client";
 import {
   ErrorBox
-} from "./chunk-LJKF267O.js";
+} from "./chunk-5Z5GTXKL.js";
+import "./chunk-HS6GMHKZ.js";
 import {
   Input
 } from "./chunk-TDMVH77G.js";
@@ -1709,6 +1710,15 @@ function SwipeDeck(props) {
     view.addEventListener("keydown", onKey);
     return () => view.removeEventListener("keydown", onKey);
   }, [keyboard, layout]);
+  const cardId = cardItem?.id ?? null;
+  React4.useEffect(() => {
+    if (!keyboard || layout === "inline" || cardId === null) return;
+    const root = rootRef.current;
+    const active = root?.ownerDocument.activeElement;
+    if (!root || active && root.contains(active)) return;
+    if (active?.closest("input, textarea, select, [contenteditable='true'], [role='dialog'], [role='alertdialog'], [role='menu'], [role='listbox']")) return;
+    root.focus({ preventScroll: true });
+  }, [cardId, keyboard, layout]);
   const fingerRef = React4.useRef(null);
   const ringRef = React4.useRef(null);
   const capRef = React4.useRef(null);
@@ -1877,7 +1887,7 @@ function SwipeDeck(props) {
           const root = e.currentTarget;
           if (!root.contains(root.ownerDocument.activeElement)) root.focus({ preventScroll: true });
         }
-      } : {},
+      } : { tabIndex: -1 },
       children: [
         /* @__PURE__ */ jsx3("div", { className: "matrx-sd-progress", "aria-hidden": "true", children: progress.map((s, k) => {
           const tone = k === stepIndex ? "current" : s.kind === "card" ? findAnswer(rules, s.item, state.answers[s.item.id])?.tone : s.kind === "pick" && state.picks[s.group] ? "primary" : void 0;