@ebay/ui-core-react 3.6.0 → 3.8.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.
@@ -7,7 +7,6 @@ import { EbayIcon } from '@ebay/ui-core-react/ebay-icon'
7
7
  import '@ebay/skin/icon'
8
8
 
9
9
  <EbayIcon name="arrowLeft" />
10
- <EbayIcon name="programBadgeEbayPlus" type="program-badge" />
11
10
  ```
12
11
 
13
12
  ### Notes
@@ -17,7 +16,7 @@ Make sure you use `<EbaySvg />` in your code (ideally on server side only), so t
17
16
 
18
17
  Name | Type | Stateful | Required | Description
19
18
  --- | --- | --- | --- | ---
20
- `name` | String | No | Yes | name of the icon from [Skin](./icon.tsx), transparent versions of colored icons has `-transparent` suffix
19
+ `name` | String | No | Yes | name of the icon from [Skin](./types.ts), transparent versions of colored icons has `-transparent` suffix
21
20
  `noSkinClasses` | Boolean | No | No | Used for special cases where `icon` classes from Skin should not be applied
22
21
  `a11yText` | String | No | Yes | text for non-decorative inline icon; icon is assumed to be decorative if this is not passed
23
- `type` | String | No | no | 'icon' or 'program-badge' default 'icon'
22
+ `type` | String | No | no | 'icon' or 'program-badge' default 'icon' (DEPRECATED, use <EbayProgramBadge /> instead)
@@ -3,6 +3,9 @@ import { Icon } from './types';
3
3
  export declare type A11yVariant = 'label';
4
4
  export declare type EbayIconProps = SVGProps<SVGSVGElement> & {
5
5
  className?: string;
6
+ /**
7
+ * @deprecated Use <EbayProgramBadge /> instead of type='program-badge'
8
+ */
6
9
  type?: 'icon' | 'program-badge' | string;
7
10
  name: Icon;
8
11
  noSkinClasses?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/ebay-icon/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,GAAG,EAAE,QAAQ,EAAuB,MAAM,OAAO,CAAA;AAIrE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAQ9B,oBAAY,WAAW,GAAG,OAAO,CAAC;AAElC,oBAAY,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAE,eAAe,GAAG,MAAM,CAAA;IACvC,IAAI,EAAE,IAAI,CAAC;IACX,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,YAAY,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;CACrC,CAAC;;AAoEF,wBAAuC"}
1
+ {"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/ebay-icon/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,GAAG,EAAE,QAAQ,EAAuB,MAAM,OAAO,CAAA;AAIrE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAQ9B,oBAAY,WAAW,GAAG,OAAO,CAAC;AAElC,oBAAY,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,eAAe,GAAG,MAAM,CAAA;IACxC,IAAI,EAAE,IAAI,CAAC;IACX,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,YAAY,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;CACrC,CAAC;;AA+DF,wBAAuC"}
package/ebay-icon/icon.js CHANGED
@@ -69,26 +69,22 @@ var EbayIcon = function (_a) {
69
69
  } : {
70
70
  'aria-hidden': true
71
71
  };
72
- var prefixSvg = type === 'icon' ? 'icon-' : '';
73
- var kebabName = kebabCased(name);
72
+ var kebabName = kebabCased(withoutProgramBadgePrefix(name));
74
73
  var iconSize = getIconPixelSize(kebabName) + "px";
75
- var className = classnames_1.default(extraClass, (_b = {}, _b[getIconClass(type, kebabName)] = !noSkinClasses, _b));
74
+ var className = classnames_1.default(extraClass, (_b = {}, _b[type + " " + type + "--" + kebabName] = !noSkinClasses, _b));
76
75
  return (react_1.default.createElement("svg", __assign({ height: iconSize, width: iconSize }, rest, { className: className, xmlns: "http://www.w3.org/2000/svg", focusable: false, ref: forwardedRef }, a11yProps),
77
76
  a11yText && !withAriaLabel && react_1.default.createElement("title", { id: a11yTextId }, a11yText),
78
- react_1.default.createElement("use", { xlinkHref: "#" + prefixSvg + kebabName })));
77
+ react_1.default.createElement("use", { xlinkHref: "#" + type + "-" + kebabName })));
79
78
  };
80
79
  function getIconPixelSize(iconName) {
81
80
  var sizeCandidate = iconName.split('-').slice(-1)[0];
82
81
  return iconPixelSizes[sizeCandidate] || DEFAULT_ICON_SIZE;
83
82
  }
83
+ function withoutProgramBadgePrefix(name) {
84
+ // Deprecated, remove this function in v4.x
85
+ return name.replace(/programBadge([A-Z])/, function (s, c) { return c.toLowerCase(); });
86
+ }
84
87
  function kebabCased(str) {
85
88
  return str.replace(/([A-Z])/g, function (s, c) { return "-" + c.toLowerCase(); });
86
89
  }
87
- function getIconClass(type, name) {
88
- if (type === 'icon') {
89
- return "icon icon--" + name;
90
- }
91
- var dashedName = name.replace(type, type + "-");
92
- return type + " " + dashedName;
93
- }
94
90
  exports.default = component_utils_1.withForwardRef(EbayIcon);
@@ -1,3 +1,6 @@
1
1
  export declare const MIN_PAGES = 1;
2
2
  export declare const MAX_PAGES = 9;
3
+ export declare const MIN_VISIBLE_ITEMS = 4;
4
+ export declare const LEADING_SPACE_WITH_DOT = 2;
5
+ export declare const TRAILING_SPACE_WITH_DOT: number;
3
6
  //# sourceMappingURL=const.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/const.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,IAAI,CAAA;AAC1B,eAAO,MAAM,SAAS,IAAI,CAAA"}
1
+ {"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/const.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,IAAI,CAAA;AAC1B,eAAO,MAAM,SAAS,IAAI,CAAA;AAC1B,eAAO,MAAM,iBAAiB,IAAI,CAAA;AAClC,eAAO,MAAM,sBAAsB,IAAI,CAAA;AACvC,eAAO,MAAM,uBAAuB,QAAqC,CAAA"}
@@ -1,5 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.MAX_PAGES = exports.MIN_PAGES = void 0;
3
+ exports.TRAILING_SPACE_WITH_DOT = exports.LEADING_SPACE_WITH_DOT = exports.MIN_VISIBLE_ITEMS = exports.MAX_PAGES = exports.MIN_PAGES = void 0;
4
4
  exports.MIN_PAGES = 1;
5
5
  exports.MAX_PAGES = 9;
6
+ exports.MIN_VISIBLE_ITEMS = 4;
7
+ exports.LEADING_SPACE_WITH_DOT = 2;
8
+ exports.TRAILING_SPACE_WITH_DOT = exports.MAX_PAGES - exports.LEADING_SPACE_WITH_DOT;
@@ -1,5 +1,5 @@
1
1
  import { ItemState, PaginationVariant } from './types';
2
- export declare function pageNumbersAround(totalPages: number, selectedPage: number, maxVisiblePages?: number, withDots?: boolean): ItemState[];
2
+ export declare function pageNumbersAround(totalPages: number, selectedPage: number, maxVisiblePages?: number, variant?: PaginationVariant): ItemState[];
3
3
  export declare function calcPageState(selectedPage: number, visiblePages: number, totalPages: number, variant?: PaginationVariant): ItemState[];
4
4
  /**
5
5
  * Calculates the maximum width for an element within its container.
@@ -1 +1 @@
1
- {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/helpers.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEtD,wBAAgB,iBAAiB,CAC7B,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,EACpB,eAAe,GAAE,MAAmB,EACpC,QAAQ,UAAQ,GACjB,SAAS,EAAE,CA6Bb;AAED,wBAAgB,aAAa,CACzB,YAAY,EAAE,MAAM,EACpB,YAAY,EAAE,MAAM,EACpB,UAAU,EAAE,MAAM,EAClB,OAAO,GAAE,iBAAgC,GAC1C,SAAS,EAAE,CAQb;AAaD;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,WAAW,GAAG,MAAM,CASpD"}
1
+ {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/helpers.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEtD,wBAAgB,iBAAiB,CAC7B,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,EACpB,eAAe,GAAE,MAAmB,EACpC,OAAO,GAAE,iBAAwB,GAClC,SAAS,EAAE,CA4Db;AAED,wBAAgB,aAAa,CACzB,YAAY,EAAE,MAAM,EACpB,YAAY,EAAE,MAAM,EACpB,UAAU,EAAE,MAAM,EAClB,OAAO,GAAE,iBAAgC,GAC1C,SAAS,EAAE,CASb;AAaD;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,WAAW,GAAG,MAAM,CASpD"}
@@ -2,15 +2,18 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.getMaxWidth = exports.calcPageState = exports.pageNumbersAround = void 0;
4
4
  var const_1 = require("./const");
5
- function pageNumbersAround(totalPages, selectedPage, maxVisiblePages, withDots) {
5
+ function pageNumbersAround(totalPages, selectedPage, maxVisiblePages, variant) {
6
6
  if (maxVisiblePages === void 0) { maxVisiblePages = totalPages; }
7
- if (withDots === void 0) { withDots = false; }
7
+ if (variant === void 0) { variant = null; }
8
+ var withDots = variant === 'show-last' || (variant === 'overflow' && totalPages > const_1.MAX_PAGES);
9
+ var hasLeadingDots = variant === 'overflow' && totalPages > const_1.MAX_PAGES;
8
10
  var visibleItems = Math.min(maxVisiblePages, totalPages);
9
11
  var startIndexWithoutDots = Math.max(0, selectedPage - Math.ceil((visibleItems - 1) / 2));
10
- var startIndexWithDots = visibleItems < 4 ? selectedPage :
12
+ var startIndexWithDots = visibleItems < const_1.MIN_VISIBLE_ITEMS ? selectedPage :
11
13
  Math.max(0, selectedPage - Math.floor((visibleItems - 1) / 2));
12
14
  var endIndex = (withDots ? startIndexWithDots : startIndexWithoutDots) + visibleItems;
13
15
  var closeToEnd = endIndex >= totalPages;
16
+ var closeToFront = selectedPage <= const_1.MIN_VISIBLE_ITEMS;
14
17
  var visibleRangeWithDots = function (start, end) {
15
18
  var items = visibleRange(totalPages, start, end);
16
19
  if (visibleItems > 2) {
@@ -23,12 +26,36 @@ function pageNumbersAround(totalPages, selectedPage, maxVisiblePages, withDots)
23
26
  }
24
27
  return items;
25
28
  };
26
- if (closeToEnd) {
29
+ // middle show item[1] (...) and item[item.length - 1] (...)
30
+ var visibleRangeWithOverflowDots = function (start, end) {
31
+ // Following Dot
32
+ if (closeToFront) {
33
+ return visibleRangeWithDots(0, end);
34
+ // Leading Dot
35
+ }
36
+ else if (closeToEnd) {
37
+ var items_1 = visibleRange(totalPages, totalPages - const_1.TRAILING_SPACE_WITH_DOT, totalPages);
38
+ items_1[0] = 'visible';
39
+ items_1[1] = 'dots';
40
+ return items_1;
41
+ }
42
+ // Middle case with Leading & Following Dots
43
+ var items = visibleRange(totalPages, selectedPage - const_1.LEADING_SPACE_WITH_DOT, selectedPage + const_1.LEADING_SPACE_WITH_DOT + 1);
44
+ items[0] = 'visible';
45
+ items[1] = closeToFront ? 'visible' : 'dots';
46
+ items[totalPages - 2] = 'dots';
47
+ items[totalPages - 1] = 'visible';
48
+ return items;
49
+ };
50
+ if (closeToEnd && totalPages <= const_1.MAX_PAGES) {
27
51
  return visibleRange(totalPages, totalPages - visibleItems);
28
52
  }
29
- return withDots ?
30
- visibleRangeWithDots(startIndexWithDots, endIndex) :
31
- visibleRange(totalPages, startIndexWithoutDots, endIndex);
53
+ if (withDots) {
54
+ return hasLeadingDots ?
55
+ visibleRangeWithOverflowDots(startIndexWithDots, endIndex) :
56
+ visibleRangeWithDots(startIndexWithDots, endIndex);
57
+ }
58
+ return visibleRange(totalPages, startIndexWithoutDots, endIndex);
32
59
  }
33
60
  exports.pageNumbersAround = pageNumbersAround;
34
61
  function calcPageState(selectedPage, visiblePages, totalPages, variant) {
@@ -36,8 +63,9 @@ function calcPageState(selectedPage, visiblePages, totalPages, variant) {
36
63
  if (selectedPage === -1) {
37
64
  return [];
38
65
  }
39
- var adjustedNumPages = clamp(Math.min(totalPages, visiblePages), const_1.MIN_PAGES, const_1.MAX_PAGES);
40
- return pageNumbersAround(totalPages, selectedPage - 1, adjustedNumPages, variant === 'show-last');
66
+ var adjustedNumPages = variant === 'overflow' ? const_1.MAX_PAGES :
67
+ clamp(Math.min(totalPages, visiblePages), const_1.MIN_PAGES, const_1.MAX_PAGES);
68
+ return pageNumbersAround(totalPages, selectedPage - 1, adjustedNumPages, variant);
41
69
  }
42
70
  exports.calcPageState = calcPageState;
43
71
  function clamp(n, min, max) {
@@ -1 +1 @@
1
- {"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/pagination.tsx"],"names":[],"mappings":"AAAA,OAAc,EACA,cAAc,EAAE,EAAE,EAE/B,MAAM,OAAO,CAAA;AAMd,OAAO,EAAa,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEtD,aAAK,kBAAkB,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;AAC9D,aAAK,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC7D,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,eAAe,CAoGvC,CAAA;AAED,eAAe,cAAc,CAAA"}
1
+ {"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/pagination.tsx"],"names":[],"mappings":"AAAA,OAAc,EACA,cAAc,EAAE,EAAE,EAE/B,MAAM,OAAO,CAAA;AAUd,OAAO,EAAa,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEtD,aAAK,kBAAkB,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;AAC9D,aAAK,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC7D,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,eAAe,CA+JvC,CAAA;AAED,eAAe,cAAc,CAAA"}
@@ -52,6 +52,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
52
52
  };
53
53
  Object.defineProperty(exports, "__esModule", { value: true });
54
54
  var react_1 = __importStar(require("react"));
55
+ var ebay_fake_menu_button_1 = require("../ebay-fake-menu-button");
55
56
  var classnames_1 = __importDefault(require("classnames"));
56
57
  var debounce_1 = require("../common/debounce");
57
58
  var helpers_1 = require("./helpers");
@@ -78,10 +79,13 @@ var EbayPagination = function (_a) {
78
79
  0;
79
80
  };
80
81
  var _l = react_1.useState([]), page = _l[0], setPage = _l[1];
81
- var updatePages = function () {
82
- var selectedPageIndex = childPageRefs.current.findIndex(function (pageRef) { var _a; return ((_a = pageRef.current) === null || _a === void 0 ? void 0 : _a.getAttribute('aria-current')) === 'page'; });
82
+ var _m = react_1.useState(0), selectedIndex = _m[0], setSelectedIndex = _m[1];
83
+ // selectedPageIndexFromDotMenu: override pageIndex on pagination with dot menu value
84
+ var updatePages = function (selectedPageIndexFromDotMenu) {
85
+ var selectedPageIndex = selectedPageIndexFromDotMenu || childPageRefs.current.findIndex(function (pageRef) { var _a; return ((_a = pageRef.current) === null || _a === void 0 ? void 0 : _a.getAttribute('aria-current')) === 'page'; });
83
86
  var visiblePageItems = getNumOfVisiblePageItems();
84
87
  var pageState = helpers_1.calcPageState(selectedPageIndex, visiblePageItems, totalPages, variant);
88
+ setSelectedIndex(selectedPageIndex);
85
89
  setPage(__spreadArrays(['hidden'], pageState));
86
90
  };
87
91
  react_1.useEffect(function () {
@@ -94,17 +98,54 @@ var EbayPagination = function (_a) {
94
98
  }, [children]);
95
99
  var createChildItems = function (itemType) {
96
100
  var pageIndex = 0;
101
+ var firstDotItems = [];
102
+ var secondDotItems = [];
103
+ var allDotItems = [];
104
+ var firstDot = page.indexOf('dots');
105
+ var lastDot = page.lastIndexOf('dots');
97
106
  return react_1.Children.map(children, function (item, index) {
98
107
  var _a = item.props, _b = _a.type, type = _b === void 0 ? 'page' : _b, current = _a.current, disabled = _a.disabled, href = _a.href, text = _a.children;
108
+ var isDot = page[index] === 'dots';
109
+ var key = id + "-item-" + index;
110
+ var hide = page[index] === 'hidden';
99
111
  var newProps = {
100
112
  type: type, current: current, disabled: disabled, href: href,
101
- children: page[index] === 'dots' ? '…' : text,
113
+ children: isDot ? '…' : text,
102
114
  pageIndex: type === 'page' ? pageIndex++ : undefined,
103
- key: id + "-item-" + index,
104
- hide: page[index] === 'hidden',
115
+ key: key,
116
+ hide: hide,
105
117
  onPrevious: onPrevious, onNext: onNext, onSelect: onSelect, a11yPreviousText: a11yPreviousText, a11yNextText: a11yNextText,
106
118
  ref: childPageRefs.current[index]
107
119
  };
120
+ // include hidden numbers & number of (...)itself
121
+ if ((hide || isDot) && type === 'page') {
122
+ var itemComponent = (react_1.default.createElement(ebay_fake_menu_button_1.EbayFakeMenuButtonItem, { key: key, href: href, onClick: function (event) {
123
+ if (!href) {
124
+ event.preventDefault();
125
+ }
126
+ var currentTarget = event.currentTarget;
127
+ onSelect(event, currentTarget === null || currentTarget === void 0 ? void 0 : currentTarget.innerText, pageIndex);
128
+ updatePages(Number(currentTarget === null || currentTarget === void 0 ? void 0 : currentTarget.innerText));
129
+ } }, text));
130
+ if (firstDot === lastDot) {
131
+ allDotItems.push(itemComponent);
132
+ }
133
+ if (selectedIndex - 2 > firstDot && index < selectedIndex) {
134
+ firstDotItems.push(itemComponent);
135
+ }
136
+ if (selectedIndex + 2 < lastDot && index > selectedIndex) {
137
+ secondDotItems.push(itemComponent);
138
+ }
139
+ }
140
+ if (itemType === 'page' && isDot && variant === 'overflow') {
141
+ var childComponent = allDotItems;
142
+ if (firstDot !== lastDot) {
143
+ childComponent = index === 2 ? firstDotItems : secondDotItems;
144
+ }
145
+ return (react_1.default.createElement("li", { key: key },
146
+ react_1.default.createElement("span", { className: "pagination__item", role: "separator" },
147
+ react_1.default.createElement(ebay_fake_menu_button_1.EbayFakeMenuButton, { a11yText: "Menu", borderless: true, variant: "overflow", noToggleIcon: true }, childComponent))));
148
+ }
108
149
  return itemType === type ? react_1.cloneElement(item, newProps) : null;
109
150
  });
110
151
  };
@@ -1,3 +1,3 @@
1
1
  export declare type ItemState = 'visible' | 'hidden' | 'dots';
2
- export declare type PaginationVariant = 'show-last' | 'show-range';
2
+ export declare type PaginationVariant = 'show-last' | 'show-range' | 'overflow';
3
3
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/types.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAA;AACrD,oBAAY,iBAAiB,GAAG,WAAW,GAAG,YAAY,CAAA"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-pagination/types.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAA;AACrD,oBAAY,iBAAiB,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,CAAA"}
@@ -0,0 +1,20 @@
1
+ # ebay-program-badge
2
+ The component will include the actual SVG markup in the HTML and then reference the chosen icon.
3
+
4
+ ## Usage
5
+ ```jsx
6
+ import { EbayProgramBadge } from '@ebay/ui-core-react/ebay-program-badge'
7
+ import '@ebay/skin/program-badge'
8
+
9
+ <EbayProgramBadge name="ebayPlus" />
10
+ ```
11
+
12
+ ### Notes
13
+ Make sure you use `<EbaySvg />` in your code (ideally on server side only), so that actual SVG icons exist inside HTML.
14
+
15
+ ## Attributes
16
+ Name | Type | Stateful | Required | Description
17
+ --- | --- | --- | --- | ---
18
+ `name` | String | No | Yes | name of the icon from [Skin](./types.ts)
19
+ `noSkinClasses` | Boolean | No | No | Used for special cases where `program-badge*` classes from Skin should not be applied
20
+ `a11yText` | String | No | Yes | text for non-decorative inline icon; icon is assumed to be decorative if this is not passed
@@ -0,0 +1,3 @@
1
+ export { default as EbayProgramBadge, EbayProgramBadgeProps } from './program-badge';
2
+ export { Icon as ProgramBadge } from './types';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-program-badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AACpF,OAAO,EAAE,IAAI,IAAI,YAAY,EAAE,MAAM,SAAS,CAAA"}
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ var program_badge_1 = require("./program-badge");
4
+ Object.defineProperty(exports, "EbayProgramBadge", { enumerable: true, get: function () { return program_badge_1.default; } });
@@ -0,0 +1,9 @@
1
+ import { FC } from 'react';
2
+ import { EbayIconProps } from '../ebay-icon';
3
+ import { ProgramBadge } from './index';
4
+ export declare type EbayProgramBadgeProps = Omit<EbayIconProps, 'type' | 'name' | 'ref'> & {
5
+ name: ProgramBadge;
6
+ };
7
+ declare const EbayProgramBadge: FC<EbayProgramBadgeProps>;
8
+ export default EbayProgramBadge;
9
+ //# sourceMappingURL=program-badge.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"program-badge.d.ts","sourceRoot":"","sources":["../../src/ebay-program-badge/program-badge.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAY,aAAa,EAAE,MAAM,cAAc,CAAA;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAEtC,oBAAY,qBAAqB,GAAG,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,MAAM,GAAG,KAAK,CAAC,GAAG;IAC/E,IAAI,EAAE,YAAY,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CACkB,CAAA;AAElE,eAAe,gBAAgB,CAAA"}
@@ -0,0 +1,34 @@
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
+ };
13
+ var __rest = (this && this.__rest) || function (s, e) {
14
+ var t = {};
15
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
+ t[p] = s[p];
17
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
+ t[p[i]] = s[p[i]];
21
+ }
22
+ return t;
23
+ };
24
+ var __importDefault = (this && this.__importDefault) || function (mod) {
25
+ return (mod && mod.__esModule) ? mod : { "default": mod };
26
+ };
27
+ Object.defineProperty(exports, "__esModule", { value: true });
28
+ var react_1 = __importDefault(require("react"));
29
+ var ebay_icon_1 = require("../ebay-icon");
30
+ var EbayProgramBadge = function (_a) {
31
+ var name = _a.name, rest = __rest(_a, ["name"]);
32
+ return react_1.default.createElement(ebay_icon_1.EbayIcon, __assign({}, rest, { type: "program-badge", name: name }));
33
+ };
34
+ exports.default = EbayProgramBadge;
@@ -0,0 +1,2 @@
1
+ export declare type Icon = 'authenticityGuaranteed' | 'clickToCall' | 'ebayPlus' | 'escrow' | 'freeWarranty' | 'moneyBackGuaranteeChf' | 'moneyBackGuaranteeEu' | 'moneyBackGuaranteeUk' | 'moneyBackGuaranteeUs' | 'moneyBackGuaranteeZl' | 'topRatedSeller' | 'vault';
2
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-program-badge/types.ts"],"names":[],"mappings":"AAEA,oBAAY,IAAI,GACZ,wBAAwB,GACxB,aAAa,GACb,UAAU,GACV,QAAQ,GACR,cAAc,GACd,uBAAuB,GACvB,sBAAsB,GACtB,sBAAsB,GACtB,sBAAsB,GACtB,sBAAsB,GACtB,gBAAgB,GAChB,OAAO,CAAA"}
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ /* This file is autogenerated, do not edit - it will be overwritten anyway */
3
+ Object.defineProperty(exports, "__esModule", { value: true });
package/index.d.ts CHANGED
@@ -25,6 +25,7 @@ export { EbayTabs, EbayTab, EbayTabPanel, Size as TabSize, Activation } from './
25
25
  export { EbayFakeTabs, EbayFakeTab } from './ebay-fake-tabs';
26
26
  export { EbaySvg } from './ebay-svg';
27
27
  export { EbayIcon, Icon, EbayIconProps, A11yVariant } from './ebay-icon';
28
+ export { EbayProgramBadge, ProgramBadge, EbayProgramBadgeProps } from './ebay-program-badge';
28
29
  export { EbayDialogHeader, EbayDialogFooter, EbayDialogCloseButton } from './ebay-dialog-base';
29
30
  export { EbayDrawerDialog } from './ebay-drawer-dialog';
30
31
  export { EbayFullscreenDialog } from './ebay-fullscreen-dialog';
package/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
package/index.js CHANGED
@@ -76,6 +76,8 @@ var ebay_svg_1 = require("./ebay-svg");
76
76
  Object.defineProperty(exports, "EbaySvg", { enumerable: true, get: function () { return ebay_svg_1.EbaySvg; } });
77
77
  var ebay_icon_1 = require("./ebay-icon");
78
78
  Object.defineProperty(exports, "EbayIcon", { enumerable: true, get: function () { return ebay_icon_1.EbayIcon; } });
79
+ var ebay_program_badge_1 = require("./ebay-program-badge");
80
+ Object.defineProperty(exports, "EbayProgramBadge", { enumerable: true, get: function () { return ebay_program_badge_1.EbayProgramBadge; } });
79
81
  var ebay_dialog_base_1 = require("./ebay-dialog-base");
80
82
  Object.defineProperty(exports, "EbayDialogHeader", { enumerable: true, get: function () { return ebay_dialog_base_1.EbayDialogHeader; } });
81
83
  Object.defineProperty(exports, "EbayDialogFooter", { enumerable: true, get: function () { return ebay_dialog_base_1.EbayDialogFooter; } });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ebay/ui-core-react",
3
- "version": "3.6.0",
3
+ "version": "3.8.0",
4
4
  "description": "Skin components build off React",
5
5
  "main": "index.js",
6
6
  "types": "index.d.ts",
@@ -41,7 +41,7 @@
41
41
  "author": "tmanyanov@ebay.com",
42
42
  "license": "ISC",
43
43
  "peerDependencies": {
44
- "@ebay/skin": "^15.0.0",
44
+ "@ebay/skin": "^15.2.0",
45
45
  "react": "^16.0.0",
46
46
  "react-dom": "^16.0.0"
47
47
  },