@ebay/ui-core-react 6.2.2-rc.1 → 6.2.3
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.
Potentially problematic release.
This version of @ebay/ui-core-react might be problematic. Click here for more details.
- package/common/component-utils/array.polyfill.flat.js +13 -11
- package/common/component-utils/forwardRef.js +17 -4
- package/common/component-utils/usePrevious.js +3 -3
- package/common/component-utils/utils.js +26 -13
- package/common/debounce.js +7 -3
- package/common/event-utils/index.js +11 -8
- package/common/event-utils/use-key-press.js +12 -10
- package/common/event-utils/use-roving-index.js +24 -13
- package/common/floating-label-utils/hooks.js +53 -43
- package/common/notice-utils/notice-content.js +6 -5
- package/common/notice-utils/notice-cta.js +16 -5
- package/common/notice-utils/notice-footer.js +16 -5
- package/common/notice-utils/notice-title.js +17 -6
- package/common/random-id.js +1 -1
- package/common/range.js +4 -1
- package/common/tooltip-utils/tooltip-close-button.js +1 -1
- package/common/tooltip-utils/tooltip-content.js +28 -16
- package/common/tooltip-utils/tooltip-footer.js +6 -3
- package/common/tooltip-utils/tooltip-host.js +16 -5
- package/common/tooltip-utils/tooltip.d.ts +1 -1
- package/common/tooltip-utils/tooltip.js +26 -14
- package/common/tooltip-utils/use-tooltip.js +9 -8
- package/ebay-alert-dialog/alert-dialog.js +22 -11
- package/ebay-badge/badge.js +17 -6
- package/ebay-breadcrumbs/breadcrumb-item.js +18 -7
- package/ebay-breadcrumbs/breadcrumbs.js +30 -19
- package/ebay-button/button-cell.js +16 -5
- package/ebay-button/button-expand.d.ts +2 -4
- package/ebay-button/button-expand.d.ts.map +1 -1
- package/ebay-button/button-expand.js +10 -7
- package/ebay-button/button-loading.js +5 -5
- package/ebay-button/button-text.js +6 -3
- package/ebay-button/button.d.ts +1 -1
- package/ebay-button/button.js +43 -31
- package/ebay-calendar/calendar.js +111 -94
- package/ebay-calendar/date-utils.js +18 -9
- package/ebay-carousel/carousel-control-button.js +10 -9
- package/ebay-carousel/carousel-item.d.ts +1 -1
- package/ebay-carousel/carousel-item.js +25 -14
- package/ebay-carousel/carousel-list.js +22 -21
- package/ebay-carousel/carousel.js +44 -32
- package/ebay-carousel/helpers.js +47 -35
- package/ebay-carousel/scroll-to-transition.js +15 -15
- package/ebay-checkbox/checkbox.js +32 -21
- package/ebay-confirm-dialog/confirm-dialog.js +22 -11
- package/ebay-cta-button/cta-button.d.ts +1 -1
- package/ebay-cta-button/cta-button.js +20 -9
- package/ebay-date-textbox/date-textbox.js +53 -37
- package/ebay-dialog-base/components/animation.d.ts +1 -0
- package/ebay-dialog-base/components/animation.d.ts.map +1 -1
- package/ebay-dialog-base/components/animation.js +28 -25
- package/ebay-dialog-base/components/dialog-actions.js +5 -2
- package/ebay-dialog-base/components/dialog-close-button.d.ts +2 -5
- package/ebay-dialog-base/components/dialog-close-button.d.ts.map +1 -1
- package/ebay-dialog-base/components/dialog-close-button.js +5 -2
- package/ebay-dialog-base/components/dialog-footer.js +5 -2
- package/ebay-dialog-base/components/dialog-header.js +15 -4
- package/ebay-dialog-base/components/dialog-previous-button.js +17 -6
- package/ebay-dialog-base/components/dialogBase.js +51 -40
- package/ebay-dialog-base/dialog-base-with-state.js +35 -22
- package/ebay-drawer-dialog/components/drawer.js +50 -27
- package/ebay-eek/eek-rating.js +10 -8
- package/ebay-eek/eek-util.d.ts +1 -1
- package/ebay-eek/eek-util.d.ts.map +1 -1
- package/ebay-eek/eek-util.js +6 -7
- package/ebay-fake-menu/menu-item-separator.js +16 -5
- package/ebay-fake-menu/menu-item.js +26 -15
- package/ebay-fake-menu/menu.js +22 -11
- package/ebay-fake-menu-button/menu-button-item.js +2 -2
- package/ebay-fake-menu-button/menu-button-label.d.ts +2 -4
- package/ebay-fake-menu-button/menu-button-label.d.ts.map +1 -1
- package/ebay-fake-menu-button/menu-button-label.js +5 -2
- package/ebay-fake-menu-button/menu-button-separator.js +16 -5
- package/ebay-fake-menu-button/menu-button.js +45 -32
- package/ebay-fake-tabs/fake-tabs.js +23 -10
- package/ebay-fake-tabs/tab.js +16 -5
- package/ebay-field/description.js +19 -7
- package/ebay-field/field.js +5 -4
- package/ebay-field/label.js +18 -7
- package/ebay-fullscreen-dialog/fullscreen-dialog.js +18 -7
- package/ebay-icon/icon.d.ts +1 -1
- package/ebay-icon/icon.js +29 -17
- package/ebay-icon-button/icon-button.d.ts +1 -1
- package/ebay-icon-button/icon-button.js +27 -15
- package/ebay-infotip/ebay-infotip-content.js +5 -2
- package/ebay-infotip/ebay-infotip-heading.js +16 -5
- package/ebay-infotip/ebay-infotip-host.d.ts +2 -2
- package/ebay-infotip/ebay-infotip-host.d.ts.map +1 -1
- package/ebay-infotip/ebay-infotip-host.js +24 -10
- package/ebay-infotip/ebay-infotip.d.ts.map +1 -1
- package/ebay-infotip/ebay-infotip.js +34 -23
- package/ebay-inline-notice/inline-notice.js +27 -15
- package/ebay-lightbox-dialog/lightbox-dialog.js +21 -9
- package/ebay-listbox-button/listbox-button-option.js +18 -7
- package/ebay-listbox-button/listbox-button.d.ts.map +1 -1
- package/ebay-listbox-button/listbox-button.js +100 -79
- package/ebay-menu/menu-item-separator.js +16 -5
- package/ebay-menu/menu-item.js +23 -12
- package/ebay-menu/menu.d.ts +1 -1
- package/ebay-menu/menu.js +64 -37
- package/ebay-menu-button/README.md +1 -1
- package/ebay-menu-button/menu-button-item.js +1 -1
- package/ebay-menu-button/menu-button-label.d.ts +2 -4
- package/ebay-menu-button/menu-button-label.d.ts.map +1 -1
- package/ebay-menu-button/menu-button-label.js +5 -2
- package/ebay-menu-button/menu-button-separator.js +16 -5
- package/ebay-menu-button/menu-button.js +60 -46
- package/ebay-notice-base/components/ebay-notice-content/notice-content.js +1 -1
- package/ebay-notice-base/components/ebay-notice-title/notice-title.d.ts +2 -5
- package/ebay-notice-base/components/ebay-notice-title/notice-title.d.ts.map +1 -1
- package/ebay-notice-base/components/ebay-notice-title/notice-title.js +5 -2
- package/ebay-page-notice/page-notice-cta.js +6 -3
- package/ebay-page-notice/page-notice-footer.js +6 -3
- package/ebay-page-notice/page-notice-title.js +16 -5
- package/ebay-page-notice/page-notice.js +27 -16
- package/ebay-pagination/helpers.js +24 -21
- package/ebay-pagination/pagination-item.d.ts +1 -1
- package/ebay-pagination/pagination-item.js +27 -16
- package/ebay-pagination/pagination.js +81 -52
- package/ebay-panel-dialog/panel-dialog.js +21 -9
- package/ebay-progress-bar/progress-bar.js +16 -5
- package/ebay-progress-spinner/progress-spinner.js +18 -7
- package/ebay-progress-stepper/ebay-progress-step.js +25 -14
- package/ebay-progress-stepper/ebay-progress-stepper.js +21 -10
- package/ebay-progress-stepper/ebay-progress-title.js +5 -2
- package/ebay-radio/radio.js +29 -18
- package/ebay-section-notice/section-notice-footer.js +6 -3
- package/ebay-section-notice/section-notice-title.js +16 -5
- package/ebay-section-notice/section-notice.js +39 -24
- package/ebay-section-title/cta.js +16 -5
- package/ebay-section-title/info.js +16 -5
- package/ebay-section-title/overflow.js +16 -5
- package/ebay-section-title/section-title.js +24 -13
- package/ebay-section-title/subtitle.js +16 -5
- package/ebay-section-title/title.js +16 -5
- package/ebay-select/ebay-select-option.js +15 -4
- package/ebay-select/ebay-select.d.ts +1 -1
- package/ebay-select/ebay-select.js +45 -34
- package/ebay-signal/signal.js +17 -6
- package/ebay-snackbar-dialog/components/ebay-snackbar-dialog-action.js +16 -5
- package/ebay-snackbar-dialog/components/ebay-snackbar-dialog.js +38 -27
- package/ebay-split-button/split-button.js +21 -10
- package/ebay-star-rating/star-rating.js +19 -8
- package/ebay-star-rating-select/star-rating-select.js +31 -20
- package/ebay-svg/svg.js +3 -3
- package/ebay-switch/ebay-switch.js +21 -10
- package/ebay-tabs/tab-panel.js +16 -5
- package/ebay-tabs/tab.js +16 -5
- package/ebay-tabs/tabs.js +40 -26
- package/ebay-textbox/postfix-icon.js +18 -7
- package/ebay-textbox/prefix-icon.js +16 -5
- package/ebay-textbox/textbox.d.ts +1 -1
- package/ebay-textbox/textbox.js +53 -42
- package/ebay-toast-dialog/components/toast.js +17 -6
- package/ebay-tooltip/ebay-tooltip-content.js +1 -1
- package/ebay-tooltip/ebay-tooltip-host.js +1 -1
- package/ebay-tooltip/ebay-tooltip.js +32 -21
- package/ebay-tourtip/ebay-tourtip-content.js +1 -1
- package/ebay-tourtip/ebay-tourtip-footer.js +7 -4
- package/ebay-tourtip/ebay-tourtip-heading.js +17 -6
- package/ebay-tourtip/ebay-tourtip-host.js +1 -1
- package/ebay-tourtip/ebay-tourtip.js +33 -22
- package/ebay-video/controls.d.ts.map +1 -1
- package/ebay-video/controls.js +46 -23
- package/ebay-video/reportButton.d.ts +2 -7
- package/ebay-video/reportButton.d.ts.map +1 -1
- package/ebay-video/reportButton.js +8 -5
- package/ebay-video/source.js +14 -3
- package/ebay-video/video.d.ts.map +1 -1
- package/ebay-video/video.js +80 -54
- package/package.json +19 -23
package/ebay-button/button.js
CHANGED
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
14
|
if (k2 === undefined) k2 = k;
|
|
4
15
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -37,48 +48,49 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
37
48
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
49
|
};
|
|
39
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
var
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
primary:
|
|
51
|
-
secondary:
|
|
52
|
-
tertiary:
|
|
51
|
+
var react_1 = __importStar(require("react"));
|
|
52
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
53
|
+
var component_utils_1 = require("../common/component-utils");
|
|
54
|
+
var ebay_icon_1 = require("../ebay-icon");
|
|
55
|
+
var button_loading_1 = __importDefault(require("./button-loading"));
|
|
56
|
+
var button_expand_1 = __importDefault(require("./button-expand"));
|
|
57
|
+
var EbayButton = function (_a) {
|
|
58
|
+
var _b = _a.priority, priority = _b === void 0 ? 'secondary' : _b, _c = _a.variant, variant = _c === void 0 ? 'standard' : _c, _d = _a.size, size = _d === void 0 ? 'regular' : _d, bodyState = _a.bodyState, split = _a.split, _e = _a.transparent, transparent = _e === void 0 ? false : _e, _f = _a.fluid, fluid = _f === void 0 ? false : _f, disabled = _a.disabled, partiallyDisabled = _a.partiallyDisabled, children = _a.children, _g = _a.onKeyDown, onKeyDown = _g === void 0 ? function () { } : _g, _h = _a.onEscape, onEscape = _h === void 0 ? function () { } : _h, _j = _a.truncate, truncate = _j === void 0 ? false : _j, href = _a.href, extraClasses = _a.className, forwardedRef = _a.forwardedRef, borderless = _a.borderless, fixedHeight = _a.fixedHeight, rest = __rest(_a, ["priority", "variant", "size", "bodyState", "split", "transparent", "fluid", "disabled", "partiallyDisabled", "children", "onKeyDown", "onEscape", "truncate", "href", "className", "forwardedRef", "borderless", "fixedHeight"]);
|
|
59
|
+
var classPrefix = href ? 'fake-btn' : 'btn';
|
|
60
|
+
var priorityStyles = {
|
|
61
|
+
primary: "".concat(classPrefix, "--primary"),
|
|
62
|
+
secondary: "".concat(classPrefix, "--secondary"),
|
|
63
|
+
tertiary: "".concat(classPrefix, "--tertiary"),
|
|
53
64
|
none: ''
|
|
54
65
|
};
|
|
55
|
-
|
|
56
|
-
large:
|
|
57
|
-
small:
|
|
66
|
+
var sizeStyles = {
|
|
67
|
+
large: "".concat(classPrefix, "--large"),
|
|
68
|
+
small: "".concat(classPrefix, "--small"),
|
|
58
69
|
regular: '',
|
|
59
70
|
default: ''
|
|
60
71
|
};
|
|
61
|
-
|
|
62
|
-
start:
|
|
63
|
-
end:
|
|
72
|
+
var splitStyles = {
|
|
73
|
+
start: "".concat(classPrefix, "--split-start"),
|
|
74
|
+
end: "".concat(classPrefix, "--split-end")
|
|
64
75
|
};
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
76
|
+
var isDestructive = variant === 'destructive';
|
|
77
|
+
var isForm = variant === 'form';
|
|
78
|
+
var isLoading = bodyState === 'loading';
|
|
79
|
+
var isExpand = bodyState === 'expand';
|
|
80
|
+
var isSlim = isForm && (isIconOnly(children) || (isExpand && !children));
|
|
81
|
+
var className = (0, classnames_1.default)(classPrefix, extraClasses, priorityStyles[isForm || borderless ? 'none' : priority], sizeStyles[size], splitStyles[split], isDestructive && "".concat(classPrefix, "--destructive"), isForm && "".concat(classPrefix, "--form"), isSlim && "".concat(classPrefix, "--slim"), transparent && "".concat(classPrefix, "--transparent"), fluid && "".concat(classPrefix, "--fluid"), truncate && "".concat(classPrefix, "--truncated"), borderless && "".concat(classPrefix, "--borderless"), fixedHeight && (sizeStyles[size] ? "".concat(sizeStyles[size], "-").concat(fixedHeight) : "".concat(classPrefix, "--fixed-height")));
|
|
82
|
+
var keyDownHandler = function (e) {
|
|
72
83
|
onKeyDown(e);
|
|
73
84
|
if (e.key === 'Escape' || e.key === 'Esc') {
|
|
74
85
|
onEscape(e);
|
|
75
86
|
}
|
|
76
87
|
};
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
return href ? (react_1.default.createElement("a",
|
|
88
|
+
var bodyContent = getBodyContent(children, { isLoading: isLoading, isExpand: isExpand });
|
|
89
|
+
var ariaLive = isLoading ? "polite" : null;
|
|
90
|
+
return href ? (react_1.default.createElement("a", __assign({ className: className, href: disabled ? undefined : href, ref: forwardedRef, onKeyDown: keyDownHandler, "aria-live": ariaLive }, rest), bodyContent)) : (react_1.default.createElement("button", __assign({ disabled: disabled, "aria-disabled": partiallyDisabled, "aria-live": ariaLive, className: className, ref: forwardedRef, onKeyDown: keyDownHandler }, rest), bodyContent));
|
|
80
91
|
};
|
|
81
|
-
function getBodyContent(children,
|
|
92
|
+
function getBodyContent(children, _a) {
|
|
93
|
+
var isLoading = _a.isLoading, isExpand = _a.isExpand;
|
|
82
94
|
switch (true) {
|
|
83
95
|
case isLoading:
|
|
84
96
|
return react_1.default.createElement(button_loading_1.default, null);
|
|
@@ -89,7 +101,7 @@ function getBodyContent(children, { isLoading, isExpand }) {
|
|
|
89
101
|
}
|
|
90
102
|
}
|
|
91
103
|
function isIconOnly(children) {
|
|
92
|
-
|
|
104
|
+
var childrenArray = react_1.Children.toArray(children);
|
|
93
105
|
return childrenArray.length === 1 && childrenArray[0].type === ebay_icon_1.EbayIcon;
|
|
94
106
|
}
|
|
95
107
|
exports.default = (0, component_utils_1.withForwardRef)(EbayButton);
|
|
@@ -22,57 +22,69 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
22
22
|
__setModuleDefault(result, mod);
|
|
23
23
|
return result;
|
|
24
24
|
};
|
|
25
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
26
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
27
|
+
if (ar || !(i in from)) {
|
|
28
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
29
|
+
ar[i] = from[i];
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
33
|
+
};
|
|
25
34
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
35
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
36
|
};
|
|
28
37
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
38
|
+
var react_1 = __importStar(require("react"));
|
|
39
|
+
var ebay_icon_button_1 = require("../ebay-icon-button");
|
|
40
|
+
var date_utils_1 = require("./date-utils");
|
|
41
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
42
|
+
var DAY_UPDATE_KEYMAP = {
|
|
34
43
|
ArrowRight: 1,
|
|
35
44
|
ArrowLeft: -1,
|
|
36
45
|
ArrowDown: 7,
|
|
37
46
|
ArrowUp: -7
|
|
38
47
|
};
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
48
|
+
var EbayCalendar = function (_a) {
|
|
49
|
+
var selected = _a.selected, _b = _a.numMonths, numMonths = _b === void 0 ? 1 : _b, navigable = _a.navigable, interactive = _a.interactive, range = _a.range, locale = _a.locale, disableBefore = _a.disableBefore, disableAfter = _a.disableAfter, disableWeekdays = _a.disableWeekdays, disableList = _a.disableList, _c = _a.a11ySelectedText, a11ySelectedText = _c === void 0 ? 'selected' : _c, _d = _a.a11yRangeStartText, a11yRangeStartText = _d === void 0 ? 'start of range' : _d, _e = _a.a11yInRangeText, a11yInRangeText = _e === void 0 ? 'in range' : _e, _f = _a.a11yRangeEndText, a11yRangeEndText = _f === void 0 ? 'end of range' : _f, _g = _a.a11ySeparator, a11ySeparator = _g === void 0 ? '-' : _g, _h = _a.a11yTodayText, a11yTodayText = _h === void 0 ? 'today' : _h, _j = _a.a11yDisabledText, a11yDisabledText = _j === void 0 ? 'inactive' : _j, _k = _a.getA11yShowMonthText, getA11yShowMonthText = _k === void 0 ? function (monthTitle) { return "Show ".concat(monthTitle); } : _k, linkBuilder = _a.linkBuilder, _l = _a.onMonthChange, onMonthChange = _l === void 0 ? function () { } : _l, _m = _a.onFocus, onFocus = _m === void 0 ? function () { } : _m, _o = _a.onSelect, onSelect = _o === void 0 ? function () { } : _o;
|
|
50
|
+
var todayISO = (0, date_utils_1.toISO)(new Date());
|
|
51
|
+
var _p = (0, date_utils_1.getWeekdayInfo)((0, date_utils_1.localeOverride)(locale)), firstDayOfWeek = _p.firstDayOfWeek, weekdayLabels = _p.weekdayLabels;
|
|
52
|
+
var containerRef = (0, react_1.useRef)(null);
|
|
53
|
+
var _q = (0, react_1.useState)(0), offset = _q[0], setOffset = _q[1];
|
|
54
|
+
var _r = (0, react_1.useState)(null), focusISO = _r[0], setFocusISO = _r[1];
|
|
55
|
+
var _s = (0, react_1.useState)(todayISO), tabIndexISO = _s[0], setTabIndexISO = _s[1];
|
|
56
|
+
var baseISO = (0, react_1.useRef)(todayISO);
|
|
57
|
+
var getMonthDate = function (monthOffset) {
|
|
58
|
+
var baseDate = (0, date_utils_1.fromISO)(baseISO.current);
|
|
59
|
+
var date = new Date(Date.UTC(baseDate.getUTCFullYear(), baseDate.getUTCMonth() + monthOffset));
|
|
50
60
|
return date;
|
|
51
61
|
};
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
62
|
+
var getFirstVisibleISO = function () {
|
|
63
|
+
return (0, date_utils_1.toISO)(getMonthDate(offset));
|
|
64
|
+
};
|
|
65
|
+
var getLastVisibleISO = function () {
|
|
66
|
+
var baseDate = (0, date_utils_1.fromISO)(baseISO.current);
|
|
55
67
|
return (0, date_utils_1.toISO)(new Date(Date.UTC(baseDate.getUTCFullYear(), baseDate.getUTCMonth() + offset + (numMonths || 1), 0)));
|
|
56
68
|
};
|
|
57
|
-
(0, react_1.useEffect)(()
|
|
69
|
+
(0, react_1.useEffect)(function () {
|
|
58
70
|
if (selected) {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
71
|
+
var selectedISOs = Array.isArray(selected) ? selected : [selected];
|
|
72
|
+
var currFirstISO_1 = getFirstVisibleISO();
|
|
73
|
+
var currLastISO_1 = getLastVisibleISO();
|
|
74
|
+
var selectedTimeInView = selectedISOs.find(function (iso) { return iso >= currFirstISO_1 && iso <= currLastISO_1; });
|
|
63
75
|
if (selectedTimeInView === undefined) {
|
|
64
76
|
baseISO.current = selectedISOs[0];
|
|
65
77
|
setOffset(0);
|
|
66
78
|
}
|
|
67
79
|
}
|
|
68
80
|
}, [selected]);
|
|
69
|
-
|
|
81
|
+
var calculateRangeDisplay = function () {
|
|
70
82
|
if (selected && range) {
|
|
71
|
-
|
|
72
|
-
|
|
83
|
+
var iso1 = void 0;
|
|
84
|
+
var iso2 = void 0;
|
|
73
85
|
if (Array.isArray(selected)) {
|
|
74
86
|
// Two elements are selected, we can use them as the ends of the range.
|
|
75
|
-
[
|
|
87
|
+
iso1 = selected[0], iso2 = selected[1];
|
|
76
88
|
}
|
|
77
89
|
else if (focusISO) {
|
|
78
90
|
// One element is selected and the user is focused on a date,
|
|
@@ -81,7 +93,7 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
81
93
|
iso2 = focusISO;
|
|
82
94
|
}
|
|
83
95
|
if (iso1 && iso2) {
|
|
84
|
-
|
|
96
|
+
var _a = [iso1, iso2].sort(), start = _a[0], end = _a[1];
|
|
85
97
|
return {
|
|
86
98
|
rangeStart: start,
|
|
87
99
|
rangeEnd: end
|
|
@@ -93,48 +105,50 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
93
105
|
rangeEnd: null
|
|
94
106
|
};
|
|
95
107
|
};
|
|
96
|
-
|
|
97
|
-
|
|
108
|
+
var monthTitle = function (date) {
|
|
109
|
+
var formatter = new Intl.DateTimeFormat((0, date_utils_1.localeOverride)(locale), {
|
|
98
110
|
month: 'long',
|
|
99
111
|
year: 'numeric'
|
|
100
112
|
});
|
|
101
113
|
return formatter.format(new Date(date.getUTCFullYear(), date.getUTCMonth()));
|
|
102
114
|
};
|
|
103
|
-
|
|
104
|
-
(
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
115
|
+
var isDayDisabled = function (iso) {
|
|
116
|
+
return (disableBefore && iso < disableBefore) ||
|
|
117
|
+
(disableAfter && iso > disableAfter) ||
|
|
118
|
+
(disableWeekdays && disableWeekdays.includes((0, date_utils_1.fromISO)(iso).getUTCDay())) ||
|
|
119
|
+
(disableList && disableList.includes(iso));
|
|
120
|
+
};
|
|
121
|
+
var getFirstActiveISO = function () {
|
|
122
|
+
var iso = getFirstVisibleISO();
|
|
123
|
+
var lastVisible = getLastVisibleISO();
|
|
110
124
|
while (iso <= lastVisible && isDayDisabled(iso)) {
|
|
111
125
|
iso = (0, date_utils_1.offsetISO)(iso, 1);
|
|
112
126
|
}
|
|
113
127
|
return iso > lastVisible ? null : iso;
|
|
114
128
|
};
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
129
|
+
var getLastActiveISO = function () {
|
|
130
|
+
var iso = getLastVisibleISO();
|
|
131
|
+
var firstVisible = getFirstVisibleISO();
|
|
118
132
|
while (iso >= firstVisible && isDayDisabled(iso)) {
|
|
119
133
|
iso = (0, date_utils_1.offsetISO)(iso, -1);
|
|
120
134
|
}
|
|
121
135
|
return iso < firstVisible ? null : iso;
|
|
122
136
|
};
|
|
123
|
-
|
|
137
|
+
var setTabindexAndFocus = function (iso) {
|
|
124
138
|
setTabIndexISO(iso);
|
|
125
|
-
setTimeout(()
|
|
139
|
+
setTimeout(function () {
|
|
126
140
|
var _a;
|
|
127
|
-
|
|
141
|
+
var elementToFocus = (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("[data-iso=\"".concat(iso, "\"]"));
|
|
128
142
|
elementToFocus === null || elementToFocus === void 0 ? void 0 : elementToFocus.focus();
|
|
129
143
|
});
|
|
130
144
|
};
|
|
131
|
-
|
|
145
|
+
var prevMonth = function (focus) {
|
|
132
146
|
if (disableBefore && getFirstVisibleISO() <= disableBefore) {
|
|
133
147
|
return false;
|
|
134
148
|
}
|
|
135
|
-
setOffset((currentOffset)
|
|
136
|
-
|
|
137
|
-
|
|
149
|
+
setOffset(function (currentOffset) { return currentOffset - 1; });
|
|
150
|
+
var newTabIndexISO = tabIndexISO;
|
|
151
|
+
var lastActiveISO = getLastActiveISO();
|
|
138
152
|
if (lastActiveISO && lastActiveISO < tabIndexISO) {
|
|
139
153
|
newTabIndexISO = lastActiveISO;
|
|
140
154
|
setTabIndexISO(lastActiveISO);
|
|
@@ -147,13 +161,13 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
147
161
|
});
|
|
148
162
|
return true;
|
|
149
163
|
};
|
|
150
|
-
|
|
164
|
+
var nextMonth = function (focus) {
|
|
151
165
|
if (disableAfter && getLastVisibleISO() >= disableAfter) {
|
|
152
166
|
return false;
|
|
153
167
|
}
|
|
154
|
-
setOffset((currentOffset)
|
|
155
|
-
|
|
156
|
-
|
|
168
|
+
setOffset(function (currentOffset) { return currentOffset + 1; });
|
|
169
|
+
var newTabIndexISO = tabIndexISO;
|
|
170
|
+
var firstActiveISO = getFirstActiveISO();
|
|
157
171
|
if (firstActiveISO && firstActiveISO > tabIndexISO) {
|
|
158
172
|
newTabIndexISO = firstActiveISO;
|
|
159
173
|
setTabIndexISO(firstActiveISO);
|
|
@@ -165,18 +179,18 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
165
179
|
iso: (0, date_utils_1.toISO)(getMonthDate(offset + (numMonths || 1)))
|
|
166
180
|
});
|
|
167
181
|
};
|
|
168
|
-
|
|
169
|
-
|
|
182
|
+
var onKeyDown = function (event) {
|
|
183
|
+
var dayChange = DAY_UPDATE_KEYMAP[event.key];
|
|
170
184
|
if (dayChange) {
|
|
171
185
|
event.preventDefault();
|
|
172
|
-
|
|
173
|
-
|
|
186
|
+
var tries = 7;
|
|
187
|
+
var iso = tabIndexISO;
|
|
174
188
|
do {
|
|
175
189
|
iso = (0, date_utils_1.offsetISO)(iso, dayChange);
|
|
176
190
|
} while (tries-- > 0 && isDayDisabled(iso));
|
|
177
191
|
if (tries > 0) {
|
|
178
|
-
|
|
179
|
-
|
|
192
|
+
var firstVisible = getFirstVisibleISO();
|
|
193
|
+
var lastVisible = getLastVisibleISO();
|
|
180
194
|
if (iso < firstVisible) {
|
|
181
195
|
if (navigable) {
|
|
182
196
|
prevMonth();
|
|
@@ -214,19 +228,19 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
214
228
|
}
|
|
215
229
|
}
|
|
216
230
|
};
|
|
217
|
-
|
|
218
|
-
onSelect(event, { iso });
|
|
231
|
+
var onDaySelect = function (event, iso) {
|
|
232
|
+
onSelect(event, { iso: iso });
|
|
219
233
|
};
|
|
220
|
-
|
|
234
|
+
var onDayFocus = function (event, day) {
|
|
221
235
|
setFocusISO(day);
|
|
222
236
|
setTabIndexISO(day);
|
|
223
237
|
onFocus(event, { iso: day });
|
|
224
238
|
};
|
|
225
|
-
|
|
239
|
+
var onDayBlur = function () {
|
|
226
240
|
setFocusISO(null);
|
|
227
241
|
};
|
|
228
|
-
|
|
229
|
-
|
|
242
|
+
var _t = calculateRangeDisplay(), rangeStart = _t.rangeStart, rangeEnd = _t.rangeEnd;
|
|
243
|
+
var isDayInRange = function (iso) {
|
|
230
244
|
if (!rangeStart || !rangeEnd) {
|
|
231
245
|
return false;
|
|
232
246
|
}
|
|
@@ -235,28 +249,28 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
235
249
|
}
|
|
236
250
|
return true;
|
|
237
251
|
};
|
|
238
|
-
|
|
252
|
+
var monthDates = __spreadArray([], Array(numMonths), true).map(function (_, i) { return getMonthDate(offset + i); });
|
|
239
253
|
return (react_1.default.createElement("div", { className: "calendar", ref: containerRef },
|
|
240
254
|
navigable && (react_1.default.createElement("div", { className: "calendar__header" },
|
|
241
255
|
react_1.default.createElement("div", { className: "calendar__header--inner" },
|
|
242
|
-
react_1.default.createElement(ebay_icon_button_1.EbayIconButton, { transparent: true, size: "small", icon: "chevronLeft24", disabled: disableBefore && getFirstVisibleISO() <= disableBefore, "aria-label": getA11yShowMonthText(monthTitle(getMonthDate(offset - 1))), onClick: ()
|
|
243
|
-
monthDates.map((monthDate, i)
|
|
244
|
-
react_1.default.createElement(ebay_icon_button_1.EbayIconButton, { transparent: true, size: "small", icon: "chevronRight24", disabled: disableAfter && getLastVisibleISO() >= disableAfter, "aria-label": getA11yShowMonthText(monthTitle(getMonthDate(offset + numMonths))), onClick: ()
|
|
245
|
-
react_1.default.createElement("div", { className: "calendar__body" }, monthDates.map((monthDate, i)
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
256
|
+
react_1.default.createElement(ebay_icon_button_1.EbayIconButton, { transparent: true, size: "small", icon: "chevronLeft24", disabled: disableBefore && getFirstVisibleISO() <= disableBefore, "aria-label": getA11yShowMonthText(monthTitle(getMonthDate(offset - 1))), onClick: function () { return prevMonth(); } }),
|
|
257
|
+
monthDates.map(function (monthDate, i) { return (react_1.default.createElement("h3", { key: i }, monthTitle(monthDate))); }),
|
|
258
|
+
react_1.default.createElement(ebay_icon_button_1.EbayIconButton, { transparent: true, size: "small", icon: "chevronRight24", disabled: disableAfter && getLastVisibleISO() >= disableAfter, "aria-label": getA11yShowMonthText(monthTitle(getMonthDate(offset + numMonths))), onClick: function () { return nextMonth(); } })))),
|
|
259
|
+
react_1.default.createElement("div", { className: "calendar__body" }, monthDates.map(function (monthDate, i) {
|
|
260
|
+
var numBlankDays = (monthDate.getUTCDay() - firstDayOfWeek + 7) % 7;
|
|
261
|
+
var year = monthDate.getUTCFullYear();
|
|
262
|
+
var month = monthDate.getUTCMonth();
|
|
263
|
+
var daysInMont = new Date(year, month + 1, 0).getDate();
|
|
264
|
+
var calendarRows = __spreadArray([], Array(Math.ceil((numBlankDays + daysInMont) / 7)), true);
|
|
251
265
|
return (react_1.default.createElement("div", { key: i, className: "calendar__month" },
|
|
252
266
|
react_1.default.createElement("table", { onKeyDown: onKeyDown },
|
|
253
267
|
react_1.default.createElement("caption", null, monthTitle(monthDate)),
|
|
254
268
|
react_1.default.createElement("thead", null,
|
|
255
|
-
react_1.default.createElement("tr", null, weekdayLabels.map((dayName)
|
|
256
|
-
react_1.default.createElement("tbody", null, calendarRows.map((_, row)
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
269
|
+
react_1.default.createElement("tr", null, weekdayLabels.map(function (dayName) { return (react_1.default.createElement("th", { key: dayName, scope: "col" }, dayName)); }))),
|
|
270
|
+
react_1.default.createElement("tbody", null, calendarRows.map(function (_, row) {
|
|
271
|
+
var startDate = row * 7 - numBlankDays + 1;
|
|
272
|
+
var endDate = startDate + 6;
|
|
273
|
+
var columns = [];
|
|
260
274
|
if (row === 0 && numBlankDays !== 0) {
|
|
261
275
|
startDate = 1;
|
|
262
276
|
columns.push(react_1.default.createElement("td", { key: "pre-column", colSpan: numBlankDays }));
|
|
@@ -264,17 +278,17 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
264
278
|
else if (endDate > daysInMont) {
|
|
265
279
|
endDate = daysInMont;
|
|
266
280
|
}
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
? selected.some((iso)
|
|
281
|
+
var _loop_1 = function (day) {
|
|
282
|
+
var dayISO = (0, date_utils_1.toISO)(new Date(Date.UTC(year, month, day)));
|
|
283
|
+
var isToday = dayISO === todayISO;
|
|
284
|
+
var isSelected = Array.isArray(selected)
|
|
285
|
+
? selected.some(function (iso) { return iso === dayISO; })
|
|
272
286
|
: selected === dayISO;
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
287
|
+
var isRangeStart = dayISO === rangeStart;
|
|
288
|
+
var isInRange = isDayInRange(dayISO);
|
|
289
|
+
var isRangeEnd = dayISO === rangeEnd;
|
|
290
|
+
var isDisabled = isDayDisabled(dayISO);
|
|
291
|
+
var a11yTexts = [
|
|
278
292
|
'',
|
|
279
293
|
isSelected && a11ySelectedText,
|
|
280
294
|
isRangeStart && a11yRangeStartText,
|
|
@@ -282,22 +296,25 @@ const EbayCalendar = ({ selected, numMonths = 1, navigable, interactive, range,
|
|
|
282
296
|
isRangeEnd && a11yRangeEndText,
|
|
283
297
|
!interactive && isToday && a11yTodayText,
|
|
284
298
|
!interactive && isDisabled && a11yDisabledText
|
|
285
|
-
].filter((value)
|
|
286
|
-
|
|
287
|
-
|
|
299
|
+
].filter(function (value) { return typeof value !== 'boolean' || value !== false; });
|
|
300
|
+
var link = !interactive && !isDisabled && linkBuilder && linkBuilder(dayISO);
|
|
301
|
+
var NonInteractiveTag = link ? 'a' : 'span';
|
|
288
302
|
columns.push(react_1.default.createElement("td", { key: day, className: (0, classnames_1.default)({
|
|
289
303
|
'calendar__cell--selected': isSelected,
|
|
290
304
|
'calendar__range--start': isRangeStart,
|
|
291
305
|
'calendar__range': isInRange,
|
|
292
306
|
'calendar__range--end': isRangeEnd
|
|
293
307
|
}) }, interactive ? (react_1.default.createElement("button", { disabled: isDisabled, "aria-label": a11yTexts.length > 1
|
|
294
|
-
?
|
|
295
|
-
: undefined, tabIndex: tabIndexISO !== dayISO ? -1 : undefined, "aria-current": isToday ? 'date' : undefined, "aria-pressed": isSelected ? 'true' : undefined, onClick: (event)
|
|
308
|
+
? "".concat(day).concat(a11yTexts.join(a11ySeparator))
|
|
309
|
+
: undefined, tabIndex: tabIndexISO !== dayISO ? -1 : undefined, "aria-current": isToday ? 'date' : undefined, "aria-pressed": isSelected ? 'true' : undefined, onClick: function (event) { return onDaySelect(event, dayISO); }, onFocus: function (event) { return onDayFocus(event, dayISO); }, onMouseOver: function (event) { return onDayFocus(event, dayISO); }, onMouseOut: function (event) { return onDayBlur(); }, onBlur: function () { return onDayBlur(); }, "data-iso": dayISO }, day)) : (react_1.default.createElement(NonInteractiveTag, { className: (0, classnames_1.default)({
|
|
296
310
|
'calendar__cell--disabled': isDisabled,
|
|
297
311
|
'calendar__cell--current': isToday
|
|
298
312
|
}), href: link },
|
|
299
313
|
day,
|
|
300
314
|
a11yTexts.length > 1 && (react_1.default.createElement("span", { className: "clipped" }, a11yTexts.join(a11ySeparator)))))));
|
|
315
|
+
};
|
|
316
|
+
for (var day = startDate; day <= endDate; day++) {
|
|
317
|
+
_loop_1(day);
|
|
301
318
|
}
|
|
302
319
|
return (react_1.default.createElement("tr", { key: row }, columns));
|
|
303
320
|
})))));
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
3
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
4
|
+
if (ar || !(i in from)) {
|
|
5
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
6
|
+
ar[i] = from[i];
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
10
|
+
};
|
|
2
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
12
|
exports.localeOverride = exports.offsetISO = exports.fromISO = exports.toISO = exports.dateArgToISO = exports.getWeekdayInfo = exports.findFirstDayOfWeek = void 0;
|
|
4
13
|
function findFirstDayOfWeek(localeName) {
|
|
5
14
|
// weekInfo only exists on some browsers, so we default to Sunday otherwise
|
|
6
15
|
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/weekInfo
|
|
7
|
-
|
|
16
|
+
var locale = new Intl.Locale(localeName);
|
|
8
17
|
if (locale.weekInfo) {
|
|
9
18
|
return locale.weekInfo.firstDay;
|
|
10
19
|
}
|
|
@@ -12,19 +21,19 @@ function findFirstDayOfWeek(localeName) {
|
|
|
12
21
|
}
|
|
13
22
|
exports.findFirstDayOfWeek = findFirstDayOfWeek;
|
|
14
23
|
function getWeekdayInfo(localeName) {
|
|
15
|
-
|
|
16
|
-
|
|
24
|
+
var firstDayOfWeek = findFirstDayOfWeek(localeName);
|
|
25
|
+
var weekdayLabelFormatter = new Intl.DateTimeFormat(localeName, {
|
|
17
26
|
weekday: 'short'
|
|
18
27
|
});
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
28
|
+
var weekday = new Date(2022, 9, 2 + firstDayOfWeek); // October 2, 2022 was a Sunday
|
|
29
|
+
var weekdayLabels = __spreadArray([], Array(7), true).map(function () {
|
|
30
|
+
var dayLabel = weekdayLabelFormatter.format(weekday);
|
|
22
31
|
weekday.setDate(weekday.getDate() + 1);
|
|
23
32
|
return dayLabel;
|
|
24
33
|
});
|
|
25
34
|
return {
|
|
26
|
-
firstDayOfWeek,
|
|
27
|
-
weekdayLabels
|
|
35
|
+
firstDayOfWeek: firstDayOfWeek,
|
|
36
|
+
weekdayLabels: weekdayLabels
|
|
28
37
|
};
|
|
29
38
|
}
|
|
30
39
|
exports.getWeekdayInfo = getWeekdayInfo;
|
|
@@ -47,7 +56,7 @@ function fromISO(iso) {
|
|
|
47
56
|
}
|
|
48
57
|
exports.fromISO = fromISO;
|
|
49
58
|
function offsetISO(iso, days) {
|
|
50
|
-
|
|
59
|
+
var date = fromISO(iso);
|
|
51
60
|
date.setUTCDate(date.getUTCDate() + days);
|
|
52
61
|
return toISO(date);
|
|
53
62
|
}
|
|
@@ -3,22 +3,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
8
|
+
var ebay_icon_1 = require("../ebay-icon");
|
|
9
|
+
var icon = {
|
|
10
10
|
prev: 'chevronLeft12',
|
|
11
11
|
next: 'chevronRight12'
|
|
12
12
|
};
|
|
13
|
-
|
|
13
|
+
var typeToDirection = {
|
|
14
14
|
prev: 'LEFT',
|
|
15
15
|
next: 'RIGHT'
|
|
16
16
|
};
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
var CarouselControlButton = function (_a) {
|
|
18
|
+
var type = _a.type, label = _a.label, hidden = _a.hidden, disabled = _a.disabled, onClick = _a.onClick;
|
|
19
|
+
var handleOnClick = function (event) {
|
|
19
20
|
onClick(event, { direction: typeToDirection[type] });
|
|
20
21
|
};
|
|
21
|
-
return (react_1.default.createElement("button", { className: (0, classnames_1.default)('carousel__control',
|
|
22
|
-
react_1.default.createElement(ebay_icon_1.EbayIcon, { className: (0, classnames_1.default)('icon',
|
|
22
|
+
return (react_1.default.createElement("button", { className: (0, classnames_1.default)('carousel__control', "carousel__control--".concat(type)), "aria-label": label, "aria-disabled": disabled, disabled: disabled, onClick: handleOnClick },
|
|
23
|
+
react_1.default.createElement(ebay_icon_1.EbayIcon, { className: (0, classnames_1.default)('icon', "icon--carousel-".concat(type)), focusable: false, name: icon[type], "aria-hidden": hidden })));
|
|
23
24
|
};
|
|
24
25
|
exports.default = CarouselControlButton;
|
|
@@ -7,6 +7,6 @@ type CarouselItemProps = ListProps & {
|
|
|
7
7
|
className?: string;
|
|
8
8
|
forwardedRef?: RefObject<ListItemRef>;
|
|
9
9
|
};
|
|
10
|
-
declare const _default: React.ForwardRefExoticComponent<
|
|
10
|
+
declare const _default: React.ForwardRefExoticComponent<Pick<CarouselItemProps, "forwardedRef" | "key" | "offset" | "slideWidth" | keyof React.LiHTMLAttributes<HTMLLIElement>> & React.RefAttributes<React.FC<CarouselItemProps>>>;
|
|
11
11
|
export default _default;
|
|
12
12
|
//# sourceMappingURL=carousel-item.d.ts.map
|
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
14
|
if (k2 === undefined) k2 = k;
|
|
4
15
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -34,26 +45,26 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
34
45
|
return t;
|
|
35
46
|
};
|
|
36
47
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
var
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
(0, react_1.useImperativeHandle)(forwardedRef, ()
|
|
48
|
+
var react_1 = __importStar(require("react"));
|
|
49
|
+
var component_utils_1 = require("../common/component-utils");
|
|
50
|
+
var helpers_1 = require("./helpers");
|
|
51
|
+
var EbayCarouselItem = function (_a) {
|
|
52
|
+
var slideWidth = _a.slideWidth, offset = _a.offset, forwardedRef = _a.forwardedRef, children = _a.children, rest = __rest(_a, ["slideWidth", "offset", "forwardedRef", "children"]);
|
|
53
|
+
var itemRef = (0, react_1.useRef)();
|
|
54
|
+
var _b = (0, react_1.useState)(false), isVisible = _b[0], setIsVisible = _b[1];
|
|
55
|
+
(0, react_1.useImperativeHandle)(forwardedRef, function () {
|
|
45
56
|
if (!itemRef.current)
|
|
46
57
|
return;
|
|
47
|
-
|
|
48
|
-
|
|
58
|
+
var _a = (0, helpers_1.getRelativeRects)(itemRef.current), left = _a.left, right = _a.right;
|
|
59
|
+
var fullyVisible = left === undefined ||
|
|
49
60
|
(left - offset >= -0.01 && right - offset <= slideWidth + 0.01);
|
|
50
61
|
setIsVisible(fullyVisible);
|
|
51
62
|
return {
|
|
52
|
-
left,
|
|
53
|
-
right,
|
|
54
|
-
fullyVisible
|
|
63
|
+
left: left,
|
|
64
|
+
right: right,
|
|
65
|
+
fullyVisible: fullyVisible
|
|
55
66
|
};
|
|
56
67
|
}, [slideWidth, offset]);
|
|
57
|
-
return (react_1.default.createElement("li",
|
|
68
|
+
return (react_1.default.createElement("li", __assign({ ref: itemRef, "aria-hidden": !isVisible }, rest), children));
|
|
58
69
|
};
|
|
59
70
|
exports.default = (0, component_utils_1.withForwardRef)(EbayCarouselItem);
|