Popover

組み合わせた SwiftUI トリガーから、ネイティブ SwiftUI Popover を表示します。

#インポート

@quickgui/solid/swift-ui から Popover をインポートします。

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

#使い方

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

#構成

Popover.Trigger
Popover.Content

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

#API リファレンス

項目を展開すると説明と完全なシグネチャが表示されます。ダッシュは宣言に既定値が記載されていないことを示します。

`Popover`

ソースを見る

Popover(props: PopoverProps): NativeNode

testIDstring—

Stable identifier exposed to macOS accessibility and UI testing.

string

ソースを見る

modifiersViewModifier[]—

SwiftUI modifiers, applied in array order.

ViewModifier[]

ソースを見る

childrenunknown—

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

unknown

ソースを見る

isPresentedboolean—

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

boolean

ソースを見る

onIsPresentedChange(isPresented: boolean) => void—

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

(isPresented: boolean) => void

ソースを見る

attachmentAnchorPopoverAttachmentAnchor—

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

PopoverAttachmentAnchor

ソースを見る

arrowEdgePopoverArrowEdge—

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

PopoverArrowEdge

ソースを見る

ref((node: NativeNode) => void) | NativeNode—

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

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

ソースを見る

`Popover.Trigger`

ソースを見る

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

ソースを見る

onPress(event: QuickGuiEvent) => void—

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

(event: QuickGuiEvent) => void

ソースを見る

ref(node: NativeNode) => void—

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

(node: NativeNode) => void

ソースを見る

`Popover.Content`

ソースを見る

Popover.Content(props: PopoverContentProps): NativeNode

childrenunknown—

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

unknown

ソースを見る

ref((node: NativeNode) => void) | NativeNode—

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

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

ソースを見る