@ebay/ui-core-react 3.4.1 → 3.5.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/ebay-fake-menu-button/README.md +7 -3
- package/ebay-fake-menu-button/index.d.ts +1 -1
- package/ebay-fake-menu-button/index.d.ts.map +1 -1
- package/ebay-fake-menu-button/menu-button.d.ts +12 -3
- package/ebay-fake-menu-button/menu-button.d.ts.map +1 -1
- package/ebay-fake-menu-button/menu-button.js +21 -10
- package/index.d.ts +1 -1
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -40,12 +40,16 @@ import '@ebay/skin/menu-button';
|
|
|
40
40
|
Name | Type | Required | Description
|
|
41
41
|
--- | --- | --- | ---
|
|
42
42
|
`text` | String | No | Button label text
|
|
43
|
-
`icon` | String | No | Name of an <EbayIcon> to show to the left of the text (Not yet implemented)
|
|
44
43
|
`a11y-text` | String | Only without a text label | A11y text for the button
|
|
44
|
+
`noToggleIcon` | Boolean | No | whether to hide the chevron toggle icon
|
|
45
|
+
`expanded` | Boolean | No | whether content is expanded
|
|
45
46
|
`type` | String | No | Not yet implemented
|
|
46
|
-
`
|
|
47
|
+
`variant` | String | No | will change the button style: `overflow`, `form` or `button`
|
|
48
|
+
`priority` | String | No | button priority, only used when `variant` is `button`
|
|
49
|
+
`reverse` | Boolean | No | expand menu flyout to the left
|
|
50
|
+
`fixWidth` | Boolean | No | Constrain items container width to button width
|
|
47
51
|
`borderless` | Boolean | No | Whether button has borders
|
|
48
|
-
`
|
|
52
|
+
`size` | String | No | button size: `large` or `regular` (default)
|
|
49
53
|
`onExpand` | Function | No | Triggered on menu expand
|
|
50
54
|
`onCollapse` | Function | No | Triggered on menu collapse
|
|
51
55
|
`onChange` | Function | No | Not yet implemented
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { default as EbayFakeMenuButton } from './menu-button';
|
|
1
|
+
export { default as EbayFakeMenuButton, EbayFakeMenuButtonProps } from './menu-button';
|
|
2
2
|
export { default as EbayFakeMenuButtonItem } from './menu-button-item';
|
|
3
3
|
export { default as EbayFakeMenuButtonSeparator } from './menu-button-separator';
|
|
4
4
|
export { default as EbayFakeMenuButtonLabel } from './menu-button-label';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-fake-menu-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-fake-menu-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAA;AACtF,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,oBAAoB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,2BAA2B,EAAE,MAAM,yBAAyB,CAAA;AAChF,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,qBAAqB,CAAA"}
|
|
@@ -1,12 +1,21 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { ComponentProps, FC } from 'react';
|
|
2
2
|
import { EbayButtonProps } from '..';
|
|
3
|
-
export declare type
|
|
3
|
+
export declare type EbayFakeMenuButtonVariant = 'overflow' | 'form' | 'button';
|
|
4
|
+
export declare type EbayFakeMenuButtonProps = {
|
|
4
5
|
a11yText?: string;
|
|
6
|
+
noToggleIcon?: boolean;
|
|
7
|
+
expanded?: boolean;
|
|
8
|
+
fixWidth?: boolean;
|
|
9
|
+
reverse?: boolean;
|
|
10
|
+
variant?: EbayFakeMenuButtonVariant;
|
|
5
11
|
className?: string;
|
|
6
12
|
onCollapse?: () => void;
|
|
7
13
|
onExpand?: () => void;
|
|
8
14
|
text?: string;
|
|
15
|
+
type?: 'radio' | 'checkbox';
|
|
9
16
|
};
|
|
10
|
-
declare
|
|
17
|
+
declare type ButtonProps = Omit<EbayButtonProps, 'variant'> & Omit<ComponentProps<'button'>, 'type'> & ComponentProps<'a'>;
|
|
18
|
+
declare type Props = ButtonProps & EbayFakeMenuButtonProps;
|
|
19
|
+
declare const EbayMenuButton: FC<Props>;
|
|
11
20
|
export default EbayMenuButton;
|
|
12
21
|
//# sourceMappingURL=menu-button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-button.d.ts","sourceRoot":"","sources":["../../src/ebay-fake-menu-button/menu-button.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAgB,EAAE,EAA+B,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"menu-button.d.ts","sourceRoot":"","sources":["../../src/ebay-fake-menu-button/menu-button.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAgB,cAAc,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAA;AAM5F,OAAO,EAAc,eAAe,EAAiE,MAAM,IAAI,CAAA;AAG/G,oBAAY,yBAAyB,GAAG,UAAU,GAAG,MAAM,GAAG,QAAQ,CAAA;AAEtE,oBAAY,uBAAuB,GAAG;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;CAC/B,CAAA;AAED,aAAK,WAAW,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,GAC/C,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,GACtC,cAAc,CAAC,GAAG,CAAC,CAAA;AACvB,aAAK,KAAK,GAAG,WAAW,GAAG,uBAAuB,CAAA;AAElD,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,KAAK,CAqG7B,CAAA;AAED,eAAe,cAAc,CAAA"}
|
|
@@ -47,16 +47,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
47
47
|
var react_1 = __importStar(require("react"));
|
|
48
48
|
var classnames_1 = __importDefault(require("classnames"));
|
|
49
49
|
var component_utils_1 = require("../common/component-utils");
|
|
50
|
+
var event_utils_1 = require("../common/event-utils");
|
|
50
51
|
var random_id_1 = require("../common/random-id");
|
|
51
52
|
var __1 = require("..");
|
|
52
53
|
var _1 = require(".");
|
|
53
|
-
var event_utils_1 = require("../common/event-utils");
|
|
54
54
|
var EbayMenuButton = function (_a) {
|
|
55
|
-
var a11yText = _a.a11yText,
|
|
56
|
-
var
|
|
57
|
-
var
|
|
55
|
+
var a11yText = _a.a11yText, noToggleIcon = _a.noToggleIcon, fixWidth = _a.fixWidth, reverse = _a.reverse, variant = _a.variant, _b = _a.expanded, defaultExpanded = _b === void 0 ? false : _b, className = _a.className, _c = _a.onCollapse, onCollapse = _c === void 0 ? function () { } : _c, _d = _a.onExpand, onExpand = _d === void 0 ? function () { } : _d, _e = _a.text, text = _e === void 0 ? '' : _e, children = _a.children, rest = __rest(_a, ["a11yText", "noToggleIcon", "fixWidth", "reverse", "variant", "expanded", "className", "onCollapse", "onExpand", "text", "children"]);
|
|
56
|
+
var _f = react_1.useState(defaultExpanded), expanded = _f[0], setExpanded = _f[1];
|
|
57
|
+
var _g = react_1.useState(), menuId = _g[0], setMenuId = _g[1];
|
|
58
58
|
var ref = react_1.useRef();
|
|
59
|
-
var
|
|
59
|
+
var icon = component_utils_1.findComponent(children, __1.EbayIcon);
|
|
60
|
+
var label = component_utils_1.findComponent(children, _1.EbayFakeMenuButtonLabel) || (icon ? react_1.default.createElement("span", null, text) : text);
|
|
60
61
|
var menuItems = component_utils_1.filterByType(children, [_1.EbayFakeMenuButtonItem, _1.EbayFakeMenuButtonSeparator]);
|
|
61
62
|
react_1.useEffect(function () {
|
|
62
63
|
var handleBackgroundClick = function (e) {
|
|
@@ -89,10 +90,20 @@ var EbayMenuButton = function (_a) {
|
|
|
89
90
|
(_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
90
91
|
});
|
|
91
92
|
};
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
93
|
+
var menuClasses = classnames_1.default('fake-menu-button__menu', {
|
|
94
|
+
'menu-button__menu--fix-width': fixWidth,
|
|
95
|
+
'menu-button__menu--reverse': reverse
|
|
96
|
+
});
|
|
97
|
+
var buttonProps = __assign({ ref: ref, className: 'fake-menu-button__button', 'aria-expanded': !!expanded, 'aria-haspopup': true, 'aria-label': a11yText, 'aria-controls': menuId, onClick: function () { return setExpanded(!expanded); } }, rest);
|
|
98
|
+
return (react_1.default.createElement("span", { className: classnames_1.default('fake-menu-button', className) },
|
|
99
|
+
variant === 'overflow' ?
|
|
100
|
+
react_1.default.createElement(__1.EbayIconButton, __assign({ icon: "overflow" }, buttonProps)) :
|
|
101
|
+
react_1.default.createElement(__1.EbayButton, __assign({ variant: variant === 'form' ? 'form' : undefined, bodyState: noToggleIcon ? undefined : 'expand' }, buttonProps),
|
|
102
|
+
icon,
|
|
103
|
+
label),
|
|
104
|
+
expanded &&
|
|
105
|
+
react_1.default.createElement(__1.EbayFakeMenu, { className: menuClasses, id: menuId, tabIndex: -1, onKeyDown: handleMenuKeydown }, menuItems.map(function (item, i) {
|
|
106
|
+
return react_1.cloneElement(item, __assign(__assign({}, item.props), { key: i, autoFocus: i === 0 }));
|
|
107
|
+
}))));
|
|
97
108
|
};
|
|
98
109
|
exports.default = EbayMenuButton;
|
package/index.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ export { EbayEek, EbayEekProps } from './ebay-eek';
|
|
|
4
4
|
export { EbayIconButton, EbayIconButtonProps } from './ebay-icon-button';
|
|
5
5
|
export { EbayMenu, EbayMenuItem, EbayMenuSeparator, EbayMenuType, EbayMenuPriority } from './ebay-menu';
|
|
6
6
|
export { EbayFakeMenu, EbayFakeMenuItem, EbayFakeMenuSeparator, EbayFakeMenuItemProps } from './ebay-fake-menu';
|
|
7
|
-
export { EbayFakeMenuButton, EbayFakeMenuButtonItem, EbayFakeMenuButtonLabel, EbayFakeMenuButtonSeparator } from './ebay-fake-menu-button';
|
|
7
|
+
export { EbayFakeMenuButton, EbayFakeMenuButtonProps, EbayFakeMenuButtonItem, EbayFakeMenuButtonLabel, EbayFakeMenuButtonSeparator } from './ebay-fake-menu-button';
|
|
8
8
|
export { EbayInlineNotice, NoticeStatus } from './ebay-inline-notice';
|
|
9
9
|
export { EbaySectionNotice, EbaySectionNoticeTitle, EbaySectionNoticeFooter } from './ebay-section-notice';
|
|
10
10
|
export { EbaySectionTitle, EbaySectionTitleTitle, EbaySectionTitleSubtitle, EbaySectionTitleInfo, EbaySectionTitleOverflow } from './ebay-section-title';
|
package/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,IAAI,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAC3F,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AACxE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AACvG,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAA;AAC/G,OAAO,EACH,kBAAkB,EAAE,sBAAsB,EAAE,uBAAuB,EAAE,2BAA2B,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|