Skip to content
QuickGUI

Popover

Presents a native SwiftUI popover from a composed SwiftUI trigger.

#Import

Import Popover from @quickgui/solid/swift-ui.

import { Host, Popover } from "@quickgui/solid/swift-ui";

#Usage

<Popover
  isPresented={open()}
  onIsPresentedChange={setOpen}
  attachmentAnchor="bottom"
  arrowEdge="top"
>
  <Popover.Trigger render={<Button label="Open" />} />
  <Popover.Content>
    <QuickGUIHostView width={280} height={120}>
      <SettingsPanel />
    </QuickGUIHostView>
  </Popover.Content>
</Popover>

#Anatomy

  • Popover.Trigger
  • Popover.Content
<Popover isPresented={open()} onIsPresentedChange={setOpen}>
  <Popover.Trigger render={<Button label="Open" />} />
  <Popover.Content>{/* SwiftUI-hosted content */}</Popover.Content>
</Popover>

#API reference

Expand an entry for its description and complete signature. A dash means no declaration default is documented.

Popover

View source
Popover(props: PopoverProps): NativeNode
testIDstring—

Stable identifier exposed to macOS accessibility and UI testing.

string
View source
modifiersViewModifier[]—

SwiftUI modifiers, applied in array order.

ViewModifier[]
View source
childrenunknown—

Declares children (optional). Reactive JSX expressions update this property in place.

unknown
View source
isPresentedboolean—

Declares isPresented. Reactive JSX expressions update this property in place.

boolean
View source
onIsPresentedChange(isPresented: boolean) => void—

Declares onIsPresentedChange (optional). Reactive JSX expressions update this property in place.

(isPresented: boolean) => void
View source
attachmentAnchorPopoverAttachmentAnchor—

Declares attachmentAnchor (optional). Reactive JSX expressions update this property in place.

PopoverAttachmentAnchor
View source
arrowEdgePopoverArrowEdge—

Declares arrowEdge (optional). Reactive JSX expressions update this property in place.

PopoverArrowEdge
View source
ref((node: NativeNode) => void) | NativeNode—

Declares ref (optional). Reactive JSX expressions update this property in place.

((node: NativeNode) => void) | NativeNode
View source

Popover.Trigger

View source
Popover.Trigger(props: PopoverTriggerProps): NativeNode
renderJSX.Element—

Native SwiftUI component used as the trigger. This follows Base UI's composition shape: Trigger supplies behavior and `render` replaces its default element. The rendered component's own press handler runs before Trigger's behavior.

JSX.Element
View source
onPress(event: QuickGuiEvent) => void—

Called after the rendered component's own press handler and before the popover opens.

(event: QuickGuiEvent) => void
View source
ref(node: NativeNode) => void—

Receives the rendered trigger component rather than the internal structural slot.

(node: NativeNode) => void
View source

Popover.Content

View source
Popover.Content(props: PopoverContentProps): NativeNode
childrenunknown—

Declares children (optional). Reactive JSX expressions update this property in place.

unknown
View source
ref((node: NativeNode) => void) | NativeNode—

Declares ref (optional). Reactive JSX expressions update this property in place.

((node: NativeNode) => void) | NativeNode
View source