@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.96 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material/Box"),r=require("@mui/material/Typography"),a=require("@mui/material/Stack"),l=require("@mui/icons-material/Close"),o=require("@mui/icons-material/MarkEmailReadOutlined"),s=require("@mui/material/Tooltip"),d=require("@mui/material/IconButton"),n=require("@mui/material/styles"),u=require("../NotificationFilter/NotificationFilter.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=c(t),x=c(r),f=c(a),p=c(l),h=c(o),b=c(s),g=c(d);const j={light:"action.disabled",dark:"action.disabled"},k="NexusNotificationsHeader";exports.NotificationsHeader=t=>{const{disabled:r,disableMarkAllAsRead:a,onMarkAllAsRead:l,onClose:o,t:s,isMobile:d,...c}=t,y=n.useTheme(),q=i.useMemo((()=>r?j:{light:"grey.600",dark:"grey.400"}),[r]),M=i.useMemo((()=>a?j:q),[a,q]);return e.jsx(f.default,{direction:"column",spacing:2,className:`${k}-root`,"data-testid":`${k}-root`,sx:{px:6,py:4,borderBottom:"1px solid",borderBottomColor:"divider"},children:e.jsxs(m.default,{display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",children:[e.jsx(x.default,{variant:"subtitle2",children:s("notifications")}),e.jsxs(f.default,{direction:"row",spacing:4,children:[e.jsx(b.default,{title:s("markAsRead"),children:e.jsx("span",{children:e.jsx(g.default,{"aria-label":s("markAsRead"),"data-testid":`${k}-mark-as-read`,disabled:r||a,sx:{width:32,height:32,"& .MuiSvgIcon-root":{color:M.light,...y.applyStyles("dark",{color:M.dark})}},onClick:l,children:e.jsx(h.default,{})})})}),e.jsx(u.NotificationFilter,{disabled:r,t:s,isMobile:d,...c}),d&&e.jsx(g.default,{"aria-label":s("close"),"data-testid":`${k}-close-toggle`,sx:{width:32,height:32,"& .MuiSvgIcon-root":{color:q.light,...y.applyStyles("dark",{color:q.dark})}},onClick:o,children:e.jsx(p.default,{})})]})]})})},exports.prefix=k;