import * as i0 from '@angular/core';
import { Signal, InputSignal, InjectionToken, OnInit, DoCheck, InputSignalWithTransform } from '@angular/core';
import { NgControl, AbstractControl, FormGroupDirective, NgForm } from '@angular/forms';
import { VariantProps } from 'class-variance-authority';

/**
 * Contract that any control inside a form field must implement.
 *
 * This allows the form field to read state from any inner control
 * (input, textarea, custom controls) without knowing implementation details.
 *
 * @example Implementing for a custom phone input
 * ```ts
 * @Directive({
 *   selector: 'com-phone-input',
 *   providers: [{ provide: FormFieldControl, useExisting: PhoneInputComponent }],
 * })
 * export class PhoneInputComponent extends FormFieldControl<string> {
 *   // ... implement all abstract members
 * }
 * ```
 */
declare abstract class FormFieldControl<_T = unknown> {
    /** The NgControl bound to this control (if any). */
    abstract readonly ngControl: NgControl | null;
    /** Whether the control is focused. */
    abstract readonly focused: Signal<boolean>;
    /** Whether the label should float (focused or non-empty). */
    abstract readonly shouldLabelFloat: Signal<boolean>;
    /** Whether the control is required. */
    abstract readonly required: Signal<boolean>;
    /** Whether the control is disabled. */
    abstract readonly disabled: Signal<boolean>;
    /** Whether the control is in an error state. */
    abstract readonly errorState: Signal<boolean>;
    /** Unique ID for the control element. */
    abstract readonly id: Signal<string>;
    /** Structured validation errors (Signal Forms path). */
    readonly errors?: Signal<readonly unknown[] | null>;
    /** Called when the form field container is clicked. */
    abstract onContainerClick(event: MouseEvent): void;
}

/**
 * Directive to mark the label element inside a form field.
 *
 * The form field automatically associates this label with the inner control
 * and positions it appropriately based on appearance and float state.
 *
 * The label renders as `inline-flex` so it can contain inline content such as
 * icons with tooltips. Icons inside the label are visually hidden when the
 * label floats to keep the scaled-down state clean.
 *
 * @tokens none
 *
 * @example Plain label
 * ```html
 * <com-form-field>
 *   <label comLabel>Email address</label>
 *   <input comInput formControlName="email" />
 * </com-form-field>
 * ```
 *
 * @example Label with help icon and tooltip
 * ```html
 * <com-form-field>
 *   <label comLabel>
 *     User Role
 *     <button type="button" aria-label="Help" comTooltip="Admins have full access.">
 *       <com-icon [img]="CircleHelpIcon" size="xs" color="muted" />
 *     </button>
 *   </label>
 *   <input comInput />
 * </com-form-field>
 * ```
 */
declare class ComLabel {
    readonly labelId: string;
    private readonly _forId;
    readonly forId: Signal<string | null>;
    /** Sets the `for` attribute to link to the control. Called by form field. */
    setForId(id: string): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComLabel, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComLabel, "[comLabel]", ["comLabel"], {}, {}, never, never, true, never>;
}

/** Alignment of hint text in the subscript area. */
type HintAlign = 'start' | 'end';
/**
 * Directive for hint text displayed below the form field.
 *
 * The hint provides supplementary information to help users fill out the field.
 * It is automatically added to the control's `aria-describedby`.
 *
 * @tokens `--color-muted-foreground`
 *
 * @example Basic hint
 * ```html
 * <com-form-field>
 *   <label comLabel>Password</label>
 *   <input comInput formControlName="password" />
 *   <span comHint>At least 8 characters</span>
 * </com-form-field>
 * ```
 *
 * @example Right-aligned hint (e.g., character count)
 * ```html
 * <com-form-field>
 *   <label comLabel>Bio</label>
 *   <textarea comInput formControlName="bio"></textarea>
 *   <span comHint>Keep it brief</span>
 *   <span comHint align="end">{{ bioLength }}/150</span>
 * </com-form-field>
 * ```
 */
declare class ComHint {
    readonly id: string;
    readonly align: InputSignal<HintAlign>;
    protected readonly hostClasses: Signal<string>;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComHint, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComHint, "[comHint]", ["comHint"], { "align": { "alias": "align"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

/**
 * Directive for error messages displayed below the form field.
 *
 * Errors replace hints when the control is in an error state.
 * Uses `role="alert"` and `aria-live="polite"` for screen reader announcement.
 *
 * The optional `match` input allows showing errors only for specific validation errors.
 *
 * @tokens `--color-warn`
 *
 * @example Basic error
 * ```html
 * <com-form-field>
 *   <label comLabel>Email</label>
 *   <input comInput formControlName="email" />
 *   <span comError>Please enter a valid email</span>
 * </com-form-field>
 * ```
 *
 * @example Matching specific errors
 * ```html
 * <com-form-field>
 *   <label comLabel>Email</label>
 *   <input comInput formControlName="email" />
 *   <span comError match="required">Email is required.</span>
 *   <span comError match="email">Must be a valid email address.</span>
 * </com-form-field>
 * ```
 */
declare class ComError {
    readonly id: string;
    /** Reference to the form control (Reactive Forms path). */
    private readonly _control;
    /** Structured errors from Signal Forms. */
    private readonly _signalErrors;
    /**
     * Show this error only when a specific validation error key is present.
     * If empty, the error is always shown when the control is in error state.
     */
    readonly match: InputSignal<string>;
    protected readonly errorVariants: () => string;
    /**
     * Whether this error should be displayed based on the match condition.
     * Used by the form field to filter which errors to show.
     */
    readonly shouldShow: Signal<boolean>;
    /**
     * Sets the form control reference (Reactive Forms).
     * Called by the parent form field component.
     */
    setControl(control: AbstractControl | null): void;
    /**
     * Sets structured validation errors (Signal Forms).
     * Called by the parent form field component.
     */
    setSignalErrors(errors: readonly unknown[]): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComError, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComError, "[comError]", ["comError"], { "match": { "alias": "match"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

/**
 * Directive to mark content as the prefix slot in a form field.
 *
 * Prefix content appears before the input (e.g., currency symbol, icon).
 *
 * @tokens `--color-muted-foreground`
 *
 * @example Currency prefix
 * ```html
 * <com-form-field>
 *   <label comLabel>Amount</label>
 *   <span comPrefix>$</span>
 *   <input comInput type="number" formControlName="amount" />
 * </com-form-field>
 * ```
 *
 * @example Icon prefix
 * ```html
 * <com-form-field>
 *   <label comLabel>Search</label>
 *   <svg comPrefix class="size-4">...</svg>
 *   <input comInput formControlName="query" />
 * </com-form-field>
 * ```
 */
declare class ComPrefix {
    protected readonly prefixVariants: () => string;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComPrefix, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComPrefix, "[comPrefix]", ["comPrefix"], {}, {}, never, never, true, never>;
}

/**
 * Directive to mark content as the suffix slot in a form field.
 *
 * Suffix content appears after the input (e.g., unit, clear button, visibility toggle).
 *
 * @tokens `--color-muted-foreground`
 *
 * @example Unit suffix
 * ```html
 * <com-form-field>
 *   <label comLabel>Weight</label>
 *   <input comInput type="number" formControlName="weight" />
 *   <span comSuffix>kg</span>
 * </com-form-field>
 * ```
 *
 * @example Clear button suffix
 * ```html
 * <com-form-field>
 *   <label comLabel>Search</label>
 *   <input comInput formControlName="query" />
 *   <button comSuffix type="button" (click)="clearSearch()">
 *     <svg class="size-4">...</svg>
 *   </button>
 * </com-form-field>
 * ```
 *
 * @example Password visibility toggle
 * ```html
 * <com-form-field>
 *   <label comLabel>Password</label>
 *   <input comInput [type]="showPassword ? 'text' : 'password'" formControlName="password" />
 *   <button comSuffix type="button" (click)="showPassword = !showPassword">
 *     <svg class="size-4">...</svg>
 *   </button>
 * </com-form-field>
 * ```
 */
declare class ComSuffix {
    protected readonly suffixVariants: () => string;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComSuffix, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComSuffix, "[comSuffix]", ["comSuffix"], {}, {}, never, never, true, never>;
}

/**
 * Strategy for determining when to display errors in a form field.
 *
 * The default behavior shows errors when the control is invalid AND
 * either touched OR the parent form has been submitted.
 *
 * @remarks
 * **Reset gotcha:** `FormGroup.reset()` clears control state (dirty, touched, value)
 * but does NOT reset `FormGroupDirective.submitted`. This means invalid fields
 * will continue showing errors after reset because `form.submitted` is still `true`.
 *
 * To fully reset error display, use `FormGroupDirective.resetForm()` instead,
 * or call `form.markAsUntouched()` after `form.reset()`.
 *
 * @example Override globally with eager error display
 * ```ts
 * @Injectable()
 * export class EagerErrorStateMatcher extends ErrorStateMatcher {
 *   override isErrorState(control: AbstractControl | null): boolean {
 *     return !!(control?.invalid && control.dirty);
 *   }
 * }
 *
 * // In app config
 * providers: [{ provide: ErrorStateMatcher, useClass: EagerErrorStateMatcher }]
 * ```
 *
 * @example Per-field override
 * ```html
 * <com-form-field>
 *   <input comInput [errorStateMatcher]="eagerMatcher" />
 * </com-form-field>
 * ```
 */
declare class ErrorStateMatcher {
    isErrorState(control: AbstractControl | null, form: FormGroupDirective | NgForm | null): boolean;
    static ɵfac: i0.ɵɵFactoryDeclaration<ErrorStateMatcher, never>;
    static ɵprov: i0.ɵɵInjectableDeclaration<ErrorStateMatcher>;
}

type FormFieldAppearance = 'fill' | 'outline';
type FormFieldColor = 'primary' | 'accent' | 'warn';
type FormFieldFloatLabel = 'auto' | 'always';
type FormFieldSubscriptSizing = 'fixed' | 'dynamic';
/**
 * CVA variants for the form field wrapper.
 *
 * @tokens `--color-foreground`
 */
declare const formFieldVariants: (props?: {
    disabled?: boolean | null | undefined;
}) => string;
type FormFieldVariants = VariantProps<typeof formFieldVariants>;
/**
 * CVA variants for the input container (the bordered/filled area).
 *
 * @tokens `--color-input-border`, `--color-input-background`, `--color-primary`,
 *         `--color-accent`, `--color-warn`, `--color-ring`, `--color-muted`,
 *         `--color-disabled`, `--radius-input`
 */
declare const formFieldContainerVariants: (props?: {
    appearance?: FormFieldAppearance | null | undefined;
    color?: FormFieldColor | null | undefined;
    focused?: boolean | null | undefined;
    error?: boolean | null | undefined;
    disabled?: boolean | null | undefined;
}) => string;
type FormFieldContainerVariants = VariantProps<typeof formFieldContainerVariants>;
/**
 * CVA variants for the floating label.
 *
 * @tokens `--color-muted-foreground`, `--color-primary`, `--color-accent`,
 *         `--color-warn`, `--color-background`
 */
declare const formFieldLabelVariants: (props?: {
    appearance?: FormFieldAppearance | null | undefined;
    floating?: boolean | null | undefined;
    color?: FormFieldColor | null | undefined;
    error?: boolean | null | undefined;
    focused?: boolean | null | undefined;
    disabled?: boolean | null | undefined;
}) => string;
type FormFieldLabelVariants = VariantProps<typeof formFieldLabelVariants>;
/**
 * CVA variants for the subscript area (hints/errors).
 *
 * @tokens (inherits from children)
 */
declare const formFieldSubscriptVariants: (props?: {
    sizing?: FormFieldSubscriptSizing | null | undefined;
}) => string;
type FormFieldSubscriptVariants = VariantProps<typeof formFieldSubscriptVariants>;
/**
 * CVA variants for hint text.
 *
 * @tokens `--color-muted-foreground`
 */
declare const hintVariants: () => string;
/**
 * CVA variants for error messages.
 *
 * @tokens `--color-warn`
 */
declare const errorVariants: () => string;
/**
 * CVA variants for prefix slot.
 *
 * @tokens `--color-muted-foreground`
 */
declare const prefixVariants: () => string;
/**
 * CVA variants for suffix slot.
 *
 * @tokens `--color-muted-foreground`
 */
declare const suffixVariants: () => string;

/**
 * Global configuration defaults for form fields.
 *
 * @example Set defaults in app config
 * ```ts
 * providers: [
 *   {
 *     provide: FORM_FIELD_DEFAULTS,
 *     useValue: {
 *       appearance: 'fill',
 *       floatLabel: 'always',
 *       color: 'primary',
 *     }
 *   }
 * ]
 * ```
 */
interface FormFieldDefaults {
    appearance?: FormFieldAppearance;
    color?: FormFieldColor;
    floatLabel?: FormFieldFloatLabel;
    hideRequiredMarker?: boolean;
    subscriptSizing?: FormFieldSubscriptSizing;
}
declare const FORM_FIELD_DEFAULTS: InjectionToken<FormFieldDefaults>;

/**
 * Directive applied to native `<input>` and `<textarea>` elements to bridge
 * them to the form field wrapper. Implements the `FormFieldControl` contract.
 *
 * This directive does NOT implement `ControlValueAccessor` - it relies on
 * Angular's built-in value accessors (`DefaultValueAccessor`, `NumberValueAccessor`, etc.)
 * that are already applied to native elements with `formControlName` or `ngModel`.
 *
 * Instead, this directive reports state (focused, empty, disabled, error) to the
 * parent form field for proper visual presentation.
 *
 * @tokens (styling is controlled by the parent form field)
 *
 * @example Basic usage
 * ```html
 * <com-form-field>
 *   <label comLabel>Email</label>
 *   <input comInput formControlName="email" placeholder="you@example.com" />
 * </com-form-field>
 * ```
 *
 * @example Textarea
 * ```html
 * <com-form-field>
 *   <label comLabel>Description</label>
 *   <textarea comInput formControlName="description"></textarea>
 * </com-form-field>
 * ```
 *
 * @example Custom error state matcher
 * ```html
 * <com-form-field>
 *   <label comLabel>Code</label>
 *   <input comInput formControlName="code" [errorStateMatcher]="eagerMatcher" />
 * </com-form-field>
 * ```
 */
declare class ComInput implements FormFieldControl<string>, OnInit, DoCheck {
    private readonly elementRef;
    private readonly destroyRef;
    private readonly autofillMonitor;
    private readonly defaultErrorStateMatcher;
    private readonly parentForm;
    private readonly parentFormGroup;
    /** NgControl bound to this input (if using reactive forms). */
    readonly ngControl: NgControl | null;
    readonly inputId: InputSignal<string | undefined>;
    readonly inputDisabled: InputSignalWithTransform<boolean, unknown>;
    readonly inputRequired: InputSignalWithTransform<boolean, unknown>;
    readonly userAriaDescribedBy: InputSignal<string>;
    readonly errorStateMatcher: InputSignal<ErrorStateMatcher | undefined>;
    readonly sfInvalid: InputSignal<boolean>;
    readonly sfTouched: InputSignalWithTransform<boolean, unknown>;
    readonly sfErrors: InputSignal<readonly unknown[]>;
    /** Whether the form system is Signal Forms (no NgControl present). */
    private readonly isSignalForms;
    private readonly _focused;
    private readonly _autofilled;
    private readonly _empty;
    /** Incremented on every `statusChanges` emission to invalidate computeds that read plain control properties. */
    private readonly _controlStatusVersion;
    private readonly _uniqueId;
    private readonly _appearance;
    private _previousNativeValue;
    readonly focused: Signal<boolean>;
    readonly id: Signal<string>;
    readonly shouldLabelFloat: Signal<boolean>;
    readonly disabled: Signal<boolean>;
    readonly required: Signal<boolean>;
    readonly errorState: Signal<boolean>;
    /** Structured validation errors from Signal Forms, exposed for the parent form field. */
    readonly errors: Signal<readonly unknown[] | null>;
    /** Combined aria-describedby including user-provided and form-field-generated IDs. */
    private readonly _describedByIds;
    readonly ariaDescribedBy: Signal<string>;
    /** Computed host classes including appearance-based padding. */
    protected readonly hostClasses: Signal<string>;
    ngOnInit(): void;
    ngDoCheck(): void;
    private dirtyCheckNativeValue;
    protected onFocus(): void;
    protected onBlur(): void;
    protected onInput(): void;
    private updateEmpty;
    onContainerClick(event: MouseEvent): void;
    /**
     * Sets the describedBy IDs from the form field.
     * Called by the parent form field component.
     */
    setDescribedByIds(ids: string): void;
    /**
     * Sets the appearance for styling.
     * Called by the parent form field component.
     */
    setAppearance(appearance: FormFieldAppearance): void;
    /** Focus the native element. */
    focus(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComInput, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ComInput, "input[comInput], textarea[comInput]", ["comInput"], { "inputId": { "alias": "id"; "required": false; "isSignal": true; }; "inputDisabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "inputRequired": { "alias": "required"; "required": false; "isSignal": true; }; "userAriaDescribedBy": { "alias": "aria-describedby"; "required": false; "isSignal": true; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; "isSignal": true; }; "sfInvalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "sfTouched": { "alias": "touched"; "required": false; "isSignal": true; }; "sfErrors": { "alias": "errors"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

/**
 * Form field wrapper providing visual structure for form inputs.
 *
 * Provides floating labels, borders (outline/fill appearance), hints, errors,
 * and prefix/suffix slots. Automatically wires ARIA attributes for accessibility.
 *
 * The form field reads state from its inner `FormFieldControl` child (typically
 * a `ComInput` directive) and renders UI accordingly.
 *
 * @tokens `--color-foreground`, `--color-input-border`, `--color-input-background`,
 *         `--color-primary`, `--color-accent`, `--color-warn`, `--color-ring`,
 *         `--color-muted`, `--color-muted-foreground`, `--color-disabled`,
 *         `--color-disabled-foreground`, `--color-background`, `--radius-input`
 *
 * @example Basic outline field
 * ```html
 * <com-form-field>
 *   <label comLabel>Email</label>
 *   <input comInput formControlName="email" />
 *   <span comHint>We'll never share your email.</span>
 *   <span comError match="required">Email is required.</span>
 * </com-form-field>
 * ```
 *
 * @example Fill appearance
 * ```html
 * <com-form-field appearance="fill">
 *   <label comLabel>Username</label>
 *   <input comInput formControlName="username" />
 * </com-form-field>
 * ```
 *
 * @example With prefix and suffix
 * ```html
 * <com-form-field>
 *   <label comLabel>Amount</label>
 *   <span comPrefix>$</span>
 *   <input comInput type="number" formControlName="amount" />
 *   <span comSuffix>.00</span>
 * </com-form-field>
 * ```
 *
 * @example Label with icon and tooltip
 * ```html
 * <com-form-field>
 *   <label comLabel>
 *     User Role
 *     <button type="button" aria-label="Help" comTooltip="Admins have full access.">
 *       <com-icon [img]="CircleHelpIcon" size="xs" color="muted" />
 *     </button>
 *   </label>
 *   <input comInput />
 * </com-form-field>
 * ```
 */
declare class ComFormField {
    private readonly defaults;
    readonly control: Signal<FormFieldControl | undefined>;
    readonly inputDirective: Signal<ComInput | undefined>;
    readonly labelChild: Signal<ComLabel | undefined>;
    readonly hintChildren: Signal<readonly ComHint[]>;
    readonly errorChildren: Signal<readonly ComError[]>;
    readonly prefixChild: Signal<ComPrefix | undefined>;
    readonly suffixChild: Signal<ComSuffix | undefined>;
    readonly appearance: InputSignal<FormFieldAppearance>;
    readonly color: InputSignal<FormFieldColor>;
    readonly floatLabel: InputSignal<FormFieldFloatLabel>;
    readonly hideRequiredMarker: InputSignalWithTransform<boolean, unknown>;
    readonly subscriptSizing: InputSignal<FormFieldSubscriptSizing>;
    readonly userClass: InputSignal<string>;
    readonly shouldLabelFloat: Signal<boolean>;
    readonly isFocused: Signal<boolean>;
    readonly isDisabled: Signal<boolean>;
    readonly hasError: Signal<boolean>;
    readonly hasPrefix: Signal<boolean>;
    readonly hasSuffix: Signal<boolean>;
    readonly showRequiredMarker: Signal<boolean>;
    readonly showErrors: Signal<boolean>;
    protected readonly hostClasses: Signal<string>;
    protected readonly containerClasses: Signal<string>;
    protected readonly labelClasses: Signal<string>;
    protected readonly subscriptClasses: Signal<string>;
    constructor();
    protected onContainerClick(event: MouseEvent): void;
    protected onContainerActivate(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComFormField, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ComFormField, "com-form-field", ["comFormField"], { "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "hideRequiredMarker": { "alias": "hideRequiredMarker"; "required": false; "isSignal": true; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, ["control", "inputDirective", "labelChild", "hintChildren", "errorChildren", "prefixChild", "suffixChild"], ["[comPrefix]", "[comLabel]", "*", "[comSuffix]", "[comError]", "[comHint]:not([align='end'])", "[comHint][align='end']"], true, never>;
}

export { ComError, ComFormField, ComHint, ComInput, ComLabel, ComPrefix, ComSuffix, ErrorStateMatcher, FORM_FIELD_DEFAULTS, FormFieldControl, errorVariants, formFieldContainerVariants, formFieldLabelVariants, formFieldSubscriptVariants, formFieldVariants, hintVariants, prefixVariants, suffixVariants };
export type { FormFieldAppearance, FormFieldColor, FormFieldContainerVariants, FormFieldDefaults, FormFieldFloatLabel, FormFieldLabelVariants, FormFieldSubscriptSizing, FormFieldSubscriptVariants, FormFieldVariants, HintAlign };