import * as i0 from '@angular/core';
import { TemplateRef, InputSignal, ModelSignal, InputSignalWithTransform, Signal } from '@angular/core';
import { VariantProps } from 'class-variance-authority';

/**
 * Template context provided to custom segment templates.
 *
 * @example
 * ```html
 * <ng-template comSegmentDef let-option let-active="active">
 *   <com-icon [name]="option.value" />
 *   <span>{{ option.label }}</span>
 * </ng-template>
 * ```
 */
interface SegmentTemplateContext<T = unknown> {
    /** The option object (default for `let-option`). */
    $implicit: SegmentOption<T>;
    /** Whether this segment is currently selected. */
    active: boolean;
    /** Whether this segment is disabled. */
    disabled: boolean;
    /** Position in the options list (0-indexed). */
    index: number;
}
/**
 * Directive to mark a custom template for segment content.
 *
 * The template receives a `SegmentTemplateContext` with the option data,
 * active state, disabled state, and index. Use this to customize the
 * inner content of each segment while the component manages the button,
 * styling, and ARIA attributes.
 *
 * @tokens none
 *
 * @example Icon + text
 * ```html
 * <com-segmented-control [options]="viewOptions" [(value)]="currentView">
 *   <ng-template comSegmentDef let-option let-active="active">
 *     <com-icon [name]="option.value" size="sm" />
 *     <span>{{ option.label }}</span>
 *   </ng-template>
 * </com-segmented-control>
 * ```
 *
 * @example Icon only (label used for accessibility)
 * ```html
 * <com-segmented-control [options]="alignmentOptions" [(value)]="alignment">
 *   <ng-template comSegmentDef let-option>
 *     <com-icon [name]="'align-' + option.value" size="sm" />
 *   </ng-template>
 * </com-segmented-control>
 * ```
 */
declare class ComSegmentDef<T = unknown> {
    readonly templateRef: TemplateRef<SegmentTemplateContext<T>>;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComSegmentDef<any>, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComSegmentDef<any>, "ng-template[comSegmentDef]", never, {}, {}, never, never, true, never>;
}

type SegmentedControlSize = 'sm' | 'md' | 'lg';
type SegmentedControlColor = 'primary' | 'accent' | 'muted';
type SegmentedControlVariant = 'filled' | 'outline';
/**
 * CVA variants for the segmented control container (track).
 * Controls overall sizing, padding, and track background.
 */
declare const segmentedControlContainerVariants: (props?: {
    size?: SegmentedControlSize;
    fullWidth?: boolean;
}) => string;
/**
 * CVA variants for individual segment buttons.
 * Controls per-segment sizing, typography, and active/inactive color states.
 */
declare const segmentedControlSegmentVariants: (props?: {
    size?: SegmentedControlSize;
    color?: SegmentedControlColor;
    variant?: SegmentedControlVariant;
    active?: boolean;
    fullWidth?: boolean;
}) => string;
/**
 * Classes to apply when a segment is disabled.
 * Separate from CVA to avoid complex variant combinations.
 */
declare const SEGMENT_DISABLED_CLASSES = "bg-disabled text-disabled-foreground cursor-not-allowed hover:bg-disabled";
type SegmentedControlContainerVariants = VariantProps<typeof segmentedControlContainerVariants>;
type SegmentedControlSegmentVariants = VariantProps<typeof segmentedControlSegmentVariants>;

/**
 * Represents a single option in the segmented control.
 */
interface SegmentOption<T = unknown> {
    /** The value associated with this option. */
    value: T;
    /** Display label (also used as aria-label fallback for custom templates). */
    label: string;
    /** Whether this option is disabled. */
    disabled?: boolean | undefined;
}
/**
 * Segmented control component — a horizontal group of mutually exclusive options
 * where one is always selected. Think of it as a styled radio group in pill form.
 *
 * Supports two rendering modes:
 * - **Simple mode**: Plain text labels from the `label` property
 * - **Custom template mode**: Full control via `ng-template[comSegmentDef]`
 *
 * @tokens `--color-primary`, `--color-primary-foreground`,
 *         `--color-accent`, `--color-accent-foreground`,
 *         `--color-muted`, `--color-muted-foreground`, `--color-muted-hover`,
 *         `--color-background`, `--color-foreground`,
 *         `--color-disabled`, `--color-disabled-foreground`,
 *         `--color-border`, `--color-ring`
 *
 * @example Basic two-option toggle
 * ```html
 * <com-segmented-control
 *   [options]="[
 *     { value: 'admin', label: 'Admin' },
 *     { value: 'user', label: 'User' }
 *   ]"
 *   [(value)]="selectedRole"
 * />
 * ```
 *
 * @example Multiple options with variants
 * ```html
 * <com-segmented-control
 *   [options]="viewOptions"
 *   [(value)]="currentView"
 *   color="primary"
 *   size="sm"
 * />
 * ```
 *
 * @example Custom template with icons
 * ```html
 * <com-segmented-control [options]="viewOptions" [(value)]="currentView" color="primary">
 *   <ng-template comSegmentDef let-option let-active="active">
 *     <com-icon [name]="option.value === 'grid' ? 'grid' : 'list'" size="sm" />
 *     <span>{{ option.label }}</span>
 *   </ng-template>
 * </com-segmented-control>
 * ```
 *
 * @example Custom template with badges
 * ```html
 * <com-segmented-control [options]="statusOptions" [(value)]="statusFilter" color="accent">
 *   <ng-template comSegmentDef let-option let-active="active">
 *     <span>{{ option.label }}</span>
 *     <span
 *       class="ml-1.5 rounded-pill px-1.5 text-xs"
 *       [class]="active ? 'bg-accent-subtle text-accent-subtle-foreground' : 'bg-muted text-muted-foreground'"
 *     >
 *       {{ option.value === 'open' ? openCount : closedCount }}
 *     </span>
 *   </ng-template>
 * </com-segmented-control>
 * ```
 *
 * @example Icon only (label used for accessibility)
 * ```html
 * <com-segmented-control
 *   [options]="[
 *     { value: 'left', label: 'Align left' },
 *     { value: 'center', label: 'Align center' },
 *     { value: 'right', label: 'Align right' }
 *   ]"
 *   [(value)]="alignment"
 *   size="sm"
 * >
 *   <ng-template comSegmentDef let-option>
 *     <com-icon [name]="'align-' + option.value" size="sm" />
 *   </ng-template>
 * </com-segmented-control>
 * ```
 *
 * @example Full width + outline variant
 * ```html
 * <com-segmented-control
 *   [options]="plans"
 *   [(value)]="selectedPlan"
 *   variant="outline"
 *   color="primary"
 *   [fullWidth]="true"
 * />
 * ```
 *
 * @example Disabled options
 * ```html
 * <com-segmented-control
 *   [options]="[
 *     { value: 'free', label: 'Free' },
 *     { value: 'pro', label: 'Pro' },
 *     { value: 'enterprise', label: 'Enterprise', disabled: true }
 *   ]"
 *   [(value)]="plan"
 *   color="primary"
 *   size="lg"
 * />
 * ```
 */
declare class ComSegmentedControl<T = unknown> {
    /** References to all segment buttons for focus management. */
    private readonly segmentButtons;
    /** The list of options to display. */
    readonly options: InputSignal<SegmentOption<T>[]>;
    /** Currently selected value. Two-way bindable with `[(value)]`. */
    readonly value: ModelSignal<T | undefined>;
    /** Controls segment height, padding, and font size. */
    readonly size: InputSignal<SegmentedControlSize>;
    /** Color scheme for the active segment. */
    readonly color: InputSignal<SegmentedControlColor>;
    /** Visual variant: filled (solid background) or outline (ring border). */
    readonly variant: InputSignal<SegmentedControlVariant>;
    /** When true, segments stretch equally to fill available width. */
    readonly fullWidth: InputSignalWithTransform<boolean, unknown>;
    /** Accessible label for the radiogroup container. */
    readonly ariaLabel: InputSignal<string | null>;
    /** Custom CSS classes to merge with container classes. */
    readonly userClass: InputSignal<string>;
    /** Optional custom template for segment content. */
    readonly customTemplate: Signal<ComSegmentDef<T> | undefined>;
    /** Classes for the container/track element. */
    protected readonly containerClasses: Signal<string>;
    /**
     * Checks if the given option is currently selected.
     */
    isActive(option: SegmentOption<T>): boolean;
    /**
     * Selects the given option (if not disabled).
     */
    select(option: SegmentOption<T>): void;
    /**
     * Returns the tabindex for a segment at the given index.
     * Implements roving tabindex: only the selected (or first focusable) segment has tabindex="0".
     */
    tabIndexFor(index: number): number;
    /**
     * Returns computed classes for a segment button.
     */
    segmentClasses(option: SegmentOption<T>): string;
    /**
     * Builds the template context for custom templates.
     */
    getTemplateContext(option: SegmentOption<T>, index: number): SegmentTemplateContext<T>;
    /**
     * Handles keyboard navigation for the segmented control.
     * Implements ARIA radiogroup keyboard patterns.
     */
    onKeydown(event: KeyboardEvent, currentIndex: number): void;
    /**
     * Finds the next focusable (non-disabled) option index in the given direction.
     * Wraps around to the beginning/end of the list.
     */
    private findNextFocusableIndex;
    /**
     * Finds the first focusable (non-disabled) option index.
     */
    private findFirstFocusableIndex;
    /**
     * Finds the last focusable (non-disabled) option index.
     */
    private findLastFocusableIndex;
    /**
     * Focuses the segment button at the given index.
     */
    private focusSegmentAt;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComSegmentedControl<any>, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ComSegmentedControl<any>, "com-segmented-control", ["comSegmentedControl"], { "options": { "alias": "options"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["customTemplate"], never, true, never>;
}

export { ComSegmentDef, ComSegmentedControl, SEGMENT_DISABLED_CLASSES, segmentedControlContainerVariants, segmentedControlSegmentVariants };
export type { SegmentOption, SegmentTemplateContext, SegmentedControlColor, SegmentedControlContainerVariants, SegmentedControlSegmentVariants, SegmentedControlSize, SegmentedControlVariant };