@navinc/base-react-components/cjs/accordion.d.ts

Nav's Pattern Library

import { ReactNode } from 'react';
type OpenType = string | false;
type ContentType = {
    id: string;
    header: ReactNode;
    details: ReactNode;
    disabled?: boolean;
};
type StyleOverrides = {
    background: string;
    color: string;
    divider: string;
};
type AccordionProps = {
    className?: string;
    /** Array of objects to render the accordion headers and content */
    content: ContentType[];
    /** Uncontrolled prop: opens all folds initially. Only works if uncontrolled. */
    defaultExpanded?: boolean;
    /** Controlled prop: set which panel is open yourself */
    open?: OpenType;
    /** Controlled prop: the change handler fn to set the `open` state on header click */
    setOpen?: (open: OpenType) => void;
    /** Disables entire accordion */
    disabled?: boolean;
    /** Sets rounded or square corners */
    square?: boolean;
    /** adds padding to the header and details */
    withPadding?: boolean;
    ['data-testid']?: string;
    /** Style overrides for the accordion */
    styleOverrides?: StyleOverrides;
    /** Icon to use for the expand/collapse icon */
    icon?: ReactNode;
};
export declare const Accordion: import("styled-components").StyledComponent<({ className, open, setOpen, content, "data-testid": dataTestId, styleOverrides, icon, ...props }: AccordionProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
export {};