@refraction-ui/react 0.4.2 → 0.5.0

package/dist/internal/keyboard-shortcut/index.d.cts

@@ -0,0 +1,49 @@
+interface ShortcutProps {
+    /** Key combination (e.g., ['Ctrl', 'K'] or ['Meta', 'Shift', 'P']) */
+    keys: string[];
+    /** Callback when the shortcut is triggered */
+    onTrigger: () => void;
+    /** Whether the shortcut is enabled */
+    enabled?: boolean;
+    /** Prevent default browser behavior */
+    preventDefault?: boolean;
+}
+interface KeyboardShortcutAPI {
+    /** Handle a keyboard event (returns true if it matched) */
+    handler(event: KeyboardEvent): boolean;
+    /** Human-readable display of the shortcut */
+    display: string;
+    /** Platform-aware display (uses command symbol on Mac) */
+    platformDisplay: string;
+    /** Whether the shortcut is currently enabled */
+    enabled: boolean;
+    /** The key combination */
+    keys: string[];
+    /** ARIA props for a visual shortcut badge */
+    badgeAriaProps: Record<string, unknown>;
+}
+declare function formatShortcut(keys: string[], mac?: boolean): string;
+declare function createKeyboardShortcut(props: ShortcutProps): KeyboardShortcutAPI;
+declare const SANE_DEFAULTS: Record<string, string[]>;
+declare class ShortcutRegistry {
+    private shortcuts;
+    register(keys: string[], handler: () => void): void;
+    unregister(keys: string[]): void;
+}
+declare const globalShortcutRegistry: ShortcutRegistry;
+declare class AltHintState {
+    private showHints;
+    private listeners;
+    private initialized;
+    init(): void;
+    private setShowHints;
+    subscribe(listener: (show: boolean) => void): () => void;
+    get snapshot(): boolean;
+}
+declare const altHintState: AltHintState;
+
+declare const shortcutBadgeStyles = "inline-flex items-center gap-0.5 rounded border bg-muted px-1.5 py-0.5 text-xs font-mono text-muted-foreground";
+declare const shortcutKeyStyles = "inline-flex items-center justify-center min-w-[1.25rem] rounded bg-background px-1 py-0.5 text-xs font-mono border shadow-sm";
+declare const shortcutSeparatorStyles = "text-muted-foreground text-xs";
+
+export { AltHintState, type KeyboardShortcutAPI, SANE_DEFAULTS, type ShortcutProps, ShortcutRegistry, altHintState, createKeyboardShortcut, formatShortcut, globalShortcutRegistry, shortcutBadgeStyles, shortcutKeyStyles, shortcutSeparatorStyles };

package/dist/internal/keyboard-shortcut/index.d.ts

@@ -0,0 +1,49 @@
+interface ShortcutProps {
+    /** Key combination (e.g., ['Ctrl', 'K'] or ['Meta', 'Shift', 'P']) */
+    keys: string[];
+    /** Callback when the shortcut is triggered */
+    onTrigger: () => void;
+    /** Whether the shortcut is enabled */
+    enabled?: boolean;
+    /** Prevent default browser behavior */
+    preventDefault?: boolean;
+}
+interface KeyboardShortcutAPI {
+    /** Handle a keyboard event (returns true if it matched) */
+    handler(event: KeyboardEvent): boolean;
+    /** Human-readable display of the shortcut */
+    display: string;
+    /** Platform-aware display (uses command symbol on Mac) */
+    platformDisplay: string;
+    /** Whether the shortcut is currently enabled */
+    enabled: boolean;
+    /** The key combination */
+    keys: string[];
+    /** ARIA props for a visual shortcut badge */
+    badgeAriaProps: Record<string, unknown>;
+}
+declare function formatShortcut(keys: string[], mac?: boolean): string;
+declare function createKeyboardShortcut(props: ShortcutProps): KeyboardShortcutAPI;
+declare const SANE_DEFAULTS: Record<string, string[]>;
+declare class ShortcutRegistry {
+    private shortcuts;
+    register(keys: string[], handler: () => void): void;
+    unregister(keys: string[]): void;
+}
+declare const globalShortcutRegistry: ShortcutRegistry;
+declare class AltHintState {
+    private showHints;
+    private listeners;
+    private initialized;
+    init(): void;
+    private setShowHints;
+    subscribe(listener: (show: boolean) => void): () => void;
+    get snapshot(): boolean;
+}
+declare const altHintState: AltHintState;
+
+declare const shortcutBadgeStyles = "inline-flex items-center gap-0.5 rounded border bg-muted px-1.5 py-0.5 text-xs font-mono text-muted-foreground";
+declare const shortcutKeyStyles = "inline-flex items-center justify-center min-w-[1.25rem] rounded bg-background px-1 py-0.5 text-xs font-mono border shadow-sm";
+declare const shortcutSeparatorStyles = "text-muted-foreground text-xs";
+
+export { AltHintState, type KeyboardShortcutAPI, SANE_DEFAULTS, type ShortcutProps, ShortcutRegistry, altHintState, createKeyboardShortcut, formatShortcut, globalShortcutRegistry, shortcutBadgeStyles, shortcutKeyStyles, shortcutSeparatorStyles };

package/dist/internal/language-selector/index.d.cts

@@ -0,0 +1,63 @@
+import { KeyboardHandlerMap } from '../shared/index.cjs';
+
+interface LanguageOption {
+    value: string;
+    label: string;
+    group?: string;
+}
+interface LanguageSelectorProps {
+    value?: string | string[];
+    onValueChange?: (value: string | string[]) => void;
+    options: LanguageOption[];
+    multiple?: boolean;
+}
+interface LanguageSelectorAPI {
+    /** Current state */
+    state: {
+        selectedValues: string[];
+        isOpen: boolean;
+    };
+    /** Props to spread on the trigger element */
+    triggerProps: {
+        'aria-expanded': boolean;
+        'aria-controls': string;
+        'aria-haspopup': 'listbox';
+        role: 'combobox';
+    };
+    /** Props to spread on the content/dropdown element */
+    contentProps: {
+        role: 'listbox';
+        id: string;
+        'aria-multiselectable'?: boolean;
+    };
+    /** Get props for an individual option */
+    getOptionProps: (value: string) => {
+        role: 'option';
+        'aria-selected': boolean;
+        'data-value': string;
+    };
+    /** Toggle an option's selection */
+    toggle: (value: string) => void;
+    /** Open the dropdown */
+    open: () => void;
+    /** Close the dropdown */
+    close: () => void;
+    /** Keyboard handler map */
+    keyboardHandlers: KeyboardHandlerMap;
+    /** Pre-built keyboard event handler */
+    handleKeyDown: (event: KeyboardEvent) => void;
+}
+declare function createLanguageSelector(props: LanguageSelectorProps): LanguageSelectorAPI;
+
+declare const selectorVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const optionVariants: (props?: ({
+    selected?: "true" | "false" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type LanguageOption, type LanguageSelectorAPI, type LanguageSelectorProps, createLanguageSelector, optionVariants, selectorVariants };

package/dist/internal/language-selector/index.d.ts

@@ -0,0 +1,63 @@
+import { KeyboardHandlerMap } from '../shared/index.js';
+
+interface LanguageOption {
+    value: string;
+    label: string;
+    group?: string;
+}
+interface LanguageSelectorProps {
+    value?: string | string[];
+    onValueChange?: (value: string | string[]) => void;
+    options: LanguageOption[];
+    multiple?: boolean;
+}
+interface LanguageSelectorAPI {
+    /** Current state */
+    state: {
+        selectedValues: string[];
+        isOpen: boolean;
+    };
+    /** Props to spread on the trigger element */
+    triggerProps: {
+        'aria-expanded': boolean;
+        'aria-controls': string;
+        'aria-haspopup': 'listbox';
+        role: 'combobox';
+    };
+    /** Props to spread on the content/dropdown element */
+    contentProps: {
+        role: 'listbox';
+        id: string;
+        'aria-multiselectable'?: boolean;
+    };
+    /** Get props for an individual option */
+    getOptionProps: (value: string) => {
+        role: 'option';
+        'aria-selected': boolean;
+        'data-value': string;
+    };
+    /** Toggle an option's selection */
+    toggle: (value: string) => void;
+    /** Open the dropdown */
+    open: () => void;
+    /** Close the dropdown */
+    close: () => void;
+    /** Keyboard handler map */
+    keyboardHandlers: KeyboardHandlerMap;
+    /** Pre-built keyboard event handler */
+    handleKeyDown: (event: KeyboardEvent) => void;
+}
+declare function createLanguageSelector(props: LanguageSelectorProps): LanguageSelectorAPI;
+
+declare const selectorVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const optionVariants: (props?: ({
+    selected?: "true" | "false" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type LanguageOption, type LanguageSelectorAPI, type LanguageSelectorProps, createLanguageSelector, optionVariants, selectorVariants };

package/dist/internal/markdown-renderer/index.d.cts

@@ -0,0 +1,40 @@
+import { AccessibilityProps, TokenContract } from '../shared/index.cjs';
+
+interface ComponentDef {
+    type: string;
+    pattern: RegExp;
+    props: Record<string, string>;
+}
+interface MarkdownRendererProps {
+    content: string;
+    components?: Record<string, ComponentDef>;
+    linkResolver?: (url: string) => string;
+}
+interface MarkdownRendererAPI {
+    /** Rendered HTML string */
+    html: string;
+    /** Extracted component slots from custom component definitions */
+    components: Array<{
+        name: string;
+        props: Record<string, string>;
+    }>;
+    /** ARIA attributes for the rendered content container */
+    ariaProps: Partial<AccessibilityProps>;
+}
+/**
+ * Create a headless markdown renderer.
+ *
+ * Uses the headless pattern — returns an API object with rendered HTML,
+ * extracted component slots, and ARIA props for the container.
+ */
+declare function createMarkdownRenderer(props: MarkdownRendererProps): MarkdownRendererAPI;
+
+declare const markdownRendererTokens: TokenContract;
+declare const proseVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | undefined;
+    theme?: "light" | "dark" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type ComponentDef, type MarkdownRendererAPI, type MarkdownRendererProps, createMarkdownRenderer, markdownRendererTokens, proseVariants };

package/dist/internal/markdown-renderer/index.d.ts

@@ -0,0 +1,40 @@
+import { AccessibilityProps, TokenContract } from '../shared/index.js';
+
+interface ComponentDef {
+    type: string;
+    pattern: RegExp;
+    props: Record<string, string>;
+}
+interface MarkdownRendererProps {
+    content: string;
+    components?: Record<string, ComponentDef>;
+    linkResolver?: (url: string) => string;
+}
+interface MarkdownRendererAPI {
+    /** Rendered HTML string */
+    html: string;
+    /** Extracted component slots from custom component definitions */
+    components: Array<{
+        name: string;
+        props: Record<string, string>;
+    }>;
+    /** ARIA attributes for the rendered content container */
+    ariaProps: Partial<AccessibilityProps>;
+}
+/**
+ * Create a headless markdown renderer.
+ *
+ * Uses the headless pattern — returns an API object with rendered HTML,
+ * extracted component slots, and ARIA props for the container.
+ */
+declare function createMarkdownRenderer(props: MarkdownRendererProps): MarkdownRendererAPI;
+
+declare const markdownRendererTokens: TokenContract;
+declare const proseVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | undefined;
+    theme?: "light" | "dark" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type ComponentDef, type MarkdownRendererAPI, type MarkdownRendererProps, createMarkdownRenderer, markdownRendererTokens, proseVariants };

package/dist/internal/mobile-nav/index.d.cts

@@ -0,0 +1,45 @@
+import { AccessibilityProps, KeyboardHandlerMap, TokenContract } from '../shared/index.cjs';
+
+interface MobileNavProps {
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    id?: string;
+}
+interface MobileNavState {
+    open: boolean;
+}
+interface MobileNavAPI {
+    /** Current state */
+    state: MobileNavState;
+    /** ARIA and interaction props for the trigger button */
+    triggerProps: Partial<AccessibilityProps> & Record<string, string | boolean | undefined>;
+    /** ARIA and data attributes for the content panel */
+    contentProps: Partial<AccessibilityProps> & Record<string, string | boolean | undefined>;
+    /** Toggle open state */
+    toggle: () => void;
+    /** Open the nav */
+    open: () => void;
+    /** Close the nav */
+    close: () => void;
+    /** Keyboard handlers (Escape closes) */
+    keyboardHandlers: KeyboardHandlerMap;
+}
+declare function createMobileNav(props?: MobileNavProps): MobileNavAPI;
+
+declare const mobileNavTokens: TokenContract;
+declare const mobileNavVariants: (props?: ({} & {
+    className?: string;
+}) | undefined) => string;
+declare const mobileNavContentVariants: (props?: ({
+    state?: "open" | "closed" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const mobileNavTriggerVariants: (props?: ({} & {
+    className?: string;
+}) | undefined) => string;
+declare const mobileNavLinkVariants: (props?: ({} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type MobileNavAPI, type MobileNavProps, type MobileNavState, createMobileNav, mobileNavContentVariants, mobileNavLinkVariants, mobileNavTokens, mobileNavTriggerVariants, mobileNavVariants };

package/dist/internal/mobile-nav/index.d.ts

@@ -0,0 +1,45 @@
+import { AccessibilityProps, KeyboardHandlerMap, TokenContract } from '../shared/index.js';
+
+interface MobileNavProps {
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    id?: string;
+}
+interface MobileNavState {
+    open: boolean;
+}
+interface MobileNavAPI {
+    /** Current state */
+    state: MobileNavState;
+    /** ARIA and interaction props for the trigger button */
+    triggerProps: Partial<AccessibilityProps> & Record<string, string | boolean | undefined>;
+    /** ARIA and data attributes for the content panel */
+    contentProps: Partial<AccessibilityProps> & Record<string, string | boolean | undefined>;
+    /** Toggle open state */
+    toggle: () => void;
+    /** Open the nav */
+    open: () => void;
+    /** Close the nav */
+    close: () => void;
+    /** Keyboard handlers (Escape closes) */
+    keyboardHandlers: KeyboardHandlerMap;
+}
+declare function createMobileNav(props?: MobileNavProps): MobileNavAPI;
+
+declare const mobileNavTokens: TokenContract;
+declare const mobileNavVariants: (props?: ({} & {
+    className?: string;
+}) | undefined) => string;
+declare const mobileNavContentVariants: (props?: ({
+    state?: "open" | "closed" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const mobileNavTriggerVariants: (props?: ({} & {
+    className?: string;
+}) | undefined) => string;
+declare const mobileNavLinkVariants: (props?: ({} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type MobileNavAPI, type MobileNavProps, type MobileNavState, createMobileNav, mobileNavContentVariants, mobileNavLinkVariants, mobileNavTokens, mobileNavTriggerVariants, mobileNavVariants };

package/dist/internal/navbar/index.d.cts

@@ -0,0 +1,30 @@
+interface NavLink {
+    label: string;
+    href: string;
+    icon?: string;
+}
+type NavbarVariant = 'solid' | 'blur' | 'gradient' | 'transparent';
+interface NavbarProps {
+    links?: NavLink[];
+    currentPath?: string;
+    variant?: NavbarVariant;
+}
+interface NavbarAPI {
+    ariaProps: Record<string, string>;
+    isActive: (href: string) => boolean;
+    linkAriaProps: (href: string) => Record<string, string>;
+}
+declare function createNavbar(props?: NavbarProps): NavbarAPI;
+
+declare const navbarVariants: (props?: ({
+    variant?: "solid" | "blur" | "gradient" | "transparent" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const navLinkVariants: (props?: ({
+    active?: "true" | "false" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type NavLink, type NavbarAPI, type NavbarProps, type NavbarVariant, createNavbar, navLinkVariants, navbarVariants };

package/dist/internal/navbar/index.d.ts

@@ -0,0 +1,30 @@
+interface NavLink {
+    label: string;
+    href: string;
+    icon?: string;
+}
+type NavbarVariant = 'solid' | 'blur' | 'gradient' | 'transparent';
+interface NavbarProps {
+    links?: NavLink[];
+    currentPath?: string;
+    variant?: NavbarVariant;
+}
+interface NavbarAPI {
+    ariaProps: Record<string, string>;
+    isActive: (href: string) => boolean;
+    linkAriaProps: (href: string) => Record<string, string>;
+}
+declare function createNavbar(props?: NavbarProps): NavbarAPI;
+
+declare const navbarVariants: (props?: ({
+    variant?: "solid" | "blur" | "gradient" | "transparent" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const navLinkVariants: (props?: ({
+    active?: "true" | "false" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type NavLink, type NavbarAPI, type NavbarProps, type NavbarVariant, createNavbar, navLinkVariants, navbarVariants };

package/dist/internal/otp-input/index.d.cts

@@ -0,0 +1,66 @@
+import { AccessibilityProps, KeyboardHandlerMap, TokenContract } from '../shared/index.cjs';
+
+type OtpInputType = 'number' | 'text';
+interface OtpInputProps {
+    length?: number;
+    value?: string;
+    autoFocus?: boolean;
+    type?: OtpInputType;
+    disabled?: boolean;
+}
+interface OtpSlotProps {
+    ariaProps: Partial<AccessibilityProps>;
+    dataAttributes: Record<string, string>;
+    inputProps: {
+        maxLength: number;
+        inputMode: string;
+        pattern?: string;
+        autoComplete: string;
+        disabled: boolean;
+    };
+}
+interface OtpInputAPI {
+    /** Current state */
+    state: {
+        values: string[];
+        focusedIndex: number;
+        length: number;
+        disabled: boolean;
+    };
+    /** Set the value at a specific index */
+    setValue: (index: number, char: string) => string[];
+    /** Get the combined OTP string */
+    getValue: () => string;
+    /** Move focus in a direction, returns new index */
+    moveFocus: (direction: 'left' | 'right') => number;
+    /** Get aria/input props for a specific slot */
+    getSlotProps: (index: number) => OtpSlotProps;
+    /** Keyboard handlers factory for a specific slot */
+    getKeyboardHandlers: (index: number, callbacks?: {
+        onMoveFocus?: (index: number) => void;
+        onSetValue?: (index: number, values: string[]) => void;
+    }) => KeyboardHandlerMap;
+    /** Parse a paste string into values array */
+    parsePaste: (text: string) => string[];
+    /** Root container ARIA props */
+    rootAriaProps: Partial<AccessibilityProps>;
+    /** Whether interaction should be blocked */
+    isInteractive: boolean;
+}
+declare function createOtpInput(props?: OtpInputProps): OtpInputAPI;
+
+declare const otpInputTokens: TokenContract;
+declare const otpInputContainerVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const otpInputSlotVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | undefined;
+    focused?: "true" | "false" | undefined;
+    filled?: "true" | "false" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type OtpInputAPI, type OtpInputProps, type OtpInputType, type OtpSlotProps, createOtpInput, otpInputContainerVariants, otpInputSlotVariants, otpInputTokens };

package/dist/internal/otp-input/index.d.ts

@@ -0,0 +1,66 @@
+import { AccessibilityProps, KeyboardHandlerMap, TokenContract } from '../shared/index.js';
+
+type OtpInputType = 'number' | 'text';
+interface OtpInputProps {
+    length?: number;
+    value?: string;
+    autoFocus?: boolean;
+    type?: OtpInputType;
+    disabled?: boolean;
+}
+interface OtpSlotProps {
+    ariaProps: Partial<AccessibilityProps>;
+    dataAttributes: Record<string, string>;
+    inputProps: {
+        maxLength: number;
+        inputMode: string;
+        pattern?: string;
+        autoComplete: string;
+        disabled: boolean;
+    };
+}
+interface OtpInputAPI {
+    /** Current state */
+    state: {
+        values: string[];
+        focusedIndex: number;
+        length: number;
+        disabled: boolean;
+    };
+    /** Set the value at a specific index */
+    setValue: (index: number, char: string) => string[];
+    /** Get the combined OTP string */
+    getValue: () => string;
+    /** Move focus in a direction, returns new index */
+    moveFocus: (direction: 'left' | 'right') => number;
+    /** Get aria/input props for a specific slot */
+    getSlotProps: (index: number) => OtpSlotProps;
+    /** Keyboard handlers factory for a specific slot */
+    getKeyboardHandlers: (index: number, callbacks?: {
+        onMoveFocus?: (index: number) => void;
+        onSetValue?: (index: number, values: string[]) => void;
+    }) => KeyboardHandlerMap;
+    /** Parse a paste string into values array */
+    parsePaste: (text: string) => string[];
+    /** Root container ARIA props */
+    rootAriaProps: Partial<AccessibilityProps>;
+    /** Whether interaction should be blocked */
+    isInteractive: boolean;
+}
+declare function createOtpInput(props?: OtpInputProps): OtpInputAPI;
+
+declare const otpInputTokens: TokenContract;
+declare const otpInputContainerVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+declare const otpInputSlotVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | undefined;
+    focused?: "true" | "false" | undefined;
+    filled?: "true" | "false" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type OtpInputAPI, type OtpInputProps, type OtpInputType, type OtpSlotProps, createOtpInput, otpInputContainerVariants, otpInputSlotVariants, otpInputTokens };

package/dist/internal/payment/index.d.cts

@@ -0,0 +1,9 @@
+interface PaymentProps {
+    disabled?: boolean;
+}
+interface PaymentAPI {
+    props: PaymentProps;
+}
+declare function createPayment(props?: PaymentProps): PaymentAPI;
+
+export { type PaymentAPI, type PaymentProps, createPayment };

package/dist/internal/payment/index.d.ts

@@ -0,0 +1,9 @@
+interface PaymentProps {
+    disabled?: boolean;
+}
+interface PaymentAPI {
+    props: PaymentProps;
+}
+declare function createPayment(props?: PaymentProps): PaymentAPI;
+
+export { type PaymentAPI, type PaymentProps, createPayment };

package/dist/internal/popover/index.d.cts

@@ -0,0 +1,46 @@
+import { AccessibilityProps, Side, KeyboardHandlerMap } from '../shared/index.cjs';
+
+interface PopoverProps {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    placement?: Side;
+}
+interface PopoverAPI {
+    /** Current open state */
+    state: {
+        open: boolean;
+    };
+    /** Props to spread on the trigger element */
+    triggerProps: Partial<AccessibilityProps> & {
+        'aria-expanded': boolean;
+        'aria-controls': string;
+        'aria-haspopup': 'dialog';
+    };
+    /** Props to spread on the content element */
+    contentProps: {
+        role: 'dialog';
+        id: string;
+    };
+    /** Resolved placement */
+    placement: Side;
+    /** Open the popover */
+    open: () => void;
+    /** Close the popover */
+    close: () => void;
+    /** Toggle the popover */
+    toggle: () => void;
+    /** Keyboard handler map (Escape to close) */
+    keyboardHandlers: KeyboardHandlerMap;
+    /** Pre-built keyboard event handler */
+    handleKeyDown: (event: KeyboardEvent) => void;
+}
+declare function createPopover(props?: PopoverProps): PopoverAPI;
+
+declare const popoverContentVariants: (props?: ({
+    side?: "top" | "right" | "bottom" | "left" | undefined;
+} & {
+    className?: string;
+}) | undefined) => string;
+
+export { type PopoverAPI, type PopoverProps, createPopover, popoverContentVariants };