@als-tp/als-react-ts-ui/dist/components/ALSMenu/ALSMenu.d.ts

A comprehensive React TypeScript UI component library built with Base UI by ALSInnovation

import * as React from "react";
/** Size variants for menu items */
export type ALSMenuSize = "sm" | "md" | "lg";
/** Visual variants for destructive actions */
export type ALSMenuItemVariant = "default" | "danger";
/** Props for ALSMenu.Root */
export interface ALSMenuRootProps {
    /** The content of the menu */
    children: React.ReactNode;
    /** Whether the menu is open (controlled) */
    open?: boolean;
    /** Callback fired when the menu open state changes */
    onOpenChange?: (open: boolean) => void;
    /** Whether the menu is initially open (uncontrolled) */
    defaultOpen?: boolean;
    /** Whether the menu should close when clicking outside */
    modal?: boolean;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.Trigger */
export interface ALSMenuTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
    /** The content of the trigger */
    children: React.ReactNode;
    /** Whether the menu should open on hover */
    openOnHover?: boolean;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.Content */
export interface ALSMenuContentProps {
    /** The content of the menu popup */
    children: React.ReactNode;
    /** Side offset from the trigger */
    sideOffset?: number;
    /** Alignment offset */
    alignOffset?: number;
    /** Preferred side for the popup */
    side?: "top" | "bottom" | "left" | "right";
    /** Preferred alignment */
    align?: "start" | "center" | "end";
    /** Whether to show an arrow */
    showArrow?: boolean;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.Item */
export interface ALSMenuItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onClick"> {
    /** The content of the menu item */
    children: React.ReactNode;
    /** Whether the item is disabled */
    disabled?: boolean;
    /** Visual variant */
    variant?: ALSMenuItemVariant;
    /** Click handler */
    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
    /** Icon to display before the label */
    icon?: React.ReactNode;
    /** Shortcut text to display on the right */
    shortcut?: string;
    /** Size of the menu item */
    size?: ALSMenuSize;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.Separator */
export interface ALSMenuSeparatorProps {
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.Group */
export interface ALSMenuGroupProps {
    /** The content of the group */
    children: React.ReactNode;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.GroupLabel */
export interface ALSMenuGroupLabelProps {
    /** The label text */
    children: React.ReactNode;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.CheckboxItem */
export interface ALSMenuCheckboxItemProps {
    /** The label of the checkbox item */
    children: React.ReactNode;
    /** Whether the item is checked */
    checked?: boolean;
    /** Callback fired when the checked state changes */
    onCheckedChange?: (checked: boolean) => void;
    /** Whether the item is disabled */
    disabled?: boolean;
    /** Size of the menu item */
    size?: ALSMenuSize;
    /** Whether to close the menu when clicking */
    closeOnClick?: boolean;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.RadioGroup */
export interface ALSMenuRadioGroupProps {
    /** The content of the radio group */
    children: React.ReactNode;
    /** The current value */
    value?: string;
    /** Callback fired when the value changes */
    onValueChange?: (value: string) => void;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.RadioItem */
export interface ALSMenuRadioItemProps {
    /** The label of the radio item */
    children: React.ReactNode;
    /** The value of this radio item */
    value: string;
    /** Whether the item is disabled */
    disabled?: boolean;
    /** Size of the menu item */
    size?: ALSMenuSize;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.SubmenuRoot */
export interface ALSMenuSubmenuRootProps {
    /** The content of the submenu */
    children: React.ReactNode;
}
/** Props for ALSMenu.SubmenuTrigger */
export interface ALSMenuSubmenuTriggerProps {
    /** The label of the submenu trigger */
    children: React.ReactNode;
    /** Whether the item is disabled */
    disabled?: boolean;
    /** Size of the menu item */
    size?: ALSMenuSize;
    /** Additional class name */
    className?: string;
}
/** Props for ALSMenu.SubmenuContent */
export interface ALSMenuSubmenuContentProps {
    /** The content of the submenu popup */
    children: React.ReactNode;
    /** Side offset from the trigger */
    sideOffset?: number;
    /** Alignment offset */
    alignOffset?: number;
    /** Additional class name */
    className?: string;
}
/**
 * ALSMenu.Root - The root container for the menu
 */
export declare const ALSMenuRoot: React.FC<ALSMenuRootProps>;
/**
 * ALSMenu.Trigger - The button that triggers the menu
 */
export declare const ALSMenuTrigger: React.ForwardRefExoticComponent<ALSMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * ALSMenu.Content - The popup container for menu items
 */
export declare const ALSMenuContent: React.FC<ALSMenuContentProps>;
/**
 * ALSMenu.Item - An individual menu item
 */
export declare const ALSMenuItem: React.ForwardRefExoticComponent<ALSMenuItemProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSMenu.Separator - A visual separator between menu items
 */
export declare const ALSMenuSeparator: React.FC<ALSMenuSeparatorProps>;
/**
 * ALSMenu.Group - A group of related menu items
 */
export declare const ALSMenuGroup: React.FC<ALSMenuGroupProps>;
/**
 * ALSMenu.GroupLabel - A label for a group of menu items
 */
export declare const ALSMenuGroupLabel: React.FC<ALSMenuGroupLabelProps>;
/**
 * ALSMenu.CheckboxItem - A checkbox menu item
 */
export declare const ALSMenuCheckboxItem: React.FC<ALSMenuCheckboxItemProps>;
/**
 * ALSMenu.RadioGroup - A group of radio menu items
 */
export declare const ALSMenuRadioGroup: React.FC<ALSMenuRadioGroupProps>;
/**
 * ALSMenu.RadioItem - A radio menu item
 */
export declare const ALSMenuRadioItem: React.FC<ALSMenuRadioItemProps>;
/**
 * ALSMenu.SubmenuRoot - The root container for a submenu
 */
export declare const ALSMenuSubmenuRoot: React.FC<ALSMenuSubmenuRootProps>;
/**
 * ALSMenu.SubmenuTrigger - The trigger for a submenu
 */
export declare const ALSMenuSubmenuTrigger: React.FC<ALSMenuSubmenuTriggerProps>;
/**
 * ALSMenu.SubmenuContent - The popup container for submenu items
 */
export declare const ALSMenuSubmenuContent: React.FC<ALSMenuSubmenuContentProps>;
//# sourceMappingURL=ALSMenu.d.ts.map