Import
import { Select } from "@typed/ui";Access Select.Trigger through the imported Select 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, TriggerProps<Options>>, Options["content"], Host>): Fx<RenderEvent, Renderable.Error<Options | Host>, Renderable.Services<Options | Host> | Scope.Scope | RenderTemplate>;Examples
import { RefSubject } from "@typed/fx";
import { html } from "@typed/template";
import { component } from "@typed/ui/Component";
import * as Select from "@typed/ui/Select";
export const DensityPicker = component(function* () {
const state = yield* Select.makeState({ id: "density-options", value: "comfortable" });
const collection = yield* Select.makeCollection();
const label = RefSubject.map(state, ({ value }) =>
value === "compact" ? "Density: compact" : "Density: comfortable",
);
return html`<div class="density-picker">
${Select.Trigger({ state, content: label })}
${Select.Content({
state, collection,
content: [
Select.Option({
state, collection, id: "density-comfortable", value: "comfortable",
textValue: "Comfortable", content: "Comfortable",
}),
Select.Option({
state, collection, id: "density-compact", value: "compact",
textValue: "Compact", content: "Compact",
}),
],
})}
</div>`;
});Other public imports
These import paths expose the same declaration. Each page retains its own public name and signature.