import { DetailsHTMLAttributes, ToggleEventHandler } from 'react';
import { Theme } from '../../types';
import { AccordionSize, ChevronPosition, Summary } from './Accordion.utils';
export interface AccordionProps extends DetailsHTMLAttributes<HTMLDetailsElement> {
    /** Content to be displayed within the accordion. */
    children: React.ReactNode;
    /**
     * The `summary` prop can either be a simple `string` or an object with specific properties.
     * When provided as a string, it represents the summary text directly.
     * When provided as an object, it allows for more detailed configuration, including:
     * - `headingText: string` The text content for the summary.
     * - `headingSize?: 'x-large' | 'x-large-uppercase' | 'large' | 'large-uppercase' | 'medium' | 'medium-uppercase' | 'small' | 'small-uppercase'` Defines the size of the heading, using predefined size types, defaults to `'medium'`
     * - `headingTag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'` Specifies the HTML tag to be used for the heading, such as 'h1', 'h2', etc., defaults to `'h2'`
     *
     * @prop {string | { headingText: string; headingSize?: HeadingSize; headingTag?: HeadingTag; }} summary
     */
    summary: Summary;
    /** Specifies the position of the chevron icon.
     * @default 'right'
     */
    chevronPosition?: ChevronPosition;
    /** Custom area below the summary. **Cannot be used together with `numberIndicatorValue`**. */
    hint?: React.ReactNode;
    /** Aligns the accordion with text.
     * @default false
     */
    isFlush?: boolean;
    /** Determines if the Accordion is open.
     * @default false
     */
    isOpen?: boolean;
    /** Number Indicator value displayed next to the label. **Cannot be used together with `hint`**. */
    numberIndicatorValue?: string;
    /** Adds a descriptive label for screen readers to the Number Indicator. */
    numberIndicatorAriaLabel?: string;
    /** Size of the accordion.
     * @default 'medium'
     */
    size?: AccordionSize;
    /** Defines the theme.
     * @default 'light'
     */
    theme?: Theme;
    /**
     * Event handler for the `toggle` event, which is fired when the open state of the accordion changes.
     * This can be used to synchronize the internal state of the `DSAccordion` with external state management or to perform side effects when the accordion is toggled.
     */
    onToggle?: ToggleEventHandler<HTMLDetailsElement>;
}
/**
 * A component that renders an accordion using the `details` HTML element.
 *
 * Design in Figma: [Accordion](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=17260-166)
 */
export declare const DSAccordion: import('react').ForwardRefExoticComponent<AccordionProps & import('react').RefAttributes<HTMLDetailsElement>>;