import type { ComponentSize, ThemeColor, VisualVariant } from '../../types';
export type OreOtpInputEvents = {
    change: Event;
    complete: {
        originalEvent?: Event;
        value: string;
    };
    input: Event;
};
/** OTP Input props */
export type OreOtpInputProps = {
    /** Theme color */
    color?: ThemeColor;
    /** Make inputs disabled */
    disabled?: boolean;
    /** Accessible label */
    label?: string;
    /** Number of input cells */
    length?: number;
    /** Mask input (show dots instead of characters) */
    masked?: boolean;
    /** Form field name */
    name?: string;
    /** Show a separator in the middle (e.g. "–") */
    separator?: string;
    /** Component size */
    size?: ComponentSize;
    /** Input type: 'numeric' (digits only) or 'alphanumeric' */
    type?: 'numeric' | 'alphanumeric';
    /** Current value */
    value?: string;
    /** Visual variant */
    variant?: Exclude<VisualVariant, 'text' | 'frost'>;
};
/**
 * A segmented OTP (One-Time Password) input with N individual cells.
 * Auto-advances focus on input, auto-backs on Backspace, handles paste.
 *
 * @element ore-otp-input
 *
 * @attr {number} length - Number of cells (default: 6)
 * @attr {string} type - 'numeric' (default) | 'alphanumeric'
 * @attr {string} value - Current code value
 * @attr {boolean} disabled - Disable all cells
 * @attr {boolean} masked - Show as password
 * @attr {string} size - 'sm' | 'md' | 'lg'
 * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'
 * @attr {string} name - Form field name
 * @attr {string} label - Group aria-label
 * @attr {string} separator - Optional separator character shown in the middle
 *
 * @fires input - Emitted whenever a cell changes.
 * @fires change - Emitted whenever a cell changes.
 * @fires complete - Emitted when all cells are filled. detail: { value: string, originalEvent?: Event }
 *
 * @slot label - Custom label above the OTP input
 * @slot helper - Custom helper text below the OTP input
 * @slot error - Custom error content below the OTP input
 *
 * @cssprop --otp-cell-size - Width and height of each cell
 * @cssprop --otp-cell-gap - Gap between cells
 * @cssprop --otp-cell-font-size - Font size inside cells
 * @cssprop --otp-cell-radius - Border radius of cells
 * @cssprop --otp-cell-bg - Cell background color
 * @cssprop --otp-cell-border-color - Default border color
 * @cssprop --otp-cell-focus-border - Focused border/caret color
 * @cssprop --otp-cell-hover-bg - Cell background on hover (flat/ghost variants)
 * @cssprop --otp-cell-hover-border-color - Cell border on hover (flat/bordered variants)
 * @cssprop --otp-cell-focus-bg - Cell background when focused (flat variant)
 * @cssprop --otp-cell-focus-border-color - Cell border when focused (flat variant)
 *
 * @part group - Group container.
 * @part cell - Shadow part for the `cell` element.
 * @example
 * ```html
 * <ore-otp-input length="6" color="primary"></ore-otp-input>
 * ```
 */
export declare const OTP_INPUT_TAG: "ore-otp-input";
//# sourceMappingURL=otp-input.d.ts.map