prosekit/vue/inline-popover

Emits for the InlinePopover component.

• CreateEmits<InlinePopoverEvents>

openChange: (event: boolean) => void

Fired when the open state changes.

---

Props for the InlinePopover component.

• Partial<InlinePopoverProps>

altBoundary?: boolean

Whether to check the alternate elementContext’s boundary. Please see https://floating-ui.com/docs/detectoverflow#altboundary for more information.

Default

Section titled “Default”

false

autoUpdate?: boolean | AutoUpdateOptions

Options to activate auto-update listeners

See

Section titled “See”

https://floating-ui.com/docs/autoUpdate

Default

Section titled “Default”

true

boundary?: Boundary

Describes the clipping element(s) or area that overflow will be checked relative to. Please see https://floating-ui.com/docs/detectoverflow#boundary for more information.

Default

Section titled “Default”

'clippingAncestors'

defaultOpen?: boolean

Whether the popover is open by default when some inline content is selected.

When defaultOpen is true, the popover will open or close based on the inline selection. When defaultOpen is false, the popover will never be opened unless the open prop is true.

Default

Section titled “Default”

true

dismissOnEscape?: boolean

Whether the inline popover should be dismissed when the editor receives an Escape key press.

Default

Section titled “Default”

true

elementContext?: ElementContext

The element that will be used to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#elementcontext for more information.

Default

Section titled “Default”

'floating'

fitViewport?: boolean

Whether to constrain the floating element’s width and height to not exceed the viewport.

Default

Section titled “Default”

false

flip?: boolean | Placement[]

Whether to flip the placement in order to keep it in view when the preferred placement(s) will overflow the clipping boundary. You can also provide an array of placements to try sequentially if the preferred placement does not fit.

Default

Section titled “Default”

true

hide?: boolean

Default

Section titled “Default”

true

hoist?: boolean

Whether to use the browser Popover API to place the floating element on top of other page content. When enabled, the floating element won’t be clipped by an ancestor. This provides a similar result to React’s <Portals> or Vue’s <Teleport>.

Default

Section titled “Default”

true

inline?: boolean

Default

Section titled “Default”

true

offset?: OffsetOptions

Default

Section titled “Default”

12

open?: boolean

Whether the popover is open.

Notice that the popover will be always hidden if the inline selection is empty.

Default

Section titled “Default”

false

overflowPadding?: number

Default

Section titled “Default”

8

overlap?: boolean

Default

Section titled “Default”

true

placement?: Placement

Default

Section titled “Default”

"top"

rootBoundary?: RootBoundary

Describes the root boundary that the element will be checked for overflow relative to. Please see https://floating-ui.com/docs/detectoverflow#rootboundary for more information.

Default

Section titled “Default”

'viewport'

sameHeight?: boolean

Whether to constrain the floating element’s height so that it matches the reference element.

Default

Section titled “Default”

false

sameWidth?: boolean

Whether to constrain the floating element’s width so that it matches the reference element.

Default

Section titled “Default”

false

shift?: boolean

Whether the floating element should shift to keep it in view.

Default

Section titled “Default”

true

strategy?: "fixed" | "absolute"

The strategy to use for positioning

Default

Section titled “Default”

"absolute"

transform?: boolean

Whether to use CSS transforms to position the floating element instead of layout (top and left CSS properties). CSS transforms are more performant, but can cause conflicts with transform animations.

Default

Section titled “Default”

false

const InlinePopover: DefineSetupFnComponent<InlinePopoverProps & HTMLAttributes, InlinePopoverEmits>