BetaPublic beta — Read the release notes
Documentation

Popover

Non-modal floating content panel.

Package
@solidiom/popover
Version
0.0.1-next.0
Status
stable

Generated from the package's public source.

API

Anchorcomponent

@solidiom/popover — Headless popover primitive with dismiss behavior and focus trapping. Parts: Root, Trigger, Content, Close, Anchor.

                        Anchor(props: PopoverAnchorProps): Element
                      

Props

ref?
(el: HTMLElement) => void

children: Element

View source

Closecomponent

@solidiom/popover — Headless popover primitive with dismiss behavior and focus trapping. Parts: Root, Trigger, Content, Close, Anchor.

                        Close(props: PopoverCloseProps): Element
                      

Props

class?
string
ref?
(el: HTMLButtonElement) => void
style?
string | CSSProperties

children: Element

View source

Contentcomponent

@solidiom/popover — Headless popover primitive with dismiss behavior and focus trapping. Parts: Root, Trigger, Content, Close, Anchor.

                        Content(props: PopoverContentProps): Element
                      

Props

class?
string
ref?
(el: HTMLDivElement) => void
style?
string | CSSProperties
trapFocus?
boolean — Disable focus trapping. Default: true (trapping enabled when modal).

children: Element

View source

PopoverAnchorPropsinterface

Props for the popover anchor element.

Props

ref?
(el: HTMLElement) => void

children: Element

View source

PopoverClosePropsinterface

Props for the popover close button.

Props

class?
string
ref?
(el: HTMLButtonElement) => void
style?
string | CSSProperties

children: Element

View source

PopoverContentPropsinterface

Props for the popover content panel.

Props

class?
string
ref?
(el: HTMLDivElement) => void
style?
string | CSSProperties
trapFocus?
boolean — Disable focus trapping. Default: true (trapping enabled when modal).

children: Element

View source

PopoverRootPropsinterface

Props for the popover root provider.

Props

defaultOpen?
boolean — Default open state (uncontrolled).
modal?
boolean — Whether the popover is modal (traps focus). Default: false.
onOpenChange?
(open: boolean, details: ChangeDetails<DisclosureReason>) => void — Called when open state change is requested.
open?
Accessor<boolean> — Controlled open state.
positioning?
PositioningPort — Positioning adapter for floating placement.

children: Element

View source

PopoverTriggerPropsinterface

Props for the popover trigger button.

Props

class?
string
ref?
(el: HTMLButtonElement) => void
style?
string | CSSProperties

children: Element

View source

PositioningPortinterface

Positioning adapter port injected by the consumer.

Props

update
(reference: HTMLElement, floating: HTMLElement) => void | () => void — Compute and apply position styles to the content element.

View source

Rootcomponent

@solidiom/popover — Headless popover primitive with dismiss behavior and focus trapping. Parts: Root, Trigger, Content, Close, Anchor.

                        Root(props: PopoverRootProps): Element
                      

Props

defaultOpen?
boolean — Default open state (uncontrolled).
modal?
boolean — Whether the popover is modal (traps focus). Default: false.
onOpenChange?
(open: boolean, details: ChangeDetails<DisclosureReason>) => void — Called when open state change is requested.
open?
Accessor<boolean> — Controlled open state.
positioning?
PositioningPort — Positioning adapter for floating placement.

children: Element

View source

Triggercomponent

@solidiom/popover — Headless popover primitive with dismiss behavior and focus trapping. Parts: Root, Trigger, Content, Close, Anchor.

                        Trigger(props: PopoverTriggerProps): Element
                      

Props

class?
string
ref?
(el: HTMLButtonElement) => void
style?
string | CSSProperties

children: Element

View source