@ceed/cds 0.0.187-treeshaking.2 → 0.0.187

package/dist/components/Calendar/Calendar.js

@@ -1,334 +0,0 @@
-'use client';
-import React__default, { forwardRef, useMemo, Fragment } from 'react';
-import { styled } from '@mui/joy';
-import PreviousIcon from '../../external/@mui/icons-material/esm/ChevronLeft.js';
-import NextIcon from '../../external/@mui/icons-material/esm/ChevronRight.js';
-import { motion, AnimatePresence } from 'framer-motion';
-import { Button } from '../Button/Button.js';
-import { Typography } from '../Typography/Typography.js';
-import { getCalendarDates, getWeekdayNames, getMonthNameFromIndex } from './utils/index.js';
-import { IconButton } from '../IconButton/IconButton.js';
-import { useCalendarProps } from './hooks/use-calendar-props.js';
-import { useCalendar } from './hooks/use-calendar.js';
-
-const CalendarRoot = styled("div", {
-    name: "Calendar",
-    slot: "root",
-})({
-    maxWidth: "264px",
-});
-const CalendarHeader = styled("div", {
-    name: "Calendar",
-    slot: "calendarHeader",
-})(({ theme }) => ({
-    display: "flex",
-    justifyContent: "space-between",
-    alignItems: "center",
-    padding: theme.spacing(2),
-}));
-const CalendarViewContainer = styled("div", {
-    name: "Calendar",
-    slot: "viewContainer",
-    shouldForwardProp: (prop) => prop !== "calendarType",
-})(({ theme, calendarType }) => ({
-    paddingLeft: theme.spacing(2),
-    paddingRight: theme.spacing(2),
-    position: "relative",
-    overflow: "hidden",
-    minHeight: calendarType === "datePicker" ? "250px" : "unset",
-}));
-const CalendarViewTable = styled(motion.table, {
-    name: "Calendar",
-    slot: "viewTable",
-})(({ theme }) => ({
-    borderSpacing: 0,
-    "& td, & th": {
-        padding: 0,
-    },
-    "& th": {
-        paddingTop: theme.spacing(2),
-        paddingBottom: theme.spacing(2),
-    },
-}));
-const CalendarWeekHeaderContainer = styled("thead", {
-    name: "Calendar",
-    slot: "weekHeaderContainer",
-})({});
-const CalendarDayPickerContainer = styled("tbody", {
-    name: "Calendar",
-    slot: "dayPickerContainer",
-})({});
-const CalendarSwitchViewButton = styled(Button, {
-    name: "Calendar",
-    slot: "switchViewButton",
-})(({ ownerState }) => [
-    ownerState.view === "month" && {
-        pointerEvents: "none",
-    },
-]);
-const CalendarDayCell = styled("td", {
-    name: "Calendar",
-    slot: "dayCell",
-})(({ theme }) => ({
-    // aria-current=date === range에 포함된 버튼
-    "&[aria-current=date]": {
-        position: "relative",
-        "& button[aria-current=date]:not([aria-selected=true]):not(:hover):not(:active)": {
-            backgroundColor: `rgb(${theme.palette.primary.lightChannel})`,
-        },
-        '& + td[aria-hidden] + td[aria-current="date"]::before': {
-            content: '""',
-            position: "absolute",
-            top: 0,
-            left: "-10px",
-            bottom: 0,
-            width: "16px",
-            backgroundColor: `rgb(${theme.palette.primary.lightChannel})`,
-            zIndex: -1,
-        },
-    },
-}));
-const CalendarMonthCell = styled("td", {
-    name: "Calendar",
-    slot: "monthCell",
-})(({ theme }) => ({
-    // aria-current=date === range에 포함된 버튼
-    "&[aria-current=date]": {
-        position: "relative",
-        "& button[aria-current=date]:not([aria-selected=true]):not(:hover):not(:active)": {
-            backgroundColor: `rgb(${theme.palette.primary.lightChannel})`,
-        },
-        '& + td[aria-hidden] + td[aria-current="date"]::before': {
-            content: '""',
-            position: "absolute",
-            top: 0,
-            left: "-10px",
-            bottom: 0,
-            width: "16px",
-            backgroundColor: `rgb(${theme.palette.primary.lightChannel})`,
-            zIndex: -1,
-        },
-    },
-}));
-const CalendarMonth = styled(Button, {
-    name: "Calendar",
-    slot: "month",
-    shouldForwardProp: (prop) => prop !== "isSelected",
-})(({ theme, isSelected, disabled }) => [
-    {
-        width: "59px",
-        // height: "32px",
-        textAlign: "center",
-        "&:hover": {
-            color: theme.palette.primary.softColor,
-            backgroundColor: theme.palette.primary.softHoverBg,
-        },
-        "&:active": {
-            color: theme.palette.primary.softColor,
-            backgroundColor: theme.palette.primary.softActiveBg,
-        },
-    },
-    isSelected && {
-        backgroundColor: theme.palette.primary.solidBg,
-        color: theme.palette.primary.solidColor,
-        "&:hover": {
-            color: theme.palette.primary.solidColor,
-            backgroundColor: theme.palette.primary.solidHoverBg,
-        },
-        "&:active": {
-            color: theme.palette.primary.solidColor,
-            backgroundColor: theme.palette.primary.solidActiveBg,
-        },
-    },
-    disabled && {
-        color: theme.palette.neutral.solidDisabledColor,
-        backgroundColor: theme.palette.neutral.solidDisabledBg,
-    },
-]);
-const CalendarDay = styled(Button, {
-    name: "Calendar",
-    slot: "day",
-    shouldForwardProp: (prop) => !["isToday", "isSelected"].includes(prop),
-})(({ theme, isToday, isSelected, disabled }) => [
-    {
-        width: "32px",
-        height: "32px",
-        textAlign: "center",
-        "&:hover": {
-            color: theme.palette.primary.softColor,
-            backgroundColor: theme.palette.primary.softHoverBg,
-        },
-        "&:active": {
-            color: theme.palette.primary.softColor,
-            backgroundColor: theme.palette.primary.softActiveBg,
-        },
-    },
-    // NOTE: enabled, disabled 일때만 border 적용
-    isToday &&
-        !isSelected && {
-        "&:not([aria-current=date]):not(:hover)": {
-            border: `1px solid ${theme.palette.neutral.outlinedBorder}`,
-        },
-    },
-    isSelected && {
-        backgroundColor: theme.palette.primary.solidBg,
-        color: theme.palette.primary.solidColor,
-        "&:hover": {
-            color: theme.palette.primary.solidColor,
-            backgroundColor: theme.palette.primary.solidHoverBg,
-        },
-        "&:active": {
-            color: theme.palette.primary.solidColor,
-            backgroundColor: theme.palette.primary.solidActiveBg,
-        },
-    },
-    disabled && {
-        color: theme.palette.neutral.solidDisabledColor,
-        backgroundColor: theme.palette.neutral.solidDisabledBg,
-    },
-]);
-const variants = {
-    enter: (direction) => {
-        return {
-            x: direction > 0 ? 300 : -300,
-            opacity: 0,
-        };
-    },
-    center: {
-        position: "relative",
-        zIndex: 1,
-        x: 0,
-        opacity: 1,
-    },
-    exit: (direction) => {
-        return {
-            position: "absolute",
-            zIndex: 0,
-            x: direction < 0 ? 300 : -300,
-            opacity: 0,
-        };
-    },
-};
-const swipeConfidenceThreshold = 10000;
-const swipePower = (offset, velocity) => {
-    return Math.abs(offset) * velocity;
-};
-const PickerDays = (props) => {
-    // prop destruction
-    const { ownerState } = props;
-    // lib hooks
-    const { getPickerDayProps, getDayCellProps } = useCalendar(ownerState);
-    // state, ref, querystring hooks
-    // form hooks
-    // query hooks
-    // calculated values
-    const calendarDates = useMemo(() => getCalendarDates(ownerState.viewMonth), [ownerState.viewMonth]);
-    const weekdayNames = useMemo(() => getWeekdayNames(ownerState.locale || "default"), [ownerState.locale]);
-    // effects
-    // handlers
-    return (React__default.createElement(CalendarViewContainer, { calendarType: "datePicker" },
-        React__default.createElement(AnimatePresence, { initial: false, custom: ownerState.direction },
-            React__default.createElement(CalendarViewTable
-            // #region framer-motion
-            , { 
-                // #region framer-motion
-                key: `${ownerState.viewMonth.toString()}_${ownerState.direction}`, custom: ownerState.direction, variants: variants, initial: "enter", animate: "center", exit: "exit", transition: {
-                    x: { type: "spring", stiffness: 300, damping: 30 },
-                    opacity: { duration: 0.2 },
-                }, drag: "x", dragConstraints: { left: 0, right: 0 }, dragElastic: 1, onDragEnd: (e, { offset, velocity }) => {
-                    const swipe = swipePower(offset.x, velocity.x);
-                    if (swipe < -1e4) {
-                        const date = new Date(ownerState.viewMonth || new Date());
-                        date.setMonth(date.getMonth() + 1);
-                        ownerState.onMonthChange?.(date);
-                    }
-                    else if (swipe > swipeConfidenceThreshold) {
-                        const date = new Date(ownerState.viewMonth || new Date());
-                        date.setMonth(date.getMonth() - 1);
-                        ownerState.onMonthChange?.(date);
-                    }
-                } },
-                React__default.createElement(CalendarWeekHeaderContainer, null,
-                    React__default.createElement("tr", null, weekdayNames.map((name, i) => (React__default.createElement(Fragment, { key: `${ownerState.viewMonth}_${name}_${i}` },
-                        React__default.createElement("th", null,
-                            React__default.createElement(Typography, { level: "body-xs", textAlign: "center" }, name)),
-                        i < 6 && (React__default.createElement("th", { style: { width: 4 }, "aria-hidden": "true", "aria-description": "cell-gap" }))))))),
-                React__default.createElement(CalendarDayPickerContainer, null, calendarDates.map((weekDates, rowIndex) => (React__default.createElement(Fragment, { key: `${ownerState.viewMonth}_${rowIndex}` },
-                    React__default.createElement("tr", null, weekDates.map((date, i) => date ? (React__default.createElement(Fragment, { key: i },
-                        React__default.createElement(CalendarDayCell, { ...getDayCellProps(date) },
-                            React__default.createElement(CalendarDay, { size: "sm", variant: "plain", color: "neutral", ...getPickerDayProps(date) }, date)),
-                        i < 6 && (React__default.createElement("td", { "aria-hidden": "true", "aria-description": "cell-gap" })))) : (React__default.createElement(Fragment, { key: i },
-                        React__default.createElement("td", null),
-                        i < 6 && (React__default.createElement("td", { "aria-hidden": "true", "aria-description": "cell-gap" })))))),
-                    rowIndex < calendarDates.length - 1 && (React__default.createElement("tr", { "aria-hidden": "true", "aria-description": "row-gap" },
-                        React__default.createElement("td", { colSpan: 13, style: { height: 4 } })))))))))));
-};
-const PickerMonths = (props) => {
-    const { ownerState } = props;
-    const { getPickerMonthProps, getMonthCellProps } = useCalendar(ownerState);
-    const chunkedMonths = Array.from({ length: 12 }, (_, i) => i).reduce((acc, month) => {
-        if (acc[acc.length - 1].length === 4) {
-            acc.push([]);
-        }
-        acc[acc.length - 1].push(month);
-        return acc;
-    }, [[]]);
-    const isMonthPicker = !ownerState.views?.find((view) => view === "day");
-    return (React__default.createElement(CalendarViewContainer, { calendarType: isMonthPicker ? "monthPicker" : "datePicker" },
-        React__default.createElement(AnimatePresence, { initial: false, custom: ownerState.direction },
-            React__default.createElement(CalendarViewTable
-            // #region framer-motion
-            , { 
-                // #region framer-motion
-                key: `${ownerState.viewMonth.getFullYear()}_${ownerState.direction}`, custom: ownerState.direction, variants: variants, initial: "enter", animate: "center", exit: "exit", transition: {
-                    x: { type: "spring", stiffness: 300, damping: 30 },
-                    opacity: { duration: 0.2 },
-                }, drag: "x", dragConstraints: { left: 0, right: 0 }, dragElastic: 1, onDragEnd: (e, { offset, velocity }) => {
-                    const swipe = swipePower(offset.x, velocity.x);
-                    if (swipe < -1e4) {
-                        const date = new Date(ownerState.viewMonth || new Date());
-                        date.setMonth(date.getMonth() + 1);
-                        ownerState.onMonthChange?.(date);
-                    }
-                    else if (swipe > swipeConfidenceThreshold) {
-                        const date = new Date(ownerState.viewMonth || new Date());
-                        date.setMonth(date.getMonth() - 1);
-                        ownerState.onMonthChange?.(date);
-                    }
-                } },
-                React__default.createElement("tbody", null, chunkedMonths.map((months, i) => (React__default.createElement(Fragment, { key: i },
-                    React__default.createElement("tr", null, months.map((monthIndex, j) => (React__default.createElement(Fragment, { key: monthIndex },
-                        React__default.createElement(CalendarMonthCell, { ...getMonthCellProps(monthIndex) },
-                            React__default.createElement(CalendarMonth, { size: "sm", variant: "plain", color: "neutral", ...getPickerMonthProps(monthIndex) }, getMonthNameFromIndex(monthIndex, ownerState.locale))),
-                        j < 3 && (React__default.createElement("td", { style: { width: 4 }, "aria-hidden": "true", "aria-description": "cell-gap" })))))),
-                    i < chunkedMonths.length - 1 && (React__default.createElement("tr", { "aria-hidden": "true", "aria-description": "row-gap" },
-                        React__default.createElement("td", { colSpan: 7, style: { height: 4 } })))))))))));
-};
-/**
- * @see https://mui.com/x/api/date-pickers/date-calendar/ 인터페이스 참고
- */
-const Calendar = forwardRef((inProps, ref) => {
-    // prop destruction
-    const [props, ownerState] = useCalendarProps(inProps);
-    const { value, defaultValue, onChange, locale, onViewChange, onMonthChange, view, views, rangeSelection, minDate, maxDate, disableFuture, disablePast, ...others } = props;
-    // lib hooks
-    const { calendarTitle, onPrev, onNext } = useCalendar(ownerState);
-    // state, ref, querystring hooks
-    // form hooks
-    // query hooks
-    // calculated values
-    // effects
-    // handlers
-    return (React__default.createElement(CalendarRoot, { ref: ref, ...others },
-        React__default.createElement(CalendarHeader, null,
-            React__default.createElement(IconButton, { size: "sm", onClick: onPrev, "aria-label": `Previous ${view === "day" ? "Month" : "Year"}` },
-                React__default.createElement(PreviousIcon, null)),
-            React__default.createElement(CalendarSwitchViewButton, { ownerState: ownerState, variant: "plain", color: "neutral", onClick: onViewChange, "aria-label": "Switch Calendar View" }, calendarTitle),
-            React__default.createElement(IconButton, { size: "sm", onClick: onNext, "aria-label": `Next ${view === "day" ? "Month" : "Year"}` },
-                React__default.createElement(NextIcon, null))),
-        view === "day" && React__default.createElement(PickerDays, { ownerState: ownerState }),
-        view === "month" && React__default.createElement(PickerMonths, { ownerState: ownerState })));
-});
-Calendar.displayName = "Calendar";
-
-export { Calendar };

package/dist/components/Calendar/hooks/use-calendar-props.js

@@ -1,75 +0,0 @@
-'use client';
-import { useState, useCallback, useMemo } from 'react';
-import { useThemeProps } from '@mui/joy';
-
-const resolveView = (view, views) => {
-    return views.includes(view) ? view : views[0];
-};
-const useCalendarProps = (inProps) => {
-    const [uncontrolledView, setUncontrolledView] = useState(() => resolveView(inProps.view || "day", inProps.views || ["day", "month"]));
-    const [uncontrolledValue, setUncontrolledValue] = useState(inProps.defaultValue);
-    const [viewMonth, setViewMonth] = useState(() => {
-        const today = new Date();
-        today.setDate(1);
-        today.setHours(0, 0, 0, 0);
-        return inProps.value?.[0] || inProps.defaultValue?.[0] || today;
-    });
-    const [[page, direction], setPage] = useState([0, 0]);
-    const resolvedView = inProps.view ?? uncontrolledView;
-    const paginate = (newDirection) => {
-        setPage([page + newDirection, newDirection]);
-    };
-    const handleViewMonthChange = useCallback((newMonth) => {
-        setViewMonth(newMonth);
-        if (resolvedView === "month") {
-            if (viewMonth.getFullYear() !== newMonth.getFullYear()) {
-                paginate(newMonth > viewMonth ? 1 : -1);
-            }
-        }
-        else {
-            paginate(newMonth > viewMonth ? 1 : -1);
-        }
-        inProps.onMonthChange?.(newMonth);
-    }, [inProps.onMonthChange, viewMonth, resolvedView]);
-    const props = useThemeProps({
-        props: {
-            locale: "default",
-            views: ["day", "month"],
-            view: resolvedView,
-            value: inProps.value ?? uncontrolledValue,
-            ...inProps,
-            // overrides
-            onChange: inProps.value
-                ? // Controlled
-                    inProps.onChange
-                : // Uncontrolled
-                    (value) => {
-                        setUncontrolledValue(value);
-                        inProps.onChange?.(value);
-                    },
-            onMonthChange: handleViewMonthChange,
-            onViewChange: () => {
-                const newView = resolvedView === "month" ? "day" : "month";
-                const isAllowedView = !inProps.views
-                    ? true
-                    : inProps.views.includes(newView);
-                if (!isAllowedView || inProps.view === newView)
-                    return;
-                if (inProps.onViewChange) {
-                    inProps.onViewChange(newView);
-                }
-                else {
-                    setUncontrolledView(newView);
-                }
-            },
-        },
-        name: "Calendar",
-    });
-    /**
-     * For ownerState
-     */
-    const ownerState = useMemo(() => ({ ...props, viewMonth, direction }), [props, viewMonth, direction]);
-    return [props, ownerState];
-};
-
-export { useCalendarProps };

package/dist/components/Calendar/hooks/use-calendar.js

@@ -1,248 +0,0 @@
-'use client';
-import { useState, useCallback } from 'react';
-import { getYearName, getMonthName, isWithinRange, isSameDay, isToday, isSameMonth } from '../utils/index.js';
-
-const useCalendar = (ownerState) => {
-    const [hoverDay, setHoverDay] = useState(null);
-    const [hoverMonth, setHoverMonth] = useState(null);
-    return {
-        calendarTitle: ownerState.view === "month"
-            ? getYearName(ownerState.viewMonth, ownerState.locale || "default")
-            : getMonthName(ownerState.viewMonth, ownerState.locale || "default"),
-        onPrev: useCallback(() => {
-            if (ownerState.view === "day") {
-                const prevMonth = new Date(ownerState.viewMonth || new Date());
-                prevMonth.setMonth(prevMonth.getMonth() - 1);
-                ownerState.onMonthChange?.(prevMonth);
-            }
-            else if (ownerState.view === "month") {
-                const prevYear = new Date(ownerState.viewMonth || new Date());
-                prevYear.setFullYear(prevYear.getFullYear() - 1);
-                ownerState.onMonthChange?.(prevYear);
-            }
-        }, [ownerState.onMonthChange, ownerState.viewMonth, ownerState.view]),
-        onNext: useCallback(() => {
-            if (ownerState.view === "day") {
-                const nextMonth = new Date(ownerState.viewMonth || new Date());
-                nextMonth.setMonth(nextMonth.getMonth() + 1);
-                ownerState.onMonthChange?.(nextMonth);
-            }
-            else if (ownerState.view === "month") {
-                const nextYear = new Date(ownerState.viewMonth || new Date());
-                nextYear.setFullYear(nextYear.getFullYear() + 1);
-                ownerState.onMonthChange?.(nextYear);
-            }
-        }, [ownerState.onMonthChange, ownerState.viewMonth, ownerState.view]),
-        getDayCellProps: useCallback((day) => {
-            const thisDay = new Date(ownerState.viewMonth || new Date());
-            thisDay.setHours(0, 0, 0, 0);
-            thisDay.setDate(day);
-            const inRange = ownerState.rangeSelection &&
-                ownerState.value &&
-                ownerState.value[0] &&
-                // NOTE: hover day is not included in the range
-                ((hoverDay &&
-                    isWithinRange(ownerState.value[0], hoverDay, thisDay)) ||
-                    // NOTE: Selected range is included in the range
-                    (ownerState.value[1] &&
-                        isWithinRange(ownerState.value[0], ownerState.value[1], thisDay)));
-            return {
-                "aria-label": thisDay.toLocaleDateString(),
-                "aria-current": inRange ? "date" : undefined,
-            };
-        }, [
-            ownerState.rangeSelection,
-            ownerState.value,
-            ownerState.viewMonth,
-            hoverDay,
-        ]),
-        getMonthCellProps: useCallback((monthIndex) => {
-            const thisMonth = new Date(ownerState.viewMonth || new Date());
-            thisMonth.setDate(1);
-            thisMonth.setHours(0, 0, 0, 0);
-            thisMonth.setMonth(monthIndex);
-            const isMonthRangeSelection = !ownerState.views?.find((view) => view === "day") &&
-                ownerState.rangeSelection;
-            const inRange = isMonthRangeSelection &&
-                ownerState.value &&
-                ownerState.value[0] &&
-                // NOTE: hover day is not included in the range
-                ((hoverMonth &&
-                    isWithinRange(ownerState.value[0], hoverMonth, thisMonth)) ||
-                    // NOTE: Selected range is included in the range
-                    (ownerState.value[1] &&
-                        isWithinRange(ownerState.value[0], ownerState.value[1], thisMonth)));
-            return {
-                "aria-label": thisMonth.toLocaleDateString(),
-                "aria-current": inRange ? "date" : undefined,
-            };
-        }, [
-            ownerState.rangeSelection,
-            ownerState.value,
-            ownerState.viewMonth,
-            hoverMonth,
-        ]),
-        getPickerDayProps: useCallback((day) => {
-            const thisDay = new Date(ownerState.viewMonth || new Date());
-            thisDay.setHours(0, 0, 0, 0);
-            thisDay.setDate(day);
-            const isSelected = !!ownerState.value &&
-                (isSameDay(thisDay, ownerState.value[0]) ||
-                    (ownerState.value[1] && isSameDay(thisDay, ownerState.value[1])));
-            const inRange = ownerState.rangeSelection &&
-                ownerState.value &&
-                ownerState.value[0] &&
-                // NOTE: hover day is not included in the range
-                ((hoverDay &&
-                    isWithinRange(ownerState.value[0], hoverDay, thisDay)) ||
-                    // NOTE: Selected range is included in the range
-                    (ownerState.value[1] &&
-                        isWithinRange(ownerState.value[0], ownerState.value[1], thisDay)));
-            const handleDayClick = () => {
-                if (ownerState.rangeSelection) {
-                    if (!ownerState.value) {
-                        ownerState.onChange?.([thisDay, undefined]);
-                    }
-                    else if (ownerState.value[0] && !ownerState.value[1]) {
-                        ownerState.onChange?.([
-                            new Date(Math.min(ownerState.value[0].getTime(), thisDay.getTime())),
-                            new Date(Math.max(ownerState.value[0].getTime(), thisDay.getTime())),
-                        ]);
-                    }
-                    else {
-                        ownerState.onChange?.([thisDay, undefined]);
-                    }
-                }
-                else {
-                    ownerState.onChange?.([thisDay, undefined]);
-                }
-                setHoverDay(null);
-            };
-            return {
-                isToday: isToday(thisDay),
-                isSelected,
-                onClick: handleDayClick,
-                onMouseEnter: ownerState.rangeSelection &&
-                    ownerState.value?.[0] &&
-                    !ownerState.value?.[1]
-                    ? () => setHoverDay(thisDay)
-                    : undefined,
-                disabled: (ownerState.minDate && thisDay < ownerState.minDate) ||
-                    (ownerState.maxDate && thisDay > ownerState.maxDate) ||
-                    (ownerState.disableFuture && thisDay > new Date()) ||
-                    (ownerState.disablePast &&
-                        thisDay <
-                            (() => {
-                                const today = new Date();
-                                today.setHours(0, 0, 0, 0);
-                                return today;
-                            })()),
-                tabIndex: -1,
-                "aria-label": thisDay.toLocaleDateString(),
-                "aria-selected": isSelected ? "true" : undefined,
-                "aria-current": inRange ? "date" : undefined,
-            };
-        }, [
-            ownerState.onChange,
-            ownerState.value,
-            ownerState.viewMonth,
-            ownerState.rangeSelection,
-            ownerState.minDate,
-            ownerState.maxDate,
-            ownerState.disableFuture,
-            ownerState.disablePast,
-            hoverDay,
-        ]),
-        getPickerMonthProps: useCallback((monthIndex) => {
-            const thisMonth = new Date(ownerState.viewMonth || new Date());
-            thisMonth.setDate(1);
-            thisMonth.setHours(0, 0, 0, 0);
-            thisMonth.setMonth(monthIndex);
-            const isMonthPicker = !ownerState.views?.find((view) => view === "day");
-            const isMonthRangeSelection = isMonthPicker && ownerState.rangeSelection;
-            const isSelected = !!ownerState.value &&
-                (isSameMonth(thisMonth, ownerState.value[0]) ||
-                    (ownerState.value[1] &&
-                        isSameMonth(thisMonth, ownerState.value[1])));
-            const inRange = isMonthRangeSelection &&
-                ownerState.value &&
-                ownerState.value[0] &&
-                // NOTE: hover day is not included in the range
-                ((hoverMonth &&
-                    isWithinRange(ownerState.value[0], hoverMonth, thisMonth)) ||
-                    // NOTE: Selected range is included in the range
-                    (ownerState.value[1] &&
-                        isWithinRange(ownerState.value[0], ownerState.value[1], thisMonth)));
-            const handleMonthClick = () => {
-                if (isMonthRangeSelection) {
-                    if (!ownerState.value) {
-                        ownerState.onChange?.([thisMonth, undefined]);
-                    }
-                    else if (ownerState.value[0] && !ownerState.value[1]) {
-                        ownerState.onChange?.([
-                            new Date(Math.min(ownerState.value[0].getTime(), thisMonth.getTime())),
-                            new Date(Math.max(ownerState.value[0].getTime(), thisMonth.getTime())),
-                        ]);
-                    }
-                    else {
-                        ownerState.onChange?.([thisMonth, undefined]);
-                    }
-                }
-                else if (isMonthPicker) {
-                    ownerState.onChange?.([thisMonth, undefined]);
-                }
-                else {
-                    ownerState.onViewChange?.("day");
-                    ownerState.onMonthChange?.(thisMonth);
-                }
-                setHoverMonth(null);
-            };
-            return {
-                isSelected,
-                onMouseEnter: isMonthRangeSelection &&
-                    ownerState.value?.[0] &&
-                    !ownerState.value?.[1]
-                    ? () => setHoverMonth(thisMonth)
-                    : undefined,
-                disabled: (ownerState.minDate &&
-                    (() => {
-                        // check all days disabled in this month
-                        const lastDay = new Date(thisMonth);
-                        lastDay.setMonth(lastDay.getMonth() + 1);
-                        lastDay.setDate(0);
-                        return lastDay < ownerState.minDate;
-                    })()) ||
-                    (ownerState.maxDate &&
-                        (() => {
-                            // check all days disabled in this month
-                            const lastDay = new Date(thisMonth);
-                            lastDay.setDate(0);
-                            return lastDay > ownerState.maxDate;
-                        })()) ||
-                    (ownerState.disableFuture && thisMonth > new Date()) ||
-                    (ownerState.disablePast &&
-                        thisMonth < new Date() &&
-                        !isSameMonth(thisMonth, new Date())),
-                onClick: handleMonthClick,
-                tabIndex: -1,
-                "aria-label": getMonthName(thisMonth, ownerState.locale || "default"),
-                "aria-selected": isSelected ? "true" : undefined,
-                "aria-current": inRange ? "date" : undefined,
-            };
-        }, [
-            ownerState.onMonthChange,
-            ownerState.onViewChange,
-            ownerState.onChange,
-            ownerState.viewMonth,
-            ownerState.locale,
-            ownerState.value,
-            ownerState.minDate,
-            ownerState.maxDate,
-            ownerState.disableFuture,
-            ownerState.disablePast,
-            hoverMonth,
-        ]),
-    };
-};
-
-export { useCalendar };

package/dist/components/Calendar/index.js

@@ -1,6 +0,0 @@
-'use client';
-import { Calendar } from './Calendar.js';
-
-
-
-export { Calendar, Calendar as default };