@intentai/react 2.1.1 → 2.2.0

package/dist/index.d.mts

@@ -31,6 +31,149 @@ interface FeedbackData {
 }
 declare const PremiumVoiceWidget: React.FC<WidgetConfig>;
 
+interface IntentAIProviderConfig {
+    /** Your Intent AI API key (required) */
+    apiKey: string;
+    /** API URL (defaults to production) */
+    apiUrl?: string;
+    /** User information for identifying feedback */
+    user?: IntentAIUser$1;
+    /** Additional metadata to attach to all feedback */
+    metadata?: Record<string, unknown>;
+}
+interface IntentAIUser$1 {
+    id?: string;
+    email?: string;
+    name?: string;
+    [key: string]: unknown;
+}
+interface IntentAIContextValue {
+    /** Identify the current user */
+    identify: (user: IntentAIUser$1) => void;
+    /** Set metadata to attach to feedback */
+    setMetadata: (metadata: Record<string, unknown>) => void;
+    /** Clear the current user */
+    clearUser: () => void;
+    /** Whether the provider is configured */
+    isConfigured: boolean;
+}
+/**
+ * Hook to access Intent AI context for user identification and metadata
+ */
+declare function useIntentAI(): IntentAIContextValue;
+interface IntentAIProviderProps extends IntentAIProviderConfig {
+    /** Widget configuration options */
+    widgetConfig?: Omit<WidgetConfig, 'onSubmit'>;
+    /** Children components */
+    children?: React.ReactNode;
+    /** Disable the widget (only provide context) */
+    disableWidget?: boolean;
+    /** Callback when feedback is submitted successfully */
+    onFeedbackSubmitted?: () => void;
+    /** Callback when there's an error */
+    onError?: (error: Error) => void;
+}
+/**
+ * Intent AI Provider - Wraps your app with feedback collection capabilities
+ *
+ * @example
+ * ```tsx
+ * import { IntentAIProvider } from '@intentai/react';
+ *
+ * function App() {
+ *   return (
+ *     <IntentAIProvider
+ *       apiKey="your-api-key"
+ *       user={{ id: 'user-123', email: 'user@example.com' }}
+ *     >
+ *       <YourApp />
+ *     </IntentAIProvider>
+ *   );
+ * }
+ * ```
+ */
+declare function IntentAIProvider({ apiKey, apiUrl, user: initialUser, metadata: initialMetadata, widgetConfig, children, disableWidget, onFeedbackSubmitted, onError, }: IntentAIProviderProps): React.ReactElement;
+/**
+ * Hook to identify users - convenience wrapper around useIntentAI
+ *
+ * @example
+ * ```tsx
+ * function UserProfile({ user }) {
+ *   const identify = useIdentify();
+ *
+ *   useEffect(() => {
+ *     identify({ id: user.id, email: user.email, name: user.name });
+ *   }, [user]);
+ *
+ *   return <div>...</div>;
+ * }
+ * ```
+ */
+declare function useIdentify(): (user: IntentAIUser$1) => void;
+/**
+ * Hook to set metadata - convenience wrapper around useIntentAI
+ *
+ * @example
+ * ```tsx
+ * function Dashboard({ plan }) {
+ *   const setMetadata = useSetMetadata();
+ *
+ *   useEffect(() => {
+ *     setMetadata({ plan, feature: 'dashboard' });
+ *   }, [plan]);
+ *
+ *   return <div>...</div>;
+ * }
+ * ```
+ */
+declare function useSetMetadata(): (metadata: Record<string, unknown>) => void;
+
+interface FeedbackButtonProps {
+    /** Button variant style */
+    variant?: 'primary' | 'secondary' | 'ghost' | 'minimal';
+    /** Button size */
+    size?: 'sm' | 'md' | 'lg';
+    /** Show icon */
+    showIcon?: boolean;
+    /** Custom icon (React element) */
+    icon?: React.ReactNode;
+    /** Button label */
+    label?: string;
+    /** Additional class name */
+    className?: string;
+    /** Custom styles */
+    style?: React.CSSProperties;
+    /** Primary color */
+    primaryColor?: string;
+    /** Click handler - if provided, will be called instead of opening widget */
+    onClick?: () => void;
+    /** Disabled state */
+    disabled?: boolean;
+}
+/**
+ * Customizable feedback button that can trigger the widget or custom actions
+ *
+ * @example
+ * ```tsx
+ * // Basic usage - triggers widget
+ * <FeedbackButton />
+ *
+ * // Custom label and style
+ * <FeedbackButton
+ *   label="Give Feedback"
+ *   variant="secondary"
+ *   size="lg"
+ * />
+ *
+ * // With custom click handler
+ * <FeedbackButton
+ *   label="Report Issue"
+ *   onClick={() => console.log('clicked')}
+ * />
+ * ```
+ */
+declare function FeedbackButton({ variant, size, showIcon, icon, label, className, style, primaryColor, onClick, disabled, }: FeedbackButtonProps): React.ReactElement;
+
 interface IntentAIUser {
     id?: string;
     email?: string;
@@ -102,29 +245,30 @@ declare global {
  */
 declare function IntentAIWidget({ apiKey, apiUrl, widgetUrl, position, theme, primaryColor, allowVoice, allowText, allowScreenshot, customMetadata, user, onOpen: _onOpen, onClose: _onClose, onFeedbackSubmitted: _onFeedbackSubmitted, onError, }: IntentAIProps): null;
 /**
- * Hook to control the Intent AI widget programmatically
+ * Hook to control the script-tag widget programmatically
+ * @deprecated Use useIntentAI from IntentAIProvider instead for React apps
  *
  * @example
  * ```tsx
- * import { IntentAIWidget, useIntentAI } from '@intent-ai/react';
+ * import { IntentAIWidget, useWidgetControls } from '@intentai/react';
  *
  * function App() {
- *   const { open, close, identify } = useIntentAI();
+ *   const { open, close, identify } = useWidgetControls();
  *
  *   return (
  *     <>
- *       <IntentAIWidget apiKey="your-api-key" />
+ *       <IntentAIWidget apiKey="your-api-key" widgetUrl="..." apiUrl="..." />
  *       <button onClick={open}>Open Feedback</button>
  *     </>
  *   );
  * }
  * ```
  */
-declare function useIntentAI(): {
+declare function useWidgetControls(): {
     open: () => void;
     close: () => void;
     identify: (user: IntentAIUser) => void;
     setMetadata: (metadata: Record<string, any>) => void;
 };
 
-export { type IntentAIConfig, type IntentAIProps, type IntentAIUser, IntentAIWidget, PremiumVoiceWidget, type WidgetConfig as PremiumWidgetConfig, IntentAIWidget as default, useIntentAI };
+export { FeedbackButton, type FeedbackButtonProps, type IntentAIConfig, type IntentAIContextValue, type IntentAIProps, IntentAIProvider, type IntentAIProviderConfig, type IntentAIProviderProps, type IntentAIUser, IntentAIWidget, PremiumVoiceWidget, type WidgetConfig as PremiumWidgetConfig, IntentAIWidget as default, useIdentify, useIntentAI, useSetMetadata, useWidgetControls };

package/dist/index.d.ts

@@ -31,6 +31,149 @@ interface FeedbackData {
 }
 declare const PremiumVoiceWidget: React.FC<WidgetConfig>;
 
+interface IntentAIProviderConfig {
+    /** Your Intent AI API key (required) */
+    apiKey: string;
+    /** API URL (defaults to production) */
+    apiUrl?: string;
+    /** User information for identifying feedback */
+    user?: IntentAIUser$1;
+    /** Additional metadata to attach to all feedback */
+    metadata?: Record<string, unknown>;
+}
+interface IntentAIUser$1 {
+    id?: string;
+    email?: string;
+    name?: string;
+    [key: string]: unknown;
+}
+interface IntentAIContextValue {
+    /** Identify the current user */
+    identify: (user: IntentAIUser$1) => void;
+    /** Set metadata to attach to feedback */
+    setMetadata: (metadata: Record<string, unknown>) => void;
+    /** Clear the current user */
+    clearUser: () => void;
+    /** Whether the provider is configured */
+    isConfigured: boolean;
+}
+/**
+ * Hook to access Intent AI context for user identification and metadata
+ */
+declare function useIntentAI(): IntentAIContextValue;
+interface IntentAIProviderProps extends IntentAIProviderConfig {
+    /** Widget configuration options */
+    widgetConfig?: Omit<WidgetConfig, 'onSubmit'>;
+    /** Children components */
+    children?: React.ReactNode;
+    /** Disable the widget (only provide context) */
+    disableWidget?: boolean;
+    /** Callback when feedback is submitted successfully */
+    onFeedbackSubmitted?: () => void;
+    /** Callback when there's an error */
+    onError?: (error: Error) => void;
+}
+/**
+ * Intent AI Provider - Wraps your app with feedback collection capabilities
+ *
+ * @example
+ * ```tsx
+ * import { IntentAIProvider } from '@intentai/react';
+ *
+ * function App() {
+ *   return (
+ *     <IntentAIProvider
+ *       apiKey="your-api-key"
+ *       user={{ id: 'user-123', email: 'user@example.com' }}
+ *     >
+ *       <YourApp />
+ *     </IntentAIProvider>
+ *   );
+ * }
+ * ```
+ */
+declare function IntentAIProvider({ apiKey, apiUrl, user: initialUser, metadata: initialMetadata, widgetConfig, children, disableWidget, onFeedbackSubmitted, onError, }: IntentAIProviderProps): React.ReactElement;
+/**
+ * Hook to identify users - convenience wrapper around useIntentAI
+ *
+ * @example
+ * ```tsx
+ * function UserProfile({ user }) {
+ *   const identify = useIdentify();
+ *
+ *   useEffect(() => {
+ *     identify({ id: user.id, email: user.email, name: user.name });
+ *   }, [user]);
+ *
+ *   return <div>...</div>;
+ * }
+ * ```
+ */
+declare function useIdentify(): (user: IntentAIUser$1) => void;
+/**
+ * Hook to set metadata - convenience wrapper around useIntentAI
+ *
+ * @example
+ * ```tsx
+ * function Dashboard({ plan }) {
+ *   const setMetadata = useSetMetadata();
+ *
+ *   useEffect(() => {
+ *     setMetadata({ plan, feature: 'dashboard' });
+ *   }, [plan]);
+ *
+ *   return <div>...</div>;
+ * }
+ * ```
+ */
+declare function useSetMetadata(): (metadata: Record<string, unknown>) => void;
+
+interface FeedbackButtonProps {
+    /** Button variant style */
+    variant?: 'primary' | 'secondary' | 'ghost' | 'minimal';
+    /** Button size */
+    size?: 'sm' | 'md' | 'lg';
+    /** Show icon */
+    showIcon?: boolean;
+    /** Custom icon (React element) */
+    icon?: React.ReactNode;
+    /** Button label */
+    label?: string;
+    /** Additional class name */
+    className?: string;
+    /** Custom styles */
+    style?: React.CSSProperties;
+    /** Primary color */
+    primaryColor?: string;
+    /** Click handler - if provided, will be called instead of opening widget */
+    onClick?: () => void;
+    /** Disabled state */
+    disabled?: boolean;
+}
+/**
+ * Customizable feedback button that can trigger the widget or custom actions
+ *
+ * @example
+ * ```tsx
+ * // Basic usage - triggers widget
+ * <FeedbackButton />
+ *
+ * // Custom label and style
+ * <FeedbackButton
+ *   label="Give Feedback"
+ *   variant="secondary"
+ *   size="lg"
+ * />
+ *
+ * // With custom click handler
+ * <FeedbackButton
+ *   label="Report Issue"
+ *   onClick={() => console.log('clicked')}
+ * />
+ * ```
+ */
+declare function FeedbackButton({ variant, size, showIcon, icon, label, className, style, primaryColor, onClick, disabled, }: FeedbackButtonProps): React.ReactElement;
+
 interface IntentAIUser {
     id?: string;
     email?: string;
@@ -102,29 +245,30 @@ declare global {
  */
 declare function IntentAIWidget({ apiKey, apiUrl, widgetUrl, position, theme, primaryColor, allowVoice, allowText, allowScreenshot, customMetadata, user, onOpen: _onOpen, onClose: _onClose, onFeedbackSubmitted: _onFeedbackSubmitted, onError, }: IntentAIProps): null;
 /**
- * Hook to control the Intent AI widget programmatically
+ * Hook to control the script-tag widget programmatically
+ * @deprecated Use useIntentAI from IntentAIProvider instead for React apps
  *
  * @example
  * ```tsx
- * import { IntentAIWidget, useIntentAI } from '@intent-ai/react';
+ * import { IntentAIWidget, useWidgetControls } from '@intentai/react';
  *
  * function App() {
- *   const { open, close, identify } = useIntentAI();
+ *   const { open, close, identify } = useWidgetControls();
  *
  *   return (
  *     <>
- *       <IntentAIWidget apiKey="your-api-key" />
+ *       <IntentAIWidget apiKey="your-api-key" widgetUrl="..." apiUrl="..." />
  *       <button onClick={open}>Open Feedback</button>
  *     </>
  *   );
  * }
  * ```
  */
-declare function useIntentAI(): {
+declare function useWidgetControls(): {
     open: () => void;
     close: () => void;
     identify: (user: IntentAIUser) => void;
     setMetadata: (metadata: Record<string, any>) => void;
 };
 
-export { type IntentAIConfig, type IntentAIProps, type IntentAIUser, IntentAIWidget, PremiumVoiceWidget, type WidgetConfig as PremiumWidgetConfig, IntentAIWidget as default, useIntentAI };
+export { FeedbackButton, type FeedbackButtonProps, type IntentAIConfig, type IntentAIContextValue, type IntentAIProps, IntentAIProvider, type IntentAIProviderConfig, type IntentAIProviderProps, type IntentAIUser, IntentAIWidget, PremiumVoiceWidget, type WidgetConfig as PremiumWidgetConfig, IntentAIWidget as default, useIdentify, useIntentAI, useSetMetadata, useWidgetControls };