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