@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.25 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material/Collapse"),a=require("@mui/material/List"),i=require("@mui/material/ListItemText"),s=require("@mui/material/Divider"),d=require("@mui/icons-material/ExpandLess"),o=require("@mui/icons-material/ExpandMore"),n=require("clsx"),l=require("@mui/material/Box"),u=require("@mui/material/Stack"),m=require("../../DrawerContext.js"),c=require("../DrawerCondensedListItem/DrawerCondensedListItem.container.js"),x=require("../DrawerNestedListItem/DrawerNestedListItem.container.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=p(t),j=p(a),h=p(i),q=p(s),C=p(d),L=p(o),w=p(n),y=p(l),D=p(u);const I="NexusDrawerSection",v=t=>{const{condensed:a}=m.useDrawerContext(),{header:i,open:s,collapsible:d,onClick:o}=t,n={cursor:d?"pointer":"default"},l=r.useCallback((()=>{d&&o?.()}),[d,o]);return e.jsxs(D.default,{direction:"row",sx:[{px:4},...Array.isArray(n)?n:[n]],onClick:l,className:w.default(`${I}Header-root`,`${I}-header-root`),"data-testid":`${I}-header-root`,children:[e.jsx(h.default,{primary:i,primaryTypographyProps:{variant:a?"caption":void 0,sx:{fontWeight:700}},className:w.default(`${I}Header-text`,`${I}-header-text`),"data-testid":`${I}-header-text`}),!a&&d&&e.jsx(e.Fragment,{children:s?e.jsx(C.default,{sx:{color:"grey.600"}}):e.jsx(L.default,{sx:{color:"grey.600"}})})]})};exports.DrawerSectionComponent=t=>{const{header:a,collapsible:i,startExpanded:s,styleMode:d="mui",divider:o,items:n=[],ListItemButtonProps:l,sx:u,children:p,...h}=t,{condensed:C}=m.useDrawerContext(),[L,w]=r.useState(s),D=r.useCallback((()=>{w(!L)}),[L]);return e.jsxs(y.default,{"data-testid":`${I}-root`,children:[a&&e.jsx(v,{open:L,collapsible:i,header:a,onClick:D}),e.jsx(f.default,{in:!i||L,timeout:"auto",unmountOnExit:!0,children:e.jsxs(j.default,{disablePadding:!0,...h,children:[n.map((r=>C?e.jsx(c.DrawerCondensedListItem,{item:r,ListItemButtonProps:l},r.nodeId):e.jsx(x.DrawerNestedListItem,{styleMode:d,item:r,level:0,ListProps:h,ListItemButtonProps:l},r.nodeId))),p]})}),o&&e.jsx(q.default,{sx:{mb:C?2:0},className:`${I}-divider`,"data-testid":`${I}-divider`})]})},exports.prefix=I;