@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-tabs/tab.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 __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -14,11 +25,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
return (react_1.default.createElement("div",
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
30
|
+
var Tab = function (_a) {
|
|
31
|
+
var children = _a.children, index = _a.index, parentId = _a.parentId, selected = _a.selected, focused = _a.focused, className = _a.className, refCallback = _a.refCallback, rest = __rest(_a, ["children", "index", "parentId", "selected", "focused", "className", "refCallback"]);
|
|
32
|
+
return (react_1.default.createElement("div", __assign({}, rest, { ref: refCallback, "aria-controls": "".concat(parentId || 'default', "-tabpanel-").concat(index), "aria-selected": selected, className: (0, classnames_1.default)(className, 'tabs__item'), id: "".concat(parentId || 'default', "-tab-").concat(index), role: "tab", tabIndex: focused ? 0 : -1 }),
|
|
22
33
|
react_1.default.createElement("span", null, children)));
|
|
23
34
|
};
|
|
24
35
|
exports.default = Tab;
|
package/ebay-tabs/tabs.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);
|
|
@@ -26,17 +37,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
26
37
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
38
|
};
|
|
28
39
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
+
var react_1 = __importStar(require("react"));
|
|
41
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
42
|
+
var event_utils_1 = require("../common/event-utils");
|
|
43
|
+
var component_utils_1 = require("../common/component-utils");
|
|
44
|
+
var tab_1 = __importDefault(require("./tab"));
|
|
45
|
+
var tab_panel_1 = __importDefault(require("./tab-panel"));
|
|
46
|
+
var Tabs = function (_a) {
|
|
47
|
+
var id = _a.id, className = _a.className, _b = _a.index, index = _b === void 0 ? 0 : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.activation, activation = _d === void 0 ? 'auto' : _d, _e = _a.onSelect, onSelect = _e === void 0 ? function () { } : _e, _f = _a.onTabSelect, onTabSelect = _f === void 0 ? function () { } : _f, children = _a.children;
|
|
48
|
+
var headings = [];
|
|
49
|
+
var _g = (0, react_1.useState)(index), selectedIndex = _g[0], setSelectedIndex = _g[1];
|
|
50
|
+
var _h = (0, react_1.useState)(index), focusedIndex = _h[0], setFocusedIndex = _h[1];
|
|
51
|
+
var handleSelect = function (i) {
|
|
40
52
|
onSelect({ selectedIndex: i });
|
|
41
53
|
onTabSelect(i);
|
|
42
54
|
setSelectedIndex(i);
|
|
@@ -45,20 +57,20 @@ const Tabs = ({ id, className, index = 0, size = 'medium', activation = 'auto',
|
|
|
45
57
|
* Handle a11y for heading
|
|
46
58
|
* https://ebay.gitbooks.io/mindpatterns/content/disclosure/tabs.html
|
|
47
59
|
*/
|
|
48
|
-
|
|
49
|
-
(0, event_utils_1.handleActionKeydown)(ev, ()
|
|
60
|
+
var onKeyDown = function (ev, i) {
|
|
61
|
+
(0, event_utils_1.handleActionKeydown)(ev, function () {
|
|
50
62
|
ev.preventDefault();
|
|
51
63
|
if (activation === 'manual') {
|
|
52
64
|
handleSelect(i);
|
|
53
65
|
}
|
|
54
66
|
});
|
|
55
|
-
(0, event_utils_1.handleLeftRightArrowsKeydown)(ev, ()
|
|
67
|
+
(0, event_utils_1.handleLeftRightArrowsKeydown)(ev, function () {
|
|
56
68
|
var _a;
|
|
57
69
|
ev.preventDefault();
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
70
|
+
var len = (0, component_utils_1.filterByType)(children, tab_1.default).length;
|
|
71
|
+
var direction = ['Left', 'ArrowLeft'].includes(ev.key) ? -1 : 1;
|
|
72
|
+
var currentIndex = focusedIndex === undefined ? selectedIndex : focusedIndex;
|
|
73
|
+
var nextIndex = (currentIndex + len + direction) % len;
|
|
62
74
|
setFocusedIndex(nextIndex);
|
|
63
75
|
(_a = headings[nextIndex]) === null || _a === void 0 ? void 0 : _a.focus();
|
|
64
76
|
if (activation !== 'manual') {
|
|
@@ -66,16 +78,18 @@ const Tabs = ({ id, className, index = 0, size = 'medium', activation = 'auto',
|
|
|
66
78
|
}
|
|
67
79
|
});
|
|
68
80
|
};
|
|
69
|
-
(0, react_1.useEffect)(()
|
|
81
|
+
(0, react_1.useEffect)(function () {
|
|
70
82
|
handleSelect(index);
|
|
71
83
|
}, [index]);
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
84
|
+
var isLarge = size === 'large';
|
|
85
|
+
var tabHeadings = (0, component_utils_1.filterByType)(children, tab_1.default).map(function (item, i) {
|
|
86
|
+
return (0, react_1.cloneElement)(item, __assign(__assign({}, item.props), { refCallback: function (ref) { headings[i] = ref; }, index: i, parentId: id, selected: selectedIndex === i, focused: focusedIndex === i, onClick: function () {
|
|
87
|
+
handleSelect(i);
|
|
88
|
+
setFocusedIndex(i);
|
|
89
|
+
}, onKeyDown: function (e) { onKeyDown(e, i); } }));
|
|
90
|
+
});
|
|
91
|
+
var tabPanels = (0, component_utils_1.filterByType)(children, tab_panel_1.default).map(function (item, i) {
|
|
92
|
+
var itemProps = {
|
|
79
93
|
index: i,
|
|
80
94
|
parentId: id,
|
|
81
95
|
selected: selectedIndex === i,
|
|
@@ -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 __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -14,13 +25,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
var
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var ebay_icon_1 = require("../ebay-icon");
|
|
30
|
+
var ebay_icon_button_1 = require("../ebay-icon-button");
|
|
31
|
+
var EbayTextboxPostfixIcon = function (_a) {
|
|
32
|
+
var name = _a.name, buttonAriaLabel = _a.buttonAriaLabel, _b = _a.onClick, onClick = _b === void 0 ? function () { } : _b, rest = __rest(_a, ["name", "buttonAriaLabel", "onClick"]);
|
|
22
33
|
return buttonAriaLabel ?
|
|
23
|
-
react_1.default.createElement(ebay_icon_button_1.EbayIconButton,
|
|
24
|
-
react_1.default.createElement(ebay_icon_1.EbayIcon,
|
|
34
|
+
react_1.default.createElement(ebay_icon_button_1.EbayIconButton, __assign({ "aria-label": buttonAriaLabel, icon: name, transparent: true, onClick: onClick }, rest)) :
|
|
35
|
+
react_1.default.createElement(ebay_icon_1.EbayIcon, __assign({ name: name }, rest));
|
|
25
36
|
};
|
|
26
37
|
exports.default = EbayTextboxPostfixIcon;
|
|
@@ -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 __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -14,10 +25,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
return (react_1.default.createElement(ebay_icon_1.EbayIcon,
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var ebay_icon_1 = require("../ebay-icon");
|
|
30
|
+
var EbayTextboxPrefixIcon = function (_a) {
|
|
31
|
+
var name = _a.name, rest = __rest(_a, ["name"]);
|
|
32
|
+
return (react_1.default.createElement(ebay_icon_1.EbayIcon, __assign({ name: name }, rest)));
|
|
22
33
|
};
|
|
23
34
|
exports.default = EbayTextboxPrefixIcon;
|
|
@@ -26,6 +26,6 @@ export type EbayTextboxProps = {
|
|
|
26
26
|
forwardedRef?: Ref<HTMLTextAreaElement | HTMLInputElement>;
|
|
27
27
|
opaqueLabel?: boolean;
|
|
28
28
|
} & Omit<TextInputProps, 'onFocus' | 'onBlur' | 'onChange' | 'onKeyPress' | 'onKeyUp' | 'onKeyDown' | 'onInvalid'>;
|
|
29
|
-
declare const _default: React.ForwardRefExoticComponent<
|
|
29
|
+
declare const _default: React.ForwardRefExoticComponent<Pick<EbayTextboxProps, "form" | "slot" | "style" | "title" | "pattern" | "forwardedRef" | "type" | "invalid" | "key" | "value" | "className" | "disabled" | "inputSize" | "placeholder" | "opaqueLabel" | "children" | "multiple" | "name" | "required" | "size" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "cols" | "crossOrigin" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "max" | "maxLength" | "min" | "minLength" | "readOnly" | "rows" | "src" | "step" | "width" | "wrap" | "fluid" | "dirName" | "multiline" | "onInputChange" | "onFloatingLabelInit" | "onButtonClick" | "floatingLabel"> & React.RefAttributes<React.FC<EbayTextboxProps>>>;
|
|
30
30
|
export default _default;
|
|
31
31
|
//# sourceMappingURL=textbox.d.ts.map
|
package/ebay-textbox/textbox.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);
|
|
@@ -38,39 +49,39 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
38
49
|
};
|
|
39
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
51
|
exports.isControlled = void 0;
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
52
|
+
var react_1 = __importStar(require("react"));
|
|
53
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
54
|
+
var component_utils_1 = require("../common/component-utils");
|
|
55
|
+
var index_1 = require("./index");
|
|
56
|
+
var hooks_1 = require("../common/floating-label-utils/hooks");
|
|
57
|
+
var isControlled = function (value) { return typeof value !== 'undefined'; };
|
|
47
58
|
exports.isControlled = isControlled;
|
|
48
|
-
|
|
49
|
-
var
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
59
|
+
var EbayTextbox = function (_a) {
|
|
60
|
+
var _b = _a.type, type = _b === void 0 ? 'text' : _b, invalid = _a.invalid, fluid = _a.fluid, multiline = _a.multiline, _c = _a.onChange, onChange = _c === void 0 ? function () { } : _c, _d = _a.onInputChange, onInputChange = _d === void 0 ? function () { } : _d, _e = _a.onFocus, onFocus = _e === void 0 ? function () { } : _e, _f = _a.onBlur, onBlur = _f === void 0 ? function () { } : _f, _g = _a.onKeyPress, onKeyPress = _g === void 0 ? function () { } : _g, _h = _a.onKeyUp, onKeyUp = _h === void 0 ? function () { } : _h, _j = _a.onKeyDown, onKeyDown = _j === void 0 ? function () { } : _j, _k = _a.onInvalid, onInvalid = _k === void 0 ? function () { } : _k, _l = _a.onFloatingLabelInit, onFloatingLabelInit = _l === void 0 ? function () { } : _l, _m = _a.onButtonClick, onButtonClick = _m === void 0 ? function () { } : _m, autoFocus = _a.autoFocus, _o = _a.defaultValue, defaultValue = _o === void 0 ? '' : _o, controlledValue = _a.value, forwardedRef = _a.forwardedRef, _p = _a.inputSize, inputSize = _p === void 0 ? 'default' : _p, floatingLabel = _a.floatingLabel, children = _a.children, placeholder = _a.placeholder, opaqueLabel = _a.opaqueLabel, rest = __rest(_a, ["type", "invalid", "fluid", "multiline", "onChange", "onInputChange", "onFocus", "onBlur", "onKeyPress", "onKeyUp", "onKeyDown", "onInvalid", "onFloatingLabelInit", "onButtonClick", "autoFocus", "defaultValue", "value", "forwardedRef", "inputSize", "floatingLabel", "children", "placeholder", "opaqueLabel"]);
|
|
61
|
+
var _q = (0, react_1.useState)(defaultValue), value = _q[0], setValue = _q[1];
|
|
62
|
+
var _r = (0, react_1.useState)(defaultValue), inputValue = _r[0], setInputValue = _r[1];
|
|
63
|
+
var _s = (0, hooks_1.useFloatingLabel)({
|
|
53
64
|
ref: forwardedRef,
|
|
54
65
|
inputId: rest.id,
|
|
55
66
|
className: rest.className,
|
|
56
67
|
disabled: rest.disabled,
|
|
57
68
|
label: floatingLabel,
|
|
58
|
-
inputSize,
|
|
69
|
+
inputSize: inputSize,
|
|
59
70
|
inputValue: controlledValue || inputValue,
|
|
60
|
-
placeholder,
|
|
61
|
-
invalid,
|
|
62
|
-
type,
|
|
63
|
-
opaqueLabel,
|
|
71
|
+
placeholder: placeholder,
|
|
72
|
+
invalid: invalid,
|
|
73
|
+
type: type,
|
|
74
|
+
opaqueLabel: opaqueLabel,
|
|
64
75
|
onMount: onFloatingLabelInit
|
|
65
|
-
});
|
|
66
|
-
|
|
76
|
+
}), label = _s.label, Container = _s.Container, onFloatingLabelBlur = _s.onBlur, onFloatingLabelFocus = _s.onFocus, ref = _s.ref, floatingLabelPlaceholder = _s.placeholder;
|
|
77
|
+
var handleFocus = function (event) {
|
|
67
78
|
var _a;
|
|
68
79
|
onFocus(event, { value: ((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value) || defaultValue });
|
|
69
80
|
onFloatingLabelFocus();
|
|
70
81
|
};
|
|
71
|
-
|
|
82
|
+
var handleBlur = function (event) {
|
|
72
83
|
var _a;
|
|
73
|
-
|
|
84
|
+
var newValue = (_a = event.target) === null || _a === void 0 ? void 0 : _a.value;
|
|
74
85
|
onBlur(event, { value: newValue });
|
|
75
86
|
if (newValue !== value) {
|
|
76
87
|
onChange(event, { value: newValue });
|
|
@@ -78,56 +89,56 @@ const EbayTextbox = (_a) => {
|
|
|
78
89
|
}
|
|
79
90
|
onFloatingLabelBlur();
|
|
80
91
|
};
|
|
81
|
-
|
|
82
|
-
|
|
92
|
+
var handleKeyPress = function (event) {
|
|
93
|
+
var textbox = event.target;
|
|
83
94
|
onKeyPress(event, { value: textbox === null || textbox === void 0 ? void 0 : textbox.value });
|
|
84
95
|
};
|
|
85
|
-
|
|
86
|
-
|
|
96
|
+
var handleKeyUp = function (event) {
|
|
97
|
+
var textbox = event.target;
|
|
87
98
|
onKeyUp(event, { value: textbox === null || textbox === void 0 ? void 0 : textbox.value });
|
|
88
99
|
};
|
|
89
|
-
|
|
90
|
-
|
|
100
|
+
var handleKeyDown = function (event) {
|
|
101
|
+
var textbox = event.target;
|
|
91
102
|
onKeyDown(event, { value: textbox === null || textbox === void 0 ? void 0 : textbox.value });
|
|
92
103
|
};
|
|
93
|
-
|
|
94
|
-
|
|
104
|
+
var handleInvalid = function (event) {
|
|
105
|
+
var textbox = event.target;
|
|
95
106
|
onInvalid(event, { value: textbox === null || textbox === void 0 ? void 0 : textbox.value });
|
|
96
107
|
};
|
|
97
|
-
|
|
98
|
-
onButtonClick(event, { value });
|
|
108
|
+
var handleButtonClick = function (event) {
|
|
109
|
+
onButtonClick(event, { value: value });
|
|
99
110
|
};
|
|
100
|
-
(0, react_1.useEffect)(()
|
|
111
|
+
(0, react_1.useEffect)(function () {
|
|
101
112
|
if (autoFocus) {
|
|
102
113
|
handleFocus();
|
|
103
114
|
}
|
|
104
115
|
}, []);
|
|
105
|
-
|
|
116
|
+
var handleInputChange = function (e) {
|
|
106
117
|
var _a;
|
|
107
|
-
|
|
118
|
+
var newValue = (_a = e.target) === null || _a === void 0 ? void 0 : _a.value;
|
|
108
119
|
if (!(0, exports.isControlled)(controlledValue)) {
|
|
109
120
|
setInputValue(newValue);
|
|
110
121
|
}
|
|
111
122
|
onInputChange(e, { value: newValue });
|
|
112
123
|
};
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
124
|
+
var Input = multiline ? 'textarea' : 'input';
|
|
125
|
+
var Wrapper = fluid ? 'div' : 'span';
|
|
126
|
+
var prefixIcon = (0, component_utils_1.findComponent)(children, index_1.EbayTextboxPrefixIcon);
|
|
127
|
+
var postfixIcon = (0, component_utils_1.findComponent)(children, index_1.EbayTextboxPostfixIcon);
|
|
128
|
+
var inputClassName = (0, classnames_1.default)('textbox__control', {
|
|
118
129
|
'textbox__control--fluid': fluid,
|
|
119
130
|
'textbox__control--large': inputSize === 'large'
|
|
120
131
|
});
|
|
121
|
-
|
|
132
|
+
var wrapperClassName = (0, classnames_1.default)('textbox', rest.className, {
|
|
122
133
|
'textbox--icon-end': postfixIcon
|
|
123
134
|
});
|
|
124
135
|
return (react_1.default.createElement(Container, null,
|
|
125
136
|
label,
|
|
126
137
|
react_1.default.createElement(Wrapper, { className: wrapperClassName },
|
|
127
138
|
prefixIcon,
|
|
128
|
-
react_1.default.createElement(Input,
|
|
129
|
-
postfixIcon && (0, react_1.cloneElement)(postfixIcon,
|
|
130
|
-
|
|
139
|
+
react_1.default.createElement(Input, __assign({}, rest, { className: inputClassName, type: type, "aria-invalid": invalid, value: (0, exports.isControlled)(controlledValue) ? controlledValue : inputValue, onChange: handleInputChange, onBlur: handleBlur, onFocus: handleFocus, onKeyPress: handleKeyPress, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, onInvalid: handleInvalid, autoFocus: autoFocus, ref: ref, placeholder: floatingLabelPlaceholder })),
|
|
140
|
+
postfixIcon && (0, react_1.cloneElement)(postfixIcon, __assign(__assign({}, postfixIcon.props), { onClick: function (e) {
|
|
141
|
+
var _a = postfixIcon.props.onClick, iconClick = _a === void 0 ? function () { } : _a;
|
|
131
142
|
iconClick(e);
|
|
132
143
|
handleButtonClick(e);
|
|
133
144
|
} })))));
|
|
@@ -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 __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -15,12 +26,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
28
|
exports.EbayToast = void 0;
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
var
|
|
23
|
-
return (react_1.default.createElement(ebay_dialog_base_1.DialogBaseWithState,
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
31
|
+
var ebay_dialog_base_1 = require("../../ebay-dialog-base");
|
|
32
|
+
var EbayToast = function (_a) {
|
|
33
|
+
var className = _a.className, _b = _a.onClose, onClose = _b === void 0 ? function () { } : _b, rest = __rest(_a, ["className", "onClose"]);
|
|
34
|
+
return (react_1.default.createElement(ebay_dialog_base_1.DialogBaseWithState, __assign({}, rest, { isModal: false, baseEl: "aside", classPrefix: "toast-dialog", buttonPosition: "right", transitionElement: "root", className: (0, classnames_1.default)(className, 'toast-dialog--transition'), onCloseBtnClick: onClose })));
|
|
24
35
|
};
|
|
25
36
|
exports.EbayToast = EbayToast;
|
|
26
37
|
exports.default = exports.EbayToast;
|
|
@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
* This Component is used only for finding it as a child of EbayTooltip
|
|
5
5
|
* and pass the properties to TooltipContent
|
|
6
6
|
*/
|
|
7
|
-
|
|
7
|
+
var EbayTooltipContent = function () { return null; };
|
|
8
8
|
exports.default = EbayTooltipContent;
|
|
@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
* This Component is used only for finding it as a child of EbayTooltip
|
|
5
5
|
* and pass the properties to TooltipHost
|
|
6
6
|
*/
|
|
7
|
-
|
|
7
|
+
var EbayTooltipHost = function () { return null; };
|
|
8
8
|
exports.default = EbayTooltipHost;
|
|
@@ -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,49 +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
|
-
var
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
51
|
+
var react_1 = __importStar(require("react"));
|
|
52
|
+
var component_utils_1 = require("../common/component-utils");
|
|
53
|
+
var tooltip_utils_1 = require("../common/tooltip-utils");
|
|
54
|
+
var ebay_tooltip_content_1 = __importDefault(require("./ebay-tooltip-content"));
|
|
55
|
+
var ebay_tooltip_host_1 = __importDefault(require("./ebay-tooltip-host"));
|
|
56
|
+
var EbayTooltip = function (_a) {
|
|
57
|
+
var className = _a.className, pointer = _a.pointer, overlayStyle = _a.overlayStyle, noHover = _a.noHover, _b = _a.onFocus, onFocus = _b === void 0 ? function () { } : _b, _c = _a.onBlur, onBlur = _c === void 0 ? function () { } : _c, _d = _a.onMouseEnter, onMouseEnter = _d === void 0 ? function () { } : _d, _e = _a.onMouseLeave, onMouseLeave = _e === void 0 ? function () { } : _e, onExpand = _a.onExpand, onCollapse = _a.onCollapse, children = _a.children, rest = __rest(_a, ["className", "pointer", "overlayStyle", "noHover", "onFocus", "onBlur", "onMouseEnter", "onMouseLeave", "onExpand", "onCollapse", "children"]);
|
|
58
|
+
var _f = (0, tooltip_utils_1.useTooltip)({ onCollapse: onCollapse, onExpand: onExpand }), isExpanded = _f.isExpanded, expandTooltip = _f.expandTooltip, collapseTooltip = _f.collapseTooltip;
|
|
59
|
+
var timeoutRef = (0, react_1.useRef)();
|
|
60
|
+
var handleOnMouseEnter = function (event) {
|
|
50
61
|
onMouseEnter(event);
|
|
51
62
|
if (!noHover) {
|
|
52
63
|
clearTimeout(timeoutRef.current);
|
|
53
64
|
expandTooltip();
|
|
54
65
|
}
|
|
55
66
|
};
|
|
56
|
-
|
|
67
|
+
var handleOnMouseLeave = function (event) {
|
|
57
68
|
onMouseLeave(event);
|
|
58
69
|
if (!noHover) {
|
|
59
70
|
clearTimeout(timeoutRef.current);
|
|
60
|
-
timeoutRef.current = setTimeout(()
|
|
71
|
+
timeoutRef.current = setTimeout(function () {
|
|
61
72
|
collapseTooltip();
|
|
62
73
|
}, 300);
|
|
63
74
|
}
|
|
64
75
|
};
|
|
65
|
-
|
|
76
|
+
var handleOnFocus = function (event) {
|
|
66
77
|
onFocus(event);
|
|
67
78
|
expandTooltip();
|
|
68
79
|
};
|
|
69
|
-
|
|
80
|
+
var handleOnBlur = function (event) {
|
|
70
81
|
onBlur(event);
|
|
71
82
|
collapseTooltip();
|
|
72
83
|
};
|
|
73
|
-
|
|
74
|
-
|
|
84
|
+
var content = (0, component_utils_1.findComponent)(children, ebay_tooltip_content_1.default);
|
|
85
|
+
var host = (0, component_utils_1.findComponent)(children, ebay_tooltip_host_1.default);
|
|
75
86
|
if (!host) {
|
|
76
|
-
throw new Error(
|
|
87
|
+
throw new Error("EbayTooltip: Please use a EbayTooltipHost that defines the host of the tooltip");
|
|
77
88
|
}
|
|
78
89
|
if (!content) {
|
|
79
|
-
throw new Error(
|
|
90
|
+
throw new Error("EbayTooltip: Please use a EbayTooltipContent that defines the content of the tooltip");
|
|
80
91
|
}
|
|
81
|
-
return (react_1.default.createElement(tooltip_utils_1.Tooltip,
|
|
82
|
-
react_1.default.createElement(tooltip_utils_1.TooltipHost,
|
|
83
|
-
react_1.default.createElement(tooltip_utils_1.TooltipContent,
|
|
92
|
+
return (react_1.default.createElement(tooltip_utils_1.Tooltip, __assign({}, rest, { className: className, type: "tooltip", isExpanded: isExpanded, onFocus: handleOnFocus, onBlur: handleOnBlur, onMouseEnter: handleOnMouseEnter, onMouseLeave: handleOnMouseLeave }),
|
|
93
|
+
react_1.default.createElement(tooltip_utils_1.TooltipHost, __assign({}, host.props)),
|
|
94
|
+
react_1.default.createElement(tooltip_utils_1.TooltipContent, __assign({}, content.props, { type: "tooltip", style: overlayStyle, pointer: pointer }))));
|
|
84
95
|
};
|
|
85
96
|
exports.default = EbayTooltip;
|
|
@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
* This Component is used only for finding it as a child of EbayTooltip
|
|
5
5
|
* and pass the properties to TourtipContent
|
|
6
6
|
*/
|
|
7
|
-
|
|
7
|
+
var EbayTourtipContent = function () { return null; };
|
|
8
8
|
exports.default = EbayTourtipContent;
|
|
@@ -3,8 +3,11 @@ 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
|
-
index
|
|
9
|
-
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var EbayTourtipFooter = function (_a) {
|
|
8
|
+
var index = _a.index, children = _a.children;
|
|
9
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
10
|
+
index !== undefined && (react_1.default.createElement("span", { className: "tourtip__index" }, index)),
|
|
11
|
+
children));
|
|
12
|
+
};
|
|
10
13
|
exports.default = EbayTourtipFooter;
|
|
@@ -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 __rest = (this && this.__rest) || function (s, e) {
|
|
3
14
|
var t = {};
|
|
4
15
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -14,11 +25,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
26
|
};
|
|
16
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
return (react_1.default.createElement(HeadingTag,
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
30
|
+
var EbayTourtipHeading = function (_a) {
|
|
31
|
+
var as = _a.as, children = _a.children, className = _a.className, props = __rest(_a, ["as", "children", "className"]);
|
|
32
|
+
var HeadingTag = as || 'h2';
|
|
33
|
+
return (react_1.default.createElement(HeadingTag, __assign({}, props, { className: (0, classnames_1.default)("tourtip__heading", className) }), children));
|
|
23
34
|
};
|
|
24
35
|
exports.default = EbayTourtipHeading;
|
|
@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
* This Component is used only for finding it as a child of EbayTooltip
|
|
5
5
|
* and pass the properties to TourtipHost
|
|
6
6
|
*/
|
|
7
|
-
|
|
7
|
+
var EbayTourtipHost = function () { return null; };
|
|
8
8
|
exports.default = EbayTourtipHost;
|