import * as i0 from '@angular/core';
import { EventEmitter, AfterContentInit, QueryList } from '@angular/core';

/**
 * @description
 * Individual toggle item component within eui-toggle-group for segmented control interfaces.
 * Represents a single selectable option in a group of mutually exclusive or multi-select choices.
 * Manages checked state and emits selection events for parent toggle group coordination.
 * Provides button-based interaction with consistent styling and accessibility.
 * Must be used as a direct child of eui-toggle-group to participate in group selection behavior.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <!-- Within toggle group -->
 * <eui-toggle-group>
 *   <eui-toggle-group-item id="option1" [isChecked]="true">
 *     Option 1
 *   </eui-toggle-group-item>
 *   <eui-toggle-group-item id="option2">
 *     Option 2
 *   </eui-toggle-group-item>
 * </eui-toggle-group>
 * ```
 *
 * ### Accessibility
 * - Button element provides native keyboard support
 * - Clear, descriptive text content is essential
 * - Checked state is visually distinct
 *
 * ### Notes
 * - Must be direct child of eui-toggle-group
 * - Requires unique id for state management
 * - Selection behavior controlled by parent toggle group
 */
declare class EuiToggleGroupItemComponent {
    get cssClasses(): string;
    /**
     * Unique identifier for the toggle item.
     * Used for tracking selection state and programmatic item management.
     */
    id: string;
    /**
     * Controls the checked state of the toggle item.
     * When true, applies checked styling and indicates selection.
     * Managed by parent toggle group for single-select mode or individually for multi-select.
     * @default false
     */
    isChecked: boolean;
    /**
     * Emitted when the toggle item is clicked.
     * Payload: reference to the clicked EuiToggleGroupItemComponent instance.
     * Allows parent toggle group to coordinate selection state across items.
     */
    itemClick: EventEmitter<EuiToggleGroupItemComponent>;
    protected buttonClick(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiToggleGroupItemComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiToggleGroupItemComponent, "eui-toggle-group-item", never, { "id": { "alias": "id"; "required": false; }; "isChecked": { "alias": "isChecked"; "required": false; }; }, { "itemClick": "itemClick"; }, never, ["*"], true, never>;
    static ngAcceptInputType_isChecked: unknown;
}

/**
 * @description
 * Component for grouping multiple buttons together with optional checkbox or radio button behavior.
 * Segmented control component that groups multiple toggle items into a unified selection interface.
 * Supports both single-select (radio button behavior) and multi-select (checkbox behavior) modes.
 * Manages selection state coordination across child toggle items automatically.
 * Provides fluid width option for responsive layouts where items expand to fill available space.
 * Commonly used for view switchers, filter options, or any mutually exclusive or multi-select choice sets.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <!-- Single select (radio behavior) -->
 * <eui-toggle-group (itemClick)="onViewChange($event)">
 *   <eui-toggle-group-item id="list" [isChecked]="true">
 *     List View
 *   </eui-toggle-group-item>
 *   <eui-toggle-group-item id="grid">
 *     Grid View
 *   </eui-toggle-group-item>
 * </eui-toggle-group>
 *
 * <!-- Multi-select (checkbox behavior) -->
 * <eui-toggle-group [isMultiple]="true">
 *   <eui-toggle-group-item id="bold">Bold</eui-toggle-group-item>
 *   <eui-toggle-group-item id="italic">Italic</eui-toggle-group-item>
 *   <eui-toggle-group-item id="underline">Underline</eui-toggle-group-item>
 * </eui-toggle-group>
 *
 * <!-- Fluid width -->
 * <eui-toggle-group [isFluid]="true">
 *   <eui-toggle-group-item id="option1">Option 1</eui-toggle-group-item>
 *   <eui-toggle-group-item id="option2">Option 2</eui-toggle-group-item>
 * </eui-toggle-group>
 * ```
 *
 * ### Accessibility
 * - Use role="group" with aria-label describing the group purpose
 * - Each item should have clear, descriptive text
 * - Keyboard navigation (Tab, Arrow keys) should work
 * - Announce selection changes to screen readers
 *
 * ### Notes
 * - Single-select mode (default): only one item can be checked at a time
 * - Multi-select mode (isMultiple="true"): multiple items can be checked
 * - Fluid mode (isFluid="true"): items expand to fill container width
 * - Each item must have unique id for proper state management
 */
declare class EuiToggleGroupComponent implements AfterContentInit {
    /** CSS classes applied to the host element */
    get cssClasses(): string;
    /**
     * Whether the several items can be checked
     * @default false
     */
    isMultiple: boolean;
    isFluid: boolean;
    /**
     * Event emitted when any item in the group is clicked
     * Emits the clicked EuiToggleGroupItemComponent instance
     */
    itemClick: EventEmitter<EuiToggleGroupItemComponent>;
    /**
     * Query list of all EuiButtonComponent instances within the group
     */
    items: QueryList<EuiToggleGroupItemComponent>;
    /**
     * Initializes button click subscriptions after content is initialized
     */
    ngAfterContentInit(): void;
    private handleInnerButtonClick;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiToggleGroupComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiToggleGroupComponent, "eui-toggle-group", never, { "isMultiple": { "alias": "isMultiple"; "required": false; }; "isFluid": { "alias": "isFluid"; "required": false; }; }, { "itemClick": "itemClick"; }, ["items"], ["*"], true, never>;
    static ngAcceptInputType_isMultiple: unknown;
    static ngAcceptInputType_isFluid: unknown;
}

declare const EUI_TOGGLE_GROUP: readonly [typeof EuiToggleGroupComponent, typeof EuiToggleGroupItemComponent];

export { EUI_TOGGLE_GROUP, EuiToggleGroupComponent, EuiToggleGroupItemComponent };
//# sourceMappingURL=eui-components-eui-toggle-group.d.ts.map
