@ebay/ui-core-react
Version:
Skin components build off React
2 lines (1 loc) • 3.26 kB
JavaScript
;const q=require("./tslib.es6-C4EgNkz1.js"),n=require("react"),P=require("classnames"),z=require("./use-roving-index-DoAVBgsp.js"),G=require("./index-Bsb1LHpi.js"),H=require("./forwardRef-DBQKIlPy.js");require("./array.polyfill.flat-5BAolFdk.js");const J=require("./badge-BWhBKWCu.js"),Q=require("./icons/ebay-icon-tick-16/index.js"),V=o=>{var{className:h,checked:a,type:l,focused:f=!1,tabIndex:E,disabled:k,badgeNumber:y,badgeAriaLabel:w,children:C,baseClass:p="menu"}=o,_=q.__rest(o,["className","checked","type","focused","tabIndex","disabled","badgeNumber","badgeAriaLabel","children","baseClass"]);const u=n.useRef(null),m=y!==void 0;n.useEffect(()=>{u.current&&f&&u.current.focus()},[u,f]);const v=["radio","checkbox"];return n.createElement("div",Object.assign({"aria-label":w},_,{ref:u,className:P(h,`${p}__item`,m&&`${p}__item--badged`),role:U(l),"aria-checked":v.includes(l)?a:void 0,"aria-disabled":k,tabIndex:f?0:E}),n.createElement("span",{"aria-hidden":m},C,m&&n.createElement(J.EbayBadge,{type:"menu",number:y})),n.createElement(Q.EbayIconTick16,null))};function U(o){return{radio:"menuitemradio",checkbox:"menuitemcheckbox"}[o]||"menuitem"}const X=o=>{var{baseEl:h="span",type:a,checked:l,className:f,autofocus:E,classPrefix:k,reverse:y,fixWidth:w,fixed:C,onClick:p=()=>{},onKeyDown:_=()=>{},onChange:u=()=>{},onSelect:m=()=>{},forwardedRef:v,menuRef:B,children:F}=o,S=q.__rest(o,["baseEl","type","checked","className","autofocus","classPrefix","reverse","fixWidth","fixed","onClick","onKeyDown","onChange","onSelect","forwardedRef","menuRef","children"]);const b=n.Children.toArray(F),[K,D]=z.useRovingIndex(F,V,E===!0?0:void 0),[d,j]=n.useState(b.map(()=>!1)),T=s=>b.reduce((e,c,r)=>s[r]?[...e,c.props.value]:e,[]),O=s=>s.reduce((e,c,r)=>c?[...e,r]:e,[]),R=(s,e)=>({index:s,checked:O(e)}),A=(s,e)=>Object.assign(Object.assign({},R(s,e)),{indexes:O(e),checkedValues:T(e)}),M=(s,e,c=!1)=>{let r=!1;const I=d.map((g,N)=>{const t=c?!1:g;return s===N?(g!==e&&(r=!0),e):t});if(r)return j(I),I},x=s=>{switch(a){case"radio":return M(s,!0,!0);case"checkbox":return M(s,!d[s],!1);default:return d.map((e,c)=>c===s)}};n.useEffect(()=>{if(a==="radio")if(l===void 0){const s=b.findIndex(e=>e.props.checked);s>-1&&x(s)}else x(l);else a==="checkbox"&&j(b.map(s=>!!s.props.checked))},[]);const $=(s,e,c)=>{switch(a){case"radio":case"checkbox":return u(s,A(e,c));default:return m(s,R(e,c))}},L=(s,e)=>{let c;switch(G.isActionKey(s.key)&&(c=x(e),c&&$(s,e,c)),a){case"radio":case"checkbox":return _(s,A(e,c||d));default:return _(s,R(e,c||d))}},W=(s,e)=>{D(e);const c=x(e);c&&$(s,e,c)},i=k||"menu";return n.createElement(h,Object.assign({},S,{className:P(f,k?`${i}__menu`:"menu",y&&`${i}__menu--reverse`,C&&`${i}__menu--fixed`,w&&`${i}__menu--fix-width`),ref:v}),n.createElement("div",{className:`${i}__items`,role:"menu",ref:B},b.map((s,e)=>{const c=s.props,{onClick:r=()=>{},onFocus:I=()=>{},onKeyDown:g=()=>{}}=c,N=q.__rest(c,["onClick","onFocus","onKeyDown"]);return n.cloneElement(s,Object.assign(Object.assign({},N),{type:a,baseClass:i,focused:e===K,tabIndex:K===void 0?0:-1,checked:d[e],onFocus:t=>{D(e),I(t)},onClick:t=>{W(t,e),r(t),p(t)},onKeyDown:t=>{L(t,e),g(t)}}))})))},Y=H.withForwardRef(X);exports.EbayMenu=Y;exports.EbayMenuItem=V;