import { IEventDetail, IEventEmitter } from '@breadstone/mosaik-elements';
import { ISlottable } from '../../../Behaviors/Slottable';
import { ExpandDirection } from '../../../Types/ExpandDirection';
import { ExpanderGroupStacking } from '../../../Types/ExpanderGroupStacking';
import { ExpansionMode } from '../../../Types/ExpansionMode';
import { CustomElement } from '../../Abstracts/CustomElement';
import { ExpanderElement } from './ExpanderElement';
import type { IExpanderGroupElementProps } from './IExpanderGroupElementProps';
declare const ExpanderGroupElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
/**
 * ExpanderGroup - A component that represents a group of expandable items.
 *
 * @description
 * The ExpanderGroup component is designed to manage a collection of expander items, allowing users to show or hide
 * related content in a structured manner. It helps in organizing information hierarchically and improves user
 * experience by minimizing clutter.
 *
 * @name ExpanderGroup
 * @element mosaik-expander-group
 * @category UI Components
 *
 * @example
 * Basic expander group with two items:
 * ```html
 * <mosaik-expander-group>
 *   <mosaik-expander header="Expander 1">
 *     <mosaik-text text="Content for expander 1."></mosaik-text>
 *   </mosaik-expander>
 *   <mosaik-expander header="Expander 2">
 *     <mosaik-text text="Content for expander 2."></mosaik-text>
 *   </mosaik-expander>
 * </mosaik-expander-group>
 * ```
 *
 * @example
 * Expander group with variant and appearance:
 * ```html
 * <mosaik-expander-group appearance="outline" variant="primary">
 *   <mosaik-expander header="Section A" is-expanded>
 *     <mosaik-text text="Section A is pre-expanded."></mosaik-text>
 *   </mosaik-expander>
 *   <mosaik-expander header="Section B">
 *     <mosaik-text text="Section B content."></mosaik-text>
 *   </mosaik-expander>
 * </mosaik-expander-group>
 * ```
 *
 * @slot - The default slot for placing expander items.
 *
 * @fires toggled {ToggledEvent} - Fired when an expander item is changed.
 *
 * @cssprop {String} --expander-group-font-family - The font-family property for the expander group text.
 * @cssprop {String} --expander-group-font-size - The font-size property for the expander group text.
 * @cssprop {String} --expander-group-font-line-height - The line-height property for the expander group text.
 * @cssprop {String} --expander-group-font-weight - The font-weight property for the expander group text.
 * @cssprop {String} --expander-group-font-letter-spacing - The letter-spacing property for the expander group text.
 * @cssprop {String} --expander-group-font-text-decoration - The text-decoration property for the expander group text.
 * @cssprop {String} --expander-group-font-text-transform - The text-transform property for the expander group text.
 * @cssprop {Color} --expander-group-background-color - The background-color property for the expander group.
 * @cssprop {Color} --expander-group-foreground-color - The foreground-color property for the expander group.
 * @cssprop {Color} --expander-group-border-color - The border-color property for the expander group.
 * @cssprop {String} --expander-group-border-width - The border-width property for the expander group.
 * @cssprop {String} --expander-group-border-radius - The border-radius property for the expander group.
 * @cssprop {String} --expander-group-border-style - The border-style property for the expander group.
 * @cssprop {String} --expander-group-transition-duration - The transition duration for animations.
 * @cssprop {String} --expander-group-transition-mode - The transition mode for animations.
 * @cssprop {String} --expander-group-transition-property - The transition property for animations.
 * @cssprop {String} --expander-group-padding-top - The padding-top property for the expander group.
 * @cssprop {String} --expander-group-padding-left - The padding-left property for the expander group.
 * @cssprop {String} --expander-group-padding-bottom - The padding-bottom property for the expander group.
 * @cssprop {String} --expander-group-padding-right - The padding-right property for the expander group.
 * @cssprop {String} --expander-group-gap - The gap between items in the expander group.
 *
 * @dependency {ExpanderElement} - The Expander element used within the group.
 *
 * @public
 */
export declare class ExpanderGroupElement extends ExpanderGroupElement_base implements IExpanderGroupElementProps, ISlottable {
    private readonly _keyboardController;
    private readonly _toggled;
    private readonly _itemSubscriptions;
    private readonly _provider;
    private _lastTriggeredExpander;
    private _mode;
    private _direction;
    private _stacking;
    /**
     * @public
     */
    constructor();
    /**
     * Returns the `is` property.
     * The `is` property represents natural name of this element.
     *
     * @public
     * @static
     * @readonly
     */
    static get is(): string;
    /**
     * Gets or sets the `mode` property.
     *
     * @public
     * @attr
     */
    get mode(): ExpansionMode;
    set mode(value: ExpansionMode);
    /**
     * Gets or sets the `direction` property.
     *
     * @public
     * @attr
     */
    get direction(): ExpandDirection;
    set direction(value: ExpandDirection);
    /**
     * Gets or sets the `stacking` property.
     * The `stacking` property defines how expander items are visually stacked.
     * - `'joined'` (default): Items are visually connected with no gap and flattened intermediate border-radii.
     * - `'separated'`: Items are visually separated with a gap, and each item retains its full border-radius.
     *
     * @default 'joined'
     * @public
     * @attr
     */
    get stacking(): ExpanderGroupStacking;
    set stacking(value: ExpanderGroupStacking);
    /**
     * Called when the expander item is toggled.
     * Provides reference to `IEventDetail` as event detail.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get toggled(): IEventEmitter<IEventDetail>;
    /**
     * @public
     */
    collapse(expander: ExpanderElement): void;
    /**
     * @public
     */
    expand(expander: ExpanderElement): void;
    /**
     * @public
     * @override
     */
    connectedCallback(): void;
    /**
     * @public
     * @override
     */
    onSlotChanges(): void;
    /**
     * Emits the `toggled` event.
     *
     * @protected
     */
    protected onToggled(args: IEventDetail): void;
    /**
     * @protected
     */
    protected onModePropertyChanged(prev: ExpansionMode, next: ExpansionMode): void;
    /**
     * @private
     */
    private getSlotItems;
    /**
     * @private
     */
    private getEnabledSlotItems;
}
/**
 * @public
 */
export declare namespace ExpanderGroupElement {
    type Props = IExpanderGroupElementProps;
}
/**
 * @public
 */
declare global {
    interface HTMLElementTagNameMap {
        'mosaik-expander-group': ExpanderGroupElement;
    }
}
export {};
//# sourceMappingURL=ExpanderGroupElement.d.ts.map