@ebay/ui-core-react 2.0.0 → 2.1.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 +18 -5
- package/ebay-button/README.md +5 -3
- package/ebay-button/button-text.d.ts +5 -0
- package/ebay-button/button-text.d.ts.map +1 -0
- package/ebay-button/button-text.js +12 -0
- package/ebay-button/button.d.ts +3 -1
- package/ebay-button/button.d.ts.map +1 -1
- package/ebay-button/button.js +17 -4
- package/ebay-button/types.d.ts +3 -3
- package/ebay-button/types.d.ts.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -11,6 +11,7 @@ eBayUI React components
|
|
|
11
11
|
* [eBay Skin](https://ebay.github.io/skin/) (v15)
|
|
12
12
|
|
|
13
13
|
### eBayUI Components
|
|
14
|
+
* [ ] `ebay-3d-viewer`
|
|
14
15
|
* [x] [ebay-alert-dialog](src/ebay-alert-dialog)
|
|
15
16
|
* [x] [ebay-confirm-dialog](src/ebay-confirm-dialog)
|
|
16
17
|
* [x] [ebay-badge](src/ebay-badge)
|
|
@@ -19,12 +20,13 @@ eBayUI React components
|
|
|
19
20
|
* [ ] `ebay-carousel` (in progress...)
|
|
20
21
|
* [x] [ebay-checkbox](src/ebay-checkbox)
|
|
21
22
|
* [ ] `ebay-combobox`
|
|
22
|
-
* [ ] `ebay-
|
|
23
|
+
* [ ] `ebay-confirm-dialog`
|
|
23
24
|
* [x] [ebay-cta-button](src/ebay-cta-button)
|
|
24
25
|
* [ ] `ebay-details`
|
|
25
26
|
* [x] [ebay-drawer-dialog](src/ebay-drawer-dialog)
|
|
26
27
|
* [x] [ebay-eek](src/ebay-eek)
|
|
27
28
|
* [x] [ebay-fullscreen-dialog](src/ebay-fullscreen-dialog)
|
|
29
|
+
* [ ] `eebay-fake-link`
|
|
28
30
|
* [ ] `ebay-fake-menu` (in progress...)
|
|
29
31
|
* [ ] `ebay-fake-menu-button` (in progress...)
|
|
30
32
|
* [ ] `ebay-fake-tabs`
|
|
@@ -32,16 +34,19 @@ eBayUI React components
|
|
|
32
34
|
* [ ] `ebay-filter` (in progress...)
|
|
33
35
|
* [ ] `ebay-filter-menu`
|
|
34
36
|
* [ ] `ebay-filter-menu-button`
|
|
37
|
+
* [ ] `ebay-icon-button`
|
|
35
38
|
* [x] [ebay-icon](src/ebay-icon)
|
|
36
39
|
* [x] [ebay-infotip](src/ebay-infotip)
|
|
37
40
|
* [x] [ebay-inline-notice](src/ebay-inline-notice)
|
|
38
41
|
* [x] [ebay-lightbox-dialog](src/ebay-lightbox-dialog)
|
|
39
42
|
* [x] [ebay-listbox-button](src/ebay-listbox-button)
|
|
43
|
+
* [ ] `ebay-listbox`
|
|
40
44
|
* [x] [ebay-menu] (src/ebay-menu)
|
|
41
45
|
* [ ] `ebay-menu-button` (in progress...)
|
|
42
46
|
* [x] [ebay-page-notice](src/ebay-page-notice)
|
|
43
47
|
* [x] [ebay-pagination](src/ebay-pagination)
|
|
44
48
|
* [x] [ebay-panel-dialog](src/ebay-panel-dialog)
|
|
49
|
+
* [ ] `ebay-program-badge`
|
|
45
50
|
* [x] [ebay-progress-bar](src/ebay-progress-bar)
|
|
46
51
|
* [x] [ebay-progress-spinner](src/ebay-progress-spinner)
|
|
47
52
|
* [x] [ebay-progress-stepper](src/ebay-progress-stepper)
|
|
@@ -50,17 +55,18 @@ eBayUI React components
|
|
|
50
55
|
* [x] [ebay-section-notice](src/ebay-section-notice)
|
|
51
56
|
* [x] [ebay-select](src/ebay-select)
|
|
52
57
|
* [ ] `ebay-snackbar-dialog`
|
|
58
|
+
* [ ] `ebay-split-button`
|
|
59
|
+
* [ ] `ebay-star-rating`
|
|
60
|
+
* [ ] `ebay-star-rating-select`
|
|
53
61
|
* [x] [ebay-switch](src/ebay-switch)
|
|
54
62
|
* [x] [ebay-signal](src/ebay-signal)
|
|
55
|
-
* [x] [ebay-
|
|
63
|
+
* [x] [ebay-tabs](src/ebay-tabs)
|
|
56
64
|
* [x] [ebay-textbox](src/ebay-textbox)
|
|
57
65
|
* [x] [ebay-toast-dialog](src/ebay-toast-dialog)
|
|
58
66
|
* [x] [ebay-tooltip](src/ebay-tooltip)
|
|
59
67
|
* [ ] `ebay-tourtip`
|
|
68
|
+
* [ ] `ebay-tri-state-checkbox`
|
|
60
69
|
* [ ] `ebay-video`
|
|
61
|
-
* [ ] `ebay-window-notice`
|
|
62
|
-
|
|
63
|
-
[Progress overview](https://github.com/eBay/ebayui-core-react/projects/1)
|
|
64
70
|
|
|
65
71
|
## Getting Started
|
|
66
72
|
|
|
@@ -173,7 +179,14 @@ One way to comply those guidelines is to implement your new component as similia
|
|
|
173
179
|
|
|
174
180
|
## Changelog
|
|
175
181
|
|
|
182
|
+
`@ebay/ui-core-react`
|
|
183
|
+
### version 2.x (Skin 15)
|
|
184
|
+
|
|
185
|
+
`@ebay/ebayui-core-react`
|
|
186
|
+
### version 10.x (Skin 14)
|
|
176
187
|
### version 9.x (skin 13)
|
|
188
|
+
|
|
189
|
+
`ebayui-core-react`
|
|
177
190
|
### version 8.x (skin 12)
|
|
178
191
|
### version 6.x (skin 10)
|
|
179
192
|
### version 5.x (removed less, changed imports to minimize bundle size)
|
package/ebay-button/README.md
CHANGED
|
@@ -45,14 +45,16 @@ import '@ebay/skin/button.css'
|
|
|
45
45
|
Name | Type | Stateful | Required | Description | Data
|
|
46
46
|
--- | --- | --- | --- | --- | ---
|
|
47
47
|
`priority` | String | No | No | `primary`, `secondary` (default), `tertiary`, `none`
|
|
48
|
-
`variant` | String | Yes | No | `standard` (default), `destructive`
|
|
49
|
-
`size` | String | No | No | `
|
|
50
|
-
`bodyState` | String | No | No | `loading`
|
|
48
|
+
`variant` | String | Yes | No | `standard` (default), `destructive`, `form`
|
|
49
|
+
`size` | String | No | No | `regular` (default), `large`
|
|
50
|
+
`bodyState` | String | No | No | `loading`, `expand`
|
|
51
51
|
`href` | String | No | No | for link that looks like a button
|
|
52
52
|
`fluid` | Boolean | No | No | takes the whole width of the parent element
|
|
53
53
|
`disabled` | Boolean | Yes | No
|
|
54
54
|
`partiallyDisabled` | Boolean | No | No | sets aria disabled but not disabled attribute
|
|
55
55
|
`transparent` | Boolean | Yes | No | for transparent background
|
|
56
56
|
`truncate` | Boolean | No | No | will truncate the text of the button onto a single line, and adds an ellipsis, when the button's text overflows
|
|
57
|
+
`borderless` | Boolean | No | No | Use the borderless modifier to remove the border from the expandable button.
|
|
58
|
+
`fixedHeight` | Boolean | No | No | Fixes the height based on `size`.
|
|
57
59
|
`onClick` | Function | - | No | click or action key pressed (`Space` / `Enter`)
|
|
58
60
|
`onEscape` | Function | - | No | `Esc`-key pressed
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"button-text.d.ts","sourceRoot":"","sources":["../../src/ebay-button/button-text.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGjD,aAAK,KAAK,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;AAEnC,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,KAAK,CAE7B,CAAA;AAED,eAAe,cAAc,CAAA"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
8
|
+
var EbayButtonText = function (_a) {
|
|
9
|
+
var className = _a.className, children = _a.children;
|
|
10
|
+
return (react_1.default.createElement("span", { className: classnames_1.default(className, 'btn__text') }, children));
|
|
11
|
+
};
|
|
12
|
+
exports.default = EbayButtonText;
|
package/ebay-button/button.d.ts
CHANGED
|
@@ -13,8 +13,10 @@ export declare type EbayButtonProps = {
|
|
|
13
13
|
onClick?: (e: MouseEvent) => void;
|
|
14
14
|
onEscape?: (e: KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
|
|
15
15
|
forwardedRef?: RefObject<HTMLAnchorElement & HTMLButtonElement>;
|
|
16
|
+
borderless?: boolean;
|
|
17
|
+
fixedHeight?: boolean;
|
|
16
18
|
};
|
|
17
19
|
declare type Props = ComponentProps<'button'> & ComponentProps<'a'> & EbayButtonProps;
|
|
18
|
-
declare const _default: React.ForwardRefExoticComponent<Pick<Props, "form" | "slot" | "style" | "title" | "type" | "download" | "key" | "name" | "className" | "forwardedRef" | "color" | "id" | "lang" | "media" | "target" | "role" | "tabIndex" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "size" | "priority" | "variant" | "bodyState" | "transparent" | "fluid" | "disabled" | "partiallyDisabled" | "onEscape" | "truncate" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "hrefLang" | "ping" | "rel" | "referrerPolicy"> & React.RefAttributes<React.FC<Props>>>;
|
|
20
|
+
declare const _default: React.ForwardRefExoticComponent<Pick<Props, "form" | "slot" | "style" | "title" | "type" | "download" | "key" | "name" | "className" | "forwardedRef" | "color" | "id" | "lang" | "media" | "target" | "role" | "tabIndex" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "size" | "priority" | "variant" | "bodyState" | "transparent" | "fluid" | "disabled" | "partiallyDisabled" | "onEscape" | "truncate" | "borderless" | "fixedHeight" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "hrefLang" | "ping" | "rel" | "referrerPolicy"> & React.RefAttributes<React.FC<Props>>>;
|
|
19
21
|
export default _default;
|
|
20
22
|
//# sourceMappingURL=button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/ebay-button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEV,cAAc,EAEd,aAAa,EACb,UAAU,EAGV,SAAS,EACZ,MAAM,OAAO,CAAA;AAGd,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/ebay-button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEV,cAAc,EAEd,aAAa,EACb,UAAU,EAGV,SAAS,EACZ,MAAM,OAAO,CAAA;AAGd,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAM5D,oBAAY,eAAe,GAAG;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC7E,YAAY,CAAC,EAAE,SAAS,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB,CAAA;AAED,aAAK,KAAK,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,eAAe,CAAC;;AAyG9E,wBAAyC"}
|
package/ebay-button/button.js
CHANGED
|
@@ -49,12 +49,14 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
|
49
49
|
var component_utils_1 = require("../common/component-utils");
|
|
50
50
|
var ebay_icon_1 = require("../ebay-icon");
|
|
51
51
|
var button_loading_1 = __importDefault(require("./button-loading"));
|
|
52
|
+
var button_cell_1 = __importDefault(require("./button-cell"));
|
|
53
|
+
var button_text_1 = __importDefault(require("./button-text"));
|
|
52
54
|
function isIconOnly(children) {
|
|
53
55
|
var childrenArray = react_1.Children.toArray(children);
|
|
54
56
|
return childrenArray.length === 1 && childrenArray[0].type === ebay_icon_1.EbayIcon;
|
|
55
57
|
}
|
|
56
58
|
var EbayButton = function (_a) {
|
|
57
|
-
var _b = _a.priority, priority = _b === void 0 ? 'secondary' : _b, _c = _a.variant, variant = _c === void 0 ? 'standard' : _c, _d = _a.size, size = _d === void 0 ? '
|
|
59
|
+
var _b = _a.priority, priority = _b === void 0 ? 'secondary' : _b, _c = _a.variant, variant = _c === void 0 ? 'standard' : _c, _d = _a.size, size = _d === void 0 ? 'regular' : _d, bodyState = _a.bodyState, _e = _a.transparent, transparent = _e === void 0 ? false : _e, _f = _a.fluid, fluid = _f === void 0 ? false : _f, disabled = _a.disabled, partiallyDisabled = _a.partiallyDisabled, children = _a.children, _g = _a.onEscape, onEscape = _g === void 0 ? function () { } : _g, _h = _a.truncate, truncate = _h === void 0 ? false : _h, href = _a.href, extraClasses = _a.className, forwardedRef = _a.forwardedRef, borderless = _a.borderless, fixedHeight = _a.fixedHeight, rest = __rest(_a, ["priority", "variant", "size", "bodyState", "transparent", "fluid", "disabled", "partiallyDisabled", "children", "onEscape", "truncate", "href", "className", "forwardedRef", "borderless", "fixedHeight"]);
|
|
58
60
|
var iconOnly = isIconOnly(children);
|
|
59
61
|
var classPrefix = href ? 'fake-btn' : 'btn';
|
|
60
62
|
var priorityStyles = {
|
|
@@ -65,17 +67,28 @@ var EbayButton = function (_a) {
|
|
|
65
67
|
};
|
|
66
68
|
var sizeStyles = {
|
|
67
69
|
large: classPrefix + "--large",
|
|
70
|
+
regular: '',
|
|
68
71
|
default: ''
|
|
69
72
|
};
|
|
70
73
|
var isDestructive = variant === 'destructive';
|
|
71
|
-
var
|
|
72
|
-
var
|
|
74
|
+
var isForm = variant === 'form';
|
|
75
|
+
var isLoading = bodyState === 'loading';
|
|
76
|
+
var isExpand = bodyState === 'expand';
|
|
77
|
+
var className = classnames_1.default(classPrefix, extraClasses, priorityStyles[isForm || borderless ? 'none' : priority], sizeStyles[size], isDestructive && classPrefix + "--destructive", isForm && classPrefix + "--form", iconOnly && classPrefix + "--icon-only", transparent && classPrefix + "--transparent", fluid && classPrefix + "--fluid", truncate && classPrefix + "--truncated", borderless && classPrefix + "--borderless", fixedHeight && (sizeStyles[size] ? sizeStyles[size] + "-" + fixedHeight : classPrefix + "--fixed-height"));
|
|
73
78
|
var onKeyDown = function (e) {
|
|
74
79
|
if (e.key === 'Escape' || e.key === 'Esc') {
|
|
75
80
|
onEscape(e);
|
|
76
81
|
}
|
|
77
82
|
};
|
|
78
|
-
var bodyContent =
|
|
83
|
+
var bodyContent = children;
|
|
84
|
+
if (isLoading) {
|
|
85
|
+
bodyContent = react_1.default.createElement(button_loading_1.default, null);
|
|
86
|
+
}
|
|
87
|
+
else if (isExpand) {
|
|
88
|
+
bodyContent = (react_1.default.createElement(button_cell_1.default, null,
|
|
89
|
+
react_1.default.createElement(button_text_1.default, null, children),
|
|
90
|
+
react_1.default.createElement(ebay_icon_1.EbayIcon, { name: "dropdown" })));
|
|
91
|
+
}
|
|
79
92
|
var ariaLive = isLoading ? "polite" : null;
|
|
80
93
|
return href ? (react_1.default.createElement("a", __assign({ className: className, href: disabled ? undefined : href, ref: forwardedRef, onKeyDown: onKeyDown, "aria-live": ariaLive }, rest), bodyContent)) : (react_1.default.createElement("button", __assign({ disabled: disabled, "aria-disabled": partiallyDisabled, "aria-live": ariaLive, className: className, ref: forwardedRef, onKeyDown: onKeyDown }, rest), bodyContent));
|
|
81
94
|
};
|
package/ebay-button/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare type Priority = 'primary' | 'secondary' | 'tertiary' | 'none';
|
|
2
|
-
export declare type Variant = 'standard' | 'destructive';
|
|
3
|
-
export declare type Size = 'default' | 'large';
|
|
4
|
-
export declare type BodyState = 'loading';
|
|
2
|
+
export declare type Variant = 'standard' | 'destructive' | 'form';
|
|
3
|
+
export declare type Size = 'default' | 'regular' | 'large';
|
|
4
|
+
export declare type BodyState = 'loading' | 'expand';
|
|
5
5
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-button/types.ts"],"names":[],"mappings":"AAAA,oBAAY,QAAQ,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,CAAA;AAEpE,oBAAY,OAAO,GAAG,UAAU,GAAG,aAAa,CAAA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-button/types.ts"],"names":[],"mappings":"AAAA,oBAAY,QAAQ,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,CAAA;AAEpE,oBAAY,OAAO,GAAG,UAAU,GAAG,aAAa,GAAG,MAAM,CAAA;AAEzD,oBAAY,IAAI,GAAG,SAAS,GAAoB,SAAS,GAAG,OAAO,CAAA;AAEnE,oBAAY,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA"}
|