@kitn.ai/ui 0.27.0 → 0.29.0

package/src/primitives/use-speech-recognition.ts

@@ -1,146 +0,0 @@
-import { createSignal, onCleanup } from 'solid-js';
-
-// Minimal Web Speech API surface. The DOM lib doesn't ship these types reliably
-// across TS versions, so we declare only what we touch. `webkitSpeechRecognition`
-// is the Chrome/Safari-prefixed constructor; the unprefixed one is rare.
-interface SpeechRecognitionAlternative {
-  transcript: string;
-}
-interface SpeechRecognitionResult {
-  readonly isFinal: boolean;
-  readonly length: number;
-  [index: number]: SpeechRecognitionAlternative;
-}
-interface SpeechRecognitionResultList {
-  readonly length: number;
-  [index: number]: SpeechRecognitionResult;
-}
-interface SpeechRecognitionEventLike {
-  readonly resultIndex: number;
-  readonly results: SpeechRecognitionResultList;
-}
-interface SpeechRecognitionLike {
-  lang: string;
-  continuous: boolean;
-  interimResults: boolean;
-  start(): void;
-  stop(): void;
-  abort(): void;
-  onresult: ((event: SpeechRecognitionEventLike) => void) | null;
-  onerror: ((event: { error?: string }) => void) | null;
-  onend: (() => void) | null;
-}
-type SpeechRecognitionCtor = new () => SpeechRecognitionLike;
-
-function getCtor(): SpeechRecognitionCtor | undefined {
-  if (typeof window === 'undefined') return undefined;
-  const w = window as unknown as {
-    SpeechRecognition?: SpeechRecognitionCtor;
-    webkitSpeechRecognition?: SpeechRecognitionCtor;
-  };
-  return w.SpeechRecognition ?? w.webkitSpeechRecognition;
-}
-
-export interface UseSpeechRecognitionOptions {
-  /** Emit live, non-final partials via the `onInterim` callback passed to start(). */
-  interim?: boolean;
-}
-
-export interface SpeechRecognitionStartOptions {
-  /** BCP-47 language tag, e.g. `en-US`. */
-  lang?: string;
-  /** Called with each interim (non-final) transcript when `interim` is enabled. */
-  onInterim?: (text: string) => void;
-  /**
-   * Called when the recognition session hits a runtime error (`recognition.onerror`),
-   * with the platform's error code (`network`, `not-allowed`, `no-speech`, ...) and a
-   * human-readable message. The session still ends through `onend`, so `start()` still
-   * resolves (with whatever text was captured before the error). Without this callback
-   * a runtime failure is invisible: the `error` signal is state, not a notification.
-   */
-  onError?: (error: string, message: string) => void;
-}
-
-/**
- * Wrap the browser's Web Speech `SpeechRecognition` (Chrome/Safari; no Firefox).
- * Mirrors `useVoiceRecorder`'s shape: an `isListening` signal, an `error` signal,
- * and `start`/`stop` controls. `start()` resolves with the final transcript when
- * recognition ends; `stop()` ends the in-progress session (resolving start()).
- *
- * Caveat (documented at the element): in Chrome this is cloud-based — audio is
- * sent to Google — so it is "native to the browser," not on-device/private.
- */
-export function useSpeechRecognition(options: UseSpeechRecognitionOptions = {}) {
-  const [isListening, setIsListening] = createSignal(false);
-  const [error, setError] = createSignal<string | null>(null);
-
-  const isSupported = getCtor() !== undefined;
-
-  let recognition: SpeechRecognitionLike | undefined;
-  let resolveText: ((text: string) => void) | undefined;
-  let finalText = '';
-
-  function start(opts: SpeechRecognitionStartOptions = {}): Promise<string> {
-    setError(null);
-    finalText = '';
-    const Ctor = getCtor();
-    if (!Ctor) {
-      const message = 'SpeechRecognition is not supported in this browser';
-      setError(message);
-      return Promise.reject(new Error(message));
-    }
-    try {
-      recognition = new Ctor();
-      if (opts.lang) recognition.lang = opts.lang;
-      recognition.interimResults = options.interim === true;
-      recognition.continuous = false;
-
-      recognition.onresult = (event) => {
-        let interim = '';
-        for (let i = event.resultIndex; i < event.results.length; i++) {
-          const result = event.results[i];
-          const transcript = result[0]?.transcript ?? '';
-          if (result.isFinal) {
-            finalText += transcript;
-          } else {
-            interim += transcript;
-          }
-        }
-        if (interim && opts.onInterim) opts.onInterim(interim);
-      };
-
-      recognition.onerror = (event) => {
-        const code = event.error ?? 'unknown';
-        const message = `Speech recognition error: ${code}`;
-        setError(message);
-        opts.onError?.(code, message);
-      };
-
-      recognition.onend = () => {
-        setIsListening(false);
-        resolveText?.(finalText);
-        recognition = undefined;
-      };
-
-      recognition.start();
-      setIsListening(true);
-      return new Promise<string>((resolve) => { resolveText = resolve; });
-    } catch (err) {
-      setError(err instanceof Error ? err.message : 'Speech recognition failed to start');
-      setIsListening(false);
-      throw err;
-    }
-  }
-
-  function stop() {
-    if (recognition && isListening()) {
-      recognition.stop();
-    }
-  }
-
-  onCleanup(() => {
-    if (recognition) recognition.abort();
-  });
-
-  return { isSupported, isListening, error, start, stop };
-}

package/src/primitives/use-stick-to-bottom.ts

@@ -1,75 +0,0 @@
-import { createSignal, onCleanup } from 'solid-js';
-
-const SCROLL_THRESHOLD = 50;
-
-export function useStickToBottom() {
-  const [isAtBottom, setIsAtBottom] = createSignal(true);
-  let containerEl: HTMLElement | undefined;
-  let shouldStick = true;
-
-  function checkIfAtBottom() {
-    if (!containerEl) return;
-    const { scrollTop, scrollHeight, clientHeight } = containerEl;
-    const atBottom = scrollHeight - scrollTop - clientHeight < SCROLL_THRESHOLD;
-    setIsAtBottom(atBottom);
-    shouldStick = atBottom;
-  }
-
-  function scrollToBottom(behavior: ScrollBehavior = 'smooth') {
-    if (!containerEl) return;
-    if (typeof containerEl.scrollTo === 'function') {
-      containerEl.scrollTo({ top: containerEl.scrollHeight, behavior });
-    } else {
-      containerEl.scrollTop = containerEl.scrollHeight;
-    }
-    shouldStick = true;
-    setIsAtBottom(true);
-  }
-
-  let pendingFrame: number | undefined;
-
-  /**
-   * `cancelAnimationFrame`, captured at SETUP -- not called bare at cleanup.
-   *
-   * Cleanup is not guaranteed to run while the page that mounted this
-   * primitive is still standing: a host can tear its DOM globals down first
-   * (`component-register`'s `disconnectedCallback` defers a microtask; a
-   * test environment deletes the globals synchronously right after
-   * detaching). A bare `cancelAnimationFrame` there throws, surfacing as an
-   * unhandled rejection that fails a run in which every test passed --
-   * see tests/components/teardown-without-dom-globals.test.tsx, and the
-   * same pattern in create-tween.ts.
-   *
-   * Guarded because "setup" here is the component body, and a server render
-   * executes component bodies too; Node has neither global.
-   */
-  const cancelFrame = typeof cancelAnimationFrame === 'function'
-    ? cancelAnimationFrame.bind(globalThis)
-    : () => {};
-
-  function onNewContent() {
-    if (shouldStick) {
-      pendingFrame = requestAnimationFrame(() => {
-        pendingFrame = undefined;
-        scrollToBottom('instant');
-      });
-    }
-  }
-
-  function ref(el: HTMLElement) {
-    containerEl = el;
-    el.addEventListener('scroll', checkIfAtBottom, { passive: true });
-    const observer = new MutationObserver(onNewContent);
-    observer.observe(el, { childList: true, subtree: true, characterData: true });
-    onCleanup(() => {
-      el.removeEventListener('scroll', checkIfAtBottom);
-      observer.disconnect();
-      if (pendingFrame !== undefined) {
-        cancelFrame(pendingFrame);
-        pendingFrame = undefined;
-      }
-    });
-  }
-
-  return { ref, isAtBottom, scrollToBottom };
-}

package/src/primitives/use-text-stream.ts

@@ -1,143 +0,0 @@
-import { createSignal, onCleanup } from 'solid-js';
-
-export interface UseTextStreamOptions {
-  mode: 'typewriter' | 'fade';
-  speed?: number;
-  characterChunkSize?: number;
-  fadeDuration?: number;
-  segmentDelay?: number;
-}
-
-/** Default fade-in duration for a given speed (ms) — shared with ResponseStream. */
-export function defaultFadeDuration(speed: number): number {
-  const s = Math.min(100, Math.max(1, speed));
-  return Math.round(1000 / Math.sqrt(s));
-}
-
-/** Default per-segment stagger for a given speed (ms) — shared with ResponseStream. */
-export function defaultSegmentDelay(speed: number): number {
-  const s = Math.min(100, Math.max(1, speed));
-  return Math.max(1, Math.round(100 / Math.sqrt(s)));
-}
-
-export interface TextStreamSegment {
-  text: string;
-  index: number;
-}
-
-export function useTextStream(options: UseTextStreamOptions) {
-  const speed = options.speed ?? 20;
-  const chunkSize = options.characterChunkSize ?? 3;
-
-  const [displayedText, setDisplayedText] = createSignal('');
-  const [isComplete, setIsComplete] = createSignal(true);
-  const [segments, setSegments] = createSignal<TextStreamSegment[]>([]);
-
-  let fullText = '';
-  let charIndex = 0;
-  let intervalId: ReturnType<typeof setInterval> | undefined;
-  let completeTimeoutId: ReturnType<typeof setTimeout> | undefined;
-  let isPaused = false;
-  let asyncIterator: AsyncIterator<string> | undefined;
-
-  function clearInterval_() {
-    if (intervalId !== undefined) {
-      clearInterval(intervalId);
-      intervalId = undefined;
-    }
-    if (completeTimeoutId !== undefined) {
-      clearTimeout(completeTimeoutId);
-      completeTimeoutId = undefined;
-    }
-  }
-
-  function typewriterTick() {
-    if (isPaused) return;
-    if (charIndex >= fullText.length) {
-      if (!asyncIterator) {
-        clearInterval_();
-        setIsComplete(true);
-      }
-      return;
-    }
-    const end = Math.min(charIndex + chunkSize, fullText.length);
-    charIndex = end;
-    setDisplayedText(fullText.slice(0, charIndex));
-  }
-
-  async function consumeAsyncIterable(source: AsyncIterable<string>) {
-    asyncIterator = source[Symbol.asyncIterator]();
-    try {
-      while (true) {
-        const { value, done } = await asyncIterator.next();
-        if (done) break;
-        if (value) {
-          fullText += value;
-          setSegments((prev) => [...prev, { text: value, index: prev.length }]);
-        }
-      }
-    } finally {
-      asyncIterator = undefined;
-    }
-  }
-
-  function startStreaming(source: string | AsyncIterable<string>) {
-    reset();
-    setIsComplete(false);
-
-    if (typeof source === 'string') {
-      fullText = source;
-      if (options.mode === 'typewriter') {
-        intervalId = setInterval(typewriterTick, speed);
-      } else {
-        // Deliver all segments at once — CSS animation-delay handles staggered fade-in
-        const words = source.split(/(\s+)/).filter(Boolean);
-        setSegments(words.map((text, index) => ({ text, index })));
-        setDisplayedText(source);
-        // Completion announces after the staggered animation has had time to
-        // play: segments * per-segment delay + one fade duration — the promise
-        // the comment here used to make with no code behind it (nothing on this
-        // path ever called setIsComplete(true), so kai-complete never fired for
-        // a fade-mode string). A timer, not a synchronous write: the consumer
-        // attaches its kai-complete listener a beat after mount, and a
-        // same-tick fire races past it.
-        const segDelay = typeof options.segmentDelay === 'number'
-          ? Math.max(0, options.segmentDelay)
-          : defaultSegmentDelay(speed);
-        const fadeDur = options.fadeDuration ?? defaultFadeDuration(speed);
-        completeTimeoutId = setTimeout(() => {
-          completeTimeoutId = undefined;
-          setIsComplete(true);
-        }, words.length * segDelay + fadeDur);
-      }
-    } else {
-      if (options.mode === 'typewriter') {
-        intervalId = setInterval(typewriterTick, speed);
-      }
-      consumeAsyncIterable(source).then(() => {
-        if (options.mode === 'fade') {
-          setDisplayedText(fullText);
-          setIsComplete(true);
-        }
-      });
-    }
-  }
-
-  function pause() { isPaused = true; }
-  function resume() { isPaused = false; }
-
-  function reset() {
-    clearInterval_();
-    fullText = '';
-    charIndex = 0;
-    isPaused = false;
-    asyncIterator = undefined;
-    setDisplayedText('');
-    setIsComplete(true);
-    setSegments([]);
-  }
-
-  onCleanup(() => clearInterval_());
-
-  return { displayedText, isComplete, segments, startStreaming, pause, resume, reset };
-}

package/src/primitives/use-voice-recorder.ts

@@ -1,62 +0,0 @@
-import { createSignal, onCleanup } from 'solid-js';
-
-export interface UseVoiceRecorderOptions {
-  mimeType?: string;
-}
-
-export function useVoiceRecorder(options: UseVoiceRecorderOptions = {}) {
-  const mimeType = options.mimeType ?? 'audio/webm;codecs=opus';
-  const [isRecording, setIsRecording] = createSignal(false);
-  const [error, setError] = createSignal<string | null>(null);
-  const [stream, setStream] = createSignal<MediaStream | undefined>();
-
-  let mediaRecorder: MediaRecorder | undefined;
-  let chunks: Blob[] = [];
-  let resolveBlob: ((blob: Blob) => void) | undefined;
-
-  async function start(): Promise<Blob> {
-    setError(null);
-    chunks = [];
-    try {
-      const mediaStream = await navigator.mediaDevices.getUserMedia({ audio: true });
-      setStream(mediaStream);
-      mediaRecorder = new MediaRecorder(mediaStream, { mimeType });
-      mediaRecorder.ondataavailable = (e) => {
-        if (e.data.size > 0) chunks.push(e.data);
-      };
-      mediaRecorder.onstop = () => {
-        const blob = new Blob(chunks, { type: mimeType });
-        mediaStream.getTracks().forEach((t) => t.stop());
-        setStream(undefined);
-        setIsRecording(false);
-        resolveBlob?.(blob);
-      };
-      mediaRecorder.start();
-      setIsRecording(true);
-      return new Promise<Blob>((resolve) => { resolveBlob = resolve; });
-    } catch (err) {
-      // getUserMedia may have already succeeded (stream() is live) even
-      // though something after it threw, e.g. an unsupported mimeType
-      // rejected by `new MediaRecorder(...)`. Leaving that stream open would
-      // keep the microphone live with no indication anything is recording.
-      const liveStream = stream();
-      if (liveStream) {
-        liveStream.getTracks().forEach((t) => t.stop());
-        setStream(undefined);
-      }
-      setError(err instanceof Error ? err.message : 'Microphone access denied');
-      setIsRecording(false);
-      throw err;
-    }
-  }
-
-  function stop() {
-    if (mediaRecorder && mediaRecorder.state === 'recording') {
-      mediaRecorder.stop();
-    }
-  }
-
-  onCleanup(() => stop());
-
-  return { isRecording, error, stream, start, stop };
-}