UNPKG

@useloops/design-system

Version:

The official React based Loops design system

2 lines (1 loc) 1.34 kB
import{jsx as i,jsxs as e}from"react/jsx-runtime";import{useTheme as t,Stack as n}from"@mui/material";import a from"../../BrandCore/Icon/Icon.js";import r from"./_partials/ProjectItemTitle.js";import{CardContainer as s,CardActionArea as l,ImageContainer as d,Tile as o,CardContent as c}from"./_partials/styledPartials.js";const m=({onClick:m,viewType:p,title:h})=>{const x=t();return i(s,"list"===p?{disableRaisedEffect:!0,sx:{borderBottom:`1px solid ${x.custom.palette.stroke.light}`},children:e(l,{component:"div",onClick:m,sx:{display:"flex",gap:x.spacing(x.custom.margin.sm),alignItems:"center",padding:x.spacing(x.custom.padding.xs)},children:[i(d,{sx:{height:72,width:108},"data-id":"image-container",children:i(o,{viewType:p,children:i(a,{name:"add"})})}),i(c,{sx:{overflow:"hidden",pl:x.spacing(x.custom.padding.sm),minWidth:67,flex:1,"&:last-child":{pb:0}},children:i(n,{gap:x.spacing(x.custom.margin.xs),children:i(r,{title:h,maxLines:1})})})]})}:{sx:{height:"100%"},children:e(l,{component:"div",onClick:m,disableHoverStyle:!0,sx:{height:"inherit",display:"flex",flexDirection:"column",justifyContent:"flex-start",alignItems:"flex-start"},children:[i(d,{"data-id":"image-container",sx:{width:"100%"},children:i(o,{viewType:p,children:i(a,{name:"add"})})}),i(c,{children:i(r,{title:h,maxLines:2})})]})})};export{m as default};