UNPKG

@ebay/ui-core-react

Version:

Skin components build off React

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