function / @typed/ui/index

Popover.Trigger

Renders a native button that opens popover content.

Learn this UI primitive →

Package version
1.0.0-beta.13
Category
Opening controls
Since
1.0.0
Member of
Popover

Import

import { Popover } from "@typed/ui/index";

Access Popover.Trigger through the imported Popover export. Its declaration below describes the member.

This public exposure is a re-export. Its import path is supported; declaration documentation is shared with the other public exposures below.

Signatures

export declare function Trigger<const Options extends TriggerOptions, const Host extends HostResult = never>(options: Options, host?: Dom.HostOverride<Dom.RenderHostProps<Options, TriggerInternalProps<Options>>, Options["content"], Host>): Fx<RenderEvent, Renderable.Error<Options | Host>, Renderable.Services<Options | Host> | Scope.Scope | RenderTemplate>;

Why

It preserves button keyboard behavior, native target commands, real DOM events, and an explicit state fallback when no target id is supplied.

Ownership and lifetime

Running the Fx owns reactive ARIA state and listeners in its Scope. A custom host must preserve button type, target props, aria-expanded, and handlers.

Examples

import { Effect } from "effect"
import * as Popover from "@typed/ui/Popover"

const program = Effect.gen(function* () {
  const state = yield* Popover.makeState()
  return Popover.Trigger({ state, controls: "account", content: "Account" })
})

Other public imports

These import paths expose the same declaration. Each page retains its own public name and signature.

Source