@ebay/ui-core-react
Version:
Skin components build off React
2 lines (1 loc) • 4.87 kB
JavaScript
;const j=require("./tslib.es6-C4EgNkz1.js"),t=require("react"),ae=require("makeup-prevent-scroll-keys"),re=require("makeup-roving-tabindex"),T=require("./random-id-DlJj_RWH.js"),ne=require("./forwardRef-DBQKIlPy.js"),A=require("./utils-C9NL3q0j.js"),B=require("classnames"),ce=require("./checkbox-ebkMhvbJ.js"),oe=require("./radio-DLgEB-qH.js"),O=require("./icon-C-bWGO-9.js");require("./array.polyfill.flat-5BAolFdk.js");const le=require("./button-DhwBC3vw.js");function se(r){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const l in r)if(l!=="default"){const m=Object.getOwnPropertyDescriptor(r,l);Object.defineProperty(c,l,m.get?m:{enumerable:!0,get:()=>r[l]})}}return c.default=r,Object.freeze(c)}const ie=se(ae),V=r=>{var{__classPrefix:c,__variant:l,className:m,onClick:C}=r,E=j.__rest(r,["__classPrefix","__variant","className","onClick"]);const s=l==="form";return t.createElement("button",Object.assign({},E,{type:s?"submit":"button",className:B(m,`${c}__footer`),onClick:s?void 0:C}))},z=r=>{var{checked:c,value:l,disabled:m,children:C,className:E,onClick:s,__type:P,__variant:q,__classPrefix:v}=r,R=j.__rest(r,["checked","value","disabled","children","className","onClick","__type","__variant","__classPrefix"]);const I=q==="form",u=P==="radio",h=u?"radio":"checkbox",F=T.useRandomId(),y=`'${h}-${F}`,b=I?"label":"div",$=u?oe.EbayRadio:ce.EbayCheckbox,w=u?`${v}__radio`:`${v}__checkbox`,M=u?"radioChecked18":"checkboxChecked18",x=u?"radioUnchecked18":"checkboxUnchecked18",f=_=>{s==null||s(_,{value:l,checked:!c})};return t.createElement(b,Object.assign({},R,{className:B(E,`${v}__item`),htmlFor:I?y:void 0,role:u?"menuitemradio":"menuitemcheckbox",onClick:f,"aria-checked":c,"aria-disabled":m}),I?t.createElement($,{id:y,checked:c}):t.createElement("span",{className:w},t.createElement(O.EbayIcon,{name:c?M:x})),t.createElement("span",{className:`${v}__text`},C))},de=r=>{var{classPrefix:c,className:l,formMethod:m,formAction:C,formName:E,variant:s,children:P,type:q,searchHeaderValue:v,searchHeaderPlaceholderText:R,a11ySearchHeaderClearText:I,forwardedRef:u,onSearchChange:h,onFormSubmit:F,onFooterClick:y,onChange:b,"aria-label":$,"aria-labelledby":w}=r,M=j.__rest(r,["classPrefix","className","formMethod","formAction","formName","variant","children","type","searchHeaderValue","searchHeaderPlaceholderText","a11ySearchHeaderClearText","forwardedRef","onSearchChange","onFormSubmit","onFooterClick","onChange","aria-label","aria-labelledby"]);const x=t.useRef(null),f=s==="form",_=q==="radio",N=c||"filter-menu",H=A.findComponent(P,V),p=A.filterByType(P,z),D=T.useRandomId(),[G,K]=t.useState(v||""),[g,J]=t.useState(()=>p.map((e,a)=>e.props.checked&&a).find(e=>typeof e=="number")),[S,Q]=t.useState(()=>p.map(e=>!!e.props.checked));t.useEffect(()=>{let e;return f||(e=re.createLinear(x.current,"div",{autoInit:"interactive"}),ie.add(x.current)),()=>{e&&(e.destroy(),e=null)}},[f]);const L=()=>({checked:p.filter((e,a)=>_?g===a:S[a]).map(e=>e.props.value),checkedIndex:p.map((e,a)=>_?a===g&&a:S[a]&&a).filter(e=>typeof e=="number")}),W=e=>{y==null||y(e,L())},X=e=>{F==null||F(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=f?"form":t.Fragment,te=f?{name:E,action:C,method:m,onSubmit:X}:{},U=(e,{checked:a,index:n})=>{const k=e.target;if(!(f&&k.type==="checkbox"))if(_)J(n),b==null||b(e,{index:n,checked:[p[n].props.value],checkedIndex:[n],currentChecked:a});else{const i=S.map((o,d)=>d===n?a:o);b==null||b(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({},M,{ref:u,className:B(l,`${c?`${N}__menu`:N}`)}),R?t.createElement("div",{className:"filter-menu__header"},t.createElement(O.EbayIcon,{name:"search16"}),t.createElement("input",{type:"text",value:G,className:"filter-menu__search",placeholder:R,"aria-owns":D,onChange:Z}),t.createElement(le.EbayButton,{type:"button",onClick:Y,"aria-label":I},t.createElement(O.EbayIcon,{name:"clear20"}))):null,t.createElement(ee,Object.assign({},te),t.createElement("div",{id:D,ref:x,className:`${N}__items`,role:f?void 0:"menu","aria-label":$,"aria-labelledby":w},p.map((e,a)=>t.cloneElement(e,{__classPrefix:N,__type:q,__variant:s,checked:_?a===g:S[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}),U(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:S[a];U(n,{checked:!o,index:a})}}}))),H&&t.cloneElement(H,{onClick:W,__classPrefix:N,__variant:s})))},me=ne.withForwardRef(de);exports.EbayFilterMenu=me;exports.EbayFilterMenuFooterButton=V;exports.EbayFilterMenuItem=z;