@chayns-components/date 5.0.0-beta.1000

package/lib/esm/components/calendar/Calendar.js

@@ -0,0 +1,306 @@
+import { ComboBox, Icon } from '@chayns-components/core';
+import { Language } from 'chayns-api';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { CalendarType } from '../../types/calendar';
+import { getNewDate, getYearsBetween, isDateInRange } from '../../utils/calendar';
+import { addYears, differenceInCalendarMonths, isSameDay, isSameMonth, isWithinInterval, subYears } from '../../utils/date';
+import { StyledCalendar, StyledCalendarIconWrapper, StyledCalendarIconWrapperPseudo, StyledPseudoMonthYearPicker } from './Calendar.styles';
+import MonthWrapper from './month-wrapper/MonthWrapper';
+const DEFAULT_MAX_DATE = addYears(new Date(), 1);
+const DEFAULT_MIN_DATE = subYears(new Date(), 1);
+const Calendar = _ref => {
+  let {
+    locale = Language.German,
+    maxDate = DEFAULT_MAX_DATE,
+    minDate = DEFAULT_MIN_DATE,
+    highlightedDates,
+    onChange,
+    customThumbColors,
+    selectedDate,
+    selectedDates,
+    selectedDateInterval,
+    categories,
+    isDisabled,
+    type = CalendarType.Single,
+    shouldShowHighlightsInMonthOverlay = true,
+    disabledDates = [],
+    showMonthYearPickers: showMonthYearPickersProp,
+    onShownDatesChange = () => {}
+  } = _ref;
+  const [currentDate, setCurrentDate] = useState();
+  const [shouldRenderTwoMonths, setShouldRenderTwoMonths] = useState(true);
+  const [internalSelectedDate, setInternalSelectedDate] = useState(() => type === CalendarType.Multiple ? [] : undefined);
+  const [direction, setDirection] = useState();
+  const [width, setWidth] = useState(0);
+  const showMonthYearPickers = useMemo(() => {
+    const hasMultipleMonths = differenceInCalendarMonths(maxDate, minDate) > 0;
+    const hasMultipleYears = getYearsBetween(minDate, maxDate).length > 1;
+    return !!(showMonthYearPickersProp && (hasMultipleMonths || hasMultipleYears));
+  }, [minDate, maxDate, showMonthYearPickersProp]);
+  const calendarRef = useRef(null);
+  useEffect(() => {
+    if (currentDate) {
+      const start = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
+      if (shouldRenderTwoMonths) {
+        const end = new Date(currentDate.getFullYear(), currentDate.getMonth() + 2, 0);
+        onShownDatesChange({
+          start,
+          end
+        });
+      } else {
+        const end = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
+        onShownDatesChange({
+          start,
+          end
+        });
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [currentDate, shouldRenderTwoMonths]);
+  useEffect(() => {
+    const bounds = {
+      start: minDate,
+      end: maxDate
+    };
+    if (type === CalendarType.Single) {
+      if (selectedDate) {
+        const isDisabledDate = disabledDates.some(disabledDate => isSameDay(selectedDate, disabledDate));
+        const isDateInBounds = isWithinInterval(selectedDate, bounds);
+        if (!isDisabledDate && isDateInBounds) {
+          setInternalSelectedDate(selectedDate);
+        } else {
+          console.warn('[@chayns-components/date] Warning: Failed to set selectedDate, because it is disabled or out of bounds.', '\nselectedDate:', selectedDate, ...(isDisabledDate ? ['\nselectedDate is disabled'] : []), ...(isDateInBounds ? [] : ['\nselectedDate is outside of bounds:', {
+            minDate,
+            maxDate
+          }]));
+          setInternalSelectedDate(() => undefined);
+        }
+      } else {
+        setInternalSelectedDate(() => undefined);
+      }
+    } else if (type === CalendarType.Multiple) {
+      if (selectedDates) {
+        const disabledSelectedDates = [];
+        const datesOutsideOfBounds = [];
+        const filteredDates = selectedDates.filter(date => {
+          if (disabledDates.some(disabledDate => isSameDay(date, disabledDate))) {
+            disabledSelectedDates.push(date);
+            return false;
+          }
+          if (!isWithinInterval(date, bounds)) {
+            datesOutsideOfBounds.push(date);
+            return false;
+          }
+          return true;
+        });
+        if (disabledSelectedDates.length > 0 || datesOutsideOfBounds.length > 0) {
+          console.warn('[@chayns-components/date] Warning: Failed to set all selectedDates, because some are disabled or out of bounds.', ...(disabledSelectedDates.length > 0 ? ['\nselectedDates that are disabled:', disabledSelectedDates] : []), ...(datesOutsideOfBounds.length > 0 ? ['\nselectedDates that are outside of bounds:', datesOutsideOfBounds, 'bounds:', {
+            minDate,
+            maxDate
+          }] : []));
+        }
+        setInternalSelectedDate(filteredDates);
+      } else {
+        setInternalSelectedDate([]);
+      }
+    } else if (type === CalendarType.Interval) {
+      if (selectedDateInterval) {
+        const intervalIncludesDisabledDate = selectedDateInterval.end && disabledDates.some(disabledDate => isWithinInterval(disabledDate, {
+          start: selectedDateInterval.start,
+          end: selectedDateInterval.end
+        }));
+        const intervalIsInBounds = isWithinInterval(selectedDateInterval.start, bounds) && (!selectedDateInterval.end || isWithinInterval(selectedDateInterval.end, bounds));
+        if (!intervalIncludesDisabledDate && intervalIsInBounds) {
+          setInternalSelectedDate(selectedDateInterval);
+        } else {
+          console.warn('[@chayns-components/date] Warning: Failed to set selectedDateInterval, because it includes disabled dates or dates that are out of bounds.', '\nselectedDateInterval:', selectedDateInterval, ...(intervalIncludesDisabledDate ? ['\ndisabled dates:', disabledDates] : []), ...(intervalIsInBounds ? [] : ['\nbounds:', {
+            minDate,
+            maxDate
+          }]));
+          setInternalSelectedDate(() => undefined);
+        }
+      }
+    }
+  }, [type, selectedDate, selectedDates, selectedDateInterval, disabledDates, minDate, maxDate]);
+  useEffect(() => {
+    if (calendarRef.current) {
+      const resizeObserver = new ResizeObserver(entries => {
+        if (entries && entries[0]) {
+          const observedWidth = entries[0].contentRect.width;
+          setWidth(observedWidth - 30);
+          if (observedWidth < 430) {
+            setShouldRenderTwoMonths(false);
+          } else {
+            setShouldRenderTwoMonths(true);
+          }
+        }
+      });
+      resizeObserver.observe(calendarRef.current);
+      return () => {
+        resizeObserver.disconnect();
+      };
+    }
+    return () => {};
+  }, []);
+  useEffect(() => {
+    setCurrentDate(prevDate => isDateInRange({
+      minDate,
+      maxDate,
+      currentDate: prevDate || new Date()
+    }));
+  }, [maxDate, minDate]);
+  const handleLeftArrowClick = useCallback(() => {
+    if (direction) return;
+    setDirection('left');
+    setCurrentDate(prevDate => {
+      if (!prevDate) {
+        return prevDate;
+      }
+      const newDate = getNewDate(-1, prevDate);
+      return isDateInRange({
+        minDate,
+        maxDate,
+        currentDate: newDate
+      });
+    });
+  }, [maxDate, minDate, direction]);
+  const handleRightArrowClick = useCallback(() => {
+    if (direction) return;
+    setDirection('right');
+    setCurrentDate(prevDate => {
+      if (!prevDate) {
+        return prevDate;
+      }
+      const newDate = getNewDate(1, prevDate);
+      return isDateInRange({
+        minDate,
+        maxDate,
+        currentDate: newDate
+      });
+    });
+  }, [maxDate, minDate, direction]);
+  const handleSelect = useCallback(date => {
+    setInternalSelectedDate(prevDate => {
+      let onChangePayload = null;
+      let newInternalSelectedDate;
+      if (type === CalendarType.Single) {
+        onChangePayload = date;
+        newInternalSelectedDate = date;
+      } else if (type === CalendarType.Multiple) {
+        const prevSelectedDates = prevDate;
+        // Selects or unselects date , depending on if it is already selected.
+        if (prevSelectedDates.some(d => isSameDay(d, date))) {
+          newInternalSelectedDate = prevSelectedDates.filter(d => !isSameDay(d, date));
+        } else {
+          newInternalSelectedDate = [...prevSelectedDates, date];
+        }
+        onChangePayload = newInternalSelectedDate;
+      } else if (type === CalendarType.Interval) {
+        const prevSelectedDateInterval = prevDate;
+        const updateInterval = (start, end) => {
+          const newInterval = {
+            start,
+            end
+          };
+          onChangePayload = newInterval;
+          newInternalSelectedDate = newInterval;
+        };
+
+        // Sets first selection as interval start.
+        if (!prevSelectedDateInterval) {
+          updateInterval(date);
+        } else if (prevSelectedDateInterval.start && !prevSelectedDateInterval.end) {
+          // Sets second selection as interval start, if it is earlier than the previous interval start.
+          // Else sets it as interval end.
+          if (date < prevSelectedDateInterval.start) {
+            updateInterval(date);
+          } else {
+            updateInterval(prevSelectedDateInterval.start, date);
+          }
+        } else {
+          // Resets interval if a third date is selected.
+          updateInterval(date);
+        }
+      }
+      if (typeof onChange === 'function' && onChangePayload) {
+        onChange(onChangePayload);
+      }
+      return newInternalSelectedDate;
+    });
+  }, [type, onChange]);
+  const handleAnimationFinished = () => {
+    setDirection(() => undefined);
+  };
+  const ShouldShowLeftArrow = useMemo(() => {
+    if (!currentDate) {
+      return false;
+    }
+    return !isSameMonth(currentDate, minDate);
+  }, [currentDate, minDate]);
+  const ShouldShowRightArrow = useMemo(() => {
+    if (!currentDate) {
+      return false;
+    }
+    return !isSameMonth(currentDate, maxDate);
+  }, [currentDate, maxDate]);
+  return /*#__PURE__*/React.createElement(StyledCalendar, {
+    ref: calendarRef,
+    $isDisabled: isDisabled
+  }, ShouldShowLeftArrow ? /*#__PURE__*/React.createElement(StyledCalendarIconWrapper, {
+    onClick: handleLeftArrowClick
+  }, /*#__PURE__*/React.createElement("div", {
+    // TODO Use styled-components instead of inline styles
+    style: {
+      display: 'flex',
+      flexDirection: 'row',
+      flexWrap: 'nowrap',
+      height: 'fit-content'
+    }
+  }, showMonthYearPickers && /*#__PURE__*/React.createElement(StyledPseudoMonthYearPicker, null, /*#__PURE__*/React.createElement(ComboBox, {
+    lists: [{
+      list: []
+    }],
+    placeholder: ""
+  })), /*#__PURE__*/React.createElement(Icon, {
+    icons: ['fa fa-angle-left']
+  }))) : /*#__PURE__*/React.createElement(StyledCalendarIconWrapperPseudo, null), currentDate && /*#__PURE__*/React.createElement(MonthWrapper, {
+    shouldRenderTwo: shouldRenderTwoMonths,
+    currentDate: currentDate,
+    width: width,
+    locale: locale,
+    direction: direction,
+    customThumbColors: customThumbColors,
+    onSelect: handleSelect,
+    selectedDate: internalSelectedDate,
+    highlightedDates: highlightedDates,
+    categories: categories,
+    onAnimationFinished: handleAnimationFinished,
+    minDate: minDate,
+    maxDate: maxDate,
+    type: type,
+    disabledDates: disabledDates,
+    setCurrentDate: setCurrentDate,
+    shouldShowHighlightsInMonthOverlay: shouldShowHighlightsInMonthOverlay,
+    showMonthYearPickers: showMonthYearPickers
+  }), ShouldShowRightArrow ? /*#__PURE__*/React.createElement(StyledCalendarIconWrapper, {
+    onClick: handleRightArrowClick
+  }, /*#__PURE__*/React.createElement("div", {
+    // TODO Use styled-components instead of inline styles
+    style: {
+      display: 'flex',
+      flexDirection: 'row',
+      flexWrap: 'nowrap',
+      height: 'fit-content'
+    }
+  }, showMonthYearPickers && /*#__PURE__*/React.createElement(StyledPseudoMonthYearPicker, null, /*#__PURE__*/React.createElement(ComboBox, {
+    lists: [{
+      list: []
+    }],
+    placeholder: ""
+  })), /*#__PURE__*/React.createElement(Icon, {
+    icons: ['fa fa-angle-right']
+  }))) : /*#__PURE__*/React.createElement(StyledCalendarIconWrapperPseudo, null));
+};
+Calendar.displayName = 'Calendar';
+export default Calendar;
+//# sourceMappingURL=Calendar.js.map

package/lib/esm/components/calendar/Calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.js","names":["ComboBox","Icon","Language","React","useCallback","useEffect","useMemo","useRef","useState","CalendarType","getNewDate","getYearsBetween","isDateInRange","addYears","differenceInCalendarMonths","isSameDay","isSameMonth","isWithinInterval","subYears","StyledCalendar","StyledCalendarIconWrapper","StyledCalendarIconWrapperPseudo","StyledPseudoMonthYearPicker","MonthWrapper","DEFAULT_MAX_DATE","Date","DEFAULT_MIN_DATE","Calendar","_ref","locale","German","maxDate","minDate","highlightedDates","onChange","customThumbColors","selectedDate","selectedDates","selectedDateInterval","categories","isDisabled","type","Single","shouldShowHighlightsInMonthOverlay","disabledDates","showMonthYearPickers","showMonthYearPickersProp","onShownDatesChange","currentDate","setCurrentDate","shouldRenderTwoMonths","setShouldRenderTwoMonths","internalSelectedDate","setInternalSelectedDate","Multiple","undefined","direction","setDirection","width","setWidth","hasMultipleMonths","hasMultipleYears","length","calendarRef","start","getFullYear","getMonth","end","bounds","isDisabledDate","some","disabledDate","isDateInBounds","console","warn","disabledSelectedDates","datesOutsideOfBounds","filteredDates","filter","date","push","Interval","intervalIncludesDisabledDate","intervalIsInBounds","current","resizeObserver","ResizeObserver","entries","observedWidth","contentRect","observe","disconnect","prevDate","handleLeftArrowClick","newDate","handleRightArrowClick","handleSelect","onChangePayload","newInternalSelectedDate","prevSelectedDates","d","prevSelectedDateInterval","updateInterval","newInterval","handleAnimationFinished","ShouldShowLeftArrow","ShouldShowRightArrow","createElement","ref","$isDisabled","onClick","style","display","flexDirection","flexWrap","height","lists","list","placeholder","icons","shouldRenderTwo","onSelect","onAnimationFinished","displayName"],"sources":["../../../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ComboBox, Icon } from '@chayns-components/core';\nimport { Language } from 'chayns-api';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport {\n    CalendarType,\n    Categories,\n    CustomThumbColors,\n    DateInterval,\n    HighlightedDates,\n} from '../../types/calendar';\nimport { getNewDate, getYearsBetween, isDateInRange } from '../../utils/calendar';\nimport {\n    addYears,\n    differenceInCalendarMonths,\n    isSameDay,\n    isSameMonth,\n    isWithinInterval,\n    subYears,\n} from '../../utils/date';\nimport {\n    StyledCalendar,\n    StyledCalendarIconWrapper,\n    StyledCalendarIconWrapperPseudo,\n    StyledPseudoMonthYearPicker,\n} from './Calendar.styles';\nimport MonthWrapper from './month-wrapper/MonthWrapper';\n\ninterface BaseProps {\n    /**\n     * An array to group dates into a category.\n     */\n    categories?: Categories[];\n    /**\n     * Custom colors for the thumb.\n     */\n    customThumbColors?: CustomThumbColors;\n    /**\n     * An array with dates and corresponding styles to highlight.\n     */\n    highlightedDates?: HighlightedDates[];\n    /**\n     * To disable the Calendar\n     */\n    isDisabled?: boolean;\n    /**\n     * The locale language to format the dates.\n     */\n    locale?: Language;\n    /**\n     * The maximum date that can be selected.\n     */\n    maxDate?: Date;\n    /**\n     * The minimum date that can be selected.\n     */\n    minDate?: Date;\n    /**\n     * An array of dates that should be disabled.\n     */\n    disabledDates?: Date[];\n    /**\n     * Whether the highlighted dates should be displayed for the greyed month overlay days.\n     */\n    shouldShowHighlightsInMonthOverlay?: boolean;\n    /**\n     * Shows the month and year pickers, if there are multiple months/years to select from.\n     */\n    showMonthYearPickers?: boolean;\n    /**\n     * Function to be executed when the selected date, dates or date interval change.\n     * @param date\n     */\n    onChange?: (date: Date | Date[] | DateInterval) => void;\n    /**\n     * Function to be executed when the shown dates change. Returns the start of the displayed month and the end of the last displayed month (since depending on the available widths, there are one or two months displayed).\n     @param { start: Date, end: Date }\n     */\n    onShownDatesChange?: (dates: { start: Date; end: Date }) => void;\n}\n\ninterface SingleSelectionProps {\n    /**\n     * The type of the calendar selection.\n     */\n    type?: CalendarType.Single;\n    /**\n     * A date that should be preselected.\n     */\n    selectedDate?: Date;\n    selectedDates?: never;\n    selectedDateInterval?: never;\n}\n\ninterface MultipleSelectionProps {\n    /**\n     * The type of the calendar selection.\n     */\n    type: CalendarType.Multiple;\n    /**\n     * An array of dates that should be preselected.\n     */\n    selectedDates?: Date[];\n    selectedDate?: never;\n    selectedDateInterval?: never;\n}\n\ninterface IntervalSelectionProps {\n    /**\n     * The type of the calendar selection.\n     */\n    type: CalendarType.Interval;\n    /**\n     * An interval that should be preselected.\n     */\n    selectedDateInterval?: DateInterval;\n    selectedDates?: never;\n    selectedDate?: never;\n}\n\nexport type CalendarProps = BaseProps &\n    (SingleSelectionProps | MultipleSelectionProps | IntervalSelectionProps);\n\nconst DEFAULT_MAX_DATE = addYears(new Date(), 1);\nconst DEFAULT_MIN_DATE = subYears(new Date(), 1);\n\nconst Calendar: FC<CalendarProps> = ({\n    locale = Language.German,\n    maxDate = DEFAULT_MAX_DATE,\n    minDate = DEFAULT_MIN_DATE,\n    highlightedDates,\n    onChange,\n    customThumbColors,\n    selectedDate,\n    selectedDates,\n    selectedDateInterval,\n    categories,\n    isDisabled,\n    type = CalendarType.Single,\n    shouldShowHighlightsInMonthOverlay = true,\n    disabledDates = [],\n    showMonthYearPickers: showMonthYearPickersProp,\n    onShownDatesChange = () => {},\n}) => {\n    const [currentDate, setCurrentDate] = useState<Date>();\n    const [shouldRenderTwoMonths, setShouldRenderTwoMonths] = useState(true);\n    const [internalSelectedDate, setInternalSelectedDate] = useState<\n        Date | Date[] | DateInterval | undefined\n    >(() => (type === CalendarType.Multiple ? [] : undefined));\n    const [direction, setDirection] = useState<'left' | 'right' | undefined>();\n    const [width, setWidth] = useState(0);\n\n    const showMonthYearPickers = useMemo(() => {\n        const hasMultipleMonths = differenceInCalendarMonths(maxDate, minDate) > 0;\n        const hasMultipleYears = getYearsBetween(minDate, maxDate).length > 1;\n\n        return !!(showMonthYearPickersProp && (hasMultipleMonths || hasMultipleYears));\n    }, [minDate, maxDate, showMonthYearPickersProp]);\n\n    const calendarRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        if (currentDate) {\n            const start = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);\n\n            if (shouldRenderTwoMonths) {\n                const end = new Date(currentDate.getFullYear(), currentDate.getMonth() + 2, 0);\n                onShownDatesChange({\n                    start,\n                    end,\n                });\n            } else {\n                const end = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);\n                onShownDatesChange({\n                    start,\n                    end,\n                });\n            }\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [currentDate, shouldRenderTwoMonths]);\n\n    useEffect(() => {\n        const bounds = {\n            start: minDate,\n            end: maxDate,\n        };\n        if (type === CalendarType.Single) {\n            if (selectedDate) {\n                const isDisabledDate = disabledDates.some((disabledDate) =>\n                    isSameDay(selectedDate, disabledDate),\n                );\n                const isDateInBounds = isWithinInterval(selectedDate, bounds);\n\n                if (!isDisabledDate && isDateInBounds) {\n                    setInternalSelectedDate(selectedDate);\n                } else {\n                    console.warn(\n                        '[@chayns-components/date] Warning: Failed to set selectedDate, because it is disabled or out of bounds.',\n                        '\\nselectedDate:',\n                        selectedDate,\n                        ...(isDisabledDate ? ['\\nselectedDate is disabled'] : []),\n                        ...(isDateInBounds\n                            ? []\n                            : ['\\nselectedDate is outside of bounds:', { minDate, maxDate }]),\n                    );\n                    setInternalSelectedDate(() => undefined);\n                }\n            } else {\n                setInternalSelectedDate(() => undefined);\n            }\n        } else if (type === CalendarType.Multiple) {\n            if (selectedDates) {\n                const disabledSelectedDates: Date[] = [];\n                const datesOutsideOfBounds: Date[] = [];\n\n                const filteredDates = selectedDates.filter((date) => {\n                    if (disabledDates.some((disabledDate) => isSameDay(date, disabledDate))) {\n                        disabledSelectedDates.push(date);\n                        return false;\n                    }\n\n                    if (!isWithinInterval(date, bounds)) {\n                        datesOutsideOfBounds.push(date);\n                        return false;\n                    }\n\n                    return true;\n                });\n\n                if (disabledSelectedDates.length > 0 || datesOutsideOfBounds.length > 0) {\n                    console.warn(\n                        '[@chayns-components/date] Warning: Failed to set all selectedDates, because some are disabled or out of bounds.',\n                        ...(disabledSelectedDates.length > 0\n                            ? ['\\nselectedDates that are disabled:', disabledSelectedDates]\n                            : []),\n                        ...(datesOutsideOfBounds.length > 0\n                            ? [\n                                  '\\nselectedDates that are outside of bounds:',\n                                  datesOutsideOfBounds,\n                                  'bounds:',\n                                  { minDate, maxDate },\n                              ]\n                            : []),\n                    );\n                }\n\n                setInternalSelectedDate(filteredDates);\n            } else {\n                setInternalSelectedDate([]);\n            }\n        } else if (type === CalendarType.Interval) {\n            if (selectedDateInterval) {\n                const intervalIncludesDisabledDate =\n                    selectedDateInterval.end &&\n                    disabledDates.some((disabledDate) =>\n                        isWithinInterval(disabledDate, {\n                            start: selectedDateInterval.start,\n                            end: selectedDateInterval.end as Date,\n                        }),\n                    );\n\n                const intervalIsInBounds =\n                    isWithinInterval(selectedDateInterval.start, bounds) &&\n                    (!selectedDateInterval.end ||\n                        isWithinInterval(selectedDateInterval.end, bounds));\n\n                if (!intervalIncludesDisabledDate && intervalIsInBounds) {\n                    setInternalSelectedDate(selectedDateInterval);\n                } else {\n                    console.warn(\n                        '[@chayns-components/date] Warning: Failed to set selectedDateInterval, because it includes disabled dates or dates that are out of bounds.',\n                        '\\nselectedDateInterval:',\n                        selectedDateInterval,\n                        ...(intervalIncludesDisabledDate\n                            ? ['\\ndisabled dates:', disabledDates]\n                            : []),\n                        ...(intervalIsInBounds ? [] : ['\\nbounds:', { minDate, maxDate }]),\n                    );\n                    setInternalSelectedDate(() => undefined);\n                }\n            }\n        }\n    }, [type, selectedDate, selectedDates, selectedDateInterval, disabledDates, minDate, maxDate]);\n\n    useEffect(() => {\n        if (calendarRef.current) {\n            const resizeObserver = new ResizeObserver((entries) => {\n                if (entries && entries[0]) {\n                    const observedWidth = entries[0].contentRect.width;\n\n                    setWidth(observedWidth - 30);\n\n                    if (observedWidth < 430) {\n                        setShouldRenderTwoMonths(false);\n                    } else {\n                        setShouldRenderTwoMonths(true);\n                    }\n                }\n            });\n\n            resizeObserver.observe(calendarRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n            };\n        }\n\n        return () => {};\n    }, []);\n\n    useEffect(() => {\n        setCurrentDate((prevDate) =>\n            isDateInRange({ minDate, maxDate, currentDate: prevDate || new Date() }),\n        );\n    }, [maxDate, minDate]);\n\n    const handleLeftArrowClick = useCallback(() => {\n        if (direction) return;\n\n        setDirection('left');\n\n        setCurrentDate((prevDate) => {\n            if (!prevDate) {\n                return prevDate;\n            }\n\n            const newDate = getNewDate(-1, prevDate);\n\n            return isDateInRange({ minDate, maxDate, currentDate: newDate });\n        });\n    }, [maxDate, minDate, direction]);\n\n    const handleRightArrowClick = useCallback(() => {\n        if (direction) return;\n\n        setDirection('right');\n\n        setCurrentDate((prevDate) => {\n            if (!prevDate) {\n                return prevDate;\n            }\n\n            const newDate = getNewDate(1, prevDate);\n\n            return isDateInRange({ minDate, maxDate, currentDate: newDate });\n        });\n    }, [maxDate, minDate, direction]);\n\n    const handleSelect = useCallback(\n        (date: Date) => {\n            setInternalSelectedDate((prevDate) => {\n                let onChangePayload: Date | Date[] | DateInterval | null = null;\n                let newInternalSelectedDate: Date | Date[] | DateInterval | undefined;\n\n                if (type === CalendarType.Single) {\n                    onChangePayload = date;\n                    newInternalSelectedDate = date;\n                } else if (type === CalendarType.Multiple) {\n                    const prevSelectedDates = prevDate as Date[];\n                    // Selects or unselects date , depending on if it is already selected.\n                    if (prevSelectedDates.some((d) => isSameDay(d, date))) {\n                        newInternalSelectedDate = prevSelectedDates.filter(\n                            (d) => !isSameDay(d, date),\n                        );\n                    } else {\n                        newInternalSelectedDate = [...prevSelectedDates, date];\n                    }\n\n                    onChangePayload = newInternalSelectedDate;\n                } else if (type === CalendarType.Interval) {\n                    const prevSelectedDateInterval = prevDate as DateInterval;\n\n                    const updateInterval = (start: Date, end?: Date): void => {\n                        const newInterval = { start, end };\n                        onChangePayload = newInterval;\n                        newInternalSelectedDate = newInterval;\n                    };\n\n                    // Sets first selection as interval start.\n                    if (!prevSelectedDateInterval) {\n                        updateInterval(date);\n                    } else if (prevSelectedDateInterval.start && !prevSelectedDateInterval.end) {\n                        // Sets second selection as interval start, if it is earlier than the previous interval start.\n                        // Else sets it as interval end.\n                        if (date < prevSelectedDateInterval.start) {\n                            updateInterval(date);\n                        } else {\n                            updateInterval(prevSelectedDateInterval.start, date);\n                        }\n                    } else {\n                        // Resets interval if a third date is selected.\n                        updateInterval(date);\n                    }\n                }\n\n                if (typeof onChange === 'function' && onChangePayload) {\n                    onChange(onChangePayload);\n                }\n\n                return newInternalSelectedDate;\n            });\n        },\n        [type, onChange],\n    );\n\n    const handleAnimationFinished = () => {\n        setDirection(() => undefined);\n    };\n\n    const ShouldShowLeftArrow = useMemo(() => {\n        if (!currentDate) {\n            return false;\n        }\n\n        return !isSameMonth(currentDate, minDate);\n    }, [currentDate, minDate]);\n\n    const ShouldShowRightArrow = useMemo(() => {\n        if (!currentDate) {\n            return false;\n        }\n\n        return !isSameMonth(currentDate, maxDate);\n    }, [currentDate, maxDate]);\n\n    return (\n        <StyledCalendar ref={calendarRef} $isDisabled={isDisabled}>\n            {ShouldShowLeftArrow ? (\n                <StyledCalendarIconWrapper onClick={handleLeftArrowClick}>\n                    <div // TODO Use styled-components instead of inline styles\n                        style={{\n                            display: 'flex',\n                            flexDirection: 'row',\n                            flexWrap: 'nowrap',\n                            height: 'fit-content',\n                        }}\n                    >\n                        {showMonthYearPickers && (\n                            <StyledPseudoMonthYearPicker>\n                                <ComboBox lists={[{ list: [] }]} placeholder=\"\" />\n                            </StyledPseudoMonthYearPicker>\n                        )}\n                        <Icon icons={['fa fa-angle-left']} />\n                    </div>\n                </StyledCalendarIconWrapper>\n            ) : (\n                <StyledCalendarIconWrapperPseudo />\n            )}\n            {currentDate && (\n                <MonthWrapper\n                    shouldRenderTwo={shouldRenderTwoMonths}\n                    currentDate={currentDate}\n                    width={width}\n                    locale={locale}\n                    direction={direction}\n                    customThumbColors={customThumbColors}\n                    onSelect={handleSelect}\n                    selectedDate={internalSelectedDate}\n                    highlightedDates={highlightedDates}\n                    categories={categories}\n                    onAnimationFinished={handleAnimationFinished}\n                    minDate={minDate}\n                    maxDate={maxDate}\n                    type={type}\n                    disabledDates={disabledDates}\n                    setCurrentDate={setCurrentDate}\n                    shouldShowHighlightsInMonthOverlay={shouldShowHighlightsInMonthOverlay}\n                    showMonthYearPickers={showMonthYearPickers}\n                />\n            )}\n            {ShouldShowRightArrow ? (\n                <StyledCalendarIconWrapper onClick={handleRightArrowClick}>\n                    <div // TODO Use styled-components instead of inline styles\n                        style={{\n                            display: 'flex',\n                            flexDirection: 'row',\n                            flexWrap: 'nowrap',\n                            height: 'fit-content',\n                        }}\n                    >\n                        {showMonthYearPickers && (\n                            <StyledPseudoMonthYearPicker>\n                                <ComboBox lists={[{ list: [] }]} placeholder=\"\" />\n                            </StyledPseudoMonthYearPicker>\n                        )}\n                        <Icon icons={['fa fa-angle-right']} />\n                    </div>\n                </StyledCalendarIconWrapper>\n            ) : (\n                <StyledCalendarIconWrapperPseudo />\n            )}\n        </StyledCalendar>\n    );\n};\n\nCalendar.displayName = 'Calendar';\n\nexport default Calendar;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/calendar/Calendar.styles.js

@@ -0,0 +1,33 @@
+import styled from 'styled-components';
+export const StyledCalendar = styled.div`
+    display: flex;
+    width: 100%;
+    opacity: ${_ref => {
+  let {
+    $isDisabled
+  } = _ref;
+  return $isDisabled ? 0.5 : 1;
+}};
+    pointer-events: ${_ref2 => {
+  let {
+    $isDisabled
+  } = _ref2;
+  return $isDisabled ? 'none' : undefined;
+}};
+    user-select: none;
+`;
+export const StyledCalendarIconWrapper = styled.div`
+    cursor: pointer;
+    z-index: 2;
+`;
+export const StyledCalendarIconWrapperPseudo = styled.div`
+    width: 15px;
+`;
+export const StyledPseudoMonthYearPicker = styled.div`
+    height: fit-content;
+    width: 0;
+    overflow: hidden;
+    pointer-events: none;
+    user-select: none;
+`;
+//# sourceMappingURL=Calendar.styles.js.map

package/lib/esm/components/calendar/Calendar.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.styles.js","names":["styled","StyledCalendar","div","_ref","$isDisabled","_ref2","undefined","StyledCalendarIconWrapper","StyledCalendarIconWrapperPseudo","StyledPseudoMonthYearPicker"],"sources":["../../../../src/components/calendar/Calendar.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\ntype StyledCalendarProps = { $isDisabled?: boolean };\n\nexport const StyledCalendar = styled.div<StyledCalendarProps>`\n    display: flex;\n    width: 100%;\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    pointer-events: ${({ $isDisabled }) => ($isDisabled ? 'none' : undefined)};\n    user-select: none;\n`;\n\nexport const StyledCalendarIconWrapper = styled.div`\n    cursor: pointer;\n    z-index: 2;\n`;\n\nexport const StyledCalendarIconWrapperPseudo = styled.div`\n    width: 15px;\n`;\n\nexport const StyledPseudoMonthYearPicker = styled.div`\n    height: fit-content;\n    width: 0;\n    overflow: hidden;\n    pointer-events: none;\n    user-select: none;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAItC,OAAO,MAAMC,cAAc,GAAGD,MAAM,CAACE,GAAwB;AAC7D;AACA;AACA,eAAeC,IAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,IAAA;EAAA,OAAMC,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D,sBAAsBC,KAAA;EAAA,IAAC;IAAED;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMD,WAAW,GAAG,MAAM,GAAGE,SAAS;AAAA,CAAC;AAC7E;AACA,CAAC;AAED,OAAO,MAAMC,yBAAyB,GAAGP,MAAM,CAACE,GAAG;AACnD;AACA;AACA,CAAC;AAED,OAAO,MAAMM,+BAA+B,GAAGR,MAAM,CAACE,GAAG;AACzD;AACA,CAAC;AAED,OAAO,MAAMO,2BAA2B,GAAGT,MAAM,CAACE,GAAG;AACrD;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/calendar/month-wrapper/MonthWrapper.js

@@ -0,0 +1,150 @@
+import React, { useEffect, useMemo, useState } from 'react';
+import { getMonthAndYear, getNewDate } from '../../../utils/calendar';
+import Month from './month/Month';
+import { StyledMonthWrapper, StyledMotionWrapper } from './MonthWrapper.styles';
+const MonthWrapper = _ref => {
+  let {
+    locale,
+    currentDate,
+    highlightedDates,
+    selectedDate,
+    onSelect,
+    categories,
+    direction,
+    onAnimationFinished,
+    shouldRenderTwo,
+    width,
+    customThumbColors,
+    isDisabled,
+    minDate,
+    maxDate,
+    shouldShowHighlightsInMonthOverlay,
+    type,
+    disabledDates,
+    setCurrentDate,
+    showMonthYearPickers
+  } = _ref;
+  const [content, setContent] = useState();
+  const [hoveringDay, setHoveringDay] = useState(null);
+  const monthHeight = useMemo(() => width / (shouldRenderTwo ? 2 : 1), [width, shouldRenderTwo]);
+  useEffect(() => {
+    setContent(() => {
+      // Initial render of months
+      const items = [];
+      for (let i = -1; i < 3; i++) {
+        const date = getNewDate(i, currentDate);
+        const {
+          month,
+          year
+        } = getMonthAndYear(date);
+        items.push(/*#__PURE__*/React.createElement(Month, {
+          height: monthHeight,
+          key: `${month}-${year}`,
+          month: month,
+          year: year,
+          locale: locale,
+          onSelect: onSelect,
+          highlightedDates: highlightedDates,
+          shouldShowHighlightsInMonthOverlay: shouldShowHighlightsInMonthOverlay,
+          categories: categories,
+          selectedDate: selectedDate,
+          minDate: minDate,
+          maxDate: maxDate,
+          type: type,
+          customThumbColors: customThumbColors,
+          hoveringDay: hoveringDay,
+          setHoveringDay: setHoveringDay,
+          disabledDates: disabledDates,
+          setCurrentDate: setCurrentDate,
+          displayIndex: i,
+          showMonthYearPickers: showMonthYearPickers
+        }));
+      }
+      return items;
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [monthHeight]);
+  useEffect(() => {
+    // Doesn't update props until animation is completed
+    if (direction) return;
+    setContent(prevState => (prevState ?? []).map((element, index) => {
+      const date = getNewDate(index - 1, currentDate);
+      const {
+        month,
+        year
+      } = getMonthAndYear(date);
+      return {
+        ...element,
+        props: {
+          ...element.props,
+          categories,
+          disabledDates,
+          displayIndex: index - 1,
+          highlightedDates,
+          hoveringDay,
+          locale,
+          onSelect,
+          shouldShowHighlightsInMonthOverlay,
+          maxDate,
+          minDate,
+          month,
+          customThumbColors,
+          selectedDate,
+          setCurrentDate,
+          setHoveringDay,
+          showMonthYearPickers,
+          type,
+          year
+        }
+      };
+    }));
+  }, [customThumbColors, categories, currentDate, direction, disabledDates, highlightedDates, hoveringDay, locale, onAnimationFinished, onSelect, maxDate, minDate, selectedDate, setCurrentDate, setHoveringDay, showMonthYearPickers, type, shouldShowHighlightsInMonthOverlay]);
+  const animate = useMemo(() => {
+    if (shouldRenderTwo) {
+      switch (true) {
+        case direction === 'left':
+          return {
+            x: '0%'
+          };
+        case direction === 'right':
+          return {
+            x: '-100%'
+          };
+        default:
+          return {
+            x: '-50%'
+          };
+      }
+    } else {
+      switch (true) {
+        case direction === 'left':
+          return {
+            x: '0%'
+          };
+        case direction === 'right':
+          return {
+            x: '-200%'
+          };
+        default:
+          return {
+            x: '-100%'
+          };
+      }
+    }
+  }, [direction, shouldRenderTwo]);
+  return /*#__PURE__*/React.createElement(StyledMonthWrapper, {
+    $height: monthHeight,
+    $width: width
+  }, /*#__PURE__*/React.createElement(StyledMotionWrapper, {
+    animate: animate,
+    $isDisabled: isDisabled,
+    transition: {
+      type: 'tween',
+      duration: !direction ? 0 : 0.2
+    },
+    onAnimationComplete: onAnimationFinished
+  }, content));
+};
+MonthWrapper.displayName = 'MonthWrapper';
+export default MonthWrapper;
+//# sourceMappingURL=MonthWrapper.js.map

package/lib/esm/components/calendar/month-wrapper/MonthWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthWrapper.js","names":["React","useEffect","useMemo","useState","getMonthAndYear","getNewDate","Month","StyledMonthWrapper","StyledMotionWrapper","MonthWrapper","_ref","locale","currentDate","highlightedDates","selectedDate","onSelect","categories","direction","onAnimationFinished","shouldRenderTwo","width","customThumbColors","isDisabled","minDate","maxDate","shouldShowHighlightsInMonthOverlay","type","disabledDates","setCurrentDate","showMonthYearPickers","content","setContent","hoveringDay","setHoveringDay","monthHeight","items","i","date","month","year","push","createElement","height","key","displayIndex","prevState","map","element","index","props","animate","x","$height","$width","$isDisabled","transition","duration","onAnimationComplete","displayName"],"sources":["../../../../../src/components/calendar/month-wrapper/MonthWrapper.tsx"],"sourcesContent":["import type { MotionProps } from 'framer-motion';\nimport React, { FC, useEffect, useMemo, useState, type ReactElement } from 'react';\nimport {\n    CalendarType,\n    Categories, CustomThumbColors,\n    DateInterval,\n    HighlightedDates,\n} from '../../../types/calendar';\nimport { getMonthAndYear, getNewDate } from '../../../utils/calendar';\nimport Month from './month/Month';\nimport { StyledMonthWrapper, StyledMotionWrapper } from './MonthWrapper.styles';\nimport {Language} from \"chayns-api\";\n\nexport type MonthWrapperProps = {\n    locale: Language;\n    highlightedDates?: HighlightedDates[];\n    onSelect: (date: Date) => void;\n    selectedDate?: Date | Date[] | DateInterval;\n    categories?: Categories[];\n    currentDate: Date;\n    direction?: 'left' | 'right';\n    onAnimationFinished: () => void;\n    shouldRenderTwo: boolean;\n    width: number;\n    isDisabled?: boolean;\n    maxDate: Date;\n    minDate: Date;\n    type: CalendarType;\n    disabledDates: Date[];\n    setCurrentDate: (date: Date) => void;\n    shouldShowHighlightsInMonthOverlay: boolean;\n    showMonthYearPickers: boolean;\n    customThumbColors?: CustomThumbColors;\n};\n\nconst MonthWrapper: FC<MonthWrapperProps> = ({\n    locale,\n    currentDate,\n    highlightedDates,\n    selectedDate,\n    onSelect,\n    categories,\n    direction,\n    onAnimationFinished,\n    shouldRenderTwo,\n    width,customThumbColors,\n    isDisabled,\n    minDate,\n    maxDate,\n    shouldShowHighlightsInMonthOverlay,\n    type,\n    disabledDates,\n    setCurrentDate,\n    showMonthYearPickers,\n}) => {\n    const [content, setContent] = useState<ReactElement[]>();\n\n    const [hoveringDay, setHoveringDay] = useState<Date | null>(null);\n\n    const monthHeight = useMemo(() => width / (shouldRenderTwo ? 2 : 1), [width, shouldRenderTwo]);\n\n    useEffect(() => {\n        setContent(() => {\n            // Initial render of months\n            const items: ReactElement[] = [];\n\n            for (let i = -1; i < 3; i++) {\n                const date = getNewDate(i, currentDate);\n\n                const { month, year } = getMonthAndYear(date);\n\n                items.push(\n                    <Month\n                        height={monthHeight}\n                        key={`${month}-${year}`}\n                        month={month}\n                        year={year}\n                        locale={locale}\n                        onSelect={onSelect}\n                        highlightedDates={highlightedDates}\n                        shouldShowHighlightsInMonthOverlay={shouldShowHighlightsInMonthOverlay}\n                        categories={categories}\n                        selectedDate={selectedDate}\n                        minDate={minDate}\n                        maxDate={maxDate}\n                        type={type}\n                        customThumbColors={customThumbColors}\n                        hoveringDay={hoveringDay}\n                        setHoveringDay={setHoveringDay}\n                        disabledDates={disabledDates}\n                        setCurrentDate={setCurrentDate}\n                        displayIndex={i}\n                        showMonthYearPickers={showMonthYearPickers}\n                    />,\n                );\n            }\n\n            return items;\n        });\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [monthHeight]);\n\n    useEffect(() => {\n        // Doesn't update props until animation is completed\n        if (direction) return;\n\n        setContent((prevState) =>\n            (prevState ?? []).map((element, index) => {\n                const date = getNewDate(index - 1, currentDate);\n\n                const { month, year } = getMonthAndYear(date);\n\n                return {\n                    ...element,\n                    props: {\n                        ...element.props,\n                        categories,\n                        disabledDates,\n                        displayIndex: index - 1,\n                        highlightedDates,\n                        hoveringDay,\n                        locale,\n                        onSelect,\n                        shouldShowHighlightsInMonthOverlay,\n                        maxDate,\n                        minDate,\n                        month,\n                        customThumbColors,\n                        selectedDate,\n                        setCurrentDate,\n                        setHoveringDay,\n                        showMonthYearPickers,\n                        type,\n                        year,\n                    } as ReactElement,\n                };\n            }),\n        );\n    }, [\n        customThumbColors,\n        categories,\n        currentDate,\n        direction,\n        disabledDates,\n        highlightedDates,\n        hoveringDay,\n        locale,\n        onAnimationFinished,\n        onSelect,\n        maxDate,\n        minDate,\n        selectedDate,\n        setCurrentDate,\n        setHoveringDay,\n        showMonthYearPickers,\n        type,\n        shouldShowHighlightsInMonthOverlay,\n    ]);\n\n    const animate: MotionProps['animate'] = useMemo(() => {\n        if (shouldRenderTwo) {\n            switch (true) {\n                case direction === 'left':\n                    return { x: '0%' };\n                case direction === 'right':\n                    return { x: '-100%' };\n                default:\n                    return { x: '-50%' };\n            }\n        } else {\n            switch (true) {\n                case direction === 'left':\n                    return { x: '0%' };\n                case direction === 'right':\n                    return { x: '-200%' };\n                default:\n                    return { x: '-100%' };\n            }\n        }\n    }, [direction, shouldRenderTwo]);\n\n    return (\n        <StyledMonthWrapper $height={monthHeight} $width={width}>\n            <StyledMotionWrapper\n                animate={animate}\n                $isDisabled={isDisabled}\n                transition={{\n                    type: 'tween',\n                    duration: !direction ? 0 : 0.2,\n                }}\n                onAnimationComplete={onAnimationFinished}\n            >\n                {content}\n            </StyledMotionWrapper>\n        </StyledMonthWrapper>\n    );\n};\n\nMonthWrapper.displayName = 'MonthWrapper';\n\nexport default MonthWrapper;\n"],"mappings":"AACA,OAAOA,KAAK,IAAQC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAA2B,OAAO;AAOlF,SAASC,eAAe,EAAEC,UAAU,QAAQ,yBAAyB;AACrE,OAAOC,KAAK,MAAM,eAAe;AACjC,SAASC,kBAAkB,EAAEC,mBAAmB,QAAQ,uBAAuB;AAyB/E,MAAMC,YAAmC,GAAGC,IAAA,IAmBtC;EAAA,IAnBuC;IACzCC,MAAM;IACNC,WAAW;IACXC,gBAAgB;IAChBC,YAAY;IACZC,QAAQ;IACRC,UAAU;IACVC,SAAS;IACTC,mBAAmB;IACnBC,eAAe;IACfC,KAAK;IAACC,iBAAiB;IACvBC,UAAU;IACVC,OAAO;IACPC,OAAO;IACPC,kCAAkC;IAClCC,IAAI;IACJC,aAAa;IACbC,cAAc;IACdC;EACJ,CAAC,GAAAnB,IAAA;EACG,MAAM,CAACoB,OAAO,EAAEC,UAAU,CAAC,GAAG5B,QAAQ,CAAiB,CAAC;EAExD,MAAM,CAAC6B,WAAW,EAAEC,cAAc,CAAC,GAAG9B,QAAQ,CAAc,IAAI,CAAC;EAEjE,MAAM+B,WAAW,GAAGhC,OAAO,CAAC,MAAMkB,KAAK,IAAID,eAAe,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAACC,KAAK,EAAED,eAAe,CAAC,CAAC;EAE9FlB,SAAS,CAAC,MAAM;IACZ8B,UAAU,CAAC,MAAM;MACb;MACA,MAAMI,KAAqB,GAAG,EAAE;MAEhC,KAAK,IAAIC,CAAC,GAAG,CAAC,CAAC,EAAEA,CAAC,GAAG,CAAC,EAAEA,CAAC,EAAE,EAAE;QACzB,MAAMC,IAAI,GAAGhC,UAAU,CAAC+B,CAAC,EAAExB,WAAW,CAAC;QAEvC,MAAM;UAAE0B,KAAK;UAAEC;QAAK,CAAC,GAAGnC,eAAe,CAACiC,IAAI,CAAC;QAE7CF,KAAK,CAACK,IAAI,cACNxC,KAAA,CAAAyC,aAAA,CAACnC,KAAK;UACFoC,MAAM,EAAER,WAAY;UACpBS,GAAG,EAAE,GAAGL,KAAK,IAAIC,IAAI,EAAG;UACxBD,KAAK,EAAEA,KAAM;UACbC,IAAI,EAAEA,IAAK;UACX5B,MAAM,EAAEA,MAAO;UACfI,QAAQ,EAAEA,QAAS;UACnBF,gBAAgB,EAAEA,gBAAiB;UACnCY,kCAAkC,EAAEA,kCAAmC;UACvET,UAAU,EAAEA,UAAW;UACvBF,YAAY,EAAEA,YAAa;UAC3BS,OAAO,EAAEA,OAAQ;UACjBC,OAAO,EAAEA,OAAQ;UACjBE,IAAI,EAAEA,IAAK;UACXL,iBAAiB,EAAEA,iBAAkB;UACrCW,WAAW,EAAEA,WAAY;UACzBC,cAAc,EAAEA,cAAe;UAC/BN,aAAa,EAAEA,aAAc;UAC7BC,cAAc,EAAEA,cAAe;UAC/BgB,YAAY,EAAER,CAAE;UAChBP,oBAAoB,EAAEA;QAAqB,CAC9C,CACL,CAAC;MACL;MAEA,OAAOM,KAAK;IAChB,CAAC,CAAC;IACF;EACJ,CAAC,EAAE,CAACD,WAAW,CAAC,CAAC;EAEjBjC,SAAS,CAAC,MAAM;IACZ;IACA,IAAIgB,SAAS,EAAE;IAEfc,UAAU,CAAEc,SAAS,IACjB,CAACA,SAAS,IAAI,EAAE,EAAEC,GAAG,CAAC,CAACC,OAAO,EAAEC,KAAK,KAAK;MACtC,MAAMX,IAAI,GAAGhC,UAAU,CAAC2C,KAAK,GAAG,CAAC,EAAEpC,WAAW,CAAC;MAE/C,MAAM;QAAE0B,KAAK;QAAEC;MAAK,CAAC,GAAGnC,eAAe,CAACiC,IAAI,CAAC;MAE7C,OAAO;QACH,GAAGU,OAAO;QACVE,KAAK,EAAE;UACH,GAAGF,OAAO,CAACE,KAAK;UAChBjC,UAAU;UACVW,aAAa;UACbiB,YAAY,EAAEI,KAAK,GAAG,CAAC;UACvBnC,gBAAgB;UAChBmB,WAAW;UACXrB,MAAM;UACNI,QAAQ;UACRU,kCAAkC;UAClCD,OAAO;UACPD,OAAO;UACPe,KAAK;UACLjB,iBAAiB;UACjBP,YAAY;UACZc,cAAc;UACdK,cAAc;UACdJ,oBAAoB;UACpBH,IAAI;UACJa;QACJ;MACJ,CAAC;IACL,CAAC,CACL,CAAC;EACL,CAAC,EAAE,CACClB,iBAAiB,EACjBL,UAAU,EACVJ,WAAW,EACXK,SAAS,EACTU,aAAa,EACbd,gBAAgB,EAChBmB,WAAW,EACXrB,MAAM,EACNO,mBAAmB,EACnBH,QAAQ,EACRS,OAAO,EACPD,OAAO,EACPT,YAAY,EACZc,cAAc,EACdK,cAAc,EACdJ,oBAAoB,EACpBH,IAAI,EACJD,kCAAkC,CACrC,CAAC;EAEF,MAAMyB,OAA+B,GAAGhD,OAAO,CAAC,MAAM;IAClD,IAAIiB,eAAe,EAAE;MACjB,QAAQ,IAAI;QACR,KAAKF,SAAS,KAAK,MAAM;UACrB,OAAO;YAAEkC,CAAC,EAAE;UAAK,CAAC;QACtB,KAAKlC,SAAS,KAAK,OAAO;UACtB,OAAO;YAAEkC,CAAC,EAAE;UAAQ,CAAC;QACzB;UACI,OAAO;YAAEA,CAAC,EAAE;UAAO,CAAC;MAC5B;IACJ,CAAC,MAAM;MACH,QAAQ,IAAI;QACR,KAAKlC,SAAS,KAAK,MAAM;UACrB,OAAO;YAAEkC,CAAC,EAAE;UAAK,CAAC;QACtB,KAAKlC,SAAS,KAAK,OAAO;UACtB,OAAO;YAAEkC,CAAC,EAAE;UAAQ,CAAC;QACzB;UACI,OAAO;YAAEA,CAAC,EAAE;UAAQ,CAAC;MAC7B;IACJ;EACJ,CAAC,EAAE,CAAClC,SAAS,EAAEE,eAAe,CAAC,CAAC;EAEhC,oBACInB,KAAA,CAAAyC,aAAA,CAAClC,kBAAkB;IAAC6C,OAAO,EAAElB,WAAY;IAACmB,MAAM,EAAEjC;EAAM,gBACpDpB,KAAA,CAAAyC,aAAA,CAACjC,mBAAmB;IAChB0C,OAAO,EAAEA,OAAQ;IACjBI,WAAW,EAAEhC,UAAW;IACxBiC,UAAU,EAAE;MACR7B,IAAI,EAAE,OAAO;MACb8B,QAAQ,EAAE,CAACvC,SAAS,GAAG,CAAC,GAAG;IAC/B,CAAE;IACFwC,mBAAmB,EAAEvC;EAAoB,GAExCY,OACgB,CACL,CAAC;AAE7B,CAAC;AAEDrB,YAAY,CAACiD,WAAW,GAAG,cAAc;AAEzC,eAAejD,YAAY","ignoreList":[]}

package/lib/esm/components/calendar/month-wrapper/MonthWrapper.styles.js

@@ -0,0 +1,22 @@
+import { motion } from 'framer-motion';
+import styled from 'styled-components';
+export const StyledMonthWrapper = styled.div`
+    width: ${_ref => {
+  let {
+    $width
+  } = _ref;
+  return $width;
+}}px;
+    overflow-x: clip;
+    height: ${_ref2 => {
+  let {
+    $height
+  } = _ref2;
+  return $height;
+}}px;
+`;
+export const StyledMotionWrapper = styled(motion.div)`
+    display: flex;
+    height: 100%;
+`;
+//# sourceMappingURL=MonthWrapper.styles.js.map

package/lib/esm/components/calendar/month-wrapper/MonthWrapper.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthWrapper.styles.js","names":["motion","styled","StyledMonthWrapper","div","_ref","$width","_ref2","$height","StyledMotionWrapper"],"sources":["../../../../../src/components/calendar/month-wrapper/MonthWrapper.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport { motion } from 'framer-motion';\nimport styled from 'styled-components';\n\ntype StyledMonthWrapperProps = WithTheme<{ $height: number; $width: number }>;\n\nexport const StyledMonthWrapper = styled.div<StyledMonthWrapperProps>`\n    width: ${({ $width }) => $width}px;\n    overflow-x: clip;\n    height: ${({ $height }) => $height}px;\n`;\n\ntype StyledMotionWrapperProps = { $isDisabled?: boolean };\n\nexport const StyledMotionWrapper = styled(motion.div)<StyledMotionWrapperProps>`\n    display: flex;\n    height: 100%;\n`;\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AAItC,OAAO,MAAMC,kBAAkB,GAAGD,MAAM,CAACE,GAA4B;AACrE,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,IAAA;EAAA,OAAKC,MAAM;AAAA;AACnC;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAKC,OAAO;AAAA;AACtC,CAAC;AAID,OAAO,MAAMC,mBAAmB,GAAGP,MAAM,CAACD,MAAM,CAACG,GAAG,CAA2B;AAC/E;AACA;AACA,CAAC","ignoreList":[]}