@epicbagel/saas-kit 1.7.0 → 1.11.0

package/README.md

@@ -7,6 +7,7 @@ dark modes.
 
 ## Install
 
+
 ```bash
 npm install @epicbagel/saas-kit
 ```
@@ -14,6 +15,75 @@ npm install @epicbagel/saas-kit
 Peer dependencies: `react` and `react-dom` (18 or 19), `lucide-react`
 (`>=0.400.0 <2`), `react-icons` (5) and `tailwindcss` (4.3 or later).
 
+## Live voice in Chat
+
+Pass a controlled `voiceSession` to `Chat` or `ChatInput` to show start, mute,
+end, connection and speaking controls alongside a separate dictation mic.
+Dictation is disabled during a live call and the typed draft is preserved.
+The active session appears as a compact horizontal strip above the text field:
+microphone badge, audio bars, status, latest utterance, **Mute** and **End voice**.
+It wraps its controls on narrow screens. Pass the latest user utterance as
+`voiceSession.transcript`; this is plain preview text and never submits or replaces
+the typed draft. `VoiceSessionControls` is also exported on its own.
+The host owns audio, authentication, transcripts, retries and cleanup; the kit
+does not import a voice provider. Stop and release audio tracks before setting
+`state: "error"` or unmounting. Every label is replaceable through `labels`.
+
+```tsx
+<Chat messages={messages} onSend={sendMessage} voiceSession={{
+  state: voiceState, muted, error, transcript: latestUserUtterance, audioLevels,
+  onStart: startVoice, onEnd: endVoice, onMutedChange: setMuted,
+}} />
+```
+
+## API dictation
+
+Wrap the application in `DictationProvider` to use an authenticated transcription
+API for every `VoiceDictationButton`, including buttons nested in chat, forms or
+another component library. A compact recorder shows the elapsed time and LiveKit
+audio bars measured from the recording stream, without opening a second microphone.
+It also works with hidden/programmatic triggers and inside another dialog.
+The recorder runs until **Done**, shows
+**Transcribing…**, then commits the returned text once. Failed requests keep the
+take available for retry. Cancel stops microphone tracks, aborts the request and
+ignores a late answer. The kit never persists audio or knows provider credentials.
+
+```tsx
+import { DictationProvider } from "@epicbagel/saas-kit/primitives/dictation-provider";
+
+<DictationProvider scopeKey={`${actorId}:${workspaceId}`} transcribe={async (audio, { language, signal }) => {
+  // The host sends the Blob to its authenticated API. Preserve audio.type
+  // and pass signal to fetch; keep provider keys on the server.
+  return transcribeRecording(audio, { language, signal });
+}}>
+  <App />
+</DictationProvider>
+```
+
+Set `scopeKey` from the acting user and workspace (including impersonation, if
+the app supports it). A changed scope discards the active take, stops recording
+and aborts transcription without remounting the application. Responses from the
+previous scope are ignored even before the cleanup effect runs; a failed take
+cannot be retried under the new scope.
+
+`useDictation` (`hooks/use-dictation`) exposes the same capture lifecycle for a
+custom trigger such as press-and-hold: `start()`, `stop()`, `retry()`, `cancel()`,
+`state`, `supported`, `transcript`, `interimTranscript`, `error` and `canRetry`.
+For API recording, `audioLevels` exposes a subscribable snapshot of real microphone
+levels. Subscribe only the waveform to keep audio sampling out of form renders;
+native recognition has no audio-level source.
+`stop()` and `retry()` return the completed text, or `null` after cancellation or
+failure. Choose either that result or `onTranscript` to commit; using both would
+duplicate the host action. The callback receives one complete API transcript,
+or finalized chunks with native recognition. API recording requires HTTPS (or
+localhost), microphone permission and MediaRecorder. It does not produce live
+interim text; the live voice controls are a separate feature.
+
+Without a provider, controls retain browser-native speech recognition. The
+private ui-kit's `VoiceInput` uses this same provider and capture hook, and its
+provider export is a shim of this exact context.
+
+
 ## Styles
 
 If the app has no Tailwind entry of its own, import the complete stylesheet:
@@ -104,7 +174,8 @@ public in 1.1.0, and these were the decisions about its props then:
   for the textarea's starting height; there is no class-name or `rows` prop.
   The textarea grows with its text (`field-sizing: content`).
 - **Compact mobile replies.** Opt into `Chat.mobileCompactComposer` to fold
-  an active conversation's empty composer into one row below 768px. Focusing
+  an active conversation's empty composer into a short text row above its
+  controls below 768px, keeping all four actions clear of the text. Focusing
   its textarea expands it; leaving the composer folds it again only when
   there is no draft or staged file. The same textarea stays mounted, and
   its file menu and voice dialog keep an editing session open. New

package/THIRD_PARTY_NOTICES.md

@@ -268,3 +268,17 @@ The Apache License, Version 2.0:
 
    END OF TERMS AND CONDITIONS
 ```
+
+
+## LiveKit Agents UI
+
+Source: https://github.com/livekit/components-js/tree/3f74806f1c8484b2eb2fd40773dd1be80760750c/packages/shadcn
+
+`primitives/agent-audio-visualizer-bar` and
+`hooks/use-agent-audio-visualizer-bar` are adapted from LiveKit's
+`components/agents-ui/agent-audio-visualizer-bar.tsx` and
+`hooks/agents-ui/use-agent-audio-visualizer-bar.ts` at that commit.
+LiveKit contributors license them under Apache-2.0 (full license above).
+The compiled output includes these adaptations. We removed the LiveKit React
+track hook and accept host-supplied volume bands, clamp band values/counts,
+and respect reduced motion and stop idle animation loops.

package/dist/chunk-2BSFYU22.cjs

@@ -0,0 +1,71 @@
+"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";
+
+// src/hooks/use-agent-audio-visualizer-bar.ts
+var _react = require('react');
+function generateConnectingSequenceBar(columns) {
+  const seq = [];
+  for (let x = 0; x < columns; x++) {
+    seq.push([x, columns - 1 - x]);
+  }
+  return seq;
+}
+function generateListeningSequenceBar(columns) {
+  const center = Math.floor(columns / 2);
+  const noIndex = -1;
+  return [[center], [noIndex]];
+}
+function useAgentAudioVisualizerBarAnimator(state, columns, interval) {
+  const [index, setIndex] = _react.useState.call(void 0, 0);
+  const [sequence, setSequence] = _react.useState.call(void 0, [[]]);
+  _react.useEffect.call(void 0, () => {
+    if (state === "thinking") {
+      setSequence(generateListeningSequenceBar(columns));
+    } else if (state === "connecting" || state === "initializing") {
+      const sequence2 = [...generateConnectingSequenceBar(columns)];
+      setSequence(sequence2);
+    } else if (state === "listening") {
+      setSequence(generateListeningSequenceBar(columns));
+    } else if (state === void 0 || state === "speaking") {
+      setSequence([new Array(columns).fill(0).map((_, idx) => idx)]);
+    } else {
+      setSequence([[]]);
+    }
+    setIndex(0);
+  }, [state, columns]);
+  const animationFrameId = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
+    if (sequence.length < 2) return;
+    const preference = _optionalChain([window, 'access', _2 => _2.matchMedia, 'optionalCall', _3 => _3("(prefers-reduced-motion: reduce)")]);
+    const stop = () => {
+      if (animationFrameId.current !== null) cancelAnimationFrame(animationFrameId.current);
+      animationFrameId.current = null;
+    };
+    const start = () => {
+      stop();
+      if (_optionalChain([preference, 'optionalAccess', _4 => _4.matches])) {
+        setIndex(0);
+        return;
+      }
+      let startTime = performance.now();
+      const animate = (time) => {
+        if (time - startTime >= interval) {
+          setIndex((prev) => prev + 1);
+          startTime = time;
+        }
+        animationFrameId.current = requestAnimationFrame(animate);
+      };
+      animationFrameId.current = requestAnimationFrame(animate);
+    };
+    start();
+    _optionalChain([preference, 'optionalAccess', _5 => _5.addEventListener, 'call', _6 => _6("change", start)]);
+    return () => {
+      stop();
+      _optionalChain([preference, 'optionalAccess', _7 => _7.removeEventListener, 'call', _8 => _8("change", start)]);
+    };
+  }, [interval, columns, state, sequence.length]);
+  return _nullishCoalesce(sequence[index % sequence.length], () => ( []));
+}
+
+
+
+exports.useAgentAudioVisualizerBarAnimator = useAgentAudioVisualizerBarAnimator;

package/dist/chunk-5OF6D3GH.js

@@ -0,0 +1,158 @@
+"use client";
+import {
+  cn
+} from "./chunk-G6SRSWXB.js";
+import {
+  useAgentAudioVisualizerBarAnimator
+} from "./chunk-GJ7S3L6R.js";
+
+// src/primitives/agent-audio-visualizer-bar.tsx
+import React, {
+  Children,
+  cloneElement,
+  isValidElement,
+  useMemo
+} from "react";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+function normalizeVolumeBands(bands, count) {
+  if (bands.length === count) return bands;
+  if (bands.length > count) return bands.slice(0, count);
+  const lastValue = bands[bands.length - 1] ?? 0;
+  return [...bands, ...new Array(count - bands.length).fill(lastValue)];
+}
+function cloneSingleChild(children, props, key) {
+  return Children.map(children, (child) => {
+    if (isValidElement(child) && Children.only(children)) {
+      const childProps = child.props;
+      if (childProps.className) {
+        props ??= {};
+        props.className = cn(childProps.className, props.className);
+        props.style = {
+          ...childProps.style,
+          ...props.style
+        };
+      }
+      return cloneElement(child, { ...props, key: key ? String(key) : void 0 });
+    }
+    return child;
+  });
+}
+var AgentAudioVisualizerBarElementVariants = cva(
+  [
+    "rounded-full transition-colors duration-250 ease-linear motion-reduce:transition-none",
+    "bg-current/10 data-[lk-highlighted=true]:bg-current"
+  ],
+  {
+    variants: {
+      size: {
+        icon: "w-[4px] min-h-[4px]",
+        sm: "w-[8px] min-h-[8px]",
+        md: "w-[16px] min-h-[16px]",
+        lg: "w-[32px] min-h-[32px]",
+        xl: "w-[64px] min-h-[64px]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var AgentAudioVisualizerBarVariants = cva("relative flex items-center justify-center", {
+  variants: {
+    size: {
+      icon: "h-[24px] gap-[2px]",
+      sm: "h-[56px] gap-[4px]",
+      md: "h-[112px] gap-[8px]",
+      lg: "h-[224px] gap-[16px]",
+      xl: "h-[448px] gap-[32px]"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+function AgentAudioVisualizerBar({
+  size = "md",
+  state = "connecting",
+  color,
+  barCount,
+  volumeBands,
+  className,
+  children,
+  style,
+  ...props
+}) {
+  const _barCount = useMemo(() => {
+    if (barCount && Number.isFinite(barCount)) {
+      return Math.max(1, Math.min(64, Math.floor(barCount)));
+    }
+    switch (size) {
+      case "icon":
+      case "sm":
+        return 3;
+      default:
+        return 5;
+    }
+  }, [barCount, size]);
+  const resolvedVolumeBands = normalizeVolumeBands(volumeBands ?? [], _barCount).map((value) => Number.isFinite(value) ? Math.max(0, Math.min(1, value)) : 0);
+  const sequencerInterval = useMemo(() => {
+    switch (state) {
+      case "connecting":
+        return 2e3 / _barCount;
+      case "initializing":
+        return 2e3;
+      case "listening":
+        return 500;
+      case "thinking":
+        return 150;
+      default:
+        return 1e3;
+    }
+  }, [state, _barCount]);
+  const meteredListening = state === "listening" && volumeBands !== void 0;
+  const highlightedIndices = useAgentAudioVisualizerBarAnimator(
+    meteredListening ? "speaking" : state,
+    _barCount,
+    sequencerInterval
+  );
+  const bands = useMemo(
+    () => state === "speaking" || meteredListening ? resolvedVolumeBands : new Array(_barCount).fill(0),
+    [state, meteredListening, resolvedVolumeBands, _barCount]
+  );
+  if (children && Array.isArray(children)) {
+    throw new Error("AgentAudioVisualizerBar children must be a single element.");
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-lk-state": state,
+      style: { ...style, color },
+      className: cn(AgentAudioVisualizerBarVariants({ size }), className),
+      ...props,
+      children: bands.map(
+        (band, idx) => children ? /* @__PURE__ */ jsx(React.Fragment, { children: cloneSingleChild(children, {
+          "data-lk-index": idx,
+          "data-lk-highlighted": highlightedIndices.includes(idx),
+          style: { height: `${band * 100}%` }
+        }) }, idx) : /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-lk-index": idx,
+            "data-lk-highlighted": highlightedIndices.includes(idx),
+            style: { height: `${band * 100}%` },
+            className: cn(AgentAudioVisualizerBarElementVariants({ size }))
+          },
+          idx
+        )
+      )
+    }
+  );
+}
+
+export {
+  normalizeVolumeBands,
+  AgentAudioVisualizerBarElementVariants,
+  AgentAudioVisualizerBarVariants,
+  AgentAudioVisualizerBar
+};

package/dist/chunk-7QTFYEPE.cjs

@@ -0,0 +1,153 @@
+"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 _chunkNKWHDI4Ccjs = require('./chunk-NKWHDI4C.cjs');
+
+
+var _chunkJDEXZGIYcjs = require('./chunk-JDEXZGIY.cjs');
+
+
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+
+// src/primitives/voice-session-controls.tsx
+var _react = require('react');
+var _lucidereact = require('lucide-react');
+var _jsxruntime = require('react/jsx-runtime');
+var SILENCE = [];
+var silence = () => SILENCE;
+var noSubscription = () => () => {
+};
+var DEFAULT_LABELS = {
+  disconnected: "Voice chat",
+  connecting: "Connecting\u2026",
+  listening: "Listening\u2026",
+  thinking: "Thinking\u2026",
+  speaking: "Speaking",
+  reconnecting: "Reconnecting\u2026",
+  error: "Voice chat unavailable",
+  start: "Start voice chat",
+  end: "End voice chat",
+  mute: "Mute microphone",
+  unmute: "Unmute microphone",
+  muted: "Microphone muted",
+  retry: "Retry voice chat",
+  endShort: "End voice",
+  muteShort: "Mute",
+  unmuteShort: "Unmute",
+  transcriptPlaceholder: "Speak to continue the conversation."
+};
+function VoiceSessionControls({
+  state,
+  onStart,
+  onEnd,
+  muted = false,
+  onMutedChange,
+  disabled = false,
+  error,
+  transcript,
+  volumeBands,
+  audioLevels,
+  labels,
+  size = "icon",
+  className
+}) {
+  const liveBands = _react.useSyncExternalStore.call(void 0, _nullishCoalesce(_optionalChain([audioLevels, 'optionalAccess', _ => _.subscribe]), () => ( noSubscription)), _nullishCoalesce(_optionalChain([audioLevels, 'optionalAccess', _2 => _2.getSnapshot]), () => ( silence)), silence);
+  const copy = { ...DEFAULT_LABELS, ...labels };
+  const active = state !== "disconnected" && state !== "error";
+  const waiting = state === "connecting" || state === "reconnecting";
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "div",
+    {
+      "data-slot": "voice-session-controls",
+      "data-state": state,
+      className: _chunkKWLSBTB2cjs.cn.call(void 0, "min-w-0", active ? "@container/voice w-full" : "flex flex-wrap items-center gap-2", className),
+      children: [
+        active ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "data-slot": "voice-session-strip", className: "flex w-full flex-wrap items-center gap-4 bg-primary/5 p-4 @2xl/voice:flex-nowrap @2xl/voice:px-5", children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 basis-full items-center gap-3 @2xl/voice:basis-auto @2xl/voice:gap-4", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "aria-hidden": "true", className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+              "flex size-12 shrink-0 items-center justify-center rounded-full ring-8 ring-primary/5 @sm/voice:size-14",
+              muted ? "bg-muted text-muted-foreground" : "bg-primary text-primary-foreground"
+            ), children: muted ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MicOff, { className: "size-5" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Mic, { className: "size-5" }) }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _chunkNKWHDI4Ccjs.AgentAudioVisualizerBar,
+              {
+                "aria-hidden": "true",
+                size: "sm",
+                barCount: 5,
+                className: "shrink-0 text-primary [&>div]:w-1",
+                state: muted && state === "listening" ? "disconnected" : state === "reconnecting" ? "connecting" : state,
+                volumeBands: muted && state === "listening" ? SILENCE : _nullishCoalesce(volumeBands, () => ( liveBands))
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "min-w-0 flex-1 space-y-1", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { role: "status", className: "block text-sm font-medium text-primary", children: muted && state === "listening" ? copy.muted : copy[state] }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "p",
+                {
+                  "data-slot": "voice-session-transcript",
+                  title: transcript || void 0,
+                  className: _chunkKWLSBTB2cjs.cn.call(void 0, "truncate text-sm font-normal", transcript ? "text-foreground" : "text-muted-foreground"),
+                  children: transcript || copy.transcriptPlaceholder
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ml-auto flex shrink-0 items-center gap-2", children: [
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+              _chunkJDEXZGIYcjs.Button,
+              {
+                type: "button",
+                variant: "outline",
+                size: "sm",
+                className: "min-h-[44px] shrink-0 rounded-xl bg-background px-3 text-foreground",
+                "aria-label": muted ? copy.unmute : copy.mute,
+                title: muted ? copy.unmute : copy.mute,
+                "aria-pressed": muted,
+                disabled: waiting,
+                onClick: () => onMutedChange(!muted),
+                children: [
+                  muted ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Mic, { "aria-hidden": "true" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MicOff, { "aria-hidden": "true" }),
+                  muted ? copy.unmuteShort : copy.muteShort
+                ]
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+              _chunkJDEXZGIYcjs.Button,
+              {
+                type: "button",
+                variant: "outline",
+                size: "sm",
+                className: "min-h-[44px] shrink-0 rounded-xl bg-background px-3 text-foreground",
+                "aria-label": copy.end,
+                title: copy.end,
+                onClick: onEnd,
+                children: [
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Square, { "aria-hidden": "true", className: "fill-current" }),
+                  copy.endShort
+                ]
+              }
+            )
+          ] })
+        ] }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkJDEXZGIYcjs.Button,
+          {
+            type: "button",
+            size: "icon",
+            shape: "circle",
+            disabled,
+            onClick: onStart,
+            "aria-label": state === "error" ? copy.retry : copy.start,
+            title: state === "error" ? copy.retry : copy.start,
+            className: _chunkKWLSBTB2cjs.cn.call(void 0, "min-h-[44px] min-w-[44px] shrink-0 rounded-full", size === "hero" && "size-24 [&_svg]:size-7"),
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.AudioLines, { "aria-hidden": "true" })
+          }
+        ),
+        state === "error" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { role: "alert", className: "basis-full text-xs text-destructive", children: error || copy.error })
+      ]
+    }
+  );
+}
+
+
+
+exports.VoiceSessionControls = VoiceSessionControls;

package/dist/{chunk-GTVSRRE3.cjs → chunk-BGCNGYPL.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _chunkMU4F3DSWcjs = require('./chunk-MU4F3DSW.cjs');
+var _chunkFARCLWLUcjs = require('./chunk-FARCLWLU.cjs');
 
 
 var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
@@ -38,7 +38,7 @@ function CodeBlock({
       }
     ),
     copy ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkMU4F3DSWcjs.CopyButton,
+      _chunkFARCLWLUcjs.CopyButton,
       {
         text: copyText,
         label: copyLabel,

package/dist/{chunk-QTWJQQDH.cjs → chunk-FBVZRRA4.cjs}

@@ -7,16 +7,16 @@ var _chunkEUFV25KLcjs = require('./chunk-EUFV25KL.cjs');
 var _chunk7YCKII7Gcjs = require('./chunk-7YCKII7G.cjs');
 
 
-var _chunkCRTH5GJ5cjs = require('./chunk-CRTH5GJ5.cjs');
+var _chunkMW67PHAQcjs = require('./chunk-MW67PHAQ.cjs');
 
 
-var _chunkLELBCBDTcjs = require('./chunk-LELBCBDT.cjs');
 
 
 
+var _chunkU2NES7VRcjs = require('./chunk-U2NES7VR.cjs');
 
 
-var _chunkU2NES7VRcjs = require('./chunk-U2NES7VR.cjs');
+var _chunkLELBCBDTcjs = require('./chunk-LELBCBDT.cjs');
 
 
 
@@ -32,10 +32,10 @@ var _chunkPQUSJEXLcjs = require('./chunk-PQUSJEXL.cjs');
 var _chunkJDEXZGIYcjs = require('./chunk-JDEXZGIY.cjs');
 
 
-var _chunkR35FT53Gcjs = require('./chunk-R35FT53G.cjs');
+var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
 
 
-var _chunkKWLSBTB2cjs = require('./chunk-KWLSBTB2.cjs');
+var _chunkR35FT53Gcjs = require('./chunk-R35FT53G.cjs');
 
 // src/primitives/resource-list.tsx
 var _lucidereact = require('lucide-react');
@@ -268,7 +268,7 @@ function ResourceList({
   const controlsVisible = !(hideControlsWhenEmpty && !loading && !error && _optionalChain([data, 'optionalAccess', _5 => _5.length]) === 0);
   const filterOnQuickRow = filterBarVisible && !toolbarHasOtherControls && hasQuickFilters;
   const filterBarNode = filterBarVisible ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkCRTH5GJ5cjs.FilterBar,
+    _chunkMW67PHAQcjs.FilterBar,
     {
       filters: filterSchema,
       onFiltersChange,

package/dist/chunk-GJ7S3L6R.js

@@ -0,0 +1,71 @@
+"use client";
+
+// src/hooks/use-agent-audio-visualizer-bar.ts
+import { useEffect, useRef, useState } from "react";
+function generateConnectingSequenceBar(columns) {
+  const seq = [];
+  for (let x = 0; x < columns; x++) {
+    seq.push([x, columns - 1 - x]);
+  }
+  return seq;
+}
+function generateListeningSequenceBar(columns) {
+  const center = Math.floor(columns / 2);
+  const noIndex = -1;
+  return [[center], [noIndex]];
+}
+function useAgentAudioVisualizerBarAnimator(state, columns, interval) {
+  const [index, setIndex] = useState(0);
+  const [sequence, setSequence] = useState([[]]);
+  useEffect(() => {
+    if (state === "thinking") {
+      setSequence(generateListeningSequenceBar(columns));
+    } else if (state === "connecting" || state === "initializing") {
+      const sequence2 = [...generateConnectingSequenceBar(columns)];
+      setSequence(sequence2);
+    } else if (state === "listening") {
+      setSequence(generateListeningSequenceBar(columns));
+    } else if (state === void 0 || state === "speaking") {
+      setSequence([new Array(columns).fill(0).map((_, idx) => idx)]);
+    } else {
+      setSequence([[]]);
+    }
+    setIndex(0);
+  }, [state, columns]);
+  const animationFrameId = useRef(null);
+  useEffect(() => {
+    if (sequence.length < 2) return;
+    const preference = window.matchMedia?.("(prefers-reduced-motion: reduce)");
+    const stop = () => {
+      if (animationFrameId.current !== null) cancelAnimationFrame(animationFrameId.current);
+      animationFrameId.current = null;
+    };
+    const start = () => {
+      stop();
+      if (preference?.matches) {
+        setIndex(0);
+        return;
+      }
+      let startTime = performance.now();
+      const animate = (time) => {
+        if (time - startTime >= interval) {
+          setIndex((prev) => prev + 1);
+          startTime = time;
+        }
+        animationFrameId.current = requestAnimationFrame(animate);
+      };
+      animationFrameId.current = requestAnimationFrame(animate);
+    };
+    start();
+    preference?.addEventListener("change", start);
+    return () => {
+      stop();
+      preference?.removeEventListener("change", start);
+    };
+  }, [interval, columns, state, sequence.length]);
+  return sequence[index % sequence.length] ?? [];
+}
+
+export {
+  useAgentAudioVisualizerBarAnimator
+};