---
url: https://plugin.stripo.email/extensions/reference/types/AIPopoverOptions.md
---
# AIPopoverOptions

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

```typescript
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

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

## Properties

### targetElement

HTML element that the popover anchors to.

```typescript
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

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

***

### preferredSides

Ordered array of preferred placement sides for the popover.

```typescript
preferredSides: PopoverSide[]
```

#### Type

`PopoverSide[]` - Array of placement preferences

#### PopoverSide Enum

```typescript
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

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

***

### type

Specifies the AI intent or content type to generate.

```typescript
type: ExtensionPopoverType
```

#### Type

`ExtensionPopoverType`

#### ExtensionPopoverType Enum

```typescript
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

```typescript
{
    type: ExtensionPopoverType.AI_TEXT
}
```

***

### value

Initial text context that seeds the AI generation.

```typescript
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

```typescript
{
    value: 'Welcome to our newsletter'
}
```

***

### onResult

Callback function invoked when AI generation completes.

```typescript
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

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