@epicbagel/saas-kit 1.15.0 → 1.17.0

package/README.md

@@ -42,16 +42,20 @@ does not import a voice provider. Stop and release audio tracks before setting
 Wrap the application in `DictationProvider` to use an authenticated transcription
 API for every `VoiceDictationButton`, including buttons nested in chat, forms or
 another component library. The recorder opens beside its microphone on desktop
-and fills the screen below 768px, with elapsed time, LiveKit audio bars and
-Done/Cancel controls. The bars use the recording stream without opening a second
-microphone. Resizing keeps the current recording alive.
+and fills the screen below 768px. Its roomy panel puts the title and close control
+above a microphone, live audio bars and elapsed time, followed by the transcript
+and Done/Cancel controls. The microphone and bars share the palette's first chart
+colour; surfaces and buttons keep their normal theme. The bars use the recording
+stream without opening a second microphone; native recognition has no meter and
+shows no waveform. No device selector is shown because the capture API does not
+offer device selection. Resizing keeps the current recording alive.
 
 For hidden/programmatic triggers, it uses the focused visible button as the
 desktop anchor. Hosts can pass an explicit `anchorRef` for a custom trigger.
 Without a visible anchor it opens full-screen. Nested and sibling dialogs keep
 their focus and cancellation behavior.
 The recorder runs until **Done**, finishes the last words, then commits the returned text once. Failed requests keep the
-take available for retry. Cancel stops microphone tracks, aborts the request and
+take available for retry. Cancel and the header's close control stop microphone tracks, abort the request and
 ignores a late answer. The kit never persists audio or knows provider credentials.
 
 ```tsx
@@ -448,6 +452,11 @@ with stable `id`, accessible `label`, optional `imageSrc`/`fallback`, and
 visible. The item at the top of the scroll viewport is highlighted; the index
 scrolls independently for long lists. With insufficient left gutter, it uses
 a compact horizontal row above the content. Single-item lists have no index.
+Set `columns` for a responsive card grid (one column on mobile). The first card
+in the row at the reading edge is highlighted; changing columns preserves each
+card's local state.
+The available gutter stays within the outer main content landmark, so the
+index never counts an application's sidebar as free space.
 
 It detects the nearest scrolling ancestor, supports an explicit `scrollRoot`
 and `topOffset` for sticky headers, and offers `onNavigate` for custom scroll

package/dist/{chunk-34AS3OCC.cjs → chunk-6AMSRIQ4.cjs}

@@ -1,6 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
+var _chunkZ2H4LJVGcjs = require('./chunk-Z2H4LJVG.cjs');
+
+
 
 
 var _chunkWABCLRBRcjs = require('./chunk-WABCLRBR.cjs');
@@ -22,7 +25,7 @@ function findScrollRoot(element) {
   }
   return null;
 }
-function viewportBounds(root) {
+function viewportBounds(root, element) {
   const viewport = window.visualViewport;
   const top = _nullishCoalesce(_optionalChain([viewport, 'optionalAccess', _ => _.offsetTop]), () => ( 0));
   const left = _nullishCoalesce(_optionalChain([viewport, 'optionalAccess', _2 => _2.offsetLeft]), () => ( 0));
@@ -36,11 +39,21 @@ function viewportBounds(root) {
     bounds.right = Math.min(bounds.right, rect.left + parent.clientLeft + parent.clientWidth);
     bounds.bottom = Math.min(bounds.bottom, rect.top + parent.clientTop + parent.clientHeight);
   }
+  let landmark = _optionalChain([element, 'optionalAccess', _5 => _5.closest, 'call', _6 => _6("main, [role='main']")]);
+  for (let parent = _optionalChain([landmark, 'optionalAccess', _7 => _7.parentElement, 'optionalAccess', _8 => _8.closest, 'call', _9 => _9("main, [role='main']")]); parent; parent = _optionalChain([parent, 'access', _10 => _10.parentElement, 'optionalAccess', _11 => _11.closest, 'call', _12 => _12("main, [role='main']")])) {
+    landmark = parent;
+  }
+  if (landmark) {
+    const rect = landmark.getBoundingClientRect();
+    bounds.left = Math.max(bounds.left, rect.left);
+    bounds.right = Math.min(bounds.right, rect.right);
+  }
   return bounds;
 }
 var ScrollNavigator = _react.forwardRef.call(void 0, function ScrollNavigator2({
   items,
   label = "Browse items",
+  columns = 1,
   topOffset = 0,
   scrollRoot,
   onNavigate,
@@ -70,14 +83,14 @@ var ScrollNavigator = _react.forwardRef.call(void 0, function ScrollNavigator2({
       }
       const scrollElement = scrollRoot === void 0 ? findScrollRoot(element) : scrollRoot;
       scroller.current = scrollElement;
-      const view = viewportBounds(scrollElement);
+      const view = viewportBounds(scrollElement, element);
       const box = element.getBoundingClientRect();
       const mode = box.left - view.left >= RAIL_WIDTH + GAP ? "rail" : "row";
       const top = Math.max(view.top + topOffset + GAP, box.top);
       const bottom = Math.min(view.bottom, box.bottom) - GAP;
       const visible = box.width > 0 && box.right > view.left && box.left < view.right && bottom - top >= ROW_HEIGHT;
       const readingEdge = view.top + topOffset + GAP + (mode === "row" ? ROW_HEIGHT : 0);
-      const active = visible ? Math.max(0, items.findIndex((item) => (_nullishCoalesce(_optionalChain([targets, 'access', _5 => _5.current, 'access', _6 => _6.get, 'call', _7 => _7(item.id), 'optionalAccess', _8 => _8.getBoundingClientRect, 'call', _9 => _9(), 'access', _10 => _10.bottom]), () => ( 0))) > readingEdge + 1)) : 0;
+      const active = visible ? Math.max(0, items.findIndex((item) => (_nullishCoalesce(_optionalChain([targets, 'access', _13 => _13.current, 'access', _14 => _14.get, 'call', _15 => _15(item.id), 'optionalAccess', _16 => _16.getBoundingClientRect, 'call', _17 => _17(), 'access', _18 => _18.bottom]), () => ( 0))) > readingEdge + 1)) : 0;
       const next = {
         mode,
         top,
@@ -93,33 +106,33 @@ var ScrollNavigator = _react.forwardRef.call(void 0, function ScrollNavigator2({
       if (!frame) frame = requestAnimationFrame(measure);
     };
     const visibility = typeof IntersectionObserver === "undefined" ? null : new IntersectionObserver((entries) => {
-      intersects = _nullishCoalesce(_optionalChain([entries, 'access', _11 => _11[entries.length - 1], 'optionalAccess', _12 => _12.isIntersecting]), () => ( intersects));
+      intersects = _nullishCoalesce(_optionalChain([entries, 'access', _19 => _19[entries.length - 1], 'optionalAccess', _20 => _20.isIntersecting]), () => ( intersects));
       schedule();
     });
-    _optionalChain([visibility, 'optionalAccess', _13 => _13.observe, 'call', _14 => _14(element)]);
+    _optionalChain([visibility, 'optionalAccess', _21 => _21.observe, 'call', _22 => _22(element)]);
     const resize = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(schedule);
     for (let parent = element; parent; parent = parent.parentElement) {
-      _optionalChain([resize, 'optionalAccess', _15 => _15.observe, 'call', _16 => _16(parent)]);
+      _optionalChain([resize, 'optionalAccess', _23 => _23.observe, 'call', _24 => _24(parent)]);
     }
-    targets.current.forEach((target) => _optionalChain([resize, 'optionalAccess', _17 => _17.observe, 'call', _18 => _18(target)]));
+    targets.current.forEach((target) => _optionalChain([resize, 'optionalAccess', _25 => _25.observe, 'call', _26 => _26(target)]));
     document.addEventListener("scroll", schedule, { passive: true, capture: true });
     window.addEventListener("resize", schedule);
-    _optionalChain([window, 'access', _19 => _19.visualViewport, 'optionalAccess', _20 => _20.addEventListener, 'call', _21 => _21("resize", schedule)]);
-    _optionalChain([window, 'access', _22 => _22.visualViewport, 'optionalAccess', _23 => _23.addEventListener, 'call', _24 => _24("scroll", schedule)]);
+    _optionalChain([window, 'access', _27 => _27.visualViewport, 'optionalAccess', _28 => _28.addEventListener, 'call', _29 => _29("resize", schedule)]);
+    _optionalChain([window, 'access', _30 => _30.visualViewport, 'optionalAccess', _31 => _31.addEventListener, 'call', _32 => _32("scroll", schedule)]);
     measure();
     return () => {
       cancelAnimationFrame(frame);
-      _optionalChain([resize, 'optionalAccess', _25 => _25.disconnect, 'call', _26 => _26()]);
-      _optionalChain([visibility, 'optionalAccess', _27 => _27.disconnect, 'call', _28 => _28()]);
+      _optionalChain([resize, 'optionalAccess', _33 => _33.disconnect, 'call', _34 => _34()]);
+      _optionalChain([visibility, 'optionalAccess', _35 => _35.disconnect, 'call', _36 => _36()]);
       document.removeEventListener("scroll", schedule, true);
       window.removeEventListener("resize", schedule);
-      _optionalChain([window, 'access', _29 => _29.visualViewport, 'optionalAccess', _30 => _30.removeEventListener, 'call', _31 => _31("resize", schedule)]);
-      _optionalChain([window, 'access', _32 => _32.visualViewport, 'optionalAccess', _33 => _33.removeEventListener, 'call', _34 => _34("scroll", schedule)]);
+      _optionalChain([window, 'access', _37 => _37.visualViewport, 'optionalAccess', _38 => _38.removeEventListener, 'call', _39 => _39("resize", schedule)]);
+      _optionalChain([window, 'access', _40 => _40.visualViewport, 'optionalAccess', _41 => _41.removeEventListener, 'call', _42 => _42("scroll", schedule)]);
     };
-  }, [keys, navigable, topOffset, scrollRoot]);
+  }, [keys, navigable, columns, topOffset, scrollRoot]);
   _react.useEffect.call(void 0, () => {
     const index = indexRef.current;
-    const button = controls.current.get(_nullishCoalesce(_nullishCoalesce(focusId, () => ( _optionalChain([items, 'access', _35 => _35[placement.active], 'optionalAccess', _36 => _36.id]))), () => ( "")));
+    const button = controls.current.get(_nullishCoalesce(_nullishCoalesce(focusId, () => ( _optionalChain([items, 'access', _43 => _43[placement.active], 'optionalAccess', _44 => _44.id]))), () => ( "")));
     if (!index || !button || !placement.visible) return;
     const horizontal = placement.mode === "row";
     const start = horizontal ? button.offsetLeft : button.offsetTop;
@@ -137,14 +150,14 @@ var ScrollNavigator = _react.forwardRef.call(void 0, function ScrollNavigator2({
       offset: topOffset + GAP + (placement.mode === "row" ? ROW_HEIGHT : 0),
       behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "instant" : "smooth"
     };
-    if (_optionalChain([onNavigate, 'optionalCall', _37 => _37(item.id, target, options)]) === true) return;
+    if (_optionalChain([onNavigate, 'optionalCall', _45 => _45(item.id, target, options)]) === true) return;
     const scrollElement = scroller.current;
-    const view = viewportBounds(scrollElement);
-    const top = (_nullishCoalesce(_optionalChain([scrollElement, 'optionalAccess', _38 => _38.scrollTop]), () => ( window.scrollY))) + target.getBoundingClientRect().top - view.top - options.offset;
+    const view = viewportBounds(scrollElement, rootRef.current);
+    const top = (_nullishCoalesce(_optionalChain([scrollElement, 'optionalAccess', _46 => _46.scrollTop]), () => ( window.scrollY))) + target.getBoundingClientRect().top - view.top - options.offset;
     if (scrollElement) scrollElement.scrollTo({ top, behavior: options.behavior });
     else window.scrollTo({ top, behavior: options.behavior });
   }
-  const activeId = _optionalChain([items, 'access', _39 => _39[placement.active], 'optionalAccess', _40 => _40.id]);
+  const activeId = _optionalChain([items, 'access', _47 => _47[placement.active], 'optionalAccess', _48 => _48.id]);
   const tabId = focusId && items.some((item) => item.id === focusId) ? focusId : activeId;
   const row = placement.mode === "row";
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -160,7 +173,7 @@ var ScrollNavigator = _react.forwardRef.call(void 0, function ScrollNavigator2({
       },
       className: _chunkKWLSBTB2cjs.cn.call(void 0, "relative min-w-0", navigable && row && "pt-16", className),
       children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-w-0 flex-col gap-4", children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZ2H4LJVGcjs.Grid, { columns, gap: "md", responsive: true, className: "min-w-0", children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           "div",
           {
             id: `${id}-${index}`,
@@ -204,7 +217,7 @@ var ScrollNavigator = _react.forwardRef.call(void 0, function ScrollNavigator2({
                       else return;
                       event.preventDefault();
                       const button = controls.current.get(items[next].id);
-                      _optionalChain([button, 'optionalAccess', _41 => _41.focus, 'call', _42 => _42({ preventScroll: true })]);
+                      _optionalChain([button, 'optionalAccess', _49 => _49.focus, 'call', _50 => _50({ preventScroll: true })]);
                       const index = indexRef.current;
                       if (index && button) {
                         if (row) index.scrollLeft = button.offsetLeft - (index.clientWidth - button.offsetWidth) / 2;

package/dist/{chunk-UBTLWSKK.js → chunk-EXXJXOUO.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   ScrollNavigator
-} from "./chunk-VT2WDFSU.js";
+} from "./chunk-V3XA7SDK.js";
 import {
   Button
 } from "./chunk-W326GKML.js";

package/dist/chunk-GA5SX7FE.js

@@ -0,0 +1,48 @@
+"use client";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+
+// src/primitives/grid.tsx
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+var fixedColumns = {
+  1: "grid-cols-1",
+  2: "grid-cols-2",
+  3: "grid-cols-3",
+  4: "grid-cols-4"
+};
+var responsiveColumns = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 sm:grid-cols-2",
+  3: "grid-cols-1 sm:grid-cols-3",
+  4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
+};
+var gaps = { sm: "gap-2", compact: "gap-3", md: "gap-4", lg: "gap-6" };
+var Grid = forwardRef(function Grid2({ columns = 2, gap = "md", responsive = true, layout = "grid", maxWidth = "none", centered = false, template = "equal", as, className, ...props }, ref) {
+  const Component = as ?? "div";
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      ref,
+      className: cn(
+        layout === "grid" ? "grid" : "grid sm:flex sm:justify-end",
+        layout === "grid" && template === "equal" && columns !== null && (responsive ? responsiveColumns[columns] : fixedColumns[columns]),
+        layout === "responsive-actions" && columns !== null && fixedColumns[columns],
+        template === "compact-leading-three" && "grid-cols-[5rem_1fr_1fr]",
+        template === "responsive-form-row-six" && "grid-cols-1 items-center sm:grid-cols-[1fr_1.4fr_1fr_1fr_1fr_auto]",
+        template === "master-detail" && "grid-cols-1 lg:grid-cols-[360px_1fr]",
+        template === "gallery" && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
+        gaps[gap],
+        maxWidth === "xl" && "max-w-2xl",
+        centered && "mx-auto",
+        className
+      ),
+      ...props
+    }
+  );
+});
+
+export {
+  Grid
+};

package/dist/{chunk-PD5UQEKY.cjs → chunk-HSSSNAVX.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
-var _chunk34AS3OCCcjs = require('./chunk-34AS3OCC.cjs');
+var _chunk6AMSRIQ4cjs = require('./chunk-6AMSRIQ4.cjs');
 
 
 var _chunkJDEXZGIYcjs = require('./chunk-JDEXZGIY.cjs');
@@ -23,7 +23,7 @@ function MessageScrollerProvider(props) {
 }
 function MessageScrollerNavigator(props) {
   const { scrollToMessage } = _messagescroller.useMessageScroller.call(void 0, );
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk34AS3OCCcjs.ScrollNavigator, { ...props, onNavigate: (id, target, options) => {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6AMSRIQ4cjs.ScrollNavigator, { ...props, onNavigate: (id, target, options) => {
     if (_optionalChain([props, 'access', _ => _.onNavigate, 'optionalCall', _2 => _2(id, target, options)]) === true) return true;
     const message = target.closest("[data-message-id]");
     const messageId = _optionalChain([message, 'optionalAccess', _3 => _3.dataset, 'access', _4 => _4.messageId]);

package/dist/{chunk-QWUMIAYD.cjs → chunk-PH2TV7XI.cjs}

@@ -118,40 +118,72 @@ function VoiceDictationButton({
     }
   };
   const content = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "flex min-w-0 items-start justify-between gap-3", !anchored && "w-full max-w-xl self-center"), children: [
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "min-w-0 space-y-1", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "font-medium", anchored ? "text-sm" : "text-lg"), children: title || "Voice dictation" }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { role: "status", className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
-          busy ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.LoaderCircle, { "aria-hidden": "true", className: "size-3.5 animate-spin motion-reduce:animate-none" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Mic, { "aria-hidden": "true", className: "size-3.5" }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "flex min-w-0 shrink-0 items-start justify-between gap-4", !anchored && "w-full max-w-xl self-center"), children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "min-w-0 space-y-2 pt-1", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: "break-words text-xl font-semibold leading-tight", children: title || "Voice dictation" }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { role: "status", className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+          busy && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.LoaderCircle, { "aria-hidden": "true", className: "size-4 shrink-0 animate-spin motion-reduce:animate-none" }),
           capture.state === "transcribing" ? "Finishing transcript\u2026" : capture.state === "requesting" ? "Starting dictation\u2026" : error ? "Recording not saved" : capture.state === "ready" ? "Ready" : caption
         ] })
       ] }),
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "time", { "aria-label": "Recording duration", dateTime: `PT${elapsed}S`, className: "pt-0.5 font-mono text-xs tabular-nums text-muted-foreground", children: [
-        Math.floor(elapsed / 60).toString().padStart(2, "0"),
-        ":",
-        (elapsed % 60).toString().padStart(2, "0")
-      ] })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkJDEXZGIYcjs.Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon",
+          shape: "circle",
+          "aria-label": "Cancel dictation",
+          className: "size-[44px] shrink-0 text-muted-foreground [&_svg]:size-5",
+          onClick: handleCancel,
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.X, { "aria-hidden": "true", className: "size-5" })
+        }
+      )
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "flex min-h-0 flex-col gap-3", !anchored && "w-full max-w-xl flex-1 justify-center self-center py-8 text-center"), children: [
-      capture.audioLevels && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DictationWaveform, { source: capture.audioLevels, state: capture.state, className: !anchored ? "h-20" : void 0 }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { id: descriptionId, className: "text-xs text-muted-foreground", children: capture.state === "transcribing" ? "Finishing your last words\u2026" : capture.state === "requesting" ? "Allow microphone access to start." : error ? capture.canRetry ? "Retry this take or record again." : "Try recording again." : "Speak, then choose Done to add the text." }),
-      displayTranscript && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { className: "max-h-40 overflow-y-auto text-sm leading-relaxed", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "flex flex-col gap-5", !anchored && "w-full max-w-xl flex-1 justify-center self-center py-6"), children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "data-slot": "dictation-meter", className: "flex min-w-0 items-center gap-3 py-5 text-[hsl(var(--chart-1))] sm:gap-5 sm:py-7", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "div",
+          {
+            "aria-hidden": "true",
+            "data-slot": "dictation-microphone",
+            className: "flex size-[72px] shrink-0 items-center justify-center rounded-full bg-current/10 sm:size-[96px]",
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex size-[52px] items-center justify-center rounded-full bg-[hsl(var(--chart-1))] text-popover sm:size-[72px]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Mic, { className: "size-7 sm:size-9" }) })
+          }
+        ),
+        capture.audioLevels && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DictationWaveform, { source: capture.audioLevels, state: capture.state }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          "time",
+          {
+            "aria-label": "Recording duration",
+            dateTime: `PT${elapsed}S`,
+            className: "ml-auto shrink-0 font-mono text-xl tabular-nums text-muted-foreground sm:text-2xl",
+            children: [
+              Math.floor(elapsed / 60).toString().padStart(2, "0"),
+              ":",
+              (elapsed % 60).toString().padStart(2, "0")
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { id: descriptionId, className: "text-base leading-relaxed text-muted-foreground", children: capture.state === "transcribing" ? "Finishing your last words\u2026" : capture.state === "requesting" ? "Allow microphone access to start." : error ? capture.canRetry ? "Retry this take or record again." : "Try recording again." : "Speak, then choose Done to add the text." }),
+      displayTranscript && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { className: "max-h-48 overflow-y-auto break-words text-base leading-relaxed", children: [
         transcript,
         interim && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "text-muted-foreground", children: [
           transcript ? " " : "",
           interim
         ] })
       ] }),
-      error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { role: "alert", className: "text-xs text-destructive", children: error }),
-      !error && capture.previewError && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { role: "status", className: "text-xs text-muted-foreground", children: capture.previewError })
+      error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { role: "alert", className: "text-sm leading-relaxed text-destructive", children: error }),
+      !error && capture.previewError && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { role: "status", className: "text-sm leading-relaxed text-muted-foreground", children: capture.previewError })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "gap-2", anchored ? "flex flex-wrap items-center justify-end" : "mt-auto grid w-full max-w-xl grid-cols-2 gap-3 self-center"), children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { ref: cancelControl, type: "button", variant: "ghost", size: "sm", className: anchored ? "min-h-[44px]" : "min-h-[48px]", onClick: handleCancel, children: "Cancel" }),
-      capture.canRetry && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "outline", size: "sm", className: anchored ? "min-h-[44px]" : "order-first col-span-2 min-h-[48px]", onClick: () => {
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkKWLSBTB2cjs.cn.call(void 0, "shrink-0 gap-3 pt-2", anchored ? "flex flex-wrap items-center justify-end" : "mt-auto grid w-full max-w-xl grid-cols-[auto_minmax(0,1fr)] self-center"), children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { ref: cancelControl, type: "button", variant: "ghost", className: "min-h-[48px] px-5", onClick: handleCancel, children: "Cancel" }),
+      capture.canRetry && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", variant: "outline", className: _chunkKWLSBTB2cjs.cn.call(void 0, "min-h-[48px] px-5", !anchored && "order-first col-span-2"), onClick: () => {
         _optionalChain([cancelControl, 'access', _13 => _13.current, 'optionalAccess', _14 => _14.focus, 'call', _15 => _15({ preventScroll: true })]);
         void capture.start();
       }, children: "Record again" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", size: "sm", className: anchored ? "min-h-[44px]" : "min-h-[48px]", onClick: () => void handleDone(), disabled: busy, children: capture.state === "transcribing" ? "Transcribing\u2026" : capture.canRetry ? "Retry transcription" : error ? "Try again" : "Done" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJDEXZGIYcjs.Button, { type: "button", className: "min-h-[48px] min-w-24 px-6", onClick: () => void handleDone(), disabled: busy, children: capture.state === "transcribing" ? "Transcribing\u2026" : capture.canRetry ? "Retry transcription" : error ? "Try again" : "Done" })
     ] })
   ] });
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
@@ -195,13 +227,13 @@ function VoiceDictationButton({
           "data-placement": "anchored",
           side: "top",
           align: "center",
-          sideOffset: 8,
+          sideOffset: 12,
           collisionPadding: 12,
           avoidCollisions: true,
           onCloseAutoFocus: closeAutoFocus,
           onKeyDown,
           onEscapeKeyDown: (event) => event.stopPropagation(),
-          className: "z-[200] flex max-h-[var(--radix-popover-content-available-height)] w-96 max-w-[calc(100vw-1.5rem)] flex-col gap-3 overflow-y-auto rounded-2xl border border-border bg-background p-4 text-foreground shadow-lg outline-hidden",
+          className: "z-[200] flex max-h-[var(--radix-popover-content-available-height)] w-[560px] max-w-[calc(100vw-24px)] flex-col gap-6 overflow-y-auto rounded-2xl border border-border bg-popover p-6 text-popover-foreground shadow-xl outline-hidden",
           children: content
         }
       ) })
@@ -221,7 +253,7 @@ function VoiceDictationButton({
           onCloseAutoFocus: closeAutoFocus,
           onKeyDown,
           onEscapeKeyDown: (event) => event.stopPropagation(),
-          className: "fixed inset-0 z-[200] flex h-dvh w-screen flex-col gap-6 overflow-y-auto overscroll-contain bg-background px-6 pt-[max(1.5rem,env(safe-area-inset-top))] pb-[max(1.5rem,env(safe-area-inset-bottom))] text-foreground outline-hidden",
+          className: "fixed inset-0 z-[200] flex h-dvh w-screen flex-col gap-6 overflow-y-auto overscroll-contain bg-popover px-5 pt-[max(1.5rem,env(safe-area-inset-top))] pb-[max(1.5rem,env(safe-area-inset-bottom))] text-popover-foreground outline-hidden",
           children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Title, { className: "sr-only", children: "Voice dictation" }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Description, { className: "sr-only", children: "Record your message, then choose Done to add the text. Cancel discards the recording." }),
@@ -234,7 +266,7 @@ function VoiceDictationButton({
 }
 var SILENCE = [];
 var silence = () => SILENCE;
-function DictationWaveform({ source, state, className }) {
+function DictationWaveform({ source, state }) {
   const bands = _react.useSyncExternalStore.call(void 0, source.subscribe, source.getSnapshot, silence);
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _chunkNKWHDI4Ccjs.AgentAudioVisualizerBar,
@@ -245,7 +277,8 @@ function DictationWaveform({ source, state, className }) {
       barCount: 24,
       state: state === "recording" ? "listening" : state === "transcribing" ? "thinking" : state === "requesting" ? "connecting" : "disconnected",
       volumeBands: state === "recording" ? bands : void 0,
-      className: _chunkKWLSBTB2cjs.cn.call(void 0, "h-9 w-full text-foreground", className)
+      className: "h-[64px] min-w-0 flex-1 gap-[3px] sm:h-[88px] sm:gap-[4px]",
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[4px] max-w-[6px] flex-1 rounded-full bg-current/15 transition-colors duration-200 motion-reduce:transition-none data-[lk-highlighted=true]:bg-current" })
     }
   );
 }

package/dist/{chunk-VT2WDFSU.js → chunk-V3XA7SDK.js}

@@ -1,4 +1,7 @@
 "use client";
+import {
+  Grid
+} from "./chunk-GA5SX7FE.js";
 import {
   Avatar,
   AvatarFallback,
@@ -22,7 +25,7 @@ function findScrollRoot(element) {
   }
   return null;
 }
-function viewportBounds(root) {
+function viewportBounds(root, element) {
   const viewport = window.visualViewport;
   const top = viewport?.offsetTop ?? 0;
   const left = viewport?.offsetLeft ?? 0;
@@ -36,11 +39,21 @@ function viewportBounds(root) {
     bounds.right = Math.min(bounds.right, rect.left + parent.clientLeft + parent.clientWidth);
     bounds.bottom = Math.min(bounds.bottom, rect.top + parent.clientTop + parent.clientHeight);
   }
+  let landmark = element?.closest("main, [role='main']");
+  for (let parent = landmark?.parentElement?.closest("main, [role='main']"); parent; parent = parent.parentElement?.closest("main, [role='main']")) {
+    landmark = parent;
+  }
+  if (landmark) {
+    const rect = landmark.getBoundingClientRect();
+    bounds.left = Math.max(bounds.left, rect.left);
+    bounds.right = Math.min(bounds.right, rect.right);
+  }
   return bounds;
 }
 var ScrollNavigator = forwardRef(function ScrollNavigator2({
   items,
   label = "Browse items",
+  columns = 1,
   topOffset = 0,
   scrollRoot,
   onNavigate,
@@ -70,7 +83,7 @@ var ScrollNavigator = forwardRef(function ScrollNavigator2({
       }
       const scrollElement = scrollRoot === void 0 ? findScrollRoot(element) : scrollRoot;
       scroller.current = scrollElement;
-      const view = viewportBounds(scrollElement);
+      const view = viewportBounds(scrollElement, element);
       const box = element.getBoundingClientRect();
       const mode = box.left - view.left >= RAIL_WIDTH + GAP ? "rail" : "row";
       const top = Math.max(view.top + topOffset + GAP, box.top);
@@ -116,7 +129,7 @@ var ScrollNavigator = forwardRef(function ScrollNavigator2({
       window.visualViewport?.removeEventListener("resize", schedule);
       window.visualViewport?.removeEventListener("scroll", schedule);
     };
-  }, [keys, navigable, topOffset, scrollRoot]);
+  }, [keys, navigable, columns, topOffset, scrollRoot]);
   useEffect(() => {
     const index = indexRef.current;
     const button = controls.current.get(focusId ?? items[placement.active]?.id ?? "");
@@ -139,7 +152,7 @@ var ScrollNavigator = forwardRef(function ScrollNavigator2({
     };
     if (onNavigate?.(item.id, target, options) === true) return;
     const scrollElement = scroller.current;
-    const view = viewportBounds(scrollElement);
+    const view = viewportBounds(scrollElement, rootRef.current);
     const top = (scrollElement?.scrollTop ?? window.scrollY) + target.getBoundingClientRect().top - view.top - options.offset;
     if (scrollElement) scrollElement.scrollTo({ top, behavior: options.behavior });
     else window.scrollTo({ top, behavior: options.behavior });
@@ -160,7 +173,7 @@ var ScrollNavigator = forwardRef(function ScrollNavigator2({
       },
       className: cn("relative min-w-0", navigable && row && "pt-16", className),
       children: [
-        /* @__PURE__ */ jsx("div", { className: "flex min-w-0 flex-col gap-4", children: items.map((item, index) => /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Grid, { columns, gap: "md", responsive: true, className: "min-w-0", children: items.map((item, index) => /* @__PURE__ */ jsx(
           "div",
           {
             id: `${id}-${index}`,

package/dist/chunk-Z2H4LJVG.cjs

@@ -0,0 +1,48 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/grid.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var fixedColumns = {
+  1: "grid-cols-1",
+  2: "grid-cols-2",
+  3: "grid-cols-3",
+  4: "grid-cols-4"
+};
+var responsiveColumns = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 sm:grid-cols-2",
+  3: "grid-cols-1 sm:grid-cols-3",
+  4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
+};
+var gaps = { sm: "gap-2", compact: "gap-3", md: "gap-4", lg: "gap-6" };
+var Grid = _react.forwardRef.call(void 0, function Grid2({ columns = 2, gap = "md", responsive = true, layout = "grid", maxWidth = "none", centered = false, template = "equal", as, className, ...props }, ref) {
+  const Component = _nullishCoalesce(as, () => ( "div"));
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    Component,
+    {
+      ref,
+      className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+        layout === "grid" ? "grid" : "grid sm:flex sm:justify-end",
+        layout === "grid" && template === "equal" && columns !== null && (responsive ? responsiveColumns[columns] : fixedColumns[columns]),
+        layout === "responsive-actions" && columns !== null && fixedColumns[columns],
+        template === "compact-leading-three" && "grid-cols-[5rem_1fr_1fr]",
+        template === "responsive-form-row-six" && "grid-cols-1 items-center sm:grid-cols-[1fr_1.4fr_1fr_1fr_1fr_auto]",
+        template === "master-detail" && "grid-cols-1 lg:grid-cols-[360px_1fr]",
+        template === "gallery" && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
+        gaps[gap],
+        maxWidth === "xl" && "max-w-2xl",
+        centered && "mx-auto",
+        className
+      ),
+      ...props
+    }
+  );
+});
+
+
+
+exports.Grid = Grid;

package/dist/{chunk-JKVVTFAP.js → chunk-ZGTPNSR7.js}

@@ -23,7 +23,7 @@ import {
 } from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-import { Mic, LoaderCircle } from "lucide-react";
+import { Mic, LoaderCircle, X } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 function VoiceDictationButton({
   onCommit,
@@ -118,40 +118,72 @@ function VoiceDictationButton({
     }
   };
   const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-start justify-between gap-3", !anchored && "w-full max-w-xl self-center"), children: [
-      /* @__PURE__ */ jsxs("div", { className: "min-w-0 space-y-1", children: [
-        /* @__PURE__ */ jsx("h2", { className: cn("font-medium", anchored ? "text-sm" : "text-lg"), children: title || "Voice dictation" }),
-        /* @__PURE__ */ jsxs("span", { role: "status", className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
-          busy ? /* @__PURE__ */ jsx(LoaderCircle, { "aria-hidden": "true", className: "size-3.5 animate-spin motion-reduce:animate-none" }) : /* @__PURE__ */ jsx(Mic, { "aria-hidden": "true", className: "size-3.5" }),
+    /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 shrink-0 items-start justify-between gap-4", !anchored && "w-full max-w-xl self-center"), children: [
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 space-y-2 pt-1", children: [
+        /* @__PURE__ */ jsx("h2", { className: "break-words text-xl font-semibold leading-tight", children: title || "Voice dictation" }),
+        /* @__PURE__ */ jsxs("span", { role: "status", className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+          busy && /* @__PURE__ */ jsx(LoaderCircle, { "aria-hidden": "true", className: "size-4 shrink-0 animate-spin motion-reduce:animate-none" }),
           capture.state === "transcribing" ? "Finishing transcript\u2026" : capture.state === "requesting" ? "Starting dictation\u2026" : error ? "Recording not saved" : capture.state === "ready" ? "Ready" : caption
         ] })
       ] }),
-      /* @__PURE__ */ jsxs("time", { "aria-label": "Recording duration", dateTime: `PT${elapsed}S`, className: "pt-0.5 font-mono text-xs tabular-nums text-muted-foreground", children: [
-        Math.floor(elapsed / 60).toString().padStart(2, "0"),
-        ":",
-        (elapsed % 60).toString().padStart(2, "0")
-      ] })
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon",
+          shape: "circle",
+          "aria-label": "Cancel dictation",
+          className: "size-[44px] shrink-0 text-muted-foreground [&_svg]:size-5",
+          onClick: handleCancel,
+          children: /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-5" })
+        }
+      )
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: cn("flex min-h-0 flex-col gap-3", !anchored && "w-full max-w-xl flex-1 justify-center self-center py-8 text-center"), children: [
-      capture.audioLevels && /* @__PURE__ */ jsx(DictationWaveform, { source: capture.audioLevels, state: capture.state, className: !anchored ? "h-20" : void 0 }),
-      /* @__PURE__ */ jsx("p", { id: descriptionId, className: "text-xs text-muted-foreground", children: capture.state === "transcribing" ? "Finishing your last words\u2026" : capture.state === "requesting" ? "Allow microphone access to start." : error ? capture.canRetry ? "Retry this take or record again." : "Try recording again." : "Speak, then choose Done to add the text." }),
-      displayTranscript && /* @__PURE__ */ jsxs("p", { className: "max-h-40 overflow-y-auto text-sm leading-relaxed", children: [
+    /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-5", !anchored && "w-full max-w-xl flex-1 justify-center self-center py-6"), children: [
+      /* @__PURE__ */ jsxs("div", { "data-slot": "dictation-meter", className: "flex min-w-0 items-center gap-3 py-5 text-[hsl(var(--chart-1))] sm:gap-5 sm:py-7", children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": "true",
+            "data-slot": "dictation-microphone",
+            className: "flex size-[72px] shrink-0 items-center justify-center rounded-full bg-current/10 sm:size-[96px]",
+            children: /* @__PURE__ */ jsx("div", { className: "flex size-[52px] items-center justify-center rounded-full bg-[hsl(var(--chart-1))] text-popover sm:size-[72px]", children: /* @__PURE__ */ jsx(Mic, { className: "size-7 sm:size-9" }) })
+          }
+        ),
+        capture.audioLevels && /* @__PURE__ */ jsx(DictationWaveform, { source: capture.audioLevels, state: capture.state }),
+        /* @__PURE__ */ jsxs(
+          "time",
+          {
+            "aria-label": "Recording duration",
+            dateTime: `PT${elapsed}S`,
+            className: "ml-auto shrink-0 font-mono text-xl tabular-nums text-muted-foreground sm:text-2xl",
+            children: [
+              Math.floor(elapsed / 60).toString().padStart(2, "0"),
+              ":",
+              (elapsed % 60).toString().padStart(2, "0")
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("p", { id: descriptionId, className: "text-base leading-relaxed text-muted-foreground", children: capture.state === "transcribing" ? "Finishing your last words\u2026" : capture.state === "requesting" ? "Allow microphone access to start." : error ? capture.canRetry ? "Retry this take or record again." : "Try recording again." : "Speak, then choose Done to add the text." }),
+      displayTranscript && /* @__PURE__ */ jsxs("p", { className: "max-h-48 overflow-y-auto break-words text-base leading-relaxed", children: [
         transcript,
         interim && /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
           transcript ? " " : "",
           interim
         ] })
       ] }),
-      error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-xs text-destructive", children: error }),
-      !error && capture.previewError && /* @__PURE__ */ jsx("p", { role: "status", className: "text-xs text-muted-foreground", children: capture.previewError })
+      error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm leading-relaxed text-destructive", children: error }),
+      !error && capture.previewError && /* @__PURE__ */ jsx("p", { role: "status", className: "text-sm leading-relaxed text-muted-foreground", children: capture.previewError })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: cn("gap-2", anchored ? "flex flex-wrap items-center justify-end" : "mt-auto grid w-full max-w-xl grid-cols-2 gap-3 self-center"), children: [
-      /* @__PURE__ */ jsx(Button, { ref: cancelControl, type: "button", variant: "ghost", size: "sm", className: anchored ? "min-h-[44px]" : "min-h-[48px]", onClick: handleCancel, children: "Cancel" }),
-      capture.canRetry && /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", className: anchored ? "min-h-[44px]" : "order-first col-span-2 min-h-[48px]", onClick: () => {
+    /* @__PURE__ */ jsxs("div", { className: cn("shrink-0 gap-3 pt-2", anchored ? "flex flex-wrap items-center justify-end" : "mt-auto grid w-full max-w-xl grid-cols-[auto_minmax(0,1fr)] self-center"), children: [
+      /* @__PURE__ */ jsx(Button, { ref: cancelControl, type: "button", variant: "ghost", className: "min-h-[48px] px-5", onClick: handleCancel, children: "Cancel" }),
+      capture.canRetry && /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", className: cn("min-h-[48px] px-5", !anchored && "order-first col-span-2"), onClick: () => {
         cancelControl.current?.focus({ preventScroll: true });
         void capture.start();
       }, children: "Record again" }),
-      /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", className: anchored ? "min-h-[44px]" : "min-h-[48px]", onClick: () => void handleDone(), disabled: busy, children: capture.state === "transcribing" ? "Transcribing\u2026" : capture.canRetry ? "Retry transcription" : error ? "Try again" : "Done" })
+      /* @__PURE__ */ jsx(Button, { type: "button", className: "min-h-[48px] min-w-24 px-6", onClick: () => void handleDone(), disabled: busy, children: capture.state === "transcribing" ? "Transcribing\u2026" : capture.canRetry ? "Retry transcription" : error ? "Try again" : "Done" })
     ] })
   ] });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -195,13 +227,13 @@ function VoiceDictationButton({
           "data-placement": "anchored",
           side: "top",
           align: "center",
-          sideOffset: 8,
+          sideOffset: 12,
           collisionPadding: 12,
           avoidCollisions: true,
           onCloseAutoFocus: closeAutoFocus,
           onKeyDown,
           onEscapeKeyDown: (event) => event.stopPropagation(),
-          className: "z-[200] flex max-h-[var(--radix-popover-content-available-height)] w-96 max-w-[calc(100vw-1.5rem)] flex-col gap-3 overflow-y-auto rounded-2xl border border-border bg-background p-4 text-foreground shadow-lg outline-hidden",
+          className: "z-[200] flex max-h-[var(--radix-popover-content-available-height)] w-[560px] max-w-[calc(100vw-24px)] flex-col gap-6 overflow-y-auto rounded-2xl border border-border bg-popover p-6 text-popover-foreground shadow-xl outline-hidden",
           children: content
         }
       ) })
@@ -221,7 +253,7 @@ function VoiceDictationButton({
           onCloseAutoFocus: closeAutoFocus,
           onKeyDown,
           onEscapeKeyDown: (event) => event.stopPropagation(),
-          className: "fixed inset-0 z-[200] flex h-dvh w-screen flex-col gap-6 overflow-y-auto overscroll-contain bg-background px-6 pt-[max(1.5rem,env(safe-area-inset-top))] pb-[max(1.5rem,env(safe-area-inset-bottom))] text-foreground outline-hidden",
+          className: "fixed inset-0 z-[200] flex h-dvh w-screen flex-col gap-6 overflow-y-auto overscroll-contain bg-popover px-5 pt-[max(1.5rem,env(safe-area-inset-top))] pb-[max(1.5rem,env(safe-area-inset-bottom))] text-popover-foreground outline-hidden",
           children: [
             /* @__PURE__ */ jsx(DialogPrimitive.Title, { className: "sr-only", children: "Voice dictation" }),
             /* @__PURE__ */ jsx(DialogPrimitive.Description, { className: "sr-only", children: "Record your message, then choose Done to add the text. Cancel discards the recording." }),
@@ -234,7 +266,7 @@ function VoiceDictationButton({
 }
 var SILENCE = [];
 var silence = () => SILENCE;
-function DictationWaveform({ source, state, className }) {
+function DictationWaveform({ source, state }) {
   const bands = useSyncExternalStore(source.subscribe, source.getSnapshot, silence);
   return /* @__PURE__ */ jsx(
     AgentAudioVisualizerBar,
@@ -245,7 +277,8 @@ function DictationWaveform({ source, state, className }) {
       barCount: 24,
       state: state === "recording" ? "listening" : state === "transcribing" ? "thinking" : state === "requesting" ? "connecting" : "disconnected",
       volumeBands: state === "recording" ? bands : void 0,
-      className: cn("h-9 w-full text-foreground", className)
+      className: "h-[64px] min-w-0 flex-1 gap-[3px] sm:h-[88px] sm:gap-[4px]",
+      children: /* @__PURE__ */ jsx("div", { className: "min-h-[4px] max-w-[6px] flex-1 rounded-full bg-current/15 transition-colors duration-200 motion-reduce:transition-none data-[lk-highlighted=true]:bg-current" })
     }
   );
 }

package/dist/primitives/alert.d.cts

@@ -4,7 +4,7 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const alertVariants: (props?: ({
-    variant?: "success" | "default" | "destructive" | "warning" | null | undefined;
+    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface AlertProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
     marginBottom?: "none" | "md";

package/dist/primitives/alert.d.ts

@@ -4,7 +4,7 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const alertVariants: (props?: ({
-    variant?: "success" | "default" | "destructive" | "warning" | null | undefined;
+    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface AlertProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
     marginBottom?: "none" | "md";

package/dist/primitives/badge.d.cts

@@ -4,7 +4,7 @@ import { VariantProps } from 'class-variance-authority';
 import { ElementType } from 'react';
 
 declare const badgeVariants: (props?: ({
-    variant?: "neutral" | "error" | "success" | "default" | "secondary" | "destructive" | "outline" | "warning" | "info" | null | undefined;
+    variant?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "error" | "info" | "neutral" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
     weight?: "normal" | "semibold" | "bold";

package/dist/primitives/badge.d.ts

@@ -4,7 +4,7 @@ import { VariantProps } from 'class-variance-authority';
 import { ElementType } from 'react';
 
 declare const badgeVariants: (props?: ({
-    variant?: "neutral" | "error" | "success" | "default" | "secondary" | "destructive" | "outline" | "warning" | "info" | null | undefined;
+    variant?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "error" | "info" | "neutral" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
     weight?: "normal" | "semibold" | "bold";

package/dist/primitives/bubble.d.cts

@@ -5,7 +5,7 @@ import { VariantProps } from 'class-variance-authority';
 
 declare function BubbleGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare const bubbleVariants: (props?: ({
-    variant?: "default" | "muted" | "ghost" | "secondary" | "destructive" | "outline" | "tinted" | null | undefined;
+    variant?: "default" | "muted" | "secondary" | "destructive" | "outline" | "ghost" | "tinted" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Bubble({ variant, align, className, ...props }: React.ComponentProps<"div"> & VariantProps<typeof bubbleVariants> & {
     align?: "start" | "end";

package/dist/primitives/bubble.d.ts

@@ -5,7 +5,7 @@ import { VariantProps } from 'class-variance-authority';
 
 declare function BubbleGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare const bubbleVariants: (props?: ({
-    variant?: "default" | "muted" | "ghost" | "secondary" | "destructive" | "outline" | "tinted" | null | undefined;
+    variant?: "default" | "muted" | "secondary" | "destructive" | "outline" | "ghost" | "tinted" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Bubble({ variant, align, className, ...props }: React.ComponentProps<"div"> & VariantProps<typeof bubbleVariants> & {
     align?: "start" | "end";

package/dist/primitives/button.d.cts

@@ -4,8 +4,8 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "ghost" | "secondary" | "destructive" | "outline" | "outline-muted" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
-    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "tone" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | null | undefined;
+    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "outline-muted" | "ghost" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
+    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | "tone" | null | undefined;
     width?: "auto" | "full" | "responsive" | null | undefined;
     align?: "center" | "start" | null | undefined;
     shrink?: boolean | null | undefined;

package/dist/primitives/button.d.ts

@@ -4,8 +4,8 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "ghost" | "secondary" | "destructive" | "outline" | "outline-muted" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
-    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "tone" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | null | undefined;
+    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "outline-muted" | "ghost" | "quiet" | "ghost-destructive" | "link-muted" | "inverted" | "status-error" | "status-warning" | "status-muted" | null | undefined;
+    size?: "filter" | "status" | "toolbar" | "sm" | "lg" | "default" | "micro" | "compact" | "hero" | "icon" | "icon-lg" | "icon-sm" | "icon-md" | "icon-xs" | "icon-compact" | "icon-micro" | "bare" | "voice-sm" | "voice" | "suggestion" | "tone" | null | undefined;
     width?: "auto" | "full" | "responsive" | null | undefined;
     align?: "center" | "start" | null | undefined;
     shrink?: boolean | null | undefined;

package/dist/primitives/chat.cjs

@@ -7,7 +7,7 @@
 var _chunk2BTDBZYNcjs = require('../chunk-2BTDBZYN.cjs');
 
 
-var _chunkQWUMIAYDcjs = require('../chunk-QWUMIAYD.cjs');
+var _chunkPH2TV7XIcjs = require('../chunk-PH2TV7XI.cjs');
 
 
 var _chunkYMI3X2YLcjs = require('../chunk-YMI3X2YL.cjs');
@@ -26,14 +26,15 @@ var _chunkB765DSRGcjs = require('../chunk-B765DSRG.cjs');
 
 
 
-var _chunkPD5UQEKYcjs = require('../chunk-PD5UQEKY.cjs');
-require('../chunk-34AS3OCC.cjs');
+var _chunkHSSSNAVXcjs = require('../chunk-HSSSNAVX.cjs');
+require('../chunk-6AMSRIQ4.cjs');
 
 
 
 
 
 var _chunkNWDPH2Z7cjs = require('../chunk-NWDPH2Z7.cjs');
+require('../chunk-Z2H4LJVG.cjs');
 
 
 
@@ -178,15 +179,15 @@ var ChatThread = _react.forwardRef.call(void 0,
     const markers = timelineMarkers(messages, /* @__PURE__ */ new Date());
     const anchorId = useArrivingUserTurnId(messages);
     const workspace = appearance === "workspace";
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPD5UQEKYcjs.MessageScrollerProvider, { autoScroll: true, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _chunkPD5UQEKYcjs.MessageScroller,
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHSSSNAVXcjs.MessageScrollerProvider, { autoScroll: true, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      _chunkHSSSNAVXcjs.MessageScroller,
       {
         ref,
         style: { maxHeight },
         className: _chunkKWLSBTB2cjs.cn.call(void 0, "min-h-0", className),
         children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPD5UQEKYcjs.MessageScrollerViewport, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            _chunkPD5UQEKYcjs.MessageScrollerContent,
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHSSSNAVXcjs.MessageScrollerViewport, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+            _chunkHSSSNAVXcjs.MessageScrollerContent,
             {
               className: _chunkKWLSBTB2cjs.cn.call(void 0, 
                 workspace ? "mx-auto w-full max-w-3xl gap-10 px-4 py-6 md:px-6 md:py-8" : "gap-2.5 px-px py-px"
@@ -195,7 +196,7 @@ var ChatThread = _react.forwardRef.call(void 0,
                 messages.map((m, index) => {
                   const isUser = m.role === "user";
                   if (m.status === "running") {
-                    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPD5UQEKYcjs.MessageScrollerItem, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHSSSNAVXcjs.MessageScrollerItem, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                       ChatRunningLine,
                       {
                         label: m.text || pendingLabel,
@@ -208,7 +209,7 @@ var ChatThread = _react.forwardRef.call(void 0,
                   const marker = markers[index];
                   const actions = messageActions && offersActions(m) ? messageActions(m) : null;
                   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                    _chunkPD5UQEKYcjs.MessageScrollerItem,
+                    _chunkHSSSNAVXcjs.MessageScrollerItem,
                     {
                       messageId: m.id,
                       scrollAnchor: m.id === anchorId,
@@ -264,15 +265,15 @@ var ChatThread = _react.forwardRef.call(void 0,
                     m.id
                   );
                 }),
-                pending && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPD5UQEKYcjs.MessageScrollerItem, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ChatRunningLine, { label: pendingLabel, workspace }) }),
+                pending && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHSSSNAVXcjs.MessageScrollerItem, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ChatRunningLine, { label: pendingLabel, workspace }) }),
                 footer && // Always painted: content-visibility:auto would contain the
                 // footer's paint and layout, clipping a ring or shadow at its
                 // edge and re-parenting anything fixed inside it.
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPD5UQEKYcjs.MessageScrollerItem, { className: "[content-visibility:visible]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNWDPH2Z7cjs.Message, { align: "start", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNWDPH2Z7cjs.MessageContent, { children: footer }) }) })
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHSSSNAVXcjs.MessageScrollerItem, { className: "[content-visibility:visible]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNWDPH2Z7cjs.Message, { align: "start", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNWDPH2Z7cjs.MessageContent, { children: footer }) }) })
               ]
             }
           ) }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkPD5UQEKYcjs.MessageScrollerButton, { variant: "outline", className: "rounded-full shadow-sm", children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHSSSNAVXcjs.MessageScrollerButton, { variant: "outline", className: "rounded-full shadow-sm", children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ArrowDown, { className: "h-4 w-4" }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: scrollButtonLabel })
           ] })
@@ -544,7 +545,7 @@ function ChatInput({
                       ) : null,
                       (!helperText || compact) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1" }),
                       voice && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        _chunkQWUMIAYDcjs.VoiceDictationButton,
+                        _chunkPH2TV7XIcjs.VoiceDictationButton,
                         {
                           size: "icon",
                           title: voiceTitle,
@@ -622,7 +623,7 @@ function VoiceHero({
     voiceSession ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYMI3X2YLcjs.VoiceSessionControls, { ...voiceSession, size: "hero" }),
       voice && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkQWUMIAYDcjs.VoiceDictationButton,
+        _chunkPH2TV7XIcjs.VoiceDictationButton,
         {
           size: "icon",
           title: voiceTitle,
@@ -632,7 +633,7 @@ function VoiceHero({
         }
       )
     ] }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkQWUMIAYDcjs.VoiceDictationButton,
+      _chunkPH2TV7XIcjs.VoiceDictationButton,
       {
         size: "lg",
         title: voiceTitle,

package/dist/primitives/chat.js

@@ -7,7 +7,7 @@ import {
 } from "../chunk-Z45YKVAM.js";
 import {
   VoiceDictationButton
-} from "../chunk-JKVVTFAP.js";
+} from "../chunk-ZGTPNSR7.js";
 import {
   VoiceSessionControls
 } from "../chunk-KF4X37DP.js";
@@ -26,14 +26,15 @@ import {
   MessageScrollerItem,
   MessageScrollerProvider,
   MessageScrollerViewport
-} from "../chunk-UBTLWSKK.js";
-import "../chunk-VT2WDFSU.js";
+} from "../chunk-EXXJXOUO.js";
+import "../chunk-V3XA7SDK.js";
 import {
   Message,
   MessageAction,
   MessageActions,
   MessageContent
 } from "../chunk-H4XH2PPU.js";
+import "../chunk-GA5SX7FE.js";
 import {
   InputGroup,
   InputGroupAddon,

package/dist/primitives/grid.cjs

@@ -1,47 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _chunkKWLSBTB2cjs = require('../chunk-KWLSBTB2.cjs');
+var _chunkZ2H4LJVGcjs = require('../chunk-Z2H4LJVG.cjs');
+require('../chunk-KWLSBTB2.cjs');
 
-// src/primitives/grid.tsx
-var _react = require('react');
-var _jsxruntime = require('react/jsx-runtime');
-var fixedColumns = {
-  1: "grid-cols-1",
-  2: "grid-cols-2",
-  3: "grid-cols-3",
-  4: "grid-cols-4"
-};
-var responsiveColumns = {
-  1: "grid-cols-1",
-  2: "grid-cols-1 sm:grid-cols-2",
-  3: "grid-cols-1 sm:grid-cols-3",
-  4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
-};
-var gaps = { sm: "gap-2", compact: "gap-3", md: "gap-4", lg: "gap-6" };
-var Grid = _react.forwardRef.call(void 0, function Grid2({ columns = 2, gap = "md", responsive = true, layout = "grid", maxWidth = "none", centered = false, template = "equal", as, className, ...props }, ref) {
-  const Component = _nullishCoalesce(as, () => ( "div"));
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    Component,
-    {
-      ref,
-      className: _chunkKWLSBTB2cjs.cn.call(void 0, 
-        layout === "grid" ? "grid" : "grid sm:flex sm:justify-end",
-        layout === "grid" && template === "equal" && columns !== null && (responsive ? responsiveColumns[columns] : fixedColumns[columns]),
-        layout === "responsive-actions" && columns !== null && fixedColumns[columns],
-        template === "compact-leading-three" && "grid-cols-[5rem_1fr_1fr]",
-        template === "responsive-form-row-six" && "grid-cols-1 items-center sm:grid-cols-[1fr_1.4fr_1fr_1fr_1fr_auto]",
-        template === "master-detail" && "grid-cols-1 lg:grid-cols-[360px_1fr]",
-        template === "gallery" && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-        gaps[gap],
-        maxWidth === "xl" && "max-w-2xl",
-        centered && "mx-auto",
-        className
-      ),
-      ...props
-    }
-  );
-});
 
-
-exports.Grid = Grid;
+exports.Grid = _chunkZ2H4LJVGcjs.Grid;

package/dist/primitives/grid.js

@@ -1,47 +1,8 @@
 "use client";
 import {
-  cn
-} from "../chunk-G6SRSWXB.js";
-
-// src/primitives/grid.tsx
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-var fixedColumns = {
-  1: "grid-cols-1",
-  2: "grid-cols-2",
-  3: "grid-cols-3",
-  4: "grid-cols-4"
-};
-var responsiveColumns = {
-  1: "grid-cols-1",
-  2: "grid-cols-1 sm:grid-cols-2",
-  3: "grid-cols-1 sm:grid-cols-3",
-  4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
-};
-var gaps = { sm: "gap-2", compact: "gap-3", md: "gap-4", lg: "gap-6" };
-var Grid = forwardRef(function Grid2({ columns = 2, gap = "md", responsive = true, layout = "grid", maxWidth = "none", centered = false, template = "equal", as, className, ...props }, ref) {
-  const Component = as ?? "div";
-  return /* @__PURE__ */ jsx(
-    Component,
-    {
-      ref,
-      className: cn(
-        layout === "grid" ? "grid" : "grid sm:flex sm:justify-end",
-        layout === "grid" && template === "equal" && columns !== null && (responsive ? responsiveColumns[columns] : fixedColumns[columns]),
-        layout === "responsive-actions" && columns !== null && fixedColumns[columns],
-        template === "compact-leading-three" && "grid-cols-[5rem_1fr_1fr]",
-        template === "responsive-form-row-six" && "grid-cols-1 items-center sm:grid-cols-[1fr_1.4fr_1fr_1fr_1fr_auto]",
-        template === "master-detail" && "grid-cols-1 lg:grid-cols-[360px_1fr]",
-        template === "gallery" && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-        gaps[gap],
-        maxWidth === "xl" && "max-w-2xl",
-        centered && "mx-auto",
-        className
-      ),
-      ...props
-    }
-  );
-});
+  Grid
+} from "../chunk-GA5SX7FE.js";
+import "../chunk-G6SRSWXB.js";
 export {
   Grid
 };

package/dist/primitives/message-scroller.cjs

@@ -11,8 +11,9 @@
 
 
 
-var _chunkPD5UQEKYcjs = require('../chunk-PD5UQEKY.cjs');
-require('../chunk-34AS3OCC.cjs');
+var _chunkHSSSNAVXcjs = require('../chunk-HSSSNAVX.cjs');
+require('../chunk-6AMSRIQ4.cjs');
+require('../chunk-Z2H4LJVG.cjs');
 require('../chunk-WABCLRBR.cjs');
 require('../chunk-JDEXZGIY.cjs');
 require('../chunk-KWLSBTB2.cjs');
@@ -27,4 +28,4 @@ require('../chunk-KWLSBTB2.cjs');
 
 
 
-exports.MessageScroller = _chunkPD5UQEKYcjs.MessageScroller; exports.MessageScrollerButton = _chunkPD5UQEKYcjs.MessageScrollerButton; exports.MessageScrollerContent = _chunkPD5UQEKYcjs.MessageScrollerContent; exports.MessageScrollerItem = _chunkPD5UQEKYcjs.MessageScrollerItem; exports.MessageScrollerNavigator = _chunkPD5UQEKYcjs.MessageScrollerNavigator; exports.MessageScrollerProvider = _chunkPD5UQEKYcjs.MessageScrollerProvider; exports.MessageScrollerViewport = _chunkPD5UQEKYcjs.MessageScrollerViewport; exports.useMessageScroller = _chunkPD5UQEKYcjs.useMessageScroller; exports.useMessageScrollerScrollable = _chunkPD5UQEKYcjs.useMessageScrollerScrollable; exports.useMessageScrollerVisibility = _chunkPD5UQEKYcjs.useMessageScrollerVisibility;
+exports.MessageScroller = _chunkHSSSNAVXcjs.MessageScroller; exports.MessageScrollerButton = _chunkHSSSNAVXcjs.MessageScrollerButton; exports.MessageScrollerContent = _chunkHSSSNAVXcjs.MessageScrollerContent; exports.MessageScrollerItem = _chunkHSSSNAVXcjs.MessageScrollerItem; exports.MessageScrollerNavigator = _chunkHSSSNAVXcjs.MessageScrollerNavigator; exports.MessageScrollerProvider = _chunkHSSSNAVXcjs.MessageScrollerProvider; exports.MessageScrollerViewport = _chunkHSSSNAVXcjs.MessageScrollerViewport; exports.useMessageScroller = _chunkHSSSNAVXcjs.useMessageScroller; exports.useMessageScrollerScrollable = _chunkHSSSNAVXcjs.useMessageScrollerScrollable; exports.useMessageScrollerVisibility = _chunkHSSSNAVXcjs.useMessageScrollerVisibility;

package/dist/primitives/message-scroller.js

@@ -11,8 +11,9 @@ import {
   useMessageScroller,
   useMessageScrollerScrollable,
   useMessageScrollerVisibility
-} from "../chunk-UBTLWSKK.js";
-import "../chunk-VT2WDFSU.js";
+} from "../chunk-EXXJXOUO.js";
+import "../chunk-V3XA7SDK.js";
+import "../chunk-GA5SX7FE.js";
 import "../chunk-3OWGL4Q2.js";
 import "../chunk-W326GKML.js";
 import "../chunk-G6SRSWXB.js";

package/dist/primitives/scroll-navigator.cjs

@@ -2,9 +2,10 @@
 "use client";
 
 
-var _chunk34AS3OCCcjs = require('../chunk-34AS3OCC.cjs');
+var _chunk6AMSRIQ4cjs = require('../chunk-6AMSRIQ4.cjs');
+require('../chunk-Z2H4LJVG.cjs');
 require('../chunk-WABCLRBR.cjs');
 require('../chunk-KWLSBTB2.cjs');
 
 
-exports.ScrollNavigator = _chunk34AS3OCCcjs.ScrollNavigator;
+exports.ScrollNavigator = _chunk6AMSRIQ4cjs.ScrollNavigator;

package/dist/primitives/scroll-navigator.d.cts

@@ -18,6 +18,8 @@ interface ScrollNavigatorScrollOptions {
 interface ScrollNavigatorProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
     items: readonly ScrollNavigatorItem[];
     label?: string;
+    /** Card columns above the small breakpoint; always one column on mobile. */
+    columns?: 1 | 2 | 3 | 4;
     /** Space below a sticky header inside the scroll viewport, in pixels. */
     topOffset?: number;
     /** The nearest vertically scrolling ancestor is detected by default. */

package/dist/primitives/scroll-navigator.d.ts

@@ -18,6 +18,8 @@ interface ScrollNavigatorScrollOptions {
 interface ScrollNavigatorProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
     items: readonly ScrollNavigatorItem[];
     label?: string;
+    /** Card columns above the small breakpoint; always one column on mobile. */
+    columns?: 1 | 2 | 3 | 4;
     /** Space below a sticky header inside the scroll viewport, in pixels. */
     topOffset?: number;
     /** The nearest vertically scrolling ancestor is detected by default. */

package/dist/primitives/scroll-navigator.js

@@ -2,7 +2,8 @@
 "use client";
 import {
   ScrollNavigator
-} from "../chunk-VT2WDFSU.js";
+} from "../chunk-V3XA7SDK.js";
+import "../chunk-GA5SX7FE.js";
 import "../chunk-3OWGL4Q2.js";
 import "../chunk-G6SRSWXB.js";
 export {

package/dist/primitives/voice-dictation-button.cjs

@@ -2,7 +2,7 @@
 "use client";
 
 
-var _chunkQWUMIAYDcjs = require('../chunk-QWUMIAYD.cjs');
+var _chunkPH2TV7XIcjs = require('../chunk-PH2TV7XI.cjs');
 require('../chunk-NKWHDI4C.cjs');
 require('../chunk-JDEXZGIY.cjs');
 require('../chunk-KWLSBTB2.cjs');
@@ -10,4 +10,4 @@ require('../chunk-2BSFYU22.cjs');
 require('../chunk-7Q4EFCUI.cjs');
 
 
-exports.VoiceDictationButton = _chunkQWUMIAYDcjs.VoiceDictationButton;
+exports.VoiceDictationButton = _chunkPH2TV7XIcjs.VoiceDictationButton;

package/dist/primitives/voice-dictation-button.js

@@ -2,7 +2,7 @@
 "use client";
 import {
   VoiceDictationButton
-} from "../chunk-JKVVTFAP.js";
+} from "../chunk-ZGTPNSR7.js";
 import "../chunk-5OF6D3GH.js";
 import "../chunk-W326GKML.js";
 import "../chunk-G6SRSWXB.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicbagel/saas-kit",
-  "version": "1.15.0",
+  "version": "1.17.0",
   "description": "Accessible React primitives, layout components and design tokens for SaaS apps, built on Radix UI and Tailwind CSS v4.",
   "license": "MIT",
   "keywords": [