beesoft-components 0.2.19 → 0.2.22

package/build/index.cjs.js

@@ -6860,9 +6860,12 @@ function generateNumberArray(startingNumber, endingNumber, convertFunction) {
     }
     return numberArray;
 }
-function isEventWithinTarget(event, target) {
-    var testElement = event.target;
-    return testElement ? isElementWithinTarget(testElement, target) : false;
+function isEventOutsideTarget(event, target) {
+    var eventElement = event.target;
+    if (eventElement) {
+        return !target.isSameNode(eventElement) && !target.contains(eventElement);
+    }
+    return false;
 }
 function isElementWithinTarget(element, target) {
     return element.isSameNode(target) || element.contains(target);
@@ -24884,13 +24887,13 @@ var DomHandler = (function () {
 }());
 
 function OverlayPanel(_a) {
-    var visible = _a.visible, target = _a.target, _b = _a.shouldTargetCloseOverlay, shouldTargetCloseOverlay = _b === void 0 ? true : _b, _c = _a.shouldMatchTargetWidth, shouldMatchTargetWidth = _c === void 0 ? false : _c, _d = _a.shouldScrollCloseOverlay, shouldScrollCloseOverlay = _d === void 0 ? false : _d, _e = _a.shouldCheckZIndex, shouldCheckZIndex = _e === void 0 ? false : _e, _f = _a.unmountWhenHidden, unmountWhenHidden = _f === void 0 ? false : _f, _g = _a.appendTo, appendTo = _g === void 0 ? document.body : _g, _h = _a.transitionDuration, transitionDuration = _h === void 0 ? 400 : _h, _j = _a.showTransitionOptions, showTransitionOptions = _j === void 0 ? 'cubic-bezier(0, 0, 0.2, 1)' : _j, _k = _a.hideTransitionOptions, hideTransitionOptions = _k === void 0 ? 'linear' : _k, shown = _a.shown, hidden = _a.hidden, markupCreated = _a.markupCreated, children = _a.children;
-    var _l = React.useState(0), top = _l[0], setTop = _l[1];
-    var _m = React.useState(0), left = _m[0], setLeft = _m[1];
-    var _o = React.useState(0), width = _o[0], setWidth = _o[1];
-    var _p = React.useState(-1), zIndex = _p[0], setZIndex = _p[1];
+    var visible = _a.visible, target = _a.target, _b = _a.shouldTargetCloseOverlay, shouldTargetCloseOverlay = _b === void 0 ? true : _b, _c = _a.shouldMatchTargetWidth, shouldMatchTargetWidth = _c === void 0 ? false : _c, _d = _a.shouldScrollCloseOverlay, shouldScrollCloseOverlay = _d === void 0 ? false : _d, _e = _a.shouldCheckZIndex, shouldCheckZIndex = _e === void 0 ? false : _e, _f = _a.unmountWhenHidden, unmountWhenHidden = _f === void 0 ? false : _f, _g = _a.transitionDuration, transitionDuration = _g === void 0 ? 400 : _g, _h = _a.showTransitionOptions, showTransitionOptions = _h === void 0 ? 'cubic-bezier(0, 0, 0.2, 1)' : _h, _j = _a.hideTransitionOptions, hideTransitionOptions = _j === void 0 ? 'linear' : _j, shown = _a.shown, hidden = _a.hidden, markupCreated = _a.markupCreated, children = _a.children;
+    var _k = React.useState(0), top = _k[0], setTop = _k[1];
+    var _l = React.useState(0), left = _l[0], setLeft = _l[1];
+    var _m = React.useState(0), width = _m[0], setWidth = _m[1];
+    var _o = React.useState(-1), zIndex = _o[0], setZIndex = _o[1];
     var displayZIndex = React.useRef(100);
-    var _q = React.useState(visible), visibility = _q[0], setVisibility = _q[1];
+    var _p = React.useState(visible), visibility = _p[0], setVisibility = _p[1];
     var panelRef = React.useRef();
     var scrollerPanelRef = React.useRef();
     var listenerRef = React.useRef();
@@ -24905,6 +24908,9 @@ function OverlayPanel(_a) {
                     overflowX: 'scroll, auto',
                     overflowY: 'scroll, auto',
                 });
+                if (scrollerPanelRef.current.tagName.toLowerCase() === 'html') {
+                    scrollerPanelRef.current = document;
+                }
             }
             if (shouldCheckZIndex) {
                 var parentZIndex = getAllElementStyleValues('zIndex', function (styleValue) {
@@ -24922,7 +24928,7 @@ function OverlayPanel(_a) {
         if (visible !== undefined) {
             setVisibility(visible);
         }
-    }, [target, visible, shouldMatchTargetWidth, shouldScrollCloseOverlay, shouldCheckZIndex]);
+    }, [target, visible, shouldScrollCloseOverlay, shouldCheckZIndex]);
     var getTargetElement = function (target) {
         return (target.target
             ? target.target
@@ -24944,7 +24950,7 @@ function OverlayPanel(_a) {
         var clickListener = function (clickedWithin) { return !clickedWithin && setVisibility(false); };
         listenerRef.current = bindDocumentClickListener(panelRef.current, clickListener, otherElements);
         if (shouldScrollCloseOverlay) {
-            scrollListenerRef.current = lodash.throttle(function (event) { return panelRef.current && !isEventWithinTarget(event, panelRef.current) && setVisibility(false); }, 100);
+            scrollListenerRef.current = lodash.throttle(function (event) { return panelRef.current && isEventOutsideTarget(event, panelRef.current) && setVisibility(false); }, 100, { leading: true });
             if (scrollerPanelRef.current) {
                 scrollerPanelRef.current.addEventListener('scroll', scrollListenerRef.current);
             }
@@ -24969,21 +24975,21 @@ function OverlayPanel(_a) {
         panelRef.current = element;
         markupCreated && markupCreated(element);
     };
-    var createElement = function () {
-        var baseStyles = {
+    var baseStyles = React.useMemo(function () {
+        var styles = {
             top: top + "px",
             left: left + "px",
             zIndex: zIndex,
         };
         if (shouldMatchTargetWidth) {
-            baseStyles['width'] = width + "px";
+            styles['width'] = width + "px";
         }
-        return (jsxRuntime.jsx(BeeSoftTransition, __assign({ start: visibility, timeout: transitionDuration, showTransitionOptions: showTransitionOptions, hideTransitionOptions: hideTransitionOptions, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: unmountWhenHidden }, { children: function (_a) {
-                var state = _a.state, defaultStyle = _a.defaultStyle, transitionStyles = _a.transitionStyles;
-                return (jsxRuntime.jsx("div", __assign({ className: "bsc-absolute bsc-bg-white dark:bsc-bg-gray-900 bsc-border bsc-border-solid dark:bsc-text-white dark:bsc-border-white bsc-shadow", style: __assign(__assign(__assign({}, baseStyles), defaultStyle), transitionStyles[state]), ref: function (element) { return element && onMarkupCreated(element); } }, { children: children }), void 0));
-            } }), void 0));
-    };
-    return ReactDOM__default['default'].createPortal(createElement(), appendTo);
+        return styles;
+    }, [top, left, zIndex, width, shouldMatchTargetWidth]);
+    return (jsxRuntime.jsx(BeeSoftTransition, __assign({ start: visibility, timeout: transitionDuration, showTransitionOptions: showTransitionOptions, hideTransitionOptions: hideTransitionOptions, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: unmountWhenHidden }, { children: function (_a) {
+            var state = _a.state, defaultStyle = _a.defaultStyle, transitionStyles = _a.transitionStyles;
+            return (jsxRuntime.jsx("div", __assign({ className: "bsc-fixed bsc-bg-white dark:bsc-bg-gray-900 bsc-border bsc-border-solid dark:bsc-text-white dark:bsc-border-white bsc-shadow", style: __assign(__assign(__assign({}, baseStyles), defaultStyle), transitionStyles[state]), ref: function (element) { return element && onMarkupCreated(element); } }, { children: children }), void 0));
+        } }), void 0));
 }
 
 /**
@@ -25803,7 +25809,7 @@ var reducer = function (state, action) {
         case DateTimeActionType.SetViewDate:
             return __assign(__assign({}, state), { currentViewDate: action.viewDate || new Date(), dateInitialized: true });
         case DateTimeActionType.SetSelectedDate:
-            return __assign(__assign({}, state), { selectedDate: action.selectedDate || state.selectedDate, selectedDateChanged: !state.selectedDateChanged
+            return __assign(__assign({}, state), { selectedDate: action.selectedDate || state.selectedDate, currentViewDate: action.viewDate || state.currentViewDate, selectedDateChanged: !state.selectedDateChanged
                     ? ((_a = state.originalSetDate) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = action.selectedDate) === null || _b === void 0 ? void 0 : _b.getTime())
                     : true });
         case DateTimeActionType.SetSelectedDateRange:
@@ -25920,9 +25926,6 @@ function DateTimeCalendar(_a) {
                 dispatcher({
                     type: DateTimeActionType.SetSelectedDate,
                     selectedDate: date,
-                });
-                dispatcher({
-                    type: DateTimeActionType.SetViewDate,
                     viewDate: date,
                 });
             }
@@ -26158,6 +26161,7 @@ function DateTimeTimeSelector(_a) {
     var hours = React.useRef(['12', '01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11']);
     var minutes = React.useRef(generateNumberArray(0, 59, function (value) { return padNumber(value, 2, '0'); }));
     var ampm = React.useRef(['AM', 'PM']);
+    var savedViewDate = React.useRef(lodash.cloneDeep(viewDate));
     var getMeridianHour = function (hour) { return (hour > 11 ? hour - 12 : hour); };
     var _b = React.useState(getMeridianHour(viewDate.getHours())), currentHour = _b[0], setCurrentHour = _b[1];
     var _c = React.useState(viewDate.getMinutes()), currentMinute = _c[0], setCurrentMinute = _c[1];
@@ -26202,14 +26206,11 @@ function DateTimeTimeSelector(_a) {
     };
     var setCurrentTime = function (hour, minute, meridian) {
         var correctHour = meridian === 1 ? hour + 12 : hour;
-        viewDate.setHours(correctHour, minute);
+        savedViewDate.current.setHours(correctHour, minute);
         dispatcher({
             type: DateTimeActionType.SetSelectedDate,
-            selectedDate: viewDate,
-        });
-        dispatcher({
-            type: DateTimeActionType.SetViewDate,
-            viewDate: viewDate,
+            selectedDate: savedViewDate.current,
+            viewDate: savedViewDate.current,
         });
     };
     var onDateClicked = function () {
@@ -26273,18 +26274,11 @@ function DateTime(_a) {
     var language = React.useRef(locale || getBrowserLanguage());
     var loadedLocale = React.useRef();
     var inputElementRef = React.useRef();
-    var _l = React.useState({
+    var contextProps = React.useRef({
         calendarTemplate: calendarTemplate,
         dateScrollerTemplate: dateScrollerTemplate,
         colors: colors,
-    }), contextProps = _l[0], setContextProps = _l[1];
-    React.useEffect(function () {
-        setContextProps({
-            calendarTemplate: calendarTemplate,
-            dateScrollerTemplate: dateScrollerTemplate,
-            colors: colors,
-        });
-    }, [calendarTemplate, dateScrollerTemplate, colors]);
+    });
     React.useEffect(function () {
         if (language.current) {
             loadLocaleObject(language.current);
@@ -26350,7 +26344,7 @@ function DateTime(_a) {
         selectedDateChanged: false,
         dateInitialized: false,
     };
-    var _m = React.useReducer(reducer, initialState), state = _m[0], dispatcher = _m[1];
+    var _l = React.useReducer(reducer, initialState), state = _l[0], dispatcher = _l[1];
     var onFocus = function (event) {
         setDropDownElement();
         setSelectorOpen(true);
@@ -26362,13 +26356,10 @@ function DateTime(_a) {
             : parseDateRange(dateString, loadedLocale.current);
         if (inputDate) {
             if (!Array.isArray(inputDate)) {
-                dispatcher({
-                    type: DateTimeActionType.SetViewDate,
-                    viewDate: inputDate,
-                });
                 dispatcher({
                     type: DateTimeActionType.SetSelectedDate,
                     selectedDate: inputDate,
+                    viewDate: inputDate,
                 });
             }
             else {
@@ -26528,7 +26519,7 @@ function DateTime(_a) {
         _b["" + ((colors === null || colors === void 0 ? void 0 : colors.readOnlyInputBgColor) || 'bsc-bg-gray-200')] = readOnly,
         _b["" + ((colors === null || colors === void 0 ? void 0 : colors.inputBgColor) || 'bsc-bg-white')] = !readOnly,
         _b), "dark:bsc-bg-black " + (colors === null || colors === void 0 ? void 0 : colors.inputBorderColor) + " bc-dt-input", className);
-    return (jsxRuntime.jsx(DateTimeContext.Provider, __assign({ value: contextProps }, { children: jsxRuntime.jsxs("div", __assign({ className: "bc-date-time" }, { children: [jsxRuntime.jsxs(TemplateOutlet, __assign({ props: inputTemplateProps, template: template }, { children: [label && jsxRuntime.jsx("label", __assign({ className: "dark:bsc-text-white bc-dt-label" }, { children: label }), void 0),
+    return (jsxRuntime.jsx(DateTimeContext.Provider, __assign({ value: contextProps.current }, { children: jsxRuntime.jsxs("div", __assign({ className: "bc-date-time" }, { children: [jsxRuntime.jsxs(TemplateOutlet, __assign({ props: inputTemplateProps, template: template }, { children: [label && jsxRuntime.jsx("label", __assign({ className: "dark:bsc-text-white bc-dt-label" }, { children: label }), void 0),
                         jsxRuntime.jsx(ContentEditableInput$1, __assign({ value: getValue(), readOnly: readOnly, className: inputStyles, onFocus: onFocus, onInput: onInput, onElementCreate: onInputElementCreated }, inputProps), void 0)] }), void 0),
                 jsxRuntime.jsx(OverlayPanel, __assign({ visible: selectorOpen, target: dropDownTarget, shouldTargetCloseOverlay: false, shouldScrollCloseOverlay: true, shouldCheckZIndex: true, hidden: onDateTimeHidden, unmountWhenHidden: true }, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [state.currentSelector === DateTimeActionType.DaySelector &&
                                 canShowDateSelectors &&
@@ -26579,7 +26570,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "/*! tailwindcss v2.1.2 | MIT License | https://tailwindcss.com */\n\n/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n  tab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n  margin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n  font-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'] {\n  -webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n  padding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\n/**\n * Work around a Firefox/IE bug where the transparent `button` background\n * results in a loss of the default `button` focus styles.\n */\n\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::-webkit-input-placeholder, textarea::-webkit-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput:-ms-input-placeholder, textarea:-ms-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\nbutton {\n  cursor: pointer;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/**\n * Make replaced elements `display: block` by default as that's\n * the behavior you want almost all of the time. Inspired by\n * CSS Remedy, with `svg` added as well.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their intrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n.bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(229, 231, 235, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-bg-red-500 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(239, 68, 68, var(--tw-bg-opacity));\n}\n\n.bsc-bg-green-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 250, 229, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(219, 234, 254, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(191, 219, 254, var(--tw-bg-opacity));\n}\n\n.hover\\:bsc-bg-gray-300:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-black {\n  --tw-bg-opacity: 1;\n  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-bg-white:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-border-transparent {\n  border-color: transparent;\n}\n\n.bsc-border-black {\n  --tw-border-opacity: 1;\n  border-color: rgba(0, 0, 0, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-300 {\n  --tw-border-opacity: 1;\n  border-color: rgba(209, 213, 219, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-400 {\n  --tw-border-opacity: 1;\n  border-color: rgba(156, 163, 175, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-500 {\n  --tw-border-opacity: 1;\n  border-color: rgba(107, 114, 128, var(--tw-border-opacity));\n}\n\n.bsc-dark .dark\\:bsc-border-white {\n  --tw-border-opacity: 1;\n  border-color: rgba(255, 255, 255, var(--tw-border-opacity));\n}\n\n.bsc-rounded-md {\n  border-radius: 0.375rem;\n}\n\n.bsc-rounded-full {\n  border-radius: 9999px;\n}\n\n.bsc-border-solid {\n  border-style: solid;\n}\n\n.bsc-border-none {\n  border-style: none;\n}\n\n.bsc-border {\n  border-width: 1px;\n}\n\n.bsc-border-r {\n  border-right-width: 1px;\n}\n\n.bsc-cursor-pointer {\n  cursor: pointer;\n}\n\n.bsc-cursor-not-allowed {\n  cursor: not-allowed;\n}\n\n.bsc-flex {\n  display: flex;\n}\n\n.bsc-grid {\n  display: grid;\n}\n\n.bsc-flex-row {\n  flex-direction: row;\n}\n\n.bsc-flex-col {\n  flex-direction: column;\n}\n\n.bsc-justify-center {\n  justify-content: center;\n}\n\n.bsc-flex-grow {\n  flex-grow: 1;\n}\n\n.bsc-flex-shrink {\n  flex-shrink: 1;\n}\n\n.bsc-font-bold {\n  font-weight: 700;\n}\n\n.bsc-text-sm {\n  font-size: 0.875rem;\n  line-height: 1.25rem;\n}\n\n.bsc-mr-2 {\n  margin-right: 0.5rem;\n}\n\n.bsc-ml-2 {\n  margin-left: 0.5rem;\n}\n\n.focus\\:bsc-outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.bsc-overflow-hidden {\n  overflow: hidden;\n}\n\n.bsc-overflow-scroll {\n  overflow: scroll;\n}\n\n.bsc-overflow-x-auto {\n  overflow-x: auto;\n}\n\n.bsc-overflow-y-hidden {\n  overflow-y: hidden;\n}\n\n.bsc-p-2 {\n  padding: 0.5rem;\n}\n\n.bsc-p-4 {\n  padding: 1rem;\n}\n\n.bsc-py-1 {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n\n.bsc-px-2 {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n\n.bsc-pr-4 {\n  padding-right: 1rem;\n}\n\n.bsc-pl-4 {\n  padding-left: 1rem;\n}\n\n.bsc-pb-8 {\n  padding-bottom: 2rem;\n}\n\n.bsc-absolute {\n  position: absolute;\n}\n\n* {\n  --tw-shadow: 0 0 #0000;\n}\n\n.bsc-shadow-sm {\n  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.bsc-shadow {\n  --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n* {\n  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgba(59, 130, 246, 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n}\n\n.bsc-text-left {\n  text-align: left;\n}\n\n.bsc-text-center {\n  text-align: center;\n}\n\n.bsc-text-gray-400 {\n  --tw-text-opacity: 1;\n  color: rgba(156, 163, 175, var(--tw-text-opacity));\n}\n\n.bsc-text-red-300 {\n  --tw-text-opacity: 1;\n  color: rgba(252, 165, 165, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-black {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-white {\n  --tw-text-opacity: 1;\n  color: rgba(255, 255, 255, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-text-black:hover {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-whitespace-pre {\n  white-space: pre;\n}\n\n.bsc-w-24 {\n  width: 6rem;\n}\n\n.bsc-w-full {\n  width: 100%;\n}\n\n.bsc-gap-3 {\n  gap: 0.75rem;\n}\n\n.bsc-gap-4 {\n  gap: 1rem;\n}\n\n.bsc-grid-cols-4 {\n  grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n\n.bsc-grid-cols-7 {\n  grid-template-columns: repeat(7, minmax(0, 1fr));\n}\n\n.bsc-col-span-4 {\n  grid-column: span 4 / span 4;\n}\n\n@-webkit-keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@-webkit-keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@-webkit-keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\nbody {\n  margin: 0;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n\n@media (min-width: 640px) {\n}\n\n@media (min-width: 768px) {\n}\n\n@media (min-width: 1024px) {\n}\n\n@media (min-width: 1280px) {\n}\n\n@media (min-width: 1536px) {\n}\n";
+var css_248z = "/*! tailwindcss v2.1.2 | MIT License | https://tailwindcss.com */\n\n/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n  tab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n  margin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n  font-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'] {\n  -webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n  padding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\n/**\n * Work around a Firefox/IE bug where the transparent `button` background\n * results in a loss of the default `button` focus styles.\n */\n\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::-webkit-input-placeholder, textarea::-webkit-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput:-ms-input-placeholder, textarea:-ms-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\nbutton {\n  cursor: pointer;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/**\n * Make replaced elements `display: block` by default as that's\n * the behavior you want almost all of the time. Inspired by\n * CSS Remedy, with `svg` added as well.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their intrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n.bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(229, 231, 235, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-bg-red-500 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(239, 68, 68, var(--tw-bg-opacity));\n}\n\n.bsc-bg-green-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 250, 229, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(219, 234, 254, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(191, 219, 254, var(--tw-bg-opacity));\n}\n\n.hover\\:bsc-bg-gray-300:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-black {\n  --tw-bg-opacity: 1;\n  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-bg-white:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-border-transparent {\n  border-color: transparent;\n}\n\n.bsc-border-black {\n  --tw-border-opacity: 1;\n  border-color: rgba(0, 0, 0, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-300 {\n  --tw-border-opacity: 1;\n  border-color: rgba(209, 213, 219, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-400 {\n  --tw-border-opacity: 1;\n  border-color: rgba(156, 163, 175, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-500 {\n  --tw-border-opacity: 1;\n  border-color: rgba(107, 114, 128, var(--tw-border-opacity));\n}\n\n.bsc-dark .dark\\:bsc-border-white {\n  --tw-border-opacity: 1;\n  border-color: rgba(255, 255, 255, var(--tw-border-opacity));\n}\n\n.bsc-rounded-md {\n  border-radius: 0.375rem;\n}\n\n.bsc-rounded-full {\n  border-radius: 9999px;\n}\n\n.bsc-border-solid {\n  border-style: solid;\n}\n\n.bsc-border-none {\n  border-style: none;\n}\n\n.bsc-border {\n  border-width: 1px;\n}\n\n.bsc-border-r {\n  border-right-width: 1px;\n}\n\n.bsc-cursor-pointer {\n  cursor: pointer;\n}\n\n.bsc-cursor-not-allowed {\n  cursor: not-allowed;\n}\n\n.bsc-flex {\n  display: flex;\n}\n\n.bsc-grid {\n  display: grid;\n}\n\n.bsc-flex-row {\n  flex-direction: row;\n}\n\n.bsc-flex-col {\n  flex-direction: column;\n}\n\n.bsc-justify-center {\n  justify-content: center;\n}\n\n.bsc-flex-grow {\n  flex-grow: 1;\n}\n\n.bsc-flex-shrink {\n  flex-shrink: 1;\n}\n\n.bsc-font-bold {\n  font-weight: 700;\n}\n\n.bsc-text-sm {\n  font-size: 0.875rem;\n  line-height: 1.25rem;\n}\n\n.bsc-mr-2 {\n  margin-right: 0.5rem;\n}\n\n.bsc-ml-2 {\n  margin-left: 0.5rem;\n}\n\n.focus\\:bsc-outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.bsc-overflow-hidden {\n  overflow: hidden;\n}\n\n.bsc-overflow-scroll {\n  overflow: scroll;\n}\n\n.bsc-overflow-x-auto {\n  overflow-x: auto;\n}\n\n.bsc-overflow-y-hidden {\n  overflow-y: hidden;\n}\n\n.bsc-p-2 {\n  padding: 0.5rem;\n}\n\n.bsc-p-4 {\n  padding: 1rem;\n}\n\n.bsc-py-1 {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n\n.bsc-px-2 {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n\n.bsc-pr-4 {\n  padding-right: 1rem;\n}\n\n.bsc-pl-4 {\n  padding-left: 1rem;\n}\n\n.bsc-pb-8 {\n  padding-bottom: 2rem;\n}\n\n.bsc-fixed {\n  position: fixed;\n}\n\n* {\n  --tw-shadow: 0 0 #0000;\n}\n\n.bsc-shadow-sm {\n  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.bsc-shadow {\n  --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n* {\n  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgba(59, 130, 246, 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n}\n\n.bsc-text-left {\n  text-align: left;\n}\n\n.bsc-text-center {\n  text-align: center;\n}\n\n.bsc-text-gray-400 {\n  --tw-text-opacity: 1;\n  color: rgba(156, 163, 175, var(--tw-text-opacity));\n}\n\n.bsc-text-red-300 {\n  --tw-text-opacity: 1;\n  color: rgba(252, 165, 165, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-black {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-white {\n  --tw-text-opacity: 1;\n  color: rgba(255, 255, 255, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-text-black:hover {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-whitespace-pre {\n  white-space: pre;\n}\n\n.bsc-w-24 {\n  width: 6rem;\n}\n\n.bsc-w-full {\n  width: 100%;\n}\n\n.bsc-gap-3 {\n  gap: 0.75rem;\n}\n\n.bsc-gap-4 {\n  gap: 1rem;\n}\n\n.bsc-grid-cols-4 {\n  grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n\n.bsc-grid-cols-7 {\n  grid-template-columns: repeat(7, minmax(0, 1fr));\n}\n\n.bsc-col-span-4 {\n  grid-column: span 4 / span 4;\n}\n\n@-webkit-keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@-webkit-keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@-webkit-keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\nbody {\n  margin: 0;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n\n@media (min-width: 640px) {\n}\n\n@media (min-width: 768px) {\n}\n\n@media (min-width: 1024px) {\n}\n\n@media (min-width: 1280px) {\n}\n\n@media (min-width: 1536px) {\n}\n";
 styleInject(css_248z);
 
 /*!

package/build/index.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
-import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle, createContext, useContext, useReducer } from 'react';
+import React, { useState, useRef, useEffect, useMemo, forwardRef, useImperativeHandle, createContext, useContext, useReducer } from 'react';
 import ReactDOM from 'react-dom';
 
 /*! *****************************************************************************
@@ -6831,9 +6831,12 @@ function generateNumberArray(startingNumber, endingNumber, convertFunction) {
     }
     return numberArray;
 }
-function isEventWithinTarget(event, target) {
-    var testElement = event.target;
-    return testElement ? isElementWithinTarget(testElement, target) : false;
+function isEventOutsideTarget(event, target) {
+    var eventElement = event.target;
+    if (eventElement) {
+        return !target.isSameNode(eventElement) && !target.contains(eventElement);
+    }
+    return false;
 }
 function isElementWithinTarget(element, target) {
     return element.isSameNode(target) || element.contains(target);
@@ -24855,13 +24858,13 @@ var DomHandler = (function () {
 }());
 
 function OverlayPanel(_a) {
-    var visible = _a.visible, target = _a.target, _b = _a.shouldTargetCloseOverlay, shouldTargetCloseOverlay = _b === void 0 ? true : _b, _c = _a.shouldMatchTargetWidth, shouldMatchTargetWidth = _c === void 0 ? false : _c, _d = _a.shouldScrollCloseOverlay, shouldScrollCloseOverlay = _d === void 0 ? false : _d, _e = _a.shouldCheckZIndex, shouldCheckZIndex = _e === void 0 ? false : _e, _f = _a.unmountWhenHidden, unmountWhenHidden = _f === void 0 ? false : _f, _g = _a.appendTo, appendTo = _g === void 0 ? document.body : _g, _h = _a.transitionDuration, transitionDuration = _h === void 0 ? 400 : _h, _j = _a.showTransitionOptions, showTransitionOptions = _j === void 0 ? 'cubic-bezier(0, 0, 0.2, 1)' : _j, _k = _a.hideTransitionOptions, hideTransitionOptions = _k === void 0 ? 'linear' : _k, shown = _a.shown, hidden = _a.hidden, markupCreated = _a.markupCreated, children = _a.children;
-    var _l = useState(0), top = _l[0], setTop = _l[1];
-    var _m = useState(0), left = _m[0], setLeft = _m[1];
-    var _o = useState(0), width = _o[0], setWidth = _o[1];
-    var _p = useState(-1), zIndex = _p[0], setZIndex = _p[1];
+    var visible = _a.visible, target = _a.target, _b = _a.shouldTargetCloseOverlay, shouldTargetCloseOverlay = _b === void 0 ? true : _b, _c = _a.shouldMatchTargetWidth, shouldMatchTargetWidth = _c === void 0 ? false : _c, _d = _a.shouldScrollCloseOverlay, shouldScrollCloseOverlay = _d === void 0 ? false : _d, _e = _a.shouldCheckZIndex, shouldCheckZIndex = _e === void 0 ? false : _e, _f = _a.unmountWhenHidden, unmountWhenHidden = _f === void 0 ? false : _f, _g = _a.transitionDuration, transitionDuration = _g === void 0 ? 400 : _g, _h = _a.showTransitionOptions, showTransitionOptions = _h === void 0 ? 'cubic-bezier(0, 0, 0.2, 1)' : _h, _j = _a.hideTransitionOptions, hideTransitionOptions = _j === void 0 ? 'linear' : _j, shown = _a.shown, hidden = _a.hidden, markupCreated = _a.markupCreated, children = _a.children;
+    var _k = useState(0), top = _k[0], setTop = _k[1];
+    var _l = useState(0), left = _l[0], setLeft = _l[1];
+    var _m = useState(0), width = _m[0], setWidth = _m[1];
+    var _o = useState(-1), zIndex = _o[0], setZIndex = _o[1];
     var displayZIndex = useRef(100);
-    var _q = useState(visible), visibility = _q[0], setVisibility = _q[1];
+    var _p = useState(visible), visibility = _p[0], setVisibility = _p[1];
     var panelRef = useRef();
     var scrollerPanelRef = useRef();
     var listenerRef = useRef();
@@ -24876,6 +24879,9 @@ function OverlayPanel(_a) {
                     overflowX: 'scroll, auto',
                     overflowY: 'scroll, auto',
                 });
+                if (scrollerPanelRef.current.tagName.toLowerCase() === 'html') {
+                    scrollerPanelRef.current = document;
+                }
             }
             if (shouldCheckZIndex) {
                 var parentZIndex = getAllElementStyleValues('zIndex', function (styleValue) {
@@ -24893,7 +24899,7 @@ function OverlayPanel(_a) {
         if (visible !== undefined) {
             setVisibility(visible);
         }
-    }, [target, visible, shouldMatchTargetWidth, shouldScrollCloseOverlay, shouldCheckZIndex]);
+    }, [target, visible, shouldScrollCloseOverlay, shouldCheckZIndex]);
     var getTargetElement = function (target) {
         return (target.target
             ? target.target
@@ -24915,7 +24921,7 @@ function OverlayPanel(_a) {
         var clickListener = function (clickedWithin) { return !clickedWithin && setVisibility(false); };
         listenerRef.current = bindDocumentClickListener(panelRef.current, clickListener, otherElements);
         if (shouldScrollCloseOverlay) {
-            scrollListenerRef.current = lodash.throttle(function (event) { return panelRef.current && !isEventWithinTarget(event, panelRef.current) && setVisibility(false); }, 100);
+            scrollListenerRef.current = lodash.throttle(function (event) { return panelRef.current && isEventOutsideTarget(event, panelRef.current) && setVisibility(false); }, 100, { leading: true });
             if (scrollerPanelRef.current) {
                 scrollerPanelRef.current.addEventListener('scroll', scrollListenerRef.current);
             }
@@ -24940,21 +24946,21 @@ function OverlayPanel(_a) {
         panelRef.current = element;
         markupCreated && markupCreated(element);
     };
-    var createElement = function () {
-        var baseStyles = {
+    var baseStyles = useMemo(function () {
+        var styles = {
             top: top + "px",
             left: left + "px",
             zIndex: zIndex,
         };
         if (shouldMatchTargetWidth) {
-            baseStyles['width'] = width + "px";
+            styles['width'] = width + "px";
         }
-        return (jsx(BeeSoftTransition, __assign({ start: visibility, timeout: transitionDuration, showTransitionOptions: showTransitionOptions, hideTransitionOptions: hideTransitionOptions, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: unmountWhenHidden }, { children: function (_a) {
-                var state = _a.state, defaultStyle = _a.defaultStyle, transitionStyles = _a.transitionStyles;
-                return (jsx("div", __assign({ className: "bsc-absolute bsc-bg-white dark:bsc-bg-gray-900 bsc-border bsc-border-solid dark:bsc-text-white dark:bsc-border-white bsc-shadow", style: __assign(__assign(__assign({}, baseStyles), defaultStyle), transitionStyles[state]), ref: function (element) { return element && onMarkupCreated(element); } }, { children: children }), void 0));
-            } }), void 0));
-    };
-    return ReactDOM.createPortal(createElement(), appendTo);
+        return styles;
+    }, [top, left, zIndex, width, shouldMatchTargetWidth]);
+    return (jsx(BeeSoftTransition, __assign({ start: visibility, timeout: transitionDuration, showTransitionOptions: showTransitionOptions, hideTransitionOptions: hideTransitionOptions, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: unmountWhenHidden }, { children: function (_a) {
+            var state = _a.state, defaultStyle = _a.defaultStyle, transitionStyles = _a.transitionStyles;
+            return (jsx("div", __assign({ className: "bsc-fixed bsc-bg-white dark:bsc-bg-gray-900 bsc-border bsc-border-solid dark:bsc-text-white dark:bsc-border-white bsc-shadow", style: __assign(__assign(__assign({}, baseStyles), defaultStyle), transitionStyles[state]), ref: function (element) { return element && onMarkupCreated(element); } }, { children: children }), void 0));
+        } }), void 0));
 }
 
 /**
@@ -25774,7 +25780,7 @@ var reducer = function (state, action) {
         case DateTimeActionType.SetViewDate:
             return __assign(__assign({}, state), { currentViewDate: action.viewDate || new Date(), dateInitialized: true });
         case DateTimeActionType.SetSelectedDate:
-            return __assign(__assign({}, state), { selectedDate: action.selectedDate || state.selectedDate, selectedDateChanged: !state.selectedDateChanged
+            return __assign(__assign({}, state), { selectedDate: action.selectedDate || state.selectedDate, currentViewDate: action.viewDate || state.currentViewDate, selectedDateChanged: !state.selectedDateChanged
                     ? ((_a = state.originalSetDate) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = action.selectedDate) === null || _b === void 0 ? void 0 : _b.getTime())
                     : true });
         case DateTimeActionType.SetSelectedDateRange:
@@ -25891,9 +25897,6 @@ function DateTimeCalendar(_a) {
                 dispatcher({
                     type: DateTimeActionType.SetSelectedDate,
                     selectedDate: date,
-                });
-                dispatcher({
-                    type: DateTimeActionType.SetViewDate,
                     viewDate: date,
                 });
             }
@@ -26129,6 +26132,7 @@ function DateTimeTimeSelector(_a) {
     var hours = useRef(['12', '01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11']);
     var minutes = useRef(generateNumberArray(0, 59, function (value) { return padNumber(value, 2, '0'); }));
     var ampm = useRef(['AM', 'PM']);
+    var savedViewDate = useRef(lodash.cloneDeep(viewDate));
     var getMeridianHour = function (hour) { return (hour > 11 ? hour - 12 : hour); };
     var _b = useState(getMeridianHour(viewDate.getHours())), currentHour = _b[0], setCurrentHour = _b[1];
     var _c = useState(viewDate.getMinutes()), currentMinute = _c[0], setCurrentMinute = _c[1];
@@ -26173,14 +26177,11 @@ function DateTimeTimeSelector(_a) {
     };
     var setCurrentTime = function (hour, minute, meridian) {
         var correctHour = meridian === 1 ? hour + 12 : hour;
-        viewDate.setHours(correctHour, minute);
+        savedViewDate.current.setHours(correctHour, minute);
         dispatcher({
             type: DateTimeActionType.SetSelectedDate,
-            selectedDate: viewDate,
-        });
-        dispatcher({
-            type: DateTimeActionType.SetViewDate,
-            viewDate: viewDate,
+            selectedDate: savedViewDate.current,
+            viewDate: savedViewDate.current,
         });
     };
     var onDateClicked = function () {
@@ -26244,18 +26245,11 @@ function DateTime(_a) {
     var language = useRef(locale || getBrowserLanguage());
     var loadedLocale = useRef();
     var inputElementRef = useRef();
-    var _l = useState({
+    var contextProps = useRef({
         calendarTemplate: calendarTemplate,
         dateScrollerTemplate: dateScrollerTemplate,
         colors: colors,
-    }), contextProps = _l[0], setContextProps = _l[1];
-    useEffect(function () {
-        setContextProps({
-            calendarTemplate: calendarTemplate,
-            dateScrollerTemplate: dateScrollerTemplate,
-            colors: colors,
-        });
-    }, [calendarTemplate, dateScrollerTemplate, colors]);
+    });
     useEffect(function () {
         if (language.current) {
             loadLocaleObject(language.current);
@@ -26321,7 +26315,7 @@ function DateTime(_a) {
         selectedDateChanged: false,
         dateInitialized: false,
     };
-    var _m = useReducer(reducer, initialState), state = _m[0], dispatcher = _m[1];
+    var _l = useReducer(reducer, initialState), state = _l[0], dispatcher = _l[1];
     var onFocus = function (event) {
         setDropDownElement();
         setSelectorOpen(true);
@@ -26333,13 +26327,10 @@ function DateTime(_a) {
             : parseDateRange(dateString, loadedLocale.current);
         if (inputDate) {
             if (!Array.isArray(inputDate)) {
-                dispatcher({
-                    type: DateTimeActionType.SetViewDate,
-                    viewDate: inputDate,
-                });
                 dispatcher({
                     type: DateTimeActionType.SetSelectedDate,
                     selectedDate: inputDate,
+                    viewDate: inputDate,
                 });
             }
             else {
@@ -26499,7 +26490,7 @@ function DateTime(_a) {
         _b["" + ((colors === null || colors === void 0 ? void 0 : colors.readOnlyInputBgColor) || 'bsc-bg-gray-200')] = readOnly,
         _b["" + ((colors === null || colors === void 0 ? void 0 : colors.inputBgColor) || 'bsc-bg-white')] = !readOnly,
         _b), "dark:bsc-bg-black " + (colors === null || colors === void 0 ? void 0 : colors.inputBorderColor) + " bc-dt-input", className);
-    return (jsx(DateTimeContext.Provider, __assign({ value: contextProps }, { children: jsxs("div", __assign({ className: "bc-date-time" }, { children: [jsxs(TemplateOutlet, __assign({ props: inputTemplateProps, template: template }, { children: [label && jsx("label", __assign({ className: "dark:bsc-text-white bc-dt-label" }, { children: label }), void 0),
+    return (jsx(DateTimeContext.Provider, __assign({ value: contextProps.current }, { children: jsxs("div", __assign({ className: "bc-date-time" }, { children: [jsxs(TemplateOutlet, __assign({ props: inputTemplateProps, template: template }, { children: [label && jsx("label", __assign({ className: "dark:bsc-text-white bc-dt-label" }, { children: label }), void 0),
                         jsx(ContentEditableInput$1, __assign({ value: getValue(), readOnly: readOnly, className: inputStyles, onFocus: onFocus, onInput: onInput, onElementCreate: onInputElementCreated }, inputProps), void 0)] }), void 0),
                 jsx(OverlayPanel, __assign({ visible: selectorOpen, target: dropDownTarget, shouldTargetCloseOverlay: false, shouldScrollCloseOverlay: true, shouldCheckZIndex: true, hidden: onDateTimeHidden, unmountWhenHidden: true }, { children: jsxs(Fragment$1, { children: [state.currentSelector === DateTimeActionType.DaySelector &&
                                 canShowDateSelectors &&
@@ -26550,7 +26541,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "/*! tailwindcss v2.1.2 | MIT License | https://tailwindcss.com */\n\n/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n  tab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n  margin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n  font-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'] {\n  -webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n  padding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\n/**\n * Work around a Firefox/IE bug where the transparent `button` background\n * results in a loss of the default `button` focus styles.\n */\n\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::-webkit-input-placeholder, textarea::-webkit-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput:-ms-input-placeholder, textarea:-ms-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\nbutton {\n  cursor: pointer;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/**\n * Make replaced elements `display: block` by default as that's\n * the behavior you want almost all of the time. Inspired by\n * CSS Remedy, with `svg` added as well.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their intrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n.bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(229, 231, 235, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-bg-red-500 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(239, 68, 68, var(--tw-bg-opacity));\n}\n\n.bsc-bg-green-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 250, 229, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(219, 234, 254, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(191, 219, 254, var(--tw-bg-opacity));\n}\n\n.hover\\:bsc-bg-gray-300:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-black {\n  --tw-bg-opacity: 1;\n  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-bg-white:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-border-transparent {\n  border-color: transparent;\n}\n\n.bsc-border-black {\n  --tw-border-opacity: 1;\n  border-color: rgba(0, 0, 0, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-300 {\n  --tw-border-opacity: 1;\n  border-color: rgba(209, 213, 219, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-400 {\n  --tw-border-opacity: 1;\n  border-color: rgba(156, 163, 175, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-500 {\n  --tw-border-opacity: 1;\n  border-color: rgba(107, 114, 128, var(--tw-border-opacity));\n}\n\n.bsc-dark .dark\\:bsc-border-white {\n  --tw-border-opacity: 1;\n  border-color: rgba(255, 255, 255, var(--tw-border-opacity));\n}\n\n.bsc-rounded-md {\n  border-radius: 0.375rem;\n}\n\n.bsc-rounded-full {\n  border-radius: 9999px;\n}\n\n.bsc-border-solid {\n  border-style: solid;\n}\n\n.bsc-border-none {\n  border-style: none;\n}\n\n.bsc-border {\n  border-width: 1px;\n}\n\n.bsc-border-r {\n  border-right-width: 1px;\n}\n\n.bsc-cursor-pointer {\n  cursor: pointer;\n}\n\n.bsc-cursor-not-allowed {\n  cursor: not-allowed;\n}\n\n.bsc-flex {\n  display: flex;\n}\n\n.bsc-grid {\n  display: grid;\n}\n\n.bsc-flex-row {\n  flex-direction: row;\n}\n\n.bsc-flex-col {\n  flex-direction: column;\n}\n\n.bsc-justify-center {\n  justify-content: center;\n}\n\n.bsc-flex-grow {\n  flex-grow: 1;\n}\n\n.bsc-flex-shrink {\n  flex-shrink: 1;\n}\n\n.bsc-font-bold {\n  font-weight: 700;\n}\n\n.bsc-text-sm {\n  font-size: 0.875rem;\n  line-height: 1.25rem;\n}\n\n.bsc-mr-2 {\n  margin-right: 0.5rem;\n}\n\n.bsc-ml-2 {\n  margin-left: 0.5rem;\n}\n\n.focus\\:bsc-outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.bsc-overflow-hidden {\n  overflow: hidden;\n}\n\n.bsc-overflow-scroll {\n  overflow: scroll;\n}\n\n.bsc-overflow-x-auto {\n  overflow-x: auto;\n}\n\n.bsc-overflow-y-hidden {\n  overflow-y: hidden;\n}\n\n.bsc-p-2 {\n  padding: 0.5rem;\n}\n\n.bsc-p-4 {\n  padding: 1rem;\n}\n\n.bsc-py-1 {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n\n.bsc-px-2 {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n\n.bsc-pr-4 {\n  padding-right: 1rem;\n}\n\n.bsc-pl-4 {\n  padding-left: 1rem;\n}\n\n.bsc-pb-8 {\n  padding-bottom: 2rem;\n}\n\n.bsc-absolute {\n  position: absolute;\n}\n\n* {\n  --tw-shadow: 0 0 #0000;\n}\n\n.bsc-shadow-sm {\n  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.bsc-shadow {\n  --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n* {\n  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgba(59, 130, 246, 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n}\n\n.bsc-text-left {\n  text-align: left;\n}\n\n.bsc-text-center {\n  text-align: center;\n}\n\n.bsc-text-gray-400 {\n  --tw-text-opacity: 1;\n  color: rgba(156, 163, 175, var(--tw-text-opacity));\n}\n\n.bsc-text-red-300 {\n  --tw-text-opacity: 1;\n  color: rgba(252, 165, 165, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-black {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-white {\n  --tw-text-opacity: 1;\n  color: rgba(255, 255, 255, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-text-black:hover {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-whitespace-pre {\n  white-space: pre;\n}\n\n.bsc-w-24 {\n  width: 6rem;\n}\n\n.bsc-w-full {\n  width: 100%;\n}\n\n.bsc-gap-3 {\n  gap: 0.75rem;\n}\n\n.bsc-gap-4 {\n  gap: 1rem;\n}\n\n.bsc-grid-cols-4 {\n  grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n\n.bsc-grid-cols-7 {\n  grid-template-columns: repeat(7, minmax(0, 1fr));\n}\n\n.bsc-col-span-4 {\n  grid-column: span 4 / span 4;\n}\n\n@-webkit-keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@-webkit-keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@-webkit-keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\nbody {\n  margin: 0;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n\n@media (min-width: 640px) {\n}\n\n@media (min-width: 768px) {\n}\n\n@media (min-width: 1024px) {\n}\n\n@media (min-width: 1280px) {\n}\n\n@media (min-width: 1536px) {\n}\n";
+var css_248z = "/*! tailwindcss v2.1.2 | MIT License | https://tailwindcss.com */\n\n/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n  tab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n  margin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n  font-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'] {\n  -webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n  padding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\n/**\n * Work around a Firefox/IE bug where the transparent `button` background\n * results in a loss of the default `button` focus styles.\n */\n\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::-webkit-input-placeholder, textarea::-webkit-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput:-ms-input-placeholder, textarea:-ms-input-placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\nbutton {\n  cursor: pointer;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/**\n * Make replaced elements `display: block` by default as that's\n * the behavior you want almost all of the time. Inspired by\n * CSS Remedy, with `svg` added as well.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their intrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n.bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(229, 231, 235, var(--tw-bg-opacity));\n}\n\n.bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-bg-red-500 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(239, 68, 68, var(--tw-bg-opacity));\n}\n\n.bsc-bg-green-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 250, 229, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-100 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(219, 234, 254, var(--tw-bg-opacity));\n}\n\n.bsc-bg-blue-200 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(191, 219, 254, var(--tw-bg-opacity));\n}\n\n.hover\\:bsc-bg-gray-300:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-black {\n  --tw-bg-opacity: 1;\n  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-white {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:bsc-bg-gray-900 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-bg-white:hover {\n  --tw-bg-opacity: 1;\n  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));\n}\n\n.bsc-border-transparent {\n  border-color: transparent;\n}\n\n.bsc-border-black {\n  --tw-border-opacity: 1;\n  border-color: rgba(0, 0, 0, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-300 {\n  --tw-border-opacity: 1;\n  border-color: rgba(209, 213, 219, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-400 {\n  --tw-border-opacity: 1;\n  border-color: rgba(156, 163, 175, var(--tw-border-opacity));\n}\n\n.bsc-border-gray-500 {\n  --tw-border-opacity: 1;\n  border-color: rgba(107, 114, 128, var(--tw-border-opacity));\n}\n\n.bsc-dark .dark\\:bsc-border-white {\n  --tw-border-opacity: 1;\n  border-color: rgba(255, 255, 255, var(--tw-border-opacity));\n}\n\n.bsc-rounded-md {\n  border-radius: 0.375rem;\n}\n\n.bsc-rounded-full {\n  border-radius: 9999px;\n}\n\n.bsc-border-solid {\n  border-style: solid;\n}\n\n.bsc-border-none {\n  border-style: none;\n}\n\n.bsc-border {\n  border-width: 1px;\n}\n\n.bsc-border-r {\n  border-right-width: 1px;\n}\n\n.bsc-cursor-pointer {\n  cursor: pointer;\n}\n\n.bsc-cursor-not-allowed {\n  cursor: not-allowed;\n}\n\n.bsc-flex {\n  display: flex;\n}\n\n.bsc-grid {\n  display: grid;\n}\n\n.bsc-flex-row {\n  flex-direction: row;\n}\n\n.bsc-flex-col {\n  flex-direction: column;\n}\n\n.bsc-justify-center {\n  justify-content: center;\n}\n\n.bsc-flex-grow {\n  flex-grow: 1;\n}\n\n.bsc-flex-shrink {\n  flex-shrink: 1;\n}\n\n.bsc-font-bold {\n  font-weight: 700;\n}\n\n.bsc-text-sm {\n  font-size: 0.875rem;\n  line-height: 1.25rem;\n}\n\n.bsc-mr-2 {\n  margin-right: 0.5rem;\n}\n\n.bsc-ml-2 {\n  margin-left: 0.5rem;\n}\n\n.focus\\:bsc-outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.bsc-overflow-hidden {\n  overflow: hidden;\n}\n\n.bsc-overflow-scroll {\n  overflow: scroll;\n}\n\n.bsc-overflow-x-auto {\n  overflow-x: auto;\n}\n\n.bsc-overflow-y-hidden {\n  overflow-y: hidden;\n}\n\n.bsc-p-2 {\n  padding: 0.5rem;\n}\n\n.bsc-p-4 {\n  padding: 1rem;\n}\n\n.bsc-py-1 {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n\n.bsc-px-2 {\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n\n.bsc-pr-4 {\n  padding-right: 1rem;\n}\n\n.bsc-pl-4 {\n  padding-left: 1rem;\n}\n\n.bsc-pb-8 {\n  padding-bottom: 2rem;\n}\n\n.bsc-fixed {\n  position: fixed;\n}\n\n* {\n  --tw-shadow: 0 0 #0000;\n}\n\n.bsc-shadow-sm {\n  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.bsc-shadow {\n  --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n* {\n  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgba(59, 130, 246, 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n}\n\n.bsc-text-left {\n  text-align: left;\n}\n\n.bsc-text-center {\n  text-align: center;\n}\n\n.bsc-text-gray-400 {\n  --tw-text-opacity: 1;\n  color: rgba(156, 163, 175, var(--tw-text-opacity));\n}\n\n.bsc-text-red-300 {\n  --tw-text-opacity: 1;\n  color: rgba(252, 165, 165, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-black {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:bsc-text-white {\n  --tw-text-opacity: 1;\n  color: rgba(255, 255, 255, var(--tw-text-opacity));\n}\n\n.bsc-dark .dark\\:hover\\:bsc-text-black:hover {\n  --tw-text-opacity: 1;\n  color: rgba(0, 0, 0, var(--tw-text-opacity));\n}\n\n.bsc-whitespace-pre {\n  white-space: pre;\n}\n\n.bsc-w-24 {\n  width: 6rem;\n}\n\n.bsc-w-full {\n  width: 100%;\n}\n\n.bsc-gap-3 {\n  gap: 0.75rem;\n}\n\n.bsc-gap-4 {\n  gap: 1rem;\n}\n\n.bsc-grid-cols-4 {\n  grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n\n.bsc-grid-cols-7 {\n  grid-template-columns: repeat(7, minmax(0, 1fr));\n}\n\n.bsc-col-span-4 {\n  grid-column: span 4 / span 4;\n}\n\n@-webkit-keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@keyframes bsc-spin {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n@-webkit-keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@keyframes bsc-ping {\n  75%, 100% {\n    -webkit-transform: scale(2);\n            transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes bsc-pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@-webkit-keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@keyframes bsc-bounce {\n  0%, 100% {\n    -webkit-transform: translateY(-25%);\n            transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    -webkit-transform: none;\n            transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\nbody {\n  margin: 0;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n\n@media (min-width: 640px) {\n}\n\n@media (min-width: 768px) {\n}\n\n@media (min-width: 1024px) {\n}\n\n@media (min-width: 1280px) {\n}\n\n@media (min-width: 1536px) {\n}\n";
 styleInject(css_248z);
 
 /*!