@ebay/ui-core-react 2.1.3 → 2.1.5
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-dialog-base/components/dialogBase.d.ts +1 -1
- package/ebay-dialog-base/components/dialogBase.d.ts.map +1 -1
- package/ebay-drawer-dialog/components/drawer.d.ts +2 -3
- package/ebay-drawer-dialog/components/drawer.d.ts.map +1 -1
- package/ebay-drawer-dialog/components/drawer.js +2 -2
- package/ebay-fullscreen-dialog/fullscreen-dialog.d.ts.map +1 -1
- package/ebay-fullscreen-dialog/fullscreen-dialog.js +1 -1
- package/ebay-lightbox-dialog/lightbox-dialog.d.ts.map +1 -1
- package/ebay-lightbox-dialog/lightbox-dialog.js +2 -2
- package/ebay-tabs/tab.d.ts +3 -2
- package/ebay-tabs/tab.d.ts.map +1 -1
- package/ebay-tabs/tab.js +2 -2
- package/ebay-tabs/tabs.d.ts.map +1 -1
- package/ebay-tabs/tabs.js +20 -19
- package/package.json +1 -1
|
@@ -15,7 +15,7 @@ export interface DialogBaseProps<T> extends HTMLProps<T> {
|
|
|
15
15
|
top?: ReactElement;
|
|
16
16
|
buttonPosition?: ButtonPosition;
|
|
17
17
|
ariaLabelledby?: string;
|
|
18
|
-
a11yCloseText
|
|
18
|
+
a11yCloseText: string;
|
|
19
19
|
onCloseBtnClick?: MouseEventHandler;
|
|
20
20
|
onBackgroundClick?: MouseEventHandler;
|
|
21
21
|
mainId?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialogBase.d.ts","sourceRoot":"","sources":["../../../src/ebay-dialog-base/components/dialogBase.tsx"],"names":[],"mappings":"AAAA,OAAc,EACV,EAAE,EACF,SAAS,EACT,SAAS,EAIT,YAAY,EAEZ,iBAAiB,EACjB,SAAS,EACZ,MAAM,OAAO,CAAA;AAMd,OAAO,EAAsB,iBAAiB,EAAE,MAAM,aAAa,CAAA;AAEnE,oBAAY,UAAU,GAAG,SAAS,CAAA;AAClC,aAAK,WAAW,GAAG,mBAAmB,GAAG,iBAAiB,GAAG,cAAc,GACrE,eAAe,GAAG,cAAc,GAAG,cAAc,GAAG,gBAAgB,CAAA;AAC1E,aAAK,cAAc,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAA;AAGpE,MAAM,WAAW,eAAe,CAAC,CAAC,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IACpD,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,YAAY,CAAC;IACnB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,
|
|
1
|
+
{"version":3,"file":"dialogBase.d.ts","sourceRoot":"","sources":["../../../src/ebay-dialog-base/components/dialogBase.tsx"],"names":[],"mappings":"AAAA,OAAc,EACV,EAAE,EACF,SAAS,EACT,SAAS,EAIT,YAAY,EAEZ,iBAAiB,EACjB,SAAS,EACZ,MAAM,OAAO,CAAA;AAMd,OAAO,EAAsB,iBAAiB,EAAE,MAAM,aAAa,CAAA;AAEnE,oBAAY,UAAU,GAAG,SAAS,CAAA;AAClC,aAAK,WAAW,GAAG,mBAAmB,GAAG,iBAAiB,GAAG,cAAc,GACrE,eAAe,GAAG,cAAc,GAAG,cAAc,GAAG,gBAAgB,CAAA;AAC1E,aAAK,cAAc,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAA;AAGpE,MAAM,WAAW,eAAe,CAAC,CAAC,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IACpD,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,YAAY,CAAC;IACnB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,iBAAiB,CAAC;IACpC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAAC,WAAW,CAAC,CA6JvD,CAAA;AAED,eAAe,UAAU,CAAA"}
|
|
@@ -5,9 +5,8 @@ export interface EbayDrawerProps<T> extends DialogBaseProps<T> {
|
|
|
5
5
|
open?: boolean;
|
|
6
6
|
noHandle?: boolean;
|
|
7
7
|
focus?: RefObject<HTMLAnchorElement & HTMLButtonElement>;
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
a11yMaximizeText?: string;
|
|
8
|
+
a11yMinimizeText: string;
|
|
9
|
+
a11yMaximizeText: string;
|
|
11
10
|
onShow?: () => void;
|
|
12
11
|
onClose?: () => void;
|
|
13
12
|
onExpanded?: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/ebay-drawer-dialog/components/drawer.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAY,EAAE,EAAgB,SAAS,EAA0C,MAAM,OAAO,CAAA;AAE5G,OAAO,EAAE,eAAe,EAAyC,MAAM,wBAAwB,CAAA;AAK/F,MAAM,WAAW,eAAe,CAAC,CAAC,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACzD,
|
|
1
|
+
{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/ebay-drawer-dialog/components/drawer.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAY,EAAE,EAAgB,SAAS,EAA0C,MAAM,OAAO,CAAA;AAE5G,OAAO,EAAE,eAAe,EAAyC,MAAM,wBAAwB,CAAA;AAK/F,MAAM,WAAW,eAAe,CAAC,CAAC,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACzD,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CA+F9C,CAAA;AAED,eAAe,gBAAgB,CAAA"}
|
|
@@ -51,9 +51,9 @@ var THRESHOLD_TOUCH = 30;
|
|
|
51
51
|
var classPrefix = 'drawer-dialog';
|
|
52
52
|
var EbayDrawerDialog = function (_a) {
|
|
53
53
|
var _b;
|
|
54
|
-
var _c = _a.expanded, controlledExpanded = _c === void 0 ? false : _c, noHandle = _a.noHandle, _d = _a.onClose, onClose = _d === void 0 ? function () { } : _d, _e = _a.onCollapsed, onCollapsed = _e === void 0 ? function () { } : _e, _f = _a.onExpanded, onExpanded = _f === void 0 ? function () { } : _f,
|
|
54
|
+
var _c = _a.expanded, controlledExpanded = _c === void 0 ? false : _c, noHandle = _a.noHandle, _d = _a.onClose, onClose = _d === void 0 ? function () { } : _d, _e = _a.onCollapsed, onCollapsed = _e === void 0 ? function () { } : _e, _f = _a.onExpanded, onExpanded = _f === void 0 ? function () { } : _f, a11yMaximizeText = _a.a11yMaximizeText, a11yMinimizeText = _a.a11yMinimizeText, children = _a.children, rest = __rest(_a, ["expanded", "noHandle", "onClose", "onCollapsed", "onExpanded", "a11yMaximizeText", "a11yMinimizeText", "children"]);
|
|
55
55
|
var touches = [];
|
|
56
|
-
var
|
|
56
|
+
var _g = react_1.useState(controlledExpanded), expanded = _g[0], setExpanded = _g[1];
|
|
57
57
|
react_1.useEffect(function () {
|
|
58
58
|
setExpanded(controlledExpanded);
|
|
59
59
|
}, [controlledExpanded]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fullscreen-dialog.d.ts","sourceRoot":"","sources":["../../src/ebay-fullscreen-dialog/fullscreen-dialog.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,eAAe,EAAuB,MAAM,qBAAqB,CAAA;AAI1E,MAAM,WAAW,KAAK,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,oBAAoB,EAAE,EAAE,CAAC,KAAK,
|
|
1
|
+
{"version":3,"file":"fullscreen-dialog.d.ts","sourceRoot":"","sources":["../../src/ebay-fullscreen-dialog/fullscreen-dialog.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,eAAe,EAAuB,MAAM,qBAAqB,CAAA;AAI1E,MAAM,WAAW,KAAK,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,oBAAoB,EAAE,EAAE,CAAC,KAAK,CAmBnC,CAAA;AAED,eAAe,oBAAoB,CAAA"}
|
|
@@ -30,7 +30,7 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
|
30
30
|
var ebay_dialog_base_1 = require("../ebay-dialog-base");
|
|
31
31
|
var classPrefix = 'fullscreen-dialog';
|
|
32
32
|
var EbayFullscreenDialog = function (_a) {
|
|
33
|
-
var open = _a.open, _b = _a.onClose, onClose = _b === void 0 ? function () { } : _b, _c = _a.onOpen, onOpen = _c === void 0 ? function () { } : _c,
|
|
33
|
+
var open = _a.open, _b = _a.onClose, onClose = _b === void 0 ? function () { } : _b, _c = _a.onOpen, onOpen = _c === void 0 ? function () { } : _c, className = _a.className, animated = _a.animated, rest = __rest(_a, ["open", "onClose", "onOpen", "className", "animated"]);
|
|
34
34
|
return (react_1.default.createElement(ebay_dialog_base_1.DialogBaseWithState, __assign({}, rest, { classPrefix: classPrefix, buttonPosition: "left", onCloseBtnClick: onClose, transitionElement: "window", animated: animated, className: classnames_1.default(className, classPrefix + "--mask-fade-slow"), windowClass: classnames_1.default(classPrefix + "__window", classPrefix + "__window--slide"), open: open })));
|
|
35
35
|
};
|
|
36
36
|
exports.default = EbayFullscreenDialog;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lightbox-dialog.d.ts","sourceRoot":"","sources":["../../src/ebay-lightbox-dialog/lightbox-dialog.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,eAAe,EAAuB,MAAM,qBAAqB,CAAA;AAI1E,aAAK,IAAI,GAAG,SAAS,GAAG,MAAM,CAAA;AAE9B,MAAM,WAAW,KAAK,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,KAAK,
|
|
1
|
+
{"version":3,"file":"lightbox-dialog.d.ts","sourceRoot":"","sources":["../../src/ebay-lightbox-dialog/lightbox-dialog.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,eAAe,EAAuB,MAAM,qBAAqB,CAAA;AAI1E,aAAK,IAAI,GAAG,SAAS,GAAG,MAAM,CAAA;AAE9B,MAAM,WAAW,KAAK,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,KAAK,CAmBjC,CAAA;AAED,eAAe,kBAAkB,CAAA"}
|
|
@@ -31,8 +31,8 @@ var ebay_dialog_base_1 = require("../ebay-dialog-base");
|
|
|
31
31
|
var classPrefix = 'lightbox-dialog';
|
|
32
32
|
var EbayLightboxDialog = function (_a) {
|
|
33
33
|
var _b;
|
|
34
|
-
var
|
|
35
|
-
return (react_1.default.createElement(ebay_dialog_base_1.DialogBaseWithState, __assign({ buttonPosition: "right" }, rest, {
|
|
34
|
+
var open = _a.open, mode = _a.mode, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.onOpen, onOpen = _d === void 0 ? function () { } : _d, rest = __rest(_a, ["open", "mode", "onClose", "onOpen"]);
|
|
35
|
+
return (react_1.default.createElement(ebay_dialog_base_1.DialogBaseWithState, __assign({ buttonPosition: "right" }, rest, { classPrefix: classPrefix, onCloseBtnClick: onClose, onBackgroundClick: onClose, className: classnames_1.default(rest.className, classPrefix + "--mask-fade"), windowClass: classnames_1.default('lightbox-dialog__window--fade', (_b = {},
|
|
36
36
|
_b[classPrefix + "__window--mini"] = mode === 'mini',
|
|
37
37
|
_b)), open: open })));
|
|
38
38
|
};
|
package/ebay-tabs/tab.d.ts
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import { ComponentProps, FC } from 'react';
|
|
1
|
+
import { ComponentProps, FC, RefCallback } from 'react';
|
|
2
2
|
declare type TabProps = ComponentProps<'li'> & ComponentProps<'div'> & {
|
|
3
3
|
index?: number;
|
|
4
4
|
parentId?: string;
|
|
5
5
|
selected?: boolean;
|
|
6
|
+
focused?: boolean;
|
|
6
7
|
href?: string;
|
|
7
8
|
onClick?: () => void;
|
|
8
9
|
onKeyDown?: () => void;
|
|
9
|
-
refCallback?:
|
|
10
|
+
refCallback?: RefCallback<HTMLElement>;
|
|
10
11
|
};
|
|
11
12
|
declare const Tab: FC<TabProps>;
|
|
12
13
|
export default Tab;
|
package/ebay-tabs/tab.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../src/ebay-tabs/tab.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../src/ebay-tabs/tab.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAG9D,aAAK,QAAQ,GAAG,cAAc,CAAC,IAAI,CAAC,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;CAC1C,CAAA;AAED,QAAA,MAAM,GAAG,EAAE,EAAE,CAAC,QAAQ,CAoCjB,CAAA;AAEL,eAAe,GAAG,CAAA"}
|
package/ebay-tabs/tab.js
CHANGED
|
@@ -28,9 +28,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
28
28
|
var react_1 = __importDefault(require("react"));
|
|
29
29
|
var classnames_1 = __importDefault(require("classnames"));
|
|
30
30
|
var Tab = function (_a) {
|
|
31
|
-
var children = _a.children, index = _a.index, parentId = _a.parentId, selected = _a.selected, href = _a.href, className = _a.className, refCallback = _a.refCallback, _b = _a.onClick, onClick = _b === void 0 ? function () { } : _b, _c = _a.onKeyDown, onKeyDown = _c === void 0 ? function () { } : _c, rest = __rest(_a, ["children", "index", "parentId", "selected", "href", "className", "refCallback", "onClick", "onKeyDown"]);
|
|
31
|
+
var children = _a.children, index = _a.index, parentId = _a.parentId, selected = _a.selected, focused = _a.focused, href = _a.href, className = _a.className, refCallback = _a.refCallback, _b = _a.onClick, onClick = _b === void 0 ? function () { } : _b, _c = _a.onKeyDown, onKeyDown = _c === void 0 ? function () { } : _c, rest = __rest(_a, ["children", "index", "parentId", "selected", "focused", "href", "className", "refCallback", "onClick", "onKeyDown"]);
|
|
32
32
|
return href ? (react_1.default.createElement("li", __assign({}, rest, { className: classnames_1.default(className, 'fake-tabs__item', { 'fake-tabs__item--current': selected }) }),
|
|
33
|
-
react_1.default.createElement("a", { href: href, "aria-current": selected ? "page" : null }, children))) : (react_1.default.createElement("div", __assign({}, rest, { ref: refCallback, "aria-controls": (parentId || 'default') + "-tabpanel-" + index, "aria-selected": selected, className: classnames_1.default(className, 'tabs__item'), id: (parentId || 'default') + "-tab-" + index, role: "tab", tabIndex:
|
|
33
|
+
react_1.default.createElement("a", { href: href, "aria-current": selected ? "page" : null }, children))) : (react_1.default.createElement("div", __assign({}, rest, { ref: refCallback, "aria-controls": (parentId || 'default') + "-tabpanel-" + index, "aria-selected": selected, className: classnames_1.default(className, 'tabs__item'), id: (parentId || 'default') + "-tab-" + index, role: "tab", tabIndex: focused ? 0 : -1, onClick: onClick, onKeyDown: onKeyDown }),
|
|
34
34
|
react_1.default.createElement("span", null, children)));
|
|
35
35
|
};
|
|
36
36
|
exports.default = Tab;
|
package/ebay-tabs/tabs.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/ebay-tabs/tabs.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAgB,cAAc,EAAE,EAAE,EAAuB,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/ebay-tabs/tabs.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAgB,cAAc,EAAE,EAAE,EAAuB,MAAM,OAAO,CAAA;AAMpF,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAG1C,aAAK,SAAS,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAsGvB,CAAA;AAED,eAAe,IAAI,CAAA"}
|
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
|
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
@@ -23,11 +34,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
23
34
|
};
|
|
24
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
36
|
var react_1 = __importStar(require("react"));
|
|
37
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
26
38
|
var event_utils_1 = require("../common/event-utils");
|
|
27
39
|
var tab_1 = __importDefault(require("./tab"));
|
|
28
40
|
var tab_panel_1 = __importDefault(require("./tab-panel"));
|
|
29
41
|
var component_utils_1 = require("../common/component-utils");
|
|
30
|
-
var classnames_1 = __importDefault(require("classnames"));
|
|
31
42
|
var Tabs = function (_a) {
|
|
32
43
|
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.onTabSelect, onTabSelect = _e === void 0 ? function () { } : _e, children = _a.children;
|
|
33
44
|
var headings = [];
|
|
@@ -36,7 +47,6 @@ var Tabs = function (_a) {
|
|
|
36
47
|
var onSelect = function (i) {
|
|
37
48
|
onTabSelect(i);
|
|
38
49
|
setSelectedIndex(i);
|
|
39
|
-
setFocusedIndex(i);
|
|
40
50
|
};
|
|
41
51
|
/**
|
|
42
52
|
* Handle a11y for heading
|
|
@@ -50,11 +60,14 @@ var Tabs = function (_a) {
|
|
|
50
60
|
}
|
|
51
61
|
});
|
|
52
62
|
event_utils_1.handleLeftRightArrowsKeydown(ev, function () {
|
|
63
|
+
var _a;
|
|
53
64
|
ev.preventDefault();
|
|
54
65
|
var len = component_utils_1.filterByType(children, tab_1.default).length;
|
|
55
66
|
var direction = ['Left', 'ArrowLeft'].includes(ev.key) ? -1 : 1;
|
|
56
|
-
var
|
|
67
|
+
var currentIndex = focusedIndex === undefined ? selectedIndex : focusedIndex;
|
|
68
|
+
var nextIndex = (currentIndex + len + direction) % len;
|
|
57
69
|
setFocusedIndex(nextIndex);
|
|
70
|
+
(_a = headings[nextIndex]) === null || _a === void 0 ? void 0 : _a.focus();
|
|
58
71
|
if (activation !== 'manual') {
|
|
59
72
|
onSelect(nextIndex);
|
|
60
73
|
}
|
|
@@ -63,28 +76,16 @@ var Tabs = function (_a) {
|
|
|
63
76
|
react_1.useEffect(function () {
|
|
64
77
|
onSelect(index);
|
|
65
78
|
}, [index]);
|
|
66
|
-
react_1.useEffect(function () {
|
|
67
|
-
var _a;
|
|
68
|
-
(_a = headings[focusedIndex]) === null || _a === void 0 ? void 0 : _a.focus();
|
|
69
|
-
}, [focusedIndex]);
|
|
70
79
|
var isFake = component_utils_1.filterBy(children, function (_a) {
|
|
71
80
|
var type = _a.type, props = _a.props;
|
|
72
81
|
return type === tab_1.default && props.href;
|
|
73
82
|
}).length > 0;
|
|
74
83
|
var isLarge = size === 'large';
|
|
75
84
|
var tabHeadings = component_utils_1.filterByType(children, tab_1.default).map(function (item, i) {
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
parentId: id,
|
|
81
|
-
selected: selectedIndex === i,
|
|
82
|
-
href: href,
|
|
83
|
-
children: content,
|
|
84
|
-
onClick: function () { onSelect(i); },
|
|
85
|
-
onKeyDown: function (e) { onKeyDown(e, i); }
|
|
86
|
-
};
|
|
87
|
-
return react_1.cloneElement(item, itemProps);
|
|
85
|
+
return 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 () {
|
|
86
|
+
onSelect(i);
|
|
87
|
+
setFocusedIndex(i);
|
|
88
|
+
}, onKeyDown: function (e) { onKeyDown(e, i); } }));
|
|
88
89
|
});
|
|
89
90
|
var tabPanels = component_utils_1.filterByType(children, tab_panel_1.default).map(function (item, i) {
|
|
90
91
|
var content = item.props.children;
|