@pathscale/ui 1.1.55 → 1.1.56

package/dist/components/calendar/Calendar.js

@@ -1,419 +1,194 @@
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
-import "./Calendar.css";
+import "cally";
+import "./input.css";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
 import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
-import * as __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__ from "../../hooks/date/index.js";
-import * as __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__ from "./Calendar.classes.js";
-var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div><div><button type=button><svg><path d="m15 18-6-6 6-6"></path></svg></button></div><div></div><div><button type=button><svg><path d="m9 18 6-6-6-6"></path></svg></button></div></div><div><div><div></div></div><div>'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<button type=button><span>");
+import * as __WEBPACK_EXTERNAL_MODULE__icon_Icon_js_f8a6327a__ from "../icon/Icon.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="relative inline-block"><button type=button>'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><div class=w-full><calendar-date><calendar-month>", true, false, false), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="fixed inset-0 z-40">'), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><calendar-date><calendar-month>", true, false, false);
 const Calendar_Calendar = (props)=>{
-    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+    const [local] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "size",
+        "value",
+        "onDateSelect",
+        "asInput",
+        "placeholder",
+        "disabled",
+        "children",
+        "dataTheme",
         "class",
         "className",
-        "dataTheme",
-        "style",
-        "ref",
-        "selectionMode",
-        "value",
-        "defaultValue",
-        "onChange",
-        "rangeStart",
-        "rangeEnd",
-        "rangePreview",
-        "onDaySelect",
-        "onDayHover",
-        "minValue",
-        "maxValue",
-        "isDateUnavailable",
-        "locale",
-        "weekdayFormat",
-        "showOutsideDays",
-        "isDisabled",
-        "disabled"
+        "style"
     ]);
-    const selectionMode = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local.selectionMode ?? "single");
-    const dateSelection = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.useDateSelection)({
-        value: ()=>local.value,
-        defaultValue: ()=>local.defaultValue,
-        onChange: ()=>local.onChange
-    });
-    const selectedDate = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>"single" === selectionMode() ? dateSelection.selectedDate() : null);
-    const rangeStart = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.rangeStart));
-    const rangeEnd = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.rangeEnd));
-    const rangePreview = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.rangePreview));
-    const defaultReferenceDate = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.defaultValue) ?? (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.getToday)());
-    const focusReferenceDate = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>selectedDate() ?? rangeEnd() ?? rangeStart() ?? (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.value) ?? defaultReferenceDate());
-    const minDate = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.minValue));
-    const maxDate = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.normalizeDate)(local.maxValue));
-    const locale = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local.locale ?? "en-US");
-    const weekdayFormat = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local.weekdayFormat ?? "short");
-    const showOutsideDays = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local.showOutsideDays ?? true);
-    const isCalendarDisabled = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>Boolean(local.isDisabled) || Boolean(local.disabled));
-    const isDateUnavailable = (date)=>Boolean(local.isDateUnavailable?.(date));
-    const isDateDisabled = (date)=>{
-        if (isCalendarDisabled()) return true;
-        const min = minDate();
-        if (min && (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.compareDates)(date, min) < 0) return true;
-        const max = maxDate();
-        if (max && (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.compareDates)(date, max) > 0) return true;
-        return isDateUnavailable(date);
-    };
-    const navigation = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.useCalendarNavigation)({
-        initialFocusedDate: ()=>focusReferenceDate(),
-        minDate,
-        maxDate,
-        isDateDisabled
-    });
+    const [selectedValue, setSelectedValue] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(local.value || "");
+    const [isOpen, setIsOpen] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const uniqueId = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createUniqueId)();
+    const inputId = `calendar-input-${uniqueId}`;
+    let calendarRef;
+    let inputRef;
     (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
-        navigation.syncFocusedDate(focusReferenceDate());
+        if (void 0 !== local.value) setSelectedValue(local.value);
     });
-    const calendarState = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.useCalendarState)({
-        selectionMode: ()=>selectionMode(),
-        locale,
-        weekdayFormat,
-        visibleMonth: navigation.visibleMonth,
-        focusedDate: navigation.focusedDate,
-        selectedDate,
-        rangeStart,
-        rangeEnd,
-        rangePreview,
-        isDateDisabled,
-        isDateUnavailable
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
+        if (calendarRef && calendarRef.value !== selectedValue()) calendarRef.value = selectedValue();
     });
-    let rootRef;
-    const focusDateButton = (date)=>{
-        const dateValue = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.toISODate)(date);
-        queueMicrotask(()=>{
-            const target = rootRef?.querySelector(`[data-slot=\"calendar-cell\"][data-date=\"${dateValue}\"]`);
-            target?.focus();
-        });
-    };
-    const selectDate = (date)=>{
-        if (isDateDisabled(date)) return;
-        if ("function" == typeof local.onDaySelect) local.onDaySelect(date);
-        else if ("single" === selectionMode()) dateSelection.setSelectedDate(date);
-        navigation.setFocusedDate(date);
-        navigation.setVisibleMonthFromDate(date);
-    };
-    const navigateMonth = (direction)=>{
-        if (isCalendarDisabled()) return;
-        const nextFocus = navigation.navigateMonth(direction);
-        if (nextFocus) focusDateButton(nextFocus);
-    };
-    const handleCellKeyDown = (event)=>{
-        if (isCalendarDisabled()) return;
-        const dateValue = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.parseDate)(event.currentTarget.dataset.date);
-        if (!dateValue) return;
-        if ("Enter" === event.key || " " === event.key) {
-            event.preventDefault();
-            selectDate(dateValue);
-            return;
-        }
-        let nextDate = null;
-        let direction = 1;
-        switch(event.key){
-            case "ArrowLeft":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.addDays)(dateValue, -1);
-                direction = -1;
-                break;
-            case "ArrowRight":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.addDays)(dateValue, 1);
-                direction = 1;
-                break;
-            case "ArrowUp":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.addDays)(dateValue, -__WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.DAYS_PER_WEEK);
-                direction = -1;
-                break;
-            case "ArrowDown":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.addDays)(dateValue, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.DAYS_PER_WEEK);
-                direction = 1;
-                break;
-            case "Home":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.addDays)(dateValue, -dateValue.getDay());
-                direction = -1;
-                break;
-            case "End":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.addDays)(dateValue, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.DAYS_PER_WEEK - 1 - dateValue.getDay());
-                direction = 1;
-                break;
-            case "PageUp":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.shiftDateByMonths)(dateValue, -1);
-                direction = -1;
-                break;
-            case "PageDown":
-                nextDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.shiftDateByMonths)(dateValue, 1);
-                direction = 1;
-                break;
-            default:
-                return;
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
+        const shouldSetupListeners = local.asInput ? isOpen() && calendarRef : calendarRef;
+        if (shouldSetupListeners) {
+            const handleChange = (e)=>{
+                const target = e.target;
+                const newValue = target.value;
+                if (newValue && newValue !== selectedValue()) {
+                    setSelectedValue(newValue);
+                    if (local.onDateSelect) local.onDateSelect(newValue);
+                    if (local.asInput) setIsOpen(false);
+                }
+            };
+            const handleClick = (e)=>{
+                setTimeout(()=>{
+                    const value = calendarRef.value;
+                    if (value && value !== selectedValue()) {
+                        setSelectedValue(value);
+                        if (local.onDateSelect) local.onDateSelect(value);
+                        if (local.asInput) setIsOpen(false);
+                    }
+                }, 100);
+            };
+            calendarRef.addEventListener("change", handleChange);
+            calendarRef.addEventListener("click", handleClick);
+            return ()=>{
+                if (calendarRef) {
+                    calendarRef.removeEventListener("change", handleChange);
+                    calendarRef.removeEventListener("click", handleClick);
+                }
+            };
         }
-        if (!nextDate) return;
-        event.preventDefault();
-        const nextFocus = navigation.moveFocusToDate(nextDate, direction);
-        focusDateButton(nextFocus);
-    };
-    const uniqueId = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createUniqueId)();
-    const headingId = `calendar-heading-${uniqueId}`;
-    return (()=>{
-        var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$3.nextSibling, _el$7 = _el$6.nextSibling, _el$8 = _el$7.firstChild, _el$9 = _el$8.firstChild, _el$0 = _el$2.nextSibling, _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$1.nextSibling;
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)((node)=>{
-            rootRef = node;
-            if ("function" == typeof local.ref) local.ref(node);
-        }, _el$);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, ()=>({
-                class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Root.base, isCalendarDisabled() && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Root.flag.disabled, local.class, local.className)
-            }), {
-            "data-slot": "calendar",
-            get ["data-selection-mode"] () {
-                return selectionMode();
-            },
-            get ["data-disabled"] () {
-                return isCalendarDisabled() ? "true" : "false";
-            },
-            get ["data-theme"] () {
-                return local.dataTheme;
-            },
-            get style () {
-                return local.style;
-            },
-            get ["aria-disabled"] () {
-                return isCalendarDisabled() ? "true" : void 0;
-            }
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Header.base
-            }), {
-            "data-slot": "calendar-header"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Nav.base
-            }), {
-            "data-slot": "calendar-nav"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.NavButton.base
-            }), {
-            "data-slot": "calendar-nav-button",
-            "aria-label": "Previous month",
-            onClick: ()=>navigateMonth(-1),
-            get disabled () {
-                return isCalendarDisabled() || !navigation.canNavigatePrevious();
-            },
-            get ["data-disabled"] () {
-                return isCalendarDisabled() || !navigation.canNavigatePrevious() ? "true" : void 0;
-            }
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$5, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.NavButtonIcon.base
-            }), {
-            "data-slot": "calendar-nav-button-icon",
-            viewBox: "0 0 24 24",
-            "aria-hidden": "true",
-            fill: "none",
-            stroke: "currentColor",
-            "stroke-width": "2",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-        }), true, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$6, "id", headingId);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$6, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Heading.base
-            }), {
-            "data-slot": "calendar-heading",
-            "aria-live": "polite"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, ()=>calendarState.monthFormatter().format(navigation.visibleMonth()));
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$7, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Nav.base
-            }), {
-            "data-slot": "calendar-nav"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$8, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.NavButton.base
-            }), {
-            "data-slot": "calendar-nav-button",
-            "aria-label": "Next month",
-            onClick: ()=>navigateMonth(1),
-            get disabled () {
-                return isCalendarDisabled() || !navigation.canNavigateNext();
-            },
-            get ["data-disabled"] () {
-                return isCalendarDisabled() || !navigation.canNavigateNext() ? "true" : void 0;
-            }
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$9, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.NavButtonIcon.base
-            }), {
-            "data-slot": "calendar-nav-button-icon",
-            viewBox: "0 0 24 24",
-            "aria-hidden": "true",
-            fill: "none",
-            stroke: "currentColor",
-            "stroke-width": "2",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-        }), true, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$0, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Grid.base
-            }), {
-            "data-slot": "calendar-grid",
-            role: "grid",
-            "aria-labelledby": headingId,
-            get ["aria-readonly"] () {
-                return isCalendarDisabled() ? "true" : void 0;
-            }
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$1, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.GridHeader.base
-            }), {
-            "data-slot": "calendar-grid-header",
-            role: "rowgroup"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$10, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.GridRow.base
-            }), {
-            "data-slot": "calendar-grid-row",
-            role: "row"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$10, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
-            get each () {
-                return calendarState.weekdayLabels();
-            },
-            children: (label)=>(()=>{
-                    var _el$12 = _tmpl$2();
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$12, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.HeaderCell.base
-                        }), {
-                        "data-slot": "calendar-header-cell",
-                        role: "columnheader"
-                    }), false, true);
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$12, label);
-                    return _el$12;
-                })()
+    });
+    const calendarClasses = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("cally", !local.asInput && "bg-base-100 border border-base-300 shadow-lg rounded-box", "[&_[slot=heading]]:text-xs [&_[slot=heading]]:font-medium", "[&_.cally-month-header]:text-xs [&_.cally-year]:text-xs", "text-sm", local.asInput && "w-full max-w-full", "[&_table]:w-full [&_td]:p-1 [&_th]:p-1", "[&_button]:p-1 [&_button]:min-h-0 [&_button]:h-auto", local.class, local.className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "text-base [&_[slot=heading]]:text-sm": "lg" === local.size,
+            "text-sm [&_[slot=heading]]:text-xs": "md" === local.size || !local.size,
+            "text-xs [&_[slot=heading]]:text-xs [&_button]:text-xs": "sm" === local.size,
+            "text-xs [&_button]:text-xs": "xs" === local.size
+        }));
+    const inputClasses = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("input input-bordered cursor-pointer", "w-72", (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "input-lg w-80": "lg" === local.size,
+            "input-md w-72": "md" === local.size || !local.size,
+            "input-sm w-64": "sm" === local.size,
+            "input-xs w-56": "xs" === local.size,
+            "input-disabled cursor-not-allowed": local.disabled
+        }));
+    const dropdownClasses = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("absolute left-0 top-full mt-1 bg-base-100 rounded-box shadow-lg z-50 p-2", "w-auto", (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "w-80": "lg" === local.size,
+            "w-72": "md" === local.size || !local.size,
+            "w-64": "sm" === local.size,
+            "w-56": "xs" === local.size
         }));
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$11, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.GridBody.base
-            }), {
-            "data-slot": "calendar-grid-body",
-            role: "rowgroup",
-            onMouseLeave: ()=>local.onDayHover?.(void 0)
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$11, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
-            get each () {
-                return calendarState.calendarWeeks();
-            },
-            children: (week)=>(()=>{
-                    var _el$13 = _tmpl$3();
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$13, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.GridRow.base
-                        }), {
-                        "data-slot": "calendar-grid-row",
-                        role: "row"
-                    }), false, true);
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$13, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
-                        each: week,
-                        children: (date)=>{
-                            const cellState = calendarState.getCellState(date);
-                            const isoDate = (0, __WEBPACK_EXTERNAL_MODULE__hooks_date_index_js_897f0efe__.toISODate)(date);
-                            return (()=>{
-                                var _el$14 = _tmpl$3();
-                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$14, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                        class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.DayWrapper.base
-                                    }), {
-                                    "data-slot": "calendar-day-wrapper",
-                                    role: "presentation"
-                                }), false, true);
-                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$14, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
-                                    get when () {
-                                        return showOutsideDays() || !cellState.isOutsideMonth;
-                                    },
-                                    get fallback () {
-                                        return (()=>{
-                                            var _el$17 = _tmpl$2();
-                                            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$17, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                                    class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.DayPlaceholder.base
-                                                }), {
-                                                "data-slot": "calendar-day-placeholder",
-                                                "aria-hidden": "true"
-                                            }), false, false);
-                                            return _el$17;
-                                        })();
-                                    },
-                                    get children () {
-                                        var _el$15 = _tmpl$4(), _el$16 = _el$15.firstChild;
-                                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$15, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                                class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.base, cellState.isSelected && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.selected, cellState.isRangeStart && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.rangeStart, cellState.isRangeEnd && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.rangeEnd, cellState.isInCommittedRange && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.inRange, cellState.isInPreviewRange && !cellState.isInCommittedRange && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.inPreviewRange, cellState.isToday && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.today, cellState.isOutsideMonth && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.outsideMonth, cellState.isDisabled && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.disabled, cellState.isUnavailable && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.unavailable, cellState.isFocused && __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Cell.flag.focused)
-                                            }), {
-                                            "data-slot": "calendar-cell",
-                                            "data-date": isoDate,
-                                            get ["data-selected"] () {
-                                                return cellState.isSelected ? "true" : "false";
-                                            },
-                                            get ["data-range-start"] () {
-                                                return cellState.isRangeStart ? "true" : "false";
-                                            },
-                                            get ["data-range-end"] () {
-                                                return cellState.isRangeEnd ? "true" : "false";
-                                            },
-                                            get ["data-in-range"] () {
-                                                return cellState.isInCommittedRange ? "true" : "false";
-                                            },
-                                            get ["data-in-preview-range"] () {
-                                                return cellState.isInPreviewRange ? "true" : "false";
-                                            },
-                                            get ["data-today"] () {
-                                                return cellState.isToday ? "true" : "false";
-                                            },
-                                            get ["data-outside-month"] () {
-                                                return cellState.isOutsideMonth ? "true" : "false";
-                                            },
-                                            get ["data-disabled"] () {
-                                                return cellState.isDisabled ? "true" : "false";
-                                            },
-                                            get ["data-unavailable"] () {
-                                                return cellState.isUnavailable ? "true" : "false";
-                                            },
-                                            role: "gridcell",
-                                            get ["aria-label"] () {
-                                                return calendarState.dayLabelFormatter().format(date);
-                                            },
-                                            get ["aria-selected"] () {
-                                                return cellState.isAriaSelected ? "true" : "false";
-                                            },
-                                            get ["aria-disabled"] () {
-                                                return cellState.isDisabled ? "true" : "false";
-                                            },
-                                            get disabled () {
-                                                return cellState.isDisabled;
-                                            },
-                                            get tabIndex () {
-                                                return cellState.isFocused ? 0 : -1;
-                                            },
-                                            onClick: ()=>selectDate(date),
-                                            onFocus: ()=>navigation.setFocusedDate(date),
-                                            onMouseEnter: ()=>{
-                                                if (cellState.isDisabled) return;
-                                                local.onDayHover?.(date);
-                                            },
-                                            onKeyDown: handleCellKeyDown
-                                        }), false, true);
-                                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$16, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                                class: __WEBPACK_EXTERNAL_MODULE__Calendar_classes_js_c12a72e0__.CLASSES.Day.base
-                                            }), {
-                                            "data-slot": "calendar-day"
-                                        }), false, true);
-                                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$16, ()=>date.getDate());
-                                        return _el$15;
-                                    }
-                                }));
-                                return _el$14;
-                            })();
-                        }
-                    }));
-                    return _el$13;
-                })()
+    const ArrowLeftIcon = ()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__icon_Icon_js_f8a6327a__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            name: "icon-[mdi-light--chevron-left]",
+            width: 20,
+            height: 20
+        }, {
+            "aria-label": "Previous",
+            slot: "previous"
         }));
+    const ArrowRightIcon = ()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__icon_Icon_js_f8a6327a__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            name: "icon-[mdi-light--chevron-right]",
+            width: 20,
+            height: 20
+        }, {
+            "aria-label": "Next",
+            slot: "next"
+        }));
+    const formatDisplayDate = (value)=>{
+        if (!value) return local.placeholder || "Pick a date";
+        try {
+            const date = new Date(value);
+            return date.toLocaleDateString();
+        } catch  {
+            return local.placeholder || "Pick a date";
+        }
+    };
+    if (local.asInput) return (()=>{
+        var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+        _el$2.$$click = ()=>setIsOpen(!isOpen());
+        var _ref$ = inputRef;
+        "function" == typeof _ref$ ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$, _el$2) : inputRef = _el$2;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$2, "id", inputId);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>formatDisplayDate(selectedValue()));
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!isOpen());
+            return ()=>_c$() && (()=>{
+                    var _el$3 = _tmpl$2(), _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild;
+                    _el$3.$$click = (e)=>e.stopPropagation();
+                    var _ref$2 = calendarRef;
+                    "function" == typeof _ref$2 ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$2, _el$5) : calendarRef = _el$5;
+                    _el$5._$owner = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.getOwner)();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$5, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(ArrowLeftIcon, {}), _el$6);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$5, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(ArrowRightIcon, {}), _el$6);
+                    _el$6._$owner = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.getOwner)();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+                        var _v$5 = dropdownClasses(), _v$6 = calendarClasses();
+                        _v$5 !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$3, _p$.e = _v$5);
+                        _v$6 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$5, _p$.t = _v$6);
+                        return _p$;
+                    }, {
+                        e: void 0,
+                        t: void 0
+                    });
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>_el$5.value = selectedValue());
+                    return _el$3;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$2 = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!isOpen());
+            return ()=>_c$2() && (()=>{
+                    var _el$7 = _tmpl$3();
+                    _el$7.$$click = ()=>setIsOpen(false);
+                    return _el$7;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.children, null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+            var _v$ = local.dataTheme, _v$2 = local.style, _v$3 = inputClasses(), _v$4 = local.disabled;
+            _v$ !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$, "data-theme", _p$.e = _v$);
+            _p$.t = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.style)(_el$, _v$2, _p$.t);
+            _v$3 !== _p$.a && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$2, _p$.a = _v$3);
+            _v$4 !== _p$.o && (_el$2.disabled = _p$.o = _v$4);
+            return _p$;
+        }, {
+            e: void 0,
+            t: void 0,
+            a: void 0,
+            o: void 0
+        });
         return _el$;
     })();
+    return (()=>{
+        var _el$8 = _tmpl$4(), _el$9 = _el$8.firstChild, _el$0 = _el$9.firstChild;
+        var _ref$3 = calendarRef;
+        "function" == typeof _ref$3 ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$3, _el$9) : calendarRef = _el$9;
+        _el$9._$owner = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.getOwner)();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$9, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(ArrowLeftIcon, {}), _el$0);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$9, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(ArrowRightIcon, {}), _el$0);
+        _el$0._$owner = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.getOwner)();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$8, ()=>local.children, null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+            var _v$7 = local.dataTheme, _v$8 = local.style, _v$9 = calendarClasses();
+            _v$7 !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$8, "data-theme", _p$.e = _v$7);
+            _p$.t = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.style)(_el$8, _v$8, _p$.t);
+            _v$9 !== _p$.a && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$9, _p$.a = _v$9);
+            return _p$;
+        }, {
+            e: void 0,
+            t: void 0,
+            a: void 0
+        });
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>_el$9.value = selectedValue());
+        return _el$8;
+    })();
 };
 const Calendar = Calendar_Calendar;
+(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
+    "click"
+]);
 export { Calendar as default };

package/dist/components/calendar/index.d.ts

@@ -1 +1 @@
-export { default, type CalendarProps, type CalendarWeekdayFormat, type CalendarSelectionMode, type CalendarDaySelectHandler, type CalendarDayHoverHandler, } from "./Calendar";
+export { default, type CalendarProps } from "./Calendar";