@ebay/ui-core-react 7.4.0-alpha.9 → 7.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/array.polyfill.flat-5BAolFdk.js +1 -0
- package/badge-CoHKfiPt.js +1 -0
- package/button-DGuEBUDJ.js +1 -0
- package/calendar-lAu6VfAb.js +1 -0
- package/common/component-utils/forwardRef/index.js +1 -10
- package/common/component-utils/index.js +1 -9
- package/common/component-utils/utils/index.js +1 -25
- package/common/event-utils/index.js +1 -113
- package/common/floating-label-utils/hooks/index.js +1 -106
- package/common/notice-utils/notice-cta/index.js +1 -5
- package/common/random-id/index.js +1 -13
- package/common/tooltip-utils/constants/index.js +1 -97
- package/common/tooltip-utils/index.js +1 -11
- package/debounce-BQsYxxOL.js +1 -0
- package/dialog-previous-button-CpuFLkQp.js +1 -0
- package/drawer-rqXAEeqd.js +1 -0
- package/ebay-alert-dialog/index.js +1 -26
- package/ebay-badge/index.js +1 -4
- package/ebay-breadcrumbs/index.js +1 -47
- package/ebay-button/index.js +1 -5
- package/ebay-calendar/index.js +1 -4
- package/ebay-carousel/index.js +1 -345
- package/ebay-checkbox/index.js +1 -52
- package/ebay-confirm-dialog/index.js +1 -28
- package/ebay-cta-button/index.js +1 -22
- package/ebay-date-textbox/index.js +1 -140
- package/ebay-dialog-base/components/animation/index.js +1 -92
- package/ebay-dialog-base/components/dialog-footer/index.js +1 -4
- package/ebay-dialog-base/components/dialog-header/index.js +1 -4
- package/ebay-dialog-base/index.js +1 -13
- package/ebay-drawer-dialog/index.js +1 -4
- package/ebay-eek/index.js +1 -54
- package/ebay-fake-menu/index.js +1 -10
- package/ebay-fake-menu/menu-item/index.js +1 -49
- package/ebay-fake-menu-button/index.js +1 -7
- package/ebay-fake-menu-button/menu-button/index.js +1 -12
- package/ebay-fake-tabs/index.js +1 -30
- package/ebay-field/index.js +1 -21
- package/ebay-fullscreen-dialog/index.js +1 -10
- package/ebay-icon/index.js +1 -4
- package/ebay-icon/types.d.ts +1 -1
- package/ebay-icon/types.d.ts.map +1 -1
- package/ebay-icon-button/index.js +1 -4
- package/ebay-infotip/index.js +1 -76
- package/ebay-inline-notice/index.js +1 -36
- package/ebay-lightbox-dialog/index.js +1 -12
- package/ebay-listbox-button/index.d.ts +2 -1
- package/ebay-listbox-button/index.d.ts.map +1 -1
- package/ebay-listbox-button/index.js +2 -151
- package/ebay-listbox-button/listbox-button-option.d.ts +10 -0
- package/ebay-listbox-button/listbox-button-option.d.ts.map +1 -0
- package/ebay-listbox-button/listbox-button.d.ts +5 -15
- package/ebay-listbox-button/listbox-button.d.ts.map +1 -1
- package/ebay-menu/index.js +1 -9
- package/ebay-menu-button/index.js +1 -113
- package/ebay-notice-base/index.js +1 -7
- package/ebay-page-notice/index.js +1 -50
- package/ebay-pagination/index.js +1 -244
- package/ebay-panel-dialog/index.js +1 -12
- package/ebay-progress-bar/index.js +1 -6
- package/ebay-progress-spinner/index.js +1 -4
- package/ebay-progress-stepper/index.js +1 -72
- package/ebay-radio/index.js +1 -4
- package/ebay-radio/radio/index.js +1 -48
- package/ebay-section-notice/index.js +1 -69
- package/ebay-section-title/index.js +1 -38
- package/ebay-segmented-buttons/index.js +1 -46
- package/ebay-select/index.js +1 -98
- package/ebay-signal/index.js +1 -9
- package/ebay-snackbar-dialog/index.js +1 -81
- package/ebay-split-button/index.js +1 -22
- package/ebay-star-rating/index.js +1 -9
- package/ebay-star-rating-select/index.js +1 -55
- package/ebay-svg/index.js +1 -5189
- package/ebay-svg/symbols.d.ts.map +1 -1
- package/ebay-switch/index.js +1 -27
- package/ebay-tabs/index.js +1 -88
- package/ebay-textbox/index.js +1 -10
- package/ebay-toast-dialog/index.js +1 -9
- package/ebay-toggle-button/README.md +39 -0
- package/ebay-toggle-button/index.d.ts +3 -0
- package/ebay-toggle-button/index.d.ts.map +1 -0
- package/ebay-toggle-button/index.js +1 -0
- package/ebay-toggle-button/toggle-button.d.ts +5 -0
- package/ebay-toggle-button/toggle-button.d.ts.map +1 -0
- package/ebay-toggle-button/types.d.ts +23 -0
- package/ebay-toggle-button/types.d.ts.map +1 -0
- package/ebay-toggle-button-group/README.md +56 -0
- package/ebay-toggle-button-group/index.d.ts +3 -0
- package/ebay-toggle-button-group/index.d.ts.map +1 -0
- package/ebay-toggle-button-group/index.js +1 -0
- package/ebay-toggle-button-group/toggle-button-group.d.ts +5 -0
- package/ebay-toggle-button-group/toggle-button-group.d.ts.map +1 -0
- package/ebay-toggle-button-group/types.d.ts +20 -0
- package/ebay-toggle-button-group/types.d.ts.map +1 -0
- package/ebay-tooltip/index.js +1 -64
- package/ebay-tourtip/index.js +1 -54
- package/ebay-video/index.js +1 -229
- package/events/index.js +1 -18
- package/icon-TuxfQndO.js +1 -0
- package/icon-button-Cwaj-eT9.js +1 -0
- package/label-CnrpYJ-g.js +1 -0
- package/menu-CV-INYLM.js +1 -0
- package/menu-_LzP6yje.js +1 -0
- package/menu-button-BZ66jxvI.js +1 -0
- package/notice-content-9iF4T8uB.js +1 -0
- package/notice-content-C0ZStfuX.js +1 -0
- package/notice-footer-Cw1DMzoB.js +1 -0
- package/package.json +2 -5
- package/progress-spinner-U2qOANON.js +1 -0
- package/range-DOsPN0h5.js +1 -0
- package/textbox-dUhinDwj.js +1 -0
- package/toggle-button-D8l0YB43.js +1 -0
- package/use-roving-index-DoAVBgsp.js +1 -0
- package/use-tooltip-CL3_zAeg.js +1 -0
- package/utils/index.js +1 -13
- package/array.polyfill.flat-DyxysTxZ.js +0 -21
- package/badge-CR5t7-2L.js +0 -8
- package/button-B4bZIgwB.js +0 -83
- package/calendar-D-DWjrMU.js +0 -333
- package/debounce-v8bWAUnY.js +0 -9
- package/dialog-previous-button-EC_Y6KaT.js +0 -370
- package/drawer-DBDktEBZ.js +0 -69
- package/ebay-listbox/README.md +0 -100
- package/ebay-listbox/index.d.ts +0 -4
- package/ebay-listbox/index.d.ts.map +0 -1
- package/ebay-listbox/index.js +0 -6
- package/ebay-listbox/listbox-option-description.d.ts +0 -4
- package/ebay-listbox/listbox-option-description.d.ts.map +0 -1
- package/ebay-listbox/listbox-option.d.ts +0 -10
- package/ebay-listbox/listbox-option.d.ts.map +0 -1
- package/ebay-listbox/listbox.d.ts +0 -22
- package/ebay-listbox/listbox.d.ts.map +0 -1
- package/icon-B17Di3YL.js +0 -56
- package/icon-button-BQWoMgX1.js +0 -31
- package/index-BXizW4ue.js +0 -89
- package/index-DcH7Tjjd.js +0 -272
- package/label-C0AS4fnO.js +0 -19
- package/listbox-DfOw_fJc.js +0 -662
- package/menu-Bsy48CE1.js +0 -163
- package/menu-button-CKGsgg6G.js +0 -89
- package/menu-fCOy6wBS.js +0 -29
- package/notice-content-BTXVxttv.js +0 -8
- package/notice-content-BhUeK1pd.js +0 -3
- package/notice-footer-CIQ8SM6N.js +0 -10
- package/progress-spinner-DOFKRtuu.js +0 -20
- package/range-C5qzyhg4.js +0 -3
- package/textbox-J291yCpJ.js +0 -136
- package/use-roving-index-CEM_UsCH.js +0 -58
- package/use-tooltip-7JxcZHJn.js +0 -92
- package/utils/scroll.d.ts +0 -2
- package/utils/scroll.d.ts.map +0 -1
package/menu-Bsy48CE1.js
DELETED
|
@@ -1,163 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const useRovingIndex = require("./use-roving-index-CEM_UsCH.js");
|
|
5
|
-
const common_eventUtils = require("./common/event-utils/index.js");
|
|
6
|
-
const common_componentUtils_forwardRef = require("./common/component-utils/forwardRef/index.js");
|
|
7
|
-
require("./array.polyfill.flat-DyxysTxZ.js");
|
|
8
|
-
const badge = require("./badge-CR5t7-2L.js");
|
|
9
|
-
const icon = require("./icon-B17Di3YL.js");
|
|
10
|
-
const EbayMenuItem = ({ className, checked, type, focused = false, tabIndex, disabled, badgeNumber, badgeAriaLabel, children, ...rest }) => {
|
|
11
|
-
const ref = React.useRef(null);
|
|
12
|
-
const hasBadge = badgeNumber !== void 0;
|
|
13
|
-
React.useEffect(() => {
|
|
14
|
-
if (ref.current && focused) {
|
|
15
|
-
ref.current.focus();
|
|
16
|
-
}
|
|
17
|
-
}, [ref, focused]);
|
|
18
|
-
const checkable = ["radio", "checkbox"];
|
|
19
|
-
return React.createElement(
|
|
20
|
-
"div",
|
|
21
|
-
{ "aria-label": badgeAriaLabel, ...rest, ref, className: classNames(className, "menu__item", hasBadge && "menu__item--badged"), role: roleFromType(type), "aria-checked": checkable.includes(type) ? checked : void 0, "aria-disabled": disabled, tabIndex: focused ? 0 : tabIndex },
|
|
22
|
-
React.createElement(
|
|
23
|
-
"span",
|
|
24
|
-
{ "aria-hidden": hasBadge },
|
|
25
|
-
children,
|
|
26
|
-
hasBadge && React.createElement(badge.EbayBadge, { type: "menu", number: badgeNumber })
|
|
27
|
-
),
|
|
28
|
-
React.createElement(icon.EbayIcon, { name: "tick16" })
|
|
29
|
-
);
|
|
30
|
-
};
|
|
31
|
-
function roleFromType(type) {
|
|
32
|
-
const roles = {
|
|
33
|
-
radio: "menuitemradio",
|
|
34
|
-
checkbox: "menuitemcheckbox"
|
|
35
|
-
};
|
|
36
|
-
return roles[type] || "menuitem";
|
|
37
|
-
}
|
|
38
|
-
const EbayMenu = ({ baseEl: Container = "span", type, priority = "secondary", checked, className, autofocus, onClick = () => {
|
|
39
|
-
}, onKeyDown = () => {
|
|
40
|
-
}, onChange = () => {
|
|
41
|
-
}, onSelect = () => {
|
|
42
|
-
}, forwardedRef, children, ...rest }) => {
|
|
43
|
-
const childrenArray = React.Children.toArray(children);
|
|
44
|
-
const [focusedIndex, setFocusedIndex] = useRovingIndex.useRovingIndex(children, EbayMenuItem, autofocus === true ? 0 : void 0);
|
|
45
|
-
const [checkedIndexes, setCheckedIndexes] = React.useState(childrenArray.map(() => false));
|
|
46
|
-
const valuesFromChecked = (indexes) => childrenArray.reduce((values, item, i) => indexes[i] ? [...values, item.props.value] : values, []);
|
|
47
|
-
const indexesFromChecked = (indexes) => indexes.reduce((all, value, i) => value ? [...all, i] : all, []);
|
|
48
|
-
const eventProps = (index, indexes) => ({
|
|
49
|
-
index,
|
|
50
|
-
checked: indexesFromChecked(indexes)
|
|
51
|
-
});
|
|
52
|
-
const checkboxEventProps = (index, indexes) => ({
|
|
53
|
-
...eventProps(index, indexes),
|
|
54
|
-
indexes: indexesFromChecked(indexes),
|
|
55
|
-
checkedValues: valuesFromChecked(indexes)
|
|
56
|
-
});
|
|
57
|
-
const updateIndex = (index, value, resetOthers = false) => {
|
|
58
|
-
let anyChanges = false;
|
|
59
|
-
const newValues = checkedIndexes.map((indexChecked, i) => {
|
|
60
|
-
const defaultValue = resetOthers ? false : indexChecked;
|
|
61
|
-
if (index === i) {
|
|
62
|
-
if (indexChecked !== value) {
|
|
63
|
-
anyChanges = true;
|
|
64
|
-
}
|
|
65
|
-
return value;
|
|
66
|
-
}
|
|
67
|
-
return defaultValue;
|
|
68
|
-
});
|
|
69
|
-
if (anyChanges) {
|
|
70
|
-
setCheckedIndexes(newValues);
|
|
71
|
-
return newValues;
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
const selectIndex = (index) => {
|
|
75
|
-
switch (type) {
|
|
76
|
-
case "radio":
|
|
77
|
-
return updateIndex(index, true, true);
|
|
78
|
-
case "checkbox":
|
|
79
|
-
return updateIndex(index, !checkedIndexes[index], false);
|
|
80
|
-
default:
|
|
81
|
-
return checkedIndexes.map((_, i) => i === index);
|
|
82
|
-
}
|
|
83
|
-
};
|
|
84
|
-
React.useEffect(() => {
|
|
85
|
-
if (type === "radio") {
|
|
86
|
-
if (checked === void 0) {
|
|
87
|
-
const checkedIndex = childrenArray.findIndex((child) => child.props.checked);
|
|
88
|
-
if (checkedIndex > -1) {
|
|
89
|
-
selectIndex(checkedIndex);
|
|
90
|
-
}
|
|
91
|
-
} else {
|
|
92
|
-
selectIndex(checked);
|
|
93
|
-
}
|
|
94
|
-
} else if (type === "checkbox") {
|
|
95
|
-
setCheckedIndexes(childrenArray.map((child) => Boolean(child.props.checked)));
|
|
96
|
-
}
|
|
97
|
-
}, []);
|
|
98
|
-
const handleChange = (e, index, newValues) => {
|
|
99
|
-
switch (type) {
|
|
100
|
-
case "radio":
|
|
101
|
-
case "checkbox":
|
|
102
|
-
return onChange(e, checkboxEventProps(index, newValues));
|
|
103
|
-
default:
|
|
104
|
-
return onSelect(e, eventProps(index, newValues));
|
|
105
|
-
}
|
|
106
|
-
};
|
|
107
|
-
const handleKeyDown = (e, index) => {
|
|
108
|
-
let newValues;
|
|
109
|
-
if (common_eventUtils.isActionKey(e.key)) {
|
|
110
|
-
newValues = selectIndex(index);
|
|
111
|
-
if (newValues) {
|
|
112
|
-
handleChange(e, index, newValues);
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
switch (type) {
|
|
116
|
-
case "radio":
|
|
117
|
-
case "checkbox":
|
|
118
|
-
return onKeyDown(e, checkboxEventProps(index, newValues || checkedIndexes));
|
|
119
|
-
default:
|
|
120
|
-
return onKeyDown(e, eventProps(index, newValues || checkedIndexes));
|
|
121
|
-
}
|
|
122
|
-
};
|
|
123
|
-
const handleClick = (e, index) => {
|
|
124
|
-
setFocusedIndex(index);
|
|
125
|
-
const newValues = selectIndex(index);
|
|
126
|
-
if (newValues) {
|
|
127
|
-
handleChange(e, index, newValues);
|
|
128
|
-
}
|
|
129
|
-
};
|
|
130
|
-
return React.createElement(
|
|
131
|
-
Container,
|
|
132
|
-
{ ...rest, className: classNames(className, "menu") },
|
|
133
|
-
React.createElement("div", { className: "menu__items", role: "menu", ref: forwardedRef }, childrenArray.map((child, i) => {
|
|
134
|
-
const { onClick: onItemClick = () => {
|
|
135
|
-
}, onFocus: onItemFocus = () => {
|
|
136
|
-
}, onKeyDown: onItemKeyDown = () => {
|
|
137
|
-
}, ...itemRest } = child.props;
|
|
138
|
-
return React.cloneElement(child, {
|
|
139
|
-
...itemRest,
|
|
140
|
-
type,
|
|
141
|
-
focused: i === focusedIndex,
|
|
142
|
-
tabIndex: focusedIndex === void 0 ? 0 : -1,
|
|
143
|
-
checked: checkedIndexes[i],
|
|
144
|
-
onFocus: (e) => {
|
|
145
|
-
setFocusedIndex(i);
|
|
146
|
-
onItemFocus(e);
|
|
147
|
-
},
|
|
148
|
-
onClick: (e) => {
|
|
149
|
-
handleClick(e, i);
|
|
150
|
-
onItemClick(e);
|
|
151
|
-
onClick(e);
|
|
152
|
-
},
|
|
153
|
-
onKeyDown: (e) => {
|
|
154
|
-
handleKeyDown(e, i);
|
|
155
|
-
onItemKeyDown(e);
|
|
156
|
-
}
|
|
157
|
-
});
|
|
158
|
-
}))
|
|
159
|
-
);
|
|
160
|
-
};
|
|
161
|
-
const EbayMenu$1 = common_componentUtils_forwardRef.withForwardRef(EbayMenu);
|
|
162
|
-
exports.EbayMenu = EbayMenu$1;
|
|
163
|
-
exports.EbayMenuItem = EbayMenuItem;
|
package/menu-button-CKGsgg6G.js
DELETED
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const common_componentUtils_utils = require("./common/component-utils/utils/index.js");
|
|
5
|
-
const common_eventUtils = require("./common/event-utils/index.js");
|
|
6
|
-
const common_randomId = require("./common/random-id/index.js");
|
|
7
|
-
const button = require("./button-B4bZIgwB.js");
|
|
8
|
-
const icon = require("./icon-B17Di3YL.js");
|
|
9
|
-
const iconButton = require("./icon-button-BQWoMgX1.js");
|
|
10
|
-
const menu = require("./menu-fCOy6wBS.js");
|
|
11
|
-
const ebayFakeMenu_menuItem = require("./ebay-fake-menu/menu-item/index.js");
|
|
12
|
-
const EbayFakeMenuButtonItem = ebayFakeMenu_menuItem;
|
|
13
|
-
const EbayMenuButtonSeparator = ({ className, ...rest }) => React.createElement("hr", { ...rest, className: classNames(className, "menu-button__separator"), role: "separator" });
|
|
14
|
-
const EbayFakeMenuButtonLabel = ({ children }) => React.createElement(React.Fragment, null, children);
|
|
15
|
-
const EbayMenuButton = ({ a11yText, noToggleIcon, fixWidth, reverse, variant, expanded: defaultExpanded = false, className, onCollapse = () => {
|
|
16
|
-
}, onExpand = () => {
|
|
17
|
-
}, onMouseDown = () => {
|
|
18
|
-
}, onSelect = () => {
|
|
19
|
-
}, text = "", children, ...rest }) => {
|
|
20
|
-
const [expanded, setExpanded] = React.useState(defaultExpanded);
|
|
21
|
-
const [menuId, setMenuId] = React.useState();
|
|
22
|
-
const ref = React.useRef();
|
|
23
|
-
const icon$1 = common_componentUtils_utils.findComponent(children, icon.EbayIcon);
|
|
24
|
-
const label = common_componentUtils_utils.findComponent(children, EbayFakeMenuButtonLabel) || (icon$1 ? React.createElement("span", null, text) : text);
|
|
25
|
-
const menuItems = common_componentUtils_utils.filterByType(children, [EbayFakeMenuButtonItem, EbayMenuButtonSeparator]);
|
|
26
|
-
React.useEffect(() => {
|
|
27
|
-
const handleBackgroundClick = (e) => {
|
|
28
|
-
if (ref.current && !ref.current.contains(e.currentTarget)) {
|
|
29
|
-
setExpanded(false);
|
|
30
|
-
}
|
|
31
|
-
};
|
|
32
|
-
if (expanded) {
|
|
33
|
-
onExpand();
|
|
34
|
-
setTimeout(() => {
|
|
35
|
-
document.addEventListener("click", handleBackgroundClick, false);
|
|
36
|
-
});
|
|
37
|
-
} else if (expanded === false) {
|
|
38
|
-
onCollapse();
|
|
39
|
-
}
|
|
40
|
-
return () => document.removeEventListener("click", handleBackgroundClick, false);
|
|
41
|
-
}, [expanded]);
|
|
42
|
-
React.useEffect(() => {
|
|
43
|
-
setMenuId(common_randomId.randomId());
|
|
44
|
-
}, []);
|
|
45
|
-
const handleMenuKeydown = (e) => {
|
|
46
|
-
common_eventUtils.handleEscapeKeydown(e, () => {
|
|
47
|
-
var _a;
|
|
48
|
-
setExpanded(false);
|
|
49
|
-
(_a = ref.current) == null ? void 0 : _a.focus();
|
|
50
|
-
});
|
|
51
|
-
};
|
|
52
|
-
const menuClasses = classNames("fake-menu-button__menu", {
|
|
53
|
-
"menu-button__menu--fix-width": fixWidth,
|
|
54
|
-
"menu-button__menu--reverse": reverse
|
|
55
|
-
});
|
|
56
|
-
const buttonProps = {
|
|
57
|
-
ref,
|
|
58
|
-
className: "fake-menu-button__button",
|
|
59
|
-
"aria-expanded": !!expanded,
|
|
60
|
-
"aria-haspopup": true,
|
|
61
|
-
"aria-label": a11yText,
|
|
62
|
-
"aria-controls": menuId,
|
|
63
|
-
onClick: () => setExpanded(!expanded),
|
|
64
|
-
...rest
|
|
65
|
-
};
|
|
66
|
-
return React.createElement(
|
|
67
|
-
"span",
|
|
68
|
-
{ className: classNames("fake-menu-button", className) },
|
|
69
|
-
variant === "overflow" ? React.createElement(iconButton.EbayIconButton, { icon: "overflowHorizontal24", ...buttonProps }) : React.createElement(
|
|
70
|
-
button.EbayButton,
|
|
71
|
-
{ variant: variant === "form" ? "form" : void 0, bodyState: noToggleIcon ? void 0 : "expand", ...buttonProps },
|
|
72
|
-
icon$1,
|
|
73
|
-
label
|
|
74
|
-
),
|
|
75
|
-
expanded && React.createElement(menu.EbayFakeMenu, { className: menuClasses, id: menuId, tabIndex: -1, onKeyDown: handleMenuKeydown, onSelect }, menuItems.map((item, i) => React.cloneElement(item, {
|
|
76
|
-
...item.props,
|
|
77
|
-
onMouseDown: (e) => {
|
|
78
|
-
onMouseDown(e, { index: i });
|
|
79
|
-
},
|
|
80
|
-
className: classNames(item.props.className, "fake-menu-button__item"),
|
|
81
|
-
key: i,
|
|
82
|
-
autoFocus: i === 0
|
|
83
|
-
})))
|
|
84
|
-
);
|
|
85
|
-
};
|
|
86
|
-
exports.EbayFakeMenuButtonItem = EbayFakeMenuButtonItem;
|
|
87
|
-
exports.EbayFakeMenuButtonLabel = EbayFakeMenuButtonLabel;
|
|
88
|
-
exports.EbayMenuButton = EbayMenuButton;
|
|
89
|
-
exports.EbayMenuButtonSeparator = EbayMenuButtonSeparator;
|
package/menu-fCOy6wBS.js
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const EbayFakeMenu = ({ className, itemMatchesUrl = true, onKeyDown = () => {
|
|
5
|
-
}, onSelect = () => {
|
|
6
|
-
}, children, ...rest }) => {
|
|
7
|
-
const childrenArray = React.Children.toArray(children);
|
|
8
|
-
const defaultAriaCurrent = itemMatchesUrl === false ? "true" : "page";
|
|
9
|
-
return React.createElement(
|
|
10
|
-
"div",
|
|
11
|
-
{ ...rest, className: classNames(className, "fake-menu") },
|
|
12
|
-
React.createElement("ul", { className: "fake-menu__items", tabIndex: -1 }, childrenArray.map((child, i) => {
|
|
13
|
-
const { current, onClick = () => {
|
|
14
|
-
}, ...itemRest } = child.props;
|
|
15
|
-
return React.createElement("li", { key: i }, React.cloneElement(child, {
|
|
16
|
-
...itemRest,
|
|
17
|
-
"aria-current": current ? defaultAriaCurrent : void 0,
|
|
18
|
-
onClick: (e) => {
|
|
19
|
-
onSelect(e, { index: i });
|
|
20
|
-
onClick(e);
|
|
21
|
-
},
|
|
22
|
-
onKeyDown: (e) => {
|
|
23
|
-
onKeyDown(e, { index: i });
|
|
24
|
-
}
|
|
25
|
-
}));
|
|
26
|
-
}))
|
|
27
|
-
);
|
|
28
|
-
};
|
|
29
|
-
exports.EbayFakeMenu = EbayFakeMenu;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const NoticeContent = ({ className, type, children }) => {
|
|
5
|
-
const ContentTag = type === "inline" ? "span" : "div";
|
|
6
|
-
return React.createElement(ContentTag, { className: classNames(className, `${type}-notice__main`) }, children);
|
|
7
|
-
};
|
|
8
|
-
exports.NoticeContent = NoticeContent;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const NoticeTitle = ({ className, type, as, children, ...rest }) => {
|
|
5
|
-
const HeadingTag = as || `h2`;
|
|
6
|
-
return React.createElement(HeadingTag, { className: classNames(className, `${type}-notice__title`), ...rest }, children);
|
|
7
|
-
};
|
|
8
|
-
const NoticeFooter = ({ className, type, children, ...rest }) => React.createElement("div", { className: classNames(className, `${type}-notice__footer`), ...rest }, children);
|
|
9
|
-
exports.NoticeFooter = NoticeFooter;
|
|
10
|
-
exports.NoticeTitle = NoticeTitle;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const icon = require("./icon-B17Di3YL.js");
|
|
5
|
-
const sizeClass = {
|
|
6
|
-
"default": "",
|
|
7
|
-
"small": "progress-spinner--small",
|
|
8
|
-
"large": "progress-spinner--large"
|
|
9
|
-
};
|
|
10
|
-
const iconName = {
|
|
11
|
-
"default": "spinner24",
|
|
12
|
-
"small": "spinner20",
|
|
13
|
-
"large": "spinner30"
|
|
14
|
-
};
|
|
15
|
-
const EbayProgressSpinner = ({ size = "default", "aria-label": ariaLabel = "Busy", className, ...rest }) => React.createElement(
|
|
16
|
-
"span",
|
|
17
|
-
{ ...rest, className: classNames("progress-spinner", sizeClass[size], className), "aria-label": ariaLabel, role: "img" },
|
|
18
|
-
React.createElement(icon.EbayIcon, { name: iconName[size] })
|
|
19
|
-
);
|
|
20
|
-
exports.EbayProgressSpinner = EbayProgressSpinner;
|
package/range-C5qzyhg4.js
DELETED
package/textbox-J291yCpJ.js
DELETED
|
@@ -1,136 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const common_componentUtils_forwardRef = require("./common/component-utils/forwardRef/index.js");
|
|
5
|
-
const common_componentUtils_utils = require("./common/component-utils/utils/index.js");
|
|
6
|
-
const icon = require("./icon-B17Di3YL.js");
|
|
7
|
-
const iconButton = require("./icon-button-BQWoMgX1.js");
|
|
8
|
-
const common_floatingLabelUtils_hooks = require("./common/floating-label-utils/hooks/index.js");
|
|
9
|
-
const EbayTextboxPostfixIcon = ({ name, buttonAriaLabel, onClick = () => {
|
|
10
|
-
}, ...rest }) => buttonAriaLabel ? React.createElement(iconButton.EbayIconButton, { "aria-label": buttonAriaLabel, icon: name, transparent: true, onClick, ...rest }) : React.createElement(icon.EbayIcon, { name, ...rest });
|
|
11
|
-
const EbayTextboxPostfixText = (props) => React.createElement("span", { ...props });
|
|
12
|
-
const EbayTextboxPrefixIcon = ({ name, ...rest }) => React.createElement(icon.EbayIcon, { name, ...rest });
|
|
13
|
-
const EbayTextboxPrefixText = (props) => React.createElement("span", { ...props });
|
|
14
|
-
const isControlled = (value) => typeof value !== "undefined";
|
|
15
|
-
const EbayTextbox = ({ type = "text", invalid, fluid, multiline, onChange = () => {
|
|
16
|
-
}, onInputChange = () => {
|
|
17
|
-
}, onFocus = () => {
|
|
18
|
-
}, onBlur = () => {
|
|
19
|
-
}, onKeyPress = () => {
|
|
20
|
-
}, onKeyUp = () => {
|
|
21
|
-
}, onKeyDown = () => {
|
|
22
|
-
}, onInvalid = () => {
|
|
23
|
-
}, onFloatingLabelInit = () => {
|
|
24
|
-
}, onButtonClick = () => {
|
|
25
|
-
}, autoFocus, defaultValue = "", value: controlledValue, forwardedRef, inputSize = "default", floatingLabel, children, placeholder, opaqueLabel, ...rest }) => {
|
|
26
|
-
var _a, _b;
|
|
27
|
-
const [value, setValue] = React.useState(defaultValue);
|
|
28
|
-
const [inputValue, setInputValue] = React.useState(defaultValue);
|
|
29
|
-
const { label, Container, onBlur: onFloatingLabelBlur, onFocus: onFloatingLabelFocus, ref, placeholder: floatingLabelPlaceholder } = common_floatingLabelUtils_hooks.useFloatingLabel({
|
|
30
|
-
ref: forwardedRef,
|
|
31
|
-
inputId: rest.id,
|
|
32
|
-
className: rest.className,
|
|
33
|
-
disabled: rest.disabled,
|
|
34
|
-
label: floatingLabel,
|
|
35
|
-
inputSize,
|
|
36
|
-
inputValue: controlledValue || inputValue,
|
|
37
|
-
placeholder,
|
|
38
|
-
invalid,
|
|
39
|
-
type,
|
|
40
|
-
opaqueLabel,
|
|
41
|
-
onMount: onFloatingLabelInit
|
|
42
|
-
});
|
|
43
|
-
const handleFocus = (event) => {
|
|
44
|
-
var _a2;
|
|
45
|
-
onFocus(event, { value: ((_a2 = event == null ? void 0 : event.target) == null ? void 0 : _a2.value) || defaultValue });
|
|
46
|
-
onFloatingLabelFocus();
|
|
47
|
-
};
|
|
48
|
-
const handleBlur = (event) => {
|
|
49
|
-
var _a2;
|
|
50
|
-
const newValue = (_a2 = event.target) == null ? void 0 : _a2.value;
|
|
51
|
-
onBlur(event, { value: newValue });
|
|
52
|
-
if (newValue !== value) {
|
|
53
|
-
onChange(event, { value: newValue });
|
|
54
|
-
setValue(newValue);
|
|
55
|
-
}
|
|
56
|
-
onFloatingLabelBlur();
|
|
57
|
-
};
|
|
58
|
-
const handleKeyPress = (event) => {
|
|
59
|
-
const textbox = event.target;
|
|
60
|
-
onKeyPress(event, { value: textbox == null ? void 0 : textbox.value });
|
|
61
|
-
};
|
|
62
|
-
const handleKeyUp = (event) => {
|
|
63
|
-
const textbox = event.target;
|
|
64
|
-
onKeyUp(event, { value: textbox == null ? void 0 : textbox.value });
|
|
65
|
-
};
|
|
66
|
-
const handleKeyDown = (event) => {
|
|
67
|
-
const textbox = event.target;
|
|
68
|
-
onKeyDown(event, { value: textbox == null ? void 0 : textbox.value });
|
|
69
|
-
};
|
|
70
|
-
const handleInvalid = (event) => {
|
|
71
|
-
const textbox = event.target;
|
|
72
|
-
onInvalid(event, { value: textbox == null ? void 0 : textbox.value });
|
|
73
|
-
};
|
|
74
|
-
const handleButtonClick = (event) => {
|
|
75
|
-
onButtonClick(event, { value });
|
|
76
|
-
};
|
|
77
|
-
React.useEffect(() => {
|
|
78
|
-
if (autoFocus) {
|
|
79
|
-
handleFocus();
|
|
80
|
-
}
|
|
81
|
-
}, []);
|
|
82
|
-
const handleInputChange = (e) => {
|
|
83
|
-
var _a2;
|
|
84
|
-
const newValue = (_a2 = e.target) == null ? void 0 : _a2.value;
|
|
85
|
-
if (!isControlled(controlledValue)) {
|
|
86
|
-
setInputValue(newValue);
|
|
87
|
-
}
|
|
88
|
-
onInputChange(e, { value: newValue });
|
|
89
|
-
};
|
|
90
|
-
const Input = multiline ? "textarea" : "input";
|
|
91
|
-
const Wrapper = fluid ? "div" : "span";
|
|
92
|
-
const prefixIcon = common_componentUtils_utils.findComponent(children, EbayTextboxPrefixIcon);
|
|
93
|
-
const prefixText = common_componentUtils_utils.findComponent(children, EbayTextboxPrefixText);
|
|
94
|
-
const prefixId = (_a = prefixText == null ? void 0 : prefixText.props) == null ? void 0 : _a.id;
|
|
95
|
-
const postfixIcon = common_componentUtils_utils.findComponent(children, EbayTextboxPostfixIcon);
|
|
96
|
-
const postfixText = common_componentUtils_utils.findComponent(children, EbayTextboxPostfixText);
|
|
97
|
-
const postfixId = (_b = postfixText == null ? void 0 : postfixText.props) == null ? void 0 : _b.id;
|
|
98
|
-
const wrapperClassName = classNames("textbox", rest.className, {
|
|
99
|
-
"textbox--fluid": fluid,
|
|
100
|
-
"textbox--large": inputSize === "large",
|
|
101
|
-
/** start remove after `:has` support */
|
|
102
|
-
"textbox--disabled": rest.disabled,
|
|
103
|
-
"textbox--invalid": invalid,
|
|
104
|
-
"textbox--readonly": rest.readOnly
|
|
105
|
-
/** end remove after `:has` support */
|
|
106
|
-
});
|
|
107
|
-
return React.createElement(
|
|
108
|
-
Container,
|
|
109
|
-
null,
|
|
110
|
-
label,
|
|
111
|
-
React.createElement(
|
|
112
|
-
Wrapper,
|
|
113
|
-
{ className: wrapperClassName },
|
|
114
|
-
prefixIcon,
|
|
115
|
-
prefixText,
|
|
116
|
-
React.createElement(Input, { "aria-describedby": [prefixId, postfixId].filter(Boolean).join(" ") || void 0, ...rest, className: "textbox__control", type, "aria-invalid": invalid, value: isControlled(controlledValue) ? controlledValue : inputValue, onChange: handleInputChange, onBlur: handleBlur, onFocus: handleFocus, onKeyPress: handleKeyPress, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, onInvalid: handleInvalid, autoFocus, ref, placeholder: floatingLabelPlaceholder }),
|
|
117
|
-
postfixText,
|
|
118
|
-
postfixIcon && React.cloneElement(postfixIcon, {
|
|
119
|
-
...postfixIcon.props,
|
|
120
|
-
onClick: (e) => {
|
|
121
|
-
const { onClick: iconClick = () => {
|
|
122
|
-
} } = postfixIcon.props;
|
|
123
|
-
iconClick(e);
|
|
124
|
-
handleButtonClick(e);
|
|
125
|
-
}
|
|
126
|
-
})
|
|
127
|
-
)
|
|
128
|
-
);
|
|
129
|
-
};
|
|
130
|
-
const EbayTextbox$1 = common_componentUtils_forwardRef.withForwardRef(EbayTextbox);
|
|
131
|
-
exports.EbayTextbox = EbayTextbox$1;
|
|
132
|
-
exports.EbayTextboxPostfixIcon = EbayTextboxPostfixIcon;
|
|
133
|
-
exports.EbayTextboxPostfixText = EbayTextboxPostfixText;
|
|
134
|
-
exports.EbayTextboxPrefixIcon = EbayTextboxPrefixIcon;
|
|
135
|
-
exports.EbayTextboxPrefixText = EbayTextboxPrefixText;
|
|
136
|
-
exports.isControlled = isControlled;
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const useKeyPress = () => {
|
|
4
|
-
const [arrowUpPressed, setArrowUpPressed] = React.useState(false);
|
|
5
|
-
const [arrowDownPressed, setArrowDownPressed] = React.useState(false);
|
|
6
|
-
const upHandler = ({ key }) => {
|
|
7
|
-
const fn = {
|
|
8
|
-
ArrowUp: setArrowUpPressed,
|
|
9
|
-
ArrowDown: setArrowDownPressed
|
|
10
|
-
}[key];
|
|
11
|
-
if (fn)
|
|
12
|
-
fn(false);
|
|
13
|
-
};
|
|
14
|
-
const downHandler = ({ key }) => {
|
|
15
|
-
const fn = {
|
|
16
|
-
ArrowUp: setArrowUpPressed,
|
|
17
|
-
ArrowDown: setArrowDownPressed
|
|
18
|
-
}[key];
|
|
19
|
-
if (fn)
|
|
20
|
-
fn(true);
|
|
21
|
-
};
|
|
22
|
-
React.useEffect(() => {
|
|
23
|
-
window.addEventListener("keydown", downHandler);
|
|
24
|
-
window.addEventListener("keyup", upHandler);
|
|
25
|
-
return () => {
|
|
26
|
-
window.removeEventListener("keydown", downHandler);
|
|
27
|
-
window.removeEventListener("keyup", upHandler);
|
|
28
|
-
};
|
|
29
|
-
}, []);
|
|
30
|
-
return [arrowUpPressed, arrowDownPressed];
|
|
31
|
-
};
|
|
32
|
-
const useRovingIndex = (children, FocusableType, defaultValue) => {
|
|
33
|
-
const [rovingIndex, setRovingIndex] = React.useState(defaultValue);
|
|
34
|
-
const [arrowUpPressed, arrowDownPressed] = useKeyPress();
|
|
35
|
-
const rovingIndexArray = React.Children.toArray(children).reduce((focusables, child, i) => child.type === FocusableType ? [...focusables, i] : focusables, []);
|
|
36
|
-
const currentIndex = rovingIndexArray.indexOf(rovingIndex);
|
|
37
|
-
const previousOrCurrent = () => {
|
|
38
|
-
if (currentIndex === -1)
|
|
39
|
-
return rovingIndex;
|
|
40
|
-
const previousRovingIndex = rovingIndexArray[currentIndex - 1];
|
|
41
|
-
return previousRovingIndex === void 0 ? rovingIndex : previousRovingIndex;
|
|
42
|
-
};
|
|
43
|
-
const nextOrCurrent = () => {
|
|
44
|
-
if (currentIndex === -1)
|
|
45
|
-
return rovingIndex;
|
|
46
|
-
const nextRovingIndex = rovingIndexArray[currentIndex + 1];
|
|
47
|
-
return nextRovingIndex === void 0 ? rovingIndex : nextRovingIndex;
|
|
48
|
-
};
|
|
49
|
-
React.useEffect(() => {
|
|
50
|
-
if (arrowUpPressed)
|
|
51
|
-
setRovingIndex(previousOrCurrent());
|
|
52
|
-
if (arrowDownPressed)
|
|
53
|
-
setRovingIndex(nextOrCurrent());
|
|
54
|
-
}, [arrowUpPressed, arrowDownPressed]);
|
|
55
|
-
return [rovingIndex, setRovingIndex];
|
|
56
|
-
};
|
|
57
|
-
exports.useKeyPress = useKeyPress;
|
|
58
|
-
exports.useRovingIndex = useRovingIndex;
|
package/use-tooltip-7JxcZHJn.js
DELETED
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const React = require("react");
|
|
3
|
-
const classNames = require("classnames");
|
|
4
|
-
const common_componentUtils_forwardRef = require("./common/component-utils/forwardRef/index.js");
|
|
5
|
-
const common_componentUtils_utils = require("./common/component-utils/utils/index.js");
|
|
6
|
-
const icon = require("./icon-B17Di3YL.js");
|
|
7
|
-
const common_tooltipUtils_constants = require("./common/tooltip-utils/constants/index.js");
|
|
8
|
-
const TooltipHost = ({ children, className, forwardedRef, ...rest }) => {
|
|
9
|
-
React.Children.only(children);
|
|
10
|
-
return React.cloneElement(children, {
|
|
11
|
-
ref: forwardedRef,
|
|
12
|
-
...rest,
|
|
13
|
-
className: classNames(className, children.props.className)
|
|
14
|
-
});
|
|
15
|
-
};
|
|
16
|
-
const Tooltip = ({ className, type, isExpanded, children, forwardedRef, ...rest }) => {
|
|
17
|
-
var _a;
|
|
18
|
-
const originalHostComponent = common_componentUtils_utils.findComponent(children, TooltipHost);
|
|
19
|
-
const content = common_componentUtils_utils.excludeComponent(children, TooltipHost)[0];
|
|
20
|
-
if (!originalHostComponent) {
|
|
21
|
-
throw new Error(`Tooltip: Please use a TooltipHost that defines the host of the tooltip`);
|
|
22
|
-
}
|
|
23
|
-
const host = React.cloneElement(originalHostComponent, {
|
|
24
|
-
className: `${type}__host`,
|
|
25
|
-
"aria-expanded": isExpanded,
|
|
26
|
-
"aria-describedby": (_a = content == null ? void 0 : content.props) == null ? void 0 : _a.id,
|
|
27
|
-
...originalHostComponent.props
|
|
28
|
-
});
|
|
29
|
-
return React.createElement(
|
|
30
|
-
"span",
|
|
31
|
-
{ ...rest, ref: forwardedRef, className: classNames(className, type, {
|
|
32
|
-
[`${type}--expanded`]: isExpanded
|
|
33
|
-
}) },
|
|
34
|
-
host,
|
|
35
|
-
content
|
|
36
|
-
);
|
|
37
|
-
};
|
|
38
|
-
const Tooltip$1 = common_componentUtils_forwardRef.withForwardRef(Tooltip);
|
|
39
|
-
const TooltipCloseButton = () => null;
|
|
40
|
-
const TooltipFooter = ({ children, className, type = "tourtip" }) => React.createElement("div", { className: classNames(`${type}__footer`, className) }, children);
|
|
41
|
-
const TooltipContent = ({ id, style, pointer = common_tooltipUtils_constants.DEFAULT_POINTER_DIRECTION, children, type = "tooltip", showCloseButton, a11yCloseText, onClose }) => {
|
|
42
|
-
const closeButton = common_componentUtils_utils.findComponent(children, TooltipCloseButton);
|
|
43
|
-
const footer = common_componentUtils_utils.findComponent(children, TooltipFooter);
|
|
44
|
-
const allChildrenExceptFooter = common_componentUtils_utils.excludeComponent(children, TooltipFooter);
|
|
45
|
-
return React.createElement(
|
|
46
|
-
"span",
|
|
47
|
-
{ className: `${type}__overlay`, id, role: common_tooltipUtils_constants.TYPE_ROLES[type] || null, style: { ...common_tooltipUtils_constants.POINTER_STYLES[pointer], ...style } },
|
|
48
|
-
React.createElement("span", { className: `${type}__pointer ${type}__pointer--${pointer}` }),
|
|
49
|
-
React.createElement(
|
|
50
|
-
"span",
|
|
51
|
-
{ className: `${type}__mask` },
|
|
52
|
-
React.createElement(
|
|
53
|
-
"span",
|
|
54
|
-
{ className: `${type}__cell` },
|
|
55
|
-
React.createElement("span", { className: `${type}__content` }, allChildrenExceptFooter),
|
|
56
|
-
showCloseButton ? React.createElement(
|
|
57
|
-
"button",
|
|
58
|
-
{ ...closeButton == null ? void 0 : closeButton.props, className: `icon-btn icon-btn--transparent ${type}__close`, type: "button", "aria-label": a11yCloseText, onClick: onClose },
|
|
59
|
-
React.createElement(icon.EbayIcon, { name: "close16" })
|
|
60
|
-
) : null,
|
|
61
|
-
footer
|
|
62
|
-
)
|
|
63
|
-
)
|
|
64
|
-
);
|
|
65
|
-
};
|
|
66
|
-
const useTooltip = ({ onExpand, onCollapse, initialExpanded = false, hostRef }) => {
|
|
67
|
-
const [isExpanded, setIsExpanded] = React.useState(initialExpanded);
|
|
68
|
-
const expandTooltip = () => {
|
|
69
|
-
setIsExpanded(true);
|
|
70
|
-
if (onExpand) {
|
|
71
|
-
onExpand();
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
const collapseTooltip = () => {
|
|
75
|
-
var _a;
|
|
76
|
-
setIsExpanded(false);
|
|
77
|
-
if (onCollapse) {
|
|
78
|
-
onCollapse();
|
|
79
|
-
}
|
|
80
|
-
(_a = hostRef == null ? void 0 : hostRef.current) == null ? void 0 : _a.focus();
|
|
81
|
-
};
|
|
82
|
-
return {
|
|
83
|
-
isExpanded,
|
|
84
|
-
expandTooltip,
|
|
85
|
-
collapseTooltip
|
|
86
|
-
};
|
|
87
|
-
};
|
|
88
|
-
exports.Tooltip = Tooltip$1;
|
|
89
|
-
exports.TooltipContent = TooltipContent;
|
|
90
|
-
exports.TooltipFooter = TooltipFooter;
|
|
91
|
-
exports.TooltipHost = TooltipHost;
|
|
92
|
-
exports.useTooltip = useTooltip;
|
package/utils/scroll.d.ts
DELETED
package/utils/scroll.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.d.ts","sourceRoot":"","sources":["../../src/utils/scroll.ts"],"names":[],"mappings":"AAAA,wBAAgB,MAAM,CAAC,EAAE,CAAC,EAAE,WAAW,GAAG,IAAI,CAc7C"}
|