import { memo } from "react";

import TextBox, { type TextBoxProps } from "./TextBox";

export interface DateInputProps
	extends Omit<TextBoxProps, "type" | "min" | "max"> {
	/**
	 * ISO 8601 date string (YYYY-MM-DD).
	 * @remarks Prefer ISO strings to avoid re-renders due to date-object re-creation.
	 */
	min?: string;

	/**
	 * ISO 8601 date string (YYYY-MM-DD).
	 * @remarks Prefer ISO strings to avoid re-renders due to date-object re-creation.
	 */
	max?: string;

	type?: "date" | "datetime-local";
}

/**
 * This component is a separate component by intention. We may use a different component in the future.
 * Currently, it's just a styled textbox with a date type, so we can have native input capabilities on mobile devices.
 */
export default memo(function DateInput(props: DateInputProps) {
	return <TextBox {...props} type={props.type ?? "date"} />;
});
