@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.01 kB
JavaScript
import{jsx as t,jsxs as o}from"react/jsx-runtime";import r from"@mui/material/Card";import e from"@mui/material/CardContent";import n from"@mui/material/Stack";import{prefix as a}from"./constant.js";const i=i=>{const{backgroundImage:m,backgroundColor:s,titleComponent:l,descriptionComponent:c,authorNameComponent:d,lastUpdatedComponent:p,actionComponent:u,sx:x,...f}=i,C=m&&"string"==typeof m;return t(r,{sx:[{display:"flex",justifyContent:"flex-start",alignItems:"center",position:"relative",backgroundImage:C?`url('${m}')`:"",backgroundColor:s,backgroundSize:"cover",minHeight:"390px",width:1,mx:"auto",borderRadius:2,color:s?t=>t.palette.getContrastText(s):"common.white",overflow:"hidden",px:{xs:5,sm:21},py:{xs:12,sm:10}},...Array.isArray(x)?x:[x]],className:`${a}-root`,"data-testid":`${a}-root`,...f,children:o(e,{sx:{flexBasis:"100%",p:0},children:[l,c,u,(d||p)&&o(n,{direction:"row",justifyContent:"flex-start",alignItems:"center",mt:5,children:[d," ",p]}),!C&&m]})})};export{i as HeroBannerComponent};