@ebay/ui-core-react 8.1.3 → 8.2.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 +15 -14
- package/chip-CaMakGa6.js +1 -0
- package/combobox-BcAuEyib.js +1 -0
- package/common/dropdown.d.ts +1 -1
- package/common/dropdown.d.ts.map +1 -1
- package/common/notice-utils/notice-footer.d.ts +1 -1
- package/common/notice-utils/notice-footer.d.ts.map +1 -1
- package/common/notice-utils/notice-title.d.ts +1 -1
- package/common/notice-utils/notice-title.d.ts.map +1 -1
- package/ebay-chip/README.md +49 -0
- package/ebay-chip/chip.d.ts +11 -0
- package/ebay-chip/chip.d.ts.map +1 -0
- package/ebay-chip/index.d.ts +2 -0
- package/ebay-chip/index.d.ts.map +1 -0
- package/ebay-chip/index.js +1 -0
- package/ebay-chips-combobox/README.md +52 -0
- package/ebay-chips-combobox/chips-combobox.d.ts +14 -0
- package/ebay-chips-combobox/chips-combobox.d.ts.map +1 -0
- package/ebay-chips-combobox/index.d.ts +4 -0
- package/ebay-chips-combobox/index.d.ts.map +1 -0
- package/ebay-chips-combobox/index.js +1 -0
- package/ebay-chips-combobox/types.d.ts +6 -0
- package/ebay-chips-combobox/types.d.ts.map +1 -0
- package/ebay-combobox/README.md +1 -1
- package/ebay-combobox/combobox.d.ts +2 -1
- package/ebay-combobox/combobox.d.ts.map +1 -1
- package/ebay-combobox/index.js +1 -1
- package/ebay-education-notice/README.md +61 -0
- package/ebay-education-notice/education-notice-footer.d.ts +8 -0
- package/ebay-education-notice/education-notice-footer.d.ts.map +1 -0
- package/ebay-education-notice/education-notice-title.d.ts +8 -0
- package/ebay-education-notice/education-notice-title.d.ts.map +1 -0
- package/ebay-education-notice/education-notice.d.ts +17 -0
- package/ebay-education-notice/education-notice.d.ts.map +1 -0
- package/ebay-education-notice/index.d.ts +5 -0
- package/ebay-education-notice/index.d.ts.map +1 -0
- package/ebay-education-notice/index.js +1 -0
- package/ebay-education-notice/types.d.ts +3 -0
- package/ebay-education-notice/types.d.ts.map +1 -0
- package/ebay-fake-link/README.md +44 -0
- package/ebay-fake-link/fake-link.d.ts +9 -0
- package/ebay-fake-link/fake-link.d.ts.map +1 -0
- package/ebay-fake-link/index.d.ts +2 -0
- package/ebay-fake-link/index.d.ts.map +1 -0
- package/ebay-fake-link/index.js +1 -0
- package/ebay-filter/README.md +47 -0
- package/ebay-filter/filter.d.ts +12 -0
- package/ebay-filter/filter.d.ts.map +1 -0
- package/ebay-filter/index.d.ts +3 -0
- package/ebay-filter/index.d.ts.map +1 -0
- package/ebay-filter/index.js +1 -0
- package/ebay-filter/types.d.ts +6 -0
- package/ebay-filter/types.d.ts.map +1 -0
- package/ebay-filter-menu/README.md +57 -0
- package/ebay-filter-menu/filter-menu-footer-button.d.ts +16 -0
- package/ebay-filter-menu/filter-menu-footer-button.d.ts.map +1 -0
- package/ebay-filter-menu/filter-menu-item.d.ts +22 -0
- package/ebay-filter-menu/filter-menu-item.d.ts.map +1 -0
- package/ebay-filter-menu/filter-menu.d.ts +21 -0
- package/ebay-filter-menu/filter-menu.d.ts.map +1 -0
- package/ebay-filter-menu/index.d.ts +5 -0
- package/ebay-filter-menu/index.d.ts.map +1 -0
- package/ebay-filter-menu/index.js +1 -0
- package/ebay-filter-menu/types.d.ts +22 -0
- package/ebay-filter-menu/types.d.ts.map +1 -0
- package/ebay-filter-menu-button/README.md +48 -0
- package/ebay-filter-menu-button/filter-menu-button.d.ts +11 -0
- package/ebay-filter-menu-button/filter-menu-button.d.ts.map +1 -0
- package/ebay-filter-menu-button/index.d.ts +3 -0
- package/ebay-filter-menu-button/index.d.ts.map +1 -0
- package/ebay-filter-menu-button/index.js +1 -0
- package/ebay-page-notice/index.js +1 -1
- package/ebay-radio/index.js +1 -1
- package/ebay-section-notice/index.js +1 -1
- package/filter-menu-CF5Lvzqu.js +1 -0
- package/notice-cta-CKl_qBge.js +1 -0
- package/notice-footer-G6VPjVZu.js +1 -0
- package/package.json +3 -1
- package/radio-wp0-bMIM.js +1 -0
- package/notice-cta-hm2vI5MI.js +0 -1
package/README.md
CHANGED
|
@@ -12,10 +12,10 @@ eBayUI React components
|
|
|
12
12
|
|
|
13
13
|
### eBayUI Components
|
|
14
14
|
* [ ] `ebay-3d-viewer`
|
|
15
|
+
* [x] [ebay-accordion](src/ebay-accordion)
|
|
15
16
|
* [x] [ebay-alert-dialog](src/ebay-alert-dialog)
|
|
16
17
|
* [ ] `ebay-area-chart`
|
|
17
|
-
* [
|
|
18
|
-
* [x] [ebay-confirm-dialog](src/ebay-confirm-dialog)
|
|
18
|
+
* [x] [`ebay-avatar`](src/ebay-avatar)
|
|
19
19
|
* [x] [ebay-badge](src/ebay-badge)
|
|
20
20
|
* [ ] `ebay-bar-chart`
|
|
21
21
|
* [x] [ebay-breadcrumbs](src/ebay-breadcrumbs)
|
|
@@ -25,24 +25,24 @@ eBayUI React components
|
|
|
25
25
|
* [x] [ebay-carousel](src/ebay-carousel)
|
|
26
26
|
* [ ] `ebay-chart-legend`
|
|
27
27
|
* [x] [ebay-checkbox](src/ebay-checkbox)
|
|
28
|
-
* [
|
|
29
|
-
* [
|
|
30
|
-
* [
|
|
28
|
+
* [x] [ebay-chip](src/ebay-chip)
|
|
29
|
+
* [x] [ebay-chips-combobox](src/ebay-chips-combobox)
|
|
30
|
+
* [x] [ebay-combobox](src/ebay-combobox)
|
|
31
31
|
* [x] [ebay-confirm-dialog](src/ebay-confirm-dialog)
|
|
32
32
|
* [x] [ebay-cta-button](src/ebay-cta-button)
|
|
33
33
|
* [x] [ebay-date-textbox](src/ebay-date-textbox)
|
|
34
|
-
* [
|
|
34
|
+
* [x] [ebay-details](src/ebay-details)
|
|
35
35
|
* [ ] `ebay-donut-chart`
|
|
36
|
-
* [
|
|
36
|
+
* [x] [ebay-education-notice](src/ebay-education-notice)
|
|
37
37
|
* [x] [ebay-eek](src/ebay-eek)
|
|
38
|
-
* [
|
|
38
|
+
* [x] [ebay-fake-link](src/ebay-fake-link)
|
|
39
39
|
* [x] [ebay-fake-menu](src/ebay-fake-menu)
|
|
40
40
|
* [x] [ebay-fake-menu-button](src/ebay-fake-menu-button)
|
|
41
41
|
* [x] [ebay-fake-tabs](src/ebay-fake-tabs)
|
|
42
42
|
* [x] [ebay-field](src/ebay-field)
|
|
43
|
-
* [
|
|
44
|
-
* [
|
|
45
|
-
* [
|
|
43
|
+
* [x] [ebay-filter](src/ebay-filter)
|
|
44
|
+
* [x] [ebay-filter-menu](src/ebay-filter-menu)
|
|
45
|
+
* [x] [ebay-filter-menu-button](src/ebay-filter-menu-button)
|
|
46
46
|
* [ ] `ebay-flag`
|
|
47
47
|
* [x] [ebay-icon-button](src/ebay-icon-button)
|
|
48
48
|
* [x] [ebay-icon](src/ebay-icon)
|
|
@@ -52,7 +52,7 @@ eBayUI React components
|
|
|
52
52
|
* [x] [ebay-lightbox-dialog](src/ebay-lightbox-dialog)
|
|
53
53
|
* [ ] `ebay-line-chart`
|
|
54
54
|
* [x] [ebay-listbox-button](src/ebay-listbox-button)
|
|
55
|
-
* [
|
|
55
|
+
* [x] [ebay-listbox](src/ebay-listbox)
|
|
56
56
|
* [x] [ebay-menu](src/ebay-menu)
|
|
57
57
|
* [x] [ebay-menu-button](src/ebay-menu-button)
|
|
58
58
|
* [x] [ebay-page-notice](src/ebay-page-notice)
|
|
@@ -69,13 +69,14 @@ eBayUI React components
|
|
|
69
69
|
* [x] [ebay-segmented-buttons](src/ebay-segmented-buttons)
|
|
70
70
|
* [x] [ebay-select](src/ebay-select)
|
|
71
71
|
* [x] [ebay-signal](src/ebay-signal)
|
|
72
|
-
* [
|
|
72
|
+
* [x] [ebay-skeleton](src/ebay-skeleton)
|
|
73
73
|
* [x] [ebay-snackbar-dialog](src/ebay-snackbar-dialog)
|
|
74
74
|
* [ ] `ebay-spark-line`
|
|
75
75
|
* [x] [ebay-split-button](src/ebay-split-button)
|
|
76
76
|
* [x] [ebay-star-rating](src/ebay-star-rating)
|
|
77
77
|
* [x] [ebay-star-rating-select](src/ebay-star-rating-select)
|
|
78
78
|
* [x] [ebay-switch](src/ebay-switch)
|
|
79
|
+
* [x] [ebay-table](src/ebay-table)
|
|
79
80
|
* [x] [ebay-tabs](src/ebay-tabs)
|
|
80
81
|
* [x] [ebay-textbox](src/ebay-textbox)
|
|
81
82
|
* [x] [ebay-toast-dialog](src/ebay-toast-dialog)
|
|
@@ -83,7 +84,7 @@ eBayUI React components
|
|
|
83
84
|
* [x] [ebay-toggle-button-group](src/ebay-toast-dialog)
|
|
84
85
|
* [x] [ebay-tooltip](src/ebay-tooltip)
|
|
85
86
|
* [x] [ebay-tourtip](src/ebay-tourtip)
|
|
86
|
-
* [
|
|
87
|
+
* [x] [ebay-tristatecheckbox](src/ebay-tri-state-checkbox)
|
|
87
88
|
* [x] [ebay-video](src/ebay-video)
|
|
88
89
|
|
|
89
90
|
## Getting Started
|
package/chip-CaMakGa6.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const l=require("./tslib.es6-C4EgNkz1.js"),e=require("react"),o=require("./forwardRef-irqyO_PF.js");require("./array.polyfill.flat-5BAolFdk.js");const b=require("./icon-CeLPlCml.js"),u=t=>{var{a11yDeleteButtonText:a,onDelete:r,disabled:s,children:c}=t,i=l.__rest(t,["a11yDeleteButtonText","onDelete","disabled","children"]);const n=o.useRandomId();return e.createElement("span",Object.assign({},i,{className:"chip"}),e.createElement("span",{id:n,className:"ebay-chip__text"},c),a?e.createElement("button",{type:"button",className:"chip__button","aria-label":a,"aria-describedby":n,disabled:s,onClick:r},e.createElement(b.EbayIcon,{name:"close12"})):null)};exports.EbayChip=u;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const V=require("./tslib.es6-C4EgNkz1.js"),t=require("react"),x=require("classnames"),be=require("./hooks-DqYMvHrS.js"),M=require("./utils-C9NL3q0j.js"),I=require("./dropdown-BLiIyhWy.js"),K=a=>{var{className:p}=a,d=V.__rest(a,["className"]);return t.createElement("button",Object.assign({className:x("icon-btn","icon-btn--transparent",p)},d))},T=a=>{var{text:p,className:d,selected:C}=a,r=V.__rest(a,["text","className","selected"]);return t.createElement("div",Object.assign({},r,{role:"option",className:x("combobox__option",d),tabIndex:-1,"aria-selected":C}),p)},fe=a=>{var{className:p,floatingLabel:d,fluid:C,expanded:r,borderless:j,autocomplete:v="none",listSelection:k="automatic",forwardedRef:me,defaultValue:A="",value:h,placeholder:H,opaqueLabel:U,children:R,dropdownRef:Y,onFocus:z=()=>{},onClick:G=()=>{},onExpand:J=()=>{},onCollapse:P=()=>{},onInputChange:D=()=>{},onFloatingLabelInit:Q=()=>{},onChange:W=()=>{},onSelect:X=()=>{},onKeyDown:Z=()=>{}}=a,g=V.__rest(a,["className","floatingLabel","fluid","expanded","borderless","autocomplete","listSelection","forwardedRef","defaultValue","value","placeholder","opaqueLabel","children","dropdownRef","onFocus","onClick","onExpand","onCollapse","onInputChange","onFloatingLabelInit","onChange","onSelect","onKeyDown"]);const l=M.findComponent(R,K),y=M.filterByType(R,T),E=t.useRef(null),s=t.useRef(null),L=t.useRef(null),f=I.useExpander({ref:Y||E,expanded:r,options:{autoCollapse:r,expandOnFocus:!0,collapseOnFocusOut:!r&&!!l,contentSelector:'[role="listbox"]',hostSelector:'[role="combobox"]',expandedClass:"combobox--expanded",simulateSpacebarClick:!0},onExpand:J,onCollapse:P},[r]),{overlayStyles:$,refs:N}=I.useFloatingDropdown({open:f.isExpanded}),[ee,O]=t.useState(A||""),c=typeof h<"u"?h:ee;typeof h>"u"&&!D&&console.warn("EbayCombobox: You provided a value prop without an onInputChange handler.This will render a read-only input field. If you want the input to be editable, provide an onInputChange handler.");const _=(e,o)=>{c!==o&&(O(o),s.current&&(s.current.selectionStart=s.current.selectionEnd=o.length,s.current.focus()),X(e,b({currentInputValue:o})))};function oe(){return v==="none"?y||[]:y.filter(e=>{var o,n;return(o=e.props.text)===null||o===void 0?void 0:o.toLowerCase().includes((n=c==null?void 0:c.trim())===null||n===void 0?void 0:n.toLowerCase())})}const u=t.useMemo(()=>oe(),[v,c,y]),ne=t.useCallback((e,{toIndex:o})=>{if(k==="automatic"){const n=u[o];n&&s.current&&(s.current.value=n.props.text)}},[k,u]),te=I.useActiveDescendant({ref:E,focusElementRef:s,itemContainerRef:L,disabled:!u.length,onChange:ne,options:{activeDescendantClassName:"combobox__option--active",autoInit:-1,autoReset:-1,autoScroll:!0,axis:"y"}}),S=C?"div":"span",F=be.useFloatingLabel({text:d,disabled:g.disabled,containerTagName:S,opaqueLabel:U,onMount:Q}),le=d?F.Container:S,m=t.useRef(!1),ae=e=>{var o,n;m.current=!0,(n=l==null?void 0:(o=l.props).onClick)===null||n===void 0||n.call(o,e)},se=e=>{var o,n;m.current=!0,(n=l==null?void 0:(o=l.props).onMouseDown)===null||n===void 0||n.call(o,e)};function w(){f.collapse()}function q(){f.expand()}function re(e){const o=u.find(n=>n.props.text===e);return o?{text:o.props.text,value:o.props.value}:{}}function b(e){return{currentInputValue:e.currentInputValue,selectedOption:re(e.currentInputValue)}}const ce=e=>{const o=e.target.value;O(e.target.value),D(e,b({currentInputValue:o}))},B=t.useRef(""),ue=e=>{m.current||w(),m.current=!1;const o=e.target.value;o!==B.current&&(B.current=o,W(e,b({currentInputValue:o})))},ie=e=>{const o=e.target;o===document.activeElement&&q(),G(e,b({currentInputValue:o.value}))},de=e=>{z(e,b({currentInputValue:e.target.value}))},pe=e=>{if(e.key==="ArrowDown")q();else if(e.key==="Escape")w();else if(e.key==="Enter"&&f.isExpanded){const o=te.getIndex();o!==-1&&_(e,u[o].props.text),r||w()}Z(e)};return t.createElement(le,{ref:E,className:x("combobox",p)},t.createElement(F.Label,{htmlFor:g.id}),t.createElement("span",{className:x("combobox__control",{"combobox__control--actionable":l,"combobox__control--borderless":j})},t.createElement("input",Object.assign({},g,{ref:e=>{N.setHost(e),s.current=e},type:"text",role:"combobox",value:c,"aria-autocomplete":v,"aria-haspopup":"listbox",autoComplete:"off","aria-expanded":"false",onChange:ce,onBlur:ue,onClick:ie,onFocus:de,onKeyDown:pe,placeholder:H})),l?t.cloneElement(l,{onClick:ae,onMouseDown:se}):null),u.length>0&&t.createElement("div",{role:"listbox",className:"combobox__listbox",ref:e=>{N.setOverlay(e),L.current=e},style:$},u.map(e=>t.cloneElement(e,{selected:(e.props.value||e.props.text)===c,onClick:o=>{var n,i;_(o,e.props.text),(i=(n=e.props).onClick)===null||i===void 0||i.call(n,o)},onMouseDown:o=>{var n,i;_(o,e.props.text),(i=(n=e.props).onMouseDown)===null||i===void 0||i.call(n,o)}}))))};exports.EbayCombobox=fe;exports.EbayComboboxButton=K;exports.EbayComboboxOption=T;
|
package/common/dropdown.d.ts
CHANGED
package/common/dropdown.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../src/common/dropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAKH,WAAW,EACd,MAAM,oBAAoB,CAAA;AAI3B,MAAM,MAAM,0BAA0B,GAAG;IACrC,aAAa,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,gBAAgB,CAAC,CAAA;IAC/D,IAAI,EAAE;QACF,IAAI,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAA;QACzD,OAAO,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAA;QAC3D,OAAO,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC,CAAA;QAC/D,UAAU,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,aAAa,CAAC,CAAA;KACpE,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG;IACnC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,2BAA2B,CAAA;CACxC,CAAA;AAED,MAAM,MAAM,2BAA2B,GAAG;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CAAA;AAED,wBAAgB,mBAAmB,CAAC,EAChC,IAAI,EACJ,OAAO,EACV,EAAE,wBAAwB,GAAG,0BAA0B,CAiBvD;AAED,KAAK,SAAS,GAAG,MAAM,CAAA;AACvB,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,WAAW,IAAI;IAClD,GAAG,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE;QACL,eAAe,EAAE,MAAM,CAAA;QACvB,YAAY,EAAE,MAAM,CAAA;QACpB,aAAa,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../src/common/dropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAKH,WAAW,EACd,MAAM,oBAAoB,CAAA;AAI3B,MAAM,MAAM,0BAA0B,GAAG;IACrC,aAAa,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,gBAAgB,CAAC,CAAA;IAC/D,IAAI,EAAE;QACF,IAAI,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAA;QACzD,OAAO,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAA;QAC3D,OAAO,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC,CAAA;QAC/D,UAAU,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,aAAa,CAAC,CAAA;KACpE,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG;IACnC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,2BAA2B,CAAA;CACxC,CAAA;AAED,MAAM,MAAM,2BAA2B,GAAG;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CAAA;AAED,wBAAgB,mBAAmB,CAAC,EAChC,IAAI,EACJ,OAAO,EACV,EAAE,wBAAwB,GAAG,0BAA0B,CAiBvD;AAED,KAAK,SAAS,GAAG,MAAM,CAAA;AACvB,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,WAAW,IAAI;IAClD,GAAG,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE;QACL,eAAe,EAAE,MAAM,CAAA;QACvB,YAAY,EAAE,MAAM,CAAA;QACpB,aAAa,CAAC,EAAE,MAAM,CAAA;QACtB,YAAY,CAAC,EAAE,OAAO,CAAA;QACtB,aAAa,CAAC,EAAE,OAAO,CAAA;QACvB,aAAa,CAAC,EAAE,OAAO,CAAA;QACvB,kBAAkB,CAAC,EAAE,OAAO,CAAA;QAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAA;QAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAA;QAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAA;QAC7B,aAAa,CAAC,EAAE,OAAO,CAAA;QACvB,eAAe,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,aAAa,GAAG,SAAS,CAAA;QACrE,qBAAqB,CAAC,EAAE,OAAO,CAAC;QAChC,uBAAuB,CAAC,EAAE,OAAO,CAAA;QACjC,YAAY,CAAC,EAAE,OAAO,CAAA;KACzB,CAAA;IACD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC7B,UAAU,EAAE,OAAO,CAAA;IACnB,MAAM,IAAI,IAAI,CAAA;IACd,QAAQ,IAAI,IAAI,CAAA;CACnB,CAAA;AAED,wBAAgB,WAAW,CAAC,CAAC,SAAS,WAAW,EAAE,EAC/C,GAAG,EACH,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,UAAU,EACb,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,GAAG,kBAAkB,CAmDvE;AAED,KAAK,aAAa,GACd,MAAM,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,GAAG,cAAc,GAAG,2BAA2B,GAAG,MAAM,CAAA;AAE9G,MAAM,MAAM,6BAA6B,GAAG,CAAC,KAAK,EAAE,2BAA2B,EAAE,IAAI,EAAE;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,KAAK,IAAI,CAAA;AAEnH,MAAM,MAAM,wBAAwB,GAAG;IACnC,GAAG,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzC,eAAe,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACtD,gBAAgB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,6BAA6B,CAAC;IACzC,OAAO,EAAE;QACL,yBAAyB,EAAE,MAAM,CAAC;QAClC,QAAQ,CAAC,EAAE,aAAa,CAAC;QACzB,SAAS,CAAC,EAAE,aAAa,CAAC;QAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,GAAG,GAAG,GAAG,GAAG,CAAC;QAC1B,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,IAAI,CAAC,EAAE,OAAO,CAAC;KAClB,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,0BAA0B,GAAG;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,MAAM,MAAM,CAAC;CAC1B,CAAA;AAED,MAAM,WAAW,2BAA4B,SAAQ,KAAK;IACtD,MAAM,EAAE;QACJ,OAAO,EAAE,MAAM,CAAA;KAClB,CAAA;CACJ;AAED,wBAAgB,mBAAmB,CAAC,EAChC,GAAG,EACH,eAAe,EACf,gBAAgB,EAChB,QAAqB,EACrB,QAAQ,EACR,OAAO,EACV,EAAE,wBAAwB,GAAG,0BAA0B,CAuCvD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notice-footer.d.ts","sourceRoot":"","sources":["../../../src/common/notice-utils/notice-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGjC,KAAK,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,GAAG;IAC3C,IAAI,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,
|
|
1
|
+
{"version":3,"file":"notice-footer.d.ts","sourceRoot":"","sources":["../../../src/common/notice-utils/notice-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGjC,KAAK,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,GAAG;IAC3C,IAAI,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,CAAA;IACjD,SAAS,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,KAAK,CAI3B,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notice-title.d.ts","sourceRoot":"","sources":["../../../src/common/notice-utils/notice-title.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGjC,KAAK,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,kBAAkB,CAAC,GAAG;IAC/C,IAAI,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"notice-title.d.ts","sourceRoot":"","sources":["../../../src/common/notice-utils/notice-title.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGjC,KAAK,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,kBAAkB,CAAC,GAAG;IAC/C,IAAI,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,CAAC;IAClD,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAA;AAED,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,KAAK,CAO1B,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
# EbayChip
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/building-blocks-ebay-chip--docs)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
### Import JS
|
|
10
|
+
|
|
11
|
+
```jsx harmony
|
|
12
|
+
import EbayChip from "@ebay/ui-core-react/ebay-chip";
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Import following styles from SKIN
|
|
16
|
+
|
|
17
|
+
```jsx harmony
|
|
18
|
+
import "@ebay/skin/chip";
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
### If tokens haven't been added to the project at a higher level, make sure to import
|
|
22
|
+
|
|
23
|
+
```jsx harmony
|
|
24
|
+
import "@ebay/skin/tokens";
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Or import styles using SCSS/CSS
|
|
28
|
+
|
|
29
|
+
```jsx harmony
|
|
30
|
+
import "@ebay/skin/chip.css";
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
```jsx harmony
|
|
34
|
+
<EbayChip
|
|
35
|
+
a11yDeleteButtonText="Remove item"
|
|
36
|
+
onDelete={handleDelete}
|
|
37
|
+
disabled={false}
|
|
38
|
+
>
|
|
39
|
+
Chip Content
|
|
40
|
+
</EbayChip>
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
## Attributes
|
|
44
|
+
|
|
45
|
+
| Name | Type | Required | Description |
|
|
46
|
+
| ---------------------- | -------- | -------- | ------------------------------------------ |
|
|
47
|
+
| `a11yDeleteButtonText` | String | No | Accessibility text for the delete button |
|
|
48
|
+
| `onDelete` | Function | Yes | Triggered when the delete button is clicked|
|
|
49
|
+
| `disabled` | Boolean | No | Whether the chip is disabled |
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React, { ComponentProps, FC } from 'react';
|
|
2
|
+
import { EbayMouseEventHandler } from '../events';
|
|
3
|
+
export type EbayChipProps = {
|
|
4
|
+
a11yDeleteButtonText?: string;
|
|
5
|
+
onDelete: EbayMouseEventHandler<HTMLButtonElement>;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
} & ComponentProps<'span'>;
|
|
9
|
+
declare const EbayChip: FC<EbayChipProps>;
|
|
10
|
+
export default EbayChip;
|
|
11
|
+
//# sourceMappingURL=chip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../src/ebay-chip/chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AACjD,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;AAIjD,MAAM,MAAM,aAAa,GAAG;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IAClD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC5B,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;AAE1B,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA0B/B,CAAA;AAED,eAAe,QAAQ,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,QAAQ,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../chip-CaMakGa6.js");exports.EbayChip=e.EbayChip;
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
# EbayChipsCombobox
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/form-input-ebay-chips-combobox--docs)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
### Import JS
|
|
10
|
+
|
|
11
|
+
```jsx harmony
|
|
12
|
+
import { EbayChipsCombobox, EbayComboboxOption } from "@ebay/ui-core-react/ebay-chips-combobox";
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Import following styles from SKIN
|
|
16
|
+
|
|
17
|
+
```jsx harmony
|
|
18
|
+
import "@ebay/skin/combobox";
|
|
19
|
+
import "@ebay/skin/chip";
|
|
20
|
+
import "@ebay/skin/chips-combobox";
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
### If tokens haven't been added to the project at a higher level, make sure to import
|
|
24
|
+
|
|
25
|
+
```jsx harmony
|
|
26
|
+
import "@ebay/skin/tokens";
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### Or import styles using SCSS/CSS
|
|
30
|
+
|
|
31
|
+
```jsx harmony
|
|
32
|
+
import "@ebay/skin/combobox.css";
|
|
33
|
+
import "@ebay/skin/chip.css";
|
|
34
|
+
import "@ebay/skin/chips-combobox.css";
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
```jsx harmony
|
|
38
|
+
<EbayChipsCombobox onChange={handleChange}>
|
|
39
|
+
<EbayComboboxOption value="option1">Option 1</EbayComboboxOption>
|
|
40
|
+
<EbayComboboxOption value="option2">Option 2</EbayComboboxOption>
|
|
41
|
+
<EbayComboboxOption value="option3">Option 3</EbayComboboxOption>
|
|
42
|
+
</EbayChipsCombobox>
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
## Attributes
|
|
46
|
+
|
|
47
|
+
The `EbayChipsCombobox` supports the same attributes as the [EbayCombobox](../ebay-combobox/README.md), with additional attributes specific to the chips functionality:
|
|
48
|
+
|
|
49
|
+
| Name | Type | Required | Description | Data |
|
|
50
|
+
| ---------------------- | -------- | -------- | ---------------------------------------- | ---------------------------------------- |
|
|
51
|
+
| `a11yDeleteButtonText` | String | No | Accessibility text for the delete button | |
|
|
52
|
+
| `onChange` | Function | No | Triggered when the selection changes | `(event: Event, { selected: string[] })` |
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ChipsComboboxChangeHandler } from './types';
|
|
3
|
+
import { EbayComboboxProps } from '../ebay-combobox';
|
|
4
|
+
export type EbayChipsComboboxProps = Omit<EbayComboboxProps, 'onChange'> & {
|
|
5
|
+
error?: boolean;
|
|
6
|
+
selected?: string[];
|
|
7
|
+
defaultSelected?: string[];
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
a11yDeleteButtonText?: string;
|
|
10
|
+
onChange?: ChipsComboboxChangeHandler;
|
|
11
|
+
};
|
|
12
|
+
declare const EbayChipsCombobox: React.FC<EbayChipsComboboxProps>;
|
|
13
|
+
export default EbayChipsCombobox;
|
|
14
|
+
//# sourceMappingURL=chips-combobox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chips-combobox.d.ts","sourceRoot":"","sources":["../../src/ebay-chips-combobox/chips-combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAEpD,OAAO,EAAoC,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAItF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,iBAAiB,EAAE,UAAU,CAAC,GAAG;IACzE,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAG,MAAM,EAAE,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,EAAE,0BAA0B,CAAA;CACtC,CAAA;AAED,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA6FvD,CAAA;AAED,eAAe,iBAAiB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-chips-combobox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,kBAAkB,CAAA;AAC5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AACrD,cAAc,SAAS,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("../tslib.es6-C4EgNkz1.js"),o=require("react"),N=require("classnames"),a=require("../combobox-BcAuEyib.js"),R=require("../utils-C9NL3q0j.js"),T=require("../chip-CaMakGa6.js");require("../hooks-DqYMvHrS.js");require("../array.polyfill.flat-5BAolFdk.js");require("../dropdown-BLiIyhWy.js");const B=i=>{var{className:h,fluid:x,error:y,disabled:c,selected:r,defaultSelected:u,a11yDeleteButtonText:f="Remove",onChange:n,children:C}=i,E=_.__rest(i,["className","fluid","error","disabled","selected","defaultSelected","a11yDeleteButtonText","onChange","children"]);const S=R.filterByType(C,a.EbayComboboxOption),[g,b]=o.useState(u||[]),s=r||g,[v,d]=o.useState(""),p=o.useRef(null),m=(e,t)=>{const l=[...s,t];b(l),n==null||n(e,{selected:[...l]}),d("")},w=(e,t)=>{const l=s.filter((I,D)=>D!==t);b(l),n==null||n(e,{selected:[...l]})},O=e=>{if(e.key==="Enter"){const t=e.target.value;e.preventDefault(),t&&!s.includes(t)&&m(e,t)}},q=(e,t)=>{d(t.currentInputValue)};if(r&&u)throw new Error('EbayChipsCombobox: You cannot use "selected" and "defaultSelected" at the same time.');if(r&&!n)throw new Error('EbayChipsCombobox: You must provide an "onChange" prop when using the "selected" prop.');return o.createElement("span",{ref:p,className:N(h,"chips-combobox",{"chips-combobox--fluid":x,"chips-combobox--error":y}),"aria-disabled":c?"true":void 0},s.length?o.createElement("ul",{className:"chips-combobox__items"},s.map((e,t)=>o.createElement("li",{key:t},o.createElement(T.EbayChip,{a11yDeleteButtonText:`${f} ${e}`,onDelete:l=>w(l,t),disabled:c},e)))):null,o.createElement(a.EbayCombobox,Object.assign({},E,{className:"chips-combobox__combobox",disabled:c,dropdownRef:p,value:v,autocomplete:"list",onSelect:(e,t)=>m(e,t.selectedOption.text),onInputChange:q,onKeyDown:O}),S.filter(e=>!s.includes(e.props.text))))};exports.EbayComboboxOption=a.EbayComboboxOption;exports.EbayChipsCombobox=B;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-chips-combobox/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAE5C,MAAM,MAAM,kBAAkB,GAAG;IAC7B,QAAQ,EAAE,MAAM,EAAE,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,0BAA0B,GAAG,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAA"}
|
package/ebay-combobox/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComponentProps, FC, Ref } from 'react';
|
|
1
|
+
import { ComponentProps, FC, MutableRefObject, Ref } from 'react';
|
|
2
2
|
import { Autocomplete, ListSelection, ComboboxSelectHandler, ComboboxFocusHandler, ComboboxClickHandler, ComboboxInputChangeHandler, ComboboxChangeHandler } from './types';
|
|
3
3
|
export type EbayComboboxProps = Omit<ComponentProps<'input'>, 'defaultValue' | 'value' | 'onFocus' | 'onInputChange' | 'onChange' | 'onSelect' | 'autoComplete'> & {
|
|
4
4
|
floatingLabel?: string;
|
|
@@ -11,6 +11,7 @@ export type EbayComboboxProps = Omit<ComponentProps<'input'>, 'defaultValue' | '
|
|
|
11
11
|
listSelection?: ListSelection;
|
|
12
12
|
forwardedRef?: Ref<HTMLInputElement>;
|
|
13
13
|
opaqueLabel?: boolean;
|
|
14
|
+
dropdownRef?: MutableRefObject<HTMLElement>;
|
|
14
15
|
onFocus?: ComboboxFocusHandler;
|
|
15
16
|
onClick?: ComboboxClickHandler;
|
|
16
17
|
onExpand?: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/ebay-combobox/combobox.tsx"],"names":[],"mappings":"AAAA,OAAc,EACV,cAAc,EACd,EAAE,EACF,GAAG,EAKN,MAAM,OAAO,CAAA;AAYd,OAAO,EACH,YAAY,EAEZ,aAAa,EACb,qBAAqB,EAErB,oBAAoB,EACpB,oBAAoB,EACpB,0BAA0B,EAC1B,qBAAqB,EACxB,MAAM,SAAS,CAAA;AAEhB,MAAM,MAAM,iBAAiB,GACzB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAC1B,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,eAAe,GAAG,UAAU,GAAG,UAAU,GAAG,cAAc,CAAC,GAClG;IACE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,YAAY,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,aAAa,CAAC,EAAE,0BAA0B,CAAC;IAC3C,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,qBAAqB,CAAC;IACjC,QAAQ,CAAC,EAAE,qBAAqB,CAAC;CACpC,CAAA;AAEL,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,
|
|
1
|
+
{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/ebay-combobox/combobox.tsx"],"names":[],"mappings":"AAAA,OAAc,EACV,cAAc,EACd,EAAE,EACF,gBAAgB,EAChB,GAAG,EAKN,MAAM,OAAO,CAAA;AAYd,OAAO,EACH,YAAY,EAEZ,aAAa,EACb,qBAAqB,EAErB,oBAAoB,EACpB,oBAAoB,EACpB,0BAA0B,EAC1B,qBAAqB,EACxB,MAAM,SAAS,CAAA;AAEhB,MAAM,MAAM,iBAAiB,GACzB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAC1B,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,eAAe,GAAG,UAAU,GAAG,UAAU,GAAG,cAAc,CAAC,GAClG;IACE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,YAAY,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAC5C,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,aAAa,CAAC,EAAE,0BAA0B,CAAC;IAC3C,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,qBAAqB,CAAC;IACjC,QAAQ,CAAC,EAAE,qBAAqB,CAAC;CACpC,CAAA;AAEL,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAqRvC,CAAA;AAED,eAAe,YAAY,CAAA"}
|
package/ebay-combobox/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../combobox-BcAuEyib.js");exports.EbayCombobox=o.EbayCombobox;exports.EbayComboboxButton=o.EbayComboboxButton;exports.EbayComboboxOption=o.EbayComboboxOption;
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
# EbayEducationNotice
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/notices-tips-ebay-education-notice--docs)
|
|
6
|
+
|
|
7
|
+
## Import JS
|
|
8
|
+
|
|
9
|
+
```jsx harmony
|
|
10
|
+
import {
|
|
11
|
+
EbayEducationNotice,
|
|
12
|
+
EbayNoticeContent,
|
|
13
|
+
EbayEducationNoticeTitle,
|
|
14
|
+
EbayEducationNoticeFooter
|
|
15
|
+
} from '@ebay/ui-core-react/ebay-education-notice'
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
### Import following styles from SKIN
|
|
19
|
+
|
|
20
|
+
```jsx harmony
|
|
21
|
+
import '@ebay/skin/education-notice'
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
## Use
|
|
25
|
+
|
|
26
|
+
```jsx harmony
|
|
27
|
+
<EbayEducationNotice educationIcon={<EbayIcon name="theEbayVault24" />}>
|
|
28
|
+
<EbayEducationNoticeTitle>
|
|
29
|
+
Recommended title format
|
|
30
|
+
</EbayEducationNoticeTitle>
|
|
31
|
+
<EbayNoticeContent>
|
|
32
|
+
<p>
|
|
33
|
+
Follow the order below to optimize market valuation from Price
|
|
34
|
+
Guide. Player + Set or Season + Manufacturer + Card number + Variant
|
|
35
|
+
+ Grader + Grade
|
|
36
|
+
</p>
|
|
37
|
+
</EbayNoticeContent>
|
|
38
|
+
<EbayEducationNoticeFooter>Education footer</EbayEducationNoticeFooter>
|
|
39
|
+
</EbayEducationNotice>
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
## Attributes
|
|
43
|
+
|
|
44
|
+
| Name | Type | Stateful | Description | Default |
|
|
45
|
+
| ---------------------- | -------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------------------- | ------------- |
|
|
46
|
+
| `educationIcon` | Icon | No | EbayIcon that will show in the notice | `lightbulb24` |
|
|
47
|
+
| `iconClass` | String | No | Add class name to icon | - |
|
|
48
|
+
| `a11yIconText` | String | No | Add description for the notice icon for a11y users | - |
|
|
49
|
+
| `aria-label` | String | No | The description of the notice itself for screen readers. Check out [this issue](https://github.com/eBay/skin/issues/1001) for more context. | - |
|
|
50
|
+
| `aria-roledescription` | String | No | Adds role description attribute to the section notice | `"Notice"` |
|
|
51
|
+
| `children` | React Node | No | The content to be displayed within the notice. **Must have the EbayEducationNoticeTitle within the children!** | - |
|
|
52
|
+
| `variant` | string (`"none"`, `"prominent"`) | No | Either none or prominent. If prominent, the notice will be more prominent | `"none"` |
|
|
53
|
+
| `iconVariant` | string (`"none"`, `"prominent"`) | No | Either none or prominent. If prominent, the notice icon will be more prominent | `"none"` |
|
|
54
|
+
| `a11yDismissText` | string | No | The a11y description for the dismiss button. It will also allow the notice to be dismissed. | - |
|
|
55
|
+
| `dismissed` | boolean | No | Whether or not the notice is dismissed | `false` |
|
|
56
|
+
|
|
57
|
+
## Callbacks
|
|
58
|
+
|
|
59
|
+
| Name | Required | Description | Arguments |
|
|
60
|
+
| ----------- | -------- | --------------------------- | --------- |
|
|
61
|
+
| `onDismiss` | No | Triggered on notice dismiss | (Event) |
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"education-notice-footer.d.ts","sourceRoot":"","sources":["../../src/ebay-education-notice/education-notice-footer.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAG5C,KAAK,KAAK,GAAG;IACT,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,CAAA;AAED,QAAA,MAAM,yBAAyB,EAAE,EAAE,CAAC,KAAK,CAIxC,CAAA;AAED,eAAe,yBAAyB,CAAA"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
type Props = React.HTMLProps<HTMLHeadingElement> & {
|
|
3
|
+
as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
4
|
+
className?: string;
|
|
5
|
+
};
|
|
6
|
+
declare const EbaySectionNoticeTitle: FC<Props>;
|
|
7
|
+
export default EbaySectionNoticeTitle;
|
|
8
|
+
//# sourceMappingURL=education-notice-title.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"education-notice-title.d.ts","sourceRoot":"","sources":["../../src/ebay-education-notice/education-notice-title.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGjC,KAAK,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,kBAAkB,CAAC,GAAG;IAC/C,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAA;AAED,QAAA,MAAM,sBAAsB,EAAE,EAAE,CAAC,KAAK,CAIrC,CAAA;AAED,eAAe,sBAAsB,CAAA"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { ComponentProps, FC } from 'react';
|
|
2
|
+
import { Icon } from '../ebay-icon/types';
|
|
3
|
+
import { EducationDismissHandler } from './types';
|
|
4
|
+
export type Props = ComponentProps<'section'> & {
|
|
5
|
+
a11yIconText?: string;
|
|
6
|
+
a11yDismissText?: string;
|
|
7
|
+
onDismiss?: EducationDismissHandler;
|
|
8
|
+
dismissed?: boolean;
|
|
9
|
+
prominent?: boolean;
|
|
10
|
+
educationIcon?: Icon;
|
|
11
|
+
iconClass?: string;
|
|
12
|
+
variant?: 'prominent' | 'none';
|
|
13
|
+
iconVariant?: 'prominent' | 'none';
|
|
14
|
+
};
|
|
15
|
+
declare const EbayEducationNotice: FC<Props>;
|
|
16
|
+
export default EbayEducationNotice;
|
|
17
|
+
//# sourceMappingURL=education-notice.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"education-notice.d.ts","sourceRoot":"","sources":["../../src/ebay-education-notice/education-notice.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAY,MAAM,OAAO,CAAA;AAM3D,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAA;AAEzC,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAIjD,MAAM,MAAM,KAAK,GAAG,cAAc,CAAC,SAAS,CAAC,GAAG;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,uBAAuB,CAAA;IACnC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,aAAa,CAAC,EAAE,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,CAAA;CACrC,CAAA;AAED,QAAA,MAAM,mBAAmB,EAAE,EAAE,CAAC,KAAK,CAoElC,CAAA;AAED,eAAe,mBAAmB,CAAA"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export { default as EbayEducationNotice, type Props as EbayEducationNoticeProps } from './education-notice';
|
|
2
|
+
export { default as EbayEducationNoticeTitle } from './education-notice-title';
|
|
3
|
+
export { default as EbayEducationNoticeFooter } from './education-notice-footer';
|
|
4
|
+
export { EbayNoticeContent } from '../ebay-notice-base/components/ebay-notice-content';
|
|
5
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-education-notice/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,OAAO,IAAI,mBAAmB,EAC9B,KAAK,KAAK,IAAI,wBAAwB,EACzC,MAAM,oBAAoB,CAAA;AAC3B,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,0BAA0B,CAAA;AAC9E,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,2BAA2B,CAAA;AAChF,OAAO,EAAE,iBAAiB,EAAE,MAAM,oDAAoD,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../tslib.es6-C4EgNkz1.js"),e=require("react"),d=require("classnames"),E=require("../notice-content-C0ZStfuX.js"),j=require("../notice-content-9iF4T8uB.js"),a=require("../utils-C9NL3q0j.js"),F=require("../icon-CeLPlCml.js"),O=require("../icon-button-CZtp0khK.js"),y=require("../notice-footer-G6VPjVZu.js"),P=t=>{var{children:n,className:o,a11yIconText:i,variant:c="none",iconVariant:p="none",a11yDismissText:r,educationIcon:C="lightbulb24",iconClass:h,prominent:S,dismissed:l=!1,onDismiss:T=()=>{}}=t,f=u.__rest(t,["children","className","a11yIconText","variant","iconVariant","a11yDismissText","educationIcon","iconClass","prominent","dismissed","onDismiss"]);const[q,v]=e.useState(l),s=a.findComponent(n,E.EbayNoticeContent),m=a.findComponent(n,N),I=a.findComponent(n,b),g=c==="prominent",D=p==="prominent",_=x=>{v(!0),T(x)};if(!m)throw new Error("<EbayEducationNoticeTitle>: Please use a <EbayEducationNoticeTitle> that defines the content of the notice");return q||l?null:e.createElement("section",Object.assign({"aria-roledescription":"Notice"},f,{className:d(o,"education-notice",{"education-notice--prominent":g}),role:"region"}),e.createElement("div",{className:"education-notice__header"},e.createElement(F.EbayIcon,{name:C,className:d(h,{"icon--prominent":D}),a11yText:i,a11yVariant:"label"}),m,r&&e.createElement(O.EbayIconButton,{"aria-label":r,size:"small",className:"education-notice__dismiss",onClick:_,icon:"close16"})),e.createElement(j.NoticeContent,Object.assign({},s==null?void 0:s.props,{type:"education"})),I)},N=t=>{var{className:n,as:o,children:i}=t,c=u.__rest(t,["className","as","children"]);return e.createElement(y.NoticeTitle,Object.assign({},c,{className:n,as:o,type:"education"}),i)},b=({className:t,children:n})=>e.createElement(y.NoticeFooter,{className:t,type:"education"},n);exports.EbayNoticeContent=E.EbayNoticeContent;exports.EbayEducationNotice=P;exports.EbayEducationNoticeFooter=b;exports.EbayEducationNoticeTitle=N;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-education-notice/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;AAEjD,MAAM,MAAM,uBAAuB,GAAG,qBAAqB,CAAC,WAAW,CAAC,CAAA"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
# EbayFakeLink
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/buttons-ebay-fake-link--docs)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
### Import JS
|
|
10
|
+
|
|
11
|
+
```jsx harmony
|
|
12
|
+
import { EbayFakeLink } from "@ebay/ui-core-react/ebay-fake-link";
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Import following styles from SKIN
|
|
16
|
+
|
|
17
|
+
```jsx harmony
|
|
18
|
+
import "@ebay/skin/link";
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
### If tokens haven't been added to the project at a higher level, make sure to import
|
|
22
|
+
|
|
23
|
+
```jsx harmony
|
|
24
|
+
import "@ebay/skin/tokens";
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Or import styles using SCSS/CSS
|
|
28
|
+
|
|
29
|
+
```jsx harmony
|
|
30
|
+
import "@ebay/skin/link.css";
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
```jsx harmony
|
|
34
|
+
<EbayFakeLink>Fake Link</EbayFakeLink>
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
## Attributes
|
|
38
|
+
|
|
39
|
+
It supports all `<button>` attributes and the below:
|
|
40
|
+
|
|
41
|
+
| Name | Type | Required | Description | Data |
|
|
42
|
+
| ---------- | -------- | -------- | --------------------------------------------------------------------------------------------------------------------------- | ---------------- |
|
|
43
|
+
| `variant` | String | No | Should only be standalone when it is clear contextually that this is a link, regardless of styles, `inline` or `standalone` | |
|
|
44
|
+
| `onEscape` | Function | No | Triggered on escape key | `(event: Event)` |
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ComponentProps, FC } from 'react';
|
|
2
|
+
import { EbayKeyboardEventHandler } from '../events';
|
|
3
|
+
export type EbayFakeLinkProps = ComponentProps<'button'> & {
|
|
4
|
+
variant?: 'inline' | 'standalone';
|
|
5
|
+
onEscape?: EbayKeyboardEventHandler<HTMLButtonElement>;
|
|
6
|
+
};
|
|
7
|
+
declare const EbayFakeLink: FC<EbayFakeLinkProps>;
|
|
8
|
+
export default EbayFakeLink;
|
|
9
|
+
//# sourceMappingURL=fake-link.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fake-link.d.ts","sourceRoot":"","sources":["../../src/ebay-fake-link/fake-link.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AACjD,OAAO,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAA;AAGpD,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACvD,OAAO,CAAC,EAAE,QAAQ,GAAG,YAAY,CAAA;IACjC,QAAQ,CAAC,EAAE,wBAAwB,CAAC,iBAAiB,CAAC,CAAA;CACzD,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAuBvC,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-fake-link/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,aAAa,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../tslib.es6-C4EgNkz1.js"),y=require("react"),u=require("classnames"),d=s=>{var{variant:t,type:o,className:i,onKeyDown:n,onEscape:a}=s,c=r.__rest(s,["variant","type","className","onKeyDown","onEscape"]);const l=e=>{n==null||n(e),(e.key==="Escape"||e.key==="Esc")&&(a==null||a(e))};return y.createElement("button",Object.assign({},c,{className:u("fake-link",t==="standalone"&&"standalone-link",i),onKeyDown:l,type:o||"button"}))};exports.EbayFakeLink=d;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# EbayFilter
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/story/building-blocks-ebay-filter--default)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
### Import JS
|
|
10
|
+
|
|
11
|
+
```jsx harmony
|
|
12
|
+
import { EbayFilter } from "@ebay/ui-core-react/ebay-filter";
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Import following styles from SKIN
|
|
16
|
+
|
|
17
|
+
```jsx harmony
|
|
18
|
+
import "@ebay/skin/filter";
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
### If tokens haven't been added to the project at a higher level, make sure to import
|
|
22
|
+
|
|
23
|
+
```jsx harmony
|
|
24
|
+
import "@ebay/skin/tokens";
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Or import styles using SCSS/CSS
|
|
28
|
+
|
|
29
|
+
```jsx harmony
|
|
30
|
+
import "@ebay/skin/filter.css";
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
```jsx harmony
|
|
34
|
+
<EbayFilter>Text</EbayFilter>
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
## Attributes
|
|
38
|
+
|
|
39
|
+
| Name | Type | Required | Description | Data |
|
|
40
|
+
| ------------------ | -------- | -------- | --------------------------------------------------------------------------------- | ------------------------------ |
|
|
41
|
+
| `href` | String | No | For link that looks like a button | |
|
|
42
|
+
| `disabled` | Boolean | No | Whether the filter is disabled or not | |
|
|
43
|
+
| `selected` | Boolean | No | Whether the filter is selected or not (use this for controlled component) | |
|
|
44
|
+
| `defaultSelected` | Boolean | No | Whether the filter is first selected or not (use this for uncontrolled component) | |
|
|
45
|
+
| `useAriaPressed` | Boolean | No | defaults to `true` | |
|
|
46
|
+
| `a11ySelectedText` | String | No | defaults to `"Selected"`, but should be changed based on L10N or I18N | |
|
|
47
|
+
| `onClick` | Function | No | Triggered on item clicked | `(event: Event, { selected })` |
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ComponentProps, FC } from 'react';
|
|
2
|
+
import { FilterClickHandler } from './types';
|
|
3
|
+
export type EbayFilterProps = Omit<ComponentProps<'button'> & ComponentProps<'a'>, 'onClick' | 'type'> & {
|
|
4
|
+
selected?: boolean;
|
|
5
|
+
defaultSelected?: boolean;
|
|
6
|
+
a11ySelectedText?: string;
|
|
7
|
+
useAriaPressed?: boolean;
|
|
8
|
+
onClick?: FilterClickHandler;
|
|
9
|
+
};
|
|
10
|
+
declare const EbayFilter: FC<EbayFilterProps>;
|
|
11
|
+
export default EbayFilter;
|
|
12
|
+
//# sourceMappingURL=filter.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../src/ebay-filter/filter.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,cAAc,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAA;AAC9E,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAE5C,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG,cAAc,CAAC,GAAG,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,GAAG;IACrG,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,OAAO,CAAC,EAAE,kBAAkB,CAAA;CAC/B,CAAA;AAED,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAiDnC,CAAA;AAED,eAAe,UAAU,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-filter/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,UAAU,CAAA;AACtE,cAAc,SAAS,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("../tslib.es6-C4EgNkz1.js"),h=require("classnames"),t=require("react"),k=c=>{var{defaultSelected:d,selected:a,href:e,className:i,useAriaPressed:o,a11ySelectedText:u,disabled:n,children:b,onClick:m=()=>{}}=c,S=N.__rest(c,["defaultSelected","selected","href","className","useAriaPressed","a11ySelectedText","disabled","children","onClick"]);const s=e?"filter-link":"filter-button",[f,p]=t.useState(d),l=typeof a<"u"?a:f,y=e?"a":"button",C=E=>{if(!n){const r=!l;p(r),m(E,{selected:r})}};return t.createElement(y,Object.assign({},S,{disabled:n,className:h(s,i,`${s}--${l?"selected":"unselected"}`),type:e?void 0:"button",href:e,"aria-pressed":o!==!1&&!e&&l?"true":void 0,onClick:C}),t.createElement("span",{className:`${s}__cell`},t.createElement("span",null,b),e&&l?t.createElement("span",{className:"clipped"},"- ",u||"Selected"):null))};exports.EbayFilter=k;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-filter/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;AAEjD,MAAM,MAAM,SAAS,GAAG;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAE,qBAAqB,CAAC,iBAAiB,GAAG,iBAAiB,EAAE,SAAS,CAAC,CAAA"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
# EbayFilterMenu
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/building-blocks-ebay-filter-menu--docs)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
### Import JS
|
|
10
|
+
|
|
11
|
+
```jsx harmony
|
|
12
|
+
import { EbayFilterMenu, EbayFilterMenuItem, EbayFilterMenuFooterButton } from "@ebay/ui-core-react/ebay-filter-menu";
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Import following styles from SKIN
|
|
16
|
+
|
|
17
|
+
```jsx harmony
|
|
18
|
+
import "@ebay/skin/filter-menu";
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
### If tokens haven't been added to the project at a higher level, make sure to import
|
|
22
|
+
|
|
23
|
+
```jsx harmony
|
|
24
|
+
import "@ebay/skin/tokens";
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Or import styles using SCSS/CSS
|
|
28
|
+
|
|
29
|
+
```jsx harmony
|
|
30
|
+
import "@ebay/skin/filter-menu.css";
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
```jsx harmony
|
|
34
|
+
<EbayFilterMenu>
|
|
35
|
+
<EbayFilterMenuItem value="item1">Item 1</EbayFilterMenuItem>
|
|
36
|
+
<EbayFilterMenuItem value="item2">Item 2</EbayFilterMenuItem>
|
|
37
|
+
<EbayFilterMenuFooterButton>Submit</EbayFilterMenuFooterButton>
|
|
38
|
+
</EbayFilterMenu>
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
## Attributes
|
|
42
|
+
|
|
43
|
+
| Name | Type | Required | Description | Data |
|
|
44
|
+
| ----------------------------- | -------- | -------- | ---------------------------------------------------------- | ------------------------------------------- |
|
|
45
|
+
| `classPrefix` | String | No | Modifies the base prefix for all Skin classes in the menu | `"filter-menu"` (default) |
|
|
46
|
+
| `formName` | String | No | Name attribute for the form | |
|
|
47
|
+
| `formAction` | String | No | Action attribute for the form | |
|
|
48
|
+
| `formMethod` | String | No | Method attribute for the form | |
|
|
49
|
+
| `variant` | String | No | Variant of the filter menu, `form` or `default` | |
|
|
50
|
+
| `type` | String | No | Type of the filter menu, `checkbox` or `radio` | |
|
|
51
|
+
| `searchHeaderValue` | String | No | Optional value override for the input in the search header | |
|
|
52
|
+
| `searchHeaderPlaceholderText` | String | No | Enables the search header and populates placeholder text | |
|
|
53
|
+
| `a11ySearchHeaderClearText` | String | No | Accessibility text for the search header clear button | |
|
|
54
|
+
| `onFormSubmit` | Function | No | Triggered on form submit | `(event: Event, { checked, checkedIndex })` |
|
|
55
|
+
| `onFooterClick` | Function | No | Triggered on footer button click | `(event: Event, { checked, checkedIndex })` |
|
|
56
|
+
| `onChange` | Function | No | Triggered on item change | `(event: Event, { checked, checkedIndex })` |
|
|
57
|
+
| `onSearchChange` | Function | No | Triggered on search input change | `(event: Event, { searchTerm })` |
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ComponentProps, FC, ReactNode } from 'react';
|
|
2
|
+
import { Variant } from './types';
|
|
3
|
+
export type EbayFilterMenuFooterButtonProps = Omit<ComponentProps<'button'>, 'type' | 'children'> & {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
/**
|
|
6
|
+
* These properties are used by EbayFilterMenu.
|
|
7
|
+
* NOTE: The flag "@deprecated" is only to not show this property in the autocomplete list on the top
|
|
8
|
+
* @deprecated
|
|
9
|
+
*/
|
|
10
|
+
__classPrefix?: string;
|
|
11
|
+
/** @deprecated */
|
|
12
|
+
__variant?: Variant;
|
|
13
|
+
};
|
|
14
|
+
declare const EbayFilterMenuFooterButton: FC<EbayFilterMenuFooterButtonProps>;
|
|
15
|
+
export default EbayFilterMenuFooterButton;
|
|
16
|
+
//# sourceMappingURL=filter-menu-footer-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter-menu-footer-button.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu/filter-menu-footer-button.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAGjC,MAAM,MAAM,+BAA+B,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,UAAU,CAAE,GAAG;IACjG,QAAQ,EAAE,SAAS,CAAA;IACnB;;;;MAIE;IACF,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,kBAAkB;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAED,QAAA,MAAM,0BAA0B,EAAE,EAAE,CAAC,+BAA+B,CAiBnE,CAAA;AAED,eAAe,0BAA0B,CAAA"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { ComponentProps, FC, ReactNode } from 'react';
|
|
2
|
+
import { FilterMenuItemClick, Type, Variant } from './types';
|
|
3
|
+
export type EbayFilterMenuItemProps = Omit<ComponentProps<'label'> & ComponentProps<'div'>, 'children' | 'onClick'> & {
|
|
4
|
+
checked?: boolean;
|
|
5
|
+
value?: string;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
onClick?: FilterMenuItemClick;
|
|
9
|
+
/**
|
|
10
|
+
* These properties are used by EbayFilterMenu.
|
|
11
|
+
* NOTE: The flag "@deprecated" is only to not show this property in the autocomplete list on the top
|
|
12
|
+
* @deprecated
|
|
13
|
+
*/
|
|
14
|
+
__classPrefix?: string;
|
|
15
|
+
/** @deprecated */
|
|
16
|
+
__type?: Type;
|
|
17
|
+
/** @deprecated */
|
|
18
|
+
__variant?: Variant;
|
|
19
|
+
};
|
|
20
|
+
declare const EbayFilterMenuItem: FC<EbayFilterMenuItemProps>;
|
|
21
|
+
export default EbayFilterMenuItem;
|
|
22
|
+
//# sourceMappingURL=filter-menu-item.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter-menu-item.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu/filter-menu-item.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAM5D,OAAO,EAAE,mBAAmB,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAE5D,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC,GAAG;IAClH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;IACnB,OAAO,CAAC,EAAE,mBAAmB,CAAA;IAE7B;;;;MAIE;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,kBAAkB;IAClB,MAAM,CAAC,EAAE,IAAI,CAAA;IACb,kBAAkB;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAoDnD,CAAA;AAED,eAAe,kBAAkB,CAAA"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React, { ComponentProps, RefObject } from 'react';
|
|
2
|
+
import { FilterMenuChange, FilterMenuFooterClick, FilterMenuFormSubmit, FilterMenuSearchChange, Type, Variant } from './types';
|
|
3
|
+
export type EbayFilterMenuProps = Omit<ComponentProps<'span'>, 'onChange'> & {
|
|
4
|
+
classPrefix?: string;
|
|
5
|
+
formName?: string;
|
|
6
|
+
formAction?: string;
|
|
7
|
+
formMethod?: string;
|
|
8
|
+
variant?: Variant;
|
|
9
|
+
type?: Type;
|
|
10
|
+
searchHeaderValue?: string;
|
|
11
|
+
searchHeaderPlaceholderText?: string;
|
|
12
|
+
a11ySearchHeaderClearText?: string;
|
|
13
|
+
forwardedRef?: RefObject<HTMLSpanElement>;
|
|
14
|
+
onSearchChange?: FilterMenuSearchChange;
|
|
15
|
+
onFormSubmit?: FilterMenuFormSubmit;
|
|
16
|
+
onFooterClick?: FilterMenuFooterClick;
|
|
17
|
+
onChange?: FilterMenuChange;
|
|
18
|
+
};
|
|
19
|
+
declare const _default: React.ForwardRefExoticComponent<Omit<EbayFilterMenuProps, "ref"> & React.RefAttributes<React.FC<EbayFilterMenuProps>>>;
|
|
20
|
+
export default _default;
|
|
21
|
+
//# sourceMappingURL=filter-menu.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter-menu.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu/filter-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACV,cAAc,EAKd,SAAS,EAIZ,MAAM,OAAO,CAAA;AAMd,OAAO,EACH,gBAAgB,EAEhB,qBAAqB,EACrB,oBAAoB,EACpB,sBAAsB,EACtB,IAAI,EACJ,OAAO,EACV,MAAM,SAAS,CAAA;AAKhB,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IACzE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,YAAY,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,sBAAsB,CAAA;IACvC,YAAY,CAAC,EAAE,oBAAoB,CAAA;IACnC,aAAa,CAAC,EAAE,qBAAqB,CAAA;IACrC,QAAQ,CAAC,EAAE,gBAAgB,CAAA;CAC9B,CAAA;;AAqND,wBAA6C"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export { default as EbayFilterMenu, type EbayFilterMenuProps } from './filter-menu';
|
|
2
|
+
export { default as EbayFilterMenuItem, type EbayFilterMenuItemProps } from './filter-menu-item';
|
|
3
|
+
export { default as EbayFilterMenuFooterButton, type EbayFilterMenuFooterButtonProps } from './filter-menu-footer-button';
|
|
4
|
+
export * from './types';
|
|
5
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,eAAe,CAAA;AACnF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,oBAAoB,CAAA;AAChG,OAAO,EACH,OAAO,IAAI,0BAA0B,EACrC,KAAK,+BAA+B,EACvC,MAAM,6BAA6B,CAAA;AAEpC,cAAc,SAAS,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../filter-menu-CF5Lvzqu.js");exports.EbayFilterMenu=e.EbayFilterMenu;exports.EbayFilterMenuFooterButton=e.EbayFilterMenuFooterButton;exports.EbayFilterMenuItem=e.EbayFilterMenuItem;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { EbayChangeEventHandler, EbayEventHandler, EbayMouseEventHandler } from '../events';
|
|
2
|
+
export type Variant = 'form';
|
|
3
|
+
export type Type = 'radio' | 'checkbox';
|
|
4
|
+
export type FilterMenuItemEventData = {
|
|
5
|
+
value?: string;
|
|
6
|
+
checked?: boolean;
|
|
7
|
+
};
|
|
8
|
+
export type FilterMenuItemClick = EbayMouseEventHandler<HTMLLabelElement | HTMLDivElement, FilterMenuItemEventData>;
|
|
9
|
+
export type FilterMenuSearchEventData = {
|
|
10
|
+
searchTerm?: string;
|
|
11
|
+
};
|
|
12
|
+
export type FilterMenuSearchChange = EbayChangeEventHandler<HTMLInputElement, FilterMenuSearchEventData>;
|
|
13
|
+
export type FilterMenuEventData = {
|
|
14
|
+
checked?: string[];
|
|
15
|
+
checkedIndex?: number[];
|
|
16
|
+
currentChecked?: boolean;
|
|
17
|
+
index?: number;
|
|
18
|
+
};
|
|
19
|
+
export type FilterMenuChange = EbayEventHandler<HTMLLabelElement | HTMLDivElement, FilterMenuEventData>;
|
|
20
|
+
export type FilterMenuFormSubmit = EbayEventHandler<HTMLFormElement, FilterMenuEventData>;
|
|
21
|
+
export type FilterMenuFooterClick = EbayMouseEventHandler<HTMLFormElement, FilterMenuEventData>;
|
|
22
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;AAE3F,MAAM,MAAM,OAAO,GAAG,MAAM,CAAA;AAC5B,MAAM,MAAM,IAAI,GAAG,OAAO,GAAG,UAAU,CAAA;AAEvC,MAAM,MAAM,uBAAuB,GAAG;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,qBAAqB,CAAC,gBAAgB,GAAG,cAAc,EAAE,uBAAuB,CAAC,CAAA;AAEnH,MAAM,MAAM,yBAAyB,GAAG;IACpC,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG,sBAAsB,CAAC,gBAAgB,EAAE,yBAAyB,CAAC,CAAA;AAGxG,MAAM,MAAM,mBAAmB,GAAG;IAC9B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,CAAC,gBAAgB,GAAG,cAAc,EAAE,mBAAmB,CAAC,CAAA;AACvG,MAAM,MAAM,oBAAoB,GAAG,gBAAgB,CAAC,eAAe,EAAE,mBAAmB,CAAC,CAAA;AACzF,MAAM,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,eAAe,EAAE,mBAAmB,CAAC,CAAA"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
# EbayFilterMenuButton
|
|
2
|
+
|
|
3
|
+
## Demo
|
|
4
|
+
|
|
5
|
+
[Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/buttons-ebay-filter-menu-button--docs)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
### Import JS
|
|
10
|
+
|
|
11
|
+
```jsx harmony
|
|
12
|
+
import { EbayFilterMenuButton, EbayFilterMenuItem } from "@ebay/ui-core-react/ebay-filter-menu-button";
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Import following styles from SKIN
|
|
16
|
+
|
|
17
|
+
```jsx harmony
|
|
18
|
+
import "@ebay/skin/filter-menu-button";
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
### If tokens haven't been added to the project at a higher level, make sure to import
|
|
22
|
+
|
|
23
|
+
```jsx harmony
|
|
24
|
+
import "@ebay/skin/tokens";
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Or import styles using SCSS/CSS
|
|
28
|
+
|
|
29
|
+
```jsx harmony
|
|
30
|
+
import "@ebay/skin/filter-menu-button.css";
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
```jsx harmony
|
|
34
|
+
<EbayFilterMenuButton>
|
|
35
|
+
<EbayFilterMenuItem value="item1">Item 1</EbayFilterMenuItem>
|
|
36
|
+
<EbayFilterMenuItem value="item2">Item 2</EbayFilterMenuItem>
|
|
37
|
+
</EbayFilterMenuButton>
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
## Attributes
|
|
41
|
+
|
|
42
|
+
The `EbayFilterMenuButton` supports all properties from the [EbayFilterMenu](../ebay-filter-menu/README.md) component. Additionally, it includes the following specific attributes:
|
|
43
|
+
|
|
44
|
+
| Name | Type | Required | Description |
|
|
45
|
+
| ------------ | -------- | -------- | ------------------------------------------ |
|
|
46
|
+
| `onExpand` | Function | No | Triggered when the menu is expanded |
|
|
47
|
+
| `onCollapse` | Function | No | Triggered when the menu is collapsed |
|
|
48
|
+
| `text` | String | No | The text displayed on the button |
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { EbayFilterMenuProps } from '../ebay-filter-menu';
|
|
3
|
+
export type EbayFilterMenuButtonProps = EbayFilterMenuProps & {
|
|
4
|
+
className?: string;
|
|
5
|
+
text: string;
|
|
6
|
+
onExpand?: () => void;
|
|
7
|
+
onCollapse?: () => void;
|
|
8
|
+
};
|
|
9
|
+
declare const EbayFilterMenuButton: React.FC<EbayFilterMenuButtonProps>;
|
|
10
|
+
export default EbayFilterMenuButton;
|
|
11
|
+
//# sourceMappingURL=filter-menu-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter-menu-button.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu-button/filter-menu-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAI/C,OAAO,EAGH,mBAAmB,EAItB,MAAM,qBAAqB,CAAA;AAG5B,MAAM,MAAM,yBAAyB,GAAG,mBAAmB,GAAG;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CAC1B,CAAA;AAED,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAuF7D,CAAA;AAED,eAAe,oBAAoB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ebay-filter-menu-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AACtG,OAAO,EAAE,kBAAkB,EAAE,0BAA0B,EAAE,KAAK,uBAAuB,EAAE,MAAM,qBAAqB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("../tslib.es6-C4EgNkz1.js"),n=require("react"),q=require("classnames"),b=require("../dropdown-BLiIyhWy.js"),w=require("../icon-CeLPlCml.js"),a=require("../filter-menu-CF5Lvzqu.js"),N=require("../utils-C9NL3q0j.js"),B=u=>{var{className:d,text:p,"aria-label":y,onExpand:f,onCollapse:E,onChange:l,children:i}=u,o=S.__rest(u,["className","text","aria-label","onExpand","onCollapse","onChange","children"]);const c=n.useRef(null),h=N.filterByType(i,a.EbayFilterMenuItem),[v,F]=n.useState(()=>h.some(t=>t.props.checked)),{isExpanded:_,collapse:r}=b.useExpander({ref:c,options:{hostSelector:".filter-menu-button__button",contentSelector:".filter-menu-button__menu",focusManagement:"interactive",expandOnClick:!0,autoCollapse:!0,alwaysDoFocusManagement:!0},onExpand:f,onCollapse:E}),{overlayStyles:M,refs:m}=b.useFloatingDropdown({open:_}),C=t=>{var e;(e=o.onKeyDown)===null||e===void 0||e.call(o,t),t.key==="Escape"&&r()},g=(...t)=>{var e;(e=o.onFormSubmit)===null||e===void 0||e.call(o,...t),r()},x=(...t)=>{var e;(e=o.onFooterClick)===null||e===void 0||e.call(o,...t),r()},k=(t,e)=>{var s;l==null||l(t,e),F(((s=e.checked)===null||s===void 0?void 0:s.length)>0)};return n.createElement("span",{ref:c,className:q("filter-menu-button",d)},n.createElement("button",{type:"button",className:"filter-menu-button__button",ref:m.setHost,"aria-expanded":"false","aria-haspopup":"true","aria-label":y,"aria-pressed":v},n.createElement("span",{className:"filter-menu-button__button-cell"},n.createElement("span",{className:"filter-menu-button__button-text"},p),n.createElement(w.EbayIcon,{name:"chevronDown12"}))),n.createElement(a.EbayFilterMenu,Object.assign({},o,{onChange:k,classPrefix:"filter-menu-button",onKeyDown:C,onFooterClick:x,onFormSubmit:g,ref:m.setOverlay,style:M}),i))};exports.EbayFilterMenuFooterButton=a.EbayFilterMenuFooterButton;exports.EbayFilterMenuItem=a.EbayFilterMenuItem;exports.EbayFilterMenuButton=B;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../tslib.es6-C4EgNkz1.js"),e=require("react"),h=require("../notice-content-9iF4T8uB.js"),y=require("../notice-content-C0ZStfuX.js"),r=require("../icon-CeLPlCml.js");require("classnames");const b=require("../notice-footer-G6VPjVZu.js"),C=require("../notice-cta-CKl_qBge.js"),P=t=>{var{id:a,status:n="general",children:i,a11yDismissText:s,"aria-label":m,onDismiss:E=()=>{}}=t,d=l.__rest(t,["id","status","children","a11yDismissText","aria-label","onDismiss"]);const[u,N]=e.useState(!1),c=e.Children.toArray(i).find(o=>o.type===y.EbayNoticeContent);if(!c)throw new Error("EbayPageNotice: Please use a EbayNoticeContent that defines the content of the notice");const p=o=>{N(!0),E(o)};return u?null:e.createElement("section",Object.assign({},d,{"aria-labelledby":a||`${n}-status`,className:`page-notice ${n!=="general"?`page-notice--${n}`:""}`,role:"region"}),n!=="general"?e.createElement("div",{className:"page-notice__header",id:a||`${n}-status`},e.createElement(r.EbayIcon,{name:`${n}Filled16`,a11yText:m,a11yVariant:"label"})):null,e.createElement(h.NoticeContent,Object.assign({},c.props,{type:"page"})),i,s&&e.createElement(g,null,e.createElement("button",{"aria-label":s,className:"fake-link page-notice__dismiss",onClick:p},e.createElement(r.EbayIcon,{name:"close16"}))))},T=t=>{var{className:a,as:n,children:i}=t,s=l.__rest(t,["className","as","children"]);return e.createElement(b.NoticeTitle,Object.assign({},s,{className:a,as:n,type:"page"}),i)},g=({className:t,children:a})=>e.createElement(b.NoticeFooter,{className:t,type:"page"},a),q=({className:t,children:a})=>e.createElement(C.NoticeCTA,{className:t,type:"page"},a);exports.EbayNoticeContent=y.EbayNoticeContent;exports.EbayPageNotice=P;exports.EbayPageNoticeCTA=q;exports.EbayPageNoticeFooter=g;exports.EbayPageNoticeTitle=T;
|
package/ebay-radio/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../radio-wp0-bMIM.js");exports.EbayRadio=e.EbayRadio;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("../tslib.es6-C4EgNkz1.js"),e=require("react"),$=require("classnames"),E=require("../notice-content-C0ZStfuX.js"),A=require("../notice-content-9iF4T8uB.js"),b=require("../icon-CeLPlCml.js"),F=require("../forwardRef-irqyO_PF.js"),N=require("../notice-footer-G6VPjVZu.js"),j=require("../notice-cta-CKl_qBge.js"),v=n=>{var{status:t="general",children:i,className:s,"aria-label":o,"aria-roledescription":C="Notice",a11yDismissText:d,educationIcon:p,iconClass:S,prominent:f,onDismiss:g=()=>{}}=n,T=y.__rest(n,["status","children","className","aria-label","aria-roledescription","a11yDismissText","educationIcon","iconClass","prominent","onDismiss"]);const[q,D]=e.useState(!1),[m,I]=e.useState("");e.useEffect(()=>{I(F.randomId())},[]);const u=e.Children.toArray(i).find(({type:l})=>l===E.EbayNoticeContent),c=t!=="general"&&t!=="none",r=t==="education";let a=null;if(c&&(r?a=p||"lightbulb24":a=`${t}Filled16`),!u)throw new Error("EbaySectionNotice: Please use a EbayNoticeContent that defines the content of the notice");const _=l=>{D(!0),g(l)};return q?null:e.createElement("section",Object.assign({},T,{className:$(s,"section-notice",{[`section-notice--${t}`]:c,"section-notice--education":r&&f,"section-notice--large-icon":r}),role:"region","aria-label":c?null:o,"aria-labelledby":c?`section-notice-${t}-${m}`:null,"aria-roledescription":C}),a&&e.createElement("div",{className:"section-notice__header",id:`section-notice-${t}-${m}`},e.createElement(b.EbayIcon,{className:S,name:a,a11yText:o,a11yVariant:"label"})),e.createElement(A.NoticeContent,Object.assign({},u.props,{type:"section"})),i,d&&e.createElement(h,null,e.createElement("button",{"aria-label":d,className:"fake-link page-notice__dismiss",onClick:_},e.createElement(b.EbayIcon,{name:"close16"}))))},O=n=>{var{className:t,as:i,children:s}=n,o=y.__rest(n,["className","as","children"]);return e.createElement(N.NoticeTitle,Object.assign({},o,{className:t,as:i,type:"section"}),s)},h=({className:n,children:t})=>e.createElement(N.NoticeFooter,{className:n,type:"section"},t),R=({className:n,children:t})=>e.createElement(j.NoticeCTA,{className:n,type:"section"},t);exports.EbayNoticeContent=E.EbayNoticeContent;exports.EbaySectionNotice=v;exports.EbaySectionNoticeCTA=R;exports.EbaySectionNoticeFooter=h;exports.EbaySectionNoticeTitle=O;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const j=require("./tslib.es6-C4EgNkz1.js"),t=require("react"),ae=require("makeup-prevent-scroll-keys"),re=require("makeup-roving-tabindex"),B=require("./forwardRef-irqyO_PF.js"),U=require("./utils-C9NL3q0j.js"),D=require("classnames"),ne=require("./checkbox-Bb3s3Jof.js"),ce=require("./radio-wp0-bMIM.js"),M=require("./icon-CeLPlCml.js");require("./array.polyfill.flat-5BAolFdk.js");const oe=require("./button-DpMwH1cr.js");function se(r){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const s in r)if(s!=="default"){const m=Object.getOwnPropertyDescriptor(r,s);Object.defineProperty(c,s,m.get?m:{enumerable:!0,get:()=>r[s]})}}return c.default=r,Object.freeze(c)}const le=se(ae),A=r=>{var{__classPrefix:c,__variant:s,className:m,onClick:C}=r,E=j.__rest(r,["__classPrefix","__variant","className","onClick"]);const l=s==="form";return t.createElement("button",Object.assign({},E,{type:l?"submit":"button",className:D(m,`${c}__footer`),onClick:l?void 0:C}))},V=r=>{var{checked:c,value:s,disabled:m,children:C,className:E,onClick:l,__type:S,__variant:P,__classPrefix:v}=r,q=j.__rest(r,["checked","value","disabled","children","className","onClick","__type","__variant","__classPrefix"]);const R=P==="form",u=S==="radio",h=u?"radio":"checkbox",I=B.useRandomId(),y=`'${h}-${I}`,f=R?"label":"div",w=u?ce.EbayRadio:ne.EbayCheckbox,O=u?`${v}__radio`:`${v}__checkbox`,$=u?"radioChecked18":"checkboxChecked18",F=u?"radioUnchecked18":"checkboxUnchecked18",b=_=>{l==null||l(_,{value:s,checked:!c})};return t.createElement(f,Object.assign({},q,{className:D(E,`${v}__item`),htmlFor:R?y:void 0,role:u?"menuitemradio":"menuitemcheckbox",onClick:b,"aria-checked":c,"aria-disabled":m}),R?t.createElement(w,{id:y,checked:c}):t.createElement("span",{className:O},t.createElement(M.EbayIcon,{name:c?$:F})),t.createElement("span",{className:`${v}__text`},C))},ie=r=>{var{classPrefix:c,className:s,formMethod:m,formAction:C,formName:E,variant:l,children:S,type:P,searchHeaderValue:v,searchHeaderPlaceholderText:q,a11ySearchHeaderClearText:R,forwardedRef:u,onSearchChange:h,onFormSubmit:I,onFooterClick:y,onChange:f,"aria-label":w,"aria-labelledby":O}=r,$=j.__rest(r,["classPrefix","className","formMethod","formAction","formName","variant","children","type","searchHeaderValue","searchHeaderPlaceholderText","a11ySearchHeaderClearText","forwardedRef","onSearchChange","onFormSubmit","onFooterClick","onChange","aria-label","aria-labelledby"]);const F=t.useRef(null),b=l==="form",_=P==="radio",x=c||"filter-menu",H=U.findComponent(S,A),p=U.filterByType(S,V),z=B.useRandomId(),[G,K]=t.useState(v||""),[g,J]=t.useState(()=>p.map((e,a)=>e.props.checked&&a).find(e=>typeof e=="number")),[N,Q]=t.useState(()=>p.map(e=>!!e.props.checked));t.useEffect(()=>{let e;return b||(e=re.createLinear(F.current,"div",{autoInit:"interactive"}),le.add(F.current)),()=>{e&&(e.destroy(),e=null)}},[b]);const L=()=>({checked:p.filter((e,a)=>_?g===a:N[a]).map(e=>e.props.value),checkedIndex:p.map((e,a)=>_?a===g&&a:N[a]&&a).filter(e=>typeof e=="number")}),W=e=>{y==null||y(e,L())},X=e=>{I==null||I(e,L())},Y=e=>{K(""),h==null||h(e,{searchTerm:""})},Z=e=>{K(e.target.value),h==null||h(e,{searchTerm:e.target.value})},ee=b?"form":t.Fragment,te=b?{name:E,action:C,method:m,onSubmit:X}:{},T=(e,{checked:a,index:n})=>{const k=e.target;if(!(b&&k.type==="checkbox"))if(_)J(n),f==null||f(e,{index:n,checked:[p[n].props.value],checkedIndex:[n],currentChecked:a});else{const i=N.map((o,d)=>d===n?a:o);f==null||f(e,{index:n,checked:p.filter((o,d)=>i[d]).map(o=>o.props.value),checkedIndex:i.map((o,d)=>o&&d).filter(o=>typeof o=="number"),currentChecked:a}),Q(i)}};return t.createElement("span",Object.assign({},$,{ref:u,className:D(s,`${c?`${x}__menu`:x}`)}),q?t.createElement("div",{className:"filter-menu__header"},t.createElement(M.EbayIcon,{name:"search16"}),t.createElement("input",{type:"text",value:G,className:"filter-menu__search",placeholder:q,"aria-owns":"TODO with menuitems ID",onChange:Z}),t.createElement(oe.EbayButton,{type:"button",onClick:Y},t.createElement(M.EbayIcon,{name:"clear20"}))):null,t.createElement(ee,Object.assign({},te),t.createElement("div",{id:z,ref:F,className:`${x}__items`,role:b?void 0:"menu","aria-label":w,"aria-labelledby":O},p.map((e,a)=>t.cloneElement(e,{__classPrefix:x,__type:P,__variant:l,checked:_?a===g:N[a],onClick:(n,{checked:k,value:i})=>{var o,d;(d=(o=e.props).onClick)===null||d===void 0||d.call(o,n,{checked:k,value:i}),T(n,{checked:k,index:a})},onKeyDown:n=>{var k,i;if((i=(k=e.props).onKeyDown)===null||i===void 0||i.call(k,n),n.key==="Enter"||n.key===" "){const o=_?a===g:N[a];T(n,{checked:!o,index:a})}}}))),H&&t.cloneElement(H,{onClick:W,__classPrefix:x,__variant:l})))},de=B.withForwardRef(ie);exports.EbayFilterMenu=de;exports.EbayFilterMenuFooterButton=A;exports.EbayFilterMenuItem=V;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const a=require("./tslib.es6-C4EgNkz1.js"),i=require("react"),n=require("classnames"),l=e=>{var{className:s,type:t,children:c}=e,r=a.__rest(e,["className","type","children"]);return i.createElement("p",Object.assign({className:n(s,`${t}-notice__cta`)},r),c)};exports.NoticeCTA=l;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const a=require("./tslib.es6-C4EgNkz1.js"),i=require("react"),n=require("classnames"),N=e=>{var{className:t,type:s,as:c,children:r}=e,o=a.__rest(e,["className","type","as","children"]);const l=c||"h2";return i.createElement(l,Object.assign({className:n(t,`${s}-notice__title`)},o),r)},m=e=>{var{className:t,type:s,children:c}=e,r=a.__rest(e,["className","type","children"]);return i.createElement("div",Object.assign({className:n(t,`${s}-notice__footer`)},r),c)};exports.NoticeFooter=m;exports.NoticeTitle=N;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ebay/ui-core-react",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.2.0",
|
|
4
4
|
"description": "Skin components build off React",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org",
|
|
@@ -67,6 +67,8 @@
|
|
|
67
67
|
"makeup-expander": "^0.10.1",
|
|
68
68
|
"makeup-floating-label": "^0.4.5",
|
|
69
69
|
"makeup-keyboard-trap": "^0.4.1",
|
|
70
|
+
"makeup-prevent-scroll-keys": "^0.3.3",
|
|
71
|
+
"makeup-roving-tabindex": "^0.7.3",
|
|
70
72
|
"makeup-screenreader-trap": "^0.4.1",
|
|
71
73
|
"makeup-typeahead": "^0.3.3",
|
|
72
74
|
"react-remove-scroll": "^2.2.0"
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const p=require("./tslib.es6-C4EgNkz1.js"),a=require("react"),F=require("classnames"),c=require("./icon-CeLPlCml.js"),j=require("./label-BRztS0pw.js"),q=r=>{var{size:t="default",checked:i,defaultChecked:d,className:u,style:h,id:s,onChange:m=()=>{},onFocus:y=()=>{},onKeyDown:g=()=>{},children:l}=r,b=p.__rest(r,["size","checked","defaultChecked","className","style","id","onChange","onFocus","onKeyDown","children"]);const _=n=>{var e;return m(n,{value:(e=n.target)===null||e===void 0?void 0:e.value})},v=n=>{var e;return y(n,{value:(e=n.target)===null||e===void 0?void 0:e.value})},E=n=>{const e=n.target;return g(n,{value:e==null?void 0:e.value})},k=F("radio",u,{"radio--large":t==="large"}),C=t==="large"?a.createElement(c.EbayIcon,{name:"radioChecked24",className:"radio__checked"}):a.createElement(c.EbayIcon,{name:"radioChecked18",className:"radio__checked"}),N=t==="large"?a.createElement(c.EbayIcon,{name:"radioUnchecked24",className:"radio__unchecked"}):a.createElement(c.EbayIcon,{name:"radioUnchecked18",className:"radio__unchecked"}),o=a.Children.toArray(l).find(n=>n.type===j.Label);return a.createElement(a.Fragment,null,a.createElement("span",{className:k,style:Object.assign(Object.assign({},h),{alignItems:"center"})},a.createElement("input",Object.assign({},b,{id:s,className:"radio__control",type:"radio",defaultChecked:d,checked:i,onChange:_,onFocus:v,onKeyDown:E})),a.createElement("span",{className:"radio__icon",hidden:!0},C,N)),o?a.cloneElement(o,Object.assign(Object.assign({},o.props),{position:"end",htmlFor:s})):l)};exports.EbayRadio=q;
|
package/notice-cta-hm2vI5MI.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";const a=require("./tslib.es6-C4EgNkz1.js"),i=require("react"),n=require("classnames"),N=e=>{var{className:t,type:s,as:c,children:r}=e,l=a.__rest(e,["className","type","as","children"]);const o=c||"h2";return i.createElement(o,Object.assign({className:n(t,`${s}-notice__title`)},l),r)},m=e=>{var{className:t,type:s,children:c}=e,r=a.__rest(e,["className","type","children"]);return i.createElement("div",Object.assign({className:n(t,`${s}-notice__footer`)},r),c)},_=e=>{var{className:t,type:s,children:c}=e,r=a.__rest(e,["className","type","children"]);return i.createElement("p",Object.assign({className:n(t,`${s}-notice__cta`)},r),c)};exports.NoticeCTA=_;exports.NoticeFooter=m;exports.NoticeTitle=N;
|