@ai-matrx/design-system 0.20.22 → 0.21.0

package/CHANGELOG.md

@@ -1,10 +1,37 @@
 # Changelog
 
-## 0.20.22
-
-Automatic changed-only republish (docs/metadata drift since the last tag — see
-`git diff npm/design-system/v0.20.21..npm/design-system/v0.20.22 -- apps/shared/design-system`).
-No source changes intended and no consumer action required.
+## 0.21.0
+
+**The Button touch floor.** Every rung of the size scale below `xl` was shorter
+than the 44px platform touch target (`xs` 24, `icon-sm` 28, `sm` 32, `roundIcon`
+32, `default`/`md` 36, `icon` 36, `lg` 40). Measured live at 390x844 on a
+consumer route, ALL SEVEN design-system Buttons in the viewport were under the
+floor — four at 32px, two at 28px.
+
+`Button` now stamps `data-tap-floor` on those rungs (and
+`data-tap-floor-square` on the icon boxes), and `styles.css` lifts them to
+2.75rem under `@media (pointer: coarse)` ONLY — deliberately without the
+`(max-width: 1023px)` half the dialog-footer floor carries, because a narrow
+desktop window is a small viewport, not a finger. **Desktop density is
+unchanged.**
+
+The floor covers every sub-44 rung rather than `sm` alone because lifting one
+rung inverts the scale: `sm` (32) would render taller on a phone than `default`
+(36) and `lg` (40). It grows the control (`min-height`/`min-width`) instead of
+laying an invisible 44px ring over a 32px pill — on a toolbar of adjacent `sm`
+buttons the rings overlap in the gap and one button eats taps aimed at its
+neighbour, which is unacceptable where a neighbour is destructive.
+
+`min-width` is raised only on the square rungs, so text labels are not
+stretched. Opt out per control with `data-touch-exempt`.
+
+Guard: `src/button.test.tsx` § "Button touch floor" derives each rung's height
+from `buttonVariants` itself — a new short rung fails without being listed —
+and pins the no-inversion ordering. Proven red with the attribute removed.
+
+**Consumer action:** none required. Expect touch-device layouts to grow where
+small buttons sit in fixed-height rows; a control that is genuinely not a finger
+target takes `data-touch-exempt` with a reason at the call site.
 
 ## 0.20.21
 

package/dist/content-transfer.cjs

@@ -120,13 +120,28 @@ var buttonVariants = (0, import_class_variance_authority.cva)(
     }
   }
 );
+var TOUCH_FLOOR_SIZES = /* @__PURE__ */ new Set([
+  "xs",
+  "sm",
+  "default",
+  "md",
+  "lg",
+  "icon",
+  "icon-sm",
+  "roundIcon"
+]);
+var SQUARE_SIZES = /* @__PURE__ */ new Set(["icon", "icon-sm", "roundIcon"]);
 var Button = React.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Component = asChild ? import_react_slot.Slot : "button";
+    const resolvedSize = size ?? "default";
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       Component,
       {
         className: cn(buttonVariants({ variant, size, className })),
+        "data-matrx-button": "",
+        "data-tap-floor": TOUCH_FLOOR_SIZES.has(resolvedSize) ? "" : void 0,
+        "data-tap-floor-square": SQUARE_SIZES.has(resolvedSize) ? "" : void 0,
         ref,
         ...props
       }