willba-component-library 0.3.6 → 0.3.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +70 -95
- package/lib/components/FilterBar/components/dates/Dates.d.ts +2 -1
- package/lib/index.esm.js +10 -10
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +289 -289
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +289 -289
- package/lib/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBar.tsx +2 -2
- package/src/components/FilterBar/components/dates/Dates.tsx +2 -0
package/lib/index.umd.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) :
|
|
3
3
|
typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) :
|
|
4
4
|
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.WillbaComponentLibrary = {}, global.React));
|
|
5
|
-
})(this, (function (exports, React
|
|
5
|
+
})(this, (function (exports, React) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopNamespaceDefault(e) {
|
|
8
8
|
var n = Object.create(null);
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
return Object.freeze(n);
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React
|
|
24
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
25
25
|
|
|
26
26
|
/******************************************************************************
|
|
27
27
|
Copyright (c) Microsoft Corporation.
|
|
@@ -221,8 +221,8 @@
|
|
|
221
221
|
*/
|
|
222
222
|
var Button$1 = function (_a) {
|
|
223
223
|
var _b = _a.type, type = _b === void 0 ? "primary" : _b, textColor = _a.textColor, _c = _a.size, size = _c === void 0 ? "medium" : _c, onClick = _a.onClick, label = _a.label;
|
|
224
|
-
var _d = __read(React
|
|
225
|
-
return (React
|
|
224
|
+
var _d = __read(React.useState(4), 2), theState = _d[0]; _d[1];
|
|
225
|
+
return (React.createElement("button", { type: "button", className: classNames("storybook-button", "storybook-button--".concat(size), "storybook-button--".concat(type)), style: textColor ? { color: textColor } : {}, onClick: onClick }, "".concat(label, " ").concat(theState)));
|
|
226
226
|
};
|
|
227
227
|
|
|
228
228
|
function warn() {
|
|
@@ -363,7 +363,7 @@
|
|
|
363
363
|
}
|
|
364
364
|
};
|
|
365
365
|
|
|
366
|
-
const I18nContext = React
|
|
366
|
+
const I18nContext = React.createContext();
|
|
367
367
|
class ReportNamespaces {
|
|
368
368
|
constructor() {
|
|
369
369
|
this.usedNamespaces = {};
|
|
@@ -379,8 +379,8 @@
|
|
|
379
379
|
}
|
|
380
380
|
|
|
381
381
|
const usePrevious = (value, ignore) => {
|
|
382
|
-
const ref = React
|
|
383
|
-
React
|
|
382
|
+
const ref = React.useRef();
|
|
383
|
+
React.useEffect(() => {
|
|
384
384
|
ref.current = ignore ? ref.current : value;
|
|
385
385
|
}, [value, ignore]);
|
|
386
386
|
return ref.current;
|
|
@@ -393,7 +393,7 @@
|
|
|
393
393
|
const {
|
|
394
394
|
i18n: i18nFromContext,
|
|
395
395
|
defaultNS: defaultNSFromContext
|
|
396
|
-
} = React
|
|
396
|
+
} = React.useContext(I18nContext) || {};
|
|
397
397
|
const i18n = i18nFromProps || i18nFromContext || getI18n();
|
|
398
398
|
if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();
|
|
399
399
|
if (!i18n) {
|
|
@@ -426,12 +426,12 @@
|
|
|
426
426
|
function getT() {
|
|
427
427
|
return i18n.getFixedT(props.lng || null, i18nOptions.nsMode === 'fallback' ? namespaces : namespaces[0], keyPrefix);
|
|
428
428
|
}
|
|
429
|
-
const [t, setT] = React
|
|
429
|
+
const [t, setT] = React.useState(getT);
|
|
430
430
|
let joinedNS = namespaces.join();
|
|
431
431
|
if (props.lng) joinedNS = `${props.lng}${joinedNS}`;
|
|
432
432
|
const previousJoinedNS = usePrevious(joinedNS);
|
|
433
|
-
const isMounted = React
|
|
434
|
-
React
|
|
433
|
+
const isMounted = React.useRef(true);
|
|
434
|
+
React.useEffect(() => {
|
|
435
435
|
const {
|
|
436
436
|
bindI18n,
|
|
437
437
|
bindI18nStore
|
|
@@ -462,8 +462,8 @@
|
|
|
462
462
|
if (bindI18nStore && i18n) bindI18nStore.split(' ').forEach(e => i18n.store.off(e, boundReset));
|
|
463
463
|
};
|
|
464
464
|
}, [i18n, joinedNS]);
|
|
465
|
-
const isInitial = React
|
|
466
|
-
React
|
|
465
|
+
const isInitial = React.useRef(true);
|
|
466
|
+
React.useEffect(() => {
|
|
467
467
|
if (isMounted.current && !isInitial.current) {
|
|
468
468
|
setT(getT);
|
|
469
469
|
}
|
|
@@ -491,7 +491,7 @@
|
|
|
491
491
|
style: undefined,
|
|
492
492
|
attr: undefined
|
|
493
493
|
};
|
|
494
|
-
var IconContext = React
|
|
494
|
+
var IconContext = React.createContext && React.createContext(DefaultContext);
|
|
495
495
|
|
|
496
496
|
var __assign$1 = undefined && undefined.__assign || function () {
|
|
497
497
|
__assign$1 = Object.assign || function (t) {
|
|
@@ -513,7 +513,7 @@
|
|
|
513
513
|
};
|
|
514
514
|
function Tree2Element(tree) {
|
|
515
515
|
return tree && tree.map(function (node, i) {
|
|
516
|
-
return React
|
|
516
|
+
return React.createElement(node.tag, __assign$1({
|
|
517
517
|
key: i
|
|
518
518
|
}, node.attr), Tree2Element(node.child));
|
|
519
519
|
});
|
|
@@ -521,7 +521,7 @@
|
|
|
521
521
|
function GenIcon(data) {
|
|
522
522
|
// eslint-disable-next-line react/display-name
|
|
523
523
|
return function (props) {
|
|
524
|
-
return React
|
|
524
|
+
return React.createElement(IconBase, __assign$1({
|
|
525
525
|
attr: __assign$1({}, data.attr)
|
|
526
526
|
}, props), Tree2Element(data.child));
|
|
527
527
|
};
|
|
@@ -536,7 +536,7 @@
|
|
|
536
536
|
var className;
|
|
537
537
|
if (conf.className) className = conf.className;
|
|
538
538
|
if (props.className) className = (className ? className + " " : "") + props.className;
|
|
539
|
-
return React
|
|
539
|
+
return React.createElement("svg", __assign$1({
|
|
540
540
|
stroke: "currentColor",
|
|
541
541
|
fill: "currentColor",
|
|
542
542
|
strokeWidth: "0"
|
|
@@ -548,9 +548,9 @@
|
|
|
548
548
|
height: computedSize,
|
|
549
549
|
width: computedSize,
|
|
550
550
|
xmlns: "http://www.w3.org/2000/svg"
|
|
551
|
-
}), title && React
|
|
551
|
+
}), title && React.createElement("title", null, title), props.children);
|
|
552
552
|
};
|
|
553
|
-
return IconContext !== undefined ? React
|
|
553
|
+
return IconContext !== undefined ? React.createElement(IconContext.Consumer, null, function (conf) {
|
|
554
554
|
return elem(conf);
|
|
555
555
|
}) : elem(DefaultContext);
|
|
556
556
|
}
|
|
@@ -576,8 +576,8 @@
|
|
|
576
576
|
styleInject(css_248z$f);
|
|
577
577
|
|
|
578
578
|
var useAwaitRender = function () {
|
|
579
|
-
var _a = __read(React
|
|
580
|
-
React
|
|
579
|
+
var _a = __read(React.useState(false), 2), initialRenderComplete = _a[0], setInitialRenderComplete = _a[1];
|
|
580
|
+
React.useEffect(function () {
|
|
581
581
|
setInitialRenderComplete(true);
|
|
582
582
|
}, []);
|
|
583
583
|
if (!initialRenderComplete)
|
|
@@ -2972,8 +2972,8 @@
|
|
|
2972
2972
|
|
|
2973
2973
|
var useUpdateTranslations = function (_a) {
|
|
2974
2974
|
var language = _a.language;
|
|
2975
|
-
var _b = __read(React
|
|
2976
|
-
React
|
|
2975
|
+
var _b = __read(React.useState(0), 2); _b[0]; var setRerenderKey = _b[1];
|
|
2976
|
+
React.useEffect(function () {
|
|
2977
2977
|
instance.changeLanguage(language);
|
|
2978
2978
|
setRerenderKey(function (prevKey) { return prevKey + 1; });
|
|
2979
2979
|
}, [language]);
|
|
@@ -2982,8 +2982,8 @@
|
|
|
2982
2982
|
// TODO - Refactor and rename this hook
|
|
2983
2983
|
var useCloseFilterSection = function (_a) {
|
|
2984
2984
|
var handleSelectedFilter = _a.handleSelectedFilter;
|
|
2985
|
-
var filtersRef = React
|
|
2986
|
-
React
|
|
2985
|
+
var filtersRef = React.useRef(null);
|
|
2986
|
+
React.useEffect(function () {
|
|
2987
2987
|
var handleClickOutside = function (event) {
|
|
2988
2988
|
if (filtersRef.current &&
|
|
2989
2989
|
!filtersRef.current.contains(event.target)) {
|
|
@@ -2999,8 +2999,8 @@
|
|
|
2999
2999
|
};
|
|
3000
3000
|
|
|
3001
3001
|
var useAutoFocus = function (autoFocus) {
|
|
3002
|
-
var ref = React
|
|
3003
|
-
React
|
|
3002
|
+
var ref = React.useRef(null);
|
|
3003
|
+
React.useEffect(function () {
|
|
3004
3004
|
if (!autoFocus || !ref.current)
|
|
3005
3005
|
return;
|
|
3006
3006
|
var attemptFocus = function (attempts) {
|
|
@@ -3025,8 +3025,8 @@
|
|
|
3025
3025
|
|
|
3026
3026
|
var SubmitButton = function (_a) {
|
|
3027
3027
|
var onClick = _a.onClick, startIcon = _a.startIcon, label = _a.label, disabled = _a.disabled, isLoading = _a.isLoading, variant = _a.variant;
|
|
3028
|
-
return (React
|
|
3029
|
-
isLoading ? (React
|
|
3028
|
+
return (React.createElement("button", { className: "will-filter-bar-submit-button ".concat(variant || 'default'), onClick: onClick, disabled: disabled || isLoading },
|
|
3029
|
+
isLoading ? (React.createElement("span", null, React.createElement(FaSpinner, { style: { animation: 'spin 1s linear infinite' } }))) : (startIcon && React.createElement("span", null, startIcon)),
|
|
3030
3030
|
label || 'Label'));
|
|
3031
3031
|
};
|
|
3032
3032
|
|
|
@@ -3040,8 +3040,8 @@
|
|
|
3040
3040
|
|
|
3041
3041
|
var CloseButton = function (_a) {
|
|
3042
3042
|
var handleClose = _a.handleClose;
|
|
3043
|
-
return (React
|
|
3044
|
-
React
|
|
3043
|
+
return (React.createElement("button", { className: "will-filter-bar-close-button", onClick: handleClose },
|
|
3044
|
+
React.createElement(IoIosCloseCircleOutline, null)));
|
|
3045
3045
|
};
|
|
3046
3046
|
|
|
3047
3047
|
function _typeof(o) {
|
|
@@ -7322,7 +7322,7 @@
|
|
|
7322
7322
|
*
|
|
7323
7323
|
* Access to this context from the {@link useDayPicker} hook.
|
|
7324
7324
|
*/
|
|
7325
|
-
var DayPickerContext = React
|
|
7325
|
+
var DayPickerContext = React.createContext(undefined);
|
|
7326
7326
|
/**
|
|
7327
7327
|
* The provider for the {@link DayPickerContext}, assigning the defaults from the
|
|
7328
7328
|
* initial DayPicker props.
|
|
@@ -7344,7 +7344,7 @@
|
|
|
7344
7344
|
onSelect = initialProps.onSelect;
|
|
7345
7345
|
}
|
|
7346
7346
|
var value = __assign(__assign(__assign({}, defaultContextValues), initialProps), { captionLayout: captionLayout, classNames: __assign(__assign({}, defaultContextValues.classNames), initialProps.classNames), components: __assign({}, initialProps.components), formatters: __assign(__assign({}, defaultContextValues.formatters), initialProps.formatters), fromDate: fromDate, labels: __assign(__assign({}, defaultContextValues.labels), initialProps.labels), mode: initialProps.mode || defaultContextValues.mode, modifiers: __assign(__assign({}, defaultContextValues.modifiers), initialProps.modifiers), modifiersClassNames: __assign(__assign({}, defaultContextValues.modifiersClassNames), initialProps.modifiersClassNames), onSelect: onSelect, styles: __assign(__assign({}, defaultContextValues.styles), initialProps.styles), toDate: toDate });
|
|
7347
|
-
return (React
|
|
7347
|
+
return (React.createElement(DayPickerContext.Provider, { value: value }, props.children));
|
|
7348
7348
|
}
|
|
7349
7349
|
/**
|
|
7350
7350
|
* Hook to access the {@link DayPickerContextValue}.
|
|
@@ -7353,7 +7353,7 @@
|
|
|
7353
7353
|
* internal or custom components.
|
|
7354
7354
|
*/
|
|
7355
7355
|
function useDayPicker() {
|
|
7356
|
-
var context = React
|
|
7356
|
+
var context = React.useContext(DayPickerContext);
|
|
7357
7357
|
if (!context) {
|
|
7358
7358
|
throw new Error("useDayPicker must be used within a DayPickerProvider.");
|
|
7359
7359
|
}
|
|
@@ -7363,15 +7363,15 @@
|
|
|
7363
7363
|
/** Render the caption for the displayed month. This component is used when `captionLayout="buttons"`. */
|
|
7364
7364
|
function CaptionLabel(props) {
|
|
7365
7365
|
var _a = useDayPicker(), locale = _a.locale, classNames = _a.classNames, styles = _a.styles, formatCaption = _a.formatters.formatCaption;
|
|
7366
|
-
return (React
|
|
7366
|
+
return (React.createElement("div", { className: classNames.caption_label, style: styles.caption_label, "aria-live": "polite", role: "presentation", id: props.id }, formatCaption(props.displayMonth, { locale: locale })));
|
|
7367
7367
|
}
|
|
7368
7368
|
|
|
7369
7369
|
/**
|
|
7370
7370
|
* Render the icon in the styled drop-down.
|
|
7371
7371
|
*/
|
|
7372
7372
|
function IconDropdown(props) {
|
|
7373
|
-
return (React
|
|
7374
|
-
React
|
|
7373
|
+
return (React.createElement("svg", __assign({ width: "8px", height: "8px", viewBox: "0 0 120 120", "data-testid": "iconDropdown" }, props),
|
|
7374
|
+
React.createElement("path", { d: "M4.22182541,48.2218254 C8.44222828,44.0014225 15.2388494,43.9273804 19.5496459,47.9996989 L19.7781746,48.2218254 L60,88.443 L100.221825,48.2218254 C104.442228,44.0014225 111.238849,43.9273804 115.549646,47.9996989 L115.778175,48.2218254 C119.998577,52.4422283 120.07262,59.2388494 116.000301,63.5496459 L115.778175,63.7781746 L67.7781746,111.778175 C63.5577717,115.998577 56.7611506,116.07262 52.4503541,112.000301 L52.2218254,111.778175 L4.22182541,63.7781746 C-0.0739418023,59.4824074 -0.0739418023,52.5175926 4.22182541,48.2218254 Z", fill: "currentColor", fillRule: "nonzero" })));
|
|
7375
7375
|
}
|
|
7376
7376
|
|
|
7377
7377
|
/**
|
|
@@ -7383,12 +7383,12 @@
|
|
|
7383
7383
|
var onChange = props.onChange, value = props.value, children = props.children, caption = props.caption, className = props.className, style = props.style;
|
|
7384
7384
|
var dayPicker = useDayPicker();
|
|
7385
7385
|
var IconDropdownComponent = (_b = (_a = dayPicker.components) === null || _a === void 0 ? void 0 : _a.IconDropdown) !== null && _b !== void 0 ? _b : IconDropdown;
|
|
7386
|
-
return (React
|
|
7387
|
-
React
|
|
7388
|
-
React
|
|
7389
|
-
React
|
|
7386
|
+
return (React.createElement("div", { className: className, style: style },
|
|
7387
|
+
React.createElement("span", { className: dayPicker.classNames.vhidden }, props['aria-label']),
|
|
7388
|
+
React.createElement("select", { name: props.name, "aria-label": props['aria-label'], className: dayPicker.classNames.dropdown, style: dayPicker.styles.dropdown, value: value, onChange: onChange }, children),
|
|
7389
|
+
React.createElement("div", { className: dayPicker.classNames.caption_label, style: dayPicker.styles.caption_label, "aria-hidden": "true" },
|
|
7390
7390
|
caption,
|
|
7391
|
-
React
|
|
7391
|
+
React.createElement(IconDropdownComponent, { className: dayPicker.classNames.dropdown_icon, style: dayPicker.styles.dropdown_icon }))));
|
|
7392
7392
|
}
|
|
7393
7393
|
|
|
7394
7394
|
/** Render the dropdown to navigate between months. */
|
|
@@ -7397,9 +7397,9 @@
|
|
|
7397
7397
|
var _b = useDayPicker(), fromDate = _b.fromDate, toDate = _b.toDate, styles = _b.styles, locale = _b.locale, formatMonthCaption = _b.formatters.formatMonthCaption, classNames = _b.classNames, components = _b.components, labelMonthDropdown = _b.labels.labelMonthDropdown;
|
|
7398
7398
|
// Dropdown should appear only when both from/toDate is set
|
|
7399
7399
|
if (!fromDate)
|
|
7400
|
-
return React
|
|
7400
|
+
return React.createElement(React.Fragment, null);
|
|
7401
7401
|
if (!toDate)
|
|
7402
|
-
return React
|
|
7402
|
+
return React.createElement(React.Fragment, null);
|
|
7403
7403
|
var dropdownMonths = [];
|
|
7404
7404
|
if (isSameYear(fromDate, toDate)) {
|
|
7405
7405
|
// only display the months included in the range
|
|
@@ -7421,7 +7421,7 @@
|
|
|
7421
7421
|
props.onChange(newMonth);
|
|
7422
7422
|
};
|
|
7423
7423
|
var DropdownComponent = (_a = components === null || components === void 0 ? void 0 : components.Dropdown) !== null && _a !== void 0 ? _a : Dropdown;
|
|
7424
|
-
return (React
|
|
7424
|
+
return (React.createElement(DropdownComponent, { name: "months", "aria-label": labelMonthDropdown(), className: classNames.dropdown_month, style: styles.dropdown_month, onChange: handleChange, value: props.displayMonth.getMonth(), caption: formatMonthCaption(props.displayMonth, { locale: locale }) }, dropdownMonths.map(function (m) { return (React.createElement("option", { key: m.getMonth(), value: m.getMonth() }, formatMonthCaption(m, { locale: locale }))); })));
|
|
7425
7425
|
}
|
|
7426
7426
|
|
|
7427
7427
|
/**
|
|
@@ -7435,9 +7435,9 @@
|
|
|
7435
7435
|
var years = [];
|
|
7436
7436
|
// Dropdown should appear only when both from/toDate is set
|
|
7437
7437
|
if (!fromDate)
|
|
7438
|
-
return React
|
|
7438
|
+
return React.createElement(React.Fragment, null);
|
|
7439
7439
|
if (!toDate)
|
|
7440
|
-
return React
|
|
7440
|
+
return React.createElement(React.Fragment, null);
|
|
7441
7441
|
var fromYear = fromDate.getFullYear();
|
|
7442
7442
|
var toYear = toDate.getFullYear();
|
|
7443
7443
|
for (var year = fromYear; year <= toYear; year++) {
|
|
@@ -7448,7 +7448,7 @@
|
|
|
7448
7448
|
props.onChange(newMonth);
|
|
7449
7449
|
};
|
|
7450
7450
|
var DropdownComponent = (_a = components === null || components === void 0 ? void 0 : components.Dropdown) !== null && _a !== void 0 ? _a : Dropdown;
|
|
7451
|
-
return (React
|
|
7451
|
+
return (React.createElement(DropdownComponent, { name: "years", "aria-label": labelYearDropdown(), className: classNames.dropdown_year, style: styles.dropdown_year, onChange: handleChange, value: displayMonth.getFullYear(), caption: formatYearCaption(displayMonth, { locale: locale }) }, years.map(function (year) { return (React.createElement("option", { key: year.getFullYear(), value: year.getFullYear() }, formatYearCaption(year, { locale: locale }))); })));
|
|
7452
7452
|
}
|
|
7453
7453
|
|
|
7454
7454
|
/**
|
|
@@ -7461,7 +7461,7 @@
|
|
|
7461
7461
|
* argument, which will be always returned as `value`.
|
|
7462
7462
|
*/
|
|
7463
7463
|
function useControlledValue(defaultValue, controlledValue) {
|
|
7464
|
-
var _a = React
|
|
7464
|
+
var _a = React.useState(defaultValue), uncontrolledValue = _a[0], setValue = _a[1];
|
|
7465
7465
|
var value = controlledValue === undefined ? uncontrolledValue : controlledValue;
|
|
7466
7466
|
return [value, setValue];
|
|
7467
7467
|
}
|
|
@@ -7579,7 +7579,7 @@
|
|
|
7579
7579
|
* The Navigation context shares details and methods to navigate the months in DayPicker.
|
|
7580
7580
|
* Access this context from the {@link useNavigation} hook.
|
|
7581
7581
|
*/
|
|
7582
|
-
var NavigationContext = React
|
|
7582
|
+
var NavigationContext = React.createContext(undefined);
|
|
7583
7583
|
/** Provides the values for the {@link NavigationContext}. */
|
|
7584
7584
|
function NavigationProvider(props) {
|
|
7585
7585
|
var dayPicker = useDayPicker();
|
|
@@ -7612,7 +7612,7 @@
|
|
|
7612
7612
|
nextMonth: nextMonth,
|
|
7613
7613
|
isDateDisplayed: isDateDisplayed
|
|
7614
7614
|
};
|
|
7615
|
-
return (React
|
|
7615
|
+
return (React.createElement(NavigationContext.Provider, { value: value }, props.children));
|
|
7616
7616
|
}
|
|
7617
7617
|
/**
|
|
7618
7618
|
* Hook to access the {@link NavigationContextValue}. Use this hook to navigate
|
|
@@ -7621,7 +7621,7 @@
|
|
|
7621
7621
|
* This hook is meant to be used inside internal or custom components.
|
|
7622
7622
|
*/
|
|
7623
7623
|
function useNavigation() {
|
|
7624
|
-
var context = React
|
|
7624
|
+
var context = React.useContext(NavigationContext);
|
|
7625
7625
|
if (!context) {
|
|
7626
7626
|
throw new Error('useNavigation must be used within a NavigationProvider');
|
|
7627
7627
|
}
|
|
@@ -7639,31 +7639,31 @@
|
|
|
7639
7639
|
goToMonth(newMonth);
|
|
7640
7640
|
};
|
|
7641
7641
|
var CaptionLabelComponent = (_a = components === null || components === void 0 ? void 0 : components.CaptionLabel) !== null && _a !== void 0 ? _a : CaptionLabel;
|
|
7642
|
-
var captionLabel = (React
|
|
7643
|
-
return (React
|
|
7644
|
-
React
|
|
7645
|
-
React
|
|
7646
|
-
React
|
|
7642
|
+
var captionLabel = (React.createElement(CaptionLabelComponent, { id: props.id, displayMonth: props.displayMonth }));
|
|
7643
|
+
return (React.createElement("div", { className: classNames.caption_dropdowns, style: styles.caption_dropdowns },
|
|
7644
|
+
React.createElement("div", { className: classNames.vhidden }, captionLabel),
|
|
7645
|
+
React.createElement(MonthsDropdown, { onChange: handleMonthChange, displayMonth: props.displayMonth }),
|
|
7646
|
+
React.createElement(YearsDropdown, { onChange: handleMonthChange, displayMonth: props.displayMonth })));
|
|
7647
7647
|
}
|
|
7648
7648
|
|
|
7649
7649
|
/**
|
|
7650
7650
|
* Render the "previous month" button in the navigation.
|
|
7651
7651
|
*/
|
|
7652
7652
|
function IconLeft(props) {
|
|
7653
|
-
return (React
|
|
7654
|
-
React
|
|
7653
|
+
return (React.createElement("svg", __assign({ width: "16px", height: "16px", viewBox: "0 0 120 120" }, props),
|
|
7654
|
+
React.createElement("path", { d: "M69.490332,3.34314575 C72.6145263,0.218951416 77.6798462,0.218951416 80.8040405,3.34314575 C83.8617626,6.40086786 83.9268205,11.3179931 80.9992143,14.4548388 L80.8040405,14.6568542 L35.461,60 L80.8040405,105.343146 C83.8617626,108.400868 83.9268205,113.317993 80.9992143,116.454839 L80.8040405,116.656854 C77.7463184,119.714576 72.8291931,119.779634 69.6923475,116.852028 L69.490332,116.656854 L18.490332,65.6568542 C15.4326099,62.5991321 15.367552,57.6820069 18.2951583,54.5451612 L18.490332,54.3431458 L69.490332,3.34314575 Z", fill: "currentColor", fillRule: "nonzero" })));
|
|
7655
7655
|
}
|
|
7656
7656
|
|
|
7657
7657
|
/**
|
|
7658
7658
|
* Render the "next month" button in the navigation.
|
|
7659
7659
|
*/
|
|
7660
7660
|
function IconRight(props) {
|
|
7661
|
-
return (React
|
|
7662
|
-
React
|
|
7661
|
+
return (React.createElement("svg", __assign({ width: "16px", height: "16px", viewBox: "0 0 120 120" }, props),
|
|
7662
|
+
React.createElement("path", { d: "M49.8040405,3.34314575 C46.6798462,0.218951416 41.6145263,0.218951416 38.490332,3.34314575 C35.4326099,6.40086786 35.367552,11.3179931 38.2951583,14.4548388 L38.490332,14.6568542 L83.8333725,60 L38.490332,105.343146 C35.4326099,108.400868 35.367552,113.317993 38.2951583,116.454839 L38.490332,116.656854 C41.5480541,119.714576 46.4651794,119.779634 49.602025,116.852028 L49.8040405,116.656854 L100.804041,65.6568542 C103.861763,62.5991321 103.926821,57.6820069 100.999214,54.5451612 L100.804041,54.3431458 L49.8040405,3.34314575 Z", fill: "currentColor" })));
|
|
7663
7663
|
}
|
|
7664
7664
|
|
|
7665
7665
|
/** Render a button HTML element applying the reset class name. */
|
|
7666
|
-
var Button = React
|
|
7666
|
+
var Button = React.forwardRef(function (props, ref) {
|
|
7667
7667
|
var _a = useDayPicker(), classNames = _a.classNames, styles = _a.styles;
|
|
7668
7668
|
var classNamesArr = [classNames.button_reset, classNames.button];
|
|
7669
7669
|
if (props.className) {
|
|
@@ -7674,7 +7674,7 @@
|
|
|
7674
7674
|
if (props.style) {
|
|
7675
7675
|
Object.assign(style, props.style);
|
|
7676
7676
|
}
|
|
7677
|
-
return (React
|
|
7677
|
+
return (React.createElement("button", __assign({}, props, { ref: ref, type: "button", className: className, style: style })));
|
|
7678
7678
|
});
|
|
7679
7679
|
|
|
7680
7680
|
/** A component rendering the navigation buttons or the drop-downs. */
|
|
@@ -7682,7 +7682,7 @@
|
|
|
7682
7682
|
var _a, _b;
|
|
7683
7683
|
var _c = useDayPicker(), dir = _c.dir, locale = _c.locale, classNames = _c.classNames, styles = _c.styles, _d = _c.labels, labelPrevious = _d.labelPrevious, labelNext = _d.labelNext, components = _c.components;
|
|
7684
7684
|
if (!props.nextMonth && !props.previousMonth) {
|
|
7685
|
-
return React
|
|
7685
|
+
return React.createElement(React.Fragment, null);
|
|
7686
7686
|
}
|
|
7687
7687
|
var previousLabel = labelPrevious(props.previousMonth, { locale: locale });
|
|
7688
7688
|
var previousClassName = [
|
|
@@ -7696,9 +7696,9 @@
|
|
|
7696
7696
|
].join(' ');
|
|
7697
7697
|
var IconRightComponent = (_a = components === null || components === void 0 ? void 0 : components.IconRight) !== null && _a !== void 0 ? _a : IconRight;
|
|
7698
7698
|
var IconLeftComponent = (_b = components === null || components === void 0 ? void 0 : components.IconLeft) !== null && _b !== void 0 ? _b : IconLeft;
|
|
7699
|
-
return (React
|
|
7700
|
-
!props.hidePrevious && (React
|
|
7701
|
-
!props.hideNext && (React
|
|
7699
|
+
return (React.createElement("div", { className: classNames.nav, style: styles.nav },
|
|
7700
|
+
!props.hidePrevious && (React.createElement(Button, { name: "previous-month", "aria-label": previousLabel, className: previousClassName, style: styles.nav_button_previous, disabled: !props.previousMonth, onClick: props.onPreviousClick }, dir === 'rtl' ? (React.createElement(IconRightComponent, { className: classNames.nav_icon, style: styles.nav_icon })) : (React.createElement(IconLeftComponent, { className: classNames.nav_icon, style: styles.nav_icon })))),
|
|
7701
|
+
!props.hideNext && (React.createElement(Button, { name: "next-month", "aria-label": nextLabel, className: nextClassName, style: styles.nav_button_next, disabled: !props.nextMonth, onClick: props.onNextClick }, dir === 'rtl' ? (React.createElement(IconLeftComponent, { className: classNames.nav_icon, style: styles.nav_icon })) : (React.createElement(IconRightComponent, { className: classNames.nav_icon, style: styles.nav_icon }))))));
|
|
7702
7702
|
}
|
|
7703
7703
|
|
|
7704
7704
|
/**
|
|
@@ -7724,7 +7724,7 @@
|
|
|
7724
7724
|
return;
|
|
7725
7725
|
goToMonth(nextMonth);
|
|
7726
7726
|
};
|
|
7727
|
-
return (React
|
|
7727
|
+
return (React.createElement(Navigation, { displayMonth: props.displayMonth, hideNext: hideNext, hidePrevious: hidePrevious, nextMonth: nextMonth, previousMonth: previousMonth, onPreviousClick: handlePreviousClick, onNextClick: handleNextClick }));
|
|
7728
7728
|
}
|
|
7729
7729
|
|
|
7730
7730
|
/**
|
|
@@ -7737,22 +7737,22 @@
|
|
|
7737
7737
|
var CaptionLabelComponent = (_a = components === null || components === void 0 ? void 0 : components.CaptionLabel) !== null && _a !== void 0 ? _a : CaptionLabel;
|
|
7738
7738
|
var caption;
|
|
7739
7739
|
if (disableNavigation) {
|
|
7740
|
-
caption = (React
|
|
7740
|
+
caption = (React.createElement(CaptionLabelComponent, { id: props.id, displayMonth: props.displayMonth }));
|
|
7741
7741
|
}
|
|
7742
7742
|
else if (captionLayout === 'dropdown') {
|
|
7743
|
-
caption = (React
|
|
7743
|
+
caption = (React.createElement(CaptionDropdowns, { displayMonth: props.displayMonth, id: props.id }));
|
|
7744
7744
|
}
|
|
7745
7745
|
else if (captionLayout === 'dropdown-buttons') {
|
|
7746
|
-
caption = (React
|
|
7747
|
-
React
|
|
7748
|
-
React
|
|
7746
|
+
caption = (React.createElement(React.Fragment, null,
|
|
7747
|
+
React.createElement(CaptionDropdowns, { displayMonth: props.displayMonth, id: props.id }),
|
|
7748
|
+
React.createElement(CaptionNavigation, { displayMonth: props.displayMonth, id: props.id })));
|
|
7749
7749
|
}
|
|
7750
7750
|
else {
|
|
7751
|
-
caption = (React
|
|
7752
|
-
React
|
|
7753
|
-
React
|
|
7751
|
+
caption = (React.createElement(React.Fragment, null,
|
|
7752
|
+
React.createElement(CaptionLabelComponent, { id: props.id, displayMonth: props.displayMonth }),
|
|
7753
|
+
React.createElement(CaptionNavigation, { displayMonth: props.displayMonth, id: props.id })));
|
|
7754
7754
|
}
|
|
7755
|
-
return (React
|
|
7755
|
+
return (React.createElement("div", { className: classNames.caption, style: styles.caption }, caption));
|
|
7756
7756
|
}
|
|
7757
7757
|
|
|
7758
7758
|
/** Render the Footer component (empty as default).*/
|
|
@@ -7760,10 +7760,10 @@
|
|
|
7760
7760
|
function Footer$1(props) {
|
|
7761
7761
|
var _a = useDayPicker(), footer = _a.footer, styles = _a.styles, tfoot = _a.classNames.tfoot;
|
|
7762
7762
|
if (!footer)
|
|
7763
|
-
return React
|
|
7764
|
-
return (React
|
|
7765
|
-
React
|
|
7766
|
-
React
|
|
7763
|
+
return React.createElement(React.Fragment, null);
|
|
7764
|
+
return (React.createElement("tfoot", { className: tfoot, style: styles.tfoot },
|
|
7765
|
+
React.createElement("tr", null,
|
|
7766
|
+
React.createElement("td", { colSpan: 8 }, footer))));
|
|
7767
7767
|
}
|
|
7768
7768
|
|
|
7769
7769
|
/**
|
|
@@ -7792,9 +7792,9 @@
|
|
|
7792
7792
|
function HeadRow() {
|
|
7793
7793
|
var _a = useDayPicker(), classNames = _a.classNames, styles = _a.styles, showWeekNumber = _a.showWeekNumber, locale = _a.locale, weekStartsOn = _a.weekStartsOn, ISOWeek = _a.ISOWeek, formatWeekdayName = _a.formatters.formatWeekdayName, labelWeekday = _a.labels.labelWeekday;
|
|
7794
7794
|
var weekdays = getWeekdays(locale, weekStartsOn, ISOWeek);
|
|
7795
|
-
return (React
|
|
7796
|
-
showWeekNumber && (React
|
|
7797
|
-
weekdays.map(function (weekday, i) { return (React
|
|
7795
|
+
return (React.createElement("tr", { style: styles.head_row, className: classNames.head_row },
|
|
7796
|
+
showWeekNumber && (React.createElement("td", { style: styles.head_cell, className: classNames.head_cell })),
|
|
7797
|
+
weekdays.map(function (weekday, i) { return (React.createElement("th", { key: i, scope: "col", className: classNames.head_cell, style: styles.head_cell, "aria-label": labelWeekday(weekday, { locale: locale }) }, formatWeekdayName(weekday, { locale: locale }))); })));
|
|
7798
7798
|
}
|
|
7799
7799
|
|
|
7800
7800
|
/** Render the table head. */
|
|
@@ -7802,14 +7802,14 @@
|
|
|
7802
7802
|
var _a;
|
|
7803
7803
|
var _b = useDayPicker(), classNames = _b.classNames, styles = _b.styles, components = _b.components;
|
|
7804
7804
|
var HeadRowComponent = (_a = components === null || components === void 0 ? void 0 : components.HeadRow) !== null && _a !== void 0 ? _a : HeadRow;
|
|
7805
|
-
return (React
|
|
7806
|
-
React
|
|
7805
|
+
return (React.createElement("thead", { style: styles.head, className: classNames.head },
|
|
7806
|
+
React.createElement(HeadRowComponent, null)));
|
|
7807
7807
|
}
|
|
7808
7808
|
|
|
7809
7809
|
/** Render the content of the day cell. */
|
|
7810
7810
|
function DayContent(props) {
|
|
7811
7811
|
var _a = useDayPicker(), locale = _a.locale, formatDay = _a.formatters.formatDay;
|
|
7812
|
-
return React
|
|
7812
|
+
return React.createElement(React.Fragment, null, formatDay(props.date, { locale: locale }));
|
|
7813
7813
|
}
|
|
7814
7814
|
|
|
7815
7815
|
/**
|
|
@@ -7818,7 +7818,7 @@
|
|
|
7818
7818
|
*
|
|
7819
7819
|
* Access this context from the {@link useSelectMultiple} hook.
|
|
7820
7820
|
*/
|
|
7821
|
-
var SelectMultipleContext = React
|
|
7821
|
+
var SelectMultipleContext = React.createContext(undefined);
|
|
7822
7822
|
/** Provides the values for the {@link SelectMultipleContext}. */
|
|
7823
7823
|
function SelectMultipleProvider(props) {
|
|
7824
7824
|
if (!isDayPickerMultiple(props.initialProps)) {
|
|
@@ -7828,9 +7828,9 @@
|
|
|
7828
7828
|
disabled: []
|
|
7829
7829
|
}
|
|
7830
7830
|
};
|
|
7831
|
-
return (React
|
|
7831
|
+
return (React.createElement(SelectMultipleContext.Provider, { value: emptyContextValue }, props.children));
|
|
7832
7832
|
}
|
|
7833
|
-
return (React
|
|
7833
|
+
return (React.createElement(SelectMultipleProviderInternal, { initialProps: props.initialProps, children: props.children }));
|
|
7834
7834
|
}
|
|
7835
7835
|
function SelectMultipleProviderInternal(_a) {
|
|
7836
7836
|
var initialProps = _a.initialProps, children = _a.children;
|
|
@@ -7875,7 +7875,7 @@
|
|
|
7875
7875
|
onDayClick: onDayClick,
|
|
7876
7876
|
modifiers: modifiers
|
|
7877
7877
|
};
|
|
7878
|
-
return (React
|
|
7878
|
+
return (React.createElement(SelectMultipleContext.Provider, { value: contextValue }, children));
|
|
7879
7879
|
}
|
|
7880
7880
|
/**
|
|
7881
7881
|
* Hook to access the {@link SelectMultipleContextValue}.
|
|
@@ -7883,7 +7883,7 @@
|
|
|
7883
7883
|
* This hook is meant to be used inside internal or custom components.
|
|
7884
7884
|
*/
|
|
7885
7885
|
function useSelectMultiple() {
|
|
7886
|
-
var context = React
|
|
7886
|
+
var context = React.useContext(SelectMultipleContext);
|
|
7887
7887
|
if (!context) {
|
|
7888
7888
|
throw new Error('useSelectMultiple must be used within a SelectMultipleProvider');
|
|
7889
7889
|
}
|
|
@@ -7931,7 +7931,7 @@
|
|
|
7931
7931
|
*
|
|
7932
7932
|
* Access this context from the {@link useSelectRange} hook.
|
|
7933
7933
|
*/
|
|
7934
|
-
var SelectRangeContext = React
|
|
7934
|
+
var SelectRangeContext = React.createContext(undefined);
|
|
7935
7935
|
/** Provides the values for the {@link SelectRangeProvider}. */
|
|
7936
7936
|
function SelectRangeProvider(props) {
|
|
7937
7937
|
if (!isDayPickerRange(props.initialProps)) {
|
|
@@ -7944,9 +7944,9 @@
|
|
|
7944
7944
|
disabled: []
|
|
7945
7945
|
}
|
|
7946
7946
|
};
|
|
7947
|
-
return (React
|
|
7947
|
+
return (React.createElement(SelectRangeContext.Provider, { value: emptyContextValue }, props.children));
|
|
7948
7948
|
}
|
|
7949
|
-
return (React
|
|
7949
|
+
return (React.createElement(SelectRangeProviderInternal, { initialProps: props.initialProps, children: props.children }));
|
|
7950
7950
|
}
|
|
7951
7951
|
function SelectRangeProviderInternal(_a) {
|
|
7952
7952
|
var initialProps = _a.initialProps, children = _a.children;
|
|
@@ -8017,7 +8017,7 @@
|
|
|
8017
8017
|
});
|
|
8018
8018
|
}
|
|
8019
8019
|
}
|
|
8020
|
-
return (React
|
|
8020
|
+
return (React.createElement(SelectRangeContext.Provider, { value: { selected: selected, onDayClick: onDayClick, modifiers: modifiers } }, children));
|
|
8021
8021
|
}
|
|
8022
8022
|
/**
|
|
8023
8023
|
* Hook to access the {@link SelectRangeContextValue}.
|
|
@@ -8025,7 +8025,7 @@
|
|
|
8025
8025
|
* This hook is meant to be used inside internal or custom components.
|
|
8026
8026
|
*/
|
|
8027
8027
|
function useSelectRange() {
|
|
8028
|
-
var context = React
|
|
8028
|
+
var context = React.useContext(SelectRangeContext);
|
|
8029
8029
|
if (!context) {
|
|
8030
8030
|
throw new Error('useSelectRange must be used within a SelectRangeProvider');
|
|
8031
8031
|
}
|
|
@@ -8108,7 +8108,7 @@
|
|
|
8108
8108
|
}
|
|
8109
8109
|
|
|
8110
8110
|
/** The Modifiers context store the modifiers used in DayPicker. To access the value of this context, use {@link useModifiers}. */
|
|
8111
|
-
var ModifiersContext = React
|
|
8111
|
+
var ModifiersContext = React.createContext(undefined);
|
|
8112
8112
|
/** Provide the value for the {@link ModifiersContext}. */
|
|
8113
8113
|
function ModifiersProvider(props) {
|
|
8114
8114
|
var dayPicker = useDayPicker();
|
|
@@ -8117,7 +8117,7 @@
|
|
|
8117
8117
|
var internalModifiers = getInternalModifiers(dayPicker, selectMultiple, selectRange);
|
|
8118
8118
|
var customModifiers = getCustomModifiers(dayPicker.modifiers);
|
|
8119
8119
|
var modifiers = __assign(__assign({}, internalModifiers), customModifiers);
|
|
8120
|
-
return (React
|
|
8120
|
+
return (React.createElement(ModifiersContext.Provider, { value: modifiers }, props.children));
|
|
8121
8121
|
}
|
|
8122
8122
|
/**
|
|
8123
8123
|
* Return the modifiers used by DayPicker.
|
|
@@ -8127,7 +8127,7 @@
|
|
|
8127
8127
|
*
|
|
8128
8128
|
*/
|
|
8129
8129
|
function useModifiers() {
|
|
8130
|
-
var context = React
|
|
8130
|
+
var context = React.useContext(ModifiersContext);
|
|
8131
8131
|
if (!context) {
|
|
8132
8132
|
throw new Error('useModifiers must be used within a ModifiersProvider');
|
|
8133
8133
|
}
|
|
@@ -8365,13 +8365,13 @@
|
|
|
8365
8365
|
*
|
|
8366
8366
|
* Access this context from the {@link useFocusContext} hook.
|
|
8367
8367
|
*/
|
|
8368
|
-
var FocusContext = React
|
|
8368
|
+
var FocusContext = React.createContext(undefined);
|
|
8369
8369
|
/** The provider for the {@link FocusContext}. */
|
|
8370
8370
|
function FocusProvider(props) {
|
|
8371
8371
|
var navigation = useNavigation();
|
|
8372
8372
|
var modifiers = useModifiers();
|
|
8373
|
-
var _a = React
|
|
8374
|
-
var _b = React
|
|
8373
|
+
var _a = React.useState(), focusedDay = _a[0], setFocusedDay = _a[1];
|
|
8374
|
+
var _b = React.useState(), lastFocused = _b[0], setLastFocused = _b[1];
|
|
8375
8375
|
var initialFocusTarget = getInitialFocusTarget(navigation.displayMonths, modifiers);
|
|
8376
8376
|
// TODO: cleanup and test obscure code below
|
|
8377
8377
|
var focusTarget = (focusedDay !== null && focusedDay !== void 0 ? focusedDay : (lastFocused && navigation.isDateDisplayed(lastFocused)))
|
|
@@ -8415,7 +8415,7 @@
|
|
|
8415
8415
|
focusStartOfWeek: function () { return moveFocus('startOfWeek', 'before'); },
|
|
8416
8416
|
focusEndOfWeek: function () { return moveFocus('endOfWeek', 'after'); }
|
|
8417
8417
|
};
|
|
8418
|
-
return (React
|
|
8418
|
+
return (React.createElement(FocusContext.Provider, { value: value }, props.children));
|
|
8419
8419
|
}
|
|
8420
8420
|
/**
|
|
8421
8421
|
* Hook to access the {@link FocusContextValue}. Use this hook to handle the
|
|
@@ -8424,7 +8424,7 @@
|
|
|
8424
8424
|
* This hook is meant to be used inside internal or custom components.
|
|
8425
8425
|
*/
|
|
8426
8426
|
function useFocusContext() {
|
|
8427
|
-
var context = React
|
|
8427
|
+
var context = React.useContext(FocusContext);
|
|
8428
8428
|
if (!context) {
|
|
8429
8429
|
throw new Error('useFocusContext must be used within a FocusProvider');
|
|
8430
8430
|
}
|
|
@@ -8456,16 +8456,16 @@
|
|
|
8456
8456
|
*
|
|
8457
8457
|
* Access this context from the {@link useSelectSingle} hook.
|
|
8458
8458
|
*/
|
|
8459
|
-
var SelectSingleContext = React
|
|
8459
|
+
var SelectSingleContext = React.createContext(undefined);
|
|
8460
8460
|
/** Provides the values for the {@link SelectSingleProvider}. */
|
|
8461
8461
|
function SelectSingleProvider(props) {
|
|
8462
8462
|
if (!isDayPickerSingle(props.initialProps)) {
|
|
8463
8463
|
var emptyContextValue = {
|
|
8464
8464
|
selected: undefined
|
|
8465
8465
|
};
|
|
8466
|
-
return (React
|
|
8466
|
+
return (React.createElement(SelectSingleContext.Provider, { value: emptyContextValue }, props.children));
|
|
8467
8467
|
}
|
|
8468
|
-
return (React
|
|
8468
|
+
return (React.createElement(SelectSingleProviderInternal, { initialProps: props.initialProps, children: props.children }));
|
|
8469
8469
|
}
|
|
8470
8470
|
function SelectSingleProviderInternal(_a) {
|
|
8471
8471
|
var initialProps = _a.initialProps, children = _a.children;
|
|
@@ -8482,7 +8482,7 @@
|
|
|
8482
8482
|
selected: initialProps.selected,
|
|
8483
8483
|
onDayClick: onDayClick
|
|
8484
8484
|
};
|
|
8485
|
-
return (React
|
|
8485
|
+
return (React.createElement(SelectSingleContext.Provider, { value: contextValue }, children));
|
|
8486
8486
|
}
|
|
8487
8487
|
/**
|
|
8488
8488
|
* Hook to access the {@link SelectSingleContextValue}.
|
|
@@ -8490,7 +8490,7 @@
|
|
|
8490
8490
|
* This hook is meant to be used inside internal or custom components.
|
|
8491
8491
|
*/
|
|
8492
8492
|
function useSelectSingle() {
|
|
8493
|
-
var context = React
|
|
8493
|
+
var context = React.useContext(SelectSingleContext);
|
|
8494
8494
|
if (!context) {
|
|
8495
8495
|
throw new Error('useSelectSingle must be used within a SelectSingleProvider');
|
|
8496
8496
|
}
|
|
@@ -8729,7 +8729,7 @@
|
|
|
8729
8729
|
var selectedDays = useSelectedDays();
|
|
8730
8730
|
var isButton = Boolean(dayPicker.onDayClick || dayPicker.mode !== 'default');
|
|
8731
8731
|
// Focus the button if the day is focused according to the focus context
|
|
8732
|
-
React
|
|
8732
|
+
React.useEffect(function () {
|
|
8733
8733
|
var _a;
|
|
8734
8734
|
if (activeModifiers.outside)
|
|
8735
8735
|
return;
|
|
@@ -8752,7 +8752,7 @@
|
|
|
8752
8752
|
var isHidden = Boolean((activeModifiers.outside && !dayPicker.showOutsideDays) ||
|
|
8753
8753
|
activeModifiers.hidden);
|
|
8754
8754
|
var DayContentComponent = (_c = (_b = dayPicker.components) === null || _b === void 0 ? void 0 : _b.DayContent) !== null && _c !== void 0 ? _c : DayContent;
|
|
8755
|
-
var children = (React
|
|
8755
|
+
var children = (React.createElement(DayContentComponent, { date: day, displayMonth: displayMonth, activeModifiers: activeModifiers }));
|
|
8756
8756
|
var divProps = {
|
|
8757
8757
|
style: style,
|
|
8758
8758
|
className: className,
|
|
@@ -8780,15 +8780,15 @@
|
|
|
8780
8780
|
* modifiers.
|
|
8781
8781
|
*/
|
|
8782
8782
|
function Day(props) {
|
|
8783
|
-
var buttonRef = React
|
|
8783
|
+
var buttonRef = React.useRef(null);
|
|
8784
8784
|
var dayRender = useDayRender(props.date, props.displayMonth, buttonRef);
|
|
8785
8785
|
if (dayRender.isHidden) {
|
|
8786
|
-
return React
|
|
8786
|
+
return React.createElement("div", { role: "gridcell" });
|
|
8787
8787
|
}
|
|
8788
8788
|
if (!dayRender.isButton) {
|
|
8789
|
-
return React
|
|
8789
|
+
return React.createElement("div", __assign({}, dayRender.divProps));
|
|
8790
8790
|
}
|
|
8791
|
-
return React
|
|
8791
|
+
return React.createElement(Button, __assign({ name: "day", ref: buttonRef }, dayRender.buttonProps));
|
|
8792
8792
|
}
|
|
8793
8793
|
|
|
8794
8794
|
/**
|
|
@@ -8800,13 +8800,13 @@
|
|
|
8800
8800
|
var _a = useDayPicker(), onWeekNumberClick = _a.onWeekNumberClick, styles = _a.styles, classNames = _a.classNames, locale = _a.locale, labelWeekNumber = _a.labels.labelWeekNumber, formatWeekNumber = _a.formatters.formatWeekNumber;
|
|
8801
8801
|
var content = formatWeekNumber(Number(weekNumber), { locale: locale });
|
|
8802
8802
|
if (!onWeekNumberClick) {
|
|
8803
|
-
return (React
|
|
8803
|
+
return (React.createElement("span", { className: classNames.weeknumber, style: styles.weeknumber }, content));
|
|
8804
8804
|
}
|
|
8805
8805
|
var label = labelWeekNumber(Number(weekNumber), { locale: locale });
|
|
8806
8806
|
var handleClick = function (e) {
|
|
8807
8807
|
onWeekNumberClick(weekNumber, dates, e);
|
|
8808
8808
|
};
|
|
8809
|
-
return (React
|
|
8809
|
+
return (React.createElement(Button, { name: "week-number", "aria-label": label, className: classNames.weeknumber, style: styles.weeknumber, onClick: handleClick }, content));
|
|
8810
8810
|
}
|
|
8811
8811
|
|
|
8812
8812
|
/** Render a row in the calendar, with the days and the week number. */
|
|
@@ -8817,13 +8817,13 @@
|
|
|
8817
8817
|
var WeeknumberComponent = (_b = components === null || components === void 0 ? void 0 : components.WeekNumber) !== null && _b !== void 0 ? _b : WeekNumber;
|
|
8818
8818
|
var weekNumberCell;
|
|
8819
8819
|
if (showWeekNumber) {
|
|
8820
|
-
weekNumberCell = (React
|
|
8821
|
-
React
|
|
8820
|
+
weekNumberCell = (React.createElement("td", { className: classNames.cell, style: styles.cell },
|
|
8821
|
+
React.createElement(WeeknumberComponent, { number: props.weekNumber, dates: props.dates })));
|
|
8822
8822
|
}
|
|
8823
|
-
return (React
|
|
8823
|
+
return (React.createElement("tr", { className: classNames.row, style: styles.row },
|
|
8824
8824
|
weekNumberCell,
|
|
8825
|
-
props.dates.map(function (date) { return (React
|
|
8826
|
-
React
|
|
8825
|
+
props.dates.map(function (date) { return (React.createElement("td", { className: classNames.cell, style: styles.cell, key: getUnixTime(date), role: "presentation" },
|
|
8826
|
+
React.createElement(DayComponent, { displayMonth: props.displayMonth, date: date }))); })));
|
|
8827
8827
|
}
|
|
8828
8828
|
|
|
8829
8829
|
/** Return the weeks between two dates. */
|
|
@@ -8891,10 +8891,10 @@
|
|
|
8891
8891
|
var HeadComponent = (_a = components === null || components === void 0 ? void 0 : components.Head) !== null && _a !== void 0 ? _a : Head;
|
|
8892
8892
|
var RowComponent = (_b = components === null || components === void 0 ? void 0 : components.Row) !== null && _b !== void 0 ? _b : Row;
|
|
8893
8893
|
var FooterComponent = (_c = components === null || components === void 0 ? void 0 : components.Footer) !== null && _c !== void 0 ? _c : Footer$1;
|
|
8894
|
-
return (React
|
|
8895
|
-
!hideHead && React
|
|
8896
|
-
React
|
|
8897
|
-
React
|
|
8894
|
+
return (React.createElement("table", { id: props.id, className: classNames.table, style: styles.table, role: "grid", "aria-labelledby": props['aria-labelledby'] },
|
|
8895
|
+
!hideHead && React.createElement(HeadComponent, null),
|
|
8896
|
+
React.createElement("tbody", { className: classNames.tbody, style: styles.tbody, role: "rowgroup" }, weeks.map(function (week) { return (React.createElement(RowComponent, { displayMonth: props.displayMonth, key: week.weekNumber, dates: week.dates, weekNumber: week.weekNumber })); })),
|
|
8897
|
+
React.createElement(FooterComponent, { displayMonth: props.displayMonth })));
|
|
8898
8898
|
}
|
|
8899
8899
|
|
|
8900
8900
|
/*
|
|
@@ -9006,9 +9006,9 @@
|
|
|
9006
9006
|
style = __assign(__assign({}, style), styles.caption_between);
|
|
9007
9007
|
}
|
|
9008
9008
|
var CaptionComponent = (_b = components === null || components === void 0 ? void 0 : components.Caption) !== null && _b !== void 0 ? _b : Caption;
|
|
9009
|
-
return (React
|
|
9010
|
-
React
|
|
9011
|
-
React
|
|
9009
|
+
return (React.createElement("div", { key: props.displayIndex, className: className.join(' '), style: style },
|
|
9010
|
+
React.createElement(CaptionComponent, { id: captionId, displayMonth: props.displayMonth }),
|
|
9011
|
+
React.createElement(Table, { id: tableId, "aria-labelledby": captionId, displayMonth: props.displayMonth })));
|
|
9012
9012
|
}
|
|
9013
9013
|
|
|
9014
9014
|
/** Render the container with the months according to the number of months to display. */
|
|
@@ -9017,9 +9017,9 @@
|
|
|
9017
9017
|
var dayPicker = useDayPicker();
|
|
9018
9018
|
var focusContext = useFocusContext();
|
|
9019
9019
|
var navigation = useNavigation();
|
|
9020
|
-
var _b = React
|
|
9020
|
+
var _b = React.useState(false), hasInitialFocus = _b[0], setHasInitialFocus = _b[1];
|
|
9021
9021
|
// Focus the focus target when initialFocus is passed in
|
|
9022
|
-
React
|
|
9022
|
+
React.useEffect(function () {
|
|
9023
9023
|
if (!dayPicker.initialFocus)
|
|
9024
9024
|
return;
|
|
9025
9025
|
if (!focusContext.focusTarget)
|
|
@@ -9050,20 +9050,20 @@
|
|
|
9050
9050
|
var _a;
|
|
9051
9051
|
return __assign(__assign({}, attrs), (_a = {}, _a[key] = initialProps[key], _a));
|
|
9052
9052
|
}, {});
|
|
9053
|
-
return (React
|
|
9054
|
-
React
|
|
9053
|
+
return (React.createElement("div", __assign({ className: classNames.join(' '), style: style, dir: dayPicker.dir, id: dayPicker.id }, dataAttributes),
|
|
9054
|
+
React.createElement("div", { className: dayPicker.classNames.months, style: dayPicker.styles.months }, navigation.displayMonths.map(function (month, i) { return (React.createElement(Month, { key: i, displayIndex: i, displayMonth: month })); }))));
|
|
9055
9055
|
}
|
|
9056
9056
|
|
|
9057
9057
|
/** Provide the value for all the context providers. */
|
|
9058
9058
|
function RootProvider(props) {
|
|
9059
9059
|
var children = props.children, initialProps = __rest(props, ["children"]);
|
|
9060
|
-
return (React
|
|
9061
|
-
React
|
|
9062
|
-
React
|
|
9063
|
-
React
|
|
9064
|
-
React
|
|
9065
|
-
React
|
|
9066
|
-
React
|
|
9060
|
+
return (React.createElement(DayPickerProvider, { initialProps: initialProps },
|
|
9061
|
+
React.createElement(NavigationProvider, null,
|
|
9062
|
+
React.createElement(SelectSingleProvider, { initialProps: initialProps },
|
|
9063
|
+
React.createElement(SelectMultipleProvider, { initialProps: initialProps },
|
|
9064
|
+
React.createElement(SelectRangeProvider, { initialProps: initialProps },
|
|
9065
|
+
React.createElement(ModifiersProvider, null,
|
|
9066
|
+
React.createElement(FocusProvider, null, children))))))));
|
|
9067
9067
|
}
|
|
9068
9068
|
|
|
9069
9069
|
/**
|
|
@@ -9154,8 +9154,8 @@
|
|
|
9154
9154
|
* ```
|
|
9155
9155
|
*/
|
|
9156
9156
|
function DayPicker(props) {
|
|
9157
|
-
return (React
|
|
9158
|
-
React
|
|
9157
|
+
return (React.createElement(RootProvider, __assign({}, props),
|
|
9158
|
+
React.createElement(Root, { initialProps: props })));
|
|
9159
9159
|
}
|
|
9160
9160
|
|
|
9161
9161
|
var reactResponsive$1 = {exports: {}};
|
|
@@ -9169,7 +9169,7 @@
|
|
|
9169
9169
|
hasRequiredReactResponsive = 1;
|
|
9170
9170
|
(function (module, exports) {
|
|
9171
9171
|
(function webpackUniversalModuleDefinition(root, factory) {
|
|
9172
|
-
module.exports = factory(React
|
|
9172
|
+
module.exports = factory(React);
|
|
9173
9173
|
})(reactResponsive, (__WEBPACK_EXTERNAL_MODULE_react__) => {
|
|
9174
9174
|
return /******/ (() => { // webpackBootstrap
|
|
9175
9175
|
/******/ var __webpack_modules__ = ({
|
|
@@ -10998,19 +10998,19 @@
|
|
|
10998
10998
|
var fill = _a.fill, size = _a.size, icon = _a.icon;
|
|
10999
10999
|
switch (icon) {
|
|
11000
11000
|
case 'spinner':
|
|
11001
|
-
return (React
|
|
11002
|
-
React
|
|
11003
|
-
React
|
|
11004
|
-
React
|
|
11001
|
+
return (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "".concat(size || 25), height: "".concat(size || 25), viewBox: "0 0 24 24" },
|
|
11002
|
+
React.createElement("style", null, "\n .spinner_z9k8 {\n transform-origin: center;\n animation: spinner_StKS .75s infinite linear;\n }\n @keyframes spinner_StKS {\n 100% {\n transform: rotate(360deg);\n }\n }\n "),
|
|
11003
|
+
React.createElement("path", { d: "M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,19a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z", opacity: ".25", fill: fill }),
|
|
11004
|
+
React.createElement("path", { d: "M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z", className: "spinner_z9k8", fill: fill })));
|
|
11005
11005
|
case 'warning':
|
|
11006
|
-
return (React
|
|
11006
|
+
return (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "".concat(size || 25), height: "".concat(size || 25), className: "svg-icon", style: {
|
|
11007
11007
|
verticalAlign: 'middle',
|
|
11008
11008
|
fill: fill,
|
|
11009
11009
|
overflow: 'hidden',
|
|
11010
11010
|
minWidth: '25px',
|
|
11011
11011
|
minHeight: '25px',
|
|
11012
11012
|
}, viewBox: "0 0 1024 1024", version: "1.1" },
|
|
11013
|
-
React
|
|
11013
|
+
React.createElement("path", { d: "M42.666667 896h938.666666L512 85.333333 42.666667 896z m512-128h-85.333334v-85.333333h85.333334v85.333333z m0-170.666667h-85.333334v-170.666666h85.333334v170.666666z" })));
|
|
11014
11014
|
default:
|
|
11015
11015
|
return null;
|
|
11016
11016
|
}
|
|
@@ -11336,7 +11336,7 @@
|
|
|
11336
11336
|
calendarRangeTo &&
|
|
11337
11337
|
areIntervalsOverlapping({ start: calendarRangeFrom, end: calendarRangeTo }, { start: rangeFrom, end: rangeTo }));
|
|
11338
11338
|
});
|
|
11339
|
-
React
|
|
11339
|
+
React.useEffect(function () {
|
|
11340
11340
|
if ((rangeContext &&
|
|
11341
11341
|
calendarRangeFrom &&
|
|
11342
11342
|
!startIsEqualOrBeforeRangeContextEnd) ||
|
|
@@ -11351,7 +11351,7 @@
|
|
|
11351
11351
|
|
|
11352
11352
|
var useCalendarTooltips = function (_a) {
|
|
11353
11353
|
var showFeedback = _a.showFeedback;
|
|
11354
|
-
return React
|
|
11354
|
+
return React.useEffect(function () {
|
|
11355
11355
|
if (typeof document === 'undefined' || !showFeedback)
|
|
11356
11356
|
return;
|
|
11357
11357
|
// Children
|
|
@@ -11428,7 +11428,7 @@
|
|
|
11428
11428
|
|
|
11429
11429
|
var useCalendarLoadingSpinner = function (_a) {
|
|
11430
11430
|
var loadingData = _a.loadingData;
|
|
11431
|
-
return React
|
|
11431
|
+
return React.useEffect(function () {
|
|
11432
11432
|
if (typeof document === 'undefined')
|
|
11433
11433
|
return;
|
|
11434
11434
|
var loadingSpinner = document.querySelector('.will-filter-bar-calendar .rdp-months .will-calendar-spinner');
|
|
@@ -11445,9 +11445,9 @@
|
|
|
11445
11445
|
|
|
11446
11446
|
var useUpdateDisabledDates = function (_a) {
|
|
11447
11447
|
var disableCalendarDates = _a.disableCalendarDates, calendarRange = _a.calendarRange, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, updateCalendarDefaultMonth = _a.updateCalendarDefaultMonth;
|
|
11448
|
-
var _b = __read(React
|
|
11449
|
-
var _c = __read(React
|
|
11450
|
-
var newDisableCalendarDates = React
|
|
11448
|
+
var _b = __read(React.useState(undefined), 2), overlappingDate = _b[0], setOverlappingDate = _b[1];
|
|
11449
|
+
var _c = __read(React.useState([]), 2), lastPossibleCheckout = _c[0], setLatsPossibleCheckout = _c[1];
|
|
11450
|
+
var newDisableCalendarDates = React.useMemo(function () {
|
|
11451
11451
|
var _a;
|
|
11452
11452
|
if (disableCalendarDates === null || disableCalendarDates === void 0 ? void 0 : disableCalendarDates.availableDates) {
|
|
11453
11453
|
var dateFormat_1 = 'dd-MM-yyyy';
|
|
@@ -11504,7 +11504,7 @@
|
|
|
11504
11504
|
var css_248z$b = ".will-calendar-filter-container {\n display: flex;\n justify-content: center;\n user-select: none;\n}\n\n/* Calendar overrides */\n.will-calendar-filter-container .rdp {\n margin: 0;\n}\n\n.will-calendar-filter-container .DayPicker {\n font-size: 25px;\n}\n\n.will-calendar-filter-container .rdp-month {\n position: relative;\n}\n\n.will-calendar-filter-container .rdp-month.rdp-caption_start {\n padding-left: 70px;\n}\n\n.will-calendar-filter-container .rdp-month.rdp-caption_end {\n padding-right: 70px;\n}\n\n.will-calendar-filter-container .rdp-month .rdp-nav {\n border: 1px solid var(--will-primary);\n border-radius: 50%;\n}\n\n.will-calendar-filter-container .rdp-month .rdp-nav svg {\n color: var(--will-primary);\n}\n\n.will-calendar-filter-container .rdp-month .rdp-caption {\n position: initial;\n}\n\n.will-calendar-filter-container .rdp-month .rdp-caption > .rdp-caption_label,\n.will-calendar-filter-container .rdp-table .rdp-head {\n opacity: 0.6;\n}\n\n.will-calendar-filter-container .rdp-table {\n border-collapse: separate;\n border-spacing: 0px 2px;\n}\n\n.will-calendar-filter-container\n .rdp-button_reset.rdp-button.rdp-day.rdp-day_selected {\n background-color: var(--will-primary);\n opacity: 1;\n color: var(--will-white);\n}\n\n.will-calendar-filter-container .my-today:not(.rdp-day_selected) {\n font-weight: 700;\n opacity: 1;\n color: var(--will-primary);\n}\n\n.will-calendar-filter-container .rdp-cell {\n position: relative;\n}\n\n.will-calendar-filter-container .rdp-cell button {\n font-weight: 500;\n}\n\n.will-calendar-filter-container .rdp-cell button.booked {\n font-weight: 400;\n cursor: not-allowed;\n}\n\n.will-calendar-filter-container .rdp-cell .rdp-button[disabled] {\n color: var(--will-transparent-black);\n opacity: 1;\n}\n\n@media (max-width: 960px) {\n .will-calendar-filter-container .rdp-month .rdp-nav {\n border: none;\n border-radius: initial;\n }\n\n .will-calendar-filter-container .rdp-month.rdp-caption_start {\n padding-left: 10px;\n }\n\n .will-calendar-filter-container .rdp-month.rdp-caption_end {\n padding-right: 10px;\n }\n}\n\n/* Tooltips */\n.will-root .will-calendar-filter-container .will-calendar-tooltip,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-overlapping-date,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-out-only,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-in-only {\n position: absolute;\n top: -42px;\n transform: translateX(calc(-50% + 20px));\n display: none;\n white-space: nowrap;\n z-index: 2;\n}\n\n.will-root .will-calendar-filter-container .will-calendar-tooltip > div,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-out\n > div,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-overlapping-date\n > div,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-out-only\n > div,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-in-only\n > div {\n background-color: white;\n position: relative;\n padding: 5px 10px;\n border: 1px solid var(--will-primary);\n border-radius: 5px;\n}\n\n.will-root .will-calendar-filter-container .will-calendar-tooltip::before,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-out::before,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-overlapping-date::before,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-out-only::before,\n.will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-in-only::before {\n content: '';\n width: 10px;\n height: 10px;\n border: 1px solid var(--will-primary);\n position: absolute;\n bottom: -4px;\n left: calc(50% - 5.555px);\n rotate: 45deg;\n z-index: 0;\n background-color: var(--will-white);\n}\n\n.will-root\n .will-calendar-filter-container\n .rdp-cell:hover\n .will-calendar-tooltip,\n.will-root\n .will-calendar-filter-container\n .rdp-cell:hover\n .will-calendar-tooltip-check-out,\n.will-root\n .will-calendar-filter-container\n .rdp-cell:hover\n .will-calendar-tooltip-overlapping-date,\n.will-root\n .will-calendar-filter-container\n .rdp-cell:hover\n .will-calendar-tooltip-check-out-only,\n.will-root\n .will-calendar-filter-container\n .rdp-cell:hover\n .will-calendar-tooltip-check-in-only {\n display: block;\n}\n\n/* Loading spinner */\n\n.will-root .will-calendar-filter-container .rdp-months {\n position: relative;\n}\n\n.will-root .will-calendar-filter-container .will-calendar-spinner {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n background-color: var(--will-white-transparent);\n z-index: 3;\n display: none;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n}\n\n/* No active selection */\n\n.will-root .will-calendar-filter-container .no-active-selection-start,\n.will-root .will-calendar-filter-container .no-active-selection-mid,\n.will-root .will-calendar-filter-container .no-active-selection-end {\n position: initial;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-start::before,\n.will-root .will-calendar-filter-container .no-active-selection-mid::before,\n.will-root .will-calendar-filter-container .no-active-selection-end::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border: 2px solid var(--will-light-grey);\n box-sizing: border-box;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-start::before {\n border-right: none;\n border-top-left-radius: 50%;\n border-bottom-left-radius: 50%;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-mid::before {\n border-right: none;\n border-left: none;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-end::before {\n border-left: none;\n border-top-right-radius: 50%;\n border-bottom-right-radius: 50%;\n}\n\n.will-root\n .will-calendar-filter-container\n .rdp-day_selected.rdp-day_range_middle.checkout-option {\n background-color: var(--will-primary-lightest);\n color: inherit;\n}\n\n/* Overlapping date */\n\n.will-root .will-calendar-filter-container .overlapping-date {\n user-select: none;\n pointer-events: none;\n}\n\n.will-root .will-calendar-filter-container .overlapping-date:hover {\n cursor: not-allowed;\n}\n\n@media (max-width: 600px) {\n /* Tooltips */\n .will-root .will-calendar-filter-container .will-calendar-tooltip,\n .will-root .will-calendar-filter-container .will-calendar-tooltip-check-out,\n .will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-overlapping-date,\n .will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-out-only,\n .will-root\n .will-calendar-filter-container\n .will-calendar-tooltip-check-in-only {\n top: -70px;\n white-space: wrap;\n max-width: 120px;\n }\n}\n";
|
|
11505
11505
|
styleInject(css_248z$b);
|
|
11506
11506
|
|
|
11507
|
-
var Calendar = React
|
|
11507
|
+
var Calendar = React.forwardRef(function (_a, ref) {
|
|
11508
11508
|
var _b;
|
|
11509
11509
|
var selectedPath = _a.selectedPath, calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, language = _a.language, disableCalendarDates = _a.disableCalendarDates, requestDates = _a.requestDates, disabledDates = _a.disabledDates, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation = _a.setUpdateCalendarMonthNavigation, updateCalendarDefaultMonth = _a.updateCalendarDefaultMonth, loadingData = _a.loadingData, showFeedback = _a.showFeedback, palette = _a.palette, setCalendarHasError = _a.setCalendarHasError, setUpdatedForSubmit = _a.setUpdatedForSubmit, rangeContext = _a.rangeContext, calendarHasError = _a.calendarHasError, autoFocus = _a.autoFocus;
|
|
11510
11510
|
// Translations
|
|
@@ -11592,9 +11592,9 @@
|
|
|
11592
11592
|
: __spreadArray$1(__spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11593
11593
|
lastPossibleCheckout
|
|
11594
11594
|
], __read(base), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false), __read(disabledInsideSelectableRange()), false);
|
|
11595
|
-
return (React
|
|
11596
|
-
React
|
|
11597
|
-
React
|
|
11595
|
+
return (React.createElement("div", { className: "will-filter-bar-calendar", ref: ref },
|
|
11596
|
+
React.createElement("div", { className: "will-calendar-filter-container", ref: calendarContainerRef },
|
|
11597
|
+
React.createElement(DayPicker, { key: updateCalendarDefaultMonth, id: "will-calendar", mode: "range", locale: language === 'en' ? enUS : fi, numberOfMonths: !isTablet ? 2 : 1, weekStartsOn: 1, selected: calendarRange, onSelect: function (range) { return handleOnSelect(range); }, captionLayout: "dropdown-buttons", defaultMonth: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) ||
|
|
11598
11598
|
selectedStartDate ||
|
|
11599
11599
|
rangeContextStartDate ||
|
|
11600
11600
|
(((_b = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _b === void 0 ? void 0 : _b.length)
|
|
@@ -11627,18 +11627,18 @@
|
|
|
11627
11627
|
findLastPossibleRangeContextCheckOut: findLastPossibleRangeContextCheckOut,
|
|
11628
11628
|
currentSelectionLastCheckoutDate: currentSelectionAvailability,
|
|
11629
11629
|
}) }),
|
|
11630
|
-
React
|
|
11631
|
-
React
|
|
11632
|
-
React
|
|
11633
|
-
React
|
|
11634
|
-
React
|
|
11635
|
-
React
|
|
11636
|
-
React
|
|
11637
|
-
React
|
|
11638
|
-
React
|
|
11639
|
-
React
|
|
11640
|
-
React
|
|
11641
|
-
React
|
|
11630
|
+
React.createElement("div", { className: 'will-calendar-tooltip' },
|
|
11631
|
+
React.createElement("div", null, t('noCheckIn'))),
|
|
11632
|
+
React.createElement("div", { className: 'will-calendar-tooltip-check-out' },
|
|
11633
|
+
React.createElement("div", null, t('noCheckOut'))),
|
|
11634
|
+
React.createElement("div", { className: 'will-calendar-tooltip-overlapping-date' },
|
|
11635
|
+
React.createElement("div", null, t('checkOutOnly'))),
|
|
11636
|
+
React.createElement("div", { className: 'will-calendar-tooltip-check-in-only' },
|
|
11637
|
+
React.createElement("div", null, t('checkInOnly'))),
|
|
11638
|
+
React.createElement("div", { className: 'will-calendar-tooltip-check-out-only' },
|
|
11639
|
+
React.createElement("div", null, t('checkOutOnly'))),
|
|
11640
|
+
React.createElement("div", { className: 'will-calendar-spinner' },
|
|
11641
|
+
React.createElement(IconsSvg, { fill: (palette === null || palette === void 0 ? void 0 : palette.primary) || 'inherit', size: 50, icon: "spinner" })))));
|
|
11642
11642
|
});
|
|
11643
11643
|
|
|
11644
11644
|
var parseGuests = function (_a) {
|
|
@@ -11713,14 +11713,14 @@
|
|
|
11713
11713
|
|
|
11714
11714
|
var useFilterBar = function (_a) {
|
|
11715
11715
|
var redirectUrl = _a.redirectUrl, ageCategories = _a.ageCategories, onSubmit = _a.onSubmit, tabs = _a.tabs, locations = _a.locations;
|
|
11716
|
-
var _b = __read(React
|
|
11717
|
-
var _c = __read(React
|
|
11718
|
-
var _d = __read(React
|
|
11719
|
-
var _e = __read(React
|
|
11720
|
-
var _f = __read(React
|
|
11721
|
-
var _g = __read(React
|
|
11722
|
-
var _h = __read(React
|
|
11723
|
-
React
|
|
11716
|
+
var _b = __read(React.useState(Pages.EVENTS), 2), selectedPath = _b[0], setSelectedPath = _b[1];
|
|
11717
|
+
var _c = __read(React.useState(false), 2), selectedFilter = _c[0], setSelectedFilter = _c[1];
|
|
11718
|
+
var _d = __read(React.useState(), 2), calendarRange = _d[0], setCalendarRange = _d[1];
|
|
11719
|
+
var _e = __read(React.useState(false), 2), innerLoading = _e[0], setInnerLoading = _e[1];
|
|
11720
|
+
var _f = __read(React.useState(0), 2), categories = _f[0], setCategories = _f[1];
|
|
11721
|
+
var _g = __read(React.useState({}), 2), ageCategoryCounts = _g[0], setAgeCategoryCounts = _g[1];
|
|
11722
|
+
var _h = __read(React.useState([]), 2), selectedLocations = _h[0], setSelectedLocations = _h[1];
|
|
11723
|
+
React.useEffect(function () {
|
|
11724
11724
|
var _a;
|
|
11725
11725
|
var urlSearchParams = new URLSearchParams(window.location.search);
|
|
11726
11726
|
var startDateParam = urlSearchParams.get('startDate');
|
|
@@ -11745,7 +11745,7 @@
|
|
|
11745
11745
|
setSelectedLocations(matchedLocations);
|
|
11746
11746
|
}
|
|
11747
11747
|
}, []);
|
|
11748
|
-
React
|
|
11748
|
+
React.useEffect(function () {
|
|
11749
11749
|
if (typeof window === 'undefined')
|
|
11750
11750
|
return;
|
|
11751
11751
|
var defaultTab = (tabs === null || tabs === void 0 ? void 0 : tabs.length) === 1 ? tabs[0] : tabs === null || tabs === void 0 ? void 0 : tabs.find(function (tab) { return tab.default; });
|
|
@@ -11878,9 +11878,9 @@
|
|
|
11878
11878
|
|
|
11879
11879
|
var useScrollInToView = function (_a) {
|
|
11880
11880
|
var selectedFilter = _a.selectedFilter;
|
|
11881
|
-
var _b = __read(React
|
|
11882
|
-
var targetFilterBarRef = React
|
|
11883
|
-
React
|
|
11881
|
+
var _b = __read(React.useState(true), 2), isMobile = _b[0], setIsMobile = _b[1];
|
|
11882
|
+
var targetFilterBarRef = React.useRef(null);
|
|
11883
|
+
React.useEffect(function () {
|
|
11884
11884
|
if (typeof window !== 'undefined' && window.innerWidth > 960) {
|
|
11885
11885
|
setIsMobile(false);
|
|
11886
11886
|
return;
|
|
@@ -11900,13 +11900,13 @@
|
|
|
11900
11900
|
var css_248z$a = ".will-filter-bar-select-button {\n width: 100%;\n height: auto;\n background-color: transparent;\n border: none;\n padding: 0 20px;\n border-radius: 20px;\n cursor: pointer;\n font-size: 14px;\n text-align: initial;\n}\n\n.will-filter-bar-select-button.disabled {\n cursor: not-allowed;\n}\n\n.will-filter-bar-select-button .select-button-wrapper {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 10px;\n}\n\n.will-filter-bar-select-button .select-button-wrapper > div {\n display: grid;\n}\n\n.will-filter-bar-select-button .select-button-label {\n color: var(--will-black);\n font-weight: 600;\n}\n\n.will-filter-bar-select-button .select-button-description {\n color: var(--will-black);\n font-weight: 400;\n opacity: 0.5;\n white-space: nowrap;\n min-height: 19px;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.will-filter-bar-select-button .select-button-description span {\n font: inherit;\n}\n\n.will-filter-bar-select-button .select-button-label.active,\n.will-filter-bar-select-button .select-button-description.active {\n font-weight: 700;\n font-size: 15px;\n opacity: 1;\n}\n\n@media (max-width: 960px) {\n .will-filter-bar-select-button {\n padding: 15px 0;\n }\n\n .will-filter-bar-select-button:first-child {\n padding: 0 0 15px 0;\n }\n\n .will-filter-bar-select-button .select-button-wrapper {\n justify-content: center;\n text-align: center;\n }\n\n .will-filter-bar-select-button .select-button-description {\n white-space: wrap;\n }\n\n .will-filter-bar-select-button .select-button-divider {\n display: none;\n }\n}\n";
|
|
11901
11901
|
styleInject(css_248z$a);
|
|
11902
11902
|
|
|
11903
|
-
var SelectButton = React
|
|
11903
|
+
var SelectButton = React.forwardRef(function (_a, ref) {
|
|
11904
11904
|
var active = _a.active, label = _a.label, onClick = _a.onClick, description = _a.description, disabled = _a.disabled, ariaExpanded = _a.ariaExpanded, ariaControls = _a.ariaControls;
|
|
11905
|
-
return (React
|
|
11906
|
-
React
|
|
11907
|
-
React
|
|
11908
|
-
React
|
|
11909
|
-
React
|
|
11905
|
+
return (React.createElement("button", { ref: ref, className: "will-filter-bar-select-button ".concat(disabled ? 'disabled' : ''), onClick: disabled ? undefined : onClick, disabled: disabled, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, "aria-haspopup": "true", "aria-disabled": disabled },
|
|
11906
|
+
React.createElement("span", { className: "select-button-wrapper" },
|
|
11907
|
+
React.createElement("div", null,
|
|
11908
|
+
React.createElement("p", { className: "select-button-label" }, label),
|
|
11909
|
+
React.createElement("p", { className: "select-button-description ".concat(active ? 'active' : ''), dangerouslySetInnerHTML: { __html: description } })))));
|
|
11910
11910
|
});
|
|
11911
11911
|
SelectButton.displayName = 'SelectButton';
|
|
11912
11912
|
|
|
@@ -11915,7 +11915,7 @@
|
|
|
11915
11915
|
|
|
11916
11916
|
var TabButton = function (_a) {
|
|
11917
11917
|
var onClick = _a.onClick, label = _a.label, active = _a.active, mode = _a.mode;
|
|
11918
|
-
return (React
|
|
11918
|
+
return (React.createElement("button", { className: "will-filter-bar-tab-button ".concat(mode || 'light', " ").concat(active && 'active', " "), onClick: onClick }, label));
|
|
11919
11919
|
};
|
|
11920
11920
|
|
|
11921
11921
|
var css_248z$8 = ".will-guests-filter-label,\n.will-guests-filter-count {\n font-size: 18px;\n color: var(--will-text);\n}\n\n.will-guests-filter-inner {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.will-guests-filter-label {\n display: block;\n font-weight: 600;\n margin-bottom: 10px;\n}\n\n.will-guests-filter-inner .will-guests-filter-counter {\n display: flex;\n align-items: center;\n}\n\n.will-guests-filter-count {\n margin: 0 10px;\n min-width: 30px;\n text-align: center;\n}\n\n.will-guests-filter-counter-button {\n border-radius: 50%;\n background-color: transparent;\n border: 1px solid var(--will-grey);\n width: 30px;\n height: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 20px;\n cursor: pointer;\n color: var(--will-black);\n\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n appearance: none;\n}\n\n.will-guests-filter-counter-button:hover {\n background-color: var(--will-onahau);\n}\n\n@media (max-width: 960px) {\n .will-guests-filter-inner {\n width: 100%;\n margin: 15px 0;\n justify-content: space-between;\n }\n}\n";
|
|
@@ -11923,7 +11923,7 @@
|
|
|
11923
11923
|
|
|
11924
11924
|
var GuestCount = function (_a) {
|
|
11925
11925
|
var label = _a.label, sortOrder = _a.sortOrder, id = _a.id, updateGuestsCount = _a.updateGuestsCount, count = _a.count, minVal = _a.minVal;
|
|
11926
|
-
React
|
|
11926
|
+
React.useEffect(function () {
|
|
11927
11927
|
if (minVal && minVal > count) {
|
|
11928
11928
|
updateGuestsCount("guests-".concat(id), minVal);
|
|
11929
11929
|
}
|
|
@@ -11936,20 +11936,20 @@
|
|
|
11936
11936
|
var handleIncrement = function () {
|
|
11937
11937
|
updateGuestsCount("guests-".concat(id), count + 1);
|
|
11938
11938
|
};
|
|
11939
|
-
return (React
|
|
11940
|
-
React
|
|
11941
|
-
React
|
|
11942
|
-
React
|
|
11939
|
+
return (React.createElement("div", { className: "will-guests-filter-inner", style: { order: "".concat(sortOrder) } },
|
|
11940
|
+
React.createElement("p", { className: "will-guests-filter-label" }, label),
|
|
11941
|
+
React.createElement("div", { className: "will-guests-filter-counter" },
|
|
11942
|
+
React.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleDecrement, disabled: (minVal && count <= minVal) || !count, style: {
|
|
11943
11943
|
cursor: (minVal && count <= minVal) || !count ? 'initial' : 'pointer',
|
|
11944
11944
|
paddingBottom: '4px',
|
|
11945
11945
|
opacity: (minVal && count <= minVal) || !count ? 0.4 : 1,
|
|
11946
11946
|
} },
|
|
11947
|
-
React
|
|
11948
|
-
React
|
|
11949
|
-
React
|
|
11950
|
-
React
|
|
11951
|
-
React
|
|
11952
|
-
React
|
|
11947
|
+
React.createElement("svg", { width: "10", height: "10", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
11948
|
+
React.createElement("path", { d: "M4 10H16", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }))),
|
|
11949
|
+
React.createElement("span", { className: "will-guests-filter-count" }, count),
|
|
11950
|
+
React.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleIncrement },
|
|
11951
|
+
React.createElement("svg", { width: "15", height: "15", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
11952
|
+
React.createElement("path", { d: "M10 4V16M4 10H16", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }))))));
|
|
11953
11953
|
};
|
|
11954
11954
|
|
|
11955
11955
|
var css_248z$7 = ".will-filter-section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n.will-filter-section-title {\n font-size: 22px;\n margin: 0;\n}\n\n.will-filter-section-action {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n\n.will-filter-section-action .will-filter-bar-close-button {\n position: relative;\n top: auto;\n right: auto;\n margin: 0;\n}\n\n@media (max-width: 960px) {\n .will-filter-section-title {\n font-size: 18px;\n }\n}\n";
|
|
@@ -11957,21 +11957,21 @@
|
|
|
11957
11957
|
|
|
11958
11958
|
var FilterSectionHeader = function (_a) {
|
|
11959
11959
|
var title = _a.title, action = _a.action;
|
|
11960
|
-
return (React
|
|
11961
|
-
React
|
|
11962
|
-
action && React
|
|
11960
|
+
return (React.createElement("div", { className: "will-filter-section-header" },
|
|
11961
|
+
React.createElement("h3", { className: "will-filter-section-title" }, title),
|
|
11962
|
+
action && React.createElement("div", { className: "will-filter-section-action" }, action)));
|
|
11963
11963
|
};
|
|
11964
11964
|
|
|
11965
11965
|
var css_248z$6 = ".will-filter-bar-guests {\n text-align: initial;\n}\n\n.will-guests-filter-container {\n display: flex;\n flex-direction: column;\n min-width: 400px;\n gap: 20px;\n margin-top: 20px;\n}\n\n@media (max-width: 960px) {\n .will-guests-filter-container {\n margin-top: 15px;\n min-width: 100%;\n }\n}\n";
|
|
11966
11966
|
styleInject(css_248z$6);
|
|
11967
11967
|
|
|
11968
|
-
var Guests = React
|
|
11968
|
+
var Guests = React.forwardRef(function (_a, ref) {
|
|
11969
11969
|
var ageCategories = _a.ageCategories, updateGuestsCount = _a.updateGuestsCount, ageCategoryCounts = _a.ageCategoryCounts, autoFocus = _a.autoFocus, onClose = _a.onClose;
|
|
11970
11970
|
var t = useTranslation('filterBar').t;
|
|
11971
11971
|
var containerRef = useAutoFocus(autoFocus);
|
|
11972
|
-
return (React
|
|
11973
|
-
React
|
|
11974
|
-
React
|
|
11972
|
+
return (React.createElement("div", { className: "will-filter-bar-guests", ref: ref },
|
|
11973
|
+
React.createElement(FilterSectionHeader, { title: t('guests.title'), action: onClose && React.createElement(CloseButton, { handleClose: onClose }) }),
|
|
11974
|
+
React.createElement("div", { className: "will-guests-filter-container", ref: containerRef }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React.createElement(GuestCount, { key: category.id, id: category.id, label: category.name, minVal: category.minVal, sortOrder: category.sortOrder, updateGuestsCount: updateGuestsCount, count: ageCategoryCounts["guests-".concat(category.id)] || 0 })); }))));
|
|
11975
11975
|
});
|
|
11976
11976
|
Guests.displayName = 'Guests';
|
|
11977
11977
|
|
|
@@ -11979,7 +11979,7 @@
|
|
|
11979
11979
|
styleInject(css_248z$5);
|
|
11980
11980
|
|
|
11981
11981
|
var Divider = function () {
|
|
11982
|
-
return React
|
|
11982
|
+
return React.createElement("div", { className: "will-filter-bar-divider" });
|
|
11983
11983
|
};
|
|
11984
11984
|
|
|
11985
11985
|
var css_248z$4 = ".will-filter-bar-categories {\n text-align: center;\n}\n\n.will-categories-filter-title {\n font-size: 16px;\n text-transform: uppercase;\n margin: 10px 0 30px 0;\n}\n\n.will-categories-filter-inner {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 20px;\n}\n\n.will-categories-filter-inner input {\n cursor: pointer;\n margin-right: 10px;\n}\n";
|
|
@@ -11994,16 +11994,16 @@
|
|
|
11994
11994
|
'Summer camp',
|
|
11995
11995
|
'Winter camp',
|
|
11996
11996
|
];
|
|
11997
|
-
var _b = __read(React
|
|
11997
|
+
var _b = __read(React.useState(''), 2), selectedCategory = _b[0], setSelectedCategory = _b[1];
|
|
11998
11998
|
var handleCategoryChange = function (selectedCategory) {
|
|
11999
11999
|
setSelectedCategory(selectedCategory);
|
|
12000
12000
|
setCategories(selectedCategory);
|
|
12001
12001
|
};
|
|
12002
|
-
return (React
|
|
12003
|
-
React
|
|
12004
|
-
React
|
|
12005
|
-
React
|
|
12006
|
-
React
|
|
12002
|
+
return (React.createElement("div", { className: "will-filter-bar-categories" },
|
|
12003
|
+
React.createElement("h3", { className: "will-categories-filter-title" }, t('categories.label')),
|
|
12004
|
+
React.createElement("div", { className: "will-categories-filter-inner" }, categoriesPlaceholder.map(function (itm, idx) { return (React.createElement("div", { key: idx },
|
|
12005
|
+
React.createElement("input", { type: "radio", value: itm, checked: selectedCategory === itm, onChange: function () { return handleCategoryChange(itm); } }),
|
|
12006
|
+
React.createElement("span", null, itm))); }))));
|
|
12007
12007
|
};
|
|
12008
12008
|
|
|
12009
12009
|
var css_248z$3 = ".will-filter-bar-locations {\n text-align: initial;\n}\n\n.will-locations-filter-container {\n display: flex;\n gap: 10px;\n flex-direction: column;\n min-width: 400px;\n margin-top: 20px;\n}\n\n@media (max-width: 960px) {\n .will-locations-filter-container {\n margin-top: 15px;\n min-width: 100%;\n }\n}\n";
|
|
@@ -12012,27 +12012,27 @@
|
|
|
12012
12012
|
var css_248z$2 = ".will-image-card {\n display: flex;\n gap: 20px;\n justify-content: space-between;\n align-items: center;\n padding: 8px 16px;\n cursor: pointer;\n user-select: none;\n border-radius: 8px;\n min-height: 40px;\n}\n\n.will-image-card.is-selected {\n background-color: var(--will-transparent-lavender);\n}\n\n.will-image-card:hover {\n background-color: var(--will-transparent-lavender);\n}\n\n.will-image-card-image img {\n width: 120px;\n height: 68px;\n object-fit: cover;\n}\n";
|
|
12013
12013
|
styleInject(css_248z$2);
|
|
12014
12014
|
|
|
12015
|
-
var ImageCard = React
|
|
12015
|
+
var ImageCard = React.forwardRef(function (_a, ref) {
|
|
12016
12016
|
var title = _a.title, description = _a.description, imageUrl = _a.imageUrl, isSelected = _a.isSelected, onClick = _a.onClick;
|
|
12017
12017
|
var ariaLabel = "".concat(title).concat(description ? ", ".concat(description) : '');
|
|
12018
|
-
return (React
|
|
12018
|
+
return (React.createElement("div", { ref: ref, className: "will-image-card ".concat(isSelected ? 'is-selected' : ''), onClick: onClick, onKeyDown: function (e) {
|
|
12019
12019
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
12020
12020
|
e.preventDefault();
|
|
12021
12021
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
12022
12022
|
}
|
|
12023
12023
|
}, role: "button", tabIndex: 0, "aria-pressed": isSelected, "aria-label": ariaLabel },
|
|
12024
|
-
React
|
|
12025
|
-
React
|
|
12026
|
-
description && React
|
|
12027
|
-
React
|
|
12024
|
+
React.createElement("div", { className: "will-image-card-content" },
|
|
12025
|
+
React.createElement("h3", null, title),
|
|
12026
|
+
description && React.createElement("p", null, description)),
|
|
12027
|
+
React.createElement("div", { className: "will-image-card-image" }, imageUrl && React.createElement("img", { src: imageUrl, alt: title || 'Location image' }))));
|
|
12028
12028
|
});
|
|
12029
12029
|
ImageCard.displayName = 'ImageCard';
|
|
12030
12030
|
|
|
12031
|
-
var Locations = React
|
|
12031
|
+
var Locations = React.forwardRef(function (_a, ref) {
|
|
12032
12032
|
var locations = _a.locations, language = _a.language, selectedLocations = _a.selectedLocations, setSelectedLocations = _a.setSelectedLocations, autoFocus = _a.autoFocus, _b = _a.multiSelect, multiSelect = _b === void 0 ? false : _b, onClose = _a.onClose;
|
|
12033
12033
|
var t = useTranslation('filterBar').t;
|
|
12034
|
-
var firstCardRef = React
|
|
12035
|
-
React
|
|
12034
|
+
var firstCardRef = React.useRef(null);
|
|
12035
|
+
React.useEffect(function () {
|
|
12036
12036
|
if (autoFocus && firstCardRef.current) {
|
|
12037
12037
|
firstCardRef.current.focus();
|
|
12038
12038
|
}
|
|
@@ -12056,9 +12056,9 @@
|
|
|
12056
12056
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
12057
12057
|
}
|
|
12058
12058
|
};
|
|
12059
|
-
return (React
|
|
12060
|
-
React
|
|
12061
|
-
React
|
|
12059
|
+
return (React.createElement("div", { className: "will-filter-bar-locations", ref: ref },
|
|
12060
|
+
React.createElement(FilterSectionHeader, { title: t('locations.title'), action: onClose && React.createElement(CloseButton, { handleClose: onClose }) }),
|
|
12061
|
+
React.createElement("div", { className: "will-locations-filter-container" }, !!((locations === null || locations === void 0 ? void 0 : locations.length) && language) &&
|
|
12062
12062
|
locations
|
|
12063
12063
|
.filter(function (location) {
|
|
12064
12064
|
var label = getLocalizedContent({
|
|
@@ -12078,7 +12078,7 @@
|
|
|
12078
12078
|
locale: language,
|
|
12079
12079
|
})
|
|
12080
12080
|
: null;
|
|
12081
|
-
return (React
|
|
12081
|
+
return (React.createElement(ImageCard, { key: location.id, ref: index === 0 ? firstCardRef : null, title: label, description: description, imageUrl: location.imageUrl, isSelected: selectedLocations.some(function (loc) { return loc.id === location.id; }), onClick: function () { return handleLocationClick(location); } }));
|
|
12082
12082
|
}))));
|
|
12083
12083
|
});
|
|
12084
12084
|
Locations.displayName = 'Locations';
|
|
@@ -12086,7 +12086,7 @@
|
|
|
12086
12086
|
var css_248z$1 = ".will-root {\n z-index: 999;\n width: fit-content;\n min-width: 796px;\n max-height: 100vh;\n position: relative;\n}\n\n.will-root.is-full-width {\n width: 100%;\n min-width: auto;\n}\n\n.will-filter-bar {\n box-sizing: border-box;\n position: relative;\n}\n\n/* Tabs */\n\n.will-filter-bar-tabs {\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n z-index: 222;\n background: transparent;\n padding: 10px;\n gap: 10px;\n}\n\n/* Header */\n.will-filter-bar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n position: relative;\n z-index: 222;\n border-radius: 40px;\n background-color: var(--will-white);\n}\n\n@media (max-width: 960px) {\n .will-filter-bar-header {\n flex-direction: column;\n padding: 20px;\n border-radius: 25px;\n }\n}\n\n/* Container */\n\n.will-filter-bar-container {\n background-color: var(--will-white);\n min-height: 100px;\n padding: 20px;\n position: absolute;\n top: 125px;\n z-index: 111;\n border-radius: 25px;\n box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n .will-root {\n width: 100%;\n min-width: auto;\n max-height: 100vh;\n z-index: 3;\n }\n\n .will-filter-bar-container {\n margin-top: 10px;\n top: 0;\n padding: 45px 20px;\n position: relative;\n }\n}\n\n/* Common */\n\n.will-filter-bar-header.dark,\n.will-filter-bar-container.dark {\n box-shadow: var(--will-box-shadow-dark);\n}\n\n.will-filter-bar-header.light,\n.will-filter-bar-container.light {\n box-shadow: var(--will-box-shadow-light);\n}\n\n.will-guest-count {\n display: inline-block;\n min-width: 10px;\n}\n";
|
|
12087
12087
|
styleInject(css_248z$1);
|
|
12088
12088
|
|
|
12089
|
-
var Dates = React
|
|
12089
|
+
var Dates = React.forwardRef(function (_a, ref) {
|
|
12090
12090
|
var onClose = _a.onClose, autoFocus = _a.autoFocus, calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, disableCalendarDates = _a.disableCalendarDates, selectedPath = _a.selectedPath, language = _a.language, filtersRef = _a.filtersRef;
|
|
12091
12091
|
return (React.createElement("div", { className: "will-filter-bar-dates", ref: ref },
|
|
12092
12092
|
React.createElement(FilterSectionHeader, { title: '', action: onClose && React.createElement(CloseButton, { handleClose: onClose }) }),
|
|
@@ -12103,10 +12103,10 @@
|
|
|
12103
12103
|
useUpdateTranslations({ language: language });
|
|
12104
12104
|
var t = useTranslation('filterBar').t;
|
|
12105
12105
|
// Refs for SelectButtons
|
|
12106
|
-
var locationsButtonRef = React
|
|
12107
|
-
var datesButtonRef = React
|
|
12108
|
-
var guestsButtonRef = React
|
|
12109
|
-
var previouslyFocusedButtonRef = React
|
|
12106
|
+
var locationsButtonRef = React.useRef(null);
|
|
12107
|
+
var datesButtonRef = React.useRef(null);
|
|
12108
|
+
var guestsButtonRef = React.useRef(null);
|
|
12109
|
+
var previouslyFocusedButtonRef = React.useRef(null);
|
|
12110
12110
|
// Filters
|
|
12111
12111
|
var _f = useFilterBar({
|
|
12112
12112
|
redirectUrl: redirectUrl,
|
|
@@ -12120,7 +12120,7 @@
|
|
|
12120
12120
|
// Handle close filter section
|
|
12121
12121
|
var filtersRef = useCloseFilterSection({ handleSelectedFilter: handleSelectedFilter }).filtersRef;
|
|
12122
12122
|
// Store previously focused button and restore focus when closing
|
|
12123
|
-
React
|
|
12123
|
+
React.useEffect(function () {
|
|
12124
12124
|
if (!selectedFilter && previouslyFocusedButtonRef.current) {
|
|
12125
12125
|
previouslyFocusedButtonRef.current.focus();
|
|
12126
12126
|
previouslyFocusedButtonRef.current = null;
|
|
@@ -12143,24 +12143,24 @@
|
|
|
12143
12143
|
locationsPlaceholder: t('locations.placeholder'),
|
|
12144
12144
|
locationsSelectedLabel: t('locations.selected'),
|
|
12145
12145
|
});
|
|
12146
|
-
return (React
|
|
12147
|
-
tabs && tabs.length > 1 && (React
|
|
12146
|
+
return (React.createElement("div", { className: "will-root ".concat(fullWidth ? 'is-full-width' : ''), style: themePalette },
|
|
12147
|
+
tabs && tabs.length > 1 && (React.createElement("div", { className: "will-filter-bar-tabs", ref: targetFilterBarRef }, tabs
|
|
12148
12148
|
.sort(function (a, b) { return a.order - b.order; })
|
|
12149
|
-
.map(function (tab, idx) { return (React
|
|
12149
|
+
.map(function (tab, idx) { return (React.createElement(TabButton, { key: "tab-".concat(idx), label: tab.label && language
|
|
12150
12150
|
? tab.label[language]
|
|
12151
12151
|
: t("tabs.".concat(tab.path.substring(1))), onClick: function () {
|
|
12152
12152
|
setSelectedPath(tab.path);
|
|
12153
12153
|
handleResetFilters();
|
|
12154
12154
|
handleSelectedFilter(false);
|
|
12155
12155
|
}, active: selectedPath === tab.path, mode: mode })); }))),
|
|
12156
|
-
React
|
|
12157
|
-
!!((_b = locations === null || locations === void 0 ? void 0 : locations.data) === null || _b === void 0 ? void 0 : _b.length) && (React
|
|
12158
|
-
React
|
|
12156
|
+
React.createElement("div", { className: "will-filter-bar-header ".concat(mode || 'light'), ref: (tabs === null || tabs === void 0 ? void 0 : tabs.length) === 1 ? targetFilterBarRef : null },
|
|
12157
|
+
!!((_b = locations === null || locations === void 0 ? void 0 : locations.data) === null || _b === void 0 ? void 0 : _b.length) && (React.createElement(React.Fragment, null,
|
|
12158
|
+
React.createElement(SelectButton, { ref: locationsButtonRef, label: t('locations.label'), description: parsedLocations, onClick: function () {
|
|
12159
12159
|
previouslyFocusedButtonRef.current = locationsButtonRef.current;
|
|
12160
12160
|
handleSelectedFilter(FilterSections.LOCATIONS);
|
|
12161
12161
|
}, active: !!selectedLocations.length, disabled: locations === null || locations === void 0 ? void 0 : locations.disabled, ariaExpanded: selectedFilter === FilterSections.LOCATIONS, ariaControls: "will-locations-filter" }),
|
|
12162
|
-
React
|
|
12163
|
-
React
|
|
12162
|
+
React.createElement(Divider, null))),
|
|
12163
|
+
React.createElement(SelectButton, { ref: datesButtonRef, label: t('calendar.label'), description: parsedDates
|
|
12164
12164
|
? parsedDates
|
|
12165
12165
|
: selectedPath === Pages.ROOMS
|
|
12166
12166
|
? t('calendar.roomsLabelPlaceholder')
|
|
@@ -12168,22 +12168,22 @@
|
|
|
12168
12168
|
previouslyFocusedButtonRef.current = datesButtonRef.current;
|
|
12169
12169
|
handleSelectedFilter(FilterSections.CALENDAR);
|
|
12170
12170
|
}, active: !!parsedDates, ariaExpanded: selectedFilter === FilterSections.CALENDAR, ariaControls: "will-calendar-filter" }),
|
|
12171
|
-
selectedPath !== Pages.EVENTS && (React
|
|
12172
|
-
React
|
|
12173
|
-
React
|
|
12171
|
+
selectedPath !== Pages.EVENTS && (React.createElement(React.Fragment, null,
|
|
12172
|
+
React.createElement(Divider, null),
|
|
12173
|
+
React.createElement(SelectButton, { ref: guestsButtonRef, label: t('guests.label'), description: parsedGuests.content, onClick: function () {
|
|
12174
12174
|
previouslyFocusedButtonRef.current = guestsButtonRef.current;
|
|
12175
12175
|
handleSelectedFilter(FilterSections.GUESTS);
|
|
12176
12176
|
}, active: !!parsedGuests.data.total, ariaExpanded: selectedFilter === FilterSections.GUESTS, ariaControls: "will-guests-filter" }))),
|
|
12177
|
-
React
|
|
12178
|
-
selectedFilter && (React
|
|
12179
|
-
selectedFilter === FilterSections.CALENDAR && (React
|
|
12180
|
-
React
|
|
12181
|
-
selectedFilter === FilterSections.GUESTS && (React
|
|
12182
|
-
React
|
|
12183
|
-
selectedFilter === FilterSections.CATEGORIES && (React
|
|
12184
|
-
React
|
|
12185
|
-
selectedFilter === FilterSections.LOCATIONS && (React
|
|
12186
|
-
React
|
|
12177
|
+
React.createElement(SubmitButton, { onClick: handleSubmit, startIcon: React.createElement(FaSearch, null), label: t('common:search'), isLoading: innerLoading || outerLoading })),
|
|
12178
|
+
selectedFilter && (React.createElement("div", { className: "will-filter-bar-container ".concat(mode || 'light'), style: (!tabs || tabs.length < 2) && !isMobile ? { top: 66 } : {} },
|
|
12179
|
+
selectedFilter === FilterSections.CALENDAR && (React.createElement("div", { id: "will-dates-filter" },
|
|
12180
|
+
React.createElement(Dates, { autoFocus: true, ref: filtersRef, onClose: function () { return handleSelectedFilter(false); }, calendarRange: calendarRange, setCalendarRange: setCalendarRange, disableCalendarDates: disableCalendarDates, selectedPath: selectedPath, language: language, filtersRef: filtersRef }))),
|
|
12181
|
+
selectedFilter === FilterSections.GUESTS && (React.createElement("div", { id: "will-guests-filter" },
|
|
12182
|
+
React.createElement(Guests, { updateGuestsCount: updateGuestsCount, ageCategories: ageCategories, ageCategoryCounts: ageCategoryCounts, ref: filtersRef, autoFocus: true, onClose: function () { return handleSelectedFilter(false); } }))),
|
|
12183
|
+
selectedFilter === FilterSections.CATEGORIES && (React.createElement("div", { id: "will-categories-filter" },
|
|
12184
|
+
React.createElement(Categories, { categories: categories, setCategories: setCategories }))),
|
|
12185
|
+
selectedFilter === FilterSections.LOCATIONS && (React.createElement("div", { id: "will-locations-filter" },
|
|
12186
|
+
React.createElement(Locations, { autoFocus: true, ref: filtersRef, locations: locations === null || locations === void 0 ? void 0 : locations.data, language: language, selectedLocations: selectedLocations, setSelectedLocations: setSelectedLocations, multiSelect: locations === null || locations === void 0 ? void 0 : locations.multiSelect, onClose: function () { return handleSelectedFilter(false); } })))))));
|
|
12187
12187
|
}
|
|
12188
12188
|
////////////
|
|
12189
12189
|
var AGE_CATEGORIES_FALLBACK = [
|
|
@@ -12206,18 +12206,18 @@
|
|
|
12206
12206
|
var useFilterCalendar = function (_a) {
|
|
12207
12207
|
var onSubmit = _a.onSubmit, setToggleCalendar = _a.setToggleCalendar, noActiveSelection = _a.noActiveSelection, toggleCalendar = _a.toggleCalendar, outerRangeContext = _a.outerRangeContext, outerDisableCalendarDates = _a.outerDisableCalendarDates;
|
|
12208
12208
|
// State
|
|
12209
|
-
var _b = __read(React
|
|
12210
|
-
var _c = __read(React
|
|
12211
|
-
var _d = __read(React
|
|
12212
|
-
var _e = __read(React
|
|
12213
|
-
var _f = __read(React
|
|
12214
|
-
var _g = __read(React
|
|
12215
|
-
var _h = __read(React
|
|
12216
|
-
var _j = __read(React
|
|
12217
|
-
var _k = __read(React
|
|
12209
|
+
var _b = __read(React.useState(), 2), calendarRange = _b[0], setCalendarRange = _b[1];
|
|
12210
|
+
var _c = __read(React.useState(outerRangeContext), 2), rangeContext = _c[0], setRangeContext = _c[1];
|
|
12211
|
+
var _d = __read(React.useState(), 2), initialCalendarRange = _d[0], setInitialCalendarRange = _d[1];
|
|
12212
|
+
var _e = __read(React.useState([]), 2), disabledDates = _e[0], setDisabledDates = _e[1];
|
|
12213
|
+
var _f = __read(React.useState(false), 2), updateCalendarMonthNavigation = _f[0], setUpdateCalendarMonthNavigation = _f[1];
|
|
12214
|
+
var _g = __read(React.useState(0), 2), updateCalendarDefaultMonth = _g[0], setUpdateCalendarDefaultMonth = _g[1];
|
|
12215
|
+
var _h = __read(React.useState(false), 2), calendarHasError = _h[0], setCalendarHasError = _h[1];
|
|
12216
|
+
var _j = __read(React.useState(false), 2), updatedForSubmit = _j[0], setUpdatedForSubmit = _j[1];
|
|
12217
|
+
var _k = __read(React.useState(), 2), disableCalendarDates = _k[0], setDisableCalendarDates = _k[1];
|
|
12218
12218
|
// Lifecycle
|
|
12219
12219
|
// Handle update component with new data
|
|
12220
|
-
React
|
|
12220
|
+
React.useEffect(function () {
|
|
12221
12221
|
var _a;
|
|
12222
12222
|
if (outerDisableCalendarDates === null || outerDisableCalendarDates === void 0 ? void 0 : outerDisableCalendarDates.availableDates) {
|
|
12223
12223
|
setDisableCalendarDates({
|
|
@@ -12235,7 +12235,7 @@
|
|
|
12235
12235
|
}
|
|
12236
12236
|
}, [outerDisableCalendarDates]);
|
|
12237
12237
|
// Handle Range Context initial selections
|
|
12238
|
-
React
|
|
12238
|
+
React.useEffect(function () {
|
|
12239
12239
|
if (typeof window === 'undefined')
|
|
12240
12240
|
return;
|
|
12241
12241
|
var urlSearchParams = new URLSearchParams(window.location.search);
|
|
@@ -12265,7 +12265,7 @@
|
|
|
12265
12265
|
}
|
|
12266
12266
|
}, [toggleCalendar]);
|
|
12267
12267
|
// Handle submit dates
|
|
12268
|
-
React
|
|
12268
|
+
React.useEffect(function () {
|
|
12269
12269
|
var formatString = 'dd.MM.yyyy';
|
|
12270
12270
|
var initialRangeTo = (initialCalendarRange === null || initialCalendarRange === void 0 ? void 0 : initialCalendarRange.to)
|
|
12271
12271
|
? format(initialCalendarRange.to, formatString)
|
|
@@ -12324,36 +12324,36 @@
|
|
|
12324
12324
|
var nights = nightsCount({
|
|
12325
12325
|
calendarRange: calendarRange,
|
|
12326
12326
|
});
|
|
12327
|
-
return (React
|
|
12328
|
-
React
|
|
12329
|
-
calendarHasError ? (React
|
|
12327
|
+
return (React.createElement("div", { className: "will-calendar-footer-actions-wrapper" },
|
|
12328
|
+
React.createElement("div", { className: "will-calendar-footer-dates" },
|
|
12329
|
+
calendarHasError ? (React.createElement("div", { className: "will-calendar-footer-error" }, calendarHasError &&
|
|
12330
12330
|
renderCalendarErrorMessage({
|
|
12331
12331
|
palette: palette,
|
|
12332
12332
|
message: t("common:errors.calendarErrors.checkInAvailabilityError"),
|
|
12333
|
-
}))) : (React
|
|
12334
|
-
React
|
|
12333
|
+
}))) : (React.createElement("div", null,
|
|
12334
|
+
React.createElement("span", null, parseDate({
|
|
12335
12335
|
date: calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from,
|
|
12336
12336
|
dateFormat: 'EEEEEE d.M.yyyy',
|
|
12337
12337
|
language: language,
|
|
12338
12338
|
}) || t('common:checkIn')),
|
|
12339
|
-
React
|
|
12340
|
-
React
|
|
12339
|
+
React.createElement("span", { className: "will-calendar-footer-dates-separator" }, "-"),
|
|
12340
|
+
React.createElement("span", null, parseDate({
|
|
12341
12341
|
date: calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to,
|
|
12342
12342
|
dateFormat: 'EEEEEE d.M.yyyy',
|
|
12343
12343
|
language: language,
|
|
12344
12344
|
}) || t('common:checkOut')))),
|
|
12345
|
-
React
|
|
12345
|
+
React.createElement("span", { className: "will-calendar-footer-booked" }, !calendarHasError && nights
|
|
12346
12346
|
? "".concat(nights, " ").concat(t("common:".concat(nights === 1 ? 'night' : 'nights')))
|
|
12347
12347
|
: '')),
|
|
12348
|
-
React
|
|
12349
|
-
React
|
|
12348
|
+
React.createElement("div", { className: "will-calendar-footer-actions" },
|
|
12349
|
+
React.createElement(SubmitButton, { onClick: handleClearDates, disabled: !(calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from), label: t("common:clearDates"), variant: "text" }))));
|
|
12350
12350
|
};
|
|
12351
12351
|
/////////
|
|
12352
12352
|
var renderCalendarErrorMessage = function (_a) {
|
|
12353
12353
|
var message = _a.message, palette = _a.palette;
|
|
12354
|
-
return (React
|
|
12355
|
-
React
|
|
12356
|
-
React
|
|
12354
|
+
return (React.createElement(React.Fragment, null,
|
|
12355
|
+
React.createElement(IconsSvg, { fill: (palette === null || palette === void 0 ? void 0 : palette.error) || 'inherit', size: 25, icon: "warning" }),
|
|
12356
|
+
React.createElement("span", null, message || '')));
|
|
12357
12357
|
};
|
|
12358
12358
|
|
|
12359
12359
|
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\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 var(--will-grey);\n align-items: center;\n}\n\n/* Footer */\n\n.will-root .will-calendar-wrapper .will-calendar-footer {\n border-top: 1px solid var(--will-grey);\n}\n\n/* Footer actions */\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions-wrapper {\n display: flex;\n justify-content: space-between;\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-dates .will-calendar-footer-booked {\n display: flex;\n min-height: 20.5px;\n margin-top: 10px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-error {\n display: flex;\n max-width: 80%;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-error span {\n display: inline-block;\n margin-left: 10px;\n}\n\n@media (max-width: 960px) {\n .will-root .will-calendar-wrapper {\n width: -webkit-fill-available;\n margin: 0 -6%;\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 10px;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-actions-wrapper {\n flex-direction: column;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-dates {\n text-align: center;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-dates .will-calendar-footer-booked {\n justify-content: 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 margin-top: 10px;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-error {\n max-width: 100%;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-error span {\n text-align: center;\n margin-left: 5px;\n }\n }\n\n.will-root .will-calendar-wrapper .will-calendar-header .will-filter-bar-close-button {\n position: initial;\n}";
|
|
@@ -12379,14 +12379,14 @@
|
|
|
12379
12379
|
var filtersRef = useCloseFilterSection({
|
|
12380
12380
|
handleSelectedFilter: setToggleCalendar,
|
|
12381
12381
|
}).filtersRef;
|
|
12382
|
-
return (React
|
|
12383
|
-
React
|
|
12384
|
-
React
|
|
12385
|
-
React
|
|
12386
|
-
React
|
|
12387
|
-
React
|
|
12388
|
-
React
|
|
12389
|
-
React
|
|
12382
|
+
return (React.createElement("div", { className: "will-root", style: themePalette }, toggleCalendar && (React.createElement("div", { className: "will-calendar-wrapper", ref: filtersRef },
|
|
12383
|
+
React.createElement("div", { className: "will-calendar-header" },
|
|
12384
|
+
React.createElement("h2", null, t('filterBar:calendar.title')),
|
|
12385
|
+
React.createElement(CloseButton, { handleClose: function () { return setToggleCalendar(false); } })),
|
|
12386
|
+
React.createElement("div", { className: "will-calendar-main" },
|
|
12387
|
+
React.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, disableCalendarDates: disableCalendarDates, requestDates: requestDates, disabledDates: disabledDates, updateCalendarMonthNavigation: updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation: setUpdateCalendarMonthNavigation, updateCalendarDefaultMonth: updateCalendarDefaultMonth, loadingData: loadingData, showFeedback: showFeedback, noActiveSelection: noActiveSelection, palette: palette, setCalendarHasError: setCalendarHasError, setUpdatedForSubmit: setUpdatedForSubmit, rangeContext: rangeContext, calendarHasError: calendarHasError })),
|
|
12388
|
+
React.createElement("div", { className: "will-calendar-footer" },
|
|
12389
|
+
React.createElement(Footer, { calendarHasError: calendarHasError, calendarRange: calendarRange, handleClearDates: handleClearDates, language: language, palette: palette }))))));
|
|
12390
12390
|
}
|
|
12391
12391
|
|
|
12392
12392
|
exports.Button = Button$1;
|