@puzzle-ui/ui 0.0.0-stage → 0.2.0

package/dist/components/forms/date-picker/date-picker.utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.utils.cjs","names":["IntlWithLocale"],"sources":["../../../../src/components/forms/date-picker/date-picker.utils.ts"],"sourcesContent":["type CalendarDay = {\n  date: Date;\n  key: string;\n  outsideMonth: boolean;\n};\n\ntype Weekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\nconst isValidDate = (date: Date): boolean =>\n  date instanceof Date && Number.isFinite(date.getTime());\n\nconst startOfDay = (date: Date): Date =>\n  new Date(date.getFullYear(), date.getMonth(), date.getDate());\n\nconst startOfMonth = (date: Date): Date =>\n  new Date(date.getFullYear(), date.getMonth(), 1);\n\nconst addDays = (date: Date, amount: number): Date =>\n  new Date(date.getFullYear(), date.getMonth(), date.getDate() + amount);\n\nconst addMonths = (date: Date, amount: number): Date => {\n  const day = date.getDate();\n  const target = new Date(date.getFullYear(), date.getMonth() + amount, 1);\n\n  const lastDay = new Date(\n    target.getFullYear(),\n    target.getMonth() + 1,\n    0,\n  ).getDate();\n\n  return new Date(\n    target.getFullYear(),\n    target.getMonth(),\n    Math.min(day, lastDay),\n  );\n};\n\nconst addYears = (date: Date, amount: number): Date =>\n  addMonths(date, amount * 12);\n\nconst toDateKey = (date: Date): string => {\n  const year = String(date.getFullYear()).padStart(4, \"0\");\n  const month = String(date.getMonth() + 1).padStart(2, \"0\");\n  const day = String(date.getDate()).padStart(2, \"0\");\n\n  return `${year}-${month}-${day}`;\n};\n\nconst isSameDay = (first: Date, second: Date): boolean =>\n  first.getFullYear() === second.getFullYear() &&\n  first.getMonth() === second.getMonth() &&\n  first.getDate() === second.getDate();\n\nconst isSameMonth = (first: Date, second: Date): boolean =>\n  first.getFullYear() === second.getFullYear() &&\n  first.getMonth() === second.getMonth();\n\nconst getCalendarDays = (month: Date, weekStartsOn: Weekday): CalendarDay[] => {\n  const firstDay = startOfMonth(month);\n  const offset = (firstDay.getDay() - weekStartsOn + 7) % 7;\n\n  const calendarStart = addDays(firstDay, -offset);\n\n  return Array.from({ length: 42 }, (_, index) => {\n    const date = addDays(calendarStart, index);\n\n    return {\n      date,\n      key: toDateKey(date),\n      outsideMonth: !isSameMonth(date, month),\n    };\n  });\n};\n\nconst getLastDayOfMonth = (date: Date): Date =>\n  new Date(date.getFullYear(), date.getMonth() + 1, 0);\n\nconst sundayRegions = [\n  \"US\",\n  \"CA\",\n  \"JP\",\n  \"KR\",\n  \"TW\",\n  \"TH\",\n  \"PH\",\n  \"BR\",\n  \"CO\",\n  \"MX\",\n] as const;\n\nconst getLocaleWeekStartsOn = (locale: string): Weekday => {\n  try {\n    type LocaleWeekInfo = {\n      weekInfo?: { firstDay: number };\n      getWeekInfo?: () => { firstDay: number };\n    };\n\n    type LocaleConstructor = new (locale: string) => LocaleWeekInfo;\n\n    const IntlWithLocale = Intl as unknown as {\n      Locale?: LocaleConstructor;\n    };\n\n    const Locale = IntlWithLocale.Locale;\n\n    if (Locale) {\n      const localeInfo = new Locale(locale);\n      const firstDay =\n        localeInfo.getWeekInfo?.().firstDay ?? localeInfo.weekInfo?.firstDay;\n\n      if (firstDay !== undefined) {\n        return (firstDay % 7) as Weekday;\n      }\n    }\n  } catch {\n    const region = locale.split(\"-\").find((part) => /^[A-Z]{2}$/.test(part));\n    return (\n      region && sundayRegions.includes(region as (typeof sundayRegions)[number])\n        ? 0\n        : 1\n    ) as Weekday;\n  }\n\n  // Fall back to Sunday when locale week information is unavailable.\n  return 0;\n};\n\nconst getWeekdayDates = (weekStartsOn: Weekday): Date[] => {\n  // January 7, 2024 was a Sunday.\n  const sunday = new Date(2024, 0, 7);\n\n  return Array.from({ length: 7 }, (_, index) =>\n    addDays(sunday, weekStartsOn + index),\n  );\n};\n\nexport {\n  addDays,\n  addMonths,\n  addYears,\n  getCalendarDays,\n  getLastDayOfMonth,\n  getLocaleWeekStartsOn,\n  getWeekdayDates,\n  isSameDay,\n  isSameMonth,\n  isValidDate,\n  startOfDay,\n  startOfMonth,\n  toDateKey,\n  type CalendarDay,\n  type Weekday,\n};\n"],"mappings":";AAQA,MAAM,eAAe,SACnB,gBAAgB,QAAQ,OAAO,SAAS,KAAK,QAAQ,CAAC;AAExD,MAAM,cAAc,SAClB,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,GAAG,KAAK,QAAQ,CAAC;AAE9D,MAAM,gBAAgB,SACpB,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,GAAG,CAAC;AAEjD,MAAM,WAAW,MAAY,WAC3B,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,GAAG,KAAK,QAAQ,IAAI,MAAM;AAEvE,MAAM,aAAa,MAAY,WAAyB;CACtD,MAAM,MAAM,KAAK,QAAQ;CACzB,MAAM,SAAS,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,IAAI,QAAQ,CAAC;CAEvE,MAAM,UAAU,IAAI,KAClB,OAAO,YAAY,GACnB,OAAO,SAAS,IAAI,GACpB,CACF,CAAC,CAAC,QAAQ;CAEV,OAAO,IAAI,KACT,OAAO,YAAY,GACnB,OAAO,SAAS,GAChB,KAAK,IAAI,KAAK,OAAO,CACvB;AACF;AAEA,MAAM,YAAY,MAAY,WAC5B,UAAU,MAAM,SAAS,EAAE;AAE7B,MAAM,aAAa,SAAuB;CAKxC,OAAO,GAJM,OAAO,KAAK,YAAY,CAAC,CAAC,CAAC,SAAS,GAAG,GAIvC,EAAE,GAHD,OAAO,KAAK,SAAS,IAAI,CAAC,CAAC,CAAC,SAAS,GAAG,GAGhC,EAAE,GAFZ,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,GAAG,GAElB;AAC/B;AAEA,MAAM,aAAa,OAAa,WAC9B,MAAM,YAAY,MAAM,OAAO,YAAY,KAC3C,MAAM,SAAS,MAAM,OAAO,SAAS,KACrC,MAAM,QAAQ,MAAM,OAAO,QAAQ;AAErC,MAAM,eAAe,OAAa,WAChC,MAAM,YAAY,MAAM,OAAO,YAAY,KAC3C,MAAM,SAAS,MAAM,OAAO,SAAS;AAEvC,MAAM,mBAAmB,OAAa,iBAAyC;CAC7E,MAAM,WAAW,aAAa,KAAK;CACnC,MAAM,UAAU,SAAS,OAAO,IAAI,eAAe,KAAK;CAExD,MAAM,gBAAgB,QAAQ,UAAU,CAAC,MAAM;CAE/C,OAAO,MAAM,KAAK,EAAE,QAAQ,GAAG,IAAI,GAAG,UAAU;EAC9C,MAAM,OAAO,QAAQ,eAAe,KAAK;EAEzC,OAAO;GACL;GACA,KAAK,UAAU,IAAI;GACnB,cAAc,CAAC,YAAY,MAAM,KAAK;EACxC;CACF,CAAC;AACH;AAEA,MAAM,qBAAqB,SACzB,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,IAAI,GAAG,CAAC;AAErD,MAAM,gBAAgB;CACpB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,yBAAyB,WAA4B;CACzD,IAAI;EAYF,MAAM,SAASA,KAAe;EAE9B,IAAI,QAAQ;GACV,MAAM,aAAa,IAAI,OAAO,MAAM;GACpC,MAAM,WACJ,WAAW,cAAc,CAAC,CAAC,YAAY,WAAW,UAAU;GAE9D,IAAI,aAAa,KAAA,GACf,OAAQ,WAAW;EAEvB;CACF,QAAQ;EACN,MAAM,SAAS,OAAO,MAAM,GAAG,CAAC,CAAC,MAAM,SAAS,aAAa,KAAK,IAAI,CAAC;EACvE,OACE,UAAU,cAAc,SAAS,MAAwC,IACrE,IACA;CAER;CAGA,OAAO;AACT;AAEA,MAAM,mBAAmB,iBAAkC;CAEzD,MAAM,SAAS,IAAI,KAAK,MAAM,GAAG,CAAC;CAElC,OAAO,MAAM,KAAK,EAAE,QAAQ,EAAE,IAAI,GAAG,UACnC,QAAQ,QAAQ,eAAe,KAAK,CACtC;AACF"}

package/dist/components/forms/date-picker/date-picker.utils.js

@@ -0,0 +1,64 @@
+// src/components/forms/date-picker/date-picker.utils.ts
+const isValidDate = (date) => date instanceof Date && Number.isFinite(date.getTime());
+const startOfDay = (date) => new Date(date.getFullYear(), date.getMonth(), date.getDate());
+const startOfMonth = (date) => new Date(date.getFullYear(), date.getMonth(), 1);
+const addDays = (date, amount) => new Date(date.getFullYear(), date.getMonth(), date.getDate() + amount);
+const addMonths = (date, amount) => {
+	const day = date.getDate();
+	const target = new Date(date.getFullYear(), date.getMonth() + amount, 1);
+	const lastDay = new Date(target.getFullYear(), target.getMonth() + 1, 0).getDate();
+	return new Date(target.getFullYear(), target.getMonth(), Math.min(day, lastDay));
+};
+const addYears = (date, amount) => addMonths(date, amount * 12);
+const toDateKey = (date) => {
+	return `${String(date.getFullYear()).padStart(4, "0")}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
+};
+const isSameDay = (first, second) => first.getFullYear() === second.getFullYear() && first.getMonth() === second.getMonth() && first.getDate() === second.getDate();
+const isSameMonth = (first, second) => first.getFullYear() === second.getFullYear() && first.getMonth() === second.getMonth();
+const getCalendarDays = (month, weekStartsOn) => {
+	const firstDay = startOfMonth(month);
+	const offset = (firstDay.getDay() - weekStartsOn + 7) % 7;
+	const calendarStart = addDays(firstDay, -offset);
+	return Array.from({ length: 42 }, (_, index) => {
+		const date = addDays(calendarStart, index);
+		return {
+			date,
+			key: toDateKey(date),
+			outsideMonth: !isSameMonth(date, month)
+		};
+	});
+};
+const getLastDayOfMonth = (date) => new Date(date.getFullYear(), date.getMonth() + 1, 0);
+const sundayRegions = [
+	"US",
+	"CA",
+	"JP",
+	"KR",
+	"TW",
+	"TH",
+	"PH",
+	"BR",
+	"CO",
+	"MX"
+];
+const getLocaleWeekStartsOn = (locale) => {
+	try {
+		const Locale = Intl.Locale;
+		if (Locale) {
+			const localeInfo = new Locale(locale);
+			const firstDay = localeInfo.getWeekInfo?.().firstDay ?? localeInfo.weekInfo?.firstDay;
+			if (firstDay !== void 0) return firstDay % 7;
+		}
+	} catch {
+		const region = locale.split("-").find((part) => /^[A-Z]{2}$/.test(part));
+		return region && sundayRegions.includes(region) ? 0 : 1;
+	}
+	return 0;
+};
+const getWeekdayDates = (weekStartsOn) => {
+	const sunday = new Date(2024, 0, 7);
+	return Array.from({ length: 7 }, (_, index) => addDays(sunday, weekStartsOn + index));
+};
+export { addDays, addMonths, addYears, getCalendarDays, getLastDayOfMonth, getLocaleWeekStartsOn, getWeekdayDates, isSameDay, isSameMonth, isValidDate, startOfDay, startOfMonth, toDateKey };
+
+//# sourceMappingURL=date-picker.utils.js.map

package/dist/components/forms/date-picker/date-picker.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.utils.js","names":["IntlWithLocale"],"sources":["../../../../src/components/forms/date-picker/date-picker.utils.ts"],"sourcesContent":["type CalendarDay = {\n  date: Date;\n  key: string;\n  outsideMonth: boolean;\n};\n\ntype Weekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\nconst isValidDate = (date: Date): boolean =>\n  date instanceof Date && Number.isFinite(date.getTime());\n\nconst startOfDay = (date: Date): Date =>\n  new Date(date.getFullYear(), date.getMonth(), date.getDate());\n\nconst startOfMonth = (date: Date): Date =>\n  new Date(date.getFullYear(), date.getMonth(), 1);\n\nconst addDays = (date: Date, amount: number): Date =>\n  new Date(date.getFullYear(), date.getMonth(), date.getDate() + amount);\n\nconst addMonths = (date: Date, amount: number): Date => {\n  const day = date.getDate();\n  const target = new Date(date.getFullYear(), date.getMonth() + amount, 1);\n\n  const lastDay = new Date(\n    target.getFullYear(),\n    target.getMonth() + 1,\n    0,\n  ).getDate();\n\n  return new Date(\n    target.getFullYear(),\n    target.getMonth(),\n    Math.min(day, lastDay),\n  );\n};\n\nconst addYears = (date: Date, amount: number): Date =>\n  addMonths(date, amount * 12);\n\nconst toDateKey = (date: Date): string => {\n  const year = String(date.getFullYear()).padStart(4, \"0\");\n  const month = String(date.getMonth() + 1).padStart(2, \"0\");\n  const day = String(date.getDate()).padStart(2, \"0\");\n\n  return `${year}-${month}-${day}`;\n};\n\nconst isSameDay = (first: Date, second: Date): boolean =>\n  first.getFullYear() === second.getFullYear() &&\n  first.getMonth() === second.getMonth() &&\n  first.getDate() === second.getDate();\n\nconst isSameMonth = (first: Date, second: Date): boolean =>\n  first.getFullYear() === second.getFullYear() &&\n  first.getMonth() === second.getMonth();\n\nconst getCalendarDays = (month: Date, weekStartsOn: Weekday): CalendarDay[] => {\n  const firstDay = startOfMonth(month);\n  const offset = (firstDay.getDay() - weekStartsOn + 7) % 7;\n\n  const calendarStart = addDays(firstDay, -offset);\n\n  return Array.from({ length: 42 }, (_, index) => {\n    const date = addDays(calendarStart, index);\n\n    return {\n      date,\n      key: toDateKey(date),\n      outsideMonth: !isSameMonth(date, month),\n    };\n  });\n};\n\nconst getLastDayOfMonth = (date: Date): Date =>\n  new Date(date.getFullYear(), date.getMonth() + 1, 0);\n\nconst sundayRegions = [\n  \"US\",\n  \"CA\",\n  \"JP\",\n  \"KR\",\n  \"TW\",\n  \"TH\",\n  \"PH\",\n  \"BR\",\n  \"CO\",\n  \"MX\",\n] as const;\n\nconst getLocaleWeekStartsOn = (locale: string): Weekday => {\n  try {\n    type LocaleWeekInfo = {\n      weekInfo?: { firstDay: number };\n      getWeekInfo?: () => { firstDay: number };\n    };\n\n    type LocaleConstructor = new (locale: string) => LocaleWeekInfo;\n\n    const IntlWithLocale = Intl as unknown as {\n      Locale?: LocaleConstructor;\n    };\n\n    const Locale = IntlWithLocale.Locale;\n\n    if (Locale) {\n      const localeInfo = new Locale(locale);\n      const firstDay =\n        localeInfo.getWeekInfo?.().firstDay ?? localeInfo.weekInfo?.firstDay;\n\n      if (firstDay !== undefined) {\n        return (firstDay % 7) as Weekday;\n      }\n    }\n  } catch {\n    const region = locale.split(\"-\").find((part) => /^[A-Z]{2}$/.test(part));\n    return (\n      region && sundayRegions.includes(region as (typeof sundayRegions)[number])\n        ? 0\n        : 1\n    ) as Weekday;\n  }\n\n  // Fall back to Sunday when locale week information is unavailable.\n  return 0;\n};\n\nconst getWeekdayDates = (weekStartsOn: Weekday): Date[] => {\n  // January 7, 2024 was a Sunday.\n  const sunday = new Date(2024, 0, 7);\n\n  return Array.from({ length: 7 }, (_, index) =>\n    addDays(sunday, weekStartsOn + index),\n  );\n};\n\nexport {\n  addDays,\n  addMonths,\n  addYears,\n  getCalendarDays,\n  getLastDayOfMonth,\n  getLocaleWeekStartsOn,\n  getWeekdayDates,\n  isSameDay,\n  isSameMonth,\n  isValidDate,\n  startOfDay,\n  startOfMonth,\n  toDateKey,\n  type CalendarDay,\n  type Weekday,\n};\n"],"mappings":";AAQA,MAAM,eAAe,SACnB,gBAAgB,QAAQ,OAAO,SAAS,KAAK,QAAQ,CAAC;AAExD,MAAM,cAAc,SAClB,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,GAAG,KAAK,QAAQ,CAAC;AAE9D,MAAM,gBAAgB,SACpB,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,GAAG,CAAC;AAEjD,MAAM,WAAW,MAAY,WAC3B,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,GAAG,KAAK,QAAQ,IAAI,MAAM;AAEvE,MAAM,aAAa,MAAY,WAAyB;CACtD,MAAM,MAAM,KAAK,QAAQ;CACzB,MAAM,SAAS,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,IAAI,QAAQ,CAAC;CAEvE,MAAM,UAAU,IAAI,KAClB,OAAO,YAAY,GACnB,OAAO,SAAS,IAAI,GACpB,CACF,CAAC,CAAC,QAAQ;CAEV,OAAO,IAAI,KACT,OAAO,YAAY,GACnB,OAAO,SAAS,GAChB,KAAK,IAAI,KAAK,OAAO,CACvB;AACF;AAEA,MAAM,YAAY,MAAY,WAC5B,UAAU,MAAM,SAAS,EAAE;AAE7B,MAAM,aAAa,SAAuB;CAKxC,OAAO,GAJM,OAAO,KAAK,YAAY,CAAC,CAAC,CAAC,SAAS,GAAG,GAIvC,EAAE,GAHD,OAAO,KAAK,SAAS,IAAI,CAAC,CAAC,CAAC,SAAS,GAAG,GAGhC,EAAE,GAFZ,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,GAAG,GAElB;AAC/B;AAEA,MAAM,aAAa,OAAa,WAC9B,MAAM,YAAY,MAAM,OAAO,YAAY,KAC3C,MAAM,SAAS,MAAM,OAAO,SAAS,KACrC,MAAM,QAAQ,MAAM,OAAO,QAAQ;AAErC,MAAM,eAAe,OAAa,WAChC,MAAM,YAAY,MAAM,OAAO,YAAY,KAC3C,MAAM,SAAS,MAAM,OAAO,SAAS;AAEvC,MAAM,mBAAmB,OAAa,iBAAyC;CAC7E,MAAM,WAAW,aAAa,KAAK;CACnC,MAAM,UAAU,SAAS,OAAO,IAAI,eAAe,KAAK;CAExD,MAAM,gBAAgB,QAAQ,UAAU,CAAC,MAAM;CAE/C,OAAO,MAAM,KAAK,EAAE,QAAQ,GAAG,IAAI,GAAG,UAAU;EAC9C,MAAM,OAAO,QAAQ,eAAe,KAAK;EAEzC,OAAO;GACL;GACA,KAAK,UAAU,IAAI;GACnB,cAAc,CAAC,YAAY,MAAM,KAAK;EACxC;CACF,CAAC;AACH;AAEA,MAAM,qBAAqB,SACzB,IAAI,KAAK,KAAK,YAAY,GAAG,KAAK,SAAS,IAAI,GAAG,CAAC;AAErD,MAAM,gBAAgB;CACpB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,yBAAyB,WAA4B;CACzD,IAAI;EAYF,MAAM,SAASA,KAAe;EAE9B,IAAI,QAAQ;GACV,MAAM,aAAa,IAAI,OAAO,MAAM;GACpC,MAAM,WACJ,WAAW,cAAc,CAAC,CAAC,YAAY,WAAW,UAAU;GAE9D,IAAI,aAAa,KAAA,GACf,OAAQ,WAAW;EAEvB;CACF,QAAQ;EACN,MAAM,SAAS,OAAO,MAAM,GAAG,CAAC,CAAC,MAAM,SAAS,aAAa,KAAK,IAAI,CAAC;EACvE,OACE,UAAU,cAAc,SAAS,MAAwC,IACrE,IACA;CAER;CAGA,OAAO;AACT;AAEA,MAAM,mBAAmB,iBAAkC;CAEzD,MAAM,SAAS,IAAI,KAAK,MAAM,GAAG,CAAC;CAElC,OAAO,MAAM,KAAK,EAAE,QAAQ,EAAE,IAAI,GAAG,UACnC,QAAQ,QAAQ,eAAe,KAAK,CACtC;AACF"}

package/dist/components/forms/date-picker/index.cjs

@@ -0,0 +1,572 @@
+"use client";
+const require_index = require("../../overlays/popout/index.cjs");
+const require_date_picker_utils = require("./date-picker.utils.cjs");
+;/* empty css                  */
+let _puzzle_ui_core = require("@puzzle-ui/core");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+// src/components/forms/date-picker/index.tsx
+const EMPTY_DATES = [];
+const normalizeDate = (date) => date && require_date_picker_utils.isValidDate(date) ? require_date_picker_utils.startOfDay(date) : null;
+const findDateFromInput = (value) => {
+	if (!value) return null;
+	const [year, month, day] = value.split("-").map(Number);
+	if (!year || !month || !day) return null;
+	const date = new Date(year, month - 1, day);
+	return require_date_picker_utils.isValidDate(date) && require_date_picker_utils.toDateKey(date) === value ? date : null;
+};
+const DatePicker = ({ value, defaultValue, onChange, label, placeholder = "Select date", description, error, disabled = false, required = false, clearable = false, clearLabel = "Clear date", name, form, minDate, maxDate, disabledDates = EMPTY_DATES, shouldDisableDate, locale, weekStartsOn, dateFormat, size = "md", fullWidth = false, open, defaultOpen = false, onOpenChange, position = "bottom", align = "start", offset = 8, collisionPadding = 8, calendarLabel = "Choose date", previousMonthLabel = "Previous month", nextMonthLabel = "Next month", rootClassName, popoverClassName, id, className, style, onClick, onKeyDown, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, dir, ...buttonProps }) => {
+	const baseId = (0, react.useId)();
+	const triggerId = id ?? `${baseId}-trigger`;
+	const labelId = `${baseId}-label`;
+	const descriptionId = `${baseId}-description`;
+	const errorId = `${baseId}-error`;
+	const calendarId = `${baseId}-calendar`;
+	const gridId = `${baseId}-grid`;
+	const triggerRef = (0, react.useRef)(null);
+	const calendarGridRef = (0, react.useRef)(null);
+	const nativeInputRef = (0, react.useRef)(null);
+	const isControlledValue = value !== void 0;
+	const isControlledOpen = open !== void 0;
+	const initialValue = normalizeDate(value !== void 0 ? value : defaultValue);
+	const [today] = (0, react.useState)(() => require_date_picker_utils.startOfDay(/* @__PURE__ */ new Date()));
+	const [internalValue, setInternalValue] = (0, react.useState)(() => normalizeDate(defaultValue));
+	const selectedDate = isControlledValue ? normalizeDate(value) : internalValue;
+	const [internalOpen, setInternalOpen] = (0, react.useState)(defaultOpen);
+	const isOpen = open ?? internalOpen;
+	const [viewDate, setViewDate] = (0, react.useState)(() => require_date_picker_utils.startOfMonth(initialValue ?? today));
+	const [activeDate, setActiveDate] = (0, react.useState)(() => initialValue ?? today);
+	const resolvedLocale = locale ?? Intl.DateTimeFormat().resolvedOptions().locale;
+	const resolvedWeekStartsOn = weekStartsOn ?? require_date_picker_utils.getLocaleWeekStartsOn(resolvedLocale);
+	const responsiveSize = (0, _puzzle_ui_core.resolveResponsiveValue)(size, "md");
+	const responsiveFullWidth = (0, _puzzle_ui_core.resolveResponsiveValue)(fullWidth, false);
+	const normalizedMinDate = (0, react.useMemo)(() => normalizeDate(minDate), [minDate]);
+	const normalizedMaxDate = (0, react.useMemo)(() => normalizeDate(maxDate), [maxDate]);
+	const disabledDateKeys = (0, react.useMemo)(() => new Set(disabledDates.filter(require_date_picker_utils.isValidDate).map((date) => require_date_picker_utils.toDateKey(require_date_picker_utils.startOfDay(date)))), [disabledDates]);
+	const selectedKey = selectedDate ? require_date_picker_utils.toDateKey(selectedDate) : "";
+	const minDateKey = normalizedMinDate ? require_date_picker_utils.toDateKey(normalizedMinDate) : void 0;
+	const maxDateKey = normalizedMaxDate ? require_date_picker_utils.toDateKey(normalizedMaxDate) : void 0;
+	const dateFormatter = (0, react.useMemo)(() => new Intl.DateTimeFormat(resolvedLocale, dateFormat ?? {
+		day: "numeric",
+		month: "long",
+		year: "numeric"
+	}), [resolvedLocale, dateFormat]);
+	const accessibleDateFormatter = (0, react.useMemo)(() => new Intl.DateTimeFormat(resolvedLocale, {
+		weekday: "long",
+		day: "numeric",
+		month: "long",
+		year: "numeric"
+	}), [resolvedLocale]);
+	const monthFormatter = (0, react.useMemo)(() => new Intl.DateTimeFormat(resolvedLocale, {
+		month: "long",
+		year: "numeric"
+	}), [resolvedLocale]);
+	const weekdayFormatter = (0, react.useMemo)(() => new Intl.DateTimeFormat(resolvedLocale, { weekday: "short" }), [resolvedLocale]);
+	const weekdayAccessibleFormatter = (0, react.useMemo)(() => new Intl.DateTimeFormat(resolvedLocale, { weekday: "long" }), [resolvedLocale]);
+	const dayNumberFormatter = (0, react.useMemo)(() => new Intl.NumberFormat(resolvedLocale), [resolvedLocale]);
+	const weekdayLabels = (0, react.useMemo)(() => require_date_picker_utils.getWeekdayDates(resolvedWeekStartsOn).map((date) => ({
+		short: weekdayFormatter.format(date),
+		long: weekdayAccessibleFormatter.format(date)
+	})), [
+		resolvedWeekStartsOn,
+		weekdayFormatter,
+		weekdayAccessibleFormatter
+	]);
+	const calendarDays = (0, react.useMemo)(() => require_date_picker_utils.getCalendarDays(viewDate, resolvedWeekStartsOn), [viewDate, resolvedWeekStartsOn]);
+	const hasError = error !== void 0 && error !== null && error !== false;
+	const isInvalid = hasError || ariaInvalid !== void 0 && ariaInvalid !== false && ariaInvalid !== "false";
+	const resolvedAriaInvalid = isInvalid ? true : ariaInvalid;
+	const errorContent = error === true ? "Invalid date" : error;
+	const displayedValue = selectedDate ? dateFormatter.format(selectedDate) : placeholder;
+	const monthLabel = monthFormatter.format(viewDate);
+	const isDateDisabled = (0, react.useCallback)((date) => {
+		const normalized = require_date_picker_utils.startOfDay(date);
+		if (!require_date_picker_utils.isValidDate(normalized) || normalizedMinDate && normalizedMaxDate && normalizedMinDate > normalizedMaxDate) return true;
+		if (normalizedMinDate && normalized < normalizedMinDate) return true;
+		if (normalizedMaxDate && normalized > normalizedMaxDate) return true;
+		if (disabledDateKeys.has(require_date_picker_utils.toDateKey(normalized))) return true;
+		return shouldDisableDate?.(normalized) === true;
+	}, [
+		normalizedMinDate,
+		normalizedMaxDate,
+		disabledDateKeys,
+		shouldDisableDate
+	]);
+	/**
+	* Search in one direction for the next selectable date.
+	* The search stops immediately when it reaches a hard date boundary.
+	*/
+	const findAvailableDate = (0, react.useCallback)((date, direction, maxDistance = 3660) => {
+		if (normalizedMinDate && normalizedMaxDate && normalizedMinDate > normalizedMaxDate) return null;
+		const base = require_date_picker_utils.startOfDay(date);
+		for (let offset = 0; offset <= maxDistance; offset++) {
+			const candidate = require_date_picker_utils.addDays(base, offset * direction);
+			if (normalizedMinDate && candidate < normalizedMinDate) {
+				if (direction === -1) return null;
+				continue;
+			}
+			if (normalizedMaxDate && candidate > normalizedMaxDate) {
+				if (direction === 1) return null;
+				continue;
+			}
+			if (!isDateDisabled(candidate)) return candidate;
+		}
+		return null;
+	}, [
+		normalizedMinDate,
+		normalizedMaxDate,
+		isDateDisabled
+	]);
+	/**
+	* Find the closest selectable date around a starting point.
+	* Prefer the future when both dates are equally distant.
+	*/
+	const findNearestAvailableDate = (0, react.useCallback)((date) => {
+		if (normalizedMinDate && normalizedMaxDate && normalizedMinDate > normalizedMaxDate) return null;
+		let base = require_date_picker_utils.startOfDay(date);
+		if (normalizedMinDate && base < normalizedMinDate) base = normalizedMinDate;
+		if (normalizedMaxDate && base > normalizedMaxDate) base = normalizedMaxDate;
+		for (let distance = 0; distance <= 3660; distance++) {
+			const future = require_date_picker_utils.addDays(base, distance);
+			if ((!normalizedMaxDate || future <= normalizedMaxDate) && !isDateDisabled(future)) return future;
+			if (distance > 0) {
+				const past = require_date_picker_utils.addDays(base, -distance);
+				if ((!normalizedMinDate || past >= normalizedMinDate) && !isDateDisabled(past)) return past;
+			}
+		}
+		return null;
+	}, [
+		normalizedMinDate,
+		normalizedMaxDate,
+		isDateDisabled
+	]);
+	const changeOpenState = (0, react.useCallback)((nextOpen) => {
+		if (!isControlledOpen) setInternalOpen(nextOpen);
+		onOpenChange?.(nextOpen);
+	}, [isControlledOpen, onOpenChange]);
+	const openCalendar = (0, react.useCallback)(() => {
+		const initialDate = selectedDate && !isDateDisabled(selectedDate) ? selectedDate : findNearestAvailableDate(today);
+		if (initialDate) {
+			setActiveDate(initialDate);
+			setViewDate(require_date_picker_utils.startOfMonth(initialDate));
+		}
+		changeOpenState(true);
+	}, [
+		selectedDate,
+		today,
+		isDateDisabled,
+		findNearestAvailableDate,
+		changeOpenState
+	]);
+	const updateValue = (0, react.useCallback)((nextDate) => {
+		const normalized = normalizeDate(nextDate);
+		if (normalized && isDateDisabled(normalized)) return;
+		if (!isControlledValue) setInternalValue(normalized);
+		onChange?.(normalized ? new Date(normalized.getTime()) : null);
+	}, [
+		isControlledValue,
+		isDateDisabled,
+		onChange
+	]);
+	const selectDate = (0, react.useCallback)((date) => {
+		const normalized = require_date_picker_utils.startOfDay(date);
+		if (disabled || isDateDisabled(normalized)) return;
+		setActiveDate(normalized);
+		setViewDate(require_date_picker_utils.startOfMonth(normalized));
+		updateValue(normalized);
+		changeOpenState(false);
+		triggerRef.current?.focus({ preventScroll: true });
+	}, [
+		disabled,
+		isDateDisabled,
+		updateValue,
+		changeOpenState
+	]);
+	const clearDate = (0, react.useCallback)(() => {
+		if (disabled || required || !selectedDate) return;
+		updateValue(null);
+		changeOpenState(false);
+		triggerRef.current?.focus({ preventScroll: true });
+	}, [
+		disabled,
+		required,
+		selectedDate,
+		updateValue,
+		changeOpenState
+	]);
+	const changeMonth = (0, react.useCallback)((amount) => {
+		const nextMonth = require_date_picker_utils.addMonths(viewDate, amount);
+		const candidate = require_date_picker_utils.addMonths(activeDate, amount);
+		const availableDate = findNearestAvailableDate(candidate);
+		setViewDate(require_date_picker_utils.startOfMonth(availableDate ?? nextMonth));
+		if (availableDate) setActiveDate(availableDate);
+	}, [
+		viewDate,
+		activeDate,
+		findNearestAvailableDate
+	]);
+	const isPreviousMonthDisabled = normalizedMinDate !== null && normalizedMinDate !== void 0 && require_date_picker_utils.getLastDayOfMonth(require_date_picker_utils.addMonths(viewDate, -1)) < normalizedMinDate;
+	const isNextMonthDisabled = normalizedMaxDate !== null && normalizedMaxDate !== void 0 && require_date_picker_utils.startOfMonth(require_date_picker_utils.addMonths(viewDate, 1)) > normalizedMaxDate;
+	const handleTriggerClick = (event) => {
+		onClick?.(event);
+		if (event.defaultPrevented || disabled) return;
+		event.preventDefault();
+		if (isOpen) changeOpenState(false);
+		else openCalendar();
+	};
+	const handleTriggerKeyDown = (event) => {
+		onKeyDown?.(event);
+		if (event.defaultPrevented || disabled) return;
+		if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
+			event.preventDefault();
+			if (!isOpen) openCalendar();
+			return;
+		}
+	};
+	const handleDayKeyDown = (event, date) => {
+		if (event.defaultPrevented) return;
+		const computedDirection = triggerRef.current?.ownerDocument.defaultView?.getComputedStyle(triggerRef.current).direction;
+		const direction = dir === "rtl" || dir !== "ltr" && computedDirection === "rtl" ? -1 : 1;
+		let candidate = null;
+		let searchDirection = 1;
+		let searchDistance = 3660;
+		switch (event.key) {
+			case "ArrowLeft":
+				candidate = require_date_picker_utils.addDays(date, -direction);
+				searchDirection = -direction;
+				break;
+			case "ArrowRight":
+				candidate = require_date_picker_utils.addDays(date, direction);
+				searchDirection = direction;
+				break;
+			case "ArrowUp":
+				candidate = require_date_picker_utils.addDays(date, -7);
+				searchDirection = -1;
+				break;
+			case "ArrowDown":
+				candidate = require_date_picker_utils.addDays(date, 7);
+				searchDirection = 1;
+				break;
+			case "Home": {
+				const offset = (date.getDay() - resolvedWeekStartsOn + 7) % 7;
+				candidate = require_date_picker_utils.addDays(date, -offset);
+				searchDirection = 1;
+				searchDistance = 6;
+				break;
+			}
+			case "End": {
+				const offset = (date.getDay() - resolvedWeekStartsOn + 7) % 7;
+				candidate = require_date_picker_utils.addDays(date, 6 - offset);
+				searchDirection = -1;
+				searchDistance = 6;
+				break;
+			}
+			case "PageUp":
+				candidate = event.shiftKey ? require_date_picker_utils.addYears(date, -1) : require_date_picker_utils.addMonths(date, -1);
+				searchDirection = -1;
+				break;
+			case "PageDown":
+				candidate = event.shiftKey ? require_date_picker_utils.addYears(date, 1) : require_date_picker_utils.addMonths(date, 1);
+				searchDirection = 1;
+				break;
+			case "Enter":
+			case " ":
+				event.preventDefault();
+				selectDate(date);
+				return;
+			default: return;
+		}
+		if (!candidate) return;
+		const nextDate = findAvailableDate(candidate, searchDirection, searchDistance);
+		event.preventDefault();
+		if (!nextDate) return;
+		setActiveDate(nextDate);
+		setViewDate(require_date_picker_utils.startOfMonth(nextDate));
+	};
+	const handleNativeChange = (event) => {
+		updateValue(findDateFromInput(event.currentTarget.value));
+	};
+	const handleNativeInvalid = (event) => {
+		event.preventDefault();
+		triggerRef.current?.focus({ preventScroll: true });
+	};
+	(0, react.useEffect)(() => {
+		if (!selectedDate) return;
+		setActiveDate(selectedDate);
+		setViewDate(require_date_picker_utils.startOfMonth(selectedDate));
+	}, [selectedKey]);
+	(0, react.useEffect)(() => {
+		const input = nativeInputRef.current;
+		if (!input) return;
+		const invalidSelection = selectedDate !== null && isDateDisabled(selectedDate);
+		input.setCustomValidity(invalidSelection ? "Please select an available date." : "");
+	}, [
+		selectedKey,
+		isDateDisabled,
+		selectedDate
+	]);
+	(0, react.useEffect)(() => {
+		if (!isOpen) return;
+		const ownerDocument = triggerRef.current?.ownerDocument;
+		const ownerWindow = ownerDocument?.defaultView;
+		if (!ownerDocument || !ownerWindow) return;
+		let focusDate = activeDate;
+		if (isDateDisabled(focusDate)) {
+			const nearestDate = findNearestAvailableDate(focusDate);
+			if (nearestDate) {
+				focusDate = nearestDate;
+				setActiveDate(nearestDate);
+				setViewDate(require_date_picker_utils.startOfMonth(nearestDate));
+			} else {
+				calendarGridRef.current?.focus({ preventScroll: true });
+				return;
+			}
+		}
+		const focusActiveDate = () => {
+			ownerDocument.getElementById(`${gridId}-day-${require_date_picker_utils.toDateKey(focusDate)}`)?.focus({ preventScroll: true });
+		};
+		if (typeof ownerWindow.requestAnimationFrame === "function") {
+			const frame = ownerWindow.requestAnimationFrame(focusActiveDate);
+			return () => {
+				ownerWindow.cancelAnimationFrame(frame);
+			};
+		}
+		focusActiveDate();
+	}, [
+		isOpen,
+		activeDate,
+		gridId,
+		isDateDisabled,
+		findNearestAvailableDate
+	]);
+	const resolvedLabelledBy = ariaLabelledBy ?? (label != null ? labelId : void 0);
+	const resolvedDescribedBy = [
+		ariaDescribedBy,
+		description != null ? descriptionId : void 0,
+		hasError ? errorId : void 0
+	].filter(Boolean).join(" ") || void 0;
+	const triggerElement = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		...buttonProps,
+		ref: triggerRef,
+		id: triggerId,
+		type: "button",
+		disabled,
+		dir,
+		style,
+		className: (0, _puzzle_ui_core.cn)("puzzle-date-picker__trigger", className),
+		onClick: handleTriggerClick,
+		onKeyDown: handleTriggerKeyDown,
+		"aria-label": ariaLabel,
+		"aria-labelledby": resolvedLabelledBy,
+		"aria-describedby": resolvedDescribedBy,
+		"aria-haspopup": "dialog",
+		"aria-expanded": isOpen,
+		"aria-controls": isOpen ? calendarId : void 0,
+		"aria-required": required || void 0,
+		"aria-invalid": resolvedAriaInvalid,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: (0, _puzzle_ui_core.cn)("puzzle-date-picker__value", !selectedDate && "puzzle-date-picker__placeholder"),
+			children: displayedValue
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "puzzle-date-picker__calendar-icon",
+			"aria-hidden": "true"
+		})]
+	});
+	const calendarHasEnabledDate = calendarDays.some(({ date }) => !isDateDisabled(date));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, _puzzle_ui_core.cn)("puzzle-date-picker", rootClassName),
+		"data-open": isOpen ? "true" : "false",
+		"data-disabled": disabled ? "true" : void 0,
+		"data-invalid": isInvalid ? "true" : void 0,
+		"data-size-mobile": responsiveSize.mobile,
+		"data-size-tablet": responsiveSize.tablet,
+		"data-size-desktop": responsiveSize.desktop,
+		"data-full-width-mobile": String(responsiveFullWidth.mobile),
+		"data-full-width-tablet": String(responsiveFullWidth.tablet),
+		"data-full-width-desktop": String(responsiveFullWidth.desktop),
+		lang: resolvedLocale,
+		dir,
+		children: [
+			label != null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				id: labelId,
+				htmlFor: triggerId,
+				className: "puzzle-date-picker__label",
+				children: [label, required && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "puzzle-date-picker__required",
+					"aria-hidden": "true",
+					children: "*"
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "puzzle-date-picker__control",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.Popout, {
+					trigger: triggerElement,
+					open: isOpen,
+					onOpenChange: changeOpenState,
+					action: "click",
+					position,
+					align,
+					offset,
+					collisionPadding,
+					contentClassName: (0, _puzzle_ui_core.cn)("puzzle-date-picker__popover", popoverClassName),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						id: calendarId,
+						className: "puzzle-date-picker__calendar",
+						role: "dialog",
+						"aria-label": calendarLabel,
+						lang: resolvedLocale,
+						dir,
+						onKeyDown: (event) => {
+							if (event.key === "Tab") {
+								changeOpenState(false);
+								triggerRef.current?.focus({ preventScroll: true });
+							}
+						},
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "puzzle-date-picker__header",
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: "puzzle-date-picker__navigation",
+										"aria-label": `${previousMonthLabel}: ${monthFormatter.format(require_date_picker_utils.addMonths(viewDate, -1))}`,
+										disabled: disabled || isPreviousMonthDisabled,
+										onClick: () => changeMonth(-1),
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											"aria-hidden": "true",
+											children: "‹"
+										})
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										id: `${calendarId}-month`,
+										className: "puzzle-date-picker__month",
+										"aria-live": "polite",
+										"aria-atomic": "true",
+										children: monthLabel
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: "puzzle-date-picker__navigation",
+										"aria-label": `${nextMonthLabel}: ${monthFormatter.format(require_date_picker_utils.addMonths(viewDate, 1))}`,
+										disabled: disabled || isNextMonthDisabled,
+										onClick: () => changeMonth(1),
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											"aria-hidden": "true",
+											children: "›"
+										})
+									})
+								]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", {
+								ref: calendarGridRef,
+								id: gridId,
+								className: "puzzle-date-picker__grid",
+								role: "grid",
+								"aria-labelledby": `${calendarId}-month`,
+								tabIndex: calendarHasEnabledDate ? -1 : 0,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
+									role: "row",
+									children: weekdayLabels.map((weekday, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
+										scope: "col",
+										role: "columnheader",
+										"aria-label": weekday.long,
+										children: weekday.short
+									}, index))
+								}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", { children: Array.from({ length: 6 }, (_, weekIndex) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
+									role: "row",
+									children: calendarDays.slice(weekIndex * 7, weekIndex * 7 + 7).map(({ date, key, outsideMonth }) => {
+										const selected = selectedDate !== null && require_date_picker_utils.isSameDay(date, selectedDate);
+										const isToday = require_date_picker_utils.isSameDay(date, today);
+										const isActive = require_date_picker_utils.isSameDay(date, activeDate);
+										const dayDisabled = disabled || isDateDisabled(date);
+										return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
+											role: "gridcell",
+											"aria-selected": selected || void 0,
+											className: "puzzle-date-picker__cell",
+											"data-outside-month": outsideMonth || void 0,
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+												type: "button",
+												id: `${gridId}-day-${key}`,
+												className: "puzzle-date-picker__day",
+												disabled: dayDisabled,
+												tabIndex: isActive && !dayDisabled ? 0 : -1,
+												"aria-label": accessibleDateFormatter.format(date),
+												"aria-current": isToday ? "date" : void 0,
+												"data-selected": selected || void 0,
+												"data-today": isToday || void 0,
+												"data-outside-month": outsideMonth || void 0,
+												"data-active": isActive || void 0,
+												onFocus: () => {
+													setActiveDate(date);
+													if (!require_date_picker_utils.isSameMonth(date, viewDate)) setViewDate(require_date_picker_utils.startOfMonth(date));
+												},
+												onKeyDown: (event) => handleDayKeyDown(event, date),
+												onClick: () => selectDate(date),
+												children: dayNumberFormatter.format(date.getDate())
+											})
+										}, key);
+									})
+								}, weekIndex)) })]
+							}),
+							!calendarHasEnabledDate && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "puzzle-date-picker__empty",
+								role: "status",
+								children: "No available dates"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "puzzle-date-picker__footer",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: "puzzle-date-picker__today",
+									disabled: disabled || isDateDisabled(today),
+									onClick: () => selectDate(today),
+									children: "Today"
+								})
+							})
+						]
+					})
+				}), clearable && selectedDate && !required && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "puzzle-date-picker__clear",
+					disabled,
+					"aria-label": clearLabel,
+					onClick: clearDate,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						"aria-hidden": "true",
+						children: "×"
+					})
+				})]
+			}),
+			description != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				id: descriptionId,
+				className: "puzzle-date-picker__description",
+				children: description
+			}),
+			hasError && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				id: errorId,
+				className: "puzzle-date-picker__error",
+				role: "alert",
+				children: errorContent
+			}),
+			(name !== null || required) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				ref: nativeInputRef,
+				className: "puzzle-date-picker__native",
+				type: "date",
+				name: name ?? void 0,
+				form,
+				value: selectedKey,
+				min: minDateKey,
+				max: maxDateKey,
+				disabled,
+				required,
+				tabIndex: -1,
+				"aria-hidden": "true",
+				onChange: handleNativeChange,
+				onInvalid: handleNativeInvalid
+			})
+		]
+	});
+};
+exports.DatePicker = DatePicker;
+
+//# sourceMappingURL=index.cjs.map