/// <reference types="react" />
import { IAnimated, IBox, IIcon } from "../../core/types";
/**
 * Props for the Expandable Header component.
 */
export interface IExpandableHeader extends Omit<IBox, 'title'> {
    /**
     * Content of the expandable header.
     */
    children: React.ReactNode;
}
/**
 * Props for the Expandable Content component.
 */
export interface IExpandableContent extends IBox, IAnimated {
    /**
     * Content of the expandable section.
     */
    children: React.ReactNode;
    /**
     * Indicates whether the content is currently expanded.
     */
    isOpen: boolean;
    /**
     * Determines if a divider should be shown.
     * @default false
     */
    hasDivider?: boolean;
    /**
     * Determines if a left border stroke should be applied.
     * @default false
     */
    hasStroke?: boolean;
}
/**
 * Props for the Expand Arrow component.
 */
export interface IExpandableExpandArrow extends IIcon, IAnimated {
    /**
     * Indicates whether the content is currently expanded.
     */
    isOpen: boolean;
    /**
     * onClick handler for the expand arrow.
     */
    onClick?: React.MouseEventHandler<HTMLDivElement>;
}
/**
 * Expandable component used as a templating solution when no ready-made component (like Accordion, Menu, Dropdown) fits the requirements.
 *
 * @gen_ai
 * The Expandable component is a versatile templating component designed to wrap elements, providing functionality to expand and collapse content sections.
 * It ensures that elements have rounded borders on the edges and square borders between connected elements, creating a cohesive and connected appearance.
 * Use this component as a custom solution for expandable sections in your UI when existing components like Accordion, Menu, or Dropdown do not meet your specific needs.
 */
export interface IExpandableComponent {
    /**
     * The Header sub-component for Expandable.
     */
    Header: React.FC<IExpandableHeader>;
    /**
     * The Content sub-component for Expandable.
     */
    Content: React.FC<IExpandableContent>;
    /**
     * The ExpandArrow sub-component for Expandable.
     */
    ExpandArrow: React.FC<IExpandableExpandArrow>;
}