@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.46 kB
JavaScript
import{jsx as r,jsxs as o}from"react/jsx-runtime";import{useMemo as a}from"react";import n from"@mui/material/Card";import t from"@mui/material/Box";import e from"@mui/material/Typography";import i from"@mui/material/CardContent";import{useCardActions as s}from"../Card/hooks/useCardActions.js";import{isReactNode as c}from"../util/functions/index.js";import{useCardLoading as l}from"../Card/hooks/useCardLoading.js";import{LoadingManager as d}from"../Card/components/LoadingManager.js";import{PlainCardSkeleton as m}from"./PlainCard.skeleton.js";const p="NexusPlainCard",u=u=>{const{color:y="default",icon:C,sx:x,headline:f,content:g,actions:b,actionButtons:h,loading:k,loadingMode:$="spinner",dense:N,onClick:j,...A}=u,L=(({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:y}),P=(({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:y}),v=h?.map((r=>c(r)?r:{color:L.buttonColor,...r,sx:[L.sx,...Array.isArray(r.sx)?r.sx:[r.sx]]})),{renderActions:w}=s({actions:b,actionButtons:v,skip:!b&&!h,classPrefix:p,padding:0}),B=a((()=>C?r(t,{className:`${p}-icon`,"data-testid":`${p}-icon`,sx:{mb:4},children:C}):null),[C]),M=a((()=>f?r(t,{className:`${p}-headlineContainer`,sx:{mb:N?4:8},children:"string"==typeof f?r(e,{variant:N?"body2":"h6",fontWeight:700,className:`${p}-headline`,children:f}):f}):null),[f,N]),S=a((()=>g?r(t,{className:`${p}-contentContainer`,sx:{mb:N?5:12},children:"string"==typeof g?r(e,{variant:"body2",className:`${p}-content`,children:g}):g}):null),[g,N]),{renderLoadingPanel:T,cardLoadingStyle:W}=l(k,$);return r(n,{className:`${p}-root`,"data-testid":`${p}-root`,sx:[{position:"relative"},P,W,...Array.isArray(x)?x:[x]],onClick:j,...A,children:o(d,{loading:k,loadingMode:$,skeleton:m,children:[o(i,{sx:{p:N?4:6},children:[B,M,S,w]}),T]})})};export{u as PlainCard};