@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.41 kB
JavaScript
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Info as s,ErrorOutline as i,Check as r}from"@mui/icons-material";import{useTheme as l,Box as a}from"@mui/material";import{iconSizeMap as n}from"../../BrandCore/Icon/Icon.js";import o from"../InputLabelBase/InputLabelBase.js";import{typographyVariantMap as m}from"../utils/typography.util.js";const c=c=>{const{icon:d=null,state:u="default",disabled:p,showicon:x=!0}=c,f=l();return e(a,{sx:{display:"inline-flex",alignItems:"center",color:p?f.custom.palette.text.disabled:(()=>{switch(u){case"disabled":return f.custom.palette.text.disabled;case"positive":return f.custom.palette.text.positive;case"negative":return f.custom.palette.text.negative;default:return f.custom.palette.text.secondary}})(),"& svg":{marginRight:f.spacing(f.custom.margin.xs),width:n.xs,height:n.xs,color:"inherit"}},children:[(()=>{if(!x)return null;if(d)return d;switch(u){case"disabled":default:return t(a,{sx:{height:20,display:"flex",alignItems:"center",alignSelf:"flex-start"},children:t(s,{})});case"positive":return t(a,{sx:{height:20,display:"flex",alignItems:"center",alignSelf:"flex-start"},children:t(r,{})});case"negative":return t(a,{sx:{height:20,display:"flex",alignItems:"center",alignSelf:"flex-start"},children:t(i,{})})}})(),t(o,{...c,sx:{fontSize:{xs:m.sm.body.sm,sm:m.sm.body.sm,md:m.sm.body.sm,lg:m.lg.body.sm,xl:m.lg.body.sm}}})]})};export{c as default};