@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.
Files changed (80) hide show
  1. package/README.md +15 -14
  2. package/chip-CaMakGa6.js +1 -0
  3. package/combobox-BcAuEyib.js +1 -0
  4. package/common/dropdown.d.ts +1 -1
  5. package/common/dropdown.d.ts.map +1 -1
  6. package/common/notice-utils/notice-footer.d.ts +1 -1
  7. package/common/notice-utils/notice-footer.d.ts.map +1 -1
  8. package/common/notice-utils/notice-title.d.ts +1 -1
  9. package/common/notice-utils/notice-title.d.ts.map +1 -1
  10. package/ebay-chip/README.md +49 -0
  11. package/ebay-chip/chip.d.ts +11 -0
  12. package/ebay-chip/chip.d.ts.map +1 -0
  13. package/ebay-chip/index.d.ts +2 -0
  14. package/ebay-chip/index.d.ts.map +1 -0
  15. package/ebay-chip/index.js +1 -0
  16. package/ebay-chips-combobox/README.md +52 -0
  17. package/ebay-chips-combobox/chips-combobox.d.ts +14 -0
  18. package/ebay-chips-combobox/chips-combobox.d.ts.map +1 -0
  19. package/ebay-chips-combobox/index.d.ts +4 -0
  20. package/ebay-chips-combobox/index.d.ts.map +1 -0
  21. package/ebay-chips-combobox/index.js +1 -0
  22. package/ebay-chips-combobox/types.d.ts +6 -0
  23. package/ebay-chips-combobox/types.d.ts.map +1 -0
  24. package/ebay-combobox/README.md +1 -1
  25. package/ebay-combobox/combobox.d.ts +2 -1
  26. package/ebay-combobox/combobox.d.ts.map +1 -1
  27. package/ebay-combobox/index.js +1 -1
  28. package/ebay-education-notice/README.md +61 -0
  29. package/ebay-education-notice/education-notice-footer.d.ts +8 -0
  30. package/ebay-education-notice/education-notice-footer.d.ts.map +1 -0
  31. package/ebay-education-notice/education-notice-title.d.ts +8 -0
  32. package/ebay-education-notice/education-notice-title.d.ts.map +1 -0
  33. package/ebay-education-notice/education-notice.d.ts +17 -0
  34. package/ebay-education-notice/education-notice.d.ts.map +1 -0
  35. package/ebay-education-notice/index.d.ts +5 -0
  36. package/ebay-education-notice/index.d.ts.map +1 -0
  37. package/ebay-education-notice/index.js +1 -0
  38. package/ebay-education-notice/types.d.ts +3 -0
  39. package/ebay-education-notice/types.d.ts.map +1 -0
  40. package/ebay-fake-link/README.md +44 -0
  41. package/ebay-fake-link/fake-link.d.ts +9 -0
  42. package/ebay-fake-link/fake-link.d.ts.map +1 -0
  43. package/ebay-fake-link/index.d.ts +2 -0
  44. package/ebay-fake-link/index.d.ts.map +1 -0
  45. package/ebay-fake-link/index.js +1 -0
  46. package/ebay-filter/README.md +47 -0
  47. package/ebay-filter/filter.d.ts +12 -0
  48. package/ebay-filter/filter.d.ts.map +1 -0
  49. package/ebay-filter/index.d.ts +3 -0
  50. package/ebay-filter/index.d.ts.map +1 -0
  51. package/ebay-filter/index.js +1 -0
  52. package/ebay-filter/types.d.ts +6 -0
  53. package/ebay-filter/types.d.ts.map +1 -0
  54. package/ebay-filter-menu/README.md +57 -0
  55. package/ebay-filter-menu/filter-menu-footer-button.d.ts +16 -0
  56. package/ebay-filter-menu/filter-menu-footer-button.d.ts.map +1 -0
  57. package/ebay-filter-menu/filter-menu-item.d.ts +22 -0
  58. package/ebay-filter-menu/filter-menu-item.d.ts.map +1 -0
  59. package/ebay-filter-menu/filter-menu.d.ts +21 -0
  60. package/ebay-filter-menu/filter-menu.d.ts.map +1 -0
  61. package/ebay-filter-menu/index.d.ts +5 -0
  62. package/ebay-filter-menu/index.d.ts.map +1 -0
  63. package/ebay-filter-menu/index.js +1 -0
  64. package/ebay-filter-menu/types.d.ts +22 -0
  65. package/ebay-filter-menu/types.d.ts.map +1 -0
  66. package/ebay-filter-menu-button/README.md +48 -0
  67. package/ebay-filter-menu-button/filter-menu-button.d.ts +11 -0
  68. package/ebay-filter-menu-button/filter-menu-button.d.ts.map +1 -0
  69. package/ebay-filter-menu-button/index.d.ts +3 -0
  70. package/ebay-filter-menu-button/index.d.ts.map +1 -0
  71. package/ebay-filter-menu-button/index.js +1 -0
  72. package/ebay-page-notice/index.js +1 -1
  73. package/ebay-radio/index.js +1 -1
  74. package/ebay-section-notice/index.js +1 -1
  75. package/filter-menu-CF5Lvzqu.js +1 -0
  76. package/notice-cta-CKl_qBge.js +1 -0
  77. package/notice-footer-G6VPjVZu.js +1 -0
  78. package/package.json +3 -1
  79. package/radio-wp0-bMIM.js +1 -0
  80. 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
- * [ ] `ebay-avatar`
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
- * [ ] `ebay-chip`
29
- * [ ] `ebay-chips-combobox`
30
- * [ ] `ebay-combobox`
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
- * [ ] `ebay-details`
34
+ * [x] [ebay-details](src/ebay-details)
35
35
  * [ ] `ebay-donut-chart`
36
- * [ ] `ebay-education-notice`
36
+ * [x] [ebay-education-notice](src/ebay-education-notice)
37
37
  * [x] [ebay-eek](src/ebay-eek)
38
- * [ ] `ebay-fake-link`
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
- * [ ] `ebay-filter`
44
- * [ ] `ebay-filter-menu`
45
- * [ ] `ebay-filter-menu-button`
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
- * [ ] `ebay-listbox`
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
- * [ ] `ebay-skeleton`
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
- * [ ] `ebay-tri-state-checkbox`
87
+ * [x] [ebay-tristatecheckbox](src/ebay-tri-state-checkbox)
87
88
  * [x] [ebay-video](src/ebay-video)
88
89
 
89
90
  ## Getting Started
@@ -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;
@@ -24,7 +24,7 @@ export type ExpanderHookArgs<T extends HTMLElement> = {
24
24
  options: {
25
25
  contentSelector: string;
26
26
  hostSelector: string;
27
- expandedClass: string;
27
+ expandedClass?: string;
28
28
  autoCollapse?: boolean;
29
29
  expandOnFocus?: boolean;
30
30
  expandOnClick?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../src/common/dropdown.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../src/common/dropdown.ts"],"names":[],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  import React, { FC } from 'react';
2
2
  type Props = React.HTMLProps<HTMLDivElement> & {
3
- type: 'window' | 'section' | 'page';
3
+ type: 'window' | 'section' | 'page' | 'education';
4
4
  className?: string;
5
5
  };
6
6
  declare const NoticeFooter: FC<Props>;
@@ -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,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,KAAK,CAI3B,CAAA;AAED,eAAe,YAAY,CAAA"}
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,6 +1,6 @@
1
1
  import React, { FC } from 'react';
2
2
  type Props = React.HTMLProps<HTMLHeadingElement> & {
3
- type: 'window' | 'section' | 'page';
3
+ type: 'window' | 'section' | 'page' | 'education';
4
4
  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
5
5
  className?: string;
6
6
  };
@@ -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;IACpC,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"}
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,2 @@
1
+ export { default as EbayChip, type EbayChipProps } from './chip';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -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,4 @@
1
+ export { default as EbayChipsCombobox, type EbayChipsComboboxProps } from './chips-combobox';
2
+ export { EbayComboboxOption } from '../ebay-combobox';
3
+ export * from './types';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -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,6 @@
1
+ import { EbayEventHandler } from '../events';
2
+ export type ChipsComboboxEvent = {
3
+ selected: string[];
4
+ };
5
+ export type ChipsComboboxChangeHandler = EbayEventHandler<HTMLElement, ChipsComboboxEvent>;
6
+ //# sourceMappingURL=types.d.ts.map
@@ -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"}
@@ -2,7 +2,7 @@
2
2
 
3
3
  ## Demo
4
4
 
5
- [Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/form-input-ebay-combobox--docs
5
+ [Storybook](https://opensource.ebay.com/ebayui-core-react/main/?path=/docs/form-input-ebay-combobox--docs)
6
6
 
7
7
  ## Usage
8
8
 
@@ -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,CAoRvC,CAAA;AAED,eAAe,YAAY,CAAA"}
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"}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});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"),T=a=>{var{className:b}=a,d=V.__rest(a,["className"]);return t.createElement("button",Object.assign({className:x("icon-btn","icon-btn--transparent",b)},d))},j=a=>{var{text:b,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}),b)},pe=a=>{var{className:b,floatingLabel:d,fluid:C,expanded:r,borderless:K,autocomplete:v="none",listSelection:k="automatic",forwardedRef:fe,defaultValue:A="",value:g,placeholder:H,opaqueLabel:P,children:D,onFocus:U=()=>{},onClick:Y=()=>{},onExpand:z=()=>{},onCollapse:G=()=>{},onInputChange:O=()=>{},onFloatingLabelInit:J=()=>{},onChange:Q=()=>{},onSelect:W=()=>{},onKeyDown:X=()=>{}}=a,h=V.__rest(a,["className","floatingLabel","fluid","expanded","borderless","autocomplete","listSelection","forwardedRef","defaultValue","value","placeholder","opaqueLabel","children","onFocus","onClick","onExpand","onCollapse","onInputChange","onFloatingLabelInit","onChange","onSelect","onKeyDown"]);const l=M.findComponent(D,T),y=M.filterByType(D,j),E=t.useRef(null),s=t.useRef(null),S=t.useRef(null),f=I.useExpander({ref:E,expanded:r,options:{autoCollapse:r,expandOnFocus:!0,collapseOnFocusOut:!r&&!!l,contentSelector:'[role="listbox"]',hostSelector:'[role="combobox"]',expandedClass:"combobox--expanded",simulateSpacebarClick:!0},onExpand:z,onCollapse:G},[r]),{overlayStyles:Z,refs:L}=I.useFloatingDropdown({open:f.isExpanded}),[$,N]=t.useState(A||""),c=typeof g<"u"?g:$;typeof g>"u"&&!O&&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&&(N(o),s.current&&(s.current.selectionStart=s.current.selectionEnd=o.length,s.current.focus()),W(e,p({currentInputValue:o})))};function ee(){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(()=>ee(),[v,c,y]),oe=t.useCallback((e,{toIndex:o})=>{if(k==="automatic"){const n=u[o];n&&s.current&&(s.current.value=n.props.text)}},[k,u]),ne=I.useActiveDescendant({ref:E,focusElementRef:s,itemContainerRef:S,disabled:!u.length,onChange:oe,options:{activeDescendantClassName:"combobox__option--active",autoInit:-1,autoReset:-1,autoScroll:!0,axis:"y"}}),R=C?"div":"span",F=be.useFloatingLabel({text:d,disabled:h.disabled,containerTagName:R,opaqueLabel:P,onMount:J}),te=d?F.Container:R,m=t.useRef(!1),le=e=>{var o,n;m.current=!0,(n=l==null?void 0:(o=l.props).onClick)===null||n===void 0||n.call(o,e)},ae=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 se(e){const o=u.find(n=>n.props.text===e);return o?{text:o.props.text,value:o.props.value}:{}}function p(e){return{currentInputValue:e.currentInputValue,selectedOption:se(e.currentInputValue)}}const re=e=>{const o=e.target.value;N(e.target.value),O(e,p({currentInputValue:o}))},B=t.useRef(""),ce=e=>{m.current||w(),m.current=!1;const o=e.target.value;o!==B.current&&(B.current=o,Q(e,p({currentInputValue:o})))},ue=e=>{const o=e.target;o===document.activeElement&&q(),Y(e,p({currentInputValue:o.value}))},ie=e=>{U(e,p({currentInputValue:e.target.value}))},de=e=>{if(e.key==="ArrowDown")q();else if(e.key==="Escape")w();else if(e.key==="Enter"&&f.isExpanded){const o=ne.getIndex();o!==-1&&_(e,u[o].props.text),r||w()}X(e)};return t.createElement(te,{ref:E,className:x("combobox",b)},t.createElement(F.Label,{htmlFor:h.id}),t.createElement("span",{className:x("combobox__control",{"combobox__control--actionable":l,"combobox__control--borderless":K})},t.createElement("input",Object.assign({},h,{ref:e=>{L.setHost(e),s.current=e},type:"text",role:"combobox",value:c,"aria-autocomplete":v,"aria-haspopup":"listbox",autoComplete:"off","aria-expanded":"false",onChange:re,onBlur:ce,onClick:ue,onFocus:ie,onKeyDown:de,placeholder:H})),l?t.cloneElement(l,{onClick:le,onMouseDown:ae}):null),u.length>0&&t.createElement("div",{role:"listbox",className:"combobox__listbox",ref:e=>{L.setOverlay(e),S.current=e},style:Z},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=pe;exports.EbayComboboxButton=T;exports.EbayComboboxOption=j;
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,8 @@
1
+ import { FC, ReactNode } from 'react';
2
+ type Props = {
3
+ className?: string;
4
+ children?: ReactNode;
5
+ };
6
+ declare const EbayEducationNoticeFooter: FC<Props>;
7
+ export default EbayEducationNoticeFooter;
8
+ //# sourceMappingURL=education-notice-footer.d.ts.map
@@ -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,3 @@
1
+ import { EbayMouseEventHandler } from '../events';
2
+ export type EducationDismissHandler = EbayMouseEventHandler<HTMLElement>;
3
+ //# sourceMappingURL=types.d.ts.map
@@ -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,2 @@
1
+ export { default as EbayFakeLink, type EbayFakeLinkProps } from './fake-link';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -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,3 @@
1
+ export { default as EbayFilter, type EbayFilterProps } from './filter';
2
+ export * from './types';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -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,6 @@
1
+ import { EbayMouseEventHandler } from '../events';
2
+ export type EventData = {
3
+ selected?: boolean;
4
+ };
5
+ export type FilterClickHandler = EbayMouseEventHandler<HTMLButtonElement & HTMLAnchorElement, EventData>;
6
+ //# sourceMappingURL=types.d.ts.map
@@ -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,3 @@
1
+ export { default as EbayFilterMenuButton, type EbayFilterMenuButtonProps } from './filter-menu-button';
2
+ export { EbayFilterMenuItem, EbayFilterMenuFooterButton, type EbayFilterMenuItemProps } from '../ebay-filter-menu';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -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 y=require("../tslib.es6-C4EgNkz1.js"),e=require("react"),h=require("../notice-content-9iF4T8uB.js"),b=require("../notice-content-C0ZStfuX.js"),l=require("../icon-CeLPlCml.js");require("classnames");const o=require("../notice-cta-hm2vI5MI.js"),C=t=>{var{id:a,status:n="general",children:i,a11yDismissText:s,"aria-label":m,onDismiss:E=()=>{}}=t,d=y.__rest(t,["id","status","children","a11yDismissText","aria-label","onDismiss"]);const[u,N]=e.useState(!1),r=e.Children.toArray(i).find(c=>c.type===b.EbayNoticeContent);if(!r)throw new Error("EbayPageNotice: Please use a EbayNoticeContent that defines the content of the notice");const p=c=>{N(!0),E(c)};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(l.EbayIcon,{name:`${n}Filled16`,a11yText:m,a11yVariant:"label"})):null,e.createElement(h.NoticeContent,Object.assign({},r.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(l.EbayIcon,{name:"close16"}))))},P=t=>{var{className:a,as:n,children:i}=t,s=y.__rest(t,["className","as","children"]);return e.createElement(o.NoticeTitle,Object.assign({},s,{className:a,as:n,type:"page"}),i)},g=({className:t,children:a})=>e.createElement(o.NoticeFooter,{className:t,type:"page"},a),T=({className:t,children:a})=>e.createElement(o.NoticeCTA,{className:t,type:"page"},a);exports.EbayNoticeContent=b.EbayNoticeContent;exports.EbayPageNotice=C;exports.EbayPageNoticeCTA=T;exports.EbayPageNoticeFooter=g;exports.EbayPageNoticeTitle=P;
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;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../tslib.es6-C4EgNkz1.js"),a=require("react"),j=require("classnames"),c=require("../icon-CeLPlCml.js"),F=require("../label-BRztS0pw.js"),O=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 v=n=>{var e;return m(n,{value:(e=n.target)===null||e===void 0?void 0:e.value})},_=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=j("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===F.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:v,onFocus:_,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=O;
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 E=require("../tslib.es6-C4EgNkz1.js"),e=require("react"),$=require("classnames"),N=require("../notice-content-C0ZStfuX.js"),A=require("../notice-content-9iF4T8uB.js"),y=require("../icon-CeLPlCml.js"),j=require("../forwardRef-irqyO_PF.js"),d=require("../notice-cta-hm2vI5MI.js"),v=n=>{var{status:t="general",children:i,className:s,"aria-label":o,"aria-roledescription":C="Notice",a11yDismissText:m,educationIcon:p,iconClass:S,prominent:f,onDismiss:g=()=>{}}=n,T=E.__rest(n,["status","children","className","aria-label","aria-roledescription","a11yDismissText","educationIcon","iconClass","prominent","onDismiss"]);const[q,D]=e.useState(!1),[u,I]=e.useState("");e.useEffect(()=>{I(j.randomId())},[]);const b=e.Children.toArray(i).find(({type:l})=>l===N.EbayNoticeContent),c=t!=="general"&&t!=="none",r=t==="education";let a=null;if(c&&(r?a=p||"lightbulb24":a=`${t}Filled16`),!b)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}-${u}`:null,"aria-roledescription":C}),a&&e.createElement("div",{className:"section-notice__header",id:`section-notice-${t}-${u}`},e.createElement(y.EbayIcon,{className:S,name:a,a11yText:o,a11yVariant:"label"})),e.createElement(A.NoticeContent,Object.assign({},b.props,{type:"section"})),i,m&&e.createElement(h,null,e.createElement("button",{"aria-label":m,className:"fake-link page-notice__dismiss",onClick:_},e.createElement(y.EbayIcon,{name:"close16"}))))},F=n=>{var{className:t,as:i,children:s}=n,o=E.__rest(n,["className","as","children"]);return e.createElement(d.NoticeTitle,Object.assign({},o,{className:t,as:i,type:"section"}),s)},h=({className:n,children:t})=>e.createElement(d.NoticeFooter,{className:n,type:"section"},t),O=({className:n,children:t})=>e.createElement(d.NoticeCTA,{className:n,type:"section"},t);exports.EbayNoticeContent=N.EbayNoticeContent;exports.EbaySectionNotice=v;exports.EbaySectionNoticeCTA=O;exports.EbaySectionNoticeFooter=h;exports.EbaySectionNoticeTitle=F;
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.1.3",
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;
@@ -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;