ublo-lib 1.26.3 → 1.26.5
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/es/common/components/date-picker/calendar.js +120 -127
- package/es/common/components/date-picker/calendar.module.css +37 -34
- package/es/common/components/date-picker/data.js +15 -20
- package/es/common/components/date-picker/date-item.js +75 -66
- package/es/common/components/date-picker/date-item.module.css +39 -37
- package/es/common/components/date-picker/date-picker.js +21 -83
- package/es/common/components/date-picker/date-picker.module.css +2 -70
- package/es/common/components/date-picker/helper.js +35 -17
- package/es/common/components/date-picker/helper.module.css +57 -53
- package/es/common/components/date-picker/messages.js +18 -2
- package/es/common/components/date-picker/month.js +11 -16
- package/es/common/components/date-picker/month.module.css +11 -31
- package/es/common/components/date-picker/utils.js +8 -9
- package/es/common/components/msem-preset-editor/components/widget-list-item.js +0 -1
- package/es/common/components/msem-preset-editor/services/offers.js +17 -1
- package/es/common/components/msem-preset-editor/services/preset.js +4 -0
- package/es/common/hooks/use-window-sizes.js +5 -4
- package/package.json +1 -1
- package/es/common/components/date-picker/modes.js +0 -38
- package/es/common/components/date-picker/modes.module.css +0 -90
|
@@ -1,54 +1,34 @@
|
|
|
1
1
|
.month {
|
|
2
|
-
flex:
|
|
3
|
-
padding: 0 10px;
|
|
2
|
+
flex: 1 1 100%;
|
|
4
3
|
}
|
|
5
4
|
|
|
6
5
|
.title {
|
|
7
|
-
margin-bottom:
|
|
6
|
+
margin-bottom: 8px;
|
|
8
7
|
color: var(--ds-grey-600, #383838);
|
|
9
|
-
font-size:
|
|
8
|
+
font-size: 17px;
|
|
10
9
|
font-weight: 700;
|
|
11
|
-
text-transform: uppercase;
|
|
12
10
|
text-align: center;
|
|
13
11
|
}
|
|
14
12
|
|
|
15
13
|
.dates,
|
|
16
14
|
.days {
|
|
17
15
|
display: grid;
|
|
18
|
-
grid-template-columns: repeat(7, minmax(
|
|
19
|
-
gap: 3px;
|
|
16
|
+
grid-template-columns: repeat(7, minmax(39px, 1fr));
|
|
17
|
+
gap: 3px 0;
|
|
20
18
|
}
|
|
21
19
|
|
|
22
20
|
.days {
|
|
23
21
|
height: 34px;
|
|
24
22
|
align-items: center;
|
|
25
|
-
margin-bottom:
|
|
26
|
-
background-color: var(--ds-grey-100, #
|
|
27
|
-
border-radius: var(--ds-radius-
|
|
23
|
+
margin-bottom: 10px;
|
|
24
|
+
background-color: var(--ds-grey-100, #f8f8f8);
|
|
25
|
+
border-radius: var(--ds-radius-200, 8px);
|
|
28
26
|
}
|
|
29
27
|
|
|
30
28
|
.day {
|
|
31
|
-
color: var(--ds-grey-
|
|
32
|
-
font-size:
|
|
29
|
+
color: var(--ds-grey-500, #7c7b7b);
|
|
30
|
+
font-size: 12px;
|
|
33
31
|
text-align: center;
|
|
34
|
-
font-weight: 700;
|
|
35
|
-
text-transform: uppercase;
|
|
36
32
|
transition: color 160ms
|
|
37
|
-
var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2,
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
@media (min-width: 480px) {
|
|
41
|
-
.day {
|
|
42
|
-
font-size: 13px;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
@media (min-width: 1001px) {
|
|
47
|
-
.day {
|
|
48
|
-
font-size: 15px;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.dayActive {
|
|
53
|
-
color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
|
|
33
|
+
var(--ds-transition-easing, cubic-bezier(0.4, 0.1, 0.2, 0.9));
|
|
54
34
|
}
|
|
@@ -43,14 +43,6 @@ export const isSameDay = (date, basedate = new Date()) => {
|
|
|
43
43
|
const dateYear = date.getFullYear();
|
|
44
44
|
return basedateDate === dateDate && basedateMonth === dateMonth && basedateYear === dateYear;
|
|
45
45
|
};
|
|
46
|
-
export const isSaturday = date => {
|
|
47
|
-
const d = Array.isArray(date) ? date.join("-") : date;
|
|
48
|
-
return new Date(d).getDay() === 6;
|
|
49
|
-
};
|
|
50
|
-
export const isSunday = date => {
|
|
51
|
-
const d = Array.isArray(date) ? date.join("-") : date;
|
|
52
|
-
return new Date(d).getDay() === 0;
|
|
53
|
-
};
|
|
54
46
|
export const isPast = date => {
|
|
55
47
|
const d = Array.isArray(date) ? date.join("-") : date;
|
|
56
48
|
const _date = new Date(d);
|
|
@@ -116,4 +108,11 @@ export const getNextMonth = (month, year) => {
|
|
|
116
108
|
month: nextMonth,
|
|
117
109
|
year: nextMonthYear
|
|
118
110
|
};
|
|
119
|
-
};
|
|
111
|
+
};
|
|
112
|
+
export function getMatchingStays(stays, selectedDates) {
|
|
113
|
+
if (!stays?.length || !selectedDates.length) return;
|
|
114
|
+
const matchingStays = stays?.filter(s => {
|
|
115
|
+
return formatDate(s.start) === formatDate(selectedDates[0]);
|
|
116
|
+
});
|
|
117
|
+
return matchingStays;
|
|
118
|
+
}
|
|
@@ -58,8 +58,24 @@ function mergeSkiPasses(offer) {
|
|
|
58
58
|
items = [],
|
|
59
59
|
...rest
|
|
60
60
|
} = offer;
|
|
61
|
+
const uniqueItems = items.reduce((acc, item) => {
|
|
62
|
+
const {
|
|
63
|
+
name
|
|
64
|
+
} = item;
|
|
65
|
+
const isUnique = !acc.some(i => i.name === name);
|
|
66
|
+
if (isUnique) {
|
|
67
|
+
return [item, ...acc];
|
|
68
|
+
}
|
|
69
|
+
return acc;
|
|
70
|
+
}, []);
|
|
71
|
+
if (uniqueItems.length === 0) {
|
|
72
|
+
return {
|
|
73
|
+
...rest,
|
|
74
|
+
...uniqueItems[0]
|
|
75
|
+
};
|
|
76
|
+
}
|
|
61
77
|
return {
|
|
62
78
|
...rest,
|
|
63
|
-
|
|
79
|
+
items: uniqueItems
|
|
64
80
|
};
|
|
65
81
|
}
|
|
@@ -5,6 +5,10 @@ export function format(data) {
|
|
|
5
5
|
taxonomy,
|
|
6
6
|
slug
|
|
7
7
|
} = data;
|
|
8
|
+
const isLift = ["skiPass", "liftJb"].includes(widget);
|
|
9
|
+
if (isLift) {
|
|
10
|
+
return data;
|
|
11
|
+
}
|
|
8
12
|
const isOtherProductsOrSkiRental = ["otherProducts", "skiRental"].includes(widget);
|
|
9
13
|
const merchant = isOtherProductsOrSkiRental ? slug : code;
|
|
10
14
|
const merchantSlug = isOtherProductsOrSkiRental ? slug : undefined;
|
|
@@ -3,7 +3,7 @@ const DEFAULT_SIZES = {
|
|
|
3
3
|
width: undefined,
|
|
4
4
|
height: undefined
|
|
5
5
|
};
|
|
6
|
-
|
|
6
|
+
export default function useWindowSizes() {
|
|
7
7
|
const [windowSizes, setWindowSizes] = React.useState(DEFAULT_SIZES);
|
|
8
8
|
const resized = () => {
|
|
9
9
|
setWindowSizes({
|
|
@@ -21,12 +21,13 @@ const useWindowSizes = () => {
|
|
|
21
21
|
observer.unobserve(document.body);
|
|
22
22
|
};
|
|
23
23
|
} else {
|
|
24
|
-
window.addEventListener("resize", resized
|
|
24
|
+
window.addEventListener("resize", resized, {
|
|
25
|
+
passive: true
|
|
26
|
+
});
|
|
25
27
|
return () => {
|
|
26
28
|
window.removeEventListener("resize", resized);
|
|
27
29
|
};
|
|
28
30
|
}
|
|
29
31
|
}, []);
|
|
30
32
|
return windowSizes;
|
|
31
|
-
}
|
|
32
|
-
export default useWindowSizes;
|
|
33
|
+
}
|
package/package.json
CHANGED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import classNames from "classnames";
|
|
3
|
-
import { useUbloContext } from "ublo/with-ublo";
|
|
4
|
-
import * as Messages from "./messages";
|
|
5
|
-
import * as Icons from "dt-design-system/es/icons";
|
|
6
|
-
import styles from "./modes.module.css";
|
|
7
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
|
-
const modes = ["saturday", "sunday", "custom"];
|
|
10
|
-
const Modes = ({
|
|
11
|
-
currentMode,
|
|
12
|
-
setCurrentMode
|
|
13
|
-
}) => {
|
|
14
|
-
const {
|
|
15
|
-
lang
|
|
16
|
-
} = useUbloContext();
|
|
17
|
-
return _jsx("div", {
|
|
18
|
-
className: styles.modes,
|
|
19
|
-
children: modes.map(mode => {
|
|
20
|
-
const index = modes.indexOf(mode);
|
|
21
|
-
const classes = classNames(styles.mode, {
|
|
22
|
-
[styles.modeSelected]: currentMode === index
|
|
23
|
-
});
|
|
24
|
-
const clicked = () => setCurrentMode(index);
|
|
25
|
-
return _jsxs("button", {
|
|
26
|
-
className: classes,
|
|
27
|
-
onClick: clicked,
|
|
28
|
-
children: [_jsx(Icons.ChevronRight, {}), _jsxs("div", {
|
|
29
|
-
className: styles.inner,
|
|
30
|
-
children: [Messages.get(lang, "mode-book"), _jsx("span", {
|
|
31
|
-
children: Messages.get(lang, `mode-book-${mode}`)
|
|
32
|
-
})]
|
|
33
|
-
})]
|
|
34
|
-
}, mode);
|
|
35
|
-
})
|
|
36
|
-
});
|
|
37
|
-
};
|
|
38
|
-
export default Modes;
|
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
.modes {
|
|
2
|
-
display: none;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
@media (min-width: 650px) {
|
|
6
|
-
.modes {
|
|
7
|
-
position: relative;
|
|
8
|
-
grid-column: 1;
|
|
9
|
-
display: flex;
|
|
10
|
-
flex-direction: column;
|
|
11
|
-
gap: 8px;
|
|
12
|
-
padding: 8px;
|
|
13
|
-
border-radius: var(--ds-radius-100, 3px) 0 0 var(--ds-radius-100, 3px);
|
|
14
|
-
z-index: 1;
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.mode {
|
|
19
|
-
position: relative;
|
|
20
|
-
flex: 1 1 100%;
|
|
21
|
-
display: flex;
|
|
22
|
-
align-items: center;
|
|
23
|
-
text-align: left;
|
|
24
|
-
padding: 20px 35px 20px 25px;
|
|
25
|
-
color: var(--ds-grey-600, #383838);
|
|
26
|
-
font-size: 16px;
|
|
27
|
-
background-color: var(--ds-grey-100, #f5f5f5);
|
|
28
|
-
border-radius: var(--ds-radius-100, 3px);
|
|
29
|
-
cursor: pointer;
|
|
30
|
-
user-select: none;
|
|
31
|
-
transition: background-color 160ms
|
|
32
|
-
var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
@media (min-width: 810px) {
|
|
36
|
-
.mode:nth-child(3) {
|
|
37
|
-
border-bottom: 0;
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.mode:not(.modeSelected):hover {
|
|
42
|
-
background-color: var(--ds-grey-300, #efefef);
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
.modeSelected {
|
|
46
|
-
color: var(--ds-grey-000, #fff);
|
|
47
|
-
background-color: var(--ds-secondary, var(--ds-blue-400, #4177f6));
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.mode > svg {
|
|
51
|
-
position: absolute;
|
|
52
|
-
top: 50%;
|
|
53
|
-
left: 20px;
|
|
54
|
-
width: 20px;
|
|
55
|
-
height: 20px;
|
|
56
|
-
fill: var(--ds-grey-000, #fff);
|
|
57
|
-
transform: translate3d(-15px, -50%, 0) scale3d(0, 0, 0);
|
|
58
|
-
opacity: 0;
|
|
59
|
-
transition: transform 160ms
|
|
60
|
-
var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2, 1)),
|
|
61
|
-
opacity 160ms var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
.modeSelected > svg {
|
|
65
|
-
opacity: 1;
|
|
66
|
-
transform: translate3d(0, -50%, 0) scale3d(1, 1, 1);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.inner {
|
|
70
|
-
display: flex;
|
|
71
|
-
flex-direction: column;
|
|
72
|
-
justify-content: center;
|
|
73
|
-
transition: transform 160ms
|
|
74
|
-
var(--ds-transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
.modeSelected .inner {
|
|
78
|
-
transform: translate3d(20px, 0, 0);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.inner > span {
|
|
82
|
-
color: var(--ds-grey-600, #383838);
|
|
83
|
-
font-size: 19px;
|
|
84
|
-
white-space: nowrap;
|
|
85
|
-
font-weight: 700;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
.modeSelected .inner > span {
|
|
89
|
-
color: var(--ds-grey-000, #fff);
|
|
90
|
-
}
|