@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) • 1.62 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/ListItemButton"),r=require("@mui/material/ListItemText"),s=require("@mui/material/ListItemIcon"),i=require("react"),a=require("clsx"),n=require("@mui/material/ListItem"),o=require("../../DrawerContext.js"),d=require("../../Drawer.component.js"),l=require("./DrawerCondensedListItem.styles.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=u(t),m=u(r),x=u(s),I=u(a),p=u(n);const C="NexusDrawerCondensedListItem";exports.DrawerCondensedListItemComponent=t=>{const{item:r,ListItemButtonProps:s}=t,{showCondensedLabel:a,selectedNodeId:n,onNavItemClick:u}=o.useDrawerContext(),f=a?d.CONDENSED_WITH_LABEL_WIDTH:d.CONDENSED_WITHOUT_LABEL_WIDTH,L=i.useCallback((e=>{e.stopPropagation(),r.onNavItemClick?r.onNavItemClick(r):u&&u(r)}),[r,u]),D=i.useMemo((()=>{let e={sx:l.styles.condensedListItem};if(s){const{sx:t,...r}=s;e={...e,sx:[...e.sx,...Array.isArray(t)?t:[t]],...r}}return e}),[s]);return e.jsx(p.default,{disablePadding:!0,children:e.jsxs(c.default,{disabled:r.disabled,selected:r.nodeId===n,onClick:L,className:I.default(`${C}-root`,C),"data-testid":`${C}-${r.nodeId}`,...D,children:[r.icon&&e.jsx(x.default,{sx:{minWidth:"unset",width:f,justifyContent:"center"},className:`${C}-icon`,"data-testid":`${C}-icon`,children:r.icon}),a&&e.jsx(m.default,{sx:{width:f,px:2,textAlign:"center",overflowWrap:"break-word"},primary:r.label,primaryTypographyProps:{variant:"caption"},className:`${C}-text`,"data-testid":`${C}-text`})]},r.nodeId)})},exports.prefix=C;