UNPKG

@snowball-tech/fractal

Version:

Fractal's (Snowball's design system) React component library based on RadixUI and TailwindCSS

2 lines 11 kB
import{a as e}from"../constants-CW2-utNH.js";import{r as ee}from"../helpers-DBEwVIlX.js";import{GROUP_NAME as t,VARIANTS_MAPPING as te}from"./Typography.constants.js";import{createElement as ne,forwardRef as n}from"react";import r from"lodash/fp/isEmpty.js";import re from"lodash/fp/omit.js";import{ColorDecorativePurple50 as ie,ColorTextDark as i,FontWeightMedian as a,TypographyBody1BoldEmailFontFamily as o,TypographyBody1BoldEmailFontSize as ae,TypographyBody1BoldEmailFontWeight as oe,TypographyBody1BoldEmailLetterSpacing as se,TypographyBody1BoldEmailLineHeight as ce,TypographyBody1EmailFontFamily as le,TypographyBody1EmailFontSize as ue,TypographyBody1EmailFontWeight as de,TypographyBody1EmailLetterSpacing as fe,TypographyBody1EmailLineHeight as pe,TypographyBody1LinkEmailFontFamily as s,TypographyBody1LinkEmailFontSize as c,TypographyBody1LinkEmailFontWeight as l,TypographyBody1LinkEmailLetterSpacing as u,TypographyBody1LinkEmailLineHeight as d,TypographyBody1LinkEmailTextDecoration as f,TypographyBody1MedianEmailFontFamily as p,TypographyBody1MedianEmailFontSize as m,TypographyBody1MedianEmailFontWeight as h,TypographyBody1MedianEmailLetterSpacing as g,TypographyBody1MedianEmailLineHeight as _,TypographyBody2BoldEmailFontFamily as v,TypographyBody2BoldEmailFontSize as y,TypographyBody2BoldEmailFontWeight as b,TypographyBody2BoldEmailLetterSpacing as x,TypographyBody2BoldEmailLineHeight as S,TypographyBody2EmailFontFamily as C,TypographyBody2EmailFontSize as w,TypographyBody2EmailFontWeight as T,TypographyBody2EmailLetterSpacing as E,TypographyBody2EmailLineHeight as D,TypographyBody2LinkEmailFontFamily as O,TypographyBody2LinkEmailFontSize as k,TypographyBody2LinkEmailFontWeight as A,TypographyBody2LinkEmailLetterSpacing as j,TypographyBody2LinkEmailLineHeight as M,TypographyBody2LinkEmailTextDecoration as N,TypographyBody2MedianEmailFontFamily as P,TypographyBody2MedianEmailFontSize as F,TypographyBody2MedianEmailFontWeight as I,TypographyBody2MedianEmailLetterSpacing as L,TypographyBody2MedianEmailLineHeight as R,TypographyCaptionBoldEmailFontFamily as z,TypographyCaptionBoldEmailFontSize as B,TypographyCaptionBoldEmailFontWeight as me,TypographyCaptionBoldEmailLetterSpacing as he,TypographyCaptionBoldEmailLineHeight as ge,TypographyCaptionLinkEmailFontFamily as _e,TypographyCaptionLinkEmailFontSize as ve,TypographyCaptionLinkEmailFontWeight as ye,TypographyCaptionLinkEmailLetterSpacing as be,TypographyCaptionLinkEmailLineHeight as xe,TypographyCaptionLinkEmailTextDecoration as Se,TypographyCaptionMedianEmailFontFamily as Ce,TypographyCaptionMedianEmailFontSize as we,TypographyCaptionMedianEmailFontWeight as Te,TypographyCaptionMedianEmailLetterSpacing as Ee,TypographyCaptionMedianEmailLineHeight as De,TypographyDisplay1EmailFontFamily as Oe,TypographyDisplay1EmailFontSizeMd as ke,TypographyDisplay1EmailFontSizeXxs as Ae,TypographyDisplay1EmailFontWeight as je,TypographyDisplay1EmailLetterSpacing as Me,TypographyDisplay1EmailLineHeightMd as Ne,TypographyDisplay1EmailLineHeightXxs as Pe,TypographyDisplay2EmailFontFamily as V,TypographyDisplay2EmailFontSizeMd as Fe,TypographyDisplay2EmailFontSizeXxs as Ie,TypographyDisplay2EmailFontWeight as Le,TypographyDisplay2EmailLetterSpacing as Re,TypographyDisplay2EmailLineHeightMd as ze,TypographyDisplay2EmailLineHeightXxs as Be,TypographyDisplayWideEmailFontFamily as Ve,TypographyDisplayWideEmailFontSizeMd as He,TypographyDisplayWideEmailFontSizeXxs as Ue,TypographyDisplayWideEmailFontWeight as We,TypographyDisplayWideEmailLetterSpacing as Ge,TypographyDisplayWideEmailLineHeightMd as Ke,TypographyDisplayWideEmailLineHeightXxs as qe,TypographyHeading1EmailFontFamily as Je,TypographyHeading1EmailFontSizeMd as Ye,TypographyHeading1EmailFontSizeXxs as Xe,TypographyHeading1EmailFontWeight as Ze,TypographyHeading1EmailLetterSpacing as Qe,TypographyHeading1EmailLineHeightMd as $e,TypographyHeading1EmailLineHeightXxs as et,TypographyHeading2EmailFontFamily as tt,TypographyHeading2EmailFontSizeMd as nt,TypographyHeading2EmailFontSizeXxs as rt,TypographyHeading2EmailFontWeight as it,TypographyHeading2EmailLetterSpacing as at,TypographyHeading2EmailLineHeightMd as ot,TypographyHeading2EmailLineHeightXxs as st,TypographyHeading3EmailFontFamily as ct,TypographyHeading3EmailFontSize as lt,TypographyHeading3EmailFontWeight as ut,TypographyHeading3EmailLetterSpacing as dt,TypographyHeading3EmailLineHeight as ft,TypographyHeading3LinkEmailFontFamily as pt,TypographyHeading3LinkEmailFontSize as mt,TypographyHeading3LinkEmailFontWeight as ht,TypographyHeading3LinkEmailLetterSpacing as gt,TypographyHeading3LinkEmailLineHeight as _t,TypographyHeading4EmailFontFamily as vt,TypographyHeading4EmailFontSize as yt,TypographyHeading4EmailFontWeight as bt,TypographyHeading4EmailLetterSpacing as xt,TypographyHeading4EmailLineHeight as St,TypographyHeading4LinkEmailFontFamily as Ct,TypographyHeading4LinkEmailFontSize as wt,TypographyHeading4LinkEmailFontWeight as Tt,TypographyHeading4LinkEmailLetterSpacing as Et,TypographyHeading4LinkEmailLineHeight as Dt}from"@snowball-tech/design-tokens/dist/web/typescript/design-tokens.js";const Ot=new Set([`code`,`kbd`,`pre`,`samp`]),H=n(({children:n,disableClickTracking:H=!1,element:U,fullStyle:W=!1,inlineStyle:G=!1,variant:K,xs:q=!1,...J},kt)=>{let Y=K||`body-1`,At=r(K),X=U||te[Y]||`p`;!r(J.href)&&r(U)&&(X=`a`),U===`a`&&r(J.href)&&(X=`p`);let Z=``;switch(Y){case`body-1-bold`:Z=`tracking-normal text-body-1 font-body-1 font-weight-body-1-bold leading-body-1`;break;case`body-1-link`:Z=`tracking-normal text-body-1 font-body-1 font-weight-body-1-link leading-body-1 underline`;break;case`body-1-median`:Z=`tracking-normal text-body-1 font-body-1 font-weight-body-1-median leading-body-1`;break;case`body-2`:Z=`tracking-normal text-body-2 font-body-2 font-weight-body-2 leading-body-2`;break;case`body-2-bold`:Z=`tracking-normal text-body-2 font-body-2 font-weight-body-2-bold leading-body-2`;break;case`body-2-link`:Z=`tracking-normal text-body-2 font-body-2 font-weight-body-2-link leading-body-2 underline`;break;case`body-2-median`:Z=`tracking-normal text-body-2 font-body-2 font-weight-body-2-median leading-body-2`;break;case`caption-bold`:Z=`tracking-normal text-caption font-caption font-weight-caption-bold leading-caption`;break;case`caption-link`:Z=`tracking-normal text-caption font-caption font-weight-caption-link leading-caption underline`;break;case`caption-median`:Z=`tracking-normal text-caption font-caption font-weight-caption-median leading-caption`;break;case`display-1`:Z=`tracking-normal xxs:text-display-1-xxs${q?``:` md:text-display-1-md md:leading-display-1-md`} font-display-1 font-weight-display-1 xxs:leading-display-1-xxs`;break;case`display-2`:Z=`tracking-normal xxs:text-display-2-xxs${q?``:` md:text-display-2-md md:leading-display-2-md`} font-display-2 font-weight-display-2 xxs:leading-display-2-xxs`;break;case`display-wide`:Z=`tracking-normal xxs:text-display-wide-xxs${q?``:` md:text-display-wide-md md:leading-display-wide-md`} font-display-wide font-weight-display-wide xxs:leading-display-wide-xxs`;break;case`heading-1`:Z=`tracking-normal xxs:text-heading-1-xxs${q?``:` md:text-heading-1-md md:leading-heading-1-md`} font-heading-1 font-weight-heading-1 xxs:leading-heading-1-xxs`;break;case`heading-2`:Z=`tracking-normal xxs:text-heading-2-xxs${q?``:` md:text-heading-2-md md:leading-heading-2-md`} font-heading-2 font-weight-heading-2 xxs:leading-heading-2-xxs`;break;case`heading-3`:Z=`tracking-normal text-heading-3 font-heading-3 font-weight-heading-3 leading-heading-3`;break;case`heading-3-link`:Z=`tracking-normal text-heading-3 font-heading-3 font-weight-heading-3 leading-heading-3 underline`;break;case`heading-4`:Z=`tracking-normal text-heading-4 font-heading-4 font-weight-heading-4 leading-heading-4`;break;case`heading-4-link`:Z=`tracking-normal text-heading-4 font-heading-4 font-weight-heading-4 leading-heading-4 underline`;break;default:Z=X===`a`&&At?`tracking-normal text-body-1 font-body-1 font-weight-body-1-link leading-body-1 underline`:`tracking-normal text-body-1 font-body-1 font-weight-body-1 leading-body-1`;break}let Q={margin:0};if(W&&(Q.boxSizing=`border-box`,Q.color=i),G)switch(Y){case`body-1-bold`:W&&(Q.fontFamily=o),Q.fontSize=ae,Q.lineHeight=ce,Q.fontWeight=oe,Q.letterSpacing=se;break;case`body-1-link`:W&&(Q.fontFamily=s),Q.fontSize=c,Q.lineHeight=d,Q.fontWeight=l,Q.letterSpacing=u,Q.textDecoration=f;break;case`body-1-median`:W&&(Q.fontFamily=p),Q.fontSize=m,Q.lineHeight=_,Q.fontWeight=h,Q.letterSpacing=g;break;case`body-2`:W&&(Q.fontFamily=C,Q.fontWeight=T),Q.fontSize=w,Q.lineHeight=D,Q.letterSpacing=E;break;case`body-2-bold`:W&&(Q.fontFamily=v),Q.fontSize=y,Q.lineHeight=S,Q.fontWeight=b,Q.letterSpacing=x;break;case`body-2-link`:W&&(Q.fontFamily=O),Q.fontSize=k,Q.lineHeight=M,Q.fontWeight=A,Q.letterSpacing=j,Q.textDecoration=N;break;case`body-2-median`:W&&(Q.fontFamily=P),Q.fontSize=F,Q.lineHeight=R,Q.fontWeight=I,Q.letterSpacing=L;break;case`caption-bold`:W&&(Q.fontFamily=z),Q.fontSize=B,Q.lineHeight=ge,Q.fontWeight=me,Q.letterSpacing=he;break;case`caption-link`:W&&(Q.fontFamily=_e),Q.fontSize=ve,Q.lineHeight=xe,Q.fontWeight=ye,Q.letterSpacing=be,Q.textDecoration=Se;break;case`caption-median`:W&&(Q.fontFamily=Ce),Q.fontSize=we,Q.lineHeight=De,Q.fontWeight=Te,Q.letterSpacing=Ee;break;case`display-1`:W&&(Q.fontFamily=Oe),Q.fontSize=q?Ae:ke,Q.lineHeight=q?Pe:Ne,Q.fontWeight=je,Q.letterSpacing=Me;break;case`display-2`:W&&(Q.fontFamily=V),Q.fontSize=q?Ie:Fe,Q.lineHeight=q?Be:ze,Q.fontWeight=Le,Q.letterSpacing=Re;break;case`display-wide`:W&&(Q.fontFamily=Ve),Q.fontSize=q?Ue:He,Q.lineHeight=q?qe:Ke,Q.fontWeight=We,Q.letterSpacing=Ge;break;case`heading-1`:W&&(Q.fontFamily=Je),Q.fontSize=q?Xe:Ye,Q.lineHeight=q?et:$e,Q.fontWeight=Ze,Q.letterSpacing=Qe;break;case`heading-2`:W&&(Q.fontFamily=tt),Q.fontSize=q?rt:nt,Q.lineHeight=q?st:ot,Q.fontWeight=it,Q.letterSpacing=at;break;case`heading-3`:W&&(Q.fontFamily=ct),Q.fontSize=lt,Q.lineHeight=ft,Q.fontWeight=ut,Q.letterSpacing=dt;break;case`heading-3-link`:W&&(Q.fontFamily=pt),Q.fontSize=mt,Q.lineHeight=_t,Q.fontWeight=ht,Q.letterSpacing=gt;break;case`heading-4`:W&&(Q.fontFamily=vt),Q.fontSize=yt,Q.lineHeight=St,Q.fontWeight=bt,Q.letterSpacing=xt;break;case`heading-4-link`:W&&(Q.fontFamily=Ct),Q.fontSize=wt,Q.lineHeight=Dt,Q.fontWeight=Tt,Q.letterSpacing=Et;break;default:X===`a`?(W&&(Q.fontFamily=s),Q.fontSize=c,Q.lineHeight=d,Q.fontWeight=l,Q.letterSpacing=u,Q.textDecoration=f):(W&&(Q.fontFamily=le,Q.fontWeight=de),Q.fontSize=ue,Q.lineHeight=pe,Q.letterSpacing=fe);break}let $={};return X===`a`?Q.color=i:Ot.has(X)&&($.fontFamily=`monospace, monospace`,X===`code`&&($.color=ie,$.fontWeight=a)),ne(X,{className:ee(`${e}-${t}`,`${e}-${t}__${X}`,`${e}-${t}--${Y}`,!G&&Z,J.className),style:G?{...$,...Q,...J.style}:{...$,...J.style},...re([`className`,`style`],J),...X===`a`&&!r(J.href)&&H?{clicktracking:`off`}:{},ref:kt},n)});H.displayName=`Typography`;export{H as Typography,H as default}; //# sourceMappingURL=Typography.js.map