@buun_group/brutalist-ui/dist/react/accordion/Accordion.d.ts

A brutalist-styled component library

/**
 * @module Accordion
 * @description A collapsible content component that allows users to toggle the visibility of sections. Supports single and multiple selection modes with smooth animations and full keyboard navigation.
 */
import { HTMLAttributes, ReactNode, CSSProperties } from 'react';
/**
 * Props for the Accordion component
 */
export interface AccordionProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Determines whether only one item can be open at a time ('single') or multiple items can be open ('multiple')
     * @default 'single'
     */
    type?: 'single' | 'multiple';
    /**
     * For single type: whether the currently open item can be collapsed by clicking it again
     * @default false
     */
    collapsible?: boolean;
    /**
     * Default open items (for uncontrolled usage). String for single type, array for multiple type
     */
    defaultValue?: string | string[];
    /**
     * Controlled value. String for single type, array for multiple type
     */
    value?: string | string[];
    /**
     * Callback function called when the open state changes
     */
    onValueChange?: (value: string | string[]) => void;
    /**
     * Size variant for the accordion
     * @default 'md'
     */
    size?: 'sm' | 'md' | 'lg';
    /**
     * Visual style variant for the accordion
     * @default 'default'
     */
    variant?: 'default' | 'brutal' | 'outline';
    /**
     * Whether the entire accordion is disabled
     * @default false
     */
    disabled?: boolean;
    /**
     * Custom CSS styles (supports utility classes)
     */
    style?: CSSProperties;
}
/**
 * Props for the AccordionItem component
 */
export interface AccordionItemProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Unique identifier for this accordion item
     */
    value: string;
    /**
     * Whether this specific item is disabled
     * @default false
     */
    disabled?: boolean;
    /**
     * Custom CSS styles (supports utility classes)
     */
    style?: CSSProperties;
}
/**
 * Props for the AccordionTrigger component
 */
export interface AccordionTriggerProps extends HTMLAttributes<HTMLButtonElement> {
    /**
     * Custom icon element to display instead of the default chevron
     */
    icon?: ReactNode;
    /**
     * Whether to hide the default chevron icon completely
     * @default false
     */
    hideIcon?: boolean;
    /**
     * Custom CSS styles (supports utility classes)
     */
    style?: CSSProperties;
}
/**
 * Props for the AccordionContent component
 */
export interface AccordionContentProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * The content to display when the accordion item is expanded
     */
    children: ReactNode;
    /**
     * Custom CSS styles (supports utility classes)
     */
    style?: CSSProperties;
}
declare const Accordion: import("react").ForwardRefExoticComponent<AccordionProps & import("react").RefAttributes<HTMLDivElement>>;
declare const AccordionItem: import("react").ForwardRefExoticComponent<AccordionItemProps & import("react").RefAttributes<HTMLDivElement>>;
declare const AccordionTrigger: import("react").ForwardRefExoticComponent<AccordionTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
declare const AccordionContent: import("react").ForwardRefExoticComponent<AccordionContentProps & import("react").RefAttributes<HTMLDivElement>>;
declare const AccordionComponent: typeof Accordion & {
    Item: typeof AccordionItem;
    Trigger: typeof AccordionTrigger;
    Content: typeof AccordionContent;
};
export { AccordionComponent as Accordion };