@prosdevlab/experience-sdk-plugins 0.2.0 → 0.3.0

package/dist/index.d.ts

@@ -1,57 +1,187 @@
-import { PluginFunction } from '@lytics/sdk-kit';
+import { PluginFunction, SDK } from '@lytics/sdk-kit';
+export { PluginFunction } from '@lytics/sdk-kit';
 
 /**
- * Shared types for Experience SDK plugins
- * These types are re-exported by core for user convenience
- */
-/**
- * Experience content - varies by type
+ * Inline plugin configuration
  */
-type ExperienceContent = BannerContent | ModalContent | TooltipContent;
+interface InlinePluginConfig {
+    inline?: {
+        /** Retry selector lookup if not found (default: false) */
+        retry?: boolean;
+        /** Retry timeout in ms (default: 5000) */
+        retryTimeout?: number;
+    };
+}
 /**
- * Banner content configuration
+ * Inline content configuration
  */
-interface BannerContent {
-    title?: string;
+interface InlineContent$1 {
+    /** CSS selector for target element */
+    selector: string;
+    /** Where to insert content (default: 'replace') */
+    position?: 'replace' | 'append' | 'prepend' | 'before' | 'after';
+    /** HTML content to insert */
     message: string;
-    buttons?: Array<{
-        text: string;
-        action?: string;
-        url?: string;
-        variant?: 'primary' | 'secondary' | 'link';
-        metadata?: Record<string, any>;
-        className?: string;
-        style?: Record<string, string>;
-    }>;
+    /** Show close button (default: false) */
     dismissable?: boolean;
-    position?: 'top' | 'bottom';
+    /** Remember dismissal in localStorage (default: false) */
+    persist?: boolean;
+    /** Custom CSS class */
     className?: string;
+    /** Inline styles */
     style?: Record<string, string>;
 }
 /**
- * Modal content configuration
+ * Inline plugin API
  */
-interface ModalContent {
-    title: string;
-    message: string;
-    confirmText?: string;
-    cancelText?: string;
+interface InlinePlugin {
+    /** Show an inline experience */
+    show(experience: any): void;
+    /** Remove a specific inline experience */
+    remove(experienceId: string): void;
+    /** Check if an inline experience is showing */
+    isShowing(experienceId?: string): boolean;
 }
 /**
- * Modal content configuration
+ * Insertion position for inline content
  */
-interface ModalContent {
-    title: string;
+type InsertionPosition = 'replace' | 'append' | 'prepend' | 'before' | 'after';
+
+interface ModalConfig {
+    modal?: {
+        /** Allow dismissal via close button (default: true) */
+        dismissable?: boolean;
+        /** Allow dismissal via backdrop click (default: true) */
+        backdropDismiss?: boolean;
+        /** Z-index for modal (default: 10001) */
+        zIndex?: number;
+        /** Modal size (default: 'md') */
+        size?: 'sm' | 'md' | 'lg' | 'fullscreen' | 'auto';
+        /** Auto-fullscreen on mobile screens <640px (default: true for 'lg', false for others) */
+        mobileFullscreen?: boolean;
+        /** Modal position (default: 'center') */
+        position?: 'center' | 'bottom';
+        /** Animation type (default: 'fade') */
+        animation?: 'fade' | 'slide-up' | 'none';
+        /** Animation duration in ms (default: 200) */
+        animationDuration?: number;
+    };
+}
+interface ModalContent$1 {
+    /** Optional hero image at top of modal */
+    image?: {
+        /** Image source URL */
+        src: string;
+        /** Alt text for accessibility */
+        alt: string;
+        /** Max height in pixels (default: 300, 200 on mobile) */
+        maxHeight?: number;
+    };
+    /** Modal title */
+    title?: string;
+    /** Modal message (supports HTML via sanitizer) */
     message: string;
-    confirmText?: string;
-    cancelText?: string;
+    /** Array of action buttons */
+    buttons?: ExperienceButton[];
+    /** Optional form configuration */
+    form?: FormConfig;
+    /** Custom CSS class */
+    className?: string;
+    /** Inline styles */
+    style?: Record<string, string>;
+}
+interface FormConfig {
+    /** Array of form fields */
+    fields: FormField[];
+    /** Submit button configuration */
+    submitButton: ExperienceButton;
+    /** Success state after submission */
+    successState?: FormState;
+    /** Error state on submission failure */
+    errorState?: FormState;
+    /** Custom validation function (optional) */
+    validate?: (data: Record<string, string>) => ValidationResult;
+}
+interface FormField {
+    /** Field name (used in form data) */
+    name: string;
+    /** Field type */
+    type: 'email' | 'text' | 'textarea' | 'tel' | 'url' | 'number';
+    /** Label text (optional) */
+    label?: string;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Required field (default: false) */
+    required?: boolean;
+    /** Custom validation pattern (regex) */
+    pattern?: string;
+    /** Error message for validation failure */
+    errorMessage?: string;
+    /** Custom CSS class */
+    className?: string;
+    /** Inline styles */
+    style?: Record<string, string>;
 }
+interface FormState {
+    /** Title to show in success/error state */
+    title?: string;
+    /** Message to show */
+    message: string;
+    /** Optional buttons (e.g., "Close", "Try Again") */
+    buttons?: ExperienceButton[];
+}
+interface ValidationResult {
+    /** Whether validation passed */
+    valid: boolean;
+    /** Validation errors by field name */
+    errors?: Record<string, string>;
+}
+interface ModalPlugin {
+    /** Show a modal experience */
+    show(experience: any): void;
+    /** Remove a specific modal */
+    remove(experienceId: string): void;
+    /** Check if a modal is showing */
+    isShowing(experienceId?: string): boolean;
+    /** Show form success or error state */
+    showFormState(experienceId: string, state: 'success' | 'error'): void;
+    /** Reset form to initial state */
+    resetForm(experienceId: string): void;
+    /** Get current form data */
+    getFormData(experienceId: string): Record<string, string> | null;
+}
+
 /**
- * Tooltip content configuration
+ * Shared types for Experience SDK plugins
+ * These types are re-exported by core for user convenience
  */
-interface TooltipContent {
+
+type ModalContent = ModalContent$1;
+type InlineContent = InlineContent$1;
+/**
+ * Experience button configuration (used across all experience types)
+ */
+interface ExperienceButton {
+    text: string;
+    action?: string;
+    url?: string;
+    variant?: 'primary' | 'secondary' | 'link';
+    dismiss?: boolean;
+    metadata?: Record<string, any>;
+    className?: string;
+    style?: Record<string, string>;
+}
+/**
+ * Banner content configuration
+ */
+interface BannerContent {
+    title?: string;
     message: string;
-    position?: 'top' | 'bottom' | 'left' | 'right';
+    buttons?: ExperienceButton[];
+    dismissable?: boolean;
+    position?: 'top' | 'bottom';
+    className?: string;
+    style?: Record<string, string>;
 }
 /**
  * Tooltip content configuration
@@ -60,6 +190,10 @@ interface TooltipContent {
     message: string;
     position?: 'top' | 'bottom' | 'left' | 'right';
 }
+/**
+ * Experience content - varies by type
+ */
+type ExperienceContent = BannerContent | ModalContent | InlineContent | TooltipContent;
 /**
  * Experience definition
  */
@@ -361,6 +495,43 @@ interface FrequencyPlugin {
  */
 declare const frequencyPlugin: PluginFunction;
 
+/**
+ * Inline Plugin
+ *
+ * Embeds experiences directly within page content using DOM selectors.
+ * Supports multiple insertion positions and dismissal with persistence.
+ */
+declare const inlinePlugin: (plugin: any, instance: SDK, config: any) => void;
+
+/**
+ * Insert content into a target element using specified position
+ *
+ * @param selector - CSS selector for target element
+ * @param content - HTML content to insert
+ * @param position - Where to insert the content
+ * @param experienceId - Unique identifier for the experience
+ * @returns The created wrapper element, or null if target not found
+ */
+declare function insertContent(selector: string, content: string, position: InsertionPosition, experienceId: string): HTMLElement | null;
+/**
+ * Remove inline content by experience ID
+ *
+ * @param experienceId - Unique identifier for the experience
+ * @returns True if element was found and removed, false otherwise
+ */
+declare function removeContent(experienceId: string): boolean;
+
+/**
+ * Modal Plugin for @prosdevlab/experience-sdk
+ *
+ * Renders experiences as accessible modal dialogs with:
+ * - Focus trap and keyboard handling
+ * - ARIA attributes for screen readers
+ * - Backdrop and close button
+ * - Responsive design
+ */
+declare const modalPlugin: (plugin: any, instance: SDK) => void;
+
 /**
  * Page Visits Plugin Types
  *
@@ -834,4 +1005,4 @@ interface TimeDelayPlugin {
  */
 declare const timeDelayPlugin: PluginFunction;
 
-export { type BannerContent, type BannerPlugin, type BannerPluginConfig, type DebugPlugin, type DebugPluginConfig, type Decision, type DecisionMetadata, type ExitIntentEvent, type ExitIntentPlugin, type ExitIntentPluginConfig, type Experience, type ExperienceContent, type FrequencyPlugin, type FrequencyPluginConfig, type ModalContent, type PageVisitsEvent, type PageVisitsPlugin, type PageVisitsPluginConfig, type ScrollDepthEvent, type ScrollDepthPlugin, type ScrollDepthPluginConfig, type TimeDelayEvent, type TimeDelayPlugin, type TimeDelayPluginConfig, type TooltipContent, type TraceStep, bannerPlugin, debugPlugin, exitIntentPlugin, frequencyPlugin, pageVisitsPlugin, scrollDepthPlugin, timeDelayPlugin };
+export { type BannerContent, type BannerPlugin, type BannerPluginConfig, type DebugPlugin, type DebugPluginConfig, type Decision, type DecisionMetadata, type ExitIntentEvent, type ExitIntentPlugin, type ExitIntentPluginConfig, type Experience, type ExperienceContent, type FormConfig, type FormField, type FormState, type FrequencyPlugin, type FrequencyPluginConfig, type InlineContent$1 as InlineContent, type InlinePlugin, type InlinePluginConfig, type InsertionPosition, type ModalConfig, type ModalContent, type ModalPlugin, type PageVisitsEvent, type PageVisitsPlugin, type PageVisitsPluginConfig, type ScrollDepthEvent, type ScrollDepthPlugin, type ScrollDepthPluginConfig, type TimeDelayEvent, type TimeDelayPlugin, type TimeDelayPluginConfig, type TooltipContent, type TraceStep, type ValidationResult, bannerPlugin, debugPlugin, exitIntentPlugin, frequencyPlugin, inlinePlugin, insertContent, modalPlugin, pageVisitsPlugin, removeContent, scrollDepthPlugin, timeDelayPlugin };