ublo-lib 1.48.5 → 1.48.7
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"infinite-carousel.d.ts","sourceRoot":"","sources":["../../../../src/common/components/infinite-carousel/infinite-carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,KAAK,eAAe,GAAG,OAAO,GAAG,OAAO,CAAC;AAEzC,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE;QACP,gBAAgB,CAAC,EAAE,OAAO,CAAC;QAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;KAC9B,CAAC;CACH,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAAS,EACT,QAAQ,EACR,OAAiB,EACjB,OAAY,EACZ,WAAW,GACZ,EAAE,KAAK,
|
|
1
|
+
{"version":3,"file":"infinite-carousel.d.ts","sourceRoot":"","sources":["../../../../src/common/components/infinite-carousel/infinite-carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,KAAK,eAAe,GAAG,OAAO,GAAG,OAAO,CAAC;AAEzC,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE;QACP,gBAAgB,CAAC,EAAE,OAAO,CAAC;QAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;KAC9B,CAAC;CACH,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAAS,EACT,QAAQ,EACR,OAAiB,EACjB,OAAY,EACZ,WAAW,GACZ,EAAE,KAAK,2CA2TP"}
|
|
@@ -12,6 +12,8 @@ export default function InfiniteCarousel({ className, children, variant = "wheel
|
|
|
12
12
|
const zoneRef = React.useRef(null);
|
|
13
13
|
const itemWidth = React.useRef(null);
|
|
14
14
|
const itemHeight = React.useRef(null);
|
|
15
|
+
const touchStartX = React.useRef(null);
|
|
16
|
+
const touchStartY = React.useRef(null);
|
|
15
17
|
const [items, setItems] = React.useState([]);
|
|
16
18
|
const [currentIndex, setCurrentIndex] = React.useState(0);
|
|
17
19
|
const [isTransitioning, setIsTransitioning] = React.useState(false);
|
|
@@ -82,6 +84,21 @@ export default function InfiniteCarousel({ className, children, variant = "wheel
|
|
|
82
84
|
}
|
|
83
85
|
return [...beforeClones, ...items, ...afterClones];
|
|
84
86
|
}, [items, cloneCount]);
|
|
87
|
+
const handleTouchStart = (e) => {
|
|
88
|
+
touchStartX.current = e.touches[0].clientX;
|
|
89
|
+
touchStartY.current = e.touches[0].clientY;
|
|
90
|
+
};
|
|
91
|
+
const handleTouchEnd = (e) => {
|
|
92
|
+
if (touchStartX.current === null || touchStartY.current === null)
|
|
93
|
+
return;
|
|
94
|
+
const deltaX = e.changedTouches[0].clientX - touchStartX.current;
|
|
95
|
+
const deltaY = e.changedTouches[0].clientY - touchStartY.current;
|
|
96
|
+
touchStartX.current = null;
|
|
97
|
+
touchStartY.current = null;
|
|
98
|
+
if (Math.abs(deltaX) < Math.abs(deltaY) || Math.abs(deltaX) < 30)
|
|
99
|
+
return;
|
|
100
|
+
slideTo(deltaX < 0 ? "next" : "prev");
|
|
101
|
+
};
|
|
85
102
|
const slideTo = (direction) => {
|
|
86
103
|
if (isTransitioning || items.length === 0)
|
|
87
104
|
return;
|
|
@@ -189,7 +206,7 @@ export default function InfiniteCarousel({ className, children, variant = "wheel
|
|
|
189
206
|
}), !isEditing && items.length >= 3 && (_jsx(_Fragment, { children: _jsxs("div", { className: classes, style: {
|
|
190
207
|
"--carousel-item-width": `${itemWidth.current}px`,
|
|
191
208
|
"--carousel-item-height": `${itemHeight.current}px`,
|
|
192
|
-
}, children: [_jsxs("div", { className: css.controls, children: [_jsx(Button, { className: css.control, variant: "link", onClick: () => slideTo("prev"), "data-control": "prev", children: _jsx(ChevronLeftIcon, { className: css.controlIcon }) }), _jsx(Button, { className: css.control, variant: "link", onClick: () => slideTo("next"), "data-control": "next", children: _jsx(ChevronRightIcon, { className: css.controlIcon }) })] }), _jsx("div", { className: css.viewport, children: _jsx("div", { className: css.track, children: infiniteItems.map((item, index) => {
|
|
209
|
+
}, children: [_jsxs("div", { className: css.controls, children: [_jsx(Button, { className: css.control, variant: "link", onClick: () => slideTo("prev"), "data-control": "prev", children: _jsx(ChevronLeftIcon, { className: css.controlIcon }) }), _jsx(Button, { className: css.control, variant: "link", onClick: () => slideTo("next"), "data-control": "next", children: _jsx(ChevronRightIcon, { className: css.controlIcon }) })] }), _jsx("div", { className: css.viewport, onTouchStart: handleTouchStart, onTouchEnd: handleTouchEnd, children: _jsx("div", { className: css.track, children: infiniteItems.map((item, index) => {
|
|
193
210
|
const current = index === currentIndex;
|
|
194
211
|
return (_jsx("div", { "data-current-item": current, className: css.item, style: getItemStyle(index), dangerouslySetInnerHTML: { __html: item.outerHTML } }, `item-${index}`));
|
|
195
212
|
}) }) })] }) })), _jsx(ScrollbarSize, {})] }));
|
|
@@ -59,5 +59,5 @@ function Week({ lang, week, beginWeek, endWeek, selected, select, forceSeasonSwi
|
|
|
59
59
|
select(week);
|
|
60
60
|
openExtendedPicker();
|
|
61
61
|
};
|
|
62
|
-
return (_jsxs("div", { ref: ref, className: weekClasses, children: [_jsx(Button, { className: css.button, onClick: selectWeek, "aria-label": `${Dates.weekToLongDate(week)} - ${Dates.weekToLongDate(week + 1)}`, disabled: isPast }), _jsxs("div", { className: css.date, children: [_jsx("div", { className: css.dateFrom, children: Dates.formatShort(currDate) }), isLast && (_jsx("div", { className: css.dateTo, children: Dates.formatShort(nextDate) }))] }), showMonth && (_jsxs("span", { className: css.month, children: [formattedMonth, " ", showYear && _jsx("b", { className: css.year, children: currYear })] }))] }));
|
|
62
|
+
return (_jsxs("div", { ref: ref, className: weekClasses, children: [_jsx(Button, { className: css.button, onClick: selectWeek, "aria-label": `${Dates.weekToLongDate(week, endWeek, forceSeasonSwitch)} - ${Dates.weekToLongDate(week + 1, endWeek, forceSeasonSwitch)}`, disabled: isPast }), _jsxs("div", { className: css.date, children: [_jsx("div", { className: css.dateFrom, children: Dates.formatShort(currDate) }), isLast && (_jsx("div", { className: css.dateTo, children: Dates.formatShort(nextDate) }))] }), showMonth && (_jsxs("span", { className: css.month, children: [formattedMonth, " ", showYear && _jsx("b", { className: css.year, children: currYear })] }))] }));
|
|
63
63
|
}
|