willba-component-library 0.2.11 → 0.2.13

package/lib/index.umd.js

@@ -10791,7 +10791,7 @@
 
     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)
@@ -10814,7 +10814,7 @@
                         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) {
@@ -11201,10 +11201,10 @@
     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 () {
@@ -11213,29 +11213,23 @@
         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,
@@ -11246,7 +11240,7 @@
                 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,