@sb1/ffe-datepicker-react 100.12.3 → 101.0.0

package/es/button/Button.js

@@ -2,12 +2,11 @@ import React from 'react';
 import { Icon } from '@sb1/ffe-icons-react';
 import { validateDate } from '../util/dateUtil';
 import i18n from '../i18n/i18n';
-export var Button = React.forwardRef(function (_a, ref) {
-    var value = _a.value, locale = _a.locale, onClick = _a.onClick;
-    var buttonLabel = validateDate(value)
-        ? "".concat(i18n[locale].CHANGE_DATE, ", ").concat(i18n[locale].CHOSEN_DATE, " ").concat(value)
+export const Button = React.forwardRef(({ value, locale, onClick }, ref) => {
+    const buttonLabel = validateDate(value)
+        ? `${i18n[locale].CHANGE_DATE}, ${i18n[locale].CHOSEN_DATE} ${value}`
         : i18n[locale].CHOOSE_DATE;
-    var calendarMonthIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik0yMTIuMzA5LTEwMC4wMDFxLTMwLjMwOCAwLTUxLjMwOC0yMXQtMjEtNTEuMzA4di01MzUuMzgycTAtMzAuMzA4IDIxLTUxLjMwOHQ1MS4zMDgtMjFoNTUuMzg1di01My44NDdxMC0xMy4xNTMgOC44MDgtMjEuOTYxIDguODA3LTguODA3IDIxLjk2MS04LjgwNyAxMy4xNTMgMCAyMS45NjEgOC44MDcgOC44MDcgOC44MDggOC44MDcgMjEuOTYxdjUzLjg0N2gzMDMuMDc2di01NC42MTZxMC0xMi43NjkgOC42MTUtMjEuMzg0dDIxLjM4NC04LjYxNXExMi43NjkgMCAyMS4zODQgOC42MTUgOC42MTYgOC42MTUgOC42MTYgMjEuMzg0djU0LjYxNmg1NS4zODVxMzAuMzA4IDAgNTEuMzA4IDIxdDIxIDUxLjMwOHY1MzUuMzgycTAgMzAuMzA4LTIxIDUxLjMwOHQtNTEuMzA4IDIxSDIxMi4zMDlabTAtNTkuOTk5aDUzNS4zODJxNC42MTYgMCA4LjQ2My0zLjg0NiAzLjg0Ni0zLjg0NyAzLjg0Ni04LjQ2M3YtMzc1LjM4MkgyMDB2Mzc1LjM4MnEwIDQuNjE2IDMuODQ2IDguNDYzIDMuODQ3IDMuODQ2IDguNDYzIDMuODQ2Wk0yMDAtNjA3LjY5aDU2MHYtMTAwLjAwMXEwLTQuNjE2LTMuODQ2LTguNDYzLTMuODQ3LTMuODQ2LTguNDYzLTMuODQ2SDIxMi4zMDlxLTQuNjE2IDAtOC40NjMgMy44NDYtMy44NDYgMy44NDctMy44NDYgOC40NjN2MTAwLjAwMVptMCAwVi03MjB2MTEyLjMxWm0yODAgMjEwLjc2N3EtMTQuNjkyIDAtMjUuMDM4LTEwLjM0NnQtMTAuMzQ2LTI1LjAzOHEwLTE0LjY5MiAxMC4zNDYtMjUuMDM4VDQ4MC00NjcuNjkxcTE0LjY5MiAwIDI1LjAzOCAxMC4zNDZ0MTAuMzQ2IDI1LjAzOHEwIDE0LjY5Mi0xMC4zNDYgMjUuMDM4VDQ4MC0zOTYuOTIzWm0tMTYwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOFQzMjAtNDY3LjY5MXExNC42OTIgMCAyNS4wMzggMTAuMzQ2dDEwLjM0NiAyNS4wMzhxMCAxNC42OTItMTAuMzQ2IDI1LjAzOFQzMjAtMzk2LjkyM1ptMzIwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOFQ2NDAtNDY3LjY5MXExNC42OTIgMCAyNS4wMzggMTAuMzQ2dDEwLjM0NiAyNS4wMzhxMCAxNC42OTItMTAuMzQ2IDI1LjAzOFQ2NDAtMzk2LjkyM1pNNDgwLTI0MHEtMTQuNjkyIDAtMjUuMDM4LTEwLjM0NnQtMTAuMzQ2LTI1LjAzOHEwLTE0LjY5MiAxMC4zNDYtMjUuMDM4IDEwLjM0Ni0xMC4zNDcgMjUuMDM4LTEwLjM0N3QyNS4wMzggMTAuMzQ3cTEwLjM0NiAxMC4zNDYgMTAuMzQ2IDI1LjAzOHQtMTAuMzQ2IDI1LjAzOFE0OTQuNjkyLTI0MCA0ODAtMjQwWm0tMTYwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOCAxMC4zNDYtMTAuMzQ3IDI1LjAzOC0xMC4zNDd0MjUuMDM4IDEwLjM0N3ExMC4zNDYgMTAuMzQ2IDEwLjM0NiAyNS4wMzh0LTEwLjM0NiAyNS4wMzhRMzM0LjY5Mi0yNDAgMzIwLTI0MFptMzIwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOCAxMC4zNDYtMTAuMzQ3IDI1LjAzOC0xMC4zNDd0MjUuMDM4IDEwLjM0N3ExMC4zNDYgMTAuMzQ2IDEwLjM0NiAyNS4wMzh0LTEwLjM0NiAyNS4wMzhRNjU0LjY5Mi0yNDAgNjQwLTI0MFoiLz48L3N2Zz4=';
+    const calendarMonthIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik0yMTIuMzA5LTEwMC4wMDFxLTMwLjMwOCAwLTUxLjMwOC0yMXQtMjEtNTEuMzA4di01MzUuMzgycTAtMzAuMzA4IDIxLTUxLjMwOHQ1MS4zMDgtMjFoNTUuMzg1di01My44NDdxMC0xMy4xNTMgOC44MDgtMjEuOTYxIDguODA3LTguODA3IDIxLjk2MS04LjgwNyAxMy4xNTMgMCAyMS45NjEgOC44MDcgOC44MDcgOC44MDggOC44MDcgMjEuOTYxdjUzLjg0N2gzMDMuMDc2di01NC42MTZxMC0xMi43NjkgOC42MTUtMjEuMzg0dDIxLjM4NC04LjYxNXExMi43NjkgMCAyMS4zODQgOC42MTUgOC42MTYgOC42MTUgOC42MTYgMjEuMzg0djU0LjYxNmg1NS4zODVxMzAuMzA4IDAgNTEuMzA4IDIxdDIxIDUxLjMwOHY1MzUuMzgycTAgMzAuMzA4LTIxIDUxLjMwOHQtNTEuMzA4IDIxSDIxMi4zMDlabTAtNTkuOTk5aDUzNS4zODJxNC42MTYgMCA4LjQ2My0zLjg0NiAzLjg0Ni0zLjg0NyAzLjg0Ni04LjQ2M3YtMzc1LjM4MkgyMDB2Mzc1LjM4MnEwIDQuNjE2IDMuODQ2IDguNDYzIDMuODQ3IDMuODQ2IDguNDYzIDMuODQ2Wk0yMDAtNjA3LjY5aDU2MHYtMTAwLjAwMXEwLTQuNjE2LTMuODQ2LTguNDYzLTMuODQ3LTMuODQ2LTguNDYzLTMuODQ2SDIxMi4zMDlxLTQuNjE2IDAtOC40NjMgMy44NDYtMy44NDYgMy44NDctMy44NDYgOC40NjN2MTAwLjAwMVptMCAwVi03MjB2MTEyLjMxWm0yODAgMjEwLjc2N3EtMTQuNjkyIDAtMjUuMDM4LTEwLjM0NnQtMTAuMzQ2LTI1LjAzOHEwLTE0LjY5MiAxMC4zNDYtMjUuMDM4VDQ4MC00NjcuNjkxcTE0LjY5MiAwIDI1LjAzOCAxMC4zNDZ0MTAuMzQ2IDI1LjAzOHEwIDE0LjY5Mi0xMC4zNDYgMjUuMDM4VDQ4MC0zOTYuOTIzWm0tMTYwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOFQzMjAtNDY3LjY5MXExNC42OTIgMCAyNS4wMzggMTAuMzQ2dDEwLjM0NiAyNS4wMzhxMCAxNC42OTItMTAuMzQ2IDI1LjAzOFQzMjAtMzk2LjkyM1ptMzIwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOFQ2NDAtNDY3LjY5MXExNC42OTIgMCAyNS4wMzggMTAuMzQ2dDEwLjM0NiAyNS4wMzhxMCAxNC42OTItMTAuMzQ2IDI1LjAzOFQ2NDAtMzk2LjkyM1pNNDgwLTI0MHEtMTQuNjkyIDAtMjUuMDM4LTEwLjM0NnQtMTAuMzQ2LTI1LjAzOHEwLTE0LjY5MiAxMC4zNDYtMjUuMDM4IDEwLjM0Ni0xMC4zNDcgMjUuMDM4LTEwLjM0N3QyNS4wMzggMTAuMzQ3cTEwLjM0NiAxMC4zNDYgMTAuMzQ2IDI1LjAzOHQtMTAuMzQ2IDI1LjAzOFE0OTQuNjkyLTI0MCA0ODAtMjQwWm0tMTYwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOCAxMC4zNDYtMTAuMzQ3IDI1LjAzOC0xMC4zNDd0MjUuMDM4IDEwLjM0N3ExMC4zNDYgMTAuMzQ2IDEwLjM0NiAyNS4wMzh0LTEwLjM0NiAyNS4wMzhRMzM0LjY5Mi0yNDAgMzIwLTI0MFptMzIwIDBxLTE0LjY5MiAwLTI1LjAzOC0xMC4zNDZ0LTEwLjM0Ni0yNS4wMzhxMC0xNC42OTIgMTAuMzQ2LTI1LjAzOCAxMC4zNDYtMTAuMzQ3IDI1LjAzOC0xMC4zNDd0MjUuMDM4IDEwLjM0N3ExMC4zNDYgMTAuMzQ2IDEwLjM0NiAyNS4wMzh0LTEwLjM0NiAyNS4wMzhRNjU0LjY5Mi0yNDAgNjQwLTI0MFoiLz48L3N2Zz4=';
     return (React.createElement("button", { "data-testid": "datepicker-open", ref: ref, onClick: onClick, className: "ffe-datepicker__button", "aria-label": buttonLabel, type: "button" },
         React.createElement(Icon, { ariaLabel: i18n[locale].CALENDAR_LABEL, fileUrl: calendarMonthIcon, size: "md", className: "ffe-datepicker__icon" })));
 });

package/es/calendar/Calendar.js

@@ -1,122 +1,104 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
 import React, { Component } from 'react';
-import { v4 as uuid } from 'uuid';
 import { ClickableDate } from './ClickableDate';
 import { NonClickableDate } from './NonClickableDate';
 import { Header } from './Header';
 import { getSimpleDateFromString, getSimpleDateFromTimestamp, } from '../datelogic/simpledate';
 import { SimpleCalendar } from '../datelogic/simplecalendar';
-var Calendar = /** @class */ (function (_super) {
-    __extends(Calendar, _super);
-    function Calendar(props) {
-        var _this = _super.call(this, props) || this;
-        _this.clickableDateRef = React.createRef();
-        _this.prevMonthButtonElementRef = React.createRef();
-        _this.nextMonthButtonElementRef = React.createRef();
-        _this.monthSelectRef = React.createRef();
-        _this.yearSelectRef = React.createRef();
-        _this.focusTrap = function (event) {
+export class Calendar extends Component {
+    constructor(props) {
+        super(props);
+        this.clickableDateRef = React.createRef();
+        this.prevMonthButtonElementRef = React.createRef();
+        this.nextMonthButtonElementRef = React.createRef();
+        this.monthSelectRef = React.createRef();
+        this.yearSelectRef = React.createRef();
+        this.focusTrap = (event) => {
             var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-            var activeElement = document.activeElement;
+            const activeElement = document.activeElement;
             if (event.key === 'Tab') {
                 event.preventDefault();
-                var dropdownCaption = _this.props.dropdownCaption;
+                const { dropdownCaption } = this.props;
                 if (event.shiftKey) {
-                    if (activeElement === _this.clickableDateRef.current) {
-                        (_a = _this.nextMonthButtonElementRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-                        _this.setState({ isFocusingHeader: true });
+                    if (activeElement === this.clickableDateRef.current) {
+                        (_a = this.nextMonthButtonElementRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                        this.setState({ isFocusingHeader: true });
                     }
-                    else if (activeElement === _this.nextMonthButtonElementRef.current) {
+                    else if (activeElement === this.nextMonthButtonElementRef.current) {
                         if (dropdownCaption) {
-                            (_b = _this.yearSelectRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+                            (_b = this.yearSelectRef.current) === null || _b === void 0 ? void 0 : _b.focus();
                         }
                         else {
-                            (_c = _this.prevMonthButtonElementRef.current) === null || _c === void 0 ? void 0 : _c.focus();
+                            (_c = this.prevMonthButtonElementRef.current) === null || _c === void 0 ? void 0 : _c.focus();
                         }
                     }
-                    else if (dropdownCaption && activeElement === _this.yearSelectRef.current) {
-                        (_d = _this.monthSelectRef.current) === null || _d === void 0 ? void 0 : _d.focus();
+                    else if (dropdownCaption && activeElement === this.yearSelectRef.current) {
+                        (_d = this.monthSelectRef.current) === null || _d === void 0 ? void 0 : _d.focus();
                     }
-                    else if (dropdownCaption && activeElement === _this.monthSelectRef.current) {
-                        (_e = _this.prevMonthButtonElementRef.current) === null || _e === void 0 ? void 0 : _e.focus();
+                    else if (dropdownCaption && activeElement === this.monthSelectRef.current) {
+                        (_e = this.prevMonthButtonElementRef.current) === null || _e === void 0 ? void 0 : _e.focus();
                     }
-                    else if (activeElement === _this.prevMonthButtonElementRef.current) {
-                        (_f = _this.clickableDateRef.current) === null || _f === void 0 ? void 0 : _f.focus();
-                        _this.setState({ isFocusingHeader: false });
-                        _this.forceUpdate();
+                    else if (activeElement === this.prevMonthButtonElementRef.current) {
+                        (_f = this.clickableDateRef.current) === null || _f === void 0 ? void 0 : _f.focus();
+                        this.setState({ isFocusingHeader: false });
+                        this.forceUpdate();
                     }
                 }
                 else {
-                    if (activeElement === _this.clickableDateRef.current) {
-                        (_g = _this.prevMonthButtonElementRef.current) === null || _g === void 0 ? void 0 : _g.focus();
-                        _this.setState({ isFocusingHeader: true });
+                    if (activeElement === this.clickableDateRef.current) {
+                        (_g = this.prevMonthButtonElementRef.current) === null || _g === void 0 ? void 0 : _g.focus();
+                        this.setState({ isFocusingHeader: true });
                     }
-                    else if (activeElement === _this.prevMonthButtonElementRef.current) {
+                    else if (activeElement === this.prevMonthButtonElementRef.current) {
                         if (dropdownCaption) {
-                            (_h = _this.monthSelectRef.current) === null || _h === void 0 ? void 0 : _h.focus();
+                            (_h = this.monthSelectRef.current) === null || _h === void 0 ? void 0 : _h.focus();
                         }
                         else {
-                            (_j = _this.nextMonthButtonElementRef.current) === null || _j === void 0 ? void 0 : _j.focus();
+                            (_j = this.nextMonthButtonElementRef.current) === null || _j === void 0 ? void 0 : _j.focus();
                         }
                     }
-                    else if (dropdownCaption && activeElement === _this.monthSelectRef.current) {
-                        (_k = _this.yearSelectRef.current) === null || _k === void 0 ? void 0 : _k.focus();
+                    else if (dropdownCaption && activeElement === this.monthSelectRef.current) {
+                        (_k = this.yearSelectRef.current) === null || _k === void 0 ? void 0 : _k.focus();
                     }
-                    else if (dropdownCaption && activeElement === _this.yearSelectRef.current) {
-                        (_l = _this.nextMonthButtonElementRef.current) === null || _l === void 0 ? void 0 : _l.focus();
+                    else if (dropdownCaption && activeElement === this.yearSelectRef.current) {
+                        (_l = this.nextMonthButtonElementRef.current) === null || _l === void 0 ? void 0 : _l.focus();
                     }
-                    else if (activeElement === _this.nextMonthButtonElementRef.current) {
-                        (_m = _this.clickableDateRef.current) === null || _m === void 0 ? void 0 : _m.focus();
-                        _this.setState({ isFocusingHeader: false });
-                        _this.forceUpdate();
+                    else if (activeElement === this.nextMonthButtonElementRef.current) {
+                        (_m = this.clickableDateRef.current) === null || _m === void 0 ? void 0 : _m.focus();
+                        this.setState({ isFocusingHeader: false });
+                        this.forceUpdate();
                     }
                 }
             }
         };
-        _this.state = {
+        this.state = {
             calendar: new SimpleCalendar(getSimpleDateFromString(props === null || props === void 0 ? void 0 : props.selectedDate), props.minDate, props.maxDate, props.disabledDates, props.locale),
             isFocusingHeader: false,
         };
-        _this.datepickerId = "ffe-calendar-".concat(uuid());
-        _this.keyDown = _this.keyDown.bind(_this);
-        _this.mouseClick = _this.mouseClick.bind(_this);
-        _this.nextMonth = _this.nextMonth.bind(_this);
-        _this.previousMonth = _this.previousMonth.bind(_this);
-        _this.navigateToMonthYear = _this.navigateToMonthYear.bind(_this);
-        _this.renderDate = _this.renderDate.bind(_this);
-        _this.renderWeek = _this.renderWeek.bind(_this);
-        _this.renderDay = _this.renderDay.bind(_this);
-        return _this;
+        this.datepickerId = `ffe-calendar-${Math.random().toString(36).slice(2)}`;
+        this.keyDown = this.keyDown.bind(this);
+        this.mouseClick = this.mouseClick.bind(this);
+        this.nextMonth = this.nextMonth.bind(this);
+        this.previousMonth = this.previousMonth.bind(this);
+        this.navigateToMonthYear = this.navigateToMonthYear.bind(this);
+        this.renderDate = this.renderDate.bind(this);
+        this.renderWeek = this.renderWeek.bind(this);
+        this.renderDay = this.renderDay.bind(this);
     }
     /* eslint-disable react/no-did-update-set-state */
-    Calendar.prototype.componentDidUpdate = function (prevProps) {
+    componentDidUpdate(prevProps) {
         if (prevProps.selectedDate !== this.props.selectedDate) {
             this.setState({
                 calendar: new SimpleCalendar(getSimpleDateFromString(this.props.selectedDate), this.props.minDate, this.props.maxDate, this.props.disabledDates, this.props.locale),
             }, this.forceUpdate);
         }
-    };
-    Calendar.prototype.shouldComponentUpdate = function (nextProps) {
+    }
+    shouldComponentUpdate(nextProps) {
         return nextProps.selectedDate !== this.props.selectedDate;
-    };
-    Calendar.prototype.keyDown = function (event) {
+    }
+    keyDown(event) {
         var _a, _b, _c;
-        var calendar = this.state.calendar;
-        var scrollableEvents = [
+        const calendar = this.state.calendar;
+        const scrollableEvents = [
             'PageUp',
             'PageDown',
             'End',
@@ -181,79 +163,74 @@ var Calendar = /** @class */ (function (_super) {
                 return;
         }
         this.forceUpdate();
-    };
-    Calendar.prototype.mouseClick = function (date) {
-        var pickedDate = getSimpleDateFromTimestamp(date.timestamp);
+    }
+    mouseClick(date) {
+        const pickedDate = getSimpleDateFromTimestamp(date.timestamp);
         if (this.state.calendar.isDateWithinDateRange(pickedDate) &&
             date.isEnabled) {
             this.state.calendar.selectTimestamp(date.timestamp);
             this.props.onDatePicked(this.state.calendar.selected());
         }
-    };
-    Calendar.prototype.nextMonth = function (evt) {
+    }
+    nextMonth(evt) {
         evt.preventDefault();
         this.state.calendar.nextMonth();
         this.forceUpdate();
-    };
-    Calendar.prototype.previousMonth = function (evt) {
+    }
+    previousMonth(evt) {
         evt.preventDefault();
         this.state.calendar.previousMonth();
         this.forceUpdate();
-    };
-    Calendar.prototype.renderDate = function (calendarButtonState, index) {
-        var calendar = this.state.calendar;
+    }
+    renderDate(calendarButtonState, index) {
+        const { calendar } = this.state;
         if (calendarButtonState.isNonClickableDate) {
             return (React.createElement(NonClickableDate, { key: calendarButtonState.dayInMonth, date: { timestamp: calendarButtonState.timestamp } }));
         }
-        return (React.createElement(ClickableDate, { calendarButtonState: calendarButtonState, month: calendar.focusedMonth, year: calendar.focusedYear, headers: "header__".concat(this.datepickerId, "__").concat(index), key: calendarButtonState.timestamp, onClick: this.mouseClick, locale: this.props.locale, dateButtonRef: calendarButtonState.isFocus
+        return (React.createElement(ClickableDate, { calendarButtonState: calendarButtonState, month: calendar.focusedMonth, year: calendar.focusedYear, headers: `header__${this.datepickerId}__${index}`, key: calendarButtonState.timestamp, onClick: this.mouseClick, locale: this.props.locale, dateButtonRef: calendarButtonState.isFocus
                 ? this.clickableDateRef
                 : undefined, isFocusingHeader: this.state.isFocusingHeader, focusOnMount: this.props.focusOnMount }));
-    };
-    Calendar.prototype.renderWeek = function (week) {
-        return (React.createElement("tr", { key: "week-".concat(week.number), role: "presentation" }, week.dates.map(this.renderDate)));
-    };
-    Calendar.prototype.renderDay = function (day, index) {
-        return (React.createElement("th", { "aria-label": day.name, className: "ffe-calendar__weekday", id: "header__".concat(this.datepickerId, "__").concat(index), key: day.name },
+    }
+    renderWeek(week) {
+        return (React.createElement("tr", { key: `week-${week.number}`, role: "presentation" }, week.dates.map(this.renderDate)));
+    }
+    renderDay(day, index) {
+        return (React.createElement("th", { "aria-label": day.name, className: "ffe-calendar__weekday", id: `header__${this.datepickerId}__${index}`, key: day.name },
             React.createElement("span", { title: day.name }, day.shortName)));
-    };
+    }
     /**
      * Navigate to a specific month and year
      */
-    Calendar.prototype.navigateToMonthYear = function (month, year) {
-        var calendar = this.state.calendar;
-        var currentMonth = calendar.focusedDate.month + 1; // 1-indexed month
-        var currentYear = calendar.focusedYear;
+    navigateToMonthYear(month, year) {
+        const { calendar } = this.state;
+        let currentMonth = calendar.focusedDate.month + 1; // 1-indexed month
+        let currentYear = calendar.focusedYear;
         // Calculate how many months to move based on current and target date
-        var monthsDiff = (year - currentYear) * 12 + (month - currentMonth);
+        const monthsDiff = (year - currentYear) * 12 + (month - currentMonth);
         if (monthsDiff < 0) {
             // Go backward
-            for (var i = 0; i > monthsDiff; i--) {
+            for (let i = 0; i > monthsDiff; i--) {
                 calendar.previousMonth();
             }
         }
         else if (monthsDiff > 0) {
             // Go forward
-            for (var i = 0; i < monthsDiff; i++) {
+            for (let i = 0; i < monthsDiff; i++) {
                 calendar.nextMonth();
             }
         }
         this.forceUpdate();
-    };
-    Calendar.prototype.render = function () {
-        var _this = this;
-        var calendar = this.state.calendar;
+    }
+    render() {
+        const { calendar } = this.state;
         /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
-        return (React.createElement("div", { role: "dialog", "aria-modal": true, "aria-labelledby": "".concat(this.datepickerId, "-title"), className: "ffe-default-mode" },
+        return (React.createElement("div", { role: "dialog", "aria-modal": true, "aria-labelledby": `${this.datepickerId}-title`, className: "ffe-default-mode" },
             React.createElement("div", { className: this.props.calendarClassName || 'ffe-calendar', role: "application", onKeyDown: this.focusTrap },
-                React.createElement(Header, { datepickerId: this.datepickerId, month: calendar.focusedMonth, nextMonthHandler: this.nextMonth, nextMonthLabel: calendar.nextName, previousMonthHandler: this.previousMonth, previousMonthLabel: calendar.previousName, year: calendar.focusedYear, prevMonthButtonElement: this.prevMonthButtonElementRef, nextMonthButtonElement: this.nextMonthButtonElementRef, monthNumber: calendar.focusedDate.month + 1, locale: this.props.locale, dropdownCaption: this.props.dropdownCaption, onMonthYearChange: function (month, year) {
-                        return _this.navigateToMonthYear(month, year);
-                    }, minDate: this.props.minDate, maxDate: this.props.maxDate, monthSelectRef: this.monthSelectRef, yearSelectRef: this.yearSelectRef }),
+                React.createElement(Header, { datepickerId: this.datepickerId, month: calendar.focusedMonth, nextMonthHandler: this.nextMonth, nextMonthLabel: calendar.nextName, previousMonthHandler: this.previousMonth, previousMonthLabel: calendar.previousName, year: calendar.focusedYear, prevMonthButtonElement: this.prevMonthButtonElementRef, nextMonthButtonElement: this.nextMonthButtonElementRef, monthNumber: calendar.focusedDate.month + 1, locale: this.props.locale, dropdownCaption: this.props.dropdownCaption, onMonthYearChange: (month, year) => this.navigateToMonthYear(month, year), minDate: this.props.minDate, maxDate: this.props.maxDate, monthSelectRef: this.monthSelectRef, yearSelectRef: this.yearSelectRef }),
                 React.createElement("table", { className: "ffe-calendar__grid", onKeyDown: this.keyDown, role: "presentation" },
                     React.createElement("thead", null,
                         React.createElement("tr", null, calendar.dayNames.map(this.renderDay))),
                     React.createElement("tbody", null, calendar.visibleDates.map(this.renderWeek))))));
         /* eslint-enable jsx-a11y/no-noninteractive-element-interactions */
-    };
-    return Calendar;
-}(Component));
-export { Calendar };
+    }
+}

package/es/calendar/ClickableDate.js

@@ -1,43 +1,24 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
 import React, { Component } from 'react';
 import classNames from 'classnames';
-var ClickableDate = /** @class */ (function (_super) {
-    __extends(ClickableDate, _super);
-    function ClickableDate() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ClickableDate.prototype.componentDidMount = function () {
+export class ClickableDate extends Component {
+    componentDidMount() {
         if (this.props.focusOnMount) {
             this.focusIfNeeded();
         }
-    };
-    ClickableDate.prototype.componentDidUpdate = function () {
+    }
+    componentDidUpdate() {
         this.focusIfNeeded();
-    };
-    ClickableDate.prototype.focusIfNeeded = function () {
+    }
+    focusIfNeeded() {
         var _a;
-        var _b = this.props, calendarButtonState = _b.calendarButtonState, isFocusingHeader = _b.isFocusingHeader, dateButtonRef = _b.dateButtonRef;
+        const { calendarButtonState, isFocusingHeader, dateButtonRef } = this.props;
         if (calendarButtonState.isFocus && !isFocusingHeader) {
             (_a = dateButtonRef === null || dateButtonRef === void 0 ? void 0 : dateButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         }
-    };
-    ClickableDate.prototype.dateClassName = function () {
-        var _a = this.props, calendarButtonState = _a.calendarButtonState, isFocusingHeader = _a.isFocusingHeader;
-        var isEnabled = calendarButtonState.isEnabled, isFocus = calendarButtonState.isFocus, isSelected = calendarButtonState.isSelected, isToday = calendarButtonState.isToday;
+    }
+    dateClassName() {
+        const { calendarButtonState, isFocusingHeader } = this.props;
+        const { isEnabled, isFocus, isSelected, isToday } = calendarButtonState;
         return classNames({
             'ffe-calendar__date': true,
             'ffe-calendar__date--today': isToday,
@@ -46,16 +27,14 @@ var ClickableDate = /** @class */ (function (_super) {
             'ffe-calendar__date--selected': isSelected,
             'ffe-calendar__date--disabled-focus': !isEnabled && isFocus,
         });
-    };
-    ClickableDate.prototype.tabIndex = function () {
+    }
+    tabIndex() {
         return this.props.calendarButtonState.isFocus ? 0 : -1;
-    };
-    ClickableDate.prototype.render = function () {
-        var _a = this.props, calendarButtonState = _a.calendarButtonState, headers = _a.headers, onClick = _a.onClick, locale = _a.locale, dateButtonRef = _a.dateButtonRef, month = _a.month, year = _a.year;
-        var monthName = locale === 'en' ? month : month.toLowerCase();
-        return (React.createElement("td", { className: "ffe-calendar__day", headers: headers, role: "button", ref: dateButtonRef, "aria-disabled": !calendarButtonState.isEnabled, "aria-current": calendarButtonState.isSelected, "aria-label": "".concat(calendarButtonState.dayInMonth, ". ").concat(monthName, " ").concat(year), tabIndex: this.tabIndex(), onClick: function () { return onClick(calendarButtonState); } },
+    }
+    render() {
+        const { calendarButtonState, headers, onClick, locale, dateButtonRef, month, year, } = this.props;
+        const monthName = locale === 'en' ? month : month.toLowerCase();
+        return (React.createElement("td", { className: "ffe-calendar__day", headers: headers, role: "button", ref: dateButtonRef, "aria-disabled": !calendarButtonState.isEnabled, "aria-current": calendarButtonState.isSelected, "aria-label": `${calendarButtonState.dayInMonth}. ${monthName} ${year}`, tabIndex: this.tabIndex(), onClick: () => onClick(calendarButtonState) },
             React.createElement("span", { className: this.dateClassName(), "aria-hidden": "true" }, calendarButtonState.dayInMonth)));
-    };
-    return ClickableDate;
-}(Component));
-export { ClickableDate };
+    }
+}

package/es/calendar/Header.js

@@ -2,38 +2,37 @@ import React from 'react';
 import { Icon } from '@sb1/ffe-icons-react';
 import { Dropdown } from '@sb1/ffe-dropdown-react';
 import { getMonthOptions, getYearOptions } from '../util/dateRangeUtils';
-export var Header = function (_a) {
-    var datepickerId = _a.datepickerId, month = _a.month, nextMonthHandler = _a.nextMonthHandler, nextMonthLabel = _a.nextMonthLabel, previousMonthHandler = _a.previousMonthHandler, previousMonthLabel = _a.previousMonthLabel, year = _a.year, prevMonthButtonElement = _a.prevMonthButtonElement, nextMonthButtonElement = _a.nextMonthButtonElement, monthNumber = _a.monthNumber, _b = _a.dropdownCaption, dropdownCaption = _b === void 0 ? false : _b, locale = _a.locale, onMonthYearChange = _a.onMonthYearChange, minDate = _a.minDate, maxDate = _a.maxDate, monthSelectRef = _a.monthSelectRef, yearSelectRef = _a.yearSelectRef;
-    var arrowBackIosIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Im0zNjcuMzg0LTQ4MCAzMDEuMzA4IDMwMS4zMDhxMTEuOTIzIDExLjkyMyAxMS42MTUgMjguMDc3LS4zMDggMTYuMTUzLTEyLjIzMSAyOC4wNzZxLTExLjkyMiAxMS45MjMtMjguMDc2IDExLjkyM3QtMjguMDc2LTExLjkyM0wzMDUuMDc4LTQyOC43N3EtMTAuODQ3LTEwLjg0Ni0xNi4wNzctMjQuMzA3LTUuMjMxLTEzLjQ2Mi01LjIzMS0yNi45MjMgMC0xMy40NjEgNS4yMzEtMjYuOTIzIDUuMjMtMTMuNDYxIDE2LjA3Ny0yNC4zMDdsMzA2Ljg0Ni0zMDYuODQ2cTExLjkyMi0xMS45MjMgMjguMzg0LTExLjYxNiAxNi40NjEuMzA4IDI4LjM4NCAxMi4yMzEgMTEuOTIzIDExLjkyMyAxMS45MjMgMjguMDc2IDAgMTYuMTU0LTExLjkyMyAyOC4wNzdMMzY3LjM4NC00ODBaIi8+PC9zdmc+';
-    var monthOptions = getMonthOptions(locale);
-    var yearOptions = getYearOptions(minDate, maxDate);
-    var handleMonthChange = function (e) {
-        var selectedMonth = parseInt(e.target.value, 10);
+export const Header = ({ datepickerId, month, nextMonthHandler, nextMonthLabel, previousMonthHandler, previousMonthLabel, year, prevMonthButtonElement, nextMonthButtonElement, monthNumber, dropdownCaption = false, locale, onMonthYearChange, minDate, maxDate, monthSelectRef, yearSelectRef, }) => {
+    const arrowBackIosIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Im0zNjcuMzg0LTQ4MCAzMDEuMzA4IDMwMS4zMDhxMTEuOTIzIDExLjkyMyAxMS42MTUgMjguMDc3LS4zMDggMTYuMTUzLTEyLjIzMSAyOC4wNzZxLTExLjkyMiAxMS45MjMtMjguMDc2IDExLjkyM3QtMjguMDc2LTExLjkyM0wzMDUuMDc4LTQyOC43N3EtMTAuODQ3LTEwLjg0Ni0xNi4wNzctMjQuMzA3LTUuMjMxLTEzLjQ2Mi01LjIzMS0yNi45MjMgMC0xMy40NjEgNS4yMzEtMjYuOTIzIDUuMjMtMTMuNDYxIDE2LjA3Ny0yNC4zMDdsMzA2Ljg0Ni0zMDYuODQ2cTExLjkyMi0xMS45MjMgMjguMzg0LTExLjYxNiAxNi40NjEuMzA4IDI4LjM4NCAxMi4yMzEgMTEuOTIzIDExLjkyMyAxMS45MjMgMjguMDc2IDAgMTYuMTU0LTExLjkyMyAyOC4wNzdMMzY3LjM4NC00ODBaIi8+PC9zdmc+';
+    const monthOptions = getMonthOptions(locale);
+    const yearOptions = getYearOptions(minDate, maxDate);
+    const handleMonthChange = (e) => {
+        const selectedMonth = parseInt(e.target.value, 10);
         onMonthYearChange === null || onMonthYearChange === void 0 ? void 0 : onMonthYearChange(selectedMonth, year);
     };
-    var handleYearChange = function (e) {
-        var selectedYear = parseInt(e.target.value, 10);
+    const handleYearChange = (e) => {
+        const selectedYear = parseInt(e.target.value, 10);
         onMonthYearChange === null || onMonthYearChange === void 0 ? void 0 : onMonthYearChange(monthNumber, selectedYear);
     };
     // Prevent event propagation when interacting with dropdowns to avoid
     // closing the calendar when selecting from dropdowns
-    var handleDropdownClick = function (e) {
+    const handleDropdownClick = (e) => {
         // Add datepickerId flag to prevent calendar from closing
         e.nativeEvent.__datepickerID = datepickerId;
         e.stopPropagation();
     };
-    var handleDropdownFocus = function (e) {
+    const handleDropdownFocus = (e) => {
         e.stopPropagation();
     };
     return (React.createElement("div", { className: "ffe-calendar__header" },
         React.createElement("div", { className: "ffe-calendar__header-inner-wrapper" },
             React.createElement("button", { className: "ffe-calendar__month-nav ffe-calendar__previous", onClick: previousMonthHandler, "aria-label": previousMonthLabel, type: "button", ref: prevMonthButtonElement, tabIndex: -1 },
                 React.createElement(Icon, { fileUrl: arrowBackIosIcon, size: "md", className: "ffe-calendar__icon-prev" })),
-            React.createElement("header", { "aria-live": "polite", className: "ffe-calendar__title", id: "".concat(datepickerId, "-title") }, dropdownCaption ? (React.createElement("div", { className: "ffe-calendar__dropdown-container" },
+            React.createElement("header", { "aria-live": "polite", className: "ffe-calendar__title", id: `${datepickerId}-title` }, dropdownCaption ? (React.createElement("div", { className: "ffe-calendar__dropdown-container" },
                 React.createElement("div", { className: "ffe-calendar__dropdown ffe-calendar__month-dropdown" },
-                    React.createElement(Dropdown, { id: "".concat(datepickerId, "__month-select"), className: "ffe-calendar__month-select", value: monthNumber, onChange: handleMonthChange, "aria-label": "".concat(month, " ").concat(year), onClick: handleDropdownClick, onFocus: handleDropdownFocus, ref: monthSelectRef }, monthOptions.map(function (option) { return (React.createElement("option", { key: option.value, value: option.value }, option.label)); }))),
+                    React.createElement(Dropdown, { id: `${datepickerId}__month-select`, className: "ffe-calendar__month-select", value: monthNumber, onChange: handleMonthChange, "aria-label": `${month} ${year}`, onClick: handleDropdownClick, onFocus: handleDropdownFocus, ref: monthSelectRef }, monthOptions.map(option => (React.createElement("option", { key: option.value, value: option.value }, option.label))))),
                 React.createElement("div", { className: "ffe-calendar__dropdown ffe-calendar__year-dropdown" },
-                    React.createElement(Dropdown, { id: "".concat(datepickerId, "__year-select"), className: "ffe-calendar__year-select", value: year, onChange: handleYearChange, "aria-label": "".concat(year), onClick: handleDropdownClick, onFocus: handleDropdownFocus, ref: yearSelectRef }, yearOptions.map(function (option) { return (React.createElement("option", { key: option.value, value: option.value }, option.label)); }))))) : (React.createElement("div", { id: "".concat(datepickerId, "__month-label"), "data-testid": "".concat(datepickerId, "__month-label") },
+                    React.createElement(Dropdown, { id: `${datepickerId}__year-select`, className: "ffe-calendar__year-select", value: year, onChange: handleYearChange, "aria-label": `${year}`, onClick: handleDropdownClick, onFocus: handleDropdownFocus, ref: yearSelectRef }, yearOptions.map(option => (React.createElement("option", { key: option.value, value: option.value }, option.label))))))) : (React.createElement("div", { id: `${datepickerId}__month-label`, "data-testid": `${datepickerId}__month-label` },
                 React.createElement("span", { className: "ffe-calendar__month" }, month),
                 React.createElement("span", { className: "ffe-calendar__year" }, year)))),
             React.createElement("button", { className: "ffe-calendar__month-nav ffe-calendar__next", onClick: nextMonthHandler, "aria-label": nextMonthLabel, type: "button", ref: nextMonthButtonElement, tabIndex: -1 },

package/es/calendar/NonClickableDate.js

@@ -1,5 +1,4 @@
 import React from 'react';
-export var NonClickableDate = function (_a) {
-    var date = _a.date;
+export const NonClickableDate = ({ date }) => {
     return (React.createElement("td", { "aria-hidden": true, className: "ffe-calendar__day", key: date.timestamp, role: "button" }));
 };