UNPKG

@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.68 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("react/jsx-runtime"),e=require("react"),o=require("@mui/material/Card"),a=require("@mui/material/Box"),n=require("@mui/material/Typography"),t=require("@mui/material/CardContent"),i=require("../Card/hooks/useCardActions.js"),s=require("../util/functions/index.js"),l=require("../Card/hooks/useCardLoading.js"),c=require("../Card/components/LoadingManager.js"),d=require("./PlainCard.skeleton.js");function u(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var m=u(o),x=u(a),p=u(n),C=u(t);const y="NexusPlainCard";exports.PlainCard=o=>{const{color:a="default",icon:n,sx:t,headline:u,content:g,actions:f,actionButtons:b,loading:h,loadingMode:k="spinner",dense:j,onClick:q,...M}=o,N=(({cardColor:r})=>{switch(r){case"primary":return{buttonColor:"inherit",sx:{backgroundColor:"primary.contrastText",color:"primary.main"}};case"secondary":return{buttonColor:"secondary",sx:{}};case"info":return{buttonColor:"primary",sx:{}};default:return{buttonColor:"primary",sx:r=>({...r.applyStyles("dark",{backgroundColor:"common.white",color:"background.paper"})})}}})({cardColor:a}),$=(({cardColor:r})=>{switch(r){case"primary":return{backgroundColor:"primary.main",color:"primary.contrastText"};case"secondary":return r=>({backgroundColor:"secondary.50",color:"text.primary",...r.applyStyles("dark",{color:"common.black"})});case"info":return{backgroundColor:"info.50",color:"common.black"};default:return{backgroundColor:"background.paper",color:"text.primary"}}})({cardColor:a}),A=b?.map((r=>s.isReactNode(r)?r:{color:N.buttonColor,...r,sx:[N.sx,...Array.isArray(r.sx)?r.sx:[r.sx]]})),{renderActions:P}=i.useCardActions({actions:f,actionButtons:A,skip:!f&&!b,classPrefix:y,padding:0}),v=e.useMemo((()=>n?r.jsx(x.default,{className:`${y}-icon`,"data-testid":`${y}-icon`,sx:{mb:4},children:n}):null),[n]),L=e.useMemo((()=>u?r.jsx(x.default,{className:`${y}-headlineContainer`,sx:{mb:j?4:8},children:"string"==typeof u?r.jsx(p.default,{variant:j?"body2":"h6",fontWeight:700,className:`${y}-headline`,children:u}):u}):null),[u,j]),S=e.useMemo((()=>g?r.jsx(x.default,{className:`${y}-contentContainer`,sx:{mb:j?5:12},children:"string"==typeof g?r.jsx(p.default,{variant:"body2",className:`${y}-content`,children:g}):g}):null),[g,j]),{renderLoadingPanel:w,cardLoadingStyle:B}=l.useCardLoading(h,k);return r.jsx(m.default,{className:`${y}-root`,"data-testid":`${y}-root`,sx:[{position:"relative"},$,B,...Array.isArray(t)?t:[t]],onClick:q,...M,children:r.jsxs(c.LoadingManager,{loading:h,loadingMode:k,skeleton:d.PlainCardSkeleton,children:[r.jsxs(C.default,{sx:{p:j?4:6},children:[v,L,S,P]}),w]})})};