@kitn.ai/ui/dist/ui/popover.d.ts

Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.

import { JSX, Accessor } from 'solid-js';
import { Placement } from '@floating-ui/dom';
/** Imperative open controller, handed to a parent (e.g. the kai-popover facade)
 *  via `controllerRef` so it can drive/observe open state. */
export interface PopoverController {
    open: Accessor<boolean>;
    setOpen: (v: boolean) => void;
}
export interface PopoverProps {
    /** The trigger content (e.g. a button). Clicking it toggles the popover. */
    trigger: JSX.Element;
    /** The popover panel content — arbitrary nodes (rows, toggles, nested groups). */
    children: JSX.Element;
    /** Floating placement relative to the trigger. */
    placement?: Placement;
    /** Gap in px between trigger and panel. */
    gutter?: number;
    /** Controlled open state. When set, the component never changes it itself —
     *  drive it from `onOpenChange`. Omit for uncontrolled (internal) state. */
    open?: boolean;
    /** Initial open state when uncontrolled. */
    defaultOpen?: boolean;
    /** When true, clicking the trigger never opens the popover. */
    disabled?: boolean;
    /** Fires whenever the popover wants to open or close. */
    onOpenChange?: (open: boolean) => void;
    /** Receive the open controller (open accessor + setOpen) once mounted. */
    controllerRef?: (api: PopoverController) => void;
    /** Extra elements counted as "inside" for outside-click dismissal — e.g. the
     *  custom-element host, so clicks on slotted panel content don't dismiss. */
    boundary?: () => HTMLElement | undefined;
    /** Class applied to the floating panel. */
    class?: string;
}
/**
 * A general popover: a trigger that toggles a floating panel of arbitrary
 * content. Unlike `Dropdown` (role="menu" + roving focus), the panel is a
 * `role="dialog"` region, so it can hold model rows, toggles, nested groups —
 * anything. Positioning, exit animation, and Escape/outside-click dismissal
 * come from the shared overlay primitives.
 */
export declare function Popover(props: PopoverProps): JSX.Element;