@proyecto-viviana/solidaria 0.3.0 → 0.4.0

package/dist/_chunk/datepicker.jsx

@@ -0,0 +1,1393 @@
+import { t as createPress } from "./createPress.jsx";
+import { i as access, o as mergeProps } from "./env.jsx";
+import { S as scrollIntoViewport } from "./utils.jsx";
+import { a as getEventTarget, l as getScrollParent, t as focusSafely, y as nodeContains } from "./focus.jsx";
+import { a as useLocale } from "./createCollator.jsx";
+import { createId } from "../ssr/index.jsx";
+import { t as createLabel } from "./createLabel.jsx";
+import { createMemo, createSignal, onCleanup } from "solid-js";
+import { DateFormatter, getLocalTimeZone } from "@internationalized/date";
+//#region src/datepicker/createDateField.ts
+/**
+* createDateField hook for Solidaria
+*
+* Provides the behavior and accessibility implementation for a date field component.
+* Based on @react-aria/datepicker useDateField
+*/
+/**
+* Provides the behavior and accessibility implementation for a date field component.
+*/
+function createDateField(props, state, _ref, overlayState) {
+	const getProps = () => access(props);
+	const id = createId(getProps().id);
+	const descriptionId = createId();
+	const errorMessageId = createId();
+	const locale = useLocale();
+	const { labelProps, fieldProps: labelFieldProps } = createLabel({
+		get label() {
+			return getProps().label;
+		},
+		get "aria-label"() {
+			return getProps()["aria-label"];
+		},
+		get "aria-labelledby"() {
+			return getProps()["aria-labelledby"];
+		},
+		labelElementType: "span"
+	});
+	const getAriaDescribedBy = () => {
+		const p = getProps();
+		const ids = [];
+		if (p["aria-describedby"]) ids.push(p["aria-describedby"]);
+		if (p.description) ids.push(descriptionId);
+		if ((p.isInvalid || state.isInvalid()) && p.errorMessage) ids.push(errorMessageId);
+		return ids.length > 0 ? ids.join(" ") : void 0;
+	};
+	const segments = createMemo(() => state.segments());
+	const getLabelId = () => labelProps.id;
+	const getRoleDescription = () => {
+		return (locale().locale.toLowerCase().split("-")[0] ?? "en") === "es" ? "Campo de fecha" : "Date field";
+	};
+	const focusSegment = (target, container) => {
+		const spinbuttons = Array.from(container.querySelectorAll("[role=\"spinbutton\"]"));
+		if (spinbuttons.length === 0) return;
+		const active = document.activeElement;
+		const currentIndex = active ? spinbuttons.indexOf(active) : -1;
+		if (target === "first") {
+			spinbuttons[0]?.focus();
+			return;
+		}
+		if (target === "last") {
+			spinbuttons[spinbuttons.length - 1]?.focus();
+			return;
+		}
+		let nextIndex;
+		if (currentIndex < 0) nextIndex = target === "next" ? 0 : spinbuttons.length - 1;
+		else nextIndex = target === "next" ? currentIndex + 1 : currentIndex - 1;
+		if (nextIndex >= 0 && nextIndex < spinbuttons.length) spinbuttons[nextIndex]?.focus();
+	};
+	const fieldProps = createMemo(() => {
+		const p = getProps();
+		const baseProps = mergeProps(labelFieldProps, {
+			id,
+			role: "group",
+			"aria-disabled": p.isDisabled || state.isDisabled() || void 0,
+			"aria-readonly": p.isReadOnly || state.isReadOnly() || void 0,
+			"aria-required": p.isRequired || state.isRequired() || void 0,
+			"aria-invalid": p.isInvalid || state.isInvalid() || void 0,
+			"aria-describedby": getAriaDescribedBy()
+		});
+		if (overlayState) {
+			const existingOnKeyDown = baseProps.onKeyDown;
+			baseProps.onKeyDown = (e) => {
+				existingOnKeyDown?.(e);
+				if (e.altKey && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
+					e.preventDefault();
+					e.stopPropagation();
+					overlayState.open();
+				}
+			};
+		}
+		return baseProps;
+	});
+	const inputProps = createMemo(() => {
+		const p = getProps();
+		const labelId = getLabelId();
+		const ariaLabelledBy = labelId ? p["aria-labelledby"] ? `${labelId} ${p["aria-labelledby"]}` : labelId : p["aria-labelledby"];
+		const isDisabled = p.isDisabled || state.isDisabled();
+		const isReadOnly = p.isReadOnly || state.isReadOnly();
+		const isRequired = p.isRequired || state.isRequired();
+		const isInvalid = p.isInvalid || state.isInvalid();
+		const hasValue = state.value() != null;
+		return {
+			role: "presentation",
+			"aria-labelledby": ariaLabelledBy,
+			"aria-describedby": getAriaDescribedBy(),
+			"aria-disabled": isDisabled || void 0,
+			"aria-readonly": isReadOnly || void 0,
+			"aria-required": isRequired || void 0,
+			"aria-invalid": isInvalid || void 0,
+			"aria-roledescription": getRoleDescription(),
+			autoFocus: p.autoFocus,
+			contentEditable: true,
+			suppressContentEditableWarning: true,
+			spellCheck: false,
+			autoCorrect: "off",
+			enterKeyHint: "next",
+			inputMode: "numeric",
+			style: { caretColor: "transparent" },
+			"data-placeholder": !hasValue ? "true" : void 0,
+			onKeyDown: (e) => {
+				const target = e.target;
+				const currentTarget = e.currentTarget;
+				if (target !== currentTarget) return;
+				const rtl = locale().direction === "rtl";
+				switch (e.key) {
+					case "ArrowRight":
+						e.preventDefault();
+						focusSegment(rtl ? "prev" : "next", currentTarget);
+						break;
+					case "ArrowLeft":
+						e.preventDefault();
+						focusSegment(rtl ? "next" : "prev", currentTarget);
+						break;
+					case "Home":
+						e.preventDefault();
+						focusSegment("first", currentTarget);
+						break;
+					case "End":
+						e.preventDefault();
+						focusSegment("last", currentTarget);
+						break;
+				}
+			},
+			onFocus: () => {},
+			onBlur: () => {
+				state.confirmPlaceholder();
+			},
+			onClick: (e) => {
+				const target = e.target;
+				const currentTarget = e.currentTarget;
+				if (target !== currentTarget) return;
+				const spinbuttons = Array.from(currentTarget.querySelectorAll("[role=\"spinbutton\"]"));
+				if (spinbuttons.length > 0) spinbuttons[0].focus();
+			}
+		};
+	});
+	const descriptionProps = createMemo(() => ({ id: descriptionId }));
+	const errorMessageProps = createMemo(() => ({
+		id: errorMessageId,
+		role: "alert"
+	}));
+	return {
+		get labelProps() {
+			return labelProps;
+		},
+		get fieldProps() {
+			return fieldProps();
+		},
+		get inputProps() {
+			return inputProps();
+		},
+		get descriptionProps() {
+			return descriptionProps();
+		},
+		get errorMessageProps() {
+			return errorMessageProps();
+		},
+		get segments() {
+			return segments();
+		}
+	};
+}
+//#endregion
+//#region src/datepicker/createDateSegment.ts
+/**
+* createDateSegment hook for Solidaria
+*
+* Provides the behavior and accessibility implementation for a date segment.
+* Based on @react-aria/datepicker useDateSegment
+*/
+/**
+* Provides the behavior and accessibility implementation for a date segment.
+*/
+function createDateSegment(props, state, ref) {
+	const getProps = () => access(props);
+	const [isFocused, setIsFocused] = createSignal(false);
+	const [isFocusVisible, setIsFocusVisible] = createSignal(false);
+	const [isHovered, setIsHovered] = createSignal(false);
+	const [enteredKeys, setEnteredKeys] = createSignal("");
+	const [isComposing, setIsComposing] = createSignal(false);
+	const locale = useLocale();
+	const segment = createMemo(() => getProps().segment);
+	const isEditable = createMemo(() => {
+		return segment().isEditable && !state.isDisabled() && !state.isReadOnly();
+	});
+	let longPressTimeout = null;
+	let longPressInterval = null;
+	let hadPointerDown = false;
+	const clearLongPress = () => {
+		if (longPressTimeout) {
+			clearTimeout(longPressTimeout);
+			longPressTimeout = null;
+		}
+		if (longPressInterval) {
+			clearInterval(longPressInterval);
+			longPressInterval = null;
+		}
+	};
+	const startLongPress = (action) => {
+		clearLongPress();
+		longPressTimeout = setTimeout(() => {
+			action();
+			longPressInterval = setInterval(() => {
+				action();
+			}, 100);
+		}, 300);
+	};
+	onCleanup(() => {
+		clearLongPress();
+	});
+	const focusSegment = (target) => {
+		const el = ref?.();
+		if (!el) return;
+		const container = el.parentElement;
+		if (!container) return;
+		const segments = Array.from(container.querySelectorAll("[role=\"spinbutton\"]"));
+		if (segments.length === 0) return;
+		if (target === "first") {
+			segments[0]?.focus();
+			return;
+		}
+		if (target === "last") {
+			segments[segments.length - 1]?.focus();
+			return;
+		}
+		const currentIndex = segments.indexOf(el);
+		if (currentIndex < 0) return;
+		const nextIndex = target === "next" ? currentIndex + 1 : currentIndex - 1;
+		if (nextIndex >= 0 && nextIndex < segments.length) segments[nextIndex]?.focus();
+	};
+	const clearCurrentSegment = (type) => {
+		state.clearSegment(type);
+		setEnteredKeys("");
+	};
+	const handleKeyDown = (e) => {
+		if (!isEditable()) return;
+		if (isComposing()) return;
+		const seg = segment();
+		const type = seg.type;
+		if (type === "literal") return;
+		setIsFocusVisible(true);
+		switch (e.key) {
+			case "ArrowRight":
+				e.preventDefault();
+				focusSegment(locale().direction === "rtl" ? "prev" : "next");
+				break;
+			case "ArrowLeft":
+				e.preventDefault();
+				focusSegment(locale().direction === "rtl" ? "next" : "prev");
+				break;
+			case "ArrowUp":
+				e.preventDefault();
+				state.incrementSegment(type);
+				if (!e.repeat) startLongPress(() => state.incrementSegment(type));
+				break;
+			case "ArrowDown":
+				e.preventDefault();
+				state.decrementSegment(type);
+				if (!e.repeat) startLongPress(() => state.decrementSegment(type));
+				break;
+			case "Home":
+				e.preventDefault();
+				focusSegment("first");
+				break;
+			case "End":
+				e.preventDefault();
+				focusSegment("last");
+				break;
+			case "Backspace":
+				e.preventDefault();
+				if (seg.isPlaceholder) focusSegment("prev");
+				else clearCurrentSegment(type);
+				break;
+			case "Delete":
+				e.preventDefault();
+				clearCurrentSegment(type);
+				break;
+			default:
+				const normalizedDigit = normalizeDigit$1(e.key);
+				if (normalizedDigit) {
+					e.preventDefault();
+					handleNumericInput(normalizedDigit, type, seg);
+				}
+				break;
+		}
+	};
+	const handleKeyUp = () => {
+		clearLongPress();
+	};
+	const handleNumericInput = (key, type, seg) => {
+		const newKeys = enteredKeys() + key;
+		const numValue = parseInt(newKeys, 10);
+		const maxValue = seg.maxValue ?? 99;
+		const minValue = seg.minValue ?? 0;
+		const maxDigits = String(maxValue).length;
+		if (numValue <= maxValue) {
+			state.setSegment(type, numValue);
+			if (parseInt(newKeys + "0", 10) > maxValue || newKeys.length >= maxDigits) {
+				setEnteredKeys("");
+				focusSegment("next");
+			} else setEnteredKeys(newKeys);
+		} else {
+			const singleValue = parseInt(key, 10);
+			if (singleValue >= minValue && singleValue <= maxValue) {
+				state.setSegment(type, singleValue);
+				if (parseInt(key + "0", 10) > maxValue || key.length >= maxDigits) {
+					setEnteredKeys("");
+					focusSegment("next");
+				} else setEnteredKeys(key);
+			} else setEnteredKeys("");
+		}
+	};
+	const handleBeforeInput = (e) => {
+		if (!isEditable()) return;
+		if (isComposing()) return;
+		const seg = segment();
+		if (seg.type === "literal") return;
+		if (e.inputType === "deleteContentBackward" || e.inputType === "deleteContentForward") {
+			e.preventDefault();
+			clearCurrentSegment(seg.type);
+			return;
+		}
+		if (e.inputType === "insertText" && e.data) {
+			const normalizedDigit = normalizeDigit$1(e.data);
+			if (!normalizedDigit) return;
+			e.preventDefault();
+			handleNumericInput(normalizedDigit, seg.type, seg);
+		}
+	};
+	const handleCompositionStart = () => {
+		if (!isEditable()) return;
+		setIsComposing(true);
+		setEnteredKeys("");
+	};
+	const handleCompositionEnd = (e) => {
+		if (!isEditable()) return;
+		setIsComposing(false);
+		const seg = segment();
+		if (seg.type === "literal") return;
+		const digits = extractNormalizedDigits$1(e.data ?? "");
+		if (digits.length === 0) return;
+		for (const digit of digits) handleNumericInput(digit, seg.type, seg);
+	};
+	const handleFocus = () => {
+		setIsFocused(true);
+		setEnteredKeys("");
+		if (!hadPointerDown) setIsFocusVisible(true);
+		hadPointerDown = false;
+		const el = ref?.();
+		if (el) scrollIntoViewport(el, { containingElement: getScrollParent(el) });
+		if (el && typeof window !== "undefined") {
+			const selection = window.getSelection();
+			if (selection) {
+				const range = new Range();
+				range.selectNodeContents(el);
+				selection.removeAllRanges();
+				selection.addRange(range);
+			}
+		}
+	};
+	const handleBlur = () => {
+		setIsFocused(false);
+		setIsFocusVisible(false);
+		setEnteredKeys("");
+		clearLongPress();
+		state.confirmPlaceholder();
+	};
+	const handleMouseEnter = () => {
+		setIsHovered(true);
+	};
+	const handleMouseLeave = () => {
+		setIsHovered(false);
+	};
+	const segmentProps = createMemo(() => {
+		const seg = segment();
+		const type = seg.type;
+		const p = getProps();
+		if (type === "literal") return { "aria-hidden": true };
+		return {
+			role: "spinbutton",
+			tabIndex: isEditable() ? 0 : -1,
+			"aria-label": getSegmentLabel$1(type, locale().locale),
+			"aria-valuenow": seg.value,
+			"aria-valuemin": seg.minValue,
+			"aria-valuemax": seg.maxValue,
+			"aria-valuetext": seg.isPlaceholder ? "" : seg.text,
+			"aria-readonly": state.isReadOnly() || void 0,
+			"aria-disabled": state.isDisabled() || void 0,
+			"aria-invalid": state.isInvalid() || void 0,
+			"aria-controls": p["aria-controls"] || void 0,
+			"aria-describedby": p["aria-describedby"] || void 0,
+			contentEditable: isEditable(),
+			suppressContentEditableWarning: true,
+			inputMode: "numeric",
+			autoCorrect: "off",
+			enterKeyHint: "next",
+			spellCheck: false,
+			"data-placeholder": seg.isPlaceholder ? "true" : void 0,
+			"data-readonly": state.isReadOnly() || void 0,
+			"data-disabled": state.isDisabled() || void 0,
+			"data-invalid": state.isInvalid() || void 0,
+			"data-type": seg.type,
+			"data-hovered": isHovered() || void 0,
+			"data-focused": isFocused() || void 0,
+			"data-focus-visible": isFocusVisible() || void 0,
+			onKeyDown: handleKeyDown,
+			onKeyUp: handleKeyUp,
+			onFocus: handleFocus,
+			onBlur: handleBlur,
+			onBeforeInput: handleBeforeInput,
+			onCompositionStart: handleCompositionStart,
+			onCompositionEnd: handleCompositionEnd,
+			onMouseEnter: handleMouseEnter,
+			onMouseLeave: handleMouseLeave,
+			onPointerDown: (e) => {
+				e.preventDefault();
+				hadPointerDown = true;
+				setIsFocusVisible(false);
+			},
+			onPointerUp: () => {
+				clearLongPress();
+			}
+		};
+	});
+	const text = createMemo(() => {
+		const seg = segment();
+		return seg.isPlaceholder ? seg.placeholder : seg.text;
+	});
+	return {
+		get segmentProps() {
+			return segmentProps();
+		},
+		get isFocused() {
+			return isFocused();
+		},
+		get isEditable() {
+			return isEditable();
+		},
+		get isPlaceholder() {
+			return segment().isPlaceholder;
+		},
+		get text() {
+			return text();
+		},
+		get isHovered() {
+			return isHovered();
+		},
+		get isFocusVisible() {
+			return isFocusVisible();
+		}
+	};
+}
+const SEGMENT_LABELS$1 = {
+	en: {
+		year: "Year",
+		month: "Month",
+		day: "Day",
+		hour: "Hour",
+		minute: "Minute",
+		second: "Second",
+		dayPeriod: "AM/PM",
+		era: "Era",
+		timeZoneName: "Time zone"
+	},
+	es: {
+		year: "Año",
+		month: "Mes",
+		day: "Día",
+		hour: "Hora",
+		minute: "Minuto",
+		second: "Segundo",
+		dayPeriod: "AM/PM",
+		era: "Era",
+		timeZoneName: "Zona horaria"
+	}
+};
+function getSegmentLabel$1(type, locale) {
+	if (type === "literal") return "";
+	return (SEGMENT_LABELS$1[locale.toLowerCase().split("-")[0] ?? "en"] ?? SEGMENT_LABELS$1.en)[type];
+}
+function normalizeDigit$1(input) {
+	if (/^[0-9]$/.test(input)) return input;
+	const codePoint = input.codePointAt(0);
+	if (codePoint == null) return null;
+	if (codePoint >= 65296 && codePoint <= 65305) return String(codePoint - 65296);
+	return null;
+}
+function extractNormalizedDigits$1(value) {
+	const digits = [];
+	for (const char of value) {
+		const normalized = normalizeDigit$1(char);
+		if (normalized) digits.push(normalized);
+	}
+	return digits;
+}
+//#endregion
+//#region src/datepicker/createTimeField.ts
+/**
+* createTimeField hook for Solidaria
+*
+* Provides the behavior and accessibility implementation for a time field component.
+* Based on @react-aria/datepicker useTimeField
+*/
+/**
+* Provides the behavior and accessibility implementation for a time field component.
+*/
+function createTimeField(props, state, _ref) {
+	const getProps = () => access(props);
+	const id = createId(getProps().id);
+	const descriptionId = createId();
+	const errorMessageId = createId();
+	const { labelProps, fieldProps: labelFieldProps } = createLabel({
+		get label() {
+			return getProps().label;
+		},
+		get "aria-label"() {
+			return getProps()["aria-label"];
+		},
+		get "aria-labelledby"() {
+			return getProps()["aria-labelledby"];
+		},
+		labelElementType: "span"
+	});
+	const getAriaDescribedBy = () => {
+		const p = getProps();
+		const ids = [];
+		if (p["aria-describedby"]) ids.push(p["aria-describedby"]);
+		if (p.description) ids.push(descriptionId);
+		if ((p.isInvalid || state.isInvalid()) && p.errorMessage) ids.push(errorMessageId);
+		return ids.length > 0 ? ids.join(" ") : void 0;
+	};
+	const segments = createMemo(() => state.segments());
+	const fieldProps = createMemo(() => {
+		const p = getProps();
+		return mergeProps(labelFieldProps, {
+			id,
+			role: "group",
+			"aria-disabled": p.isDisabled || state.isDisabled() || void 0,
+			"aria-readonly": p.isReadOnly || state.isReadOnly() || void 0,
+			"aria-required": p.isRequired || state.isRequired() || void 0,
+			"aria-invalid": p.isInvalid || state.isInvalid() || void 0,
+			"aria-describedby": getAriaDescribedBy()
+		});
+	});
+	const inputProps = createMemo(() => ({ role: "presentation" }));
+	const descriptionProps = createMemo(() => ({ id: descriptionId }));
+	const errorMessageProps = createMemo(() => ({
+		id: errorMessageId,
+		role: "alert"
+	}));
+	return {
+		get labelProps() {
+			return labelProps;
+		},
+		get fieldProps() {
+			return fieldProps();
+		},
+		get inputProps() {
+			return inputProps();
+		},
+		get descriptionProps() {
+			return descriptionProps();
+		},
+		get errorMessageProps() {
+			return errorMessageProps();
+		},
+		get segments() {
+			return segments();
+		}
+	};
+}
+//#endregion
+//#region src/datepicker/createTimeSegment.ts
+/**
+* createTimeSegment hook for Solidaria
+*
+* Provides the behavior and accessibility implementation for a time segment.
+* Based on @react-aria/datepicker useDateSegment semantics (time-field scope).
+*/
+/**
+* Provides the behavior and accessibility implementation for a time segment.
+*/
+function createTimeSegment(props, state, ref) {
+	const getProps = () => access(props);
+	const [isFocused, setIsFocused] = createSignal(false);
+	const [enteredKeys, setEnteredKeys] = createSignal("");
+	const [isComposing, setIsComposing] = createSignal(false);
+	const locale = useLocale();
+	const segment = createMemo(() => getProps().segment);
+	const isEditable = createMemo(() => {
+		return segment().isEditable && !state.isDisabled() && !state.isReadOnly();
+	});
+	const focusSegment = (target) => {
+		const el = ref?.();
+		if (!el) return;
+		const container = el.parentElement;
+		if (!container) return;
+		const segments = Array.from(container.querySelectorAll("[role=\"spinbutton\"]"));
+		if (segments.length === 0) return;
+		if (target === "first") {
+			segments[0]?.focus();
+			return;
+		}
+		if (target === "last") {
+			segments[segments.length - 1]?.focus();
+			return;
+		}
+		const currentIndex = segments.indexOf(el);
+		if (currentIndex < 0) return;
+		const nextIndex = target === "next" ? currentIndex + 1 : currentIndex - 1;
+		if (nextIndex >= 0 && nextIndex < segments.length) segments[nextIndex]?.focus();
+	};
+	const clearCurrentSegment = (type) => {
+		state.clearSegment(type);
+		setEnteredKeys("");
+	};
+	const handleNumericInput = (key, type, seg) => {
+		const newKeys = enteredKeys() + key;
+		const numValue = parseInt(newKeys, 10);
+		const maxValue = seg.maxValue ?? 99;
+		const minValue = seg.minValue ?? 0;
+		const maxDigits = String(maxValue).length;
+		if (numValue <= maxValue) {
+			state.setSegment(type, numValue);
+			if (parseInt(newKeys + "0", 10) > maxValue || newKeys.length >= maxDigits) {
+				setEnteredKeys("");
+				focusSegment("next");
+			} else setEnteredKeys(newKeys);
+		} else {
+			const singleValue = parseInt(key, 10);
+			if (singleValue >= minValue && singleValue <= maxValue) {
+				state.setSegment(type, singleValue);
+				if (parseInt(key + "0", 10) > maxValue || key.length >= maxDigits) {
+					setEnteredKeys("");
+					focusSegment("next");
+				} else setEnteredKeys(key);
+			} else setEnteredKeys("");
+		}
+	};
+	const handleKeyDown = (e) => {
+		if (!isEditable()) return;
+		if (isComposing()) return;
+		const seg = segment();
+		const type = seg.type;
+		if (type === "literal") return;
+		switch (e.key) {
+			case "ArrowRight":
+				e.preventDefault();
+				focusSegment(locale().direction === "rtl" ? "prev" : "next");
+				break;
+			case "ArrowLeft":
+				e.preventDefault();
+				focusSegment(locale().direction === "rtl" ? "next" : "prev");
+				break;
+			case "ArrowUp":
+				e.preventDefault();
+				state.incrementSegment(type);
+				break;
+			case "ArrowDown":
+				e.preventDefault();
+				state.decrementSegment(type);
+				break;
+			case "Home":
+				e.preventDefault();
+				focusSegment("first");
+				break;
+			case "End":
+				e.preventDefault();
+				focusSegment("last");
+				break;
+			case "Backspace":
+				e.preventDefault();
+				if (seg.isPlaceholder) focusSegment("prev");
+				else clearCurrentSegment(type);
+				break;
+			case "Delete":
+				e.preventDefault();
+				clearCurrentSegment(type);
+				break;
+			default:
+				const normalizedDigit = normalizeDigit(e.key);
+				if (normalizedDigit) {
+					e.preventDefault();
+					handleNumericInput(normalizedDigit, type, seg);
+				}
+				break;
+		}
+	};
+	const handleBeforeInput = (e) => {
+		if (!isEditable()) return;
+		if (isComposing()) return;
+		const seg = segment();
+		if (seg.type === "literal") return;
+		if (e.inputType === "deleteContentBackward" || e.inputType === "deleteContentForward") {
+			e.preventDefault();
+			clearCurrentSegment(seg.type);
+			return;
+		}
+		if (e.inputType === "insertText" && e.data) {
+			const normalizedDigit = normalizeDigit(e.data);
+			if (!normalizedDigit) return;
+			e.preventDefault();
+			handleNumericInput(normalizedDigit, seg.type, seg);
+		}
+	};
+	const handleCompositionStart = () => {
+		if (!isEditable()) return;
+		setIsComposing(true);
+		setEnteredKeys("");
+	};
+	const handleCompositionEnd = (e) => {
+		if (!isEditable()) return;
+		setIsComposing(false);
+		const seg = segment();
+		if (seg.type === "literal") return;
+		const digits = extractNormalizedDigits(e.data ?? "");
+		if (digits.length === 0) return;
+		for (const digit of digits) handleNumericInput(digit, seg.type, seg);
+	};
+	const handleFocus = () => {
+		setIsFocused(true);
+		setEnteredKeys("");
+	};
+	const handleBlur = () => {
+		setIsFocused(false);
+		setEnteredKeys("");
+		state.confirmPlaceholder?.();
+	};
+	const segmentProps = createMemo(() => {
+		const seg = segment();
+		const type = seg.type;
+		if (type === "literal") return { "aria-hidden": true };
+		return {
+			role: "spinbutton",
+			tabIndex: isEditable() ? 0 : -1,
+			"aria-label": getSegmentLabel(type, locale().locale),
+			"aria-valuenow": seg.value,
+			"aria-valuemin": seg.minValue,
+			"aria-valuemax": seg.maxValue,
+			"aria-valuetext": seg.isPlaceholder ? seg.placeholder : seg.text,
+			"aria-readonly": state.isReadOnly() || void 0,
+			"aria-disabled": state.isDisabled() || void 0,
+			"aria-invalid": state.isInvalid() || void 0,
+			contentEditable: isEditable(),
+			suppressContentEditableWarning: true,
+			inputMode: "numeric",
+			autoCorrect: "off",
+			enterKeyHint: "next",
+			spellCheck: false,
+			onKeyDown: handleKeyDown,
+			onFocus: handleFocus,
+			onBlur: handleBlur,
+			onBeforeInput: handleBeforeInput,
+			onCompositionStart: handleCompositionStart,
+			onCompositionEnd: handleCompositionEnd,
+			onMouseDown: (e) => {
+				e.preventDefault();
+			}
+		};
+	});
+	const text = createMemo(() => {
+		const seg = segment();
+		return seg.isPlaceholder ? seg.placeholder : seg.text;
+	});
+	return {
+		get segmentProps() {
+			return segmentProps();
+		},
+		get isFocused() {
+			return isFocused();
+		},
+		get isEditable() {
+			return isEditable();
+		},
+		get isPlaceholder() {
+			return segment().isPlaceholder;
+		},
+		get text() {
+			return text();
+		}
+	};
+}
+const SEGMENT_LABELS = {
+	en: {
+		hour: "Hour",
+		minute: "Minute",
+		second: "Second",
+		dayPeriod: "AM/PM"
+	},
+	es: {
+		hour: "Hora",
+		minute: "Minuto",
+		second: "Segundo",
+		dayPeriod: "AM/PM"
+	}
+};
+function getSegmentLabel(type, locale) {
+	if (type === "literal") return "";
+	return (SEGMENT_LABELS[locale.toLowerCase().split("-")[0] ?? "en"] ?? SEGMENT_LABELS.en)[type];
+}
+function normalizeDigit(input) {
+	if (/^[0-9]$/.test(input)) return input;
+	const code = input.codePointAt(0);
+	if (code === void 0) return null;
+	if (code >= 1632 && code <= 1641) return String(code - 1632);
+	if (code >= 1776 && code <= 1785) return String(code - 1776);
+	if (code >= 65296 && code <= 65305) return String(code - 65296);
+	return null;
+}
+function extractNormalizedDigits(input) {
+	const digits = [];
+	for (const char of input) {
+		const normalized = normalizeDigit(char);
+		if (normalized) digits.push(normalized);
+	}
+	return digits;
+}
+//#endregion
+//#region src/datepicker/createDatePicker.ts
+/**
+* createDatePicker hook for Solidaria
+*
+* Provides the behavior and accessibility implementation for a date picker component.
+* Based on @react-aria/datepicker useDatePicker
+*/
+/**
+* Provides the behavior and accessibility implementation for a date picker component.
+*/
+function createDatePicker(props, state, overlayState, _calendarState) {
+	const locale = useLocale();
+	const getProps = () => access(props);
+	const id = createId(getProps().id);
+	const descriptionId = createId();
+	const errorMessageId = createId();
+	const dialogId = createId();
+	const buttonId = createId();
+	const fieldId = createId();
+	const { labelProps, fieldProps: labelFieldProps } = createLabel({
+		get label() {
+			return getProps().label;
+		},
+		get "aria-label"() {
+			return getProps()["aria-label"];
+		},
+		get "aria-labelledby"() {
+			return getProps()["aria-labelledby"];
+		},
+		labelElementType: "span"
+	});
+	const getAriaDescribedBy = () => {
+		const p = getProps();
+		const ids = [];
+		if (p["aria-describedby"]) ids.push(p["aria-describedby"]);
+		if (valueDescription()) ids.push(valueDescriptionId);
+		if (p.description) ids.push(descriptionId);
+		if ((p.isInvalid || state.isInvalid()) && p.errorMessage) ids.push(errorMessageId);
+		return ids.length > 0 ? ids.join(" ") : void 0;
+	};
+	const valueDescriptionId = createId();
+	const valueDescription = createMemo(() => {
+		const v = state.value?.();
+		if (!v) return "";
+		return new DateFormatter(locale().locale, {
+			year: "numeric",
+			month: "long",
+			day: "numeric"
+		}).format(v.toDate(getLocalTimeZone()));
+	});
+	const groupProps = createMemo(() => {
+		const p = getProps();
+		const isInvalid = p.isInvalid || state.isInvalid();
+		const describedBy = getAriaDescribedBy();
+		const labelField = labelFieldProps;
+		return {
+			id,
+			role: "group",
+			"aria-label": labelField["aria-label"] || void 0,
+			"aria-labelledby": labelField["aria-labelledby"] || void 0,
+			"aria-disabled": p.isDisabled || state.isDisabled() || void 0,
+			"aria-readonly": p.isReadOnly || state.isReadOnly() || void 0,
+			"aria-required": p.isRequired || state.isRequired() || void 0,
+			"aria-invalid": isInvalid || void 0,
+			"aria-describedby": describedBy
+		};
+	});
+	const fieldProps = createMemo(() => {
+		const p = getProps();
+		return {
+			id: fieldId,
+			"aria-describedby": getAriaDescribedBy(),
+			value: state.value?.(),
+			defaultValue: state.defaultValue,
+			onChange: (value) => {
+				state.setValue?.(value);
+			},
+			placeholderValue: p.placeholderValue,
+			hideTimeZone: p.hideTimeZone,
+			hourCycle: p.hourCycle,
+			shouldForceLeadingZeros: p.shouldForceLeadingZeros,
+			granularity: p.granularity,
+			isDisabled: p.isDisabled || state.isDisabled(),
+			isReadOnly: p.isReadOnly || state.isReadOnly(),
+			isRequired: p.isRequired || state.isRequired(),
+			autoFocus: p.autoFocus,
+			name: p.name,
+			form: p.form
+		};
+	});
+	const buttonPress = createPress({
+		get isDisabled() {
+			return getProps().isDisabled || state.isDisabled();
+		},
+		onPress: () => {
+			overlayState.open();
+		}
+	});
+	const buttonProps = createMemo(() => {
+		const p = getProps();
+		const isDisabled = p.isDisabled || state.isDisabled();
+		const defaults = getDatePickerLabelDefaults(locale().locale);
+		const labelId = labelProps["id"];
+		const labelledBy = labelId ? `${buttonId} ${labelId}` : buttonId;
+		const describedBy = getAriaDescribedBy();
+		return mergeProps(buttonPress.pressProps, {
+			id: buttonId,
+			type: "button",
+			"aria-label": p.buttonAriaLabel ?? defaults.button,
+			"aria-labelledby": labelledBy,
+			"aria-haspopup": "dialog",
+			"aria-expanded": overlayState.isOpen,
+			"aria-controls": overlayState.isOpen ? dialogId : void 0,
+			"aria-describedby": describedBy,
+			"aria-disabled": isDisabled || void 0,
+			tabIndex: 0
+		});
+	});
+	const dialogProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDatePickerLabelDefaults(locale().locale);
+		const labelId = labelProps["id"];
+		return {
+			id: dialogId,
+			role: "dialog",
+			"aria-modal": true,
+			"aria-labelledby": labelId ? `${buttonId} ${labelId}` : buttonId,
+			"aria-label": p.dialogAriaLabel ?? defaults.dialog
+		};
+	});
+	const calendarProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDatePickerLabelDefaults(locale().locale);
+		const currentValue = state.value?.();
+		return {
+			autoFocus: true,
+			value: currentValue,
+			onChange: (value) => {
+				if (state.setValue) state.setValue(value);
+			},
+			minValue: p.minValue,
+			maxValue: p.maxValue,
+			isDisabled: p.isDisabled || state.isDisabled(),
+			isReadOnly: p.isReadOnly || state.isReadOnly(),
+			isDateUnavailable: p.isDateUnavailable,
+			defaultFocusedValue: currentValue ? void 0 : p.placeholderValue,
+			isInvalid: p.isInvalid || state.isInvalid(),
+			errorMessage: typeof p.errorMessage === "string" ? p.errorMessage : state.isInvalid() ? "Invalid date" : void 0,
+			firstDayOfWeek: p.firstDayOfWeek,
+			pageBehavior: p.pageBehavior,
+			"aria-label": p.calendarAriaLabel ?? p.dialogAriaLabel ?? defaults.calendar
+		};
+	});
+	const descriptionProps = createMemo(() => ({ id: descriptionId }));
+	createMemo(() => ({
+		id: valueDescriptionId,
+		"aria-hidden": true
+	}));
+	const errorMessageProps = createMemo(() => ({
+		id: errorMessageId,
+		role: "alert"
+	}));
+	let focusFirstSegment;
+	let focusLastSegment;
+	const enhancedLabelProps = createMemo(() => {
+		return {
+			...labelProps,
+			onClick: () => {
+				focusFirstSegment?.();
+			}
+		};
+	});
+	const isInvalid = createMemo(() => {
+		return getProps().isInvalid || state.isInvalid();
+	});
+	const validationErrors = createMemo(() => {
+		const p = getProps();
+		if (p.isInvalid && typeof p.errorMessage === "string") return [p.errorMessage];
+		return [];
+	});
+	const validationDetails = createMemo(() => {
+		const p = getProps();
+		return {
+			minValue: p.minValue,
+			maxValue: p.maxValue,
+			isDateUnavailable: p.isDateUnavailable,
+			isInvalid: isInvalid()
+		};
+	});
+	return {
+		get groupProps() {
+			return groupProps();
+		},
+		get labelProps() {
+			return enhancedLabelProps();
+		},
+		get fieldProps() {
+			return fieldProps();
+		},
+		get buttonProps() {
+			return buttonProps();
+		},
+		get dialogProps() {
+			return dialogProps();
+		},
+		get calendarProps() {
+			return calendarProps();
+		},
+		get descriptionProps() {
+			return descriptionProps();
+		},
+		get errorMessageProps() {
+			return errorMessageProps();
+		},
+		get isInvalid() {
+			return isInvalid();
+		},
+		get validationErrors() {
+			return validationErrors();
+		},
+		get validationDetails() {
+			return validationDetails();
+		},
+		focusManager: {
+			focusFirst: () => focusFirstSegment?.(),
+			focusLast: () => focusLastSegment?.(),
+			/** @internal Wires the actual focus implementations from the component layer */
+			_register: (first, last) => {
+				focusFirstSegment = first;
+				focusLastSegment = last;
+			}
+		}
+	};
+}
+function getDatePickerLabelDefaults(locale) {
+	if ((locale.toLowerCase().split("-")[0] ?? "en") === "es") return {
+		button: "Abrir calendario",
+		dialog: "Calendario",
+		calendar: "Calendario"
+	};
+	return {
+		button: "Open calendar",
+		dialog: "Calendar",
+		calendar: "Calendar"
+	};
+}
+//#endregion
+//#region src/datepicker/createDatePickerGroup.ts
+/**
+* createDatePickerGroup hook for Solidaria
+*
+* Provides keyboard and pointer behavior for the date picker field group.
+* Based on @react-aria/datepicker useDatePickerGroup
+*/
+function createDatePickerGroup(props, state, ref, disableArrowNavigation) {
+	const locale = useLocale();
+	const resolvedProps = createMemo(() => access(props));
+	const onKeyDown = (e) => {
+		if (!nodeContains(e.currentTarget, getEventTarget(e))) return;
+		if (e.altKey && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
+			e.preventDefault();
+			e.stopPropagation();
+			state.setOpen(true);
+			return;
+		}
+		if (disableArrowNavigation) return;
+		const root = ref();
+		if (!root) return;
+		const segments = Array.from(root.querySelectorAll("[role=\"spinbutton\"]"));
+		if (segments.length === 0) return;
+		const activeElement = root.ownerDocument.activeElement;
+		let currentIndex = -1;
+		if (activeElement) currentIndex = segments.indexOf(activeElement);
+		const direction = locale().direction;
+		switch (e.key) {
+			case "ArrowLeft":
+				e.preventDefault();
+				e.stopPropagation();
+				if (direction === "rtl") {
+					const nextIndex = currentIndex >= 0 ? currentIndex + 1 : 0;
+					if (nextIndex < segments.length) focusSafely(segments[nextIndex]);
+				} else {
+					const prevIndex = currentIndex >= 0 ? currentIndex - 1 : segments.length - 1;
+					if (prevIndex >= 0) focusSafely(segments[prevIndex]);
+				}
+				break;
+			case "ArrowRight":
+				e.preventDefault();
+				e.stopPropagation();
+				if (direction === "rtl") {
+					const prevIndex = currentIndex >= 0 ? currentIndex - 1 : segments.length - 1;
+					if (prevIndex >= 0) focusSafely(segments[prevIndex]);
+				} else {
+					const nextIndex = currentIndex >= 0 ? currentIndex + 1 : 0;
+					if (nextIndex < segments.length) focusSafely(segments[nextIndex]);
+				}
+				break;
+		}
+	};
+	const focusLast = (event) => {
+		const root = ref();
+		if (!root) return;
+		const target = event ? getEventTarget(event) : null;
+		const segments = Array.from(root.querySelectorAll("[role=\"spinbutton\"]"));
+		if (segments.length === 0) return;
+		let startIndex = segments.length - 1;
+		if (target) {
+			const targetIndex = segments.indexOf(target);
+			if (targetIndex >= 0) startIndex = targetIndex;
+		}
+		for (let i = startIndex; i >= 0; i--) {
+			const segment = segments[i];
+			if (segment.getAttribute("data-placeholder") !== "true") {
+				focusSafely(segment);
+				return;
+			}
+		}
+	};
+	const { pressProps } = createPress({
+		isDisabled: () => resolvedProps().isDisabled || state.isDisabled(),
+		preventFocusOnPress: true,
+		allowTextSelectionOnPress: true,
+		onPressStart(e) {
+			if (e.pointerType === "mouse") focusLast(e);
+		},
+		onPress(e) {
+			if (e.pointerType === "touch" || e.pointerType === "pen") focusLast(e);
+		}
+	});
+	return { get groupProps() {
+		return mergeProps(pressProps, { onKeyDown });
+	} };
+}
+//#endregion
+//#region src/datepicker/createDateRangePicker.ts
+/**
+* createDateRangePicker hook for Solidaria
+*
+* Provides behavior and accessibility wiring for range date pickers.
+* Compatibility target: @react-aria/datepicker useDateRangePicker.
+*/
+function createDateRangePicker(props, state, overlayState) {
+	const locale = useLocale();
+	const getProps = () => access(props);
+	const id = createId(getProps().id);
+	const startFieldId = createId();
+	const endFieldId = createId();
+	const descriptionId = createId();
+	const errorMessageId = createId();
+	const dialogId = createId();
+	const { labelProps, fieldProps: labelFieldProps } = createLabel({
+		get label() {
+			return getProps().label;
+		},
+		get "aria-label"() {
+			return getProps()["aria-label"];
+		},
+		get "aria-labelledby"() {
+			return getProps()["aria-labelledby"];
+		},
+		labelElementType: "span"
+	});
+	const getAriaDescribedBy = () => {
+		const p = getProps();
+		const ids = [];
+		if (p["aria-describedby"]) ids.push(p["aria-describedby"]);
+		if (p.description) ids.push(descriptionId);
+		if (p.isInvalid && p.errorMessage) ids.push(errorMessageId);
+		return ids.length > 0 ? ids.join(" ") : void 0;
+	};
+	const groupProps = createMemo(() => {
+		const p = getProps();
+		const isInvalid = p.isInvalid;
+		return mergeProps(labelFieldProps, {
+			id,
+			role: "group",
+			"aria-disabled": p.isDisabled || state.isDisabled() || void 0,
+			"aria-readonly": p.isReadOnly || state.isReadOnly() || void 0,
+			"aria-required": p.isRequired || void 0,
+			"aria-invalid": isInvalid || void 0,
+			"aria-describedby": getAriaDescribedBy()
+		});
+	});
+	const startFieldProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		const isDisabled = p.isDisabled || state.isDisabled();
+		const isReadOnly = p.isReadOnly || state.isReadOnly();
+		const isInvalid = p.isInvalid;
+		return {
+			id: startFieldId,
+			"aria-label": p.startFieldAriaLabel ?? defaults.startField,
+			"aria-describedby": getAriaDescribedBy(),
+			"aria-disabled": isDisabled || void 0,
+			"aria-readonly": isReadOnly || void 0,
+			"aria-invalid": isInvalid || void 0,
+			tabIndex: isDisabled ? -1 : 0,
+			onClick: () => {
+				if (!isDisabled) overlayState.open();
+			},
+			onKeyDown: (event) => {
+				if (isDisabled) return;
+				if (event.key === "Enter" || event.key === " " || event.key === "ArrowDown") {
+					event.preventDefault();
+					overlayState.open();
+				}
+			}
+		};
+	});
+	const endFieldProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		const isDisabled = p.isDisabled || state.isDisabled();
+		const isReadOnly = p.isReadOnly || state.isReadOnly();
+		const isInvalid = p.isInvalid;
+		return {
+			id: endFieldId,
+			"aria-label": p.endFieldAriaLabel ?? defaults.endField,
+			"aria-describedby": getAriaDescribedBy(),
+			"aria-disabled": isDisabled || void 0,
+			"aria-readonly": isReadOnly || void 0,
+			"aria-invalid": isInvalid || void 0,
+			tabIndex: isDisabled ? -1 : 0,
+			onClick: () => {
+				if (!isDisabled) overlayState.open();
+			},
+			onKeyDown: (event) => {
+				if (isDisabled) return;
+				if (event.key === "Enter" || event.key === " " || event.key === "ArrowDown") {
+					event.preventDefault();
+					overlayState.open();
+				}
+			}
+		};
+	});
+	const startInputProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		const isDisabled = p.isDisabled || state.isDisabled();
+		const isReadOnly = p.isReadOnly || state.isReadOnly();
+		const isInvalid = p.isInvalid;
+		return {
+			id: startFieldId,
+			"aria-label": p.startFieldAriaLabel ?? defaults.startField,
+			"aria-describedby": getAriaDescribedBy(),
+			"aria-disabled": isDisabled || void 0,
+			"aria-readonly": isReadOnly || void 0,
+			"aria-invalid": isInvalid || void 0
+		};
+	});
+	const endInputProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		const isDisabled = p.isDisabled || state.isDisabled();
+		const isReadOnly = p.isReadOnly || state.isReadOnly();
+		const isInvalid = p.isInvalid;
+		return {
+			id: endFieldId,
+			"aria-label": p.endFieldAriaLabel ?? defaults.endField,
+			"aria-describedby": getAriaDescribedBy(),
+			"aria-disabled": isDisabled || void 0,
+			"aria-readonly": isReadOnly || void 0,
+			"aria-invalid": isInvalid || void 0
+		};
+	});
+	const buttonProps = createMemo(() => {
+		const p = getProps();
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		const isDisabled = p.isDisabled || state.isDisabled();
+		return {
+			"aria-label": p.buttonAriaLabel ?? defaults.button,
+			"aria-haspopup": "dialog",
+			"aria-expanded": overlayState.isOpen,
+			"aria-controls": overlayState.isOpen ? dialogId : void 0,
+			disabled: isDisabled,
+			tabIndex: 0,
+			onClick: () => {
+				if (!isDisabled) overlayState.toggle();
+			}
+		};
+	});
+	const dialogProps = createMemo(() => {
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		return {
+			id: dialogId,
+			role: "dialog",
+			"aria-modal": true,
+			"aria-label": getProps().dialogAriaLabel ?? defaults.dialog
+		};
+	});
+	const calendarProps = createMemo(() => {
+		const defaults = getDateRangePickerLabelDefaults(locale().locale);
+		return { "aria-label": getProps().calendarAriaLabel ?? getProps().dialogAriaLabel ?? defaults.calendar };
+	});
+	const descriptionProps = createMemo(() => ({ id: descriptionId }));
+	const errorMessageProps = createMemo(() => ({
+		id: errorMessageId,
+		role: "alert"
+	}));
+	return {
+		get groupProps() {
+			return groupProps();
+		},
+		get labelProps() {
+			return labelProps;
+		},
+		get startFieldProps() {
+			return startFieldProps();
+		},
+		get endFieldProps() {
+			return endFieldProps();
+		},
+		get startInputProps() {
+			return startInputProps();
+		},
+		get endInputProps() {
+			return endInputProps();
+		},
+		get buttonProps() {
+			return buttonProps();
+		},
+		get dialogProps() {
+			return dialogProps();
+		},
+		get calendarProps() {
+			return calendarProps();
+		},
+		get descriptionProps() {
+			return descriptionProps();
+		},
+		get errorMessageProps() {
+			return errorMessageProps();
+		}
+	};
+}
+function getDateRangePickerLabelDefaults(locale) {
+	if ((locale.toLowerCase().split("-")[0] ?? "en") === "es") return {
+		button: "Abrir calendario de rango",
+		dialog: "Calendario de rango",
+		calendar: "Calendario de rango",
+		startField: "Fecha de inicio",
+		endField: "Fecha de fin"
+	};
+	return {
+		button: "Open range calendar",
+		dialog: "Range calendar",
+		calendar: "Range calendar",
+		startField: "Start date",
+		endField: "End date"
+	};
+}
+//#endregion
+export { createTimeField as a, createTimeSegment as i, createDatePickerGroup as n, createDateSegment as o, createDatePicker as r, createDateField as s, createDateRangePicker as t };
+
+//# sourceMappingURL=datepicker.jsx.map