willba-component-library 0.2.11 → 0.2.13

package/lib/index.js

@@ -10789,7 +10789,7 @@ styleInject(css_248z$8);
 
 var Calendar = React__default.forwardRef(function (_a, ref) {
     var _b;
-    var calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, calendarOffset = _a.calendarOffset, selectedPath = _a.selectedPath, language = _a.language, calendarOffsetGroup = _a.calendarOffsetGroup;
+    var calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, calendarOffset = _a.calendarOffset, selectedPath = _a.selectedPath, language = _a.language, calendarOffsetGroup = _a.calendarOffsetGroup, requestDates = _a.requestDates;
     var isTablet = reactResponsiveExports.useMediaQuery({ maxWidth: 960 });
     React__default.useEffect(function () {
         if (!calendarRange)
@@ -10812,7 +10812,7 @@ var Calendar = React__default.forwardRef(function (_a, ref) {
                     today: 'my-today',
                 }, modifiersStyles: {
                     disabled: { opacity: '0.2' },
-                }, captionLayout: "dropdown-buttons", defaultMonth: selectedStartDate || disabledDays[0].from, disabled: calendarOffsetGroup || disabledDays, fromMonth: today }))));
+                }, captionLayout: "dropdown-buttons", defaultMonth: selectedStartDate || disabledDays[0].from, disabled: calendarOffsetGroup || disabledDays, fromMonth: today, onMonthChange: function (val) { return (requestDates ? requestDates(val) : null); } }))));
 });
 
 var parseDates = function (_a) {
@@ -11199,10 +11199,10 @@ var AGE_CATEGORIES_FALLBACK = [
 var REDIRECT_URL_FALLBACK = 'http://localhost:3000/';
 
 var useFilterCalendar = function (_a) {
-    var onSubmit = _a.onSubmit;
+    var onSubmit = _a.onSubmit, setToggleCalendar = _a.setToggleCalendar;
     var _b = __read(React__default.useState(), 2), calendarRange = _b[0], setCalendarRange = _b[1];
-    var _c = __read(React__default.useState(false), 2), toggleCalendar = _c[0], setToggleCalendar = _c[1];
     var handleSubmit = function () {
+        setToggleCalendar(false);
         return onSubmit(calendarRange);
     };
     var handleClearDates = function () {
@@ -11211,29 +11211,23 @@ var useFilterCalendar = function (_a) {
     return {
         handleSubmit: handleSubmit,
         handleClearDates: handleClearDates,
-        setToggleCalendar: setToggleCalendar,
         setCalendarRange: setCalendarRange,
         calendarRange: calendarRange,
-        toggleCalendar: toggleCalendar,
     };
 };
 
-var css_248z = ".will-root .will-calendar-wrapper {\n    box-shadow: var(--will-box-shadow-dark);\n    border-radius: 20px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-header,\n.will-root .will-calendar-wrapper .will-calendar-main,\n.will-root .will-calendar-wrapper .will-calendar-footer {\n   padding: 20px;\n}\n\n/* Header */\n\n.will-root .will-calendar-wrapper .will-calendar-header {\n    display: flex;\n    justify-content: space-between;\n    border-bottom: 1px solid grey;\n}\n\n/* Footer */\n\n.will-root .will-calendar-wrapper .will-calendar-footer {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    border-top: 1px solid grey;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates > div {\n    margin-bottom: 5px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates-separator {\n    margin: 0 15px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n\n@media (max-width: 960px) {\n    .will-root .will-calendar-wrapper .will-calendar-footer {\n        flex-direction: column;\n    }\n\n    .will-root .will-calendar-wrapper .will-calendar-footer-dates  {\n        margin-bottom: 20px;\n        text-align: center;\n    }\n\n    .will-root .will-calendar-wrapper .will-calendar-footer-actions {\n       flex-direction: column;\n       width: 100%;\n    }\n\n    .will-root .will-calendar-wrapper .will-calendar-footer-actions button{\n        width: 100%;\n     }\n  }\n\n/**/\n\n.will-root .will-calendar-wrapper .will-calendar-header .will-filter-bar-close-button {\n    position: initial;\n}";
+var css_248z = ".will-root .will-calendar-wrapper {\n    box-shadow: var(--will-box-shadow-dark);\n    border-radius: 20px;\n    background-color: var(--will-white);\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-header,\n.will-root .will-calendar-wrapper .will-calendar-main,\n.will-root .will-calendar-wrapper .will-calendar-footer {\n   padding: 20px;\n}\n\n/* Header */\n\n.will-root .will-calendar-wrapper .will-calendar-header {\n    display: flex;\n    justify-content: space-between;\n    border-bottom: 1px solid grey;\n}\n\n/* Footer */\n\n.will-root .will-calendar-wrapper .will-calendar-footer {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    border-top: 1px solid grey;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates > div {\n    margin-bottom: 5px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates-separator {\n    margin: 0 15px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n\n@media (max-width: 960px) {\n    .will-root .will-calendar-wrapper .will-calendar-footer {\n        flex-direction: column;\n    }\n\n    .will-root .will-calendar-wrapper .will-calendar-footer-dates  {\n        margin-bottom: 20px;\n        text-align: center;\n    }\n\n    .will-root .will-calendar-wrapper .will-calendar-footer-actions {\n       flex-direction: column;\n       width: 100%;\n    }\n\n    .will-root .will-calendar-wrapper .will-calendar-footer-actions button{\n        width: 100%;\n     }\n  }\n\n/**/\n\n.will-root .will-calendar-wrapper .will-calendar-header .will-filter-bar-close-button {\n    position: initial;\n}";
 styleInject(css_248z);
 
 function FilterCalendar(_a) {
-    var calendarOffset = _a.calendarOffset, language = _a.language, palette = _a.palette, openCalendar = _a.openCalendar, onSubmit = _a.onSubmit, calendarOffsetGroup = _a.calendarOffsetGroup;
+    var calendarOffset = _a.calendarOffset, language = _a.language, palette = _a.palette, onSubmit = _a.onSubmit, calendarOffsetGroup = _a.calendarOffsetGroup, toggleCalendar = _a.toggleCalendar, setToggleCalendar = _a.setToggleCalendar, requestDates = _a.requestDates;
     var themePalette = useTheme({ palette: palette });
     // Translations
     useUpdateTranslations({ language: language });
     var t = useTranslation().t;
-    var _b = useFilterCalendar({ onSubmit: onSubmit }), handleSubmit = _b.handleSubmit, setToggleCalendar = _b.setToggleCalendar, setCalendarRange = _b.setCalendarRange, handleClearDates = _b.handleClearDates, toggleCalendar = _b.toggleCalendar, calendarRange = _b.calendarRange;
+    var _b = useFilterCalendar({ onSubmit: onSubmit, setToggleCalendar: setToggleCalendar }), handleSubmit = _b.handleSubmit, setCalendarRange = _b.setCalendarRange, handleClearDates = _b.handleClearDates, calendarRange = _b.calendarRange;
     // Display component after fully loaded
     useAwaitRender();
-    React__default.useEffect(function () {
-        if (openCalendar)
-            setToggleCalendar(true);
-    }, [openCalendar]);
     // Handle close filter section
     var filtersRef = useCloseFilterSection({
         handleSelectedFilter: setToggleCalendar,
@@ -11244,7 +11238,7 @@ function FilterCalendar(_a) {
             React__default.createElement("h2", null, t('filterBar:calendar.title')),
             React__default.createElement(CloseButton, { handleClose: function () { return setToggleCalendar(false); } })),
         React__default.createElement("div", { className: "will-calendar-main" },
-            React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, calendarOffsetGroup: calendarOffsetGroup })),
+            React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, calendarOffsetGroup: calendarOffsetGroup, requestDates: requestDates })),
         React__default.createElement("div", { className: "will-calendar-footer" },
             React__default.createElement("div", { className: "will-calendar-footer-dates" },
                 React__default.createElement("div", null,