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

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

import * as React from "react";
import { NavigationMenu } from "@base-ui-components/react/navigation-menu";
/**
 * Orientation options for the navigation menu
 */
export type ALSNavigationMenuOrientation = "horizontal" | "vertical";
/**
 * Size variants for the navigation menu
 */
export type ALSNavigationMenuSize = "sm" | "md" | "lg";
/**
 * Variant options for the navigation menu styling
 */
export type ALSNavigationMenuVariant = "default" | "filled" | "minimal";
/**
 * Props for ALSNavigationMenu.Root component
 */
export interface ALSNavigationMenuRootProps extends Omit<NavigationMenu.Root.Props, "className" | "style"> {
    /** The orientation of the navigation menu */
    orientation?: ALSNavigationMenuOrientation;
    /** Size variant of the navigation menu */
    size?: ALSNavigationMenuSize;
    /** Visual variant of the navigation menu */
    variant?: ALSNavigationMenuVariant;
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.List component
 */
export interface ALSNavigationMenuListProps extends Omit<NavigationMenu.List.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Item component
 */
export interface ALSNavigationMenuItemProps extends Omit<NavigationMenu.Item.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Trigger component
 */
export interface ALSNavigationMenuTriggerProps extends Omit<NavigationMenu.Trigger.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Icon component
 */
export interface ALSNavigationMenuIconProps extends Omit<NavigationMenu.Icon.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Content component
 */
export interface ALSNavigationMenuContentProps extends Omit<NavigationMenu.Content.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Link component
 */
export interface ALSNavigationMenuLinkProps extends Omit<NavigationMenu.Link.Props, "className" | "style"> {
    /** Whether this link is currently active */
    active?: boolean;
    /** Whether to close the menu when clicking the link */
    closeOnClick?: boolean;
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Portal component
 */
export interface ALSNavigationMenuPortalProps extends Omit<NavigationMenu.Portal.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Positioner component
 */
export interface ALSNavigationMenuPositionerProps extends Omit<NavigationMenu.Positioner.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Popup component
 */
export interface ALSNavigationMenuPopupProps extends Omit<NavigationMenu.Popup.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Viewport component
 */
export interface ALSNavigationMenuViewportProps extends Omit<NavigationMenu.Viewport.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
}
/**
 * Props for ALSNavigationMenu.Arrow component
 */
export interface ALSNavigationMenuArrowProps extends Omit<NavigationMenu.Arrow.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
    /** Child elements */
    children?: React.ReactNode;
}
/**
 * Props for ALSNavigationMenu.Backdrop component
 */
export interface ALSNavigationMenuBackdropProps extends Omit<NavigationMenu.Backdrop.Props, "className" | "style"> {
    /** Additional CSS class names */
    className?: string;
    /** Additional inline styles */
    style?: React.CSSProperties;
}
/**
 * ALSNavigationMenu.Root - Groups all parts of the navigation menu
 * Renders a <nav> element at the root, or <div> element when nested.
 */
export declare const ALSNavigationMenuRoot: React.ForwardRefExoticComponent<ALSNavigationMenuRootProps & React.RefAttributes<HTMLElement>>;
/**
 * ALSNavigationMenu.List - Contains a list of navigation menu items
 * Renders a <ul> element.
 */
export declare const ALSNavigationMenuList: React.ForwardRefExoticComponent<ALSNavigationMenuListProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Item - An individual navigation menu item
 * Renders a <li> element.
 */
export declare const ALSNavigationMenuItem: React.ForwardRefExoticComponent<ALSNavigationMenuItemProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Trigger - Opens the navigation menu popup when hovered or clicked
 * Renders a <button> element.
 */
export declare const ALSNavigationMenuTrigger: React.ForwardRefExoticComponent<ALSNavigationMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * ALSNavigationMenu.Icon - An icon that indicates that the trigger opens a menu
 * Typically used to show a chevron icon.
 */
export declare const ALSNavigationMenuIcon: React.ForwardRefExoticComponent<ALSNavigationMenuIconProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Content - A container for the content of the navigation menu item
 * Renders a <div> element.
 */
export declare const ALSNavigationMenuContent: React.ForwardRefExoticComponent<ALSNavigationMenuContentProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Link - A link in the navigation menu
 * Renders an <a> element.
 */
export declare const ALSNavigationMenuLink: React.ForwardRefExoticComponent<ALSNavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>>;
/**
 * ALSNavigationMenu.Portal - A portal element that moves the popup to a different part of the DOM
 * By default, the portal element is appended to <body>.
 */
export declare const ALSNavigationMenuPortal: React.FC<ALSNavigationMenuPortalProps>;
/**
 * ALSNavigationMenu.Positioner - Positions the navigation menu against the currently active trigger
 * Renders a <div> element.
 */
export declare const ALSNavigationMenuPositioner: React.ForwardRefExoticComponent<ALSNavigationMenuPositionerProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Popup - A container for the navigation menu contents
 * Renders a <nav> element.
 */
export declare const ALSNavigationMenuPopup: React.ForwardRefExoticComponent<ALSNavigationMenuPopupProps & React.RefAttributes<HTMLElement>>;
/**
 * ALSNavigationMenu.Viewport - The clipping viewport of the navigation menu's current content
 * Renders a <div> element.
 */
export declare const ALSNavigationMenuViewport: React.ForwardRefExoticComponent<ALSNavigationMenuViewportProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Arrow - Displays an element pointing toward the navigation menu's current anchor
 * Renders a <div> element.
 */
export declare const ALSNavigationMenuArrow: React.ForwardRefExoticComponent<ALSNavigationMenuArrowProps & React.RefAttributes<HTMLDivElement>>;
/**
 * ALSNavigationMenu.Backdrop - A backdrop for the navigation menu popup
 * Renders a <div> element.
 */
export declare const ALSNavigationMenuBackdrop: React.ForwardRefExoticComponent<ALSNavigationMenuBackdropProps & React.RefAttributes<HTMLDivElement>>;
/**
 * Props for LinkCard helper component
 */
export interface ALSNavigationMenuLinkCardProps extends ALSNavigationMenuLinkProps {
    /** Title of the link card */
    title: string;
    /** Description text for the link card */
    description?: string;
}
/**
 * ALSNavigationMenu.LinkCard - A styled link card for use within navigation menu content
 * Provides a consistent card-style link with title and description.
 */
export declare const ALSNavigationMenuLinkCard: React.ForwardRefExoticComponent<ALSNavigationMenuLinkCardProps & React.RefAttributes<HTMLAnchorElement>>;
//# sourceMappingURL=ALSNavigationMenu.d.ts.map