import { n as e, t } from "../../utils-C_mWfcFX.js";
import { t as n } from "../../a11y-CuHKgVSx.js";
import { Calendar as r } from "../calendar/index.js";
import { DateRangePicker as i } from "./range.js";
import { TimePicker as a } from "./time.js";
//#region src/form/date-picker/index.ts
function o(e, t, n) {
	if (t === "YYYY-MM-DD") return e.toISOString().split("T")[0] ?? "";
	let r = n ?? (typeof navigator < "u" ? navigator.language : "en-US");
	return new Intl.DateTimeFormat(r, {
		year: "numeric",
		month: "2-digit",
		day: "2-digit"
	}).format(e);
}
function s(e, t) {
	let n = e.trim();
	if (n === "") return null;
	let r = n.replace(/\D/g, "");
	if (r.length >= 8) {
		let e = parseInt(r.substring(0, 4), 10), t = parseInt(r.substring(4, 6), 10), n = parseInt(r.substring(6, 8), 10);
		if (!isNaN(e) && t >= 1 && t <= 12 && n >= 1 && n <= 31) {
			let r = new Date(e, t - 1, n);
			if (!isNaN(r.getTime())) return r;
		}
	}
	let i = new Date(n);
	return isNaN(i.getTime()) ? null : i;
}
var c = class {
	el;
	inputEl;
	toggleBtn;
	dropdownEl;
	inputId;
	dropdownId;
	calendar = null;
	config;
	currentValue;
	isOpen = !1;
	isDestroyed = !1;
	handleDocumentClick;
	handleInputKeydown;
	constructor(n) {
		this.config = n, this.inputId = e("cmm-datepicker"), this.dropdownId = e("cmm-datepicker-dropdown"), this.currentValue = n.value ?? null;
		let r = n.format ?? "YYYY-MM-DD";
		this.el = document.createElement("div"), this.el.className = this.buildRootClass();
		let i = document.createElement("div");
		i.className = "cmm-date-picker__input-wrap", this.inputEl = document.createElement("input"), this.inputEl.id = this.inputId, this.inputEl.type = "text", this.inputEl.className = "cmm-date-picker__input", this.inputEl.placeholder = n.placeholder ?? r.toLowerCase(), this.inputEl.setAttribute("role", "combobox"), this.inputEl.setAttribute("aria-haspopup", "dialog"), this.inputEl.setAttribute("aria-expanded", "false"), this.inputEl.setAttribute("aria-controls", this.dropdownId), this.inputEl.setAttribute("aria-label", "Date"), this.inputEl.setAttribute("autocomplete", "off"), this.currentValue !== null && (this.inputEl.value = o(this.currentValue, r, n.locale)), this.inputEl.addEventListener("change", () => {
			if (this.isDestroyed) return;
			let e = s(this.inputEl.value, r);
			e !== null && (this.currentValue = e, this.inputEl.value = o(e, r, n.locale), this.calendar?.setValue(e), this.config.onChange?.(e));
		}), this.inputEl.addEventListener("focus", () => {
			this.isDestroyed || this.open();
		});
		let a = document.createElement("button");
		a.type = "button", a.className = "cmm-date-picker__clear", a.setAttribute("aria-label", "Clear date"), a.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\"><path d=\"M10.5 3.5L3.5 10.5M3.5 3.5L10.5 10.5\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"/></svg>", a.addEventListener("click", (e) => {
			e.stopPropagation(), !this.isDestroyed && (this.currentValue = null, this.inputEl.value = "", this.calendar?.setValue(null), this.config.onChange?.(null));
		}), this.toggleBtn = document.createElement("button"), this.toggleBtn.type = "button", this.toggleBtn.className = "cmm-date-picker__toggle", this.toggleBtn.setAttribute("aria-label", "Open calendar"), this.toggleBtn.innerHTML = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><rect x=\"2\" y=\"3\" width=\"12\" height=\"11\" rx=\"1.5\" stroke=\"currentColor\" stroke-width=\"1.2\"/><path d=\"M2 6.5h12M5.5 2v2M10.5 2v2\" stroke=\"currentColor\" stroke-width=\"1.2\" stroke-linecap=\"round\"/></svg>", this.toggleBtn.addEventListener("click", (e) => {
			e.stopPropagation(), !this.isDestroyed && (this.isOpen ? this.close() : this.open());
		}), i.appendChild(this.inputEl), i.appendChild(a), i.appendChild(this.toggleBtn), this.el.appendChild(i), this.dropdownEl = document.createElement("div"), this.dropdownEl.id = this.dropdownId, this.dropdownEl.className = "cmm-date-picker__dropdown", this.dropdownEl.setAttribute("role", "dialog"), this.dropdownEl.setAttribute("aria-modal", "false"), this.dropdownEl.setAttribute("aria-label", "Choose date"), this.dropdownEl.style.display = "none", this.el.appendChild(this.dropdownEl), this.handleDocumentClick = (e) => {
			if (this.isDestroyed) return;
			let t = e.target;
			this.el.contains(t) || this.close();
		}, this.handleInputKeydown = (e) => {
			this.isDestroyed || (e.key === "Escape" && this.isOpen ? (e.preventDefault(), this.close()) : e.key === "ArrowDown" && !this.isOpen && (e.preventDefault(), this.open()));
		}, this.inputEl.addEventListener("keydown", this.handleInputKeydown), t(n.container).appendChild(this.el);
	}
	getValue() {
		return this.currentValue;
	}
	setValue(e) {
		this.currentValue = e;
		let t = this.config.format ?? "YYYY-MM-DD";
		this.inputEl.value = e === null ? "" : o(e, t, this.config.locale), this.calendar?.setValue(e);
	}
	open() {
		this.isOpen || this.isDestroyed || (this.isOpen = !0, this.dropdownEl.style.display = "", this.inputEl.setAttribute("aria-expanded", "true"), this.calendar === null ? this.calendar = new r({
			container: this.dropdownEl,
			value: this.currentValue,
			minDate: this.config.minDate,
			maxDate: this.config.maxDate,
			disabledDates: this.config.disabledDates,
			weekStart: this.config.weekStart,
			mode: "single",
			onChange: (e) => {
				let t = this.config.format ?? "YYYY-MM-DD";
				this.currentValue = e, this.inputEl.value = o(e, t, this.config.locale), this.config.onChange?.(e), n(`Selected ${e.toLocaleDateString("en-US", {
					weekday: "long",
					year: "numeric",
					month: "long",
					day: "numeric"
				})}`, "polite"), this.close();
			}
		}) : this.currentValue !== null && (this.calendar.setValue(this.currentValue), this.calendar.goToMonth(this.currentValue.getFullYear(), this.currentValue.getMonth())), this.positionDropdown(), document.addEventListener("click", this.handleDocumentClick));
	}
	close() {
		this.isOpen && (this.isOpen = !1, this.dropdownEl.style.display = "none", this.inputEl.setAttribute("aria-expanded", "false"), document.removeEventListener("click", this.handleDocumentClick));
	}
	destroy() {
		this.isDestroyed = !0, this.close(), this.inputEl.removeEventListener("keydown", this.handleInputKeydown), document.removeEventListener("click", this.handleDocumentClick), this.calendar?.destroy(), this.el.remove();
	}
	buildRootClass() {
		let e = ["cmm-date-picker"];
		return this.config.className && e.push(this.config.className), e.join(" ");
	}
	positionDropdown() {
		let e = this.el.getBoundingClientRect(), t = window.innerHeight - e.bottom;
		t < 320 && e.top > t ? (this.dropdownEl.classList.add("cmm-date-picker__dropdown--above"), this.dropdownEl.classList.remove("cmm-date-picker__dropdown--below")) : (this.dropdownEl.classList.add("cmm-date-picker__dropdown--below"), this.dropdownEl.classList.remove("cmm-date-picker__dropdown--above"));
	}
};
//#endregion
export { c as DatePicker, i as DateRangePicker, a as TimePicker };

//# sourceMappingURL=index.js.map