@semcore/date-picker 16.2.4 → 17.0.0-prerelease.18

package/lib/esm/components/Calendar.mjs

@@ -1,144 +1,124 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _callSuper from "@babel/runtime/helpers/esm/callSuper";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { createComponent, sstyled, assignProps, Component } from "@semcore/core";
-import keyboardFocusEnhance from "@semcore/core/lib/utils/enhances/keyboardFocusEnhance";
+import { Box, ScreenReaderOnly } from "@semcore/base-components";
 import fire from "@semcore/core/lib/utils/fire";
-import { Box, ScreenReaderOnly } from "@semcore/flex-box";
 import dayjs from "dayjs";
 import React from "react";
-import { formatDDMMYY, formatMMYY } from "../utils/formatDate.mjs";
+import { formatMMYY, formatDDMMYY } from "../utils/formatDate.mjs";
 import { includesDate } from "../utils/includesDate.mjs";
 import isBetween from "../utils/isBetweenPlugin.mjs";
-var _excluded = ["date"];
 /*!__reshadow-styles__:"../style/calendar.shadow.css"*/
-var style = (
+const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    '.___SCalendar_1fgj7_gg_{display:flex;flex-direction:column;border-radius:var(--intergalactic-surface-rounded, 6px)}.___SCalendar_1fgj7_gg_ .___SCalendarUnit_1fgj7_gg_:focus-visible{outline:0}.___SGridDays_1fgj7_gg_{display:grid;grid-template-columns:repeat(7,minmax(32px,auto));grid-template-rows:repeat(auto-fit,minmax(32px,auto))}.___SGridMonths_1fgj7_gg_{display:grid;grid-row-gap:var(--intergalactic-spacing-2x, 8px);grid-template-columns:repeat(3,minmax(60px,auto));grid-template-rows:repeat(4,minmax(32px,auto))}.___SWeekDays_1fgj7_gg_{display:grid;grid-template-columns:repeat(7,minmax(32px,auto))}.___SCalendarUnit_1fgj7_gg_,.___SWeekDay_1fgj7_gg_{align-items:center;display:flex;font-size:var(--intergalactic-fs-200, 14px);justify-content:center;min-height:32px;min-width:32px}.___SWeekDay_1fgj7_gg_{color:var(--intergalactic-text-secondary, #6c6e79);font-weight:var(--intergalactic-regular, 400);overflow:hidden}.___SCalendarUnit_1fgj7_gg_{font-family:inherit;font-weight:400;line-height:normal;-webkit-text-decoration:none;text-decoration:none;text-align:center;vertical-align:middle;border:1px solid transparent;color:var(--intergalactic-text-primary, #191b23);box-shadow:none;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:var(--intergalactic-date-picker-cell, #ffffff);border-radius:var(--intergalactic-control-rounded, 6px);box-sizing:border-box;cursor:pointer;position:relative;transition:border-radius .15s .15s;outline:0;margin:4px 0 0}@media (hover:hover){.___SCalendarUnit_1fgj7_gg_:hover{color:var(--intergalactic-text-primary, #191b23);background-color:var(--intergalactic-date-picker-cell-hover, #e0e1e9)}}.___SCalendarUnit_1fgj7_gg_.__today_1fgj7_gg_:before{content:"";position:absolute;display:block;top:1px;left:1px;border-radius:var(--intergalactic-control-rounded, 6px);width:calc(100% - 2px);height:calc(100% - 2px);box-sizing:border-box;border:1px solid var(--intergalactic-date-picker-cell-current, #8a8e9b)}.___SCalendarUnit_1fgj7_gg_.___SCalendarUnit_1fgj7_gg_.__today_1fgj7_gg_.__endSelected_1fgj7_gg_:before,.___SCalendarUnit_1fgj7_gg_.___SCalendarUnit_1fgj7_gg_.__today_1fgj7_gg_.__startSelected_1fgj7_gg_:before{border-color:var(--intergalactic-border-secondary, #e0e1e9)}.___SCalendarUnit_1fgj7_gg_.__highlighted_1fgj7_gg_,.___SCalendarUnit_1fgj7_gg_.__selected_1fgj7_gg_{background-color:var(--intergalactic-date-picker-cell-range, #c4e5fe);border-radius:0;transition:border-radius 0s 0s;color:var(--intergalactic-text-primary, #191b23)}@media (hover:hover){.___SCalendarUnit_1fgj7_gg_.__selected_1fgj7_gg_:hover{background-color:var(--intergalactic-date-picker-cell-range-hover, #8ecdff)}}@media (hover:hover){.___SCalendarUnit_1fgj7_gg_.__highlighted_1fgj7_gg_:hover{background-color:var(--intergalactic-date-picker-cell-range-hover, #8ecdff)}}.___SCalendarUnit_1fgj7_gg_.__startSelected_1fgj7_gg_{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-active, #2bb3ff)}.___SCalendarUnit_1fgj7_gg_.__startSelected_1fgj7_gg_:not(.__highlighted_1fgj7_gg_){border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:0;border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-top-right-radius:0}@media (hover:hover){.___SCalendarUnit_1fgj7_gg_.__startSelected_1fgj7_gg_:hover{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-active-hover, #008ff8)}}.___SCalendarUnit_1fgj7_gg_.__endSelected_1fgj7_gg_{background-color:var(--intergalactic-date-picker-cell-active, #2bb3ff);color:var(--intergalactic-text-primary-invert, #ffffff)}.___SCalendarUnit_1fgj7_gg_.__endSelected_1fgj7_gg_:not(.__highlighted_1fgj7_gg_){border-bottom-left-radius:0;border-bottom-right-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:0;border-top-right-radius:var(--intergalactic-control-rounded, 6px)}@media (hover:hover){.___SCalendarUnit_1fgj7_gg_.__endSelected_1fgj7_gg_:hover{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-active-hover, #008ff8)}}.___SCalendarUnit_1fgj7_gg_.__startHighlighted_1fgj7_gg_:not(.__selected_1fgj7_gg_){border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:0;border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-top-right-radius:0}.___SCalendarUnit_1fgj7_gg_.__endHighlighted_1fgj7_gg_:not(.__selected_1fgj7_gg_){border-bottom-left-radius:0;border-bottom-right-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:0;border-top-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_1fgj7_gg_.__startHighlighted_1fgj7_gg_.___SCalendarUnit_1fgj7_gg_.__endHighlighted_1fgj7_gg_,.___SCalendarUnit_1fgj7_gg_.__startSelected_1fgj7_gg_.___SCalendarUnit_1fgj7_gg_.__endSelected_1fgj7_gg_{border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-top-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_1fgj7_gg_.__compareHighlighted_1fgj7_gg_{border-top:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1);border-bottom:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1);border-radius:0;transition:none}.___SCalendarUnit_1fgj7_gg_.__compareEndHighlighted_1fgj7_gg_,.___SCalendarUnit_1fgj7_gg_.__compareStartHighlighted_1fgj7_gg_{border-left:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1);border-right:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1)}.___SCalendarUnit_1fgj7_gg_.__compareEnd_1fgj7_gg_,.___SCalendarUnit_1fgj7_gg_.__compareStart_1fgj7_gg_{border-radius:0;background-color:var(--intergalactic-date-picker-cell-comparison-active, #8649e1);color:var(--intergalactic-text-primary-invert, #ffffff)}@media (hover:hover){.___SCalendarUnit_1fgj7_gg_.__compareEnd_1fgj7_gg_:hover,.___SCalendarUnit_1fgj7_gg_.__compareStart_1fgj7_gg_:hover{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-comparison-active-hover, #5925ab)}}.___SCalendarUnit_1fgj7_gg_.__compareStartHighlighted_1fgj7_gg_{border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-left-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_1fgj7_gg_.__compareEndHighlighted_1fgj7_gg_{border-top-right-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_1fgj7_gg_.__compareStart_1fgj7_gg_:not(.__compareHighlighted_1fgj7_gg_){border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-left-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_1fgj7_gg_.__compareEnd_1fgj7_gg_:not(.__compareHighlighted_1fgj7_gg_){border-top-right-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_1fgj7_gg_.__outdated_1fgj7_gg_{opacity:.2}.___SCalendarUnit_1fgj7_gg_.__disabled_1fgj7_gg_{opacity:.4;cursor:default;pointer-events:none}.___SCalendar_1fgj7_gg_:focus .___SCalendarUnit_1fgj7_gg_.__highlighted_1fgj7_gg_{z-index:1}.___SCalendar_1fgj7_gg_:focus:not(.___SCalendar_1fgj7_gg_:focus:has(.___SCalendarUnit_1fgj7_gg_.__highlighted_1fgj7_gg_)){border-radius:var(--intergalactic-surface-rounded, 6px)}@media (prefers-reduced-motion){.___SCalendarUnit_1fgj7_gg_,.___SCalendarUnit_1fgj7_gg_.__highlighted_1fgj7_gg_,.___SCalendarUnit_1fgj7_gg_.__selected_1fgj7_gg_{transition:none}}',
+    '.___SCalendar_bx7k3_gg_{display:flex;flex-direction:column;border-radius:var(--intergalactic-surface-rounded, 6px)}.___SCalendar_bx7k3_gg_ .___SCalendarUnit_bx7k3_gg_:focus-visible{outline:0}.___SGridDays_bx7k3_gg_{display:grid;grid-template-columns:repeat(7,minmax(32px,auto));grid-template-rows:repeat(auto-fit,minmax(32px,auto))}.___SGridMonths_bx7k3_gg_{display:grid;grid-row-gap:var(--intergalactic-spacing-2x, 8px);grid-template-columns:repeat(3,minmax(60px,auto));grid-template-rows:repeat(4,minmax(32px,auto))}.___SWeekDays_bx7k3_gg_{display:grid;grid-template-columns:repeat(7,minmax(32px,auto))}.___SCalendarUnit_bx7k3_gg_,.___SWeekDay_bx7k3_gg_{align-items:center;display:flex;font-size:var(--intergalactic-fs-200, 14px);justify-content:center;min-height:32px;min-width:32px}.___SWeekDay_bx7k3_gg_{color:var(--intergalactic-text-secondary, #6c6e79);font-weight:var(--intergalactic-regular, 400);overflow:hidden}.___SCalendarUnit_bx7k3_gg_{font-family:inherit;font-weight:400;line-height:normal;-webkit-text-decoration:none;text-decoration:none;text-align:center;vertical-align:middle;border:1px solid transparent;color:var(--intergalactic-text-primary, #191b23);box-shadow:none;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:var(--intergalactic-date-picker-cell, #ffffff);border-radius:var(--intergalactic-control-rounded, 6px);box-sizing:border-box;cursor:pointer;position:relative;transition:border-radius .15s .15s;outline:0;margin:4px 0 0}@media (hover:hover){.___SCalendarUnit_bx7k3_gg_:hover{color:var(--intergalactic-text-primary, #191b23);background-color:var(--intergalactic-date-picker-cell-hover, #e0e1e9)}}.___SCalendarUnit_bx7k3_gg_.__today_bx7k3_gg_:before{content:"";position:absolute;display:block;top:1px;left:1px;border-radius:var(--intergalactic-control-rounded, 6px);width:calc(100% - 2px);height:calc(100% - 2px);box-sizing:border-box;border:1px solid var(--intergalactic-date-picker-cell-current, #8a8e9b)}.___SCalendarUnit_bx7k3_gg_.___SCalendarUnit_bx7k3_gg_.__today_bx7k3_gg_.__endSelected_bx7k3_gg_:before,.___SCalendarUnit_bx7k3_gg_.___SCalendarUnit_bx7k3_gg_.__today_bx7k3_gg_.__startSelected_bx7k3_gg_:before{border-color:var(--intergalactic-border-secondary, #e0e1e9)}.___SCalendarUnit_bx7k3_gg_.__highlighted_bx7k3_gg_,.___SCalendarUnit_bx7k3_gg_.__selected_bx7k3_gg_{background-color:var(--intergalactic-date-picker-cell-range, #c4e5fe);border-radius:0;transition:border-radius 0s 0s;color:var(--intergalactic-text-primary, #191b23)}@media (hover:hover){.___SCalendarUnit_bx7k3_gg_.__selected_bx7k3_gg_:hover{background-color:var(--intergalactic-date-picker-cell-range-hover, #8ecdff)}}@media (hover:hover){.___SCalendarUnit_bx7k3_gg_.__highlighted_bx7k3_gg_:hover{background-color:var(--intergalactic-date-picker-cell-range-hover, #8ecdff)}}.___SCalendarUnit_bx7k3_gg_.__startSelected_bx7k3_gg_{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-active, #2bb3ff)}.___SCalendarUnit_bx7k3_gg_.__startSelected_bx7k3_gg_:not(.__highlighted_bx7k3_gg_){border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:0;border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-top-right-radius:0}@media (hover:hover){.___SCalendarUnit_bx7k3_gg_.__startSelected_bx7k3_gg_:hover{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-active-hover, #008ff8)}}.___SCalendarUnit_bx7k3_gg_.__endSelected_bx7k3_gg_{background-color:var(--intergalactic-date-picker-cell-active, #2bb3ff);color:var(--intergalactic-text-primary-invert, #ffffff)}.___SCalendarUnit_bx7k3_gg_.__endSelected_bx7k3_gg_:not(.__highlighted_bx7k3_gg_){border-bottom-left-radius:0;border-bottom-right-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:0;border-top-right-radius:var(--intergalactic-control-rounded, 6px)}@media (hover:hover){.___SCalendarUnit_bx7k3_gg_.__endSelected_bx7k3_gg_:hover{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-active-hover, #008ff8)}}.___SCalendarUnit_bx7k3_gg_.__startHighlighted_bx7k3_gg_:not(.__selected_bx7k3_gg_){border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:0;border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-top-right-radius:0}.___SCalendarUnit_bx7k3_gg_.__endHighlighted_bx7k3_gg_:not(.__selected_bx7k3_gg_){border-bottom-left-radius:0;border-bottom-right-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:0;border-top-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_bx7k3_gg_.__startHighlighted_bx7k3_gg_.___SCalendarUnit_bx7k3_gg_.__endHighlighted_bx7k3_gg_,.___SCalendarUnit_bx7k3_gg_.__startSelected_bx7k3_gg_.___SCalendarUnit_bx7k3_gg_.__endSelected_bx7k3_gg_{border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-top-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_bx7k3_gg_.__compareHighlighted_bx7k3_gg_{border-top:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1);border-bottom:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1);border-radius:0;transition:none}.___SCalendarUnit_bx7k3_gg_.__compareEndHighlighted_bx7k3_gg_,.___SCalendarUnit_bx7k3_gg_.__compareStartHighlighted_bx7k3_gg_{border-left:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1);border-right:2px dashed var(--intergalactic-date-picker-cell-comparison-active, #8649e1)}.___SCalendarUnit_bx7k3_gg_.__compareEnd_bx7k3_gg_,.___SCalendarUnit_bx7k3_gg_.__compareStart_bx7k3_gg_{border-radius:0;background-color:var(--intergalactic-date-picker-cell-comparison-active, #8649e1);color:var(--intergalactic-text-primary-invert, #ffffff)}@media (hover:hover){.___SCalendarUnit_bx7k3_gg_.__compareEnd_bx7k3_gg_:hover,.___SCalendarUnit_bx7k3_gg_.__compareStart_bx7k3_gg_:hover{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-date-picker-cell-comparison-active-hover, #5925ab)}}.___SCalendarUnit_bx7k3_gg_.__compareStartHighlighted_bx7k3_gg_{border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-left-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_bx7k3_gg_.__compareEndHighlighted_bx7k3_gg_{border-top-right-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_bx7k3_gg_.__compareStart_bx7k3_gg_:not(.__compareHighlighted_bx7k3_gg_){border-top-left-radius:var(--intergalactic-control-rounded, 6px);border-bottom-left-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_bx7k3_gg_.__compareEnd_bx7k3_gg_:not(.__compareHighlighted_bx7k3_gg_){border-top-right-radius:var(--intergalactic-control-rounded, 6px);border-bottom-right-radius:var(--intergalactic-control-rounded, 6px)}.___SCalendarUnit_bx7k3_gg_.__outdated_bx7k3_gg_{opacity:.2}.___SCalendarUnit_bx7k3_gg_.__disabled_bx7k3_gg_{opacity:.4;cursor:default;pointer-events:none}.___SCalendar_bx7k3_gg_:focus .___SCalendarUnit_bx7k3_gg_.__highlighted_bx7k3_gg_{z-index:1}.___SCalendar_bx7k3_gg_:focus:not(.___SCalendar_bx7k3_gg_:focus:has(.___SCalendarUnit_bx7k3_gg_.__highlighted_bx7k3_gg_)){border-radius:var(--intergalactic-surface-rounded, 6px)}@media (prefers-reduced-motion){.___SCalendarUnit_bx7k3_gg_,.___SCalendarUnit_bx7k3_gg_.__highlighted_bx7k3_gg_,.___SCalendarUnit_bx7k3_gg_.__selected_bx7k3_gg_{transition:none}}',
     /*__inner_css_end__*/
-    "1fgj7_gg_"
+    "bx7k3_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SGridDays": "___SGridDays_1fgj7_gg_",
-    "__SGridMonths": "___SGridMonths_1fgj7_gg_",
-    "__SWeekDays": "___SWeekDays_1fgj7_gg_",
-    "__SWeekDay": "___SWeekDay_1fgj7_gg_",
-    "__SCalendarUnit": "___SCalendarUnit_1fgj7_gg_",
-    "_startHighlighted": "__startHighlighted_1fgj7_gg_",
-    "_selected": "__selected_1fgj7_gg_",
-    "_endHighlighted": "__endHighlighted_1fgj7_gg_",
-    "_startSelected": "__startSelected_1fgj7_gg_",
-    "_endSelected": "__endSelected_1fgj7_gg_",
-    "_compareHighlighted": "__compareHighlighted_1fgj7_gg_",
-    "_compareStartHighlighted": "__compareStartHighlighted_1fgj7_gg_",
-    "_compareEndHighlighted": "__compareEndHighlighted_1fgj7_gg_",
-    "_compareStart": "__compareStart_1fgj7_gg_",
-    "_compareEnd": "__compareEnd_1fgj7_gg_",
-    "_outdated": "__outdated_1fgj7_gg_",
-    "_disabled": "__disabled_1fgj7_gg_",
-    "_highlighted": "__highlighted_1fgj7_gg_",
-    "__SCalendar": "___SCalendar_1fgj7_gg_",
-    "_today": "__today_1fgj7_gg_"
+    "__SGridDays": "___SGridDays_bx7k3_gg_",
+    "__SGridMonths": "___SGridMonths_bx7k3_gg_",
+    "__SWeekDays": "___SWeekDays_bx7k3_gg_",
+    "__SWeekDay": "___SWeekDay_bx7k3_gg_",
+    "__SCalendarUnit": "___SCalendarUnit_bx7k3_gg_",
+    "_startHighlighted": "__startHighlighted_bx7k3_gg_",
+    "_selected": "__selected_bx7k3_gg_",
+    "_endHighlighted": "__endHighlighted_bx7k3_gg_",
+    "_startSelected": "__startSelected_bx7k3_gg_",
+    "_endSelected": "__endSelected_bx7k3_gg_",
+    "_compareHighlighted": "__compareHighlighted_bx7k3_gg_",
+    "_compareStartHighlighted": "__compareStartHighlighted_bx7k3_gg_",
+    "_compareEndHighlighted": "__compareEndHighlighted_bx7k3_gg_",
+    "_compareStart": "__compareStart_bx7k3_gg_",
+    "_compareEnd": "__compareEnd_bx7k3_gg_",
+    "_outdated": "__outdated_bx7k3_gg_",
+    "_disabled": "__disabled_bx7k3_gg_",
+    "_highlighted": "__highlighted_bx7k3_gg_",
+    "__SCalendar": "___SCalendar_bx7k3_gg_",
+    "_today": "__today_bx7k3_gg_"
   })
 );
 dayjs.extend(isBetween);
-var range = function range2(N, cb) {
-  return Array.from({
-    length: N
-  }, function(_v, k) {
-    return cb(k);
-  });
-};
+const range = (N, cb) => Array.from({
+  length: N
+}, (_v, k) => cb(k));
 function getDayJSLocaleParams(locale) {
   if (locale.includes("en") || locale.includes("ja")) {
-    return _objectSpread({
-      weekStart: 0
-    }, dayjs.Ls[locale]);
+    return {
+      weekStart: 0,
+      ...dayjs.Ls[locale]
+    };
   }
-  return _objectSpread({
-    weekStart: 1
-  }, dayjs.Ls[locale]);
+  return {
+    weekStart: 1,
+    ...dayjs.Ls[locale]
+  };
 }
-var CalendarWeekDaysRoot = /* @__PURE__ */ (function(_Component) {
-  function CalendarWeekDaysRoot2() {
-    _classCallCheck(this, CalendarWeekDaysRoot2);
-    return _callSuper(this, CalendarWeekDaysRoot2, arguments);
-  }
-  _inherits(CalendarWeekDaysRoot2, _Component);
-  return _createClass(CalendarWeekDaysRoot2, [{
-    key: "getDaysByWeek",
-    value: function getDaysByWeek() {
-      var locale = this.asProps.locale;
-      var date = dayjs().locale(locale, getDayJSLocaleParams(locale)).startOf("week");
-      return range(7, function() {
-        var _short = new Intl.DateTimeFormat(locale, {
-          weekday: "short"
-        }).format(date.valueOf());
-        var _long = new Intl.DateTimeFormat(locale, {
-          weekday: "long"
-        }).format(date.valueOf());
-        date = date.add(1, "day");
-        return {
-          "children": _short,
-          "aria-label": _long
-        };
-      });
-    }
-  }, {
-    key: "setContext",
-    value: function setContext() {
+class CalendarWeekDaysRoot extends Component {
+  getDaysByWeek() {
+    const {
+      locale
+    } = this.asProps;
+    let date = dayjs().locale(locale, getDayJSLocaleParams(locale)).startOf("week");
+    return range(7, () => {
+      const short = new Intl.DateTimeFormat(locale, {
+        weekday: "short"
+      }).format(date.valueOf());
+      const long = new Intl.DateTimeFormat(locale, {
+        weekday: "long"
+      }).format(date.valueOf());
+      date = date.add(1, "day");
       return {
-        days: this.getDaysByWeek()
+        "children": short,
+        "aria-label": long
       };
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps, _ref6;
-      var SWeekDays = Box;
-      var _this$asProps = this.asProps, Children = _this$asProps.Children, styles = _this$asProps.styles;
-      return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SWeekDays, _ref6.cn("SWeekDays", _objectSpread({}, assignProps({}, _ref))), /* @__PURE__ */ React.createElement(Children, _ref6.cn("Children", {})));
-    }
-  }]);
-})(Component);
+    });
+  }
+  setContext() {
+    return {
+      days: this.getDaysByWeek()
+    };
+  }
+  render() {
+    var _ref = this.asProps, _ref6;
+    const SWeekDays = Box;
+    const {
+      Children,
+      styles
+    } = this.asProps;
+    return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SWeekDays, _ref6.cn("SWeekDays", {
+      ...assignProps({}, _ref)
+    }), /* @__PURE__ */ React.createElement(Children, _ref6.cn("Children", {})));
+  }
+}
 _defineProperty(CalendarWeekDaysRoot, "displayName", "CalendarWeekDays");
 _defineProperty(CalendarWeekDaysRoot, "style", style);
 _defineProperty(CalendarWeekDaysRoot, "defaultProps", {
   locale: "en",
-  children: function children(_ref15) {
-    var days = _ref15.days;
-    return days.map(function(data, i) {
-      return /* @__PURE__ */ React.createElement(CalendarWeekDays.Unit, _extends({
-        key: i
-      }, data));
-    });
-  }
+  children: ({
+    days
+  }) => days.map((data, i) => /* @__PURE__ */ React.createElement(CalendarWeekDays.Unit, _extends({
+    key: i
+  }, data)))
 });
-function CalendarWeekUnit(_ref1) {
+function CalendarWeekUnit({
+  styles
+}) {
   var _ref2 = arguments[0], _ref7;
-  var styles = _ref1.styles;
-  var SWeekDay = Box;
-  return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SWeekDay, _ref7.cn("SWeekDay", _objectSpread({}, assignProps({
-    "role": "columnheader"
-  }, _ref2))));
+  const SWeekDay = Box;
+  return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SWeekDay, _ref7.cn("SWeekDay", {
+    ...assignProps({
+      "role": "columnheader"
+    }, _ref2)
+  }));
 }
 function resolveHighlighting(date, unit, highlighted) {
-  var highlighted0 = highlighted[0] ? dayjs(highlighted[0]) : null;
-  var highlighted1 = highlighted[1] ? dayjs(highlighted[1]) : highlighted0;
+  let highlighted0 = highlighted[0] ? dayjs(highlighted[0]) : null;
+  let highlighted1 = highlighted[1] ? dayjs(highlighted[1]) : highlighted0;
   if (highlighted0 && highlighted1) {
-    if (highlighted0 > highlighted1) {
-      var _ref10 = [highlighted0, highlighted1];
-      highlighted1 = _ref10[0];
-      highlighted0 = _ref10[1];
-    }
+    if (highlighted0 > highlighted1) [highlighted1, highlighted0] = [highlighted0, highlighted1];
     return {
       highlighted: date.isBetween(highlighted0, highlighted1, unit, "[]"),
       startHighlighted: highlighted0 && date.isSame(highlighted0, "date"),
@@ -152,363 +132,357 @@ function resolveHighlighting(date, unit, highlighted) {
   };
 }
 function resolveSelecting(date, unit, value) {
-  var value0 = value[0] ? dayjs(value[0]) : null;
-  var value1 = value[1] ? dayjs(value[1]) : null;
-  var selected;
+  let value0 = value[0] ? dayjs(value[0]) : null;
+  let value1 = value[1] ? dayjs(value[1]) : null;
+  let selected;
   if (value0 && value1) {
-    if (value0 > value1) {
-      var _ref11 = [value0, value1];
-      value1 = _ref11[0];
-      value0 = _ref11[1];
-    }
+    if (value0 > value1) [value1, value0] = [value0, value1];
     selected = date.isBetween(value0, value1, unit, "()");
   }
-  var startSelected = value0 && date.isSame(value0, unit);
-  var endSelected = value1 && date.isSame(value1, unit);
+  const startSelected = value0 && date.isSame(value0, unit);
+  const endSelected = value1 && date.isSame(value1, unit);
   return {
     selected,
     startSelected,
     endSelected
   };
 }
-var CalendarAbstract = /* @__PURE__ */ (function(_Component2) {
-  function CalendarAbstract2() {
-    var _this;
-    _classCallCheck(this, CalendarAbstract2);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, CalendarAbstract2, [].concat(args));
-    _defineProperty(_this, "today", new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0)));
-    _defineProperty(_this, "handleMouseLeave", function() {
-      var highlighted = _this.asProps.highlighted;
-      fire(_this, "onHighlightedChange", highlighted.length ? [highlighted[0]] : []);
+class CalendarAbstract extends Component {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "today", new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0)));
+    _defineProperty(this, "handleMouseLeave", () => {
+      const {
+        highlighted
+      } = this.asProps;
+      fire(this, "onHighlightedChange", highlighted.length ? [highlighted[0]] : []);
     });
-    _defineProperty(_this, "formatter", formatDDMMYY);
-    return _this;
+    _defineProperty(this, "formatter", formatDDMMYY);
   }
-  _inherits(CalendarAbstract2, _Component2);
-  return _createClass(CalendarAbstract2, [{
-    key: "createUnit",
-    value: function createUnit(_ref12, unit) {
-      var _this2 = this;
-      var date = _ref12.date, other = _objectWithoutProperties(_ref12, _excluded);
-      var self = this;
-      var _this$asProps2 = this.asProps, _disabled = _this$asProps2.disabled, value = _this$asProps2.value, compare = _this$asProps2.compare, highlighted = _this$asProps2.highlighted, compareHighlighted = _this$asProps2.compareHighlighted, locale = _this$asProps2.locale;
-      var highlighting = resolveHighlighting(date, unit, highlighted !== null && highlighted !== void 0 ? highlighted : []);
-      var comparedHighlighting = resolveHighlighting(date, unit, compareHighlighted !== null && compareHighlighted !== void 0 ? compareHighlighted : []);
-      var selecting = resolveSelecting(date, unit, value !== null && value !== void 0 ? value : []);
-      var comparing = resolveSelecting(date, unit, compare !== null && compare !== void 0 ? compare : []);
-      var disabled = _disabled.some(includesDate(date, unit));
-      return _objectSpread({
-        "date": formatDDMMYY(date, locale),
-        "dateKey": this.formatter(date, locale),
-        "children": "",
-        "role": "gridcell",
-        "startSelected": selecting.startSelected,
-        "endSelected": selecting.endSelected,
-        "selected": selecting.selected,
-        "highlighted": highlighting.highlighted,
-        "startHighlighted": highlighting.startHighlighted,
-        "endHighlighted": highlighting.endHighlighted,
-        "compareHighlighted": comparedHighlighting.highlighted || comparing.selected,
-        "compareStartHighlighted": comparedHighlighting.startHighlighted,
-        "compareEndHighlighted": comparedHighlighting.endHighlighted,
-        "compareStart": comparing.startSelected,
-        "compareEnd": comparing.endSelected,
-        "aria-selected": selecting.selected,
-        "aria-disabled": disabled,
-        "aria-current": highlighting.highlighted ? "date" : void 0,
-        disabled,
-        "today": date.isSame(self.today, unit),
-        "onClick": function onClick() {
-          var _this2$asProps = _this2.asProps, range3 = _this2$asProps.range, _highlighted = _this2$asProps.highlighted;
-          var highlighted2 = [date.valueOf()];
-          if (_highlighted.length === 1) {
-            highlighted2 = [_highlighted[0], date.valueOf()];
-          } else if (_highlighted.length >= 2) {
-            highlighted2 = [];
-          }
-          if (range3 === "compare") {
-            fire(_this2, "onCompareHighlightedChange", highlighted2);
+  createUnit({
+    date,
+    ...other
+  }, unit) {
+    const self = this;
+    const {
+      disabled: _disabled,
+      value,
+      compare,
+      highlighted,
+      compareHighlighted,
+      locale
+    } = this.asProps;
+    const highlighting = resolveHighlighting(date, unit, highlighted ?? []);
+    const comparedHighlighting = resolveHighlighting(date, unit, compareHighlighted ?? []);
+    const selecting = resolveSelecting(date, unit, value ?? []);
+    const comparing = resolveSelecting(date, unit, compare ?? []);
+    const disabled = _disabled.some(includesDate(date, unit));
+    return {
+      "date": formatDDMMYY(date, locale),
+      "dateKey": this.formatter(date, locale),
+      "children": "",
+      "role": "gridcell",
+      "startSelected": selecting.startSelected,
+      "endSelected": selecting.endSelected,
+      "selected": selecting.selected,
+      "highlighted": highlighting.highlighted,
+      "startHighlighted": highlighting.startHighlighted,
+      "endHighlighted": highlighting.endHighlighted,
+      "compareHighlighted": comparedHighlighting.highlighted || comparing.selected,
+      "compareStartHighlighted": comparedHighlighting.startHighlighted,
+      "compareEndHighlighted": comparedHighlighting.endHighlighted,
+      "compareStart": comparing.startSelected,
+      "compareEnd": comparing.endSelected,
+      "aria-selected": selecting.selected,
+      "aria-disabled": disabled,
+      "aria-current": highlighting.highlighted ? "date" : void 0,
+      disabled,
+      "today": date.isSame(self.today, unit),
+      "onClick": () => {
+        const {
+          range: range2,
+          highlighted: _highlighted
+        } = this.asProps;
+        let highlighted2 = [date.valueOf()];
+        if (_highlighted.length === 1) {
+          highlighted2 = [_highlighted[0], date.valueOf()];
+        } else if (_highlighted.length >= 2) {
+          highlighted2 = [];
+        }
+        if (range2 === "compare") {
+          fire(this, "onCompareHighlightedChange", highlighted2);
+        } else {
+          fire(this, "onHighlightedChange", highlighted2);
+        }
+        fire(this, "onChange", date.toDate());
+      },
+      "onMouseEnter": () => {
+        const {
+          range: range2,
+          highlighted: _highlighted
+        } = this.asProps;
+        const value2 = range2 === "compare" ? this.asProps.compare : this.asProps.value;
+        if (_highlighted[0] || (value2 ?? []).length === 1) {
+          const startDate = _highlighted[0] || (value2 ?? [])[0];
+          const highlighted2 = [startDate.valueOf(), date.valueOf()];
+          if (range2 === "compare") {
+            fire(this, "onCompareHighlightedChange", highlighted2);
           } else {
-            fire(_this2, "onHighlightedChange", highlighted2);
-          }
-          fire(_this2, "onChange", date.toDate());
-        },
-        "onMouseEnter": function onMouseEnter() {
-          var _this2$asProps2 = _this2.asProps, range3 = _this2$asProps2.range, _highlighted = _this2$asProps2.highlighted;
-          var value2 = range3 === "compare" ? _this2.asProps.compare : _this2.asProps.value;
-          if (_highlighted[0] || (value2 !== null && value2 !== void 0 ? value2 : []).length === 1) {
-            var startDate = _highlighted[0] || (value2 !== null && value2 !== void 0 ? value2 : [])[0];
-            var _highlighted2 = [startDate.valueOf(), date.valueOf()];
-            if (range3 === "compare") {
-              fire(_this2, "onCompareHighlightedChange", _highlighted2);
-            } else {
-              fire(_this2, "onHighlightedChange", _highlighted2);
-            }
+            fire(this, "onHighlightedChange", highlighted2);
           }
         }
-      }, other);
-    }
-  }, {
-    key: "getUnitProps",
-    value: function getUnitProps(_ref13, index) {
-      var dateKey = _ref13.dateKey;
-      var inRow = 7;
-      var unitRefs = this.asProps.unitRefs;
-      return {
-        "aria-colindex": index % inRow + 1,
-        "aria-rowindex": Math.floor(index / inRow) + 1,
-        "ref": function ref(node) {
-          if (!dateKey) return;
-          unitRefs[dateKey] = node;
-        }
-      };
-    }
-  }, {
-    key: "getRootProps",
-    value: function getRootProps() {
-      return {
-        role: "grid",
-        tabIndex: 0
-      };
-    }
-  }, {
-    key: "describeValue",
-    value: function describeValue() {
-      var _this3 = this;
-      var _this$asProps3 = this.asProps, locale = _this$asProps3.locale, getI18nText = _this$asProps3.getI18nText, actionsDescribing = _this$asProps3.actionsDescribing;
-      var value = this.asProps.value || [];
-      var compare = this.asProps.compare || [];
-      if (!actionsDescribing) return null;
-      var t = function t2(key, date) {
-        return getI18nText(key, date ? {
-          date: _this3.formatter(date, locale)
-        } : void 0);
-      };
-      var description = "";
-      if (value.length === 1 || compare.length === 1) {
-        description += t("selectingStarted") + ". ";
-      } else if (value.length === 2 || compare.length === 2) {
-        description += t("selectingFinished") + ". ";
+      },
+      ...other
+    };
+  }
+  getUnitProps({
+    dateKey
+  }, index) {
+    const inRow = 7;
+    const {
+      unitRefs
+    } = this.asProps;
+    return {
+      "aria-colindex": index % inRow + 1,
+      "aria-rowindex": Math.floor(index / inRow) + 1,
+      "ref": (node) => {
+        if (!dateKey) return;
+        unitRefs[dateKey] = node;
       }
-      if (actionsDescribing === "range") {
-        if (value[0] || value[1]) description += t("dateRange") + " ";
+    };
+  }
+  getRootProps() {
+    return {
+      role: "grid",
+      tabIndex: 0
+    };
+  }
+  describeValue() {
+    const {
+      locale,
+      getI18nText,
+      actionsDescribing
+    } = this.asProps;
+    const value = this.asProps.value || [];
+    const compare = this.asProps.compare || [];
+    if (!actionsDescribing) return null;
+    const t = (key, date) => getI18nText(key, date ? {
+      date: this.formatter(date, locale)
+    } : void 0);
+    let description = "";
+    if (value.length === 1 || compare.length === 1) {
+      description += t("selectingStarted") + ". ";
+    } else if (value.length === 2 || compare.length === 2) {
+      description += t("selectingFinished") + ". ";
+    }
+    if (actionsDescribing === "range") {
+      if (value[0] || value[1]) description += t("dateRange") + " ";
+      if (value[0]) description += t("fromDate", value[0]) + ", ";
+      if (value[1]) description += t("toDate", value[1]) + ". ";
+    } else if (actionsDescribing === "range-compare") {
+      if (compare.length === 1) {
+        description += t("dateRange2") + " ";
+        if (compare[0]) description += t("fromDate", value[0]) + ", ";
+        if (compare[1]) description += t("toDate", value[1]) + ". ";
+      } else {
+        if (value[0] || value[1]) description += t("dateRange1") + " ";
         if (value[0]) description += t("fromDate", value[0]) + ", ";
         if (value[1]) description += t("toDate", value[1]) + ". ";
-      } else if (actionsDescribing === "range-compare") {
-        if (compare.length === 1) {
+        if (compare.length > 0) {
           description += t("dateRange2") + " ";
-          if (compare[0]) description += t("fromDate", value[0]) + ", ";
-          if (compare[1]) description += t("toDate", value[1]) + ". ";
-        } else {
-          if (value[0] || value[1]) description += t("dateRange1") + " ";
-          if (value[0]) description += t("fromDate", value[0]) + ", ";
-          if (value[1]) description += t("toDate", value[1]) + ". ";
-          if (compare.length > 0) {
-            description += t("dateRange2") + " ";
-            if (compare[0]) description += t("fromDate", compare[0]) + ", ";
-            if (compare[1]) description += t("toDate", compare[1]) + ". ";
-          }
+          if (compare[0]) description += t("fromDate", compare[0]) + ", ";
+          if (compare[1]) description += t("toDate", compare[1]) + ". ";
         }
       }
-      return description;
     }
-  }]);
-})(Component);
+    return description;
+  }
+}
 _defineProperty(CalendarAbstract, "style", style);
-function CalendarUnit(_ref14) {
+function CalendarUnit({
+  styles,
+  date,
+  long,
+  outdated,
+  disabled,
+  highlighted
+}) {
   var _ref3 = arguments[0], _ref8;
-  var styles = _ref14.styles, date = _ref14.date, _long2 = _ref14["long"], outdated = _ref14.outdated, disabled = _ref14.disabled, highlighted = _ref14.highlighted;
-  var SCalendarUnit = Box;
-  return _ref8 = sstyled(styles), /* @__PURE__ */ React.createElement(SCalendarUnit, _ref8.cn("SCalendarUnit", _objectSpread({}, assignProps({
-    "use:disabled": disabled || outdated || !date,
-    "aria-hidden": !date,
-    "aria-label": _long2 || date,
-    "use:tabIndex": highlighted ? 0 : -1
-  }, _ref3))));
+  const SCalendarUnit = Box;
+  return _ref8 = sstyled(styles), /* @__PURE__ */ React.createElement(SCalendarUnit, _ref8.cn("SCalendarUnit", {
+    ...assignProps({
+      "use:disabled": disabled || outdated || !date,
+      "aria-hidden": !date,
+      "aria-label": long || date,
+      "use:tabIndex": highlighted ? 0 : -1
+    }, _ref3)
+  }));
 }
-CalendarUnit.enhance = [keyboardFocusEnhance()];
-var CalendarDaysRoot = /* @__PURE__ */ (function(_CalendarAbstract2) {
-  function CalendarDaysRoot2() {
-    _classCallCheck(this, CalendarDaysRoot2);
-    return _callSuper(this, CalendarDaysRoot2, arguments);
-  }
-  _inherits(CalendarDaysRoot2, _CalendarAbstract2);
-  return _createClass(CalendarDaysRoot2, [{
-    key: "getDaysByMonth",
-    value: function getDaysByMonth() {
-      var _this4 = this;
-      var _this$asProps4 = this.asProps, displayedPeriod = _this$asProps4.displayedPeriod, renderOutdated = _this$asProps4.renderOutdated, locale = _this$asProps4.locale;
-      var date = dayjs(displayedPeriod).startOf("month");
-      var prevDate = date.subtract(1, "month");
-      var nextDate = date.add(1, "month");
-      var dateStartOfWeek = date.locale(locale, getDayJSLocaleParams(locale)).startOf("week").get("d") ? (date.get("d") || 7) - 1 : date.get("d");
-      var prevMonthDays = dateStartOfWeek ? range(prevDate.daysInMonth(), function(i) {
-        var day = _this4.createUnit({
-          date: prevDate,
-          outdated: true,
-          i
-        }, "date");
-        day.children = String(prevDate.get("date"));
-        prevDate = prevDate.add(1, "day");
-        return day;
-      }).slice(-dateStartOfWeek) : [];
-      var monthDays = range(date.daysInMonth(), function(i) {
-        var day = _this4.createUnit({
-          date,
-          i
-        }, "date");
-        day.children = String(date.get("date"));
-        date = date.add(1, "day");
-        return day;
-      });
-      var nextMonthDays = range(42 - prevMonthDays.length - monthDays.length, function(i) {
-        var day = _this4.createUnit({
-          date: nextDate,
-          outdated: true,
-          i
-        }, "date");
-        day.children = String(nextDate.get("date"));
-        nextDate = nextDate.add(1, "day");
-        return day;
-      });
-      if (!renderOutdated) {
-        prevMonthDays = prevMonthDays.map(function() {
-          return {
-            disabled: true,
-            children: ""
-          };
-        });
-        nextMonthDays = [];
-      }
-      return [].concat(_toConsumableArray(prevMonthDays), _toConsumableArray(monthDays), _toConsumableArray(nextMonthDays));
-    }
-  }, {
-    key: "setContext",
-    value: function setContext() {
-      return {
-        days: this.getDaysByMonth()
-      };
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref4 = this.asProps, _ref9;
-      var SCalendar = Box;
-      var SGridDays = "div";
-      var _this$asProps5 = this.asProps, Children = _this$asProps5.Children, styles = _this$asProps5.styles, locale = _this$asProps5.locale;
-      var description = this.describeValue();
-      return _ref9 = sstyled(styles), /* @__PURE__ */ React.createElement(SCalendar, _ref9.cn("SCalendar", _objectSpread({}, assignProps(_objectSpread({}, this.getRootProps()), _ref4))), /* @__PURE__ */ React.createElement(CalendarWeekDays, _ref9.cn("CalendarWeekDays", {
-        "locale": locale,
-        "role": "row"
-      })), /* @__PURE__ */ React.createElement(SGridDays, _ref9.cn("SGridDays", {
-        "onMouseLeave": this.handleMouseLeave,
-        "role": "row"
-      }), /* @__PURE__ */ React.createElement(Children, _ref9.cn("Children", {}))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref9.cn("ScreenReaderOnly", {
-        "role": "row"
-      }), /* @__PURE__ */ React.createElement("span", _ref9.cn("span", {
-        "aria-live": "polite",
-        "role": "gridcell"
-      }), description)));
+class CalendarDaysRoot extends CalendarAbstract {
+  getDaysByMonth() {
+    const {
+      displayedPeriod,
+      renderOutdated,
+      locale
+    } = this.asProps;
+    let date = dayjs(displayedPeriod).startOf("month");
+    let prevDate = date.subtract(1, "month");
+    let nextDate = date.add(1, "month");
+    const dateStartOfWeek = date.locale(locale, getDayJSLocaleParams(locale)).startOf("week").get("d") ? (date.get("d") || 7) - 1 : date.get("d");
+    let prevMonthDays = dateStartOfWeek ? range(prevDate.daysInMonth(), (i) => {
+      const day = this.createUnit({
+        date: prevDate,
+        outdated: true,
+        i
+      }, "date");
+      day.children = String(prevDate.get("date"));
+      prevDate = prevDate.add(1, "day");
+      return day;
+    }).slice(-dateStartOfWeek) : [];
+    const monthDays = range(date.daysInMonth(), (i) => {
+      const day = this.createUnit({
+        date,
+        i
+      }, "date");
+      day.children = String(date.get("date"));
+      date = date.add(1, "day");
+      return day;
+    });
+    let nextMonthDays = range(42 - prevMonthDays.length - monthDays.length, (i) => {
+      const day = this.createUnit({
+        date: nextDate,
+        outdated: true,
+        i
+      }, "date");
+      day.children = String(nextDate.get("date"));
+      nextDate = nextDate.add(1, "day");
+      return day;
+    });
+    if (!renderOutdated) {
+      prevMonthDays = prevMonthDays.map(() => ({
+        disabled: true,
+        children: ""
+      }));
+      nextMonthDays = [];
     }
-  }]);
-})(CalendarAbstract);
+    return [...prevMonthDays, ...monthDays, ...nextMonthDays];
+  }
+  setContext() {
+    return {
+      days: this.getDaysByMonth()
+    };
+  }
+  render() {
+    var _ref4 = this.asProps, _ref9;
+    const SCalendar = Box;
+    const SGridDays = "div";
+    const {
+      Children,
+      styles,
+      locale
+    } = this.asProps;
+    const description = this.describeValue();
+    return _ref9 = sstyled(styles), /* @__PURE__ */ React.createElement(SCalendar, _ref9.cn("SCalendar", {
+      ...assignProps({
+        ...this.getRootProps()
+      }, _ref4)
+    }), /* @__PURE__ */ React.createElement(CalendarWeekDays, _ref9.cn("CalendarWeekDays", {
+      "locale": locale,
+      "role": "row"
+    })), /* @__PURE__ */ React.createElement(SGridDays, _ref9.cn("SGridDays", {
+      "onMouseLeave": this.handleMouseLeave,
+      "role": "row"
+    }), /* @__PURE__ */ React.createElement(Children, _ref9.cn("Children", {}))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref9.cn("ScreenReaderOnly", {
+      "role": "row"
+    }), /* @__PURE__ */ React.createElement("span", _ref9.cn("span", {
+      "aria-live": "polite",
+      "role": "gridcell"
+    }), description)));
+  }
+}
 _defineProperty(CalendarDaysRoot, "displayName", "CalendarDays");
 _defineProperty(CalendarDaysRoot, "defaultProps", {
   displayedPeriod: new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0)),
   disabled: [],
   value: [],
   locale: "en",
-  children: function children2(_ref16) {
-    var days = _ref16.days;
-    return days.map(function(data, i) {
-      return /* @__PURE__ */ React.createElement(CalendarDays.Unit, _extends({
-        key: i
-      }, data));
+  children: ({
+    days
+  }) => days.map((data, i) => /* @__PURE__ */ React.createElement(CalendarDays.Unit, _extends({
+    key: i
+  }, data)))
+});
+class CalendarMonthsRoot extends CalendarAbstract {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "formatter", formatMMYY);
+  }
+  getMonthsByYear() {
+    const {
+      displayedPeriod,
+      locale
+    } = this.asProps;
+    let date = dayjs(displayedPeriod).startOf("year");
+    return range(12, () => {
+      const month = this.createUnit({
+        date
+      }, "month");
+      month.children = new Intl.DateTimeFormat(locale, {
+        month: "short"
+      }).format(date.valueOf());
+      month.long = new Intl.DateTimeFormat(locale, {
+        month: "long",
+        year: "numeric"
+      }).format(date.valueOf());
+      date = date.add(1, "month");
+      return month;
     });
   }
-});
-var CalendarMonthsRoot = /* @__PURE__ */ (function(_CalendarAbstract3) {
-  function CalendarMonthsRoot2() {
-    var _this5;
-    _classCallCheck(this, CalendarMonthsRoot2);
-    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-      args[_key2] = arguments[_key2];
-    }
-    _this5 = _callSuper(this, CalendarMonthsRoot2, [].concat(args));
-    _defineProperty(_this5, "formatter", formatMMYY);
-    return _this5;
+  setContext() {
+    return {
+      months: this.getMonthsByYear()
+    };
   }
-  _inherits(CalendarMonthsRoot2, _CalendarAbstract3);
-  return _createClass(CalendarMonthsRoot2, [{
-    key: "getMonthsByYear",
-    value: function getMonthsByYear() {
-      var _this6 = this;
-      var _this$asProps6 = this.asProps, displayedPeriod = _this$asProps6.displayedPeriod, locale = _this$asProps6.locale;
-      var date = dayjs(displayedPeriod).startOf("year");
-      return range(12, function() {
-        var month = _this6.createUnit({
-          date
-        }, "month");
-        month.children = new Intl.DateTimeFormat(locale, {
-          month: "short"
-        }).format(date.valueOf());
-        month["long"] = new Intl.DateTimeFormat(locale, {
-          month: "long",
-          year: "numeric"
-        }).format(date.valueOf());
-        date = date.add(1, "month");
-        return month;
-      });
-    }
-  }, {
-    key: "setContext",
-    value: function setContext() {
-      return {
-        months: this.getMonthsByYear()
-      };
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref5 = this.asProps, _ref0;
-      var SCalendar = Box;
-      var SGridMonths = "div";
-      var _this$asProps7 = this.asProps, Children = _this$asProps7.Children, styles = _this$asProps7.styles;
-      var description = this.describeValue();
-      return _ref0 = sstyled(styles), /* @__PURE__ */ React.createElement(SCalendar, _ref0.cn("SCalendar", _objectSpread({}, assignProps(_objectSpread({}, this.getRootProps()), _ref5))), /* @__PURE__ */ React.createElement(SGridMonths, _ref0.cn("SGridMonths", {
-        "onMouseLeave": this.handleMouseLeave,
-        "role": "row"
-      }), /* @__PURE__ */ React.createElement(Children, _ref0.cn("Children", {}))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref0.cn("ScreenReaderOnly", {
-        "role": "row"
-      }), /* @__PURE__ */ React.createElement("span", _ref0.cn("span", {
-        "aria-live": "polite",
-        "role": "gridcell"
-      }), description)));
-    }
-  }]);
-})(CalendarAbstract);
+  render() {
+    var _ref5 = this.asProps, _ref0;
+    const SCalendar = Box;
+    const SGridMonths = "div";
+    const {
+      Children,
+      styles
+    } = this.asProps;
+    const description = this.describeValue();
+    return _ref0 = sstyled(styles), /* @__PURE__ */ React.createElement(SCalendar, _ref0.cn("SCalendar", {
+      ...assignProps({
+        ...this.getRootProps()
+      }, _ref5)
+    }), /* @__PURE__ */ React.createElement(SGridMonths, _ref0.cn("SGridMonths", {
+      "onMouseLeave": this.handleMouseLeave,
+      "role": "row"
+    }), /* @__PURE__ */ React.createElement(Children, _ref0.cn("Children", {}))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref0.cn("ScreenReaderOnly", {
+      "role": "row"
+    }), /* @__PURE__ */ React.createElement("span", _ref0.cn("span", {
+      "aria-live": "polite",
+      "role": "gridcell"
+    }), description)));
+  }
+}
 _defineProperty(CalendarMonthsRoot, "displayName", "CalendarMonths");
 _defineProperty(CalendarMonthsRoot, "defaultProps", {
   locale: "en",
-  children: function children3(_ref17) {
-    var months = _ref17.months;
-    return months.map(function(data, i) {
-      return /* @__PURE__ */ React.createElement(CalendarMonths.Unit, _extends({
-        key: i
-      }, data));
-    });
-  }
+  children: ({
+    months
+  }) => months.map((data, i) => /* @__PURE__ */ React.createElement(CalendarMonths.Unit, _extends({
+    key: i
+  }, data)))
 });
-var CalendarWeekDays = createComponent(CalendarWeekDaysRoot, {
+const CalendarWeekDays = createComponent(CalendarWeekDaysRoot, {
   Unit: CalendarWeekUnit
 });
-var CalendarDays = createComponent(CalendarDaysRoot, {
+const CalendarDays = createComponent(CalendarDaysRoot, {
   Unit: CalendarUnit
 });
-var CalendarMonths = createComponent(CalendarMonthsRoot, {
+const CalendarMonths = createComponent(CalendarMonthsRoot, {
   Unit: CalendarUnit
 });
 export {