AIPopoverOptions

Interface defining configuration options for AI-assisted popovers in the Stripo Email Editor Extensions SDK.

interface AIPopoverOptions

Description

The AIPopoverOptions interface configures AI-powered content generation popovers that can be anchored to specific elements in the editor. These popovers provide context-aware AI assistance for generating email content, subject lines, preheaders, and other text elements.

Import

import { AIPopoverOptions } from '@stripoinc/ui-editor-extensions';

Properties

targetElement

HTML element that the popover anchors to.

targetElement: HTMLElement

Type

HTMLElement

Usage Notes

• Required for computing popover placement
• Should be a visible element in the DOM
• Typically the element being edited or a related button
• Popover positioning is calculated relative to this element

Example

{
    targetElement: container.querySelector('#ai-button')
}

---

preferredSides

Ordered array of preferred placement sides for the popover.

preferredSides: PopoverSide[]

Type

PopoverSide[] - Array of placement preferences

PopoverSide Enum

enum PopoverSide {
    TOP = 'top',
    RIGHT = 'right',
    BOTTOM = 'bottom',
    LEFT = 'left'
}

Usage Notes

• Defines fallback positioning when space is constrained
• First available position in the array is used
• If no preferred sides fit, the popover auto-positions
• Order matters - earlier positions have higher priority

Example

{
    preferredSides: [PopoverSide.BOTTOM, PopoverSide.TOP, PopoverSide.RIGHT]
}

---

type

Specifies the AI intent or content type to generate.

type: ExtensionPopoverType

Type

ExtensionPopoverType

ExtensionPopoverType Enum

enum ExtensionPopoverType {
    AI_HIDDEN_PREHEADER = 'aiHiddenPreheader',
    AI_SUBJECT = 'aiSubject',
    AI_TEXT = 'aiText'
}

Usage Notes

• Determines the AI model's behavior and prompting
• AI_TEXT - General text content generation
• AI_SUBJECT - Email subject line generation
• AI_HIDDEN_PREHEADER - Preheader text generation
• Each type optimizes for different content characteristics

Example

{
    type: ExtensionPopoverType.AI_TEXT
}

---

value

Initial text context that seeds the AI generation.

value: string

Type

string

Usage Notes

• Provides context for more relevant AI suggestions
• Can be existing content to improve or refine
• Empty string for completely new content generation
• AI uses this as a starting point or reference

Example

{
    value: 'Welcome to our newsletter'
}

---

onResult

Callback function invoked when AI generation completes.

onResult: (response: string) => void

Type

(response: string) => void

Parameters

Parameter	Type	Description
response	string	The AI-generated text content

Usage Notes

• Not called if user cancels the popover
• Use this to update your block's content
• Should handle the response asynchronously

Example

{
    onResult: (generatedText: string) => {
        console.log('AI generated:', generatedText);
        // Update block content with generated text
    }
}