@nexusui/components
Version:
These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.
2 lines (1 loc) • 2.73 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/ListItemButton"),s=require("@mui/material/ListItemText"),i=require("@mui/material/ListItemIcon"),r=require("@mui/icons-material/ExpandLess"),a=require("@mui/icons-material/ExpandMore"),l=require("react"),n=require("@mui/material/List"),d=require("@mui/material/Collapse"),o=require("@mui/material/IconButton"),u=require("@mui/material/ListItem"),m=require("./DrawerNestedListItem.styles.js"),c=require("../../DrawerContext.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=x(t),I=x(s),f=x(i),y=x(r),$=x(a),g=x(n),h=x(d),j=x(o),L=x(u);const b="NexusDrawerNestedListItem",q=t=>{const{styleMode:s,item:i,level:r=0,ListItemButtonProps:a,ListProps:n}=t,{selectedNodeId:d,onNavItemClick:o,expanded:u,setExpanded:x}=c.useDrawerContext(),C=!!Array.isArray(u)&&-1!==u.indexOf(i.nodeId),v=i.items&&i.items.length>0,N=l.useCallback((()=>{let e;e=-1!==u.indexOf(i.nodeId)?u.filter((e=>e!==i.nodeId)):[i.nodeId].concat(u),x(e)}),[x,u,i.nodeId]),P=l.useCallback((e=>{e.stopPropagation(),i.onNavItemClick?i.onNavItemClick?.(i):v&&N(),o?.(i)}),[N,v,i,o]),k=l.useMemo((()=>{let e={sx:[{pl:4*(r+1),..."nexus"===s?m.styles.nexusListItem:{}}],..."nexus"===s?{dense:!0,disableRipple:!0}:{}};if(a){const{sx:t,...s}=a;e={...e,sx:[...e.sx,...Array.isArray(t)?t:[t]],...s}}return e}),[a,r,s]);return r>2&&console.warn("[Performance] Warning: It probably causes performance issues if the nested level exceeds 3."),e.jsxs(e.Fragment,{children:[e.jsx(L.default,{disablePadding:!0,children:e.jsxs(p.default,{disabled:i.disabled,selected:i.nodeId===d,onClick:P,className:`${b}-root ${b} ${0===r&&`${b}-firstLevel ${b}-first-level`} ${v?`${b}-hasChildren ${b}-has-children`:`${b}-leaf`}`,"data-testid":`${b}-${i.nodeId}`,role:void 0,...k,children:[i.icon&&e.jsx(f.default,{sx:{minWidth:"unset",mr:8},className:`${b}-icon`,"data-testid":`${b}-icon`,children:i.icon}),e.jsx(I.default,{primary:i.label,primaryTypographyProps:{sx:m.styles.labelStyle},className:`${b}-text`,"data-testid":`${b}-text`}),i.action,v&&e.jsx(j.default,{onClick:e=>{e.stopPropagation(),N()},edge:"end",className:`${b}-toggleButton`,"data-testid":`${b}-toggleButton`,"aria-label":C?"Collapse":"Expand",children:C?e.jsx(y.default,{sx:{color:"grey.600"}}):e.jsx($.default,{sx:{color:"grey.600"}})})]},i.nodeId)}),e.jsx(h.default,{in:C,timeout:"auto",unmountOnExit:!0,component:"li",children:i.items&&i.items.length>0&&e.jsx(g.default,{disablePadding:!0,...n,children:i.items.map((t=>e.jsx(q,{styleMode:s,item:t,level:r+1,ListProps:n,ListItemButtonProps:a},t.nodeId)))})})]})};exports.DrawerNestedListItemComponent=q,exports.prefix=b;