@gymmymac/bob-widget 1.0.2 → 1.1.2

package/dist/components/Bob.d.ts

@@ -1,40 +1,17 @@
 import { default as React } from 'react';
 
-export type BobVariant = "inline" | "floating" | "fullscreen";
+export type BobVariant = "inline" | "floating" | "fullscreen" | "mobile";
 interface BobProps {
-    /** Display variant */
     variant?: BobVariant;
-    /** Initial animation state */
     initialState?: string;
-    /** Show chat interface */
     showChat?: boolean;
-    /** Custom class name */
     className?: string;
-    /** Backdrop image URL */
     backdropUrl?: string;
-    /** Counter overlay image URL */
     counterOverlayUrl?: string;
-    /** Counter height as percentage */
     counterHeightPercent?: number;
-    /** Default Bob image when no animations loaded */
     defaultBobImage?: string;
-    /** Vertical offset for Bob positioning */
     verticalOffset?: number;
-    /** Scale factor for Bob (100 = 100%) */
     scale?: number;
 }
-/**
- * Main Bob component - combines character animation and chat interface
- *
- * @example
- * ```tsx
- * <Bob
- *   variant="inline"
- *   showChat={true}
- *   backdropUrl="https://example.com/backdrop.png"
- *   counterOverlayUrl="https://example.com/counter.png"
- * />
- * ```
- */
 export declare const Bob: React.FC<BobProps>;
 export {};

package/dist/components/mobile/MobileBobCharacter.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+
+interface MobileBobCharacterProps {
+    currentImage: string;
+    animationState: string;
+    counterOverlayUrl?: string;
+    counterHeightPercent?: number;
+    scale?: number;
+    position?: 'center' | 'left';
+}
+export declare const MobileBobCharacter: React.FC<MobileBobCharacterProps>;
+export {};

package/dist/components/mobile/MobileBobLayout.d.ts

@@ -0,0 +1,35 @@
+import { default as React } from 'react';
+import { Message, HighlightedProduct } from '../../types/message';
+import { Product, ServicePackage } from '../../types';
+import { Vehicle } from '../../types/vehicle';
+
+interface MobileBobLayoutProps {
+    currentImage: string;
+    animationState: string;
+    backdropUrl?: string;
+    counterOverlayUrl?: string;
+    counterHeightPercent?: number;
+    messages: Message[];
+    input: string;
+    setInput: (value: string) => void;
+    isLoading: boolean;
+    onSend: () => void;
+    onKeyPress: (e: React.KeyboardEvent) => void;
+    onInputFocus: () => void;
+    onInputBlur: () => void;
+    chatEndRef: React.RefObject<HTMLDivElement>;
+    isMuted?: boolean;
+    onToggleMute?: () => void;
+    isSpeaking?: boolean;
+    products: Product[];
+    servicePackages: ServicePackage[];
+    highlightedPartType?: string | null;
+    highlightedProduct?: HighlightedProduct | null;
+    onProductClick?: (product: Product) => void;
+    onPackageSelect?: (pkg: ServicePackage) => void;
+    isResearching?: boolean;
+    vehicle?: Vehicle | null;
+    onChangeVehicle?: () => void;
+}
+export declare const MobileBobLayout: React.FC<MobileBobLayoutProps>;
+export {};

package/dist/components/mobile/MobileChatDrawer.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+import { Message } from '../../types/message';
+
+interface MobileChatDrawerProps {
+    messages: Message[];
+    input: string;
+    setInput: (value: string) => void;
+    isLoading: boolean;
+    onSend: () => void;
+    onKeyPress: (e: React.KeyboardEvent) => void;
+    onInputFocus: () => void;
+    onInputBlur: () => void;
+    chatEndRef: React.RefObject<HTMLDivElement>;
+    isMuted?: boolean;
+    onToggleMute?: () => void;
+    isSpeaking?: boolean;
+}
+export declare const MobileChatDrawer: React.FC<MobileChatDrawerProps>;
+export {};

package/dist/components/mobile/MobileProductColumn.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { Product, ServicePackage } from '../../types';
+import { HighlightedProduct } from '../../types/message';
+
+interface MobileProductColumnProps {
+    products: Product[];
+    servicePackages: ServicePackage[];
+    highlightedPartType?: string | null;
+    highlightedProduct?: HighlightedProduct | null;
+    onProductClick?: (product: Product) => void;
+    onPackageSelect?: (pkg: ServicePackage) => void;
+    isResearching?: boolean;
+    visible?: boolean;
+    counterHeightPercent?: number;
+    hasVehicle?: boolean;
+}
+export declare const MobileProductColumn: React.FC<MobileProductColumnProps>;
+export {};

package/dist/components/mobile/index.d.ts

@@ -0,0 +1,4 @@
+export { MobileBobCharacter } from './MobileBobCharacter';
+export { MobileChatDrawer } from './MobileChatDrawer';
+export { MobileProductColumn } from './MobileProductColumn';
+export { MobileBobLayout } from './MobileBobLayout';

package/dist/hooks/useBobAnimation.d.ts

@@ -0,0 +1,14 @@
+export type AnimationState = string;
+export declare const useBobAnimation: () => {
+    animationState: string;
+    setAnimationState: import('react').Dispatch<import('react').SetStateAction<string>>;
+    getCurrentImage: () => string;
+    getCurrentOffset: () => number;
+    getCurrentScale: () => number;
+    imageUrls: Record<string, any>;
+    availableStates: string[];
+    setTalkSpeed: import('react').Dispatch<import('react').SetStateAction<number>>;
+    manualMode: boolean;
+    setManualMode: import('react').Dispatch<import('react').SetStateAction<boolean>>;
+    isLoading: boolean;
+};

package/dist/hooks/useBobAnimationData.d.ts

@@ -0,0 +1,53 @@
+export interface BobAnimationConfig {
+    id: string;
+    animation_state: string;
+    image_url: string;
+    sequence_order: number;
+    is_active: boolean;
+    description: string | null;
+    vertical_offset: number;
+    look_id: string | null;
+    scale: number;
+}
+export interface AnimationStateDefinition {
+    id: string;
+    state_key: string;
+    title: string;
+    description: string | null;
+    display_order: number;
+    is_active: boolean;
+    created_at: string;
+    updated_at: string;
+    animation_speed: number | null;
+    pause_duration: number | null;
+    loop_count: number | null;
+    chat_trigger: string | null;
+    idle_timeout_ms: number | null;
+    look_id: string | null;
+}
+export interface BobLook {
+    id: string;
+    name: string;
+    description: string | null;
+    is_active: boolean;
+    display_order: number;
+    created_at: string;
+    updated_at: string;
+}
+export interface BobAnimationData {
+    states: AnimationStateDefinition[];
+    configs: BobAnimationConfig[];
+    uploadedImages: string[];
+    looks: BobLook[];
+    activeLookId: string | null;
+}
+/**
+ * Centralized React Query hook for Bob's animation data.
+ * Fetches once, caches for 30 seconds, deduplicates requests across components.
+ * Includes realtime subscriptions for automatic updates.
+ */
+export declare const useBobAnimationData: (lookId?: string | null) => import('@tanstack/react-query').UseQueryResult<BobAnimationData, Error>;
+/**
+ * Hook to invalidate and refetch Bob animation data.
+ */
+export declare const useInvalidateBobAnimationData: () => () => Promise<void>;

package/dist/hooks/useBobBackdrop.d.ts

@@ -0,0 +1,17 @@
+interface BobBackdrop {
+    id: string;
+    name: string;
+    image_url: string;
+    is_active: boolean;
+    display_order: number;
+    created_at: string;
+    updated_at: string;
+    counter_overlay_url: string | null;
+    counter_height_percent: number | null;
+}
+export declare const useBobBackdrop: () => {
+    backdrops: BobBackdrop[];
+    activeBackdrop: BobBackdrop | undefined;
+    isLoading: boolean;
+};
+export {};

package/dist/hooks/useBobStateTransitions.d.ts

@@ -0,0 +1,22 @@
+import { AnimationStateDefinition } from './useBobAnimationData';
+
+type ChatStage = 'page_load' | 'awaiting_input' | 'idle' | 'processing_input' | 'streaming_response' | 'response_complete' | 'showing_product';
+interface UseBobStateTransitionsProps {
+    states: AnimationStateDefinition[];
+    setAnimationState: (state: string) => void;
+    manualMode: boolean;
+}
+export declare const useBobStateTransitions: ({ states, setAnimationState, manualMode }: UseBobStateTransitionsProps) => {
+    chatStage: ChatStage;
+    initialize: () => void;
+    onUserInput: () => void;
+    onStreamStart: () => void;
+    onStreamComplete: () => void;
+    onShowingProduct: () => void;
+    getStateSettings: (stateKey: string) => {
+        speed: number;
+        pauseDuration: number;
+        loopCount: number;
+    };
+};
+export {};

package/dist/hooks/useSpeechRecognition.d.ts

@@ -0,0 +1,18 @@
+type SpeechMode = 'toggle' | 'ptt';
+interface UseSpeechRecognitionProps {
+    onTranscript?: (transcript: string) => void;
+    onSpeechEnd?: (transcript: string) => void;
+    language?: string;
+    mode?: SpeechMode;
+}
+export declare const useSpeechRecognition: ({ onTranscript, onSpeechEnd, language, mode }?: UseSpeechRecognitionProps) => {
+    isListening: boolean;
+    transcript: string;
+    interimTranscript: string;
+    error: string | null;
+    isSupported: boolean;
+    startListening: () => void;
+    stopListening: () => void;
+    toggleListening: () => void;
+};
+export {};

package/dist/index.d.ts

@@ -1,42 +1,23 @@
 /**
- * @carfix/bob-widget
+ * @gymmymac/bob-widget
  *
- * AI-powered automotive parts assistant widget
- *
- * @example
- * ```tsx
- * import { BobProvider, Bob } from '@carfix/bob-widget';
- *
- * function App() {
- *   return (
- *     <BobProvider
- *       bobConfig={{
- *         supabaseUrl: 'https://your-bob-project.supabase.co',
- *         supabaseKey: 'your-anon-key',
- *       }}
- *       hostApiConfig={{
- *         baseUrl: 'https://your-api.com',
- *         apiKey: 'your-api-key',
- *       }}
- *       hostContext={{
- *         user: { email: 'user@example.com' },
- *       }}
- *     >
- *       <YourApp />
- *       <Bob variant="floating" />
- *     </BobProvider>
- *   );
- * }
- * ```
+ * AI-powered automotive parts assistant widget - Full immersive experience
  */
 export { BobProvider, useBobContext, useBobSupabase, useHostContext, useHostApiConfig, useBobCallbacks, } from './BobProvider';
 export { Bob } from './components/Bob';
 export type { BobVariant } from './components/Bob';
 export { BobCharacter } from './components/BobCharacter';
 export { ChatInterface } from './components/ChatInterface';
+export { MobileBobCharacter, MobileChatDrawer, MobileProductColumn, MobileBobLayout } from './components/mobile';
 export { useBobChat } from './hooks/useBobChat';
 export { useSpeechSynthesis } from './hooks/useSpeechSynthesis';
+export { useBobAnimation } from './hooks/useBobAnimation';
+export { useBobAnimationData } from './hooks/useBobAnimationData';
+export { useBobStateTransitions } from './hooks/useBobStateTransitions';
+export { useSpeechRecognition } from './hooks/useSpeechRecognition';
+export { useBobBackdrop } from './hooks/useBobBackdrop';
 export type { HostContext, HostUserContext, HostVehicleContext, HostCartContext, HostHistoryContext, BobConfig, HostApiConfig, BobCallbacks, BobProviderConfig, } from './types/context';
-export type { Vehicle, } from './types/vehicle';
-export type { APIPart, CartItem, ServicePackage, } from './types/product';
+export type { Vehicle } from './types/vehicle';
+export type { Product, APIPart, CartItem, ServicePackage, } from './types/product';
 export type { Message, HighlightedProduct, } from './types/message';
+export type { BobAnimationConfig, AnimationStateDefinition, BobLook, BobAnimationData, } from './hooks/useBobAnimationData';