@leia-org/luke-client 0.1.0

package/README.md

@@ -0,0 +1,69 @@
+# @leia-org/luke-client
+
+React client library for the Luke realtime AI voice communication platform.
+
+## Features
+
+- **LukeProvider**: Context provider that manages the WebSocket connection and audio state.
+- **AudioControls**: Ready-made component for microphone and speaker control.
+- **TranscriptionDisplay**: Component to show real-time transcripts from the conversation.
+- **Hooks**: Custom hooks like `useLukeContext` for building custom UI.
+
+## Installation
+
+```bash
+pnpm add @leia-org/luke-client
+```
+
+## Usage
+
+Wrap your application (or the part that needs voice features) with `LukeProvider`.
+
+```tsx
+import { LukeProvider, useLukeContext, AudioControls, TranscriptionDisplay } from '@leia-org/luke-client';
+
+function App() {
+  const token = "your_auth_token_here";
+  const serverUrl = "ws://localhost:3001";
+
+  return (
+    <LukeProvider serverUrl={serverUrl} authToken={token}>
+      <VoiceChat />
+    </LukeProvider>
+  );
+}
+
+function VoiceChat() {
+  const { providers, selectProvider, transcription } = useLukeContext();
+
+  return (
+    <div>
+      <h3>Conversation</h3>
+      <AudioControls />
+      <TranscriptionDisplay messages={transcription} />
+    </div>
+  );
+}
+```
+
+## API
+
+### LukeProvider Props
+
+- `serverUrl` (string): The WebSocket URL of your Luke server.
+- `authToken` (string): JWT or auth token for connection.
+- `onError` (function): Callback for connection errors.
+
+### useLukeContext
+
+Returns an object with:
+
+- `isConnected` (boolean)
+- `isRecording` (boolean)
+- `transcription` (array): List of transcription messages.
+- `providers` (array): List of available AI providers from the server.
+- `selectProvider` (function): Function to switch providers.
+
+## License
+
+MIT

package/dist/Luke.css

@@ -0,0 +1,430 @@
+/* Luke Client UI Library Styles - Shadcn/Vercel Inspired Theme */
+
+:root {
+    /* Shadcn Zinc Platte */
+    --luke-white: #ffffff;
+    --luke-zinc-50: #fafafa;
+    --luke-zinc-100: #f4f4f5;
+    --luke-zinc-200: #e4e4e7;
+    --luke-zinc-300: #d4d4d8;
+    --luke-zinc-400: #a1a1aa;
+    --luke-zinc-500: #71717a;
+    --luke-zinc-600: #52525b;
+    --luke-zinc-700: #3f3f46;
+    --luke-zinc-800: #27272a;
+    --luke-zinc-900: #18181b;
+    --luke-zinc-950: #09090b;
+
+    --luke-bg-color: var(--luke-white);
+    --luke-surface-color: var(--luke-white);
+    /* Cards often white with border */
+    --luke-surface-secondary: var(--luke-zinc-50);
+    --luke-border-color: var(--luke-zinc-200);
+
+    --luke-text-primary: var(--luke-zinc-950);
+    --luke-text-secondary: var(--luke-zinc-500);
+
+    /* Primary Action (Black in Vercel/Shadcn) */
+    --luke-primary-bg: #000000;
+    --luke-primary-fg: #ffffff;
+
+    /* Status */
+    --luke-error-color: #ef4444;
+    --luke-success-color: #10b981;
+    --luke-warning-color: #f59e0b;
+
+    /* UI Tokens */
+    --luke-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+    --luke-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+    --luke-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+    --luke-radius-sm: 0.375rem;
+    /* 6px */
+    --luke-radius-md: 0.5rem;
+    /* 8px */
+    --luke-radius-lg: 0.75rem;
+    /* 12px */
+
+    --luke-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    --luke-font-size-sm: 0.875rem;
+    --luke-font-size-base: 1rem;
+}
+
+[data-luke-theme='dark'] {
+    --luke-bg-color: var(--luke-zinc-950);
+    --luke-surface-color: var(--luke-zinc-950);
+    --luke-surface-secondary: var(--luke-zinc-900);
+    --luke-border-color: var(--luke-zinc-800);
+
+    --luke-text-primary: var(--luke-zinc-50);
+    --luke-text-secondary: var(--luke-zinc-400);
+
+    --luke-primary-bg: var(--luke-zinc-50);
+    --luke-primary-fg: var(--luke-zinc-900);
+}
+
+/* Base Wrapper */
+.luke-wrapper {
+    font-family: var(--luke-font-family);
+    color: var(--luke-text-primary);
+    box-sizing: border-box;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+.luke-wrapper * {
+    box-sizing: border-box;
+}
+
+/* Modes */
+.luke-mode-fullscreen {
+    position: fixed;
+    inset: 0;
+    background-color: var(--luke-bg-color);
+    z-index: 9999;
+    display: flex;
+}
+
+.luke-mode-modal {
+    position: fixed;
+    z-index: 9999;
+    width: 400px;
+    max-height: 80vh;
+    height: 650px;
+    background-color: var(--luke-bg-color);
+    border: 1px solid var(--luke-border-color);
+    border-radius: var(--luke-radius-lg);
+    box-shadow: var(--luke-shadow-lg);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    transition: opacity 0.2s ease, transform 0.2s ease;
+    animation: luke-fade-in 0.2s ease-out;
+}
+
+@keyframes luke-fade-in {
+    from {
+        opacity: 0;
+        transform: translate(-50%, -48%) scale(0.96);
+    }
+
+    to {
+        opacity: 1;
+        transform: translate(-50%, -50%) scale(1);
+    }
+}
+
+/* Position adjustments for animation trigger */
+.luke-mode-modal.luke-pos-bottom-right {
+    bottom: 24px;
+    right: 24px;
+    animation: luke-slide-up-right 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.luke-mode-modal.luke-pos-bottom-left {
+    bottom: 24px;
+    left: 24px;
+    animation: luke-slide-up-left 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.luke-mode-modal.luke-pos-center {
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+}
+
+@keyframes luke-slide-up-right {
+    from {
+        opacity: 0;
+        transform: translateY(10px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+@keyframes luke-slide-up-left {
+    from {
+        opacity: 0;
+        transform: translateY(10px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+
+/* Layout */
+.luke-header {
+    height: 60px;
+    padding: 0 20px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-bottom: 1px solid var(--luke-border-color);
+    background-color: var(--luke-surface-color);
+}
+
+.luke-header-title {
+    font-weight: 600;
+    font-size: 14px;
+    letter-spacing: -0.01em;
+}
+
+.luke-body {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    background-color: var(--luke-surface-secondary);
+    /* Subtle contrast for chat area */
+}
+
+/* Chat Area */
+.luke-messages {
+    flex: 1;
+    overflow-y: auto;
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+}
+
+.luke-message {
+    display: flex;
+    flex-direction: column;
+    max-width: 85%;
+    gap: 6px;
+}
+
+.luke-message.user {
+    align-self: flex-end;
+    align-items: flex-end;
+}
+
+.luke-message.assistant {
+    align-self: flex-start;
+    align-items: flex-start;
+}
+
+.luke-bubble {
+    padding: 12px 16px;
+    border-radius: var(--luke-radius-lg);
+    font-size: 14px;
+    line-height: 1.6;
+    position: relative;
+}
+
+.luke-message.user .luke-bubble {
+    background-color: var(--luke-primary-bg);
+    color: var(--luke-primary-fg);
+    border-bottom-right-radius: 4px;
+}
+
+.luke-message.assistant .luke-bubble {
+    background-color: var(--luke-surface-color);
+    color: var(--luke-text-primary);
+    border: 1px solid var(--luke-border-color);
+    border-bottom-left-radius: 4px;
+    box-shadow: var(--luke-shadow-sm);
+}
+
+.luke-role-label {
+    font-size: 12px;
+    font-weight: 500;
+    color: var(--luke-text-secondary);
+}
+
+/* Controls Area */
+.luke-controls {
+    padding: 20px;
+    border-top: 1px solid var(--luke-border-color);
+    background-color: var(--luke-bg-color);
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.luke-mic-area {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 12px;
+    position: relative;
+    min-height: 80px;
+    justify-content: center;
+}
+
+.luke-mic-wrapper {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100px;
+    height: 100px;
+}
+
+.luke-mic-btn {
+    width: 64px;
+    height: 64px;
+    border-radius: 50%;
+    background-color: var(--luke-primary-bg);
+    color: var(--luke-primary-fg);
+    border: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+    z-index: 10;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.luke-mic-btn:hover {
+    transform: scale(1.05);
+    opacity: 0.9;
+}
+
+.luke-mic-btn.active {
+    background-color: var(--luke-error-color);
+    color: white;
+    animation: luke-breathing 2s infinite ease-in-out;
+}
+
+@keyframes luke-breathing {
+    0% {
+        transform: scale(1);
+        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
+    }
+
+    50% {
+        transform: scale(1.05);
+        box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
+    }
+
+    100% {
+        transform: scale(1);
+        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
+    }
+}
+
+.luke-status-text {
+    font-size: 13px;
+    font-weight: 500;
+    color: var(--luke-text-secondary);
+    letter-spacing: 0.02em;
+}
+
+/* Buttons/Icons */
+.luke-btn-icon {
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: var(--luke-radius-md);
+    border: none;
+    background: transparent;
+    color: var(--luke-text-secondary);
+    cursor: pointer;
+    transition: background-color 0.2s, color 0.2s;
+}
+
+.luke-btn-icon:hover {
+    background-color: var(--luke-zinc-100);
+    color: var(--luke-text-primary);
+}
+
+/* Connect Button (Custom in component but styled here for consistency if class used) */
+.luke-btn-primary {
+    width: 100%;
+    padding: 0 16px;
+    height: 40px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: var(--luke-radius-md);
+    font-size: 14px;
+    font-weight: 500;
+    background-color: var(--luke-primary-bg);
+    color: var(--luke-primary-fg);
+    border: none;
+    cursor: pointer;
+    transition: opacity 0.2s;
+}
+
+.luke-btn-primary:hover {
+    opacity: 0.9;
+}
+
+/* Visualizer */
+.luke-visualizer {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 100px;
+    height: 100px;
+    border-radius: 50%;
+    border: 1px solid var(--luke-border-color);
+    opacity: 0.5;
+    pointer-events: none;
+}
+
+/* Selection Pill */
+.luke-selection-pill {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 12px;
+    background-color: var(--luke-zinc-100);
+    border-radius: 9999px;
+    /* Pill shape */
+    color: var(--luke-text-primary);
+    font-size: 13px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: background-color 0.2s;
+    user-select: none;
+    max-width: 160px;
+}
+
+.luke-selection-pill:hover {
+    background-color: var(--luke-zinc-200);
+}
+
+.luke-pill-select {
+    position: absolute;
+    inset: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    cursor: pointer;
+    appearance: none;
+    z-index: 10;
+}
+
+.luke-pill-icon,
+.luke-pill-chevron {
+    display: flex;
+    align-items: center;
+    color: var(--luke-text-secondary);
+}
+
+.luke-pill-label {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.luke-pills-container {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    gap: 8px;
+    margin-top: 8px;
+}

package/dist/components/AudioControls.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface AudioControlsProps {
+    className?: string;
+    renderButton?: (props: {
+        isRecording: boolean;
+        isConnected: boolean;
+        onClick: () => void;
+    }) => React.ReactNode;
+    renderLevel?: (level: number) => React.ReactNode;
+}
+export declare function AudioControls({ className, renderButton, renderLevel, }: AudioControlsProps): React.ReactElement;
+//# sourceMappingURL=AudioControls.d.ts.map

package/dist/components/AudioControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioControls.d.ts","sourceRoot":"","sources":["../../src/components/AudioControls.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,kBAAkB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QACnB,WAAW,EAAE,OAAO,CAAC;QACrB,WAAW,EAAE,OAAO,CAAC;QACrB,OAAO,EAAE,MAAM,IAAI,CAAC;KACvB,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CACpD;AAED,wBAAgB,aAAa,CAAC,EAC1B,SAAS,EACT,YAAY,EACZ,WAAW,GACd,EAAE,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAiEzC"}

package/dist/components/AudioControls.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLukeContext } from './LukeProvider.js';
+export function AudioControls({ className, renderButton, renderLevel, }) {
+    const { isRecording, isConnected, startRecording, stopRecording, audioLevel } = useLukeContext();
+    const handleClick = () => {
+        if (isRecording) {
+            stopRecording();
+        }
+        else {
+            startRecording();
+        }
+    };
+    // Default button rendering
+    const defaultButton = (_jsx("button", { type: "button", onClick: handleClick, disabled: !isConnected, "aria-label": isRecording ? 'Stop recording' : 'Start recording', style: {
+            width: 64,
+            height: 64,
+            borderRadius: '50%',
+            border: 'none',
+            backgroundColor: isRecording ? '#ef4444' : '#3b82f6',
+            color: 'white',
+            cursor: isConnected ? 'pointer' : 'not-allowed',
+            opacity: isConnected ? 1 : 0.5,
+            transition: 'background-color 0.2s',
+        }, children: isRecording ? 'Stop' : 'Mic' }));
+    // Default level indicator
+    const defaultLevel = (_jsx("div", { style: {
+            width: 100,
+            height: 8,
+            backgroundColor: '#e5e7eb',
+            borderRadius: 4,
+            overflow: 'hidden',
+            marginTop: 8,
+        }, children: _jsx("div", { style: {
+                width: `${Math.min(100, audioLevel * 100)}%`,
+                height: '100%',
+                backgroundColor: '#22c55e',
+                transition: 'width 0.05s',
+            } }) }));
+    return (_jsxs("div", { className: className, style: { display: 'flex', flexDirection: 'column', alignItems: 'center' }, children: [renderButton
+                ? renderButton({ isRecording, isConnected, onClick: handleClick })
+                : defaultButton, renderLevel ? renderLevel(audioLevel) : defaultLevel] }));
+}
+//# sourceMappingURL=AudioControls.js.map

package/dist/components/AudioControls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioControls.js","sourceRoot":"","sources":["../../src/components/AudioControls.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAanD,MAAM,UAAU,aAAa,CAAC,EAC1B,SAAS,EACT,YAAY,EACZ,WAAW,GACM;IACjB,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,cAAc,EAAE,aAAa,EAAE,UAAU,EAAE,GAAG,cAAc,EAAE,CAAC;IAEjG,MAAM,WAAW,GAAG,GAAG,EAAE;QACrB,IAAI,WAAW,EAAE,CAAC;YACd,aAAa,EAAE,CAAC;QACpB,CAAC;aAAM,CAAC;YACJ,cAAc,EAAE,CAAC;QACrB,CAAC;IACL,CAAC,CAAC;IAEF,2BAA2B;IAC3B,MAAM,aAAa,GAAG,CAClB,iBACI,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,CAAC,WAAW,gBACV,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,iBAAiB,EAC9D,KAAK,EAAE;YACH,KAAK,EAAE,EAAE;YACT,MAAM,EAAE,EAAE;YACV,YAAY,EAAE,KAAK;YACnB,MAAM,EAAE,MAAM;YACd,eAAe,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YACpD,KAAK,EAAE,OAAO;YACd,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa;YAC/C,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;YAC9B,UAAU,EAAE,uBAAuB;SACtC,YAEA,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,GACxB,CACZ,CAAC;IAEF,0BAA0B;IAC1B,MAAM,YAAY,GAAG,CACjB,cACI,KAAK,EAAE;YACH,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,CAAC;YACT,eAAe,EAAE,SAAS;YAC1B,YAAY,EAAE,CAAC;YACf,QAAQ,EAAE,QAAQ;YAClB,SAAS,EAAE,CAAC;SACf,YAED,cACI,KAAK,EAAE;gBACH,KAAK,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,UAAU,GAAG,GAAG,CAAC,GAAG;gBAC5C,MAAM,EAAE,MAAM;gBACd,eAAe,EAAE,SAAS;gBAC1B,UAAU,EAAE,aAAa;aAC5B,GACH,GACA,CACT,CAAC;IAEF,OAAO,CACH,eAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/F,YAAY;gBACT,CAAC,CAAC,YAAY,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC;gBAClE,CAAC,CAAC,aAAa,EAClB,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,YAAY,IACnD,CACT,CAAC;AACN,CAAC"}

package/dist/components/ConnectionStatus.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface ConnectionStatusProps {
+    className?: string;
+    showProvider?: boolean;
+}
+export declare function ConnectionStatus({ className, showProvider, }: ConnectionStatusProps): React.ReactElement;
+//# sourceMappingURL=ConnectionStatus.d.ts.map

package/dist/components/ConnectionStatus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectionStatus.d.ts","sourceRoot":"","sources":["../../src/components/ConnectionStatus.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,qBAAqB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,gBAAgB,CAAC,EAC7B,SAAS,EACT,YAAmB,GACtB,EAAE,qBAAqB,GAAG,KAAK,CAAC,YAAY,CA8D5C"}

package/dist/components/ConnectionStatus.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLukeContext } from './LukeProvider.js';
+export function ConnectionStatus({ className, showProvider = true, }) {
+    const { connectionState, selectedProvider, connect, disconnect } = useLukeContext();
+    const statusColors = {
+        disconnected: '#9ca3af',
+        connecting: '#f59e0b',
+        connected: '#22c55e',
+        error: '#ef4444',
+    };
+    return (_jsxs("div", { className: className, style: {
+            display: 'flex',
+            alignItems: 'center',
+            gap: 12,
+            padding: '8px 16px',
+            backgroundColor: '#f9fafb',
+            borderRadius: 8,
+        }, children: [_jsx("div", { style: {
+                    width: 10,
+                    height: 10,
+                    borderRadius: '50%',
+                    backgroundColor: statusColors[connectionState],
+                } }), _jsx("span", { style: { fontSize: 14, color: '#374151' }, children: connectionState.charAt(0).toUpperCase() + connectionState.slice(1) }), showProvider && selectedProvider && (_jsxs("span", { style: { fontSize: 12, color: '#6b7280' }, children: ["(", selectedProvider.name, ")"] })), _jsx("button", { type: "button", onClick: connectionState === 'disconnected' ? connect : disconnect, style: {
+                    marginLeft: 'auto',
+                    padding: '4px 12px',
+                    fontSize: 12,
+                    border: '1px solid #d1d5db',
+                    borderRadius: 4,
+                    backgroundColor: 'white',
+                    cursor: 'pointer',
+                }, children: connectionState === 'disconnected' ? 'Connect' : 'Disconnect' })] }));
+}
+//# sourceMappingURL=ConnectionStatus.js.map

package/dist/components/ConnectionStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectionStatus.js","sourceRoot":"","sources":["../../src/components/ConnectionStatus.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,MAAM,UAAU,gBAAgB,CAAC,EAC7B,SAAS,EACT,YAAY,GAAG,IAAI,GACC;IACpB,MAAM,EAAE,eAAe,EAAE,gBAAgB,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,cAAc,EAAE,CAAC;IAEpF,MAAM,YAAY,GAA2B;QACzC,YAAY,EAAE,SAAS;QACvB,UAAU,EAAE,SAAS;QACrB,SAAS,EAAE,SAAS;QACpB,KAAK,EAAE,SAAS;KACnB,CAAC;IAEF,OAAO,CACH,eACI,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE;YACH,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,EAAE;YACP,OAAO,EAAE,UAAU;YACnB,eAAe,EAAE,SAAS;YAC1B,YAAY,EAAE,CAAC;SAClB,aAGD,cACI,KAAK,EAAE;oBACH,KAAK,EAAE,EAAE;oBACT,MAAM,EAAE,EAAE;oBACV,YAAY,EAAE,KAAK;oBACnB,eAAe,EAAE,YAAY,CAAC,eAAe,CAAC;iBACjD,GACH,EAGF,eAAM,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,YAC1C,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC,GAChE,EAGN,YAAY,IAAI,gBAAgB,IAAI,CACjC,gBAAM,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,kBACzC,gBAAgB,CAAC,IAAI,SACpB,CACV,EAGD,iBACI,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,eAAe,KAAK,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,EAClE,KAAK,EAAE;oBACH,UAAU,EAAE,MAAM;oBAClB,OAAO,EAAE,UAAU;oBACnB,QAAQ,EAAE,EAAE;oBACZ,MAAM,EAAE,mBAAmB;oBAC3B,YAAY,EAAE,CAAC;oBACf,eAAe,EAAE,OAAO;oBACxB,MAAM,EAAE,SAAS;iBACpB,YAEA,eAAe,KAAK,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,GACzD,IACP,CACT,CAAC;AACN,CAAC"}

package/dist/components/LukeProvider.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { UseLukeReturn, LukeProviderProps } from '../types.js';
+export declare function LukeProvider({ serverUrl, authToken, autoConnect, children, }: LukeProviderProps): React.ReactElement;
+export declare function useLukeContext(): UseLukeReturn;
+//# sourceMappingURL=LukeProvider.d.ts.map

package/dist/components/LukeProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LukeProvider.d.ts","sourceRoot":"","sources":["../../src/components/LukeProvider.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAElE,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAMpE,wBAAgB,YAAY,CAAC,EACzB,SAAS,EACT,SAAS,EACT,WAAmB,EACnB,QAAQ,GACX,EAAE,iBAAiB,GAAG,KAAK,CAAC,YAAY,CAYxC;AAGD,wBAAgB,cAAc,IAAI,aAAa,CAQ9C"}

package/dist/components/LukeProvider.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// LukeProvider Component
+// React context provider for realtime AI voice communication
+import { createContext, useContext } from 'react';
+import { useLuke } from '../hooks/useLuke.js';
+// Context for Luke state
+const LukeContext = createContext(null);
+// Provider component wraps children with Luke context
+export function LukeProvider({ serverUrl, authToken, autoConnect = false, children, }) {
+    const luke = useLuke({
+        serverUrl,
+        authToken,
+        autoConnect,
+    });
+    return (_jsx(LukeContext.Provider, { value: luke, children: children }));
+}
+// Hook to access Luke context
+export function useLukeContext() {
+    const context = useContext(LukeContext);
+    if (!context) {
+        throw new Error('useLukeContext must be used within a LukeProvider');
+    }
+    return context;
+}
+//# sourceMappingURL=LukeProvider.js.map

package/dist/components/LukeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LukeProvider.js","sourceRoot":"","sources":["../../src/components/LukeProvider.tsx"],"names":[],"mappings":";AAAA,yBAAyB;AACzB,6DAA6D;AAE7D,OAAc,EAAE,aAAa,EAAE,UAAU,EAAW,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAG9C,yBAAyB;AACzB,MAAM,WAAW,GAAG,aAAa,CAAuB,IAAI,CAAC,CAAC;AAE9D,sDAAsD;AACtD,MAAM,UAAU,YAAY,CAAC,EACzB,SAAS,EACT,SAAS,EACT,WAAW,GAAG,KAAK,EACnB,QAAQ,GACQ;IAChB,MAAM,IAAI,GAAG,OAAO,CAAC;QACjB,SAAS;QACT,SAAS;QACT,WAAW;KACd,CAAC,CAAC;IAEH,OAAO,CACH,KAAC,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,YAC5B,QAAQ,GACU,CAC1B,CAAC;AACN,CAAC;AAED,8BAA8B;AAC9B,MAAM,UAAU,cAAc;IAC1B,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAExC,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,mDAAmD,CAAC,CAAC;IACzE,CAAC;IAED,OAAO,OAAO,CAAC;AACnB,CAAC"}

package/dist/components/TranscriptionDisplay.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { TranscriptionMessage } from '../types.js';
+export interface TranscriptionDisplayProps {
+    messages: TranscriptionMessage[];
+    className?: string;
+    renderMessage?: (message: TranscriptionMessage, index: number) => React.ReactNode;
+}
+export declare function TranscriptionDisplay({ messages, className, renderMessage, }: TranscriptionDisplayProps): React.ReactElement;
+//# sourceMappingURL=TranscriptionDisplay.d.ts.map

package/dist/components/TranscriptionDisplay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TranscriptionDisplay.d.ts","sourceRoot":"","sources":["../../src/components/TranscriptionDisplay.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAExD,MAAM,WAAW,yBAAyB;IACtC,QAAQ,EAAE,oBAAoB,EAAE,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CACrF;AAED,wBAAgB,oBAAoB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,aAAa,GAChB,EAAE,yBAAyB,GAAG,KAAK,CAAC,YAAY,CAuChD"}