laif-ds 1.0.2 → 1.0.4

package/dist/CHANGELOG.md

@@ -5,6 +5,19 @@ All notable technical changes to the laif-ds core will be documented in this fil
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [laif-ds@1.0.4]
+
+### 🐛 Fixed
+
+- **Button**: Disabled buttons no longer show hover colours, the press squash or the loading shimmer, keep the `not-allowed` cursor, and are removed from the tab order. With `asChild`, `disabled` is no longer forwarded to the slotted element (invalid on e.g. an `<a>`) — it now gets `aria-disabled`, `data-disabled` and `tabIndex={-1}`, and its click is blocked
+
+## [laif-ds@1.0.3]
+
+### 🚀 Added
+
+- **Confirmer**: Below 768px, the confirm now opens as a bottom drawer instead of a centered dialog — no prop needed, the mode is decided when the confirm opens and held for its lifetime. Buttons are full-width 44px touch targets (action on top, Cancel at the bottom), initial focus lands on Cancel, and the drawer keeps `role="alertdialog"`. A drag down or Esc rejects the confirm's promise; tapping the overlay does nothing, matching desktop
+- **use-mobile**: Exports `MOBILE_BREAKPOINT` so consumers can read the same 768px threshold used internally
+
 ## [laif-ds@1.0.2]
 
 ### 🐛 Fixed

package/dist/_virtual/index6.js

@@ -1,5 +1,5 @@
 "use client";
-var e = {};
+var e = { exports: {} };
 export {
-  e as __exports
+  e as __module
 };

package/dist/_virtual/index7.js

@@ -1,5 +1,5 @@
 "use client";
-var e = { exports: {} };
+var e = {};
 export {
-  e as __module
+  e as __exports
 };

package/dist/agent-docs/adoption-report.json

@@ -1,9 +1,9 @@
 {
   "schemaVersion": "1.0.0",
-  "generatedAt": "2026-09-18T09:11:12.858Z",
+  "generatedAt": "2026-09-23T16:57:43.943Z",
   "package": {
     "name": "laif-ds",
-    "version": "1.0.2"
+    "version": "1.0.4"
   },
   "summary": {
     "scannedFiles": 404,
@@ -13,9 +13,9 @@
     "componentsWithoutPropsTableCount": 30,
     "repeatedClassPatternsCount": 25,
     "lowAiReadinessComponentsCount": 41,
-    "componentsWithoutAccessibilityCoverageCount": 45,
+    "componentsWithoutAccessibilityCoverageCount": 44,
     "componentsWithWeakStateCoverageCount": 71,
-    "averageAiReadinessScore": 56.17
+    "averageAiReadinessScore": 56.33
   },
   "deprecatedUsage": [],
   "documentationGaps": {
@@ -70,7 +70,6 @@
       "ChatMessage",
       "CircularProgress",
       "CodeHighlighter",
-      "Confirmer",
       "CopyButton",
       "DataCrossTable",
       "DropdownMenu",
@@ -301,10 +300,6 @@
         "name": "Breadcrumb",
         "score": 30
       },
-      {
-        "name": "Confirmer",
-        "score": 30
-      },
       {
         "name": "Stepper",
         "score": 30
@@ -321,6 +316,10 @@
         "name": "Toggle",
         "score": 40
       },
+      {
+        "name": "Confirmer",
+        "score": 45
+      },
       {
         "name": "GanttChart",
         "score": 45
@@ -485,33 +484,20 @@
         ]
       },
       {
-        "className": "border-d-border mt-2 rounded-md border p-4",
+        "className": "flex flex-col items-center gap-4",
         "occurrences": 9,
         "files": [
-          "src/components/stories/tabs.stories.tsx"
-        ]
-      },
-      {
-        "className": "text-d-muted-foreground text-xs",
-        "occurrences": 8,
-        "files": [
-          "src/components/editor/plugins/mention-plugin.tsx",
           "src/components/stories/app-card.stories.tsx",
-          "src/components/stories/button.stories.tsx",
-          "src/components/stories/input.stories.tsx",
-          "src/components/ui/tables/data-cross-table/cell-editor-dialog.tsx",
-          "src/components/ui/tables/data-cross-table/data-cross-table.tsx",
-          "src/components/ui/tables/data-cross-table/editable-input.tsx"
+          "src/components/stories/confirmer.stories.tsx",
+          "src/components/stories/input-selector.stories.tsx",
+          "src/components/stories/theme-switcher.stories.tsx"
         ]
       },
       {
-        "className": "flex flex-col items-center gap-4",
-        "occurrences": 8,
+        "className": "border-d-border mt-2 rounded-md border p-4",
+        "occurrences": 9,
         "files": [
-          "src/components/stories/app-card.stories.tsx",
-          "src/components/stories/confirmer.stories.tsx",
-          "src/components/stories/input-selector.stories.tsx",
-          "src/components/stories/theme-switcher.stories.tsx"
+          "src/components/stories/tabs.stories.tsx"
         ]
       },
       {
@@ -580,6 +566,18 @@
           "src/components/stories/spinner.stories.tsx"
         ]
       },
+      {
+        "className": "text-d-muted-foreground text-xs",
+        "occurrences": 6,
+        "files": [
+          "src/components/editor/plugins/mention-plugin.tsx",
+          "src/components/stories/app-card.stories.tsx",
+          "src/components/stories/input.stories.tsx",
+          "src/components/ui/tables/data-cross-table/cell-editor-dialog.tsx",
+          "src/components/ui/tables/data-cross-table/data-cross-table.tsx",
+          "src/components/ui/tables/data-cross-table/editable-input.tsx"
+        ]
+      },
       {
         "className": "flex items-center gap-1 font-normal",
         "occurrences": 6,

package/dist/agent-docs/components/Button.md

@@ -129,6 +129,6 @@ export function LoadingButton() {
 
 ## Notes
 
-- **Disabled**: Applies reduced opacity and prevents interactions.
+- **Disabled**: `disabled` renders a native disabled button: reduced opacity, `not-allowed` cursor, no hover colours, press animation or shimmer, and it is skipped by Tab. With `asChild`, `disabled` sets `aria-disabled` and `tabIndex={-1}` on the slotted element and blocks activation; pass `onClick` to `Button`, not to the child (the child's own handler runs first), and omit `href` if the link must be fully unreachable, since middle-click still opens it.
 - **Icon-only**: Use `size="icon"` for square icon buttons.
 - **Theming**: Use variants to match semantic meaning (primary, destructive, etc.).

package/dist/agent-docs/components/Confirmer.md

@@ -56,6 +56,9 @@ declare function safeConfirm(
 - **Resolve/Reject**: `confirm()` resolves on action click, rejects on cancel or close.
 - **Destructive mode**: Adds an alert icon and uses destructive button variant.
 - **Custom buttons**: Pass `ActionProps` and `CancelProps` to customize.
+- **Mobile (< 768px)**: the confirm opens as a bottom drawer instead of a centred dialog — no prop needed, `useIsMobile` decides when it opens and the mode is held while it stays open. Buttons are full-width, 44px tall, action on top and Cancel at the bottom; `CancelProps` is applied to that Cancel button.
+- **Dismiss on mobile**: a drag down or Esc cancels (the promise rejects); a tap on the overlay does nothing, as on desktop.
+- **Focus**: the initial focus lands on Cancel in both modes, and the drawer keeps `role="alertdialog"`.
 
 ---
 

package/dist/agent-docs/manifest.json

@@ -1,16 +1,16 @@
 {
   "schemaVersion": "1.1.0",
-  "generatedAt": "2026-09-18T09:11:12.439Z",
+  "generatedAt": "2026-09-23T16:57:43.636Z",
   "package": {
     "name": "laif-ds",
-    "version": "1.0.2"
+    "version": "1.0.4"
   },
   "stats": {
     "documentedComponentCount": 94,
     "catalogedComponentCount": 94,
     "missingFromDocsCount": 2,
     "deprecatedComponentCount": 2,
-    "averageAiReadinessScore": 56.17,
+    "averageAiReadinessScore": 56.33,
     "highAiReadinessCount": 38,
     "lowAiReadinessCount": 41
   },
@@ -2544,17 +2544,18 @@
           "describedPropsCount": 0
         },
         "accessibility": {
-          "hasCoverage": false
+          "hasCoverage": true
         },
         "states": {
           "coveredStates": [
+            "focus",
             "error"
           ],
-          "coveredStateCount": 1
+          "coveredStateCount": 2
         }
       },
       "aiReadiness": {
-        "score": 30,
+        "score": 45,
         "tier": "low"
       },
       "typeReferences": []
@@ -6312,5 +6313,5 @@
       ]
     }
   ],
-  "checksum": "1b95270b522d7fdbd54fa834020be6d9bf1b0632fda8a9458556d024398a8574"
+  "checksum": "332c6def52f863c64447793da4cde5f62b0eb7ac692b9fbd5e92a4d978e3aead"
 }

package/dist/components/design-tokens.js

@@ -58,7 +58,10 @@ const e = {
     // Press snaps in (100ms) and eases back out (160ms, set by the caller) —
     // symmetric timing reads mushy. Do not deepen much past 2%: the scale is
     // anisotropic, so it distorts the label's aspect ratio too.
-    active: "origin-bottom active:translate-y-[1px] active:scale-y-[0.98] active:scale-x-[1.02] active:shadow-none active:duration-[100ms] motion-reduce:active:translate-y-0 motion-reduce:active:scale-y-100 motion-reduce:active:scale-x-100",
+    // Gated on `interactive:` so a disabled control does not squash; the
+    // reduced-motion resets carry it too, or v4 (which emits custom variants
+    // after built-in ones) would let the squash win over them.
+    active: "origin-bottom interactive:active:translate-y-[1px] interactive:active:scale-y-[0.98] interactive:active:scale-x-[1.02] interactive:active:shadow-none interactive:active:duration-[100ms] motion-reduce:interactive:active:translate-y-0 motion-reduce:interactive:active:scale-y-100 motion-reduce:interactive:active:scale-x-100",
     disabled: "disabled:cursor-not-allowed disabled:opacity-50"
   },
   // Input specific

package/dist/components/ui/button.js

@@ -1,17 +1,19 @@
 "use client";
-import { jsx as t, jsxs as u } from "react/jsx-runtime";
-import { Root as g } from "../../node_modules/@radix-ui/react-slot/dist/index.js";
-import { cva as f } from "../../node_modules/class-variance-authority/dist/index.js";
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { Root as p } from "../../node_modules/@radix-ui/react-slot/dist/index.js";
+import { cva as x } from "../../node_modules/class-variance-authority/dist/index.js";
 import { designTokens as r } from "../design-tokens.js";
-import { cn as d } from "../../lib/utils.js";
-import { Icon as v } from "./icon.js";
-const h = f(
-  d(
+import { cn as i } from "../../lib/utils.js";
+import { Icon as g } from "./icon.js";
+const f = x(
+  i(
     r.text.base,
     r.radius.default,
     r.focusRing,
     r.interaction.active,
     r.interaction.disabled,
+    // A disabled `asChild` link has no `:disabled`: it is flagged `data-disabled`.
+    "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50",
     // `translate` and `scale` must be listed explicitly: Tailwind v4 compiles
     // them to the individual CSS properties of the same name, not to `transform`,
     // so a list naming only `transform` animates neither in the v4 bundle (v3
@@ -25,16 +27,16 @@ const h = f(
   {
     variants: {
       variant: {
-        default: "bg-d-primary text-d-primary-foreground shadow-xs hover:bg-d-primary/90 hover:shadow-d-primary/25",
-        destructive: "bg-d-destructive text-d-destructive-foreground shadow-xs hover:bg-d-destructive/90 hover:shadow-d-destructive/25 focus-visible:ring-d-destructive/20",
-        outline: "border border-d-foreground shadow-xs disabled:border-d-foreground/30 hover:bg-d-accent hover:text-d-accent-foreground hover:border-d-foreground/80",
-        "outline-primary": "border border-d-primary shadow-xs text-d-primary/80 hover:text-d-primary hover:bg-d-primary/10 hover:border-d-primary/80",
-        "outline-destructive": "border border-d-destructive shadow-xs text-d-destructive/80 hover:text-d-destructive hover:bg-d-destructive/10 hover:border-d-destructive/80",
-        secondary: "bg-d-secondary text-d-secondary-foreground shadow-xs hover:bg-d-secondary/80 hover:text-d-secondary-foreground",
-        ghost: "hover:bg-d-accent hover:text-d-accent-foreground",
-        "ghost-destructive": "text-d-destructive  bg-transparent hover:bg-d-destructive/10",
-        "ghost-accent": "text-d-primary bg-transparent hover:bg-d-primary/10",
-        link: "text-d-primary underline-offset-4 hover:underline"
+        default: "bg-d-primary text-d-primary-foreground shadow-xs interactive:hover:bg-d-primary/90 interactive:hover:shadow-d-primary/25",
+        destructive: "bg-d-destructive text-d-destructive-foreground shadow-xs interactive:hover:bg-d-destructive/90 interactive:hover:shadow-d-destructive/25 focus-visible:ring-d-destructive/20",
+        outline: "border border-d-foreground shadow-xs disabled:border-d-foreground/30 data-[disabled]:border-d-foreground/30 interactive:hover:bg-d-accent interactive:hover:text-d-accent-foreground interactive:hover:border-d-foreground/80",
+        "outline-primary": "border border-d-primary shadow-xs text-d-primary/80 interactive:hover:text-d-primary interactive:hover:bg-d-primary/10 interactive:hover:border-d-primary/80",
+        "outline-destructive": "border border-d-destructive shadow-xs text-d-destructive/80 interactive:hover:text-d-destructive interactive:hover:bg-d-destructive/10 interactive:hover:border-d-destructive/80",
+        secondary: "bg-d-secondary text-d-secondary-foreground shadow-xs interactive:hover:bg-d-secondary/80 interactive:hover:text-d-secondary-foreground",
+        ghost: "interactive:hover:bg-d-accent interactive:hover:text-d-accent-foreground",
+        "ghost-destructive": "text-d-destructive  bg-transparent interactive:hover:bg-d-destructive/10",
+        "ghost-accent": "text-d-primary bg-transparent interactive:hover:bg-d-primary/10",
+        link: "text-d-primary underline-offset-4 interactive:hover:underline"
       },
       size: {
         default: r.sizes.default + " has-[>svg]:px-3",
@@ -49,36 +51,48 @@ const h = f(
     }
   }
 );
-function _({
-  className: a,
-  variant: s,
+function j({
+  className: n,
+  variant: d,
   size: e,
-  asChild: n = !1,
-  iconLeft: i,
-  iconRight: c,
-  isLoading: m = !1,
-  ...o
+  asChild: s = !1,
+  iconLeft: c,
+  iconRight: v,
+  isLoading: b = !1,
+  disabled: o,
+  onClick: l,
+  ...a
 }) {
-  const l = n ? g : "button";
-  return n ? /* @__PURE__ */ t(
-    l,
+  const u = s ? p : "button";
+  return s ? /* @__PURE__ */ t(
+    u,
     {
       "data-slot": "button",
-      className: d(h({ variant: s, size: e, className: a })),
-      ...o
+      className: i(f({ variant: d, size: e, className: n })),
+      ...a,
+      ...o && {
+        "aria-disabled": !0,
+        "data-disabled": "",
+        tabIndex: -1
+      },
+      onClick: o ? (h) => {
+        h.preventDefault(), h.stopPropagation();
+      } : l
     }
-  ) : /* @__PURE__ */ u(
-    l,
+  ) : /* @__PURE__ */ m(
+    u,
     {
       "data-slot": "button",
-      className: d("relative", h({ variant: s, size: e, className: a })),
-      ...o,
+      className: i("relative", f({ variant: d, size: e, className: n })),
+      disabled: o,
+      ...a,
+      onClick: l,
       children: [
-        (s ?? "default") === "default" && /* @__PURE__ */ t("span", { className: "pointer-events-none absolute inset-0 overflow-hidden rounded-[inherit] motion-reduce:hidden", children: /* @__PURE__ */ t("span", { className: "absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-0 ease-out [@media(hover:hover)_and_(pointer:fine)]:group-hover:translate-x-full [@media(hover:hover)_and_(pointer:fine)]:group-hover:duration-700" }) }),
-        m ? /* @__PURE__ */ u(
+        (d ?? "default") === "default" && !o && /* @__PURE__ */ t("span", { className: "pointer-events-none absolute inset-0 overflow-hidden rounded-[inherit] motion-reduce:hidden", children: /* @__PURE__ */ t("span", { className: "absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-0 ease-out [@media(hover:hover)_and_(pointer:fine)]:group-hover:translate-x-full [@media(hover:hover)_and_(pointer:fine)]:group-hover:duration-700" }) }),
+        b ? /* @__PURE__ */ m(
           "svg",
           {
-            className: d("animate-spin", o.children && "mr-1 -ml-1"),
+            className: i("animate-spin", a.children && "mr-1 -ml-1"),
             xmlns: "http://www.w3.org/2000/svg",
             fill: "none",
             viewBox: "0 0 24 24",
@@ -106,18 +120,18 @@ function _({
               )
             ]
           }
-        ) : i && /* @__PURE__ */ t(
-          v,
+        ) : c && /* @__PURE__ */ t(
+          g,
           {
-            name: i,
+            name: c,
             size: e === "default" ? "md" : e === "sm" ? "xs" : "sm"
           }
         ),
-        o.children,
-        c && /* @__PURE__ */ t(
-          v,
+        a.children,
+        v && /* @__PURE__ */ t(
+          g,
           {
-            name: c,
+            name: v,
             size: e === "default" ? "md" : e === "sm" ? "xs" : "sm"
           }
         )
@@ -126,6 +140,6 @@ function _({
   );
 }
 export {
-  _ as Button,
-  h as buttonVariants
+  j as Button,
+  f as buttonVariants
 };

package/dist/components/ui/confirmer.js

@@ -1,31 +1,113 @@
 "use client";
-import { jsx as t, jsxs as r } from "react/jsx-runtime";
-import { createAsk as d } from "../../node_modules/use-ask/dist/index.js";
-import { AlertDialog as m, AlertDialogContent as p, AlertDialogHeader as u, AlertDialogTitle as f, AlertDialogDescription as A, AlertDialogFooter as g, AlertDialogCancel as v } from "./alert-dialog.js";
-import { Button as h } from "./button.js";
-import { Icon as x } from "./icon.js";
-const [i, C] = d({}), O = i.ask;
-i.safeAsk;
-const D = {
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { useRef as a } from "react";
+import { createAsk as D } from "../../node_modules/use-ask/dist/index.js";
+import { designTokens as f } from "../design-tokens.js";
+import { AlertDialog as A, AlertDialogContent as x, AlertDialogHeader as C, AlertDialogTitle as w, AlertDialogDescription as k, AlertDialogFooter as N, AlertDialogCancel as T } from "./alert-dialog.js";
+import { Button as c } from "./button.js";
+import { Drawer as P, DrawerContent as O, DrawerHeader as b, DrawerTitle as y, DrawerDescription as z, DrawerFooter as B } from "./drawer.js";
+import { Icon as v } from "./icon.js";
+import { MOBILE_BREAKPOINT as F } from "../../hooks/use-mobile.js";
+import { cn as s } from "../../lib/utils.js";
+const [h, I] = D({}), G = h.ask;
+h.safeAsk;
+const R = {
   title: "Are you sure?",
   cancelText: "Cancel",
   actionText: "Continue",
   variant: "default"
-}, P = () => {
-  const [{ key: n, payload: o }, { asking: a, cancel: c, ok: l }] = C(), e = { ...D, ...o };
-  return /* @__PURE__ */ t(
-    m,
+}, J = () => {
+  const [{ key: l, payload: g }, { asking: i, cancel: o, ok: d }] = I(), e = { ...R, ...g }, m = a(!1), u = a(!1);
+  i && !m.current && (u.current = window.innerWidth < F), m.current = i;
+  const p = a(null);
+  return u.current ? /* @__PURE__ */ t(
+    P,
     {
-      open: a,
-      onOpenChange: (s) => !s && c(),
-      children: /* @__PURE__ */ r(p, { children: [
-        /* @__PURE__ */ t(u, { children: /* @__PURE__ */ r(
-          f,
+      open: i,
+      onOpenChange: (r) => !r && o(),
+      children: /* @__PURE__ */ n(
+        O,
+        {
+          role: "alertdialog",
+          ...!e.description && { "aria-describedby": void 0 },
+          onOpenAutoFocus: (r) => {
+            r.preventDefault(), p.current?.focus();
+          },
+          onPointerDownOutside: (r) => r.preventDefault(),
+          className: "motion-reduce:animate-none! motion-reduce:transition-none!",
+          children: [
+            /* @__PURE__ */ t(b, { className: "pb-2", children: /* @__PURE__ */ n(
+              y,
+              {
+                className: s(
+                  "text-lg",
+                  e.variant === "destructive" && "flex items-start gap-2"
+                ),
+                children: [
+                  e.variant === "destructive" && /* @__PURE__ */ t(
+                    v,
+                    {
+                      name: "AlertTriangle",
+                      className: "text-d-destructive mt-1 shrink-0",
+                      size: "sm"
+                    }
+                  ),
+                  e.title
+                ]
+              }
+            ) }),
+            e.description && /* @__PURE__ */ t(z, { className: "min-h-0 flex-1 overflow-y-auto px-4", children: e.description }),
+            /* @__PURE__ */ n(B, { className: "pb-[max(1rem,env(safe-area-inset-bottom))]", children: [
+              /* @__PURE__ */ t(
+                c,
+                {
+                  ...e.ActionProps,
+                  variant: e.variant === "destructive" ? "destructive" : "default",
+                  className: s(
+                    f.sizes.touch,
+                    "h-auto w-full",
+                    e.ActionProps?.className
+                  ),
+                  onClick: () => d(!0),
+                  children: e.actionText
+                }
+              ),
+              /* @__PURE__ */ t(
+                c,
+                {
+                  ...e.CancelProps,
+                  ref: p,
+                  variant: "ghost",
+                  className: s(
+                    f.sizes.touch,
+                    "h-auto w-full",
+                    e.CancelProps?.className
+                  ),
+                  onClick: (r) => {
+                    e.CancelProps?.onClick?.(r), r.defaultPrevented || o();
+                  },
+                  children: e.cancelText
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    },
+    l
+  ) : /* @__PURE__ */ t(
+    A,
+    {
+      open: i,
+      onOpenChange: (r) => !r && o(),
+      children: /* @__PURE__ */ n(x, { children: [
+        /* @__PURE__ */ t(C, { children: /* @__PURE__ */ n(
+          w,
           {
             className: e.variant === "destructive" ? "flex items-center gap-2" : void 0,
             children: [
               e.variant === "destructive" && /* @__PURE__ */ t(
-                x,
+                v,
                 {
                   name: "AlertTriangle",
                   className: "text-d-destructive",
@@ -36,25 +118,25 @@ const D = {
             ]
           }
         ) }),
-        /* @__PURE__ */ t(A, { children: e.description }),
-        /* @__PURE__ */ r(g, { children: [
-          /* @__PURE__ */ t(v, { ...e.CancelProps, children: e.cancelText }),
+        /* @__PURE__ */ t(k, { children: e.description }),
+        /* @__PURE__ */ n(N, { children: [
+          /* @__PURE__ */ t(T, { ...e.CancelProps, children: e.cancelText }),
           /* @__PURE__ */ t(
-            h,
+            c,
             {
               ...e.ActionProps,
               variant: e.variant === "destructive" ? "destructive" : "default",
-              onClick: () => l(!0),
+              onClick: () => d(!0),
               children: e.actionText
             }
           )
         ] })
       ] })
     },
-    n
+    l
   );
 };
 export {
-  P as Confirmer,
-  O as confirm
+  J as Confirmer,
+  G as confirm
 };

package/dist/css-for-template.css

@@ -1,5 +1,14 @@
 /* This files contains everything that should be imported in the template */
 
+/* A control that can be used right now: neither natively disabled nor marked
+   `data-disabled` (how Button flags a disabled `asChild` link). Gates hover/press feedback without `pointer-events: none`,
+   which would drop the `not-allowed` cursor and any tooltip explaining why.
+   `:where()` keeps specificity at zero so a consumer's `hover:` class still
+   wins. Declared here, not in index.css, because consumer apps compile the
+   laif-ds classes with their own Tailwind and only import this file.
+   Mirrored in tailwind.config.v3.js. */
+@custom-variant interactive (&:where(:not(:disabled, [data-disabled])));
+
 @theme inline {
   --radius-d-sm: calc(var(--d-radius) - 4px);
   --radius-d-md: calc(var(--d-radius) - 2px);

package/dist/hooks/use-mobile.js

@@ -15,5 +15,6 @@ function r() {
   }, []), !!s;
 }
 export {
+  e as MOBILE_BREAKPOINT,
   r as useIsMobile
 };

package/dist/index.d.ts

@@ -952,7 +952,7 @@ export declare function BreadcrumbPage({ className, ...props }: React_2.Componen
 
 export declare function BreadcrumbSeparator({ children, className, ...props }: React_2.ComponentProps<"li">): JSX.Element;
 
-export declare function Button({ className, variant, size, asChild, iconLeft, iconRight, isLoading, ...props }: ButtonProps): JSX.Element;
+export declare function Button({ className, variant, size, asChild, iconLeft, iconRight, isLoading, disabled, onClick, ...props }: ButtonProps): JSX.Element;
 
 export declare interface ButtonProps extends React_2.ComponentProps<"button"> {
     variant?: ButtonVariant;
@@ -2635,6 +2635,8 @@ declare interface MessageListProps {
 
 declare type MessagePart = TextPart | ReasoningPart | ToolInvocationPart | SourcePart;
 
+export declare const MOBILE_BREAKPOINT = 768;
+
 /**
  * @deprecated This component is deprecated. Please use AppSelect component instead.
  */