Interface AccordionProps

interface AccordionProps {
    background?: "transparent" | "white";
    children:
        | string
        | number
        | bigint
        | boolean
        | ReactElement<any, string | JSXElementConstructor<any>>
        | Iterable<ReactNode, any, any>
        | ReactPortal
        | Promise<AwaitedReactNode>;
    className?: string;
    customAttribute?: {
        attribute: string;
        value: string | number;
    };
    defaultExpanded?: boolean;
    disabled?: boolean;
    expanded?: boolean;
    id: string;
    isLoading?: boolean;
    lang?: "sv" | "en";
    onChange?: ((expanded: undefined | boolean) => void);
    onClick?: (() => void);
}

Properties

background? children className? customAttribute? defaultExpanded? disabled? expanded? id isLoading? lang? onChange? onClick?

Properties

Optionalbackground

background?: "transparent" | "white"

Background color for the AccordionSummary

children

children:
    | string
    | number
    | bigint
    | boolean
    | ReactElement<any, string | JSXElementConstructor<any>>
    | Iterable<ReactNode, any, any>
    | ReactPortal
    | Promise<AwaitedReactNode>

The content of the expansion panel. Provide one AccordionSummary element and one AccordionDetails element.

OptionalclassName

className?: string

Optional CSS class name.

OptionalcustomAttribute

customAttribute?: {
    attribute: string;
    value: string | number;
}

Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]".

OptionaldefaultExpanded

defaultExpanded?: boolean

Initially expanded on page load

Optionaldisabled

disabled?: boolean

If true, the component is disabled.

Optionalexpanded

expanded?: boolean

If you want to use the controlled version of Accordion

id

id: string

A unique ID for the accordion. Used internally for setting WAI-ARIA relationships

OptionalisLoading

isLoading?: boolean

If true, a loading skeleton will be rendered instead of the component.

Optionallang

lang?: "sv" | "en"

Language used for internal translations.

OptionalonChange

onChange?: ((expanded: undefined | boolean) => void)

Callback when accordion is changed.

OptionalonClick

onClick?: (() => void)

Callback when Accordion is clicked.

Settings

Member Visibility

On This Page

Properties