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