- Name
service- Kind
- parameter
- Type
PopoverService- Requirement
- required
DocsAPI referenceHeadlesspopover
popover headless API
The core connector and vanilla mount are always visible. Use the framework choice to inspect native composition, props, outputs, context and hooks for the selected adapter.
@grassroot/ui-headless-core/popover
Core connector and vanilla API
activatePopoverLayer
functionActivates Popover's non-modal layer after Content is mounted. This is the DropdownMenu `activateMenuLayer` pattern adapted to the Popover service: no focus trap and no scroll lock, with top-layer-only Escape/outside-click ownership and idempotent release.
declare function activatePopoverLayer(service: PopoverService, scope: PartScope, doc: Document): () => void;servicePopoverServicescopePartScopedocDocumentreturn() => void- Name
scope- Kind
- parameter
- Type
PartScope- Requirement
- required
- Name
doc- Kind
- parameter
- Type
Document- Requirement
- required
- Name
return- Kind
- return value
- Type
() => void- Requirement
- n/a
connectPopover
functiondeclare function connectPopover(service: PopoverService, scope: PartScope, _options?: PopoverConnectOptions): PopoverApi;servicePopoverServicescopePartScope_optionsPopoverConnectOptionsreturnPopoverApi- Name
service- Kind
- parameter
- Type
PopoverService- Requirement
- required
- Name
scope- Kind
- parameter
- Type
PartScope- Requirement
- required
- Name
_options- Kind
- parameter
- Type
PopoverConnectOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
PopoverApi- Requirement
- n/a
mountPopover
functiondeclare function mountPopover(container: HTMLElement, options?: MountPopoverOptions): PopoverMount;containerHTMLElementoptionsMountPopoverOptionsreturnPopoverMount- Name
container- Kind
- parameter
- Type
HTMLElement- Requirement
- required
- Name
options- Kind
- parameter
- Type
MountPopoverOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
PopoverMount- Requirement
- n/a
MountPopoverOptions
interfaceinterface MountPopoverOptions extends PopoverInput { readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void; readonly renderTrigger?: (button: HTMLElement) => void; readonly renderContent?: (panel: HTMLElement) => void;}onOpenChange(detail: PopoverOpenChangeDetail) => voidrenderContent(panel: HTMLElement) => voidrenderTrigger(button: HTMLElement) => void- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
- Name
renderContent- Kind
- property
- Type
(panel: HTMLElement) => void- Requirement
- optional
- Name
renderTrigger- Kind
- property
- Type
(button: HTMLElement) => void- Requirement
- optional
popoverAnatomy
valueexport declare const popoverAnatomy: { readonly scope: "popover"; readonly parts: readonly ["trigger", "content"];};partsreadonly ["trigger", "content"]scope"popover"- Name
parts- Kind
- property
- Type
readonly ["trigger", "content"]- Requirement
- required
- Name
scope- Kind
- property
- Type
"popover"- Requirement
- required
PopoverApi
interfaceinterface PopoverApi { triggerProps(): PartProps; contentProps(): PartProps; readonly open: boolean;}contentProps() => PartPropsopenbooleantriggerProps() => PartProps- Name
contentProps- Kind
- method
- Type
() => PartProps- Requirement
- required
- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
triggerProps- Kind
- method
- Type
() => PartProps- Requirement
- required
PopoverConnectOptions
interfaceinterface PopoverConnectOptions {}PopoverMount
interfaceinterface PopoverMount { readonly service: PopoverService; readonly connector: PopoverApi; readonly root: HTMLElement; readonly trigger: HTMLElement; readonly content: HTMLElement | null; destroy(): void;}connectorPopoverApicontentHTMLElement | nulldestroy() => voidrootHTMLElementservicePopoverServicetriggerHTMLElement- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
content- Kind
- property
- Type
HTMLElement | null- Requirement
- required
- Name
destroy- Kind
- method
- Type
() => void- Requirement
- required
- Name
root- Kind
- property
- Type
HTMLElement- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
trigger- Kind
- property
- Type
HTMLElement- Requirement
- required
PopoverOpenChangeDetail
interfaceinterface PopoverOpenChangeDetail { readonly open: boolean; readonly reason: PopoverChangeReason;}openbooleanreasonPopoverChangeReason- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
reason- Kind
- property
- Type
PopoverChangeReason- Requirement
- required
PopoverPart
typetype PopoverPart = (typeof popoverAnatomy.parts)[number];PopoverService
typetype PopoverService = Service<PopoverInput, PopoverStateValue, PopoverContext, PopoverEvent, PopoverCommand>;runPopoverCommand
functiondeclare function runPopoverCommand(command: PopoverCommand, _scope: PartScope, options?: { readonly onOpenChange?: (detail: { open: boolean; reason: PopoverChangeReason; }) => void;}): void;commandPopoverCommand_scopePartScopeoptions{
readonly onOpenChange?: (detail: {
open: boolean;
reason: PopoverChangeReason;
}) => void;
}returnvoid- Name
command- Kind
- parameter
- Type
PopoverCommand- Requirement
- required
- Name
_scope- Kind
- parameter
- Type
PartScope- Requirement
- required
- Name
options- Kind
- parameter
- Type
{ readonly onOpenChange?: (detail: { open: boolean; reason: PopoverChangeReason; }) => void; }- Requirement
- optional
- Name
return- Kind
- return value
- Type
void- Requirement
- n/a
Framework adapters
Each panel keeps its adapter's public vocabulary. React compound exports, Vue composables, standalone Angular declarations, Svelte components, and Solid hooks stay native to their framework.
React imports
import { Content, Popover, Root, Trigger } from "@grassroot/ui-headless-react/popover";Vue imports
<script setup lang="ts">import { PopoverContent, PopoverRoot, PopoverTrigger } from "@grassroot/ui-headless-vue/popover";</script>Angular imports
import { Component } from "@angular/core";import { GR_POPOVER_DECLARATIONS } from "@grassroot/ui-headless-angular/popover"; @Component({ standalone: true, imports: [GR_POPOVER_DECLARATIONS], template: `<!-- compose the popover parts here -->` })export class Example {}Svelte imports
<script lang="ts"> import { PopoverContent, PopoverRoot, PopoverTrigger } from "@grassroot/ui-headless-svelte/popover";</script>Solid imports
import { PopoverContent, PopoverRoot, PopoverTrigger } from "@grassroot/ui-headless-solid/popover";@grassroot/ui-headless-react/popover
React adapter
Content
valueexport declare const Content: import("react").ForwardRefExoticComponent<PopoverContentProps & import("react").RefAttributes<HTMLDivElement>>;propsPreturnReactNode- Name
props- Kind
- parameter
- Type
P- Requirement
- required
- Name
return- Kind
- return value
- Type
ReactNode- Requirement
- n/a
Popover
valueexport declare const Popover: { Root: typeof Root; Trigger: import("react").ForwardRefExoticComponent<PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>; Content: import("react").ForwardRefExoticComponent<PopoverContentProps & import("react").RefAttributes<HTMLDivElement>>;};Contentimport("react").ForwardRefExoticComponent<PopoverContentProps & import("react").RefAttributes<HTMLDivElement>>Roottypeof RootTriggerimport("react").ForwardRefExoticComponent<PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>- Name
Content- Kind
- property
- Type
import("react").ForwardRefExoticComponent<PopoverContentProps & import("react").RefAttributes<HTMLDivElement>>- Requirement
- required
- Name
Root- Kind
- property
- Type
typeof Root- Requirement
- required
- Name
Trigger- Kind
- property
- Type
import("react").ForwardRefExoticComponent<PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>- Requirement
- required
PopoverContentProps
interfaceinterface PopoverContentProps extends ComponentPropsWithoutRef<"div"> { readonly asChild?: boolean;}asChildboolean- Name
asChild- Kind
- property
- Type
boolean- Requirement
- optional
PopoverContext
valueexport declare const PopoverContext: import("react").Context<PopoverContextValue | null>;propsPreturnReactNode- Name
props- Kind
- parameter
- Type
P- Requirement
- required
- Name
return- Kind
- return value
- Type
ReactNode- Requirement
- n/a
PopoverContextValue
interfaceinterface PopoverContextValue { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope;}connectorPopoverApiscopePartScopeservicePopoverService- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
PopoverOpenChangeDetail
interfaceinterface PopoverOpenChangeDetail { readonly open: boolean; readonly reason: PopoverChangeReason;}openbooleanreasonPopoverChangeReason- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
reason- Kind
- property
- Type
PopoverChangeReason- Requirement
- required
PopoverRootProps
interfaceinterface PopoverRootProps { readonly open?: PopoverInput["open"]; readonly defaultOpen?: PopoverInput["defaultOpen"]; readonly side?: PopoverInput["side"]; readonly align?: PopoverInput["align"]; readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void; readonly children?: ReactNode;}alignPopoverInput["align"]childrenReactNodedefaultOpenPopoverInput["defaultOpen"]onOpenChange(detail: PopoverOpenChangeDetail) => voidopenPopoverInput["open"]sidePopoverInput["side"]- Name
align- Kind
- property
- Type
PopoverInput["align"]- Requirement
- optional
- Name
children- Kind
- property
- Type
ReactNode- Requirement
- optional
- Name
defaultOpen- Kind
- property
- Type
PopoverInput["defaultOpen"]- Requirement
- optional
- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
- Name
open- Kind
- property
- Type
PopoverInput["open"]- Requirement
- optional
- Name
side- Kind
- property
- Type
PopoverInput["side"]- Requirement
- optional
PopoverTriggerProps
interfaceinterface PopoverTriggerProps extends Omit<ComponentPropsWithoutRef<"button">, "type"> { readonly asChild?: boolean;}asChildboolean- Name
asChild- Kind
- property
- Type
boolean- Requirement
- optional
Root
functiondeclare function Root(props: PopoverRootProps): import("react").JSX.Element;propsPopoverRootPropsreturnimport("react").JSX.Element- Name
props- Kind
- parameter
- Type
PopoverRootProps- Requirement
- required
- Name
return- Kind
- return value
- Type
import("react").JSX.Element- Requirement
- n/a
Trigger
valueexport declare const Trigger: import("react").ForwardRefExoticComponent<PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;propsPreturnReactNode- Name
props- Kind
- parameter
- Type
P- Requirement
- required
- Name
return- Kind
- return value
- Type
ReactNode- Requirement
- n/a
usePopover
functiondeclare function usePopover(input: PopoverInput, options?: UsePopoverOptions): UsePopoverResult;inputPopoverInputoptionsUsePopoverOptionsreturnUsePopoverResult- Name
input- Kind
- parameter
- Type
PopoverInput- Requirement
- required
- Name
options- Kind
- parameter
- Type
UsePopoverOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
UsePopoverResult- Requirement
- n/a
usePopoverContext
functiondeclare function usePopoverContext(partName: string): PopoverContextValue;partNamestringreturnPopoverContextValue- Name
partName- Kind
- parameter
- Type
string- Requirement
- required
- Name
return- Kind
- return value
- Type
PopoverContextValue- Requirement
- n/a
UsePopoverOptions
interfaceinterface UsePopoverOptions { readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void;}onOpenChange(detail: PopoverOpenChangeDetail) => void- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
UsePopoverResult
interfaceinterface UsePopoverResult { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly snapshot: PopoverSnapshot;}connectorPopoverApiscopePartScopeservicePopoverServicesnapshotPopoverSnapshot- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
snapshot- Kind
- property
- Type
PopoverSnapshot- Requirement
- required
useServiceVersion
functionSubscribes a component to a service's committed-snapshot version.
declare function useServiceVersion<S extends Service<any, any, any, any, any, any>>(service: S): ReturnType<S["getSnapshot"]>;serviceSreturnReturnType<S["getSnapshot"]>- Name
service- Kind
- parameter
- Type
S- Requirement
- required
- Name
return- Kind
- return value
- Type
ReturnType<S["getSnapshot"]>- Requirement
- n/a
@grassroot/ui-headless-vue/popover
Vue adapter
PopoverContent
valueexport declare const PopoverContent: import("vue").DefineComponent<import("vue").ExtractPropTypes<{ asChild: { type: BooleanConstructor; default: boolean; };}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, { [key: string]: any;}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{ asChild: { type: BooleanConstructor; default: boolean; };}>> & Readonly<{}>, { asChild: boolean;}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;PopoverContextKey
valueexport declare const PopoverContextKey: InjectionKey<PopoverContextValue>;PopoverContextValue
interfaceinterface PopoverContextValue { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly snapshot: ShallowRef<PopoverSnapshot>;}connectorPopoverApiscopePartScopeservicePopoverServicesnapshotShallowRef<PopoverSnapshot>- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
snapshot- Kind
- property
- Type
ShallowRef<PopoverSnapshot>- Requirement
- required
PopoverOpenChangeDetail
interfaceinterface PopoverOpenChangeDetail { readonly open: boolean; readonly reason: PopoverChangeReason;}openbooleanreasonPopoverChangeReason- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
reason- Kind
- property
- Type
PopoverChangeReason- Requirement
- required
PopoverRoot
valueexport declare const PopoverRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{ open: { type: PropType<PopoverInput["open"]>; default: undefined; }; defaultOpen: { type: PropType<PopoverInput["defaultOpen"]>; default: undefined; }; side: { type: PropType<PopoverInput["side"]>; default: undefined; }; align: { type: PropType<PopoverInput["align"]>; default: undefined; };}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, { [key: string]: any;}>[] | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, { openChange: (_detail: PopoverOpenChangeDetail) => true;}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{ open: { type: PropType<PopoverInput["open"]>; default: undefined; }; defaultOpen: { type: PropType<PopoverInput["defaultOpen"]>; default: undefined; }; side: { type: PropType<PopoverInput["side"]>; default: undefined; }; align: { type: PropType<PopoverInput["align"]>; default: undefined; };}>> & Readonly<{ onOpenChange?: ((_detail: PopoverOpenChangeDetail) => any) | undefined;}>, { open: boolean | undefined; defaultOpen: boolean | undefined; side: "bottom" | "top" | undefined; align: "end" | "start" | undefined;}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;PopoverTrigger
valueexport declare const PopoverTrigger: import("vue").DefineComponent<import("vue").ExtractPropTypes<{ asChild: { type: BooleanConstructor; default: boolean; };}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, { [key: string]: any;}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{ asChild: { type: BooleanConstructor; default: boolean; };}>> & Readonly<{}>, { asChild: boolean;}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;providePopoverContext
functiondeclare function providePopoverContext(value: PopoverContextValue): void;valuePopoverContextValuereturnvoid- Name
value- Kind
- parameter
- Type
PopoverContextValue- Requirement
- required
- Name
return- Kind
- return value
- Type
void- Requirement
- n/a
usePopover
functiondeclare function usePopover(input: PopoverInput | (() => PopoverInput), options?: UsePopoverOptions): UsePopoverResult;inputPopoverInput | (() => PopoverInput)optionsUsePopoverOptionsreturnUsePopoverResult- Name
input- Kind
- parameter
- Type
PopoverInput | (() => PopoverInput)- Requirement
- required
- Name
options- Kind
- parameter
- Type
UsePopoverOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
UsePopoverResult- Requirement
- n/a
usePopoverContext
functiondeclare function usePopoverContext(partName: string): PopoverContextValue;partNamestringreturnPopoverContextValue- Name
partName- Kind
- parameter
- Type
string- Requirement
- required
- Name
return- Kind
- return value
- Type
PopoverContextValue- Requirement
- n/a
UsePopoverOptions
interfaceinterface UsePopoverOptions { readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void;}onOpenChange(detail: PopoverOpenChangeDetail) => void- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
UsePopoverResult
interfaceinterface UsePopoverResult { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly snapshot: ShallowRef<PopoverSnapshot>;}connectorPopoverApiscopePartScopeservicePopoverServicesnapshotShallowRef<PopoverSnapshot>- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
snapshot- Kind
- property
- Type
ShallowRef<PopoverSnapshot>- Requirement
- required
@grassroot/ui-headless-angular/popover
Angular adapter
createPopoverStore
functionexport declare function createPopoverStore(initialInput: PopoverInput, options?: CreatePopoverStoreOptions): PopoverStore;initialInputPopoverInputoptionsCreatePopoverStoreOptionsreturnPopoverStore- Name
initialInput- Kind
- parameter
- Type
PopoverInput- Requirement
- required
- Name
options- Kind
- parameter
- Type
CreatePopoverStoreOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
PopoverStore- Requirement
- n/a
CreatePopoverStoreOptions
interfaceexport interface CreatePopoverStoreOptions { readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void; readonly onCommit?: () => void;}onCommit() => voidonOpenChange(detail: PopoverOpenChangeDetail) => void- Name
onCommit- Kind
- property
- Type
() => void- Requirement
- optional
- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
createReentrantSafeTick
functionOne re-entrancy policy for every Angular store's zoneless commit nudge.
export declare function createReentrantSafeTick(appRef: ApplicationRef): () => void;appRefApplicationRefreturn() => void- Name
appRef- Kind
- parameter
- Type
ApplicationRef- Requirement
- required
- Name
return- Kind
- return value
- Type
() => void- Requirement
- n/a
GR_POPOVER_DECLARATIONS
valueexport declare const GR_POPOVER_DECLARATIONS: readonly [typeof GrPopoverRoot, typeof GrPopoverTrigger, typeof GrPopoverOpen, typeof GrPopoverContent];GrPopoverContent
classexport declare class GrPopoverContent extends PopoverPartBase { constructor(); static ɵfac: i0.ɵɵFactoryDeclaration<GrPopoverContent, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<GrPopoverContent, "[grPopoverContent]", never, {}, {}, never, never, true, never>;}ɵdiri0.ɵɵDirectiveDeclaration<GrPopoverContent, "[grPopoverContent]", never, {}, {}, never, never, true, never>ɵfaci0.ɵɵFactoryDeclaration<GrPopoverContent, never>- Name
ɵdir- Kind
- property
- Type
i0.ɵɵDirectiveDeclaration<GrPopoverContent, "[grPopoverContent]", never, {}, {}, never, never, true, never>- Requirement
- required
- Name
ɵfac- Kind
- property
- Type
i0.ɵɵFactoryDeclaration<GrPopoverContent, never>- Requirement
- required
GrPopoverOpen
classexport declare class GrPopoverOpen implements OnDestroy { private readonly store; private readonly template; private readonly view; private shown; constructor(); ngOnDestroy(): void; static ɵfac: i0.ɵɵFactoryDeclaration<GrPopoverOpen, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<GrPopoverOpen, "[grPopoverOpen]", never, {}, {}, never, never, true, never>;}ngOnDestroy() => voidɵdiri0.ɵɵDirectiveDeclaration<GrPopoverOpen, "[grPopoverOpen]", never, {}, {}, never, never, true, never>ɵfaci0.ɵɵFactoryDeclaration<GrPopoverOpen, never>shownanystoreanytemplateanyviewany- Name
ngOnDestroy- Kind
- method
- Type
() => void- Requirement
- required
- Name
ɵdir- Kind
- property
- Type
i0.ɵɵDirectiveDeclaration<GrPopoverOpen, "[grPopoverOpen]", never, {}, {}, never, never, true, never>- Requirement
- required
- Name
ɵfac- Kind
- property
- Type
i0.ɵɵFactoryDeclaration<GrPopoverOpen, never>- Requirement
- required
- Name
shown- Kind
- property
- Type
any- Requirement
- required
- Name
store- Kind
- property
- Type
any- Requirement
- required
- Name
template- Kind
- property
- Type
any- Requirement
- required
- Name
view- Kind
- property
- Type
any- Requirement
- required
GrPopoverRoot
classexport declare class GrPopoverRoot implements OnDestroy { readonly open: import("@angular/core").InputSignal<boolean | undefined>; readonly defaultOpen: import("@angular/core").InputSignal<boolean | undefined>; readonly side: import("@angular/core").InputSignal<"bottom" | "top" | undefined>; readonly align: import("@angular/core").InputSignal<"start" | "end" | undefined>; readonly openChange: import("@angular/core").OutputEmitterRef<PopoverOpenChangeDetail>; private readonly injector; private lastSynced; private releaseManagers; readonly store: PopoverStore; constructor(); ngOnDestroy(): void; static ɵfac: i0.ɵɵFactoryDeclaration<GrPopoverRoot, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<GrPopoverRoot, "[grPopoverRoot]", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, never, true, never>;}alignimport("@angular/core").InputSignal<"start" | "end" | undefined>defaultOpenimport("@angular/core").InputSignal<boolean | undefined>injectoranylastSyncedanyngOnDestroy() => voidopenimport("@angular/core").InputSignal<boolean | undefined>openChangeimport("@angular/core").OutputEmitterRef<PopoverOpenChangeDetail>ɵdiri0.ɵɵDirectiveDeclaration<GrPopoverRoot, "[grPopoverRoot]", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, never, true, never>ɵfaci0.ɵɵFactoryDeclaration<GrPopoverRoot, never>releaseManagersanysideimport("@angular/core").InputSignal<"bottom" | "top" | undefined>storePopoverStore- Name
align- Kind
- property
- Type
import("@angular/core").InputSignal<"start" | "end" | undefined>- Requirement
- required
- Name
defaultOpen- Kind
- property
- Type
import("@angular/core").InputSignal<boolean | undefined>- Requirement
- required
- Name
injector- Kind
- property
- Type
any- Requirement
- required
- Name
lastSynced- Kind
- property
- Type
any- Requirement
- required
- Name
ngOnDestroy- Kind
- method
- Type
() => void- Requirement
- required
- Name
open- Kind
- property
- Type
import("@angular/core").InputSignal<boolean | undefined>- Requirement
- required
- Name
openChange- Kind
- property
- Type
import("@angular/core").OutputEmitterRef<PopoverOpenChangeDetail>- Requirement
- required
- Name
ɵdir- Kind
- property
- Type
i0.ɵɵDirectiveDeclaration<GrPopoverRoot, "[grPopoverRoot]", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, never, true, never>- Requirement
- required
- Name
ɵfac- Kind
- property
- Type
i0.ɵɵFactoryDeclaration<GrPopoverRoot, never>- Requirement
- required
- Name
releaseManagers- Kind
- property
- Type
any- Requirement
- required
- Name
side- Kind
- property
- Type
import("@angular/core").InputSignal<"bottom" | "top" | undefined>- Requirement
- required
- Name
store- Kind
- property
- Type
PopoverStore- Requirement
- required
GrPopoverTrigger
classexport declare class GrPopoverTrigger extends PopoverPartBase { constructor(); static ɵfac: i0.ɵɵFactoryDeclaration<GrPopoverTrigger, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<GrPopoverTrigger, "[grPopoverTrigger]", never, {}, {}, never, never, true, never>;}ɵdiri0.ɵɵDirectiveDeclaration<GrPopoverTrigger, "[grPopoverTrigger]", never, {}, {}, never, never, true, never>ɵfaci0.ɵɵFactoryDeclaration<GrPopoverTrigger, never>- Name
ɵdir- Kind
- property
- Type
i0.ɵɵDirectiveDeclaration<GrPopoverTrigger, "[grPopoverTrigger]", never, {}, {}, never, never, true, never>- Requirement
- required
- Name
ɵfac- Kind
- property
- Type
i0.ɵɵFactoryDeclaration<GrPopoverTrigger, never>- Requirement
- required
POPOVER_STORE
valueexport declare const POPOVER_STORE: InjectionToken<PopoverStore>;PopoverOpenChangeDetail
interfaceexport interface PopoverOpenChangeDetail { readonly open: boolean; readonly reason: PopoverChangeReason;}openbooleanreasonPopoverChangeReason- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
reason- Kind
- property
- Type
PopoverChangeReason- Requirement
- required
PopoverStore
interfaceexport interface PopoverStore { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly version: WritableSignal<number>; start(): void; stop(): void; sync(input: PopoverInput): void; bindOpenChange?(handler: (detail: import("./use-popover.js").PopoverOpenChangeDetail) => void): void;}bindOpenChange((handler: (detail: import("./use-popover.js").PopoverOpenChangeDetail) => void) => void) | undefinedconnectorPopoverApiscopePartScopeservicePopoverServicestart() => voidstop() => voidsync(input: PopoverInput) => voidversionWritableSignal<number>- Name
bindOpenChange- Kind
- method
- Type
((handler: (detail: import("./use-popover.js").PopoverOpenChangeDetail) => void) => void) | undefined- Requirement
- optional
- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
start- Kind
- method
- Type
() => void- Requirement
- required
- Name
stop- Kind
- method
- Type
() => void- Requirement
- required
- Name
sync- Kind
- method
- Type
(input: PopoverInput) => void- Requirement
- required
- Name
version- Kind
- property
- Type
WritableSignal<number>- Requirement
- required
providePopoverStore
functionexport declare function providePopoverStore(): Provider;returnProvider- Name
return- Kind
- return value
- Type
Provider- Requirement
- n/a
@grassroot/ui-headless-svelte/popover
Svelte adapter
createPopover
functionexport declare function createPopover(inputGetter: () => PopoverInput, options?: UsePopoverOptions): UsePopoverResult;inputGetter() => PopoverInputoptionsUsePopoverOptionsreturnUsePopoverResult- Name
inputGetter- Kind
- parameter
- Type
() => PopoverInput- Requirement
- required
- Name
options- Kind
- parameter
- Type
UsePopoverOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
UsePopoverResult- Requirement
- n/a
PopoverContent
valueexport declare const PopoverContent: LegacyComponentType;argsParameters<Component<Record<string, any>>>returnReturnType<Component<Record<string, any>, Record<string, any>>>- Name
args- Kind
- parameter
- Type
Parameters<Component<Record<string, any>>>- Requirement
- optional
- Name
return- Kind
- return value
- Type
ReturnType<Component<Record<string, any>, Record<string, any>>>- Requirement
- n/a
PopoverContextValue
interfaceexport interface PopoverContextValue { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly version: () => number;}connectorPopoverApiscopePartScopeservicePopoverServiceversion() => number- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
version- Kind
- property
- Type
() => number- Requirement
- required
PopoverOpenChangeDetail
interfaceexport interface PopoverOpenChangeDetail { readonly open: boolean; readonly reason: PopoverChangeReason;}openbooleanreasonPopoverChangeReason- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
reason- Kind
- property
- Type
PopoverChangeReason- Requirement
- required
PopoverRoot
valueexport declare const PopoverRoot: LegacyComponentType;argsParameters<Component<Record<string, any>>>returnReturnType<Component<Record<string, any>, Record<string, any>>>- Name
args- Kind
- parameter
- Type
Parameters<Component<Record<string, any>>>- Requirement
- optional
- Name
return- Kind
- return value
- Type
ReturnType<Component<Record<string, any>, Record<string, any>>>- Requirement
- n/a
PopoverTrigger
valueexport declare const PopoverTrigger: LegacyComponentType;argsParameters<Component<Record<string, any>>>returnReturnType<Component<Record<string, any>, Record<string, any>>>- Name
args- Kind
- parameter
- Type
Parameters<Component<Record<string, any>>>- Requirement
- optional
- Name
return- Kind
- return value
- Type
ReturnType<Component<Record<string, any>, Record<string, any>>>- Requirement
- n/a
providePopoverContext
functionexport declare function providePopoverContext(value: PopoverContextValue): void;valuePopoverContextValuereturnvoid- Name
value- Kind
- parameter
- Type
PopoverContextValue- Requirement
- required
- Name
return- Kind
- return value
- Type
void- Requirement
- n/a
usePopoverContext
functionexport declare function usePopoverContext(partName: string): PopoverContextValue;partNamestringreturnPopoverContextValue- Name
partName- Kind
- parameter
- Type
string- Requirement
- required
- Name
return- Kind
- return value
- Type
PopoverContextValue- Requirement
- n/a
UsePopoverOptions
interfaceexport interface UsePopoverOptions { readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void;}onOpenChange(detail: PopoverOpenChangeDetail) => void- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
UsePopoverResult
interfaceexport interface UsePopoverResult { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly version: () => number;}connectorPopoverApiscopePartScopeservicePopoverServiceversion() => number- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
version- Kind
- property
- Type
() => number- Requirement
- required
@grassroot/ui-headless-solid/popover
Solid adapter
PopoverContent
functionexport declare function PopoverContent(props: PopoverContentProps): JSX.Element;propsPopoverContentPropsreturnJSX.Element- Name
props- Kind
- parameter
- Type
PopoverContentProps- Requirement
- required
- Name
return- Kind
- return value
- Type
JSX.Element- Requirement
- n/a
PopoverContentProps
interfaceexport interface PopoverContentProps extends JSX.HTMLAttributes<HTMLDivElement> { readonly as?: AsProp;}asAsProp- Name
as- Kind
- property
- Type
AsProp- Requirement
- optional
PopoverContext
valueexport declare const PopoverContext: import("solid-js").Context<PopoverContextValue | undefined>;PopoverContextValue
interfaceexport interface PopoverContextValue { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly snapshot: Accessor<PopoverSnapshot>;}connectorPopoverApiscopePartScopeservicePopoverServicesnapshotAccessor<PopoverSnapshot>- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
snapshot- Kind
- property
- Type
Accessor<PopoverSnapshot>- Requirement
- required
PopoverOpenChangeDetail
interfaceexport interface PopoverOpenChangeDetail { readonly open: boolean; readonly reason: import("@grassroot/ui-machines/popover").PopoverChangeReason;}openbooleanreasonimport("@grassroot/ui-machines/popover").PopoverChangeReason- Name
open- Kind
- property
- Type
boolean- Requirement
- required
- Name
reason- Kind
- property
- Type
import("@grassroot/ui-machines/popover").PopoverChangeReason- Requirement
- required
PopoverRoot
functionexport declare function PopoverRoot(props: PopoverRootProps): JSX.Element;propsPopoverRootPropsreturnJSX.Element- Name
props- Kind
- parameter
- Type
PopoverRootProps- Requirement
- required
- Name
return- Kind
- return value
- Type
JSX.Element- Requirement
- n/a
PopoverRootProps
interfaceexport interface PopoverRootProps { readonly open?: PopoverInput["open"]; readonly defaultOpen?: PopoverInput["defaultOpen"]; readonly side?: PopoverInput["side"]; readonly align?: PopoverInput["align"]; readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void; readonly children?: JSX.Element;}alignPopoverInput["align"]childrenJSX.ElementdefaultOpenPopoverInput["defaultOpen"]onOpenChange(detail: PopoverOpenChangeDetail) => voidopenPopoverInput["open"]sidePopoverInput["side"]- Name
align- Kind
- property
- Type
PopoverInput["align"]- Requirement
- optional
- Name
children- Kind
- property
- Type
JSX.Element- Requirement
- optional
- Name
defaultOpen- Kind
- property
- Type
PopoverInput["defaultOpen"]- Requirement
- optional
- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
- Name
open- Kind
- property
- Type
PopoverInput["open"]- Requirement
- optional
- Name
side- Kind
- property
- Type
PopoverInput["side"]- Requirement
- optional
PopoverTrigger
functionexport declare function PopoverTrigger(props: PopoverTriggerProps): JSX.Element;propsPopoverTriggerPropsreturnJSX.Element- Name
props- Kind
- parameter
- Type
PopoverTriggerProps- Requirement
- required
- Name
return- Kind
- return value
- Type
JSX.Element- Requirement
- n/a
PopoverTriggerProps
interfaceexport interface PopoverTriggerProps extends Omit<JSX.ButtonHTMLAttributes<HTMLButtonElement>, "type"> { readonly as?: AsProp;}asAsProp- Name
as- Kind
- property
- Type
AsProp- Requirement
- optional
usePopover
functionexport declare function usePopover(input: Accessor<PopoverInput>, options?: UsePopoverOptions): UsePopoverResult;inputAccessor<PopoverInput>optionsUsePopoverOptionsreturnUsePopoverResult- Name
input- Kind
- parameter
- Type
Accessor<PopoverInput>- Requirement
- required
- Name
options- Kind
- parameter
- Type
UsePopoverOptions- Requirement
- optional
- Name
return- Kind
- return value
- Type
UsePopoverResult- Requirement
- n/a
usePopoverContext
functionexport declare function usePopoverContext(partName: string): PopoverContextValue;partNamestringreturnPopoverContextValue- Name
partName- Kind
- parameter
- Type
string- Requirement
- required
- Name
return- Kind
- return value
- Type
PopoverContextValue- Requirement
- n/a
UsePopoverOptions
interfaceexport interface UsePopoverOptions { readonly onOpenChange?: (detail: PopoverOpenChangeDetail) => void;}onOpenChange(detail: PopoverOpenChangeDetail) => void- Name
onOpenChange- Kind
- property
- Type
(detail: PopoverOpenChangeDetail) => void- Requirement
- optional
UsePopoverResult
interfaceexport interface UsePopoverResult { readonly service: PopoverService; readonly connector: PopoverApi; readonly scope: PartScope; readonly snapshot: Accessor<PopoverSnapshot>;}connectorPopoverApiscopePartScopeservicePopoverServicesnapshotAccessor<PopoverSnapshot>- Name
connector- Kind
- property
- Type
PopoverApi- Requirement
- required
- Name
scope- Kind
- property
- Type
PartScope- Requirement
- required
- Name
service- Kind
- property
- Type
PopoverService- Requirement
- required
- Name
snapshot- Kind
- property
- Type
Accessor<PopoverSnapshot>- Requirement
- required