@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.42 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material/IconButton"),a=require("@mui/material/AppBar"),o=require("@mui/material/Typography"),i=require("@mui/material/Toolbar"),l=require("clsx"),s=require("./DrawerHeader.styles.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=n(r),u=n(t),d=n(a),m=n(o),p=n(i),x=n(l);const f="NexusDrawerHeader";exports.DrawerHeaderComponent=t=>{const{label:a,icon:o,onIconClick:i,divider:l=!0,sx:n,onClick:b,...y}=t,$=r.useMemo((()=>[l?{}:{borderBottom:0},b?{cursor:"pointer"}:{},s.styles.rootStyle,...Array.isArray(n)?n:[n]]),[l,b,n]);return e.jsx(d.default,{className:`${f}-root`,sx:$,color:"inherit",position:"sticky",onClick:b,...y,children:e.jsxs(p.default,{className:`${f}-toolbar`,children:[o&&i&&e.jsx(u.default,{sx:{mr:"3px"},size:"small",edge:"start",color:"inherit",onClick:e=>{e.stopPropagation(),i()},className:x.default(`${f}-iconButton`,`${f}-icon-button`),"data-testid":`${f}-icon-button`,"aria-label":"Drawer Header Action",children:c.default.cloneElement(o,{fontSize:"1.125rem",className:`${f}-icon`})}),o&&!i&&c.default.cloneElement(o,{fontSize:"1.125rem",className:`${f}-icon`,sx:{mr:"3px"}}),"string"==typeof a?e.jsx(m.default,{variant:"body2",noWrap:!0,className:`${f}-label`,"data-testid":`${f}-label`,children:a}):a]})})},exports.prefix=f;