@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 774 B
JavaScript
import{jsx as t}from"react/jsx-runtime";import{useTheme as o,Typography as e}from"@mui/material";import{mergeSx as r}from"merge-sx";import{forwardRef as a}from"react";import{FontWeight as i}from"../../BrandCore/types.js";const n=t=>"bold"===t?i.BOLD:i.DEFAULT,m=a(({component:a,weight:i="default",variation:m,clamp:l=0,type:s="default",disabled:p,monospaced:c,secondary:d,textColor:f,...u},x)=>{const b=o();return t(e,{ref:x,variant:m,fontWeight:n(i),component:a,...u,sx:r(u.sx,!!l&&{display:"-webkit-box",overflow:"hidden",WebkitBoxOrient:"vertical",WebkitLineClamp:l},"button"===s&&{lineHeight:1.2},c&&{fontVariantNumeric:"tabular-nums"},d&&{color:b.custom.palette.text.secondary},p&&{color:b.custom.palette.text.disabled},Boolean(f)&&{color:f})})});export{m as default};