import type {
	BaseUIChangeEventDetails,
	BaseUIGenericEventDetails,
	REASONS,
} from "../../internals/change-event-details";
import type { FieldRootState } from "../../internals/field-constants";
import type { OTPValidationType } from "../utils/otp.ts";

export type OTPFieldValidationType = OTPValidationType;

/**
 * `reason` strings the root's change-event details can carry. Matches React's
 * `OTPFieldRootChangeEventReason`.
 */
export type OTPFieldRootChangeEventReason =
	| (typeof REASONS)["inputChange"]
	| (typeof REASONS)["inputClear"]
	| (typeof REASONS)["inputPaste"]
	| (typeof REASONS)["keyboard"];

export type OTPFieldRootChangeEventDetails =
	BaseUIChangeEventDetails<OTPFieldRootChangeEventReason>;

export type OTPFieldRootInvalidEventReason =
	| (typeof REASONS)["inputChange"]
	| (typeof REASONS)["inputPaste"];

export type OTPFieldRootInvalidEventDetails =
	BaseUIGenericEventDetails<OTPFieldRootInvalidEventReason>;

export type OTPFieldRootCompleteEventReason =
	| (typeof REASONS)["inputChange"]
	| (typeof REASONS)["inputPaste"];

export type OTPFieldRootCompleteEventDetails =
	BaseUIGenericEventDetails<OTPFieldRootCompleteEventReason>;

/**
 * Public state emitted by the root to `class` / `style` / `render` callbacks
 * and `data-*` attribute projection. Extends the field-root state (valid,
 * touched, dirty, filled, focused, disabled) with OTP-specific slots.
 */
export interface OTPFieldRootState extends FieldRootState {
	/** Whether all slots are filled. */
	complete: boolean;
	/** Total slot count. */
	length: number;
	/** Read-only flag mirrored from props. */
	readOnly: boolean;
	/** Required flag mirrored from props. */
	required: boolean;
	/** Concatenated OTP value. */
	value: string;
}

/**
 * Per-slot state emitted by `<OTPField.Input>`. Swaps `filled` / `value` for
 * the slot-local values and adds the slot `index`.
 */
export interface OTPFieldInputState
	extends Omit<OTPFieldRootState, "filled" | "value"> {
	/** Whether this slot has a character. */
	filled: boolean;
	/** Index of this slot (DOM order). */
	index: number;
	/** Character rendered in this slot (or empty string). */
	value: string;
}