New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@lmc-eu/spirit-design-tokens

Package Overview
Dependencies
Maintainers
0
Versions
64
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@lmc-eu/spirit-design-tokens - npm Package Compare versions

Comparing version 3.0.0-alpha.0 to 3.0.0-alpha.1

scss/@tokens.scss
scss/global-tokens/_borders.scss
scss/global-tokens/_gradients.scss
scss/global-tokens/_other.scss
scss/global-tokens/_radii.scss
scss/global-tokens/_shadows.scss
scss/global-tokens/_spacing.scss
scss/global-tokens/_typography.scss
scss/global-tokens/index.scss
scss/README.md
scss/themes/_color-tokens.scss
scss/themes/index.scss
types/global/borders.d.ts
types/global/gradients.d.ts
types/global/index.d.ts
types/global/other.d.ts
types/global/radii.d.ts
types/global/shadows.d.ts
types/global/spacing.d.ts
types/global/typography.d.ts
types/themes/index.d.ts
types/themes/theme-light-default/colors.d.ts
types/themes/theme-light-default/index.d.ts
types/themes/theme-light-on-brand/colors.d.ts
types/themes/theme-light-on-brand/index.d.ts

10

CHANGELOG.md

@@ -6,2 +6,12 @@ # Change Log

<a name="3.0.0-alpha.1"></a>
# [3.0.0-alpha.1](https://github.com/lmc-eu/spirit-design-system/compare/@lmc-eu/spirit-design-tokens@3.0.0-alpha.0...@lmc-eu/spirit-design-tokens@3.0.0-alpha.1) (2024-11-06)
### Chores
- **design-tokens:** Force Publish
**Note:** Version bump only for package @lmc-eu/spirit-design-tokens
<a name="3.0.0-alpha.0"></a>

@@ -8,0 +18,0 @@

2

cjs/index.js

@@ -1,1 +0,1 @@

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a="none",r="solid",c="dashed",e={0:a,100:r,200:c},s=0,d="1px",l="2px",t={0:s,100:d,200:l},Ao={borderStyle:e,borderWidth:t,style:e,width:t},f="#d4d4d4",m="#e9e9e9",b="#c4c4c4",y="#dbdbdb",g={active:f,default:m,disabled:b,hover:y},v="#d4d4d4",u="#e9e9e9",S="#c4c4c4",h="#dbdbdb",x="#a7bcc2",o={active:v,default:u,disabled:S,hover:h,visited:x},I="#0b3a46",k="#29616f",p="#979797",D="#1b5260",H="#835ea1",n={active:I,default:k,disabled:p,hover:D,visited:H},T="#454b4e",L="#758185",W="#979797",P="#5b6568",z="#835ea1",i={active:T,default:L,disabled:W,hover:P,visited:z},Bo={primary:n,secondary:i,inverted:o},F="#0b3a46",A="#29616f",B="#f5f5f5",X="#1b5260",M={active:F,default:A,disabled:B,hover:X},w="#c4c4c4",C="#a0a0a0",R="#f5f5f5",U="#737373",G={active:w,default:C,disabled:R,hover:U},V="#0b3a46",O="#29616f",j="#a6a6a6",q="#1b5260",E={active:V,default:O,disabled:j,hover:q},J="#d4d4d4",K="#e9e9e9",N="#f5f5f5",Q="#dbdbdb",Y={active:J,default:K,disabled:N,hover:Q},Z="#091417",_="#132930",$="#a6a6a6",ee="#0b1c21",te={active:Z,default:_,disabled:$,hover:ee},oe={inverted:g,link:{inverted:o,primary:n,secondary:i},primary:M,secondary:G,selected:E,tertiary:Y,unselected:te},ne="#0b1c2199",ie="#fff",ae="#f0f0f0",re={backdrop:ne,basic:ie,cover:ae},ce="#a4a4a44d",se="#fff0",de="#b0b0b033",le={active:ce,default:se,hover:de},fe="#9f9f9fcc",me="#fff0",be="#bbb6",ye={active:fe,default:me,hover:be},ge="#132930",ve={...re,interactive:{...le,inverted:ye},inverted:ge},ue="#b1b1b1",Se="#d8d8d8",he="#dfdfe0",xe="#c5c5c5",Ie="#29616f",ke={active:ue,default:Se,disabled:he,hover:xe,selected:Ie},pe="#e9e9e9",De={primary:ke,secondary:{default:pe}},He="#0b1c21",Te="#30588c",Le={primary:He,secondary:Te},We="#6f2535",Pe="#fbeef1",ze="#ba3e5a",Fe="#f5f5f5",Ae="#953248",Be={active:We,background:Pe,default:ze,disabled:Fe,hover:Ae},Xe="#26456e",Me="#e8eff7",we="#3b6bab",Ce="#f5f5f5",Re="#30588c",Ue={active:Xe,background:Me,default:we,disabled:Ce,hover:Re},Ge="#33420a",Ve="#f6fbe9",Oe="#607c13",je="#f5f5f5",qe="#485d0e",Ee={active:Ge,background:Ve,default:Oe,disabled:je,hover:qe},Je="#423400",Ke="#f8f2e4",Ne="#a98300",Qe="#f5f5f5",Ye="#755b00",Ze={active:Je,background:Ke,default:Ne,disabled:Qe,hover:Ye},_e={danger:Be,informative:Ue,success:Ee,warning:Ze},$e="#4666ae",et="#132930",tt="#a6a6a6",ot={default:et,disabled:tt},nt="#fff",it="#a6a6a6",at={default:nt,disabled:it},rt="#5c747b",ct="#a6a6a6",st={default:rt,disabled:ct},dt="#e9e9e9",lt="#737373",ft={default:dt,disabled:lt},mt={primary:ot,secondary:st,inverted:{primary:at,secondary:ft}},Xo={action:oe,background:ve,border:De,brand:Le,emotion:_e,focus:{default:$e},text:mt},bt="linear-gradient(var(--gradient-angle, 90deg), #fff 0%, #fff0 100%)",Mo={backgroundBasicOverlay:bt},yt=0,gt="1px",vt="2px",ut="4px",St="8px",ht="12px",xt="16px",It="24px",kt="32px",pt="40px",Dt="48px",Ht="64px",Tt="80px",Lt={0:yt,100:gt,200:vt,300:ut,400:St,500:ht,600:xt,700:It,800:kt,900:pt,1e3:Dt,1100:Ht,1200:Tt},wo={space:Lt},Wt="1280px",Pt=12,zt=0,Ft="16px",At="16px",Bt="768px",Xt="32px",Mt="32px",wt="1280px",Ct="32px",Rt="32px",Co={maxWidth:Wt},Ro={columns:Pt},Ut={mobile:zt,tablet:Bt,desktop:wt},Gt={mobile:Ft,tablet:Xt,desktop:Ct},Vt={mobile:At,tablet:Mt,desktop:Rt},Uo={breakpoints:Ut,containerPaddings:Gt,gridGutters:Vt},Ot=0,jt="4px",qt="8px",Et="12px",Jt={0:Ot,100:jt,200:qt,300:Et},Go={radius:Jt},Kt="0 0 0 2px #d2c2ff99",Nt="0 2px 8px 0 #00000026",Qt="0 4px 12px 0 #0003",Yt="0 8px 24px 0 #00000040",Zt="0 12px 32px 0 #00000040",_t={100:Nt,200:Qt,300:Yt,400:Zt},Vo={focus:Kt,shadow:_t},$t={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.125rem",fontStyle:"normal",fontWeight:600,lineHeight:1.55}},eo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.125rem",fontStyle:"italic",fontWeight:400,lineHeight:1.55}},to={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.125rem",fontStyle:"normal",fontWeight:400,lineHeight:1.55}},oo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.125rem",fontStyle:"normal",fontWeight:500,lineHeight:1.55}},no={bold:$t,italic:eo,regular:to,semibold:oo},io={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1rem",fontStyle:"normal",fontWeight:600,lineHeight:1.5}},ao={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1rem",fontStyle:"italic",fontWeight:400,lineHeight:1.5}},ro={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1rem",fontStyle:"normal",fontWeight:400,lineHeight:1.5}},co={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1rem",fontStyle:"normal",fontWeight:500,lineHeight:1.5}},so={bold:io,italic:ao,regular:ro,semibold:co},lo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.875rem",fontStyle:"normal",fontWeight:600,lineHeight:1.42}},fo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.875rem",fontStyle:"italic",fontWeight:400,lineHeight:1.42}},mo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.875rem",fontStyle:"normal",fontWeight:400,lineHeight:1.42}},bo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.875rem",fontStyle:"normal",fontWeight:500,lineHeight:1.42}},yo={bold:lo,italic:fo,regular:mo,semibold:bo},go={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"normal",fontWeight:700,lineHeight:1.6}},vo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"italic",fontWeight:400,lineHeight:1.6}},uo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"normal",fontWeight:400,lineHeight:1.6}},So={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"normal",fontWeight:500,lineHeight:1.6}},ho={bold:go,italic:vo,regular:uo,semibold:So},xo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.75rem",fontStyle:"normal",fontWeight:600,lineHeight:1.32}},Io={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.75rem",fontStyle:"italic",fontWeight:400,lineHeight:1.32}},ko={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.75rem",fontStyle:"normal",fontWeight:400,lineHeight:1.32}},po={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"0.75rem",fontStyle:"normal",fontWeight:500,lineHeight:1.32}},Do={bold:xo,italic:Io,regular:ko,semibold:po},Ho={large:no,medium:so,small:yo,xlarge:ho,xsmall:Do},To={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"2rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"3rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},desktop:{fontFamily:"'Inter', sans-serif",fontSize:"3rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},Lo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"2rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},desktop:{fontFamily:"'Inter', sans-serif",fontSize:"2rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},Wo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1.125rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"1.5rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},desktop:{fontFamily:"'Inter', sans-serif",fontSize:"1.5rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},Po={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"3rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"4rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},desktop:{fontFamily:"'Inter', sans-serif",fontSize:"4rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},zo={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"1rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2},desktop:{fontFamily:"'Inter', sans-serif",fontSize:"1.25rem",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},Fo={large:To,medium:Lo,small:Wo,xlarge:Po,xsmall:zo},Oo={body:Ho,heading:Fo};exports.action=oe;exports.actionInverted=g;exports.actionInvertedActive=f;exports.actionInvertedDefault=m;exports.actionInvertedDisabled=b;exports.actionInvertedHover=y;exports.actionLink=Bo;exports.actionLinkInverted=o;exports.actionLinkInvertedActive=v;exports.actionLinkInvertedDefault=u;exports.actionLinkInvertedDisabled=S;exports.actionLinkInvertedHover=h;exports.actionLinkInvertedVisited=x;exports.actionLinkPrimary=n;exports.actionLinkPrimaryActive=I;exports.actionLinkPrimaryDefault=k;exports.actionLinkPrimaryDisabled=p;exports.actionLinkPrimaryHover=D;exports.actionLinkPrimaryVisited=H;exports.actionLinkSecondary=i;exports.actionLinkSecondaryActive=T;exports.actionLinkSecondaryDefault=L;exports.actionLinkSecondaryDisabled=W;exports.actionLinkSecondaryHover=P;exports.actionLinkSecondaryVisited=z;exports.actionPrimary=M;exports.actionPrimaryActive=F;exports.actionPrimaryDefault=A;exports.actionPrimaryDisabled=B;exports.actionPrimaryHover=X;exports.actionSecondary=G;exports.actionSecondaryActive=w;exports.actionSecondaryDefault=C;exports.actionSecondaryDisabled=R;exports.actionSecondaryHover=U;exports.actionSelected=E;exports.actionSelectedActive=V;exports.actionSelectedDefault=O;exports.actionSelectedDisabled=j;exports.actionSelectedHover=q;exports.actionTertiary=Y;exports.actionTertiaryActive=J;exports.actionTertiaryDefault=K;exports.actionTertiaryDisabled=N;exports.actionTertiaryHover=Q;exports.actionUnselected=te;exports.actionUnselectedActive=Z;exports.actionUnselectedDefault=_;exports.actionUnselectedDisabled=$;exports.actionUnselectedHover=ee;exports.background=ve;exports.backgroundColor=re;exports.backgroundColorBackdrop=ne;exports.backgroundColorBasic=ie;exports.backgroundColorCover=ae;exports.backgroundInteractive=le;exports.backgroundInteractiveActive=ce;exports.backgroundInteractiveDefault=se;exports.backgroundInteractiveHover=de;exports.backgroundInteractiveInverted=ye;exports.backgroundInteractiveInvertedActive=fe;exports.backgroundInteractiveInvertedDefault=me;exports.backgroundInteractiveInvertedHover=be;exports.backgroundInverted=ge;exports.body=Ho;exports.bodyLarge=no;exports.bodyLargeTextBold=$t;exports.bodyLargeTextItalic=eo;exports.bodyLargeTextRegular=to;exports.bodyLargeTextSemibold=oo;exports.bodyMedium=so;exports.bodyMediumTextBold=io;exports.bodyMediumTextItalic=ao;exports.bodyMediumTextRegular=ro;exports.bodyMediumTextSemibold=co;exports.bodySmall=yo;exports.bodySmallTextBold=lo;exports.bodySmallTextItalic=fo;exports.bodySmallTextRegular=mo;exports.bodySmallTextSemibold=bo;exports.bodyXLarge=ho;exports.bodyXLargeTextBold=go;exports.bodyXLargeTextItalic=vo;exports.bodyXLargeTextRegular=uo;exports.bodyXLargeTextSemibold=So;exports.bodyXSmall=Do;exports.bodyXSmallTextBold=xo;exports.bodyXSmallTextItalic=Io;exports.bodyXSmallTextRegular=ko;exports.bodyXSmallTextSemibold=po;exports.border=De;exports.borderPrimary=ke;exports.borderPrimaryActive=ue;exports.borderPrimaryDefault=Se;exports.borderPrimaryDisabled=he;exports.borderPrimaryHover=xe;exports.borderPrimarySelected=Ie;exports.borderSecondaryDefault=pe;exports.borderStyle=e;exports.borderStyle0=a;exports.borderStyle100=r;exports.borderStyle200=c;exports.borderWidth=t;exports.borderWidth0=s;exports.borderWidth100=d;exports.borderWidth200=l;exports.borders=Ao;exports.brand=Le;exports.brandPrimary=He;exports.brandSecondary=Te;exports.breakpointDesktop=wt;exports.breakpointMobile=zt;exports.breakpointTablet=Bt;exports.breakpoints=Ut;exports.colors=Xo;exports.containerMaxWidth=Wt;exports.containerPaddingDesktop=Ct;exports.containerPaddingMobile=Ft;exports.containerPaddingTablet=Xt;exports.containerPaddings=Gt;exports.containers=Co;exports.emotion=_e;exports.emotionDanger=Be;exports.emotionDangerActive=We;exports.emotionDangerBackground=Pe;exports.emotionDangerDefault=ze;exports.emotionDangerDisabled=Fe;exports.emotionDangerHover=Ae;exports.emotionInformative=Ue;exports.emotionInformativeActive=Xe;exports.emotionInformativeBackground=Me;exports.emotionInformativeDefault=we;exports.emotionInformativeDisabled=Ce;exports.emotionInformativeHover=Re;exports.emotionSuccess=Ee;exports.emotionSuccessActive=Ge;exports.emotionSuccessBackground=Ve;exports.emotionSuccessDefault=Oe;exports.emotionSuccessDisabled=je;exports.emotionSuccessHover=qe;exports.emotionWarning=Ze;exports.emotionWarningActive=Je;exports.emotionWarningBackground=Ke;exports.emotionWarningDefault=Ne;exports.emotionWarningDisabled=Qe;exports.emotionWarningHover=Ye;exports.focus=Kt;exports.focusDefault=$e;exports.gradientBackgroundBasicOverlay=bt;exports.gradients=Mo;exports.gridColumns=Pt;exports.gridGutterDesktop=Rt;exports.gridGutterMobile=At;exports.gridGutterTablet=Mt;exports.gridGutters=Vt;exports.grids=Ro;exports.heading=Fo;exports.headingLargeText=To;exports.headingMediumText=Lo;exports.headingSmallText=Wo;exports.headingXLargeText=Po;exports.headingXSmallText=zo;exports.others=Uo;exports.radii=Go;exports.radius=Jt;exports.radius0=Ot;exports.radius100=jt;exports.radius200=qt;exports.radius300=Et;exports.shadow=_t;exports.shadow100=Nt;exports.shadow200=Qt;exports.shadow300=Yt;exports.shadow400=Zt;exports.shadows=Vo;exports.space=Lt;exports.space0=yt;exports.space100=gt;exports.space1000=Dt;exports.space1100=Ht;exports.space1200=Tt;exports.space200=vt;exports.space300=ut;exports.space400=St;exports.space500=ht;exports.space600=xt;exports.space700=It;exports.space800=kt;exports.space900=pt;exports.spaces=wo;exports.styles=Oo;exports.text=mt;exports.textPrimary=ot;exports.textPrimaryDefault=et;exports.textPrimaryDisabled=tt;exports.textPrimaryInverted=at;exports.textPrimaryInvertedDefault=nt;exports.textPrimaryInvertedDisabled=it;exports.textSecondary=st;exports.textSecondaryDefault=rt;exports.textSecondaryDisabled=ct;exports.textSecondaryInverted=ft;exports.textSecondaryInvertedDefault=dt;exports.textSecondaryInvertedDisabled=lt;
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ct=0,It="1px",xt="2px",t="linear-gradient(var(--gradient-angle, 90deg), var(--spirit-color-gradient-basic-overlay-color-01, #fff) 0%, var(--spirit-color-gradient-basic-overlay-color-02, #fff0) 100%)",Ft={basicOverlay:t},e="16px",n="32px",o="32px",l="1280px",a=0,c="768px",i="1280px",f="16px",s="32px",r="32px",d="12",wt="spirit-",Wt={padding:{mobile:e,tablet:n,desktop:o},maxWidth:l},Pt={mobile:a,tablet:c,desktop:i},At={spacing:{mobile:f,desktop:s,tablet:r},columns:d},g=0,u="2px",h="4px",b="8px",S="12px",m="16px",B="9999px",Rt={0:g,100:u,200:h,300:b,400:S,500:m,full:B},_="0 0 0 2px var(--spirit-color-focus-focus-ring-color-01, #d2c2ffb2)",p="0 2px 8px 0 var(--spirit-color-shadow-shadow-100-color-01, #00000026)",$="0 4px 12px 0 var(--spirit-color-shadow-shadow-200-color-01, #0003)",y="0 8px 24px 0 var(--spirit-color-shadow-shadow-300-color-01, #00000040)",D="0 12px 32px 0 var(--spirit-color-shadow-shadow-400-color-01, #00000040)",zt={focusRing:_},Gt={100:p,200:$,300:y,400:D},O=0,v="1px",H="2px",k="4px",C="6px",I="8px",x="12px",F="16px",w="20px",W="24px",P="32px",A="40px",R="48px",z="56px",G="64px",Y="72px",T="80px",X="96px",Yt={0:O,100:v,200:H,300:k,400:C,500:I,600:x,700:F,800:w,900:W,1e3:P,1100:A,1200:R,1300:z,1400:G,1500:Y,1600:T,1700:X},L={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:400,lineHeight:1.2}},M={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:600,lineHeight:1.2}},U={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},V={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"64px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"italic",fontWeight:400,lineHeight:1.2}},j={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:400,lineHeight:1.2}},q={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:600,lineHeight:1.2}},E={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},J={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"48px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"italic",fontWeight:400,lineHeight:1.2}},K={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:400,lineHeight:1.2}},N={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:600,lineHeight:1.2}},Q={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},Z={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"32px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"italic",fontWeight:400,lineHeight:1.2}},tt={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"normal",fontWeight:400,lineHeight:1.2}},et={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"normal",fontWeight:600,lineHeight:1.2}},nt={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},ot={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"24px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"italic",fontWeight:400,lineHeight:1.2}},lt={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"normal",fontWeight:400,lineHeight:1.2}},at={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:600,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"normal",fontWeight:600,lineHeight:1.2}},ct={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:700,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"normal",fontWeight:700,lineHeight:1.2}},it={desktop:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},tablet:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"italic",fontWeight:400,lineHeight:1.2},mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"italic",fontWeight:400,lineHeight:1.2}},ft={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:400,lineHeight:1.6}},st={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:600,lineHeight:1.6}},rt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"normal",fontWeight:700,lineHeight:1.6}},dt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"20px",fontStyle:"italic",fontWeight:400,lineHeight:1.6}},gt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"normal",fontWeight:400,lineHeight:1.55}},ut={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"normal",fontWeight:600,lineHeight:1.55}},ht={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"normal",fontWeight:700,lineHeight:1.55}},bt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"18px",fontStyle:"italic",fontWeight:400,lineHeight:1.55}},St={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"normal",fontWeight:400,lineHeight:1.5}},mt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"normal",fontWeight:600,lineHeight:1.5}},Bt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"normal",fontWeight:700,lineHeight:1.5}},_t={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"16px",fontStyle:"italic",fontWeight:400,lineHeight:1.5}},pt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"14px",fontStyle:"normal",fontWeight:400,lineHeight:1.42}},$t={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"14px",fontStyle:"normal",fontWeight:600,lineHeight:1.42}},yt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"14px",fontStyle:"normal",fontWeight:700,lineHeight:1.42}},Dt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"14px",fontStyle:"italic",fontWeight:400,lineHeight:1.42}},Ot={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"12px",fontStyle:"normal",fontWeight:400,lineHeight:1.32}},vt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"12px",fontStyle:"normal",fontWeight:600,lineHeight:1.32}},Ht={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"12px",fontStyle:"normal",fontWeight:700,lineHeight:1.32}},kt={mobile:{fontFamily:"'Inter', sans-serif",fontSize:"12px",fontStyle:"italic",fontWeight:400,lineHeight:1.32}},Tt={headingXlargeRegular:L,headingXlargeSemibold:M,headingXlargeBold:U,headingXlargeItalic:V,headingLargeRegular:j,headingLargeSemibold:q,headingLargeBold:E,headingLargeItalic:J,headingMediumRegular:K,headingMediumSemibold:N,headingMediumBold:Q,headingMediumItalic:Z,headingSmallRegular:tt,headingSmallSemibold:et,headingSmallBold:nt,headingSmallItalic:ot,headingXsmallRegular:lt,headingXsmallSemibold:at,headingXsmallBold:ct,headingXsmallItalic:it,bodyXlargeRegular:ft,bodyXlargeSemibold:st,bodyXlargeBold:rt,bodyXlargeItalic:dt,bodyLargeRegular:gt,bodyLargeSemibold:ut,bodyLargeBold:ht,bodyLargeItalic:bt,bodyMediumRegular:St,bodyMediumSemibold:mt,bodyMediumBold:Bt,bodyMediumItalic:_t,bodySmallRegular:pt,bodySmallSemibold:$t,bodySmallBold:yt,bodySmallItalic:Dt,bodyXsmallRegular:Ot,bodyXsmallSemibold:vt,bodyXsmallBold:Ht,bodyXsmallItalic:kt},Xt="#1a1b1b80",Lt="#f1edff",Mt="#fff0",Ut="#f8f6ff",Vt="#fff",jt="#f2f2f2",qt="#f1edff",Et="#d9d9d9",Jt="#7847ff",Kt="#a5a5a5",Nt="#bfbfbf",Qt="#b2b2b2",Zt="#7847ff",te="#fff0",ee="#6039cc",ne="#e4daff",oe="#fff0",le="#f1edff",ae="#4e2ea6",ce="#fff",ie="#6039cc",fe="#7847ff",se="#6c40e5",re="#7847ff",de="#6039cc",ge="#e4daff",ue="#fff",he="#f1edff",be="#e5e5e5",Se="#202020",me="#d9d9d9",Be="#f2f2f2",_e="#e5e5e5",pe="#fff",$e="#f1edff",ye="#fff0",De="#f8f6ff",Oe="#fff0",ve="#4e2ea6",He="#404040",ke="#6039cc",Ce="#6039cc",Ie="#ffbe00",xe="#e4daff",Fe="#327c3f",we="#fff",We="#3e9b4f",Pe="#327c3f",Ae="#388b47",Re="#a5a5a5",ze="#404040",Ge="#f2f2f2",Ye="#fff",Te="#f9f9f9",Xe="#f9f9f9",Le="#e5e5e5",Me="#a5a5a5",Ue="#d9d9d9",Ve="#b60000",je="#fef2f2",qe="#b60000",Ee="#f18080",Je="#940000",Ke="#fff",Ne="#e40000",Qe="#b60000",Ze="#cd0000",tn="#0052ad",en="#f2f7fd",nn="#0052ad",on="#80b2eb",ln="#00428c",an="#fff",cn="#0066d8",fn="#0052ad",sn="#005cc2",rn="#327c3f",dn="#f5faf6",gn="#327c3f",un="#9ecda7",hn="#286533",bn="#fff",Sn="#3e9b4f",mn="#327c3f",Bn="#388b47",_n="#c26400",pn="#fef8f2",$n="#c26400",yn="#f9be80",Dn="#9d5100",On="#fff",vn="#f27d00",Hn="#c26400",kn="#da7100",Cn="#d2c2ffb2",In="#b60000",xn="#fff",Fn="#fff",wn="#f9f9f9",Wn="#7f7f7f",Pn="#a5a5a5",An="#999",Rn="#7847ff",zn="#202020",Gn="#666",Yn="#7f7f7f",Tn="#202020",Xn="#327c3f",Ln="#c26400",Mn="#fff0",Un="#1a1b1b73",Vn="#ffffff73",jn="#000",qn="#f2f7fd",En="#0066d8",Jn="#005cc2",Kn="#0052ad",Nn="#00428c",Qn="#00336c",Zn="#001a36",t0="#e5f0fb",e0="#cce0f7",n0="#b2d1f3",o0="#99c2ef",l0="#80b2eb",a0="#66a3e8",c0="#4d94e4",i0="#3385e0",f0="#f9f9f9",s0="#7f7f7f",r0="#727272",d0="#666",g0="#535353",u0="#404040",h0="#202020",b0="#f2f2f2",S0="#e5e5e5",m0="#d9d9d9",B0="#ccc",_0="#bfbfbf",p0="#b2b2b2",$0="#a5a5a5",y0="#999",D0="#f5faf6",O0="#3e9b4f",v0="#388b47",H0="#327c3f",k0="#286533",C0="#1f4e28",I0="#102714",x0="#ecf5ed",F0="#d8ebdc",w0="#c5e1ca",W0="#b2d7b9",P0="#9ecda7",A0="#8bc395",R0="#78b984",z0="#65af72",G0="#fef8f2",Y0="#f27d00",T0="#da7100",X0="#c26400",L0="#9d5100",M0="#793f00",U0="#3d1f00",V0="#fef2e5",j0="#fce5cc",q0="#fbd8b2",E0="#facb99",J0="#f9be80",K0="#f7b166",N0="#f6a44d",Q0="#f59733",Z0="#f8f6ff",to="#7847ff",eo="#6c40e5",no="#6039cc",oo="#4e2ea6",lo="#3c2480",ao="#1e1240",co="#f1edff",io="#e4daff",fo="#d6c8ff",so="#c9b5ff",ro="#bba3ff",go="#ae91ff",uo="#a07eff",ho="#936cff",bo="#fef2f2",So="#e40000",mo="#cd0000",Bo="#b60000",_o="#940000",po="#720000",$o="#390000",yo="#fce5e5",Do="#facccc",Oo="#f7b2b2",vo="#f49999",Ho="#f18080",ko="#ef6666",Co="#ec4d4d",Io="#e93333",xo="#fff",Fo="#fffcf2",wo="#ffbe00",Wo="#e5ab00",Po="#cc9800",Ao="#a67c00",Ro="#805f00",zo="#403000",Go="#fff8e5",Yo="#fff2cc",To="#ffebb2",Xo="#ffe599",Lo="#ffdf80",Mo="#ffd866",Uo="#ffd24d",Vo="#ffcb33",jo="#1a1b1b73",qo="#ffffff73",Eo="#000",Jo="#f2f7fd",Ko="#0066d8",No="#005cc2",Qo="#0052ad",Zo="#00428c",tl="#00336c",el="#001a36",nl="#e5f0fb",ol="#cce0f7",ll="#b2d1f3",al="#99c2ef",cl="#80b2eb",il="#66a3e8",fl="#4d94e4",sl="#3385e0",rl="#f9f9f9",dl="#7f7f7f",gl="#727272",ul="#666",hl="#535353",bl="#404040",Sl="#202020",ml="#f2f2f2",Bl="#e5e5e5",_l="#d9d9d9",pl="#ccc",$l="#bfbfbf",yl="#b2b2b2",Dl="#a5a5a5",Ol="#999",vl="#f5faf6",Hl="#3e9b4f",kl="#388b47",Cl="#327c3f",Il="#286533",xl="#1f4e28",Fl="#102714",wl="#ecf5ed",Wl="#d8ebdc",Pl="#c5e1ca",Al="#b2d7b9",Rl="#9ecda7",zl="#8bc395",Gl="#78b984",Yl="#65af72",Tl="#fef8f2",Xl="#f27d00",Ll="#da7100",Ml="#c26400",Ul="#9d5100",Vl="#793f00",jl="#3d1f00",ql="#fef2e5",El="#fce5cc",Jl="#fbd8b2",Kl="#facb99",Nl="#f9be80",Ql="#f7b166",Zl="#f6a44d",ta="#f59733",ea="#f8f6ff",na="#7847ff",oa="#6c40e5",la="#6039cc",aa="#4e2ea6",ca="#3c2480",ia="#1e1240",fa="#f1edff",sa="#e4daff",ra="#d6c8ff",da="#c9b5ff",ga="#bba3ff",ua="#ae91ff",ha="#a07eff",ba="#936cff",Sa="#fef2f2",ma="#e40000",Ba="#cd0000",_a="#b60000",pa="#940000",$a="#720000",ya="#390000",Da="#fce5e5",Oa="#facccc",va="#f7b2b2",Ha="#f49999",ka="#f18080",Ca="#ef6666",Ia="#ec4d4d",xa="#e93333",Fa="#fff",wa="#fffcf2",Wa="#ffbe00",Pa="#e5ab00",Aa="#cc9800",Ra="#a67c00",za="#805f00",Ga="#403000",Ya="#fff8e5",Ta="#fff2cc",Xa="#ffebb2",La="#ffe599",Ma="#ffdf80",Ua="#ffd866",Va="#ffd24d",ja="#ffcb33",qa="#3c2480",Ea="#6039cc",Ja="#4e2ea6",Ka="#3c2480",Na="#535353",Qa="#4e2ea6",Za="#3c2480",tc="#3c2480",ec="#7f7f7f",nc="#4e2ea6",oc="#202020",lc="#f2f2f2",ac="#202020",cc="#bfbfbf",ic="#202020",fc="#fff",sc="#535353",rc="#202020",dc="#404040",gc="#4e2ea6",uc="#fff",hc="#6039cc",bc="#7847ff",Sc="#6c40e5",mc="#00000026",Bc="#0003",_c="#00000040",pc="#00000040",$c="#202020",yc="#535353",Dc="#7f7f7f",Oc={backdrop:Xt,interactive:{stateActive:Lt,stateDefault:Mt,stateHover:Ut},primary:Vt,secondary:jt,tertiary:qt},vc={basic:Et,focus:Jt,interactive:{stateActive:Kt,stateDefault:Nt,stateHover:Qt,stateSelected:Zt}},Hc={button:{plain:{border:te,content:ee,stateActive:ne,stateDefault:oe,stateHover:le},primary:{border:ae,content:ce,stateActive:ie,stateDefault:fe,stateHover:se},secondary:{border:re,content:de,stateActive:ge,stateDefault:ue,stateHover:he},tertiary:{border:be,content:Se,stateActive:me,stateDefault:Be,stateHover:_e}},header:{background:pe,itemBackgroundStateActive:$e,itemBackgroundStateDefault:ye,itemBackgroundStateHover:De,itemBackgroundStateSelected:Oe,itemStateActive:ve,itemStateDefault:He,itemStateHover:ke,itemStateSelected:Ce,stripeStateSelected:Ie,stripeStateUnselected:xe},toggle:{selectedBorder:Fe,selectedContent:we,selectedStateActive:We,selectedStateDefault:Pe,selectedStateHover:Ae,unselectedBorder:Re,unselectedContent:ze,unselectedStateActive:Ge,unselectedStateDefault:Ye,unselectedStateHover:Te}},kc={background:Xe,border:Le,content:Me,foreground:Ue},Cc={danger:{backgroundBasic:Ve,backgroundSubtle:je,borderBasic:qe,borderSubtle:Ee,contentBasic:Je,contentSubtle:Ke,stateActive:Ne,stateDefault:Qe,stateHover:Ze},informative:{backgroundBasic:tn,backgroundSubtle:en,borderBasic:nn,borderSubtle:on,contentBasic:ln,contentSubtle:an,stateActive:cn,stateDefault:fn,stateHover:sn},success:{backgroundBasic:rn,backgroundSubtle:dn,borderBasic:gn,borderSubtle:un,contentBasic:hn,contentSubtle:bn,stateActive:Sn,stateDefault:mn,stateHover:Bn},warning:{backgroundBasic:_n,backgroundSubtle:pn,borderBasic:$n,borderSubtle:yn,contentBasic:Dn,contentSubtle:On,stateActive:vn,stateDefault:Hn,stateHover:kn}},Ic={focusRing:{color01:Cn}},xc={danger:In,filled:{backgroundStateActive:xn,backgroundStateDefault:Fn,backgroundStateHover:wn,borderStateActive:Wn,borderStateDefault:Pn,borderStateHover:An,borderStateSelected:Rn,content:zn,placeholder:Gn},helperText:Yn,label:Tn,success:Xn,warning:Ln},Fc={basicOverlay:{color02:Mn}},wc={alphaDark:{_900:Un},alphaLight:{_900:Vn},black:jn,blue:{_100:qn,_1000:En,_1100:Jn,_1200:Kn,_1300:Nn,_1400:Qn,_1500:Zn,_200:t0,_300:e0,_400:n0,_500:o0,_600:l0,_700:a0,_800:c0,_900:i0},cloudy:{_100:f0,_1000:s0,_1100:r0,_1200:d0,_1300:g0,_1400:u0,_1500:h0,_200:b0,_300:S0,_400:m0,_500:B0,_600:_0,_700:p0,_800:$0,_900:y0},green:{_100:D0,_1000:O0,_1100:v0,_1200:H0,_1300:k0,_1400:C0,_1500:I0,_200:x0,_300:F0,_400:w0,_500:W0,_600:P0,_700:A0,_800:R0,_900:z0},orange:{_100:G0,_1000:Y0,_1100:T0,_1200:X0,_1300:L0,_1400:M0,_1500:U0,_200:V0,_300:j0,_400:q0,_500:E0,_600:J0,_700:K0,_800:N0,_900:Q0},purple:{_100:Z0,_1000:to,_1100:eo,_1200:no,_1300:oo,_1400:lo,_1500:ao,_200:co,_300:io,_400:fo,_500:so,_600:ro,_700:go,_800:uo,_900:ho},red:{_100:bo,_1000:So,_1100:mo,_1200:Bo,_1300:_o,_1400:po,_1500:$o,_200:yo,_300:Do,_400:Oo,_500:vo,_600:Ho,_700:ko,_800:Co,_900:Io},white:xo,yellow:{_100:Fo,_1000:wo,_1100:Wo,_1200:Po,_1300:Ao,_1400:Ro,_1500:zo,_200:Go,_300:Yo,_400:To,_500:Xo,_600:Lo,_700:Mo,_800:Uo,_900:Vo}},Wc={alphaDark:{_900:jo},alphaLight:{_900:qo},black:Eo,blue:{_100:Jo,_1000:Ko,_1100:No,_1200:Qo,_1300:Zo,_1400:tl,_1500:el,_200:nl,_300:ol,_400:ll,_500:al,_600:cl,_700:il,_800:fl,_900:sl},cloudy:{_100:rl,_1000:dl,_1100:gl,_1200:ul,_1300:hl,_1400:bl,_1500:Sl,_200:ml,_300:Bl,_400:_l,_500:pl,_600:$l,_700:yl,_800:Dl,_900:Ol},green:{_100:vl,_1000:Hl,_1100:kl,_1200:Cl,_1300:Il,_1400:xl,_1500:Fl,_200:wl,_300:Wl,_400:Pl,_500:Al,_600:Rl,_700:zl,_800:Gl,_900:Yl},orange:{_100:Tl,_1000:Xl,_1100:Ll,_1200:Ml,_1300:Ul,_1400:Vl,_1500:jl,_200:ql,_300:El,_400:Jl,_500:Kl,_600:Nl,_700:Ql,_800:Zl,_900:ta},purple:{_100:ea,_1000:na,_1100:oa,_1200:la,_1300:aa,_1400:ca,_1500:ia,_200:fa,_300:sa,_400:ra,_500:da,_600:ga,_700:ua,_800:ha,_900:ba},red:{_100:Sa,_1000:ma,_1100:Ba,_1200:_a,_1300:pa,_1400:$a,_1500:ya,_200:Da,_300:Oa,_400:va,_500:Ha,_600:ka,_700:Ca,_800:Ia,_900:xa},white:Fa,yellow:{_100:wa,_1000:Wa,_1100:Pa,_1200:Aa,_1300:Ra,_1400:za,_1500:Ga,_200:Ya,_300:Ta,_400:Xa,_500:La,_600:Ma,_700:Ua,_800:Va,_900:ja}},Pc={primary:{stateActive:qa,stateDefault:Ea,stateHover:Ja},secondary:{stateActive:Ka,stateDefault:Na,stateHover:Qa},stateVisited:Za,tertiary:{stateActive:tc,stateDefault:ec,stateHover:nc}},Ac={backgroundBasic:oc,backgroundSubtle:lc,borderBasic:ac,borderSubtle:cc,contentBasic:ic,contentSubtle:fc,stateActive:sc,stateDefault:rc,stateHover:dc},Rc={contentBasic:gc,contentSubtle:uc,stateActive:hc,stateDefault:bc,stateHover:Sc},zc={shadow100:{color01:mc},shadow200:{color01:Bc},shadow300:{color01:_c},shadow400:{color01:pc}},Gc={primary:$c,secondary:yc,tertiary:Dc},Yc={background:Oc,border:vc,component:Hc,disabled:kc,emotion:Cc,focus:Ic,formField:xc,gradient:Fc,lightDefault:wc,lightOnBrand:Wc,link:Pc,neutral:Ac,selected:Rc,shadow:zc,text:Gc},Tc="#1a1b1b80",Xc="#ffffff1a",Lc="#fff0",Mc="#ffffff0d",Uc="#6039cc",Vc="#3c2480",jc="#1e1240",qc="#a07eff",Ec="#1e1240",Jc="#bba3ff",Kc="#a07eff",Nc="#ae91ff",Qc="#ffbe00",Zc="#fff0",ti="#fff",ei="#ffffff26",ni="#fff0",oi="#ffffff1a",li="#1e1240",ai="#3c2480",ci="#e4daff",ii="#fff",fi="#f1edff",si="#f8f6ff",ri="#fff",di="#1a1b1b26",gi="#1a1b1b00",ui="#1a1b1b1a",hi="#1a1b1b00",bi="#fff",Si="#1a1b1b4d",mi="#1a1b1b33",Bi="#1a1b1b40",_i="#6039cc",pi="#1a1b1b26",$i="#fff0",yi="#1a1b1b1a",Di="#fff0",Oi="#e5e5e5",vi="#fff",Hi="#f2f2f2",ki="#ffbe00",Ci="#fff",Ii="#ffffff40",xi="#a07eff",Fi="#fff",wi="#3e9b4f",Wi="#327c3f",Pi="#388b47",Ai="#a07eff",Ri="#4e2ea6",zi="#e4daff",Gi="#fff",Yi="#f1edff",Ti="#ffffff1a",Xi="#fff3",Li="#ffffff80",Mi="#fff3",Ui="#e40000",Vi="#fce5e5",ji="#e93333",qi="#ef6666",Ei="#720000",Ji="#fff",Ki="#ec4d4d",Ni="#e40000",Qi="#e93333",Zi="#0066d8",tf="#e5f0fb",ef="#3385e0",nf="#66a3e8",of="#00336c",lf="#fff",af="#4d94e4",cf="#0066d8",ff="#3385e0",sf="#3e9b4f",rf="#ecf5ed",df="#65af72",gf="#8bc395",uf="#1f4e28",hf="#fff",bf="#78b984",Sf="#3e9b4f",mf="#65af72",Bf="#f27d00",_f="#fef2e5",pf="#f59733",$f="#f7b166",yf="#793f00",Df="#fff",Of="#f6a44d",vf="#f27d00",Hf="#f59733",kf="#d2c2ffb2",Cf="#ec4d4d",If="#fff",xf="#f9f9f9",Ff="#f1edff",wf="#ae91ff",Wf="#936cff",Pf="#a07eff",Af="#ffbe00",Rf="#202020",zf="#666",Gf="#c9b5ff",Yf="#fff",Tf="#78b984",Xf="#f6a44d",Lf="#60606000",Mf="#1a1b1b73",Uf="#ffffff73",Vf="#000",jf="#f2f7fd",qf="#0066d8",Ef="#005cc2",Jf="#0052ad",Kf="#00428c",Nf="#00336c",Qf="#001a36",Zf="#e5f0fb",ts="#cce0f7",es="#b2d1f3",ns="#99c2ef",os="#80b2eb",ls="#66a3e8",as="#4d94e4",cs="#3385e0",is="#f9f9f9",fs="#7f7f7f",ss="#727272",rs="#666",ds="#535353",gs="#404040",us="#202020",hs="#f2f2f2",bs="#e5e5e5",Ss="#d9d9d9",ms="#ccc",Bs="#bfbfbf",_s="#b2b2b2",ps="#a5a5a5",$s="#999",ys="#f5faf6",Ds="#3e9b4f",Os="#388b47",vs="#327c3f",Hs="#286533",ks="#1f4e28",Cs="#102714",Is="#ecf5ed",xs="#d8ebdc",Fs="#c5e1ca",ws="#b2d7b9",Ws="#9ecda7",Ps="#8bc395",As="#78b984",Rs="#65af72",zs="#fef8f2",Gs="#f27d00",Ys="#da7100",Ts="#c26400",Xs="#9d5100",Ls="#793f00",Ms="#3d1f00",Us="#fef2e5",Vs="#fce5cc",js="#fbd8b2",qs="#facb99",Es="#f9be80",Js="#f7b166",Ks="#f6a44d",Ns="#f59733",Qs="#f8f6ff",Zs="#7847ff",tr="#6c40e5",er="#6039cc",nr="#4e2ea6",or="#3c2480",lr="#1e1240",ar="#f1edff",cr="#e4daff",ir="#d6c8ff",fr="#c9b5ff",sr="#bba3ff",rr="#ae91ff",dr="#a07eff",gr="#936cff",ur="#fef2f2",hr="#e40000",br="#cd0000",Sr="#b60000",mr="#940000",Br="#720000",_r="#390000",pr="#fce5e5",$r="#facccc",yr="#f7b2b2",Dr="#f49999",Or="#f18080",vr="#ef6666",Hr="#ec4d4d",kr="#e93333",Cr="#fff",Ir="#fffcf2",xr="#ffbe00",Fr="#e5ab00",wr="#cc9800",Wr="#a67c00",Pr="#805f00",Ar="#403000",Rr="#fff8e5",zr="#fff2cc",Gr="#ffebb2",Yr="#ffe599",Tr="#ffdf80",Xr="#ffd866",Lr="#ffd24d",Mr="#ffcb33",Ur="#1a1b1b73",Vr="#ffffff73",jr="#000",qr="#f2f7fd",Er="#0066d8",Jr="#005cc2",Kr="#0052ad",Nr="#00428c",Qr="#00336c",Zr="#001a36",td="#e5f0fb",ed="#cce0f7",nd="#b2d1f3",od="#99c2ef",ld="#80b2eb",ad="#66a3e8",cd="#4d94e4",id="#3385e0",fd="#f9f9f9",sd="#7f7f7f",rd="#727272",dd="#666",gd="#535353",ud="#404040",hd="#202020",bd="#f2f2f2",Sd="#e5e5e5",md="#d9d9d9",Bd="#ccc",_d="#bfbfbf",pd="#b2b2b2",$d="#a5a5a5",yd="#999",Dd="#f5faf6",Od="#3e9b4f",vd="#388b47",Hd="#327c3f",kd="#286533",Cd="#1f4e28",Id="#102714",xd="#ecf5ed",Fd="#d8ebdc",wd="#c5e1ca",Wd="#b2d7b9",Pd="#9ecda7",Ad="#8bc395",Rd="#78b984",zd="#65af72",Gd="#fef8f2",Yd="#f27d00",Td="#da7100",Xd="#c26400",Ld="#9d5100",Md="#793f00",Ud="#3d1f00",Vd="#fef2e5",jd="#fce5cc",qd="#fbd8b2",Ed="#facb99",Jd="#f9be80",Kd="#f7b166",Nd="#f6a44d",Qd="#f59733",Zd="#f8f6ff",t1="#7847ff",e1="#6c40e5",n1="#6039cc",o1="#4e2ea6",l1="#3c2480",a1="#1e1240",c1="#f1edff",i1="#e4daff",f1="#d6c8ff",s1="#c9b5ff",r1="#bba3ff",d1="#ae91ff",g1="#a07eff",u1="#936cff",h1="#fef2f2",b1="#e40000",S1="#cd0000",m1="#b60000",B1="#940000",_1="#720000",p1="#390000",$1="#fce5e5",y1="#facccc",D1="#f7b2b2",O1="#f49999",v1="#f18080",H1="#ef6666",k1="#ec4d4d",C1="#e93333",I1="#fff",x1="#fffcf2",F1="#ffbe00",w1="#e5ab00",W1="#cc9800",P1="#a67c00",A1="#805f00",R1="#403000",z1="#fff8e5",G1="#fff2cc",Y1="#ffebb2",T1="#ffe599",X1="#ffdf80",L1="#ffd866",M1="#ffd24d",U1="#ffcb33",V1="#e5e5e5",j1="#fff",q1="#f2f2f2",E1="#e5e5e5",J1="#d6c8ff",K1="#f2f2f2",N1="#ffbe00",Q1="#e5e5e5",Z1="#bba3ff",tg="#f2f2f2",eg="#202020",ng="#f2f2f2",og="#202020",lg="#bfbfbf",ag="#202020",cg="#fff",ig="#535353",fg="#202020",sg="#404040",rg="#fff",dg="#3c2480",gg="#ffd24d",ug="#ffbe00",hg="#ffcb33",bg="#00000026",Sg="#0003",mg="#00000040",Bg="#00000040",_g="#f9f9f9",pg="#d9d9d9",$g="#b2b2b2",yg={backdrop:Tc,interactive:{stateActive:Xc,stateDefault:Lc,stateHover:Mc},primary:Uc,secondary:Vc,tertiary:jc},Dg={basic:qc,focus:Ec,interactive:{stateActive:Jc,stateDefault:Kc,stateHover:Nc,stateSelected:Qc}},Og={button:{plain:{border:Zc,content:ti,stateActive:ei,stateDefault:ni,stateHover:oi},primary:{border:li,content:ai,stateActive:ci,stateDefault:ii,stateHover:fi},secondary:{border:si,content:ri,stateActive:di,stateDefault:gi,stateHover:ui},tertiary:{border:hi,content:bi,stateActive:Si,stateDefault:mi,stateHover:Bi}},header:{background:_i,itemBackgroundStateActive:pi,itemBackgroundStateDefault:$i,itemBackgroundStateHover:yi,itemBackgroundStateSelected:Di,itemStateActive:Oi,itemStateDefault:vi,itemStateHover:Hi,itemStateSelected:ki,stripeStateSelected:Ci,stripeStateUnselected:Ii},toggle:{selectedBorder:xi,selectedContent:Fi,selectedStateActive:wi,selectedStateDefault:Wi,selectedStateHover:Pi,unselectedBorder:Ai,unselectedContent:Ri,unselectedStateActive:zi,unselectedStateDefault:Gi,unselectedStateHover:Yi}},vg={background:Ti,border:Xi,content:Li,foreground:Mi},Hg={danger:{backgroundBasic:Ui,backgroundSubtle:Vi,borderBasic:ji,borderSubtle:qi,contentBasic:Ei,contentSubtle:Ji,stateActive:Ki,stateDefault:Ni,stateHover:Qi},informative:{backgroundBasic:Zi,backgroundSubtle:tf,borderBasic:ef,borderSubtle:nf,contentBasic:of,contentSubtle:lf,stateActive:af,stateDefault:cf,stateHover:ff},success:{backgroundBasic:sf,backgroundSubtle:rf,borderBasic:df,borderSubtle:gf,contentBasic:uf,contentSubtle:hf,stateActive:bf,stateDefault:Sf,stateHover:mf},warning:{backgroundBasic:Bf,backgroundSubtle:_f,borderBasic:pf,borderSubtle:$f,contentBasic:yf,contentSubtle:Df,stateActive:Of,stateDefault:vf,stateHover:Hf}},kg={focusRing:{color01:kf}},Cg={danger:Cf,filled:{backgroundStateActive:If,backgroundStateDefault:xf,backgroundStateHover:Ff,borderStateActive:Wf,borderStateDefault:wf,borderStateHover:Pf,borderStateSelected:Af,content:Rf,placeholder:zf},helperText:Gf,label:Yf,success:Tf,warning:Xf},Ig={basicOverlay:{color02:Lf}},xg={alphaDark:{_900:Mf},alphaLight:{_900:Uf},black:Vf,blue:{_100:jf,_1000:qf,_1100:Ef,_1200:Jf,_1300:Kf,_1400:Nf,_1500:Qf,_200:Zf,_300:ts,_400:es,_500:ns,_600:os,_700:ls,_800:as,_900:cs},cloudy:{_100:is,_1000:fs,_1100:ss,_1200:rs,_1300:ds,_1400:gs,_1500:us,_200:hs,_300:bs,_400:Ss,_500:ms,_600:Bs,_700:_s,_800:ps,_900:$s},green:{_100:ys,_1000:Ds,_1100:Os,_1200:vs,_1300:Hs,_1400:ks,_1500:Cs,_200:Is,_300:xs,_400:Fs,_500:ws,_600:Ws,_700:Ps,_800:As,_900:Rs},orange:{_100:zs,_1000:Gs,_1100:Ys,_1200:Ts,_1300:Xs,_1400:Ls,_1500:Ms,_200:Us,_300:Vs,_400:js,_500:qs,_600:Es,_700:Js,_800:Ks,_900:Ns},purple:{_100:Qs,_1000:Zs,_1100:tr,_1200:er,_1300:nr,_1400:or,_1500:lr,_200:ar,_300:cr,_400:ir,_500:fr,_600:sr,_700:rr,_800:dr,_900:gr},red:{_100:ur,_1000:hr,_1100:br,_1200:Sr,_1300:mr,_1400:Br,_1500:_r,_200:pr,_300:$r,_400:yr,_500:Dr,_600:Or,_700:vr,_800:Hr,_900:kr},white:Cr,yellow:{_100:Ir,_1000:xr,_1100:Fr,_1200:wr,_1300:Wr,_1400:Pr,_1500:Ar,_200:Rr,_300:zr,_400:Gr,_500:Yr,_600:Tr,_700:Xr,_800:Lr,_900:Mr}},Fg={alphaDark:{_900:Ur},alphaLight:{_900:Vr},black:jr,blue:{_100:qr,_1000:Er,_1100:Jr,_1200:Kr,_1300:Nr,_1400:Qr,_1500:Zr,_200:td,_300:ed,_400:nd,_500:od,_600:ld,_700:ad,_800:cd,_900:id},cloudy:{_100:fd,_1000:sd,_1100:rd,_1200:dd,_1300:gd,_1400:ud,_1500:hd,_200:bd,_300:Sd,_400:md,_500:Bd,_600:_d,_700:pd,_800:$d,_900:yd},green:{_100:Dd,_1000:Od,_1100:vd,_1200:Hd,_1300:kd,_1400:Cd,_1500:Id,_200:xd,_300:Fd,_400:wd,_500:Wd,_600:Pd,_700:Ad,_800:Rd,_900:zd},orange:{_100:Gd,_1000:Yd,_1100:Td,_1200:Xd,_1300:Ld,_1400:Md,_1500:Ud,_200:Vd,_300:jd,_400:qd,_500:Ed,_600:Jd,_700:Kd,_800:Nd,_900:Qd},purple:{_100:Zd,_1000:t1,_1100:e1,_1200:n1,_1300:o1,_1400:l1,_1500:a1,_200:c1,_300:i1,_400:f1,_500:s1,_600:r1,_700:d1,_800:g1,_900:u1},red:{_100:h1,_1000:b1,_1100:S1,_1200:m1,_1300:B1,_1400:_1,_1500:p1,_200:$1,_300:y1,_400:D1,_500:O1,_600:v1,_700:H1,_800:k1,_900:C1},white:I1,yellow:{_100:x1,_1000:F1,_1100:w1,_1200:W1,_1300:P1,_1400:A1,_1500:R1,_200:z1,_300:G1,_400:Y1,_500:T1,_600:X1,_700:L1,_800:M1,_900:U1}},wg={primary:{stateActive:V1,stateDefault:j1,stateHover:q1},secondary:{stateActive:E1,stateDefault:J1,stateHover:K1},stateVisited:N1,tertiary:{stateActive:Q1,stateDefault:Z1,stateHover:tg}},Wg={backgroundBasic:eg,backgroundSubtle:ng,borderBasic:og,borderSubtle:lg,contentBasic:ag,contentSubtle:cg,stateActive:ig,stateDefault:fg,stateHover:sg},Pg={contentBasic:rg,contentSubtle:dg,stateActive:gg,stateDefault:ug,stateHover:hg},Ag={shadow100:{color01:bg},shadow200:{color01:Sg},shadow300:{color01:mg},shadow400:{color01:Bg}},Rg={primary:_g,secondary:pg,tertiary:$g},zg={background:yg,border:Dg,component:Og,disabled:vg,emotion:Hg,focus:kg,formField:Cg,gradient:Ig,lightDefault:xg,lightOnBrand:Fg,link:wg,neutral:Wg,selected:Pg,shadow:Ag,text:Rg},Gg={themeLightDefault:{colors:Yc},themeLightOnBrand:{colors:zg}};exports.bodyLargeBold=ht;exports.bodyLargeItalic=bt;exports.bodyLargeRegular=gt;exports.bodyLargeSemibold=ut;exports.bodyMediumBold=Bt;exports.bodyMediumItalic=_t;exports.bodyMediumRegular=St;exports.bodyMediumSemibold=mt;exports.bodySmallBold=yt;exports.bodySmallItalic=Dt;exports.bodySmallRegular=pt;exports.bodySmallSemibold=$t;exports.bodyXlargeBold=rt;exports.bodyXlargeItalic=dt;exports.bodyXlargeRegular=ft;exports.bodyXlargeSemibold=st;exports.bodyXsmallBold=Ht;exports.bodyXsmallItalic=kt;exports.bodyXsmallRegular=Ot;exports.bodyXsmallSemibold=vt;exports.borderWidth0=Ct;exports.borderWidth100=It;exports.borderWidth200=xt;exports.breakpointDesktop=i;exports.breakpointMobile=a;exports.breakpointTablet=c;exports.breakpoints=Pt;exports.containerMaxWidth=l;exports.containerPaddingDesktop=o;exports.containerPaddingMobile=e;exports.containerPaddingTablet=n;exports.containers=Wt;exports.focus=zt;exports.focusRing=_;exports.gradientBasicOverlay=t;exports.gradients=Ft;exports.gridColumns=d;exports.gridSpacingDesktop=s;exports.gridSpacingMobile=f;exports.gridSpacingTablet=r;exports.grids=At;exports.headingLargeBold=E;exports.headingLargeItalic=J;exports.headingLargeRegular=j;exports.headingLargeSemibold=q;exports.headingMediumBold=Q;exports.headingMediumItalic=Z;exports.headingMediumRegular=K;exports.headingMediumSemibold=N;exports.headingSmallBold=nt;exports.headingSmallItalic=ot;exports.headingSmallRegular=tt;exports.headingSmallSemibold=et;exports.headingXlargeBold=U;exports.headingXlargeItalic=V;exports.headingXlargeRegular=L;exports.headingXlargeSemibold=M;exports.headingXsmallBold=ct;exports.headingXsmallItalic=it;exports.headingXsmallRegular=lt;exports.headingXsmallSemibold=at;exports.radii=Rt;exports.radius0=g;exports.radius100=u;exports.radius200=h;exports.radius300=b;exports.radius400=S;exports.radius500=m;exports.radiusFull=B;exports.shadow100=p;exports.shadow200=$;exports.shadow300=y;exports.shadow400=D;exports.shadows=Gt;exports.space0=O;exports.space100=v;exports.space1000=P;exports.space1100=A;exports.space1200=R;exports.space1300=z;exports.space1400=G;exports.space1500=Y;exports.space1600=T;exports.space1700=X;exports.space200=H;exports.space300=k;exports.space400=C;exports.space500=I;exports.space600=x;exports.space700=F;exports.space800=w;exports.space900=W;exports.spaces=Yt;exports.styles=Tt;exports.themes=Gg;exports.tokenPrefix=wt;

2181

esm/index.js

@@ -1,419 +0,347 @@

const a = "none", r = "solid", s = "dashed", e = {
0: a,
100: r,
200: s
}, c = 0, l = "1px", d = "2px", t = {
0: c,
100: l,
200: d
}, An = {
borderStyle: e,
borderWidth: t,
style: e,
width: t
}, f = "#d4d4d4", m = "#e9e9e9", b = "#c4c4c4", y = "#dbdbdb", g = {
active: f,
default: m,
disabled: b,
hover: y
}, S = "#d4d4d4", v = "#e9e9e9", u = "#c4c4c4", h = "#dbdbdb", x = "#a7bcc2", n = {
active: S,
default: v,
disabled: u,
hover: h,
visited: x
}, I = "#0b3a46", p = "#29616f", k = "#979797", H = "#1b5260", D = "#835ea1", o = {
active: I,
default: p,
disabled: k,
hover: H,
visited: D
}, W = "#454b4e", z = "#758185", F = "#979797", T = "#5b6568", L = "#835ea1", i = {
active: W,
default: z,
disabled: F,
hover: T,
visited: L
}, Bn = {
primary: o,
secondary: i,
inverted: n
}, P = "#0b3a46", A = "#29616f", B = "#f5f5f5", X = "#1b5260", M = {
active: P,
default: A,
disabled: B,
hover: X
}, w = "#c4c4c4", C = "#a0a0a0", R = "#f5f5f5", U = "#737373", G = {
active: w,
default: C,
disabled: R,
hover: U
}, V = "#0b3a46", O = "#29616f", j = "#a6a6a6", q = "#1b5260", E = {
active: V,
default: O,
disabled: j,
hover: q
}, J = "#d4d4d4", K = "#e9e9e9", N = "#f5f5f5", Q = "#dbdbdb", Y = {
active: J,
default: K,
disabled: N,
hover: Q
}, Z = "#091417", _ = "#132930", $ = "#a6a6a6", ee = "#0b1c21", te = {
active: Z,
default: _,
disabled: $,
hover: ee
}, ne = {
inverted: g,
link: {
inverted: n,
primary: o,
secondary: i
const vg = 0, Hg = "1px", kg = "2px", t = "linear-gradient(var(--gradient-angle, 90deg), var(--spirit-color-gradient-basic-overlay-color-01, #fff) 0%, var(--spirit-color-gradient-basic-overlay-color-02, #fff0) 100%)", Cg = {
basicOverlay: t
}, e = "16px", n = "32px", o = "32px", l = "1280px", a = 0, c = "768px", i = "1280px", f = "16px", s = "32px", r = "32px", d = "12", xg = "spirit-", Ig = {
padding: {
mobile: e,
tablet: n,
desktop: o
},
primary: M,
secondary: G,
selected: E,
tertiary: Y,
unselected: te
}, oe = "#0b1c2199", ie = "#fff", ae = "#f0f0f0", re = {
backdrop: oe,
basic: ie,
cover: ae
}, se = "#a4a4a44d", ce = "#fff0", le = "#b0b0b033", de = {
active: se,
default: ce,
hover: le
}, fe = "#9f9f9fcc", me = "#fff0", be = "#bbb6", ye = {
active: fe,
default: me,
hover: be
}, ge = "#132930", Se = {
...re,
interactive: {
...de,
inverted: ye
maxWidth: l
}, Fg = {
mobile: a,
tablet: c,
desktop: i
}, wg = {
spacing: {
mobile: f,
desktop: s,
tablet: r
},
inverted: ge
}, ve = "#b1b1b1", ue = "#d8d8d8", he = "#dfdfe0", xe = "#c5c5c5", Ie = "#29616f", pe = {
active: ve,
default: ue,
disabled: he,
hover: xe,
selected: Ie
}, ke = "#e9e9e9", He = {
primary: pe,
secondary: {
default: ke
}
}, De = "#0b1c21", We = "#30588c", ze = {
primary: De,
secondary: We
}, Fe = "#6f2535", Te = "#fbeef1", Le = "#ba3e5a", Pe = "#f5f5f5", Ae = "#953248", Be = {
active: Fe,
background: Te,
default: Le,
disabled: Pe,
hover: Ae
}, Xe = "#26456e", Me = "#e8eff7", we = "#3b6bab", Ce = "#f5f5f5", Re = "#30588c", Ue = {
active: Xe,
background: Me,
default: we,
disabled: Ce,
hover: Re
}, Ge = "#33420a", Ve = "#f6fbe9", Oe = "#607c13", je = "#f5f5f5", qe = "#485d0e", Ee = {
active: Ge,
background: Ve,
default: Oe,
disabled: je,
hover: qe
}, Je = "#423400", Ke = "#f8f2e4", Ne = "#a98300", Qe = "#f5f5f5", Ye = "#755b00", Ze = {
active: Je,
background: Ke,
default: Ne,
disabled: Qe,
hover: Ye
}, _e = {
danger: Be,
informative: Ue,
success: Ee,
warning: Ze
}, $e = "#4666ae", et = "#132930", tt = "#a6a6a6", nt = {
default: et,
disabled: tt
}, ot = "#fff", it = "#a6a6a6", at = {
default: ot,
disabled: it
}, rt = "#5c747b", st = "#a6a6a6", ct = {
default: rt,
disabled: st
}, lt = "#e9e9e9", dt = "#737373", ft = {
default: lt,
disabled: dt
}, mt = {
primary: nt,
secondary: ct,
inverted: {
primary: at,
secondary: ft
}
}, Xn = {
action: ne,
background: Se,
border: He,
brand: ze,
emotion: _e,
focus: {
default: $e
columns: d
}, g = 0, u = "2px", h = "4px", b = "8px", S = "12px", B = "16px", m = "9999px", Wg = {
0: g,
100: u,
200: h,
300: b,
400: S,
500: B,
full: m
}, _ = "0 0 0 2px var(--spirit-color-focus-focus-ring-color-01, #d2c2ffb2)", p = "0 2px 8px 0 var(--spirit-color-shadow-shadow-100-color-01, #00000026)", $ = "0 4px 12px 0 var(--spirit-color-shadow-shadow-200-color-01, #0003)", y = "0 8px 24px 0 var(--spirit-color-shadow-shadow-300-color-01, #00000040)", D = "0 12px 32px 0 var(--spirit-color-shadow-shadow-400-color-01, #00000040)", Pg = {
focusRing: _
}, Ag = {
100: p,
200: $,
300: y,
400: D
}, O = 0, v = "1px", H = "2px", k = "4px", C = "6px", x = "8px", I = "12px", F = "16px", w = "20px", W = "24px", P = "32px", A = "40px", z = "48px", R = "56px", G = "64px", Y = "72px", T = "80px", L = "96px", zg = {
0: O,
100: v,
200: H,
300: k,
400: C,
500: x,
600: I,
700: F,
800: w,
900: W,
1e3: P,
1100: A,
1200: z,
1300: R,
1400: G,
1500: Y,
1600: T,
1700: L
}, X = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "64px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.2
},
text: mt
}, bt = "linear-gradient(var(--gradient-angle, 90deg), #fff 0%, #fff0 100%)", Mn = {
backgroundBasicOverlay: bt
}, yt = 0, gt = "1px", St = "2px", vt = "4px", ut = "8px", ht = "12px", xt = "16px", It = "24px", pt = "32px", kt = "40px", Ht = "48px", Dt = "64px", Wt = "80px", zt = {
0: yt,
100: gt,
200: St,
300: vt,
400: ut,
500: ht,
600: xt,
700: It,
800: pt,
900: kt,
1e3: Ht,
1100: Dt,
1200: Wt
}, wn = {
space: zt
}, Ft = "1280px", Tt = 12, Lt = 0, Pt = "16px", At = "16px", Bt = "768px", Xt = "32px", Mt = "32px", wt = "1280px", Ct = "32px", Rt = "32px", Cn = {
maxWidth: Ft
}, Rn = {
columns: Tt
}, Ut = {
mobile: Lt,
tablet: Bt,
desktop: wt
}, Gt = {
mobile: Pt,
tablet: Xt,
desktop: Ct
}, Vt = {
mobile: At,
tablet: Mt,
desktop: Rt
}, Un = {
breakpoints: Ut,
containerPaddings: Gt,
gridGutters: Vt
}, Ot = 0, jt = "4px", qt = "8px", Et = "12px", Jt = {
0: Ot,
100: jt,
200: qt,
300: Et
}, Gn = {
radius: Jt
}, Kt = "0 0 0 2px #d2c2ff99", Nt = "0 2px 8px 0 #00000026", Qt = "0 4px 12px 0 #0003", Yt = "0 8px 24px 0 #00000040", Zt = "0 12px 32px 0 #00000040", _t = {
100: Nt,
200: Qt,
300: Yt,
400: Zt
}, Vn = {
focus: Kt,
shadow: _t
}, $t = {
mobile: {
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.125rem",
fontSize: "64px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.55
}
}, en = {
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.125rem",
fontStyle: "italic",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.55
lineHeight: 1.2
}
}, tn = {
}, U = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "64px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "64px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.125rem",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.55
fontWeight: 600,
lineHeight: 1.2
}
}, nn = {
mobile: {
}, M = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.125rem",
fontSize: "64px",
fontStyle: "normal",
fontWeight: 500,
lineHeight: 1.55
}
}, on = {
bold: $t,
italic: en,
regular: tn,
semibold: nn
}, an = {
fontWeight: 700,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "64px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1rem",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.5
fontWeight: 700,
lineHeight: 1.2
}
}, rn = {
}, V = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "64px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "64px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1rem",
fontSize: "48px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.5
lineHeight: 1.2
}
}, sn = {
mobile: {
}, j = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "1rem",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.5
}
}, cn = {
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1rem",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 500,
lineHeight: 1.5
fontWeight: 400,
lineHeight: 1.2
}
}, ln = {
bold: an,
italic: rn,
regular: sn,
semibold: cn
}, dn = {
mobile: {
}, q = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.875rem",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.42
}
}, fn = {
mobile: {
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.875rem",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.42
}
}, mn = {
fontSize: "48px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.875rem",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.42
fontWeight: 600,
lineHeight: 1.2
}
}, bn = {
mobile: {
}, E = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.875rem",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 500,
lineHeight: 1.42
}
}, yn = {
bold: dn,
italic: fn,
regular: mn,
semibold: bn
}, gn = {
fontWeight: 700,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "48px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.6
lineHeight: 1.2
}
}, Sn = {
}, J = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "48px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "48px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "32px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.6
lineHeight: 1.2
}
}, vn = {
}, K = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.6
lineHeight: 1.2
}
}, un = {
}, N = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 500,
lineHeight: 1.6
fontWeight: 600,
lineHeight: 1.2
}
}, hn = {
bold: gn,
italic: Sn,
regular: vn,
semibold: un
}, xn = {
}, Q = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.75rem",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.32
fontWeight: 700,
lineHeight: 1.2
}
}, In = {
}, Z = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "32px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.75rem",
fontSize: "20px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.32
lineHeight: 1.2
}
}, pn = {
mobile: {
}, tt = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.75rem",
fontSize: "24px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.32
}
}, kn = {
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "24px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "0.75rem",
fontSize: "18px",
fontStyle: "normal",
fontWeight: 500,
lineHeight: 1.32
fontWeight: 400,
lineHeight: 1.2
}
}, Hn = {
bold: xn,
italic: In,
regular: pn,
semibold: kn
}, Dn = {
large: on,
medium: ln,
small: yn,
xlarge: hn,
xsmall: Hn
}, Wn = {
mobile: {
}, et = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "2rem",
fontSize: "24px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 600,
lineHeight: 1.2

@@ -423,18 +351,18 @@ },

fontFamily: "'Inter', sans-serif",
fontSize: "3rem",
fontSize: "24px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 600,
lineHeight: 1.2
},
desktop: {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "3rem",
fontSize: "18px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 600,
lineHeight: 1.2
}
}, zn = {
mobile: {
}, nt = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "24px",
fontStyle: "normal",

@@ -446,3 +374,3 @@ fontWeight: 700,

fontFamily: "'Inter', sans-serif",
fontSize: "2rem",
fontSize: "24px",
fontStyle: "normal",

@@ -452,5 +380,5 @@ fontWeight: 700,

},
desktop: {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "2rem",
fontSize: "18px",
fontStyle: "normal",

@@ -460,8 +388,30 @@ fontWeight: 700,

}
}, Fn = {
}, ot = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "24px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "24px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.125rem",
fontSize: "18px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
}
}, lt = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 400,
lineHeight: 1.2

@@ -471,20 +421,20 @@ },

fontFamily: "'Inter', sans-serif",
fontSize: "1.5rem",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 400,
lineHeight: 1.2
},
desktop: {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.5rem",
fontSize: "16px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 400,
lineHeight: 1.2
}
}, Tn = {
mobile: {
}, at = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "3rem",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 600,
lineHeight: 1.2

@@ -494,18 +444,18 @@ },

fontFamily: "'Inter', sans-serif",
fontSize: "4rem",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 600,
lineHeight: 1.2
},
desktop: {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "4rem",
fontSize: "16px",
fontStyle: "normal",
fontWeight: 700,
fontWeight: 600,
lineHeight: 1.2
}
}, Ln = {
mobile: {
}, ct = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "1rem",
fontSize: "20px",
fontStyle: "normal",

@@ -517,3 +467,3 @@ fontWeight: 700,

fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "20px",
fontStyle: "normal",

@@ -523,5 +473,5 @@ fontWeight: 700,

},
desktop: {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "1.25rem",
fontSize: "16px",
fontStyle: "normal",

@@ -531,217 +481,1274 @@ fontWeight: 700,

}
}, Pn = {
large: Wn,
medium: zn,
small: Fn,
xlarge: Tn,
xsmall: Ln
}, On = {
body: Dn,
heading: Pn
}, it = {
desktop: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
tablet: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
},
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "16px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.2
}
}, ft = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.6
}
}, st = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.6
}
}, rt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.6
}
}, dt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "20px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.6
}
}, gt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "18px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.55
}
}, ut = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "18px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.55
}
}, ht = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "18px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.55
}
}, bt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "18px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.55
}
}, St = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "16px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.5
}
}, Bt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "16px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.5
}
}, mt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "16px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.5
}
}, _t = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "16px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.5
}
}, pt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "14px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.42
}
}, $t = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "14px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.42
}
}, yt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "14px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.42
}
}, Dt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "14px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.42
}
}, Ot = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "12px",
fontStyle: "normal",
fontWeight: 400,
lineHeight: 1.32
}
}, vt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "12px",
fontStyle: "normal",
fontWeight: 600,
lineHeight: 1.32
}
}, Ht = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "12px",
fontStyle: "normal",
fontWeight: 700,
lineHeight: 1.32
}
}, kt = {
mobile: {
fontFamily: "'Inter', sans-serif",
fontSize: "12px",
fontStyle: "italic",
fontWeight: 400,
lineHeight: 1.32
}
}, Rg = {
headingXlargeRegular: X,
headingXlargeSemibold: U,
headingXlargeBold: M,
headingXlargeItalic: V,
headingLargeRegular: j,
headingLargeSemibold: q,
headingLargeBold: E,
headingLargeItalic: J,
headingMediumRegular: K,
headingMediumSemibold: N,
headingMediumBold: Q,
headingMediumItalic: Z,
headingSmallRegular: tt,
headingSmallSemibold: et,
headingSmallBold: nt,
headingSmallItalic: ot,
headingXsmallRegular: lt,
headingXsmallSemibold: at,
headingXsmallBold: ct,
headingXsmallItalic: it,
bodyXlargeRegular: ft,
bodyXlargeSemibold: st,
bodyXlargeBold: rt,
bodyXlargeItalic: dt,
bodyLargeRegular: gt,
bodyLargeSemibold: ut,
bodyLargeBold: ht,
bodyLargeItalic: bt,
bodyMediumRegular: St,
bodyMediumSemibold: Bt,
bodyMediumBold: mt,
bodyMediumItalic: _t,
bodySmallRegular: pt,
bodySmallSemibold: $t,
bodySmallBold: yt,
bodySmallItalic: Dt,
bodyXsmallRegular: Ot,
bodyXsmallSemibold: vt,
bodyXsmallBold: Ht,
bodyXsmallItalic: kt
}, Ct = "#1a1b1b80", xt = "#f1edff", It = "#fff0", Ft = "#f8f6ff", wt = "#fff", Wt = "#f2f2f2", Pt = "#f1edff", At = "#d9d9d9", zt = "#7847ff", Rt = "#a5a5a5", Gt = "#bfbfbf", Yt = "#b2b2b2", Tt = "#7847ff", Lt = "#fff0", Xt = "#6039cc", Ut = "#e4daff", Mt = "#fff0", Vt = "#f1edff", jt = "#4e2ea6", qt = "#fff", Et = "#6039cc", Jt = "#7847ff", Kt = "#6c40e5", Nt = "#7847ff", Qt = "#6039cc", Zt = "#e4daff", te = "#fff", ee = "#f1edff", ne = "#e5e5e5", oe = "#202020", le = "#d9d9d9", ae = "#f2f2f2", ce = "#e5e5e5", ie = "#fff", fe = "#f1edff", se = "#fff0", re = "#f8f6ff", de = "#fff0", ge = "#4e2ea6", ue = "#404040", he = "#6039cc", be = "#6039cc", Se = "#ffbe00", Be = "#e4daff", me = "#327c3f", _e = "#fff", pe = "#3e9b4f", $e = "#327c3f", ye = "#388b47", De = "#a5a5a5", Oe = "#404040", ve = "#f2f2f2", He = "#fff", ke = "#f9f9f9", Ce = "#f9f9f9", xe = "#e5e5e5", Ie = "#a5a5a5", Fe = "#d9d9d9", we = "#b60000", We = "#fef2f2", Pe = "#b60000", Ae = "#f18080", ze = "#940000", Re = "#fff", Ge = "#e40000", Ye = "#b60000", Te = "#cd0000", Le = "#0052ad", Xe = "#f2f7fd", Ue = "#0052ad", Me = "#80b2eb", Ve = "#00428c", je = "#fff", qe = "#0066d8", Ee = "#0052ad", Je = "#005cc2", Ke = "#327c3f", Ne = "#f5faf6", Qe = "#327c3f", Ze = "#9ecda7", tn = "#286533", en = "#fff", nn = "#3e9b4f", on = "#327c3f", ln = "#388b47", an = "#c26400", cn = "#fef8f2", fn = "#c26400", sn = "#f9be80", rn = "#9d5100", dn = "#fff", gn = "#f27d00", un = "#c26400", hn = "#da7100", bn = "#d2c2ffb2", Sn = "#b60000", Bn = "#fff", mn = "#fff", _n = "#f9f9f9", pn = "#7f7f7f", $n = "#a5a5a5", yn = "#999", Dn = "#7847ff", On = "#202020", vn = "#666", Hn = "#7f7f7f", kn = "#202020", Cn = "#327c3f", xn = "#c26400", In = "#fff0", Fn = "#1a1b1b73", wn = "#ffffff73", Wn = "#000", Pn = "#f2f7fd", An = "#0066d8", zn = "#005cc2", Rn = "#0052ad", Gn = "#00428c", Yn = "#00336c", Tn = "#001a36", Ln = "#e5f0fb", Xn = "#cce0f7", Un = "#b2d1f3", Mn = "#99c2ef", Vn = "#80b2eb", jn = "#66a3e8", qn = "#4d94e4", En = "#3385e0", Jn = "#f9f9f9", Kn = "#7f7f7f", Nn = "#727272", Qn = "#666", Zn = "#535353", t0 = "#404040", e0 = "#202020", n0 = "#f2f2f2", o0 = "#e5e5e5", l0 = "#d9d9d9", a0 = "#ccc", c0 = "#bfbfbf", i0 = "#b2b2b2", f0 = "#a5a5a5", s0 = "#999", r0 = "#f5faf6", d0 = "#3e9b4f", g0 = "#388b47", u0 = "#327c3f", h0 = "#286533", b0 = "#1f4e28", S0 = "#102714", B0 = "#ecf5ed", m0 = "#d8ebdc", _0 = "#c5e1ca", p0 = "#b2d7b9", $0 = "#9ecda7", y0 = "#8bc395", D0 = "#78b984", O0 = "#65af72", v0 = "#fef8f2", H0 = "#f27d00", k0 = "#da7100", C0 = "#c26400", x0 = "#9d5100", I0 = "#793f00", F0 = "#3d1f00", w0 = "#fef2e5", W0 = "#fce5cc", P0 = "#fbd8b2", A0 = "#facb99", z0 = "#f9be80", R0 = "#f7b166", G0 = "#f6a44d", Y0 = "#f59733", T0 = "#f8f6ff", L0 = "#7847ff", X0 = "#6c40e5", U0 = "#6039cc", M0 = "#4e2ea6", V0 = "#3c2480", j0 = "#1e1240", q0 = "#f1edff", E0 = "#e4daff", J0 = "#d6c8ff", K0 = "#c9b5ff", N0 = "#bba3ff", Q0 = "#ae91ff", Z0 = "#a07eff", to = "#936cff", eo = "#fef2f2", no = "#e40000", oo = "#cd0000", lo = "#b60000", ao = "#940000", co = "#720000", io = "#390000", fo = "#fce5e5", so = "#facccc", ro = "#f7b2b2", go = "#f49999", uo = "#f18080", ho = "#ef6666", bo = "#ec4d4d", So = "#e93333", Bo = "#fff", mo = "#fffcf2", _o = "#ffbe00", po = "#e5ab00", $o = "#cc9800", yo = "#a67c00", Do = "#805f00", Oo = "#403000", vo = "#fff8e5", Ho = "#fff2cc", ko = "#ffebb2", Co = "#ffe599", xo = "#ffdf80", Io = "#ffd866", Fo = "#ffd24d", wo = "#ffcb33", Wo = "#1a1b1b73", Po = "#ffffff73", Ao = "#000", zo = "#f2f7fd", Ro = "#0066d8", Go = "#005cc2", Yo = "#0052ad", To = "#00428c", Lo = "#00336c", Xo = "#001a36", Uo = "#e5f0fb", Mo = "#cce0f7", Vo = "#b2d1f3", jo = "#99c2ef", qo = "#80b2eb", Eo = "#66a3e8", Jo = "#4d94e4", Ko = "#3385e0", No = "#f9f9f9", Qo = "#7f7f7f", Zo = "#727272", tl = "#666", el = "#535353", nl = "#404040", ol = "#202020", ll = "#f2f2f2", al = "#e5e5e5", cl = "#d9d9d9", il = "#ccc", fl = "#bfbfbf", sl = "#b2b2b2", rl = "#a5a5a5", dl = "#999", gl = "#f5faf6", ul = "#3e9b4f", hl = "#388b47", bl = "#327c3f", Sl = "#286533", Bl = "#1f4e28", ml = "#102714", _l = "#ecf5ed", pl = "#d8ebdc", $l = "#c5e1ca", yl = "#b2d7b9", Dl = "#9ecda7", Ol = "#8bc395", vl = "#78b984", Hl = "#65af72", kl = "#fef8f2", Cl = "#f27d00", xl = "#da7100", Il = "#c26400", Fl = "#9d5100", wl = "#793f00", Wl = "#3d1f00", Pl = "#fef2e5", Al = "#fce5cc", zl = "#fbd8b2", Rl = "#facb99", Gl = "#f9be80", Yl = "#f7b166", Tl = "#f6a44d", Ll = "#f59733", Xl = "#f8f6ff", Ul = "#7847ff", Ml = "#6c40e5", Vl = "#6039cc", jl = "#4e2ea6", ql = "#3c2480", El = "#1e1240", Jl = "#f1edff", Kl = "#e4daff", Nl = "#d6c8ff", Ql = "#c9b5ff", Zl = "#bba3ff", ta = "#ae91ff", ea = "#a07eff", na = "#936cff", oa = "#fef2f2", la = "#e40000", aa = "#cd0000", ca = "#b60000", ia = "#940000", fa = "#720000", sa = "#390000", ra = "#fce5e5", da = "#facccc", ga = "#f7b2b2", ua = "#f49999", ha = "#f18080", ba = "#ef6666", Sa = "#ec4d4d", Ba = "#e93333", ma = "#fff", _a = "#fffcf2", pa = "#ffbe00", $a = "#e5ab00", ya = "#cc9800", Da = "#a67c00", Oa = "#805f00", va = "#403000", Ha = "#fff8e5", ka = "#fff2cc", Ca = "#ffebb2", xa = "#ffe599", Ia = "#ffdf80", Fa = "#ffd866", wa = "#ffd24d", Wa = "#ffcb33", Pa = "#3c2480", Aa = "#6039cc", za = "#4e2ea6", Ra = "#3c2480", Ga = "#535353", Ya = "#4e2ea6", Ta = "#3c2480", La = "#3c2480", Xa = "#7f7f7f", Ua = "#4e2ea6", Ma = "#202020", Va = "#f2f2f2", ja = "#202020", qa = "#bfbfbf", Ea = "#202020", Ja = "#fff", Ka = "#535353", Na = "#202020", Qa = "#404040", Za = "#4e2ea6", tc = "#fff", ec = "#6039cc", nc = "#7847ff", oc = "#6c40e5", lc = "#00000026", ac = "#0003", cc = "#00000040", ic = "#00000040", fc = "#202020", sc = "#535353", rc = "#7f7f7f", dc = {
backdrop: Ct,
interactive: {
stateActive: xt,
stateDefault: It,
stateHover: Ft
},
primary: wt,
secondary: Wt,
tertiary: Pt
}, gc = {
basic: At,
focus: zt,
interactive: {
stateActive: Rt,
stateDefault: Gt,
stateHover: Yt,
stateSelected: Tt
}
}, uc = {
button: {
plain: {
border: Lt,
content: Xt,
stateActive: Ut,
stateDefault: Mt,
stateHover: Vt
},
primary: {
border: jt,
content: qt,
stateActive: Et,
stateDefault: Jt,
stateHover: Kt
},
secondary: {
border: Nt,
content: Qt,
stateActive: Zt,
stateDefault: te,
stateHover: ee
},
tertiary: {
border: ne,
content: oe,
stateActive: le,
stateDefault: ae,
stateHover: ce
}
},
header: {
background: ie,
itemBackgroundStateActive: fe,
itemBackgroundStateDefault: se,
itemBackgroundStateHover: re,
itemBackgroundStateSelected: de,
itemStateActive: ge,
itemStateDefault: ue,
itemStateHover: he,
itemStateSelected: be,
stripeStateSelected: Se,
stripeStateUnselected: Be
},
toggle: {
selectedBorder: me,
selectedContent: _e,
selectedStateActive: pe,
selectedStateDefault: $e,
selectedStateHover: ye,
unselectedBorder: De,
unselectedContent: Oe,
unselectedStateActive: ve,
unselectedStateDefault: He,
unselectedStateHover: ke
}
}, hc = {
background: Ce,
border: xe,
content: Ie,
foreground: Fe
}, bc = {
danger: {
backgroundBasic: we,
backgroundSubtle: We,
borderBasic: Pe,
borderSubtle: Ae,
contentBasic: ze,
contentSubtle: Re,
stateActive: Ge,
stateDefault: Ye,
stateHover: Te
},
informative: {
backgroundBasic: Le,
backgroundSubtle: Xe,
borderBasic: Ue,
borderSubtle: Me,
contentBasic: Ve,
contentSubtle: je,
stateActive: qe,
stateDefault: Ee,
stateHover: Je
},
success: {
backgroundBasic: Ke,
backgroundSubtle: Ne,
borderBasic: Qe,
borderSubtle: Ze,
contentBasic: tn,
contentSubtle: en,
stateActive: nn,
stateDefault: on,
stateHover: ln
},
warning: {
backgroundBasic: an,
backgroundSubtle: cn,
borderBasic: fn,
borderSubtle: sn,
contentBasic: rn,
contentSubtle: dn,
stateActive: gn,
stateDefault: un,
stateHover: hn
}
}, Sc = {
focusRing: {
color01: bn
}
}, Bc = {
danger: Sn,
filled: {
backgroundStateActive: Bn,
backgroundStateDefault: mn,
backgroundStateHover: _n,
borderStateActive: pn,
borderStateDefault: $n,
borderStateHover: yn,
borderStateSelected: Dn,
content: On,
placeholder: vn
},
helperText: Hn,
label: kn,
success: Cn,
warning: xn
}, mc = {
basicOverlay: {
color02: In
}
}, _c = {
alphaDark: {
_900: Fn
},
alphaLight: {
_900: wn
},
black: Wn,
blue: {
_100: Pn,
_1000: An,
_1100: zn,
_1200: Rn,
_1300: Gn,
_1400: Yn,
_1500: Tn,
_200: Ln,
_300: Xn,
_400: Un,
_500: Mn,
_600: Vn,
_700: jn,
_800: qn,
_900: En
},
cloudy: {
_100: Jn,
_1000: Kn,
_1100: Nn,
_1200: Qn,
_1300: Zn,
_1400: t0,
_1500: e0,
_200: n0,
_300: o0,
_400: l0,
_500: a0,
_600: c0,
_700: i0,
_800: f0,
_900: s0
},
green: {
_100: r0,
_1000: d0,
_1100: g0,
_1200: u0,
_1300: h0,
_1400: b0,
_1500: S0,
_200: B0,
_300: m0,
_400: _0,
_500: p0,
_600: $0,
_700: y0,
_800: D0,
_900: O0
},
orange: {
_100: v0,
_1000: H0,
_1100: k0,
_1200: C0,
_1300: x0,
_1400: I0,
_1500: F0,
_200: w0,
_300: W0,
_400: P0,
_500: A0,
_600: z0,
_700: R0,
_800: G0,
_900: Y0
},
purple: {
_100: T0,
_1000: L0,
_1100: X0,
_1200: U0,
_1300: M0,
_1400: V0,
_1500: j0,
_200: q0,
_300: E0,
_400: J0,
_500: K0,
_600: N0,
_700: Q0,
_800: Z0,
_900: to
},
red: {
_100: eo,
_1000: no,
_1100: oo,
_1200: lo,
_1300: ao,
_1400: co,
_1500: io,
_200: fo,
_300: so,
_400: ro,
_500: go,
_600: uo,
_700: ho,
_800: bo,
_900: So
},
white: Bo,
yellow: {
_100: mo,
_1000: _o,
_1100: po,
_1200: $o,
_1300: yo,
_1400: Do,
_1500: Oo,
_200: vo,
_300: Ho,
_400: ko,
_500: Co,
_600: xo,
_700: Io,
_800: Fo,
_900: wo
}
}, pc = {
alphaDark: {
_900: Wo
},
alphaLight: {
_900: Po
},
black: Ao,
blue: {
_100: zo,
_1000: Ro,
_1100: Go,
_1200: Yo,
_1300: To,
_1400: Lo,
_1500: Xo,
_200: Uo,
_300: Mo,
_400: Vo,
_500: jo,
_600: qo,
_700: Eo,
_800: Jo,
_900: Ko
},
cloudy: {
_100: No,
_1000: Qo,
_1100: Zo,
_1200: tl,
_1300: el,
_1400: nl,
_1500: ol,
_200: ll,
_300: al,
_400: cl,
_500: il,
_600: fl,
_700: sl,
_800: rl,
_900: dl
},
green: {
_100: gl,
_1000: ul,
_1100: hl,
_1200: bl,
_1300: Sl,
_1400: Bl,
_1500: ml,
_200: _l,
_300: pl,
_400: $l,
_500: yl,
_600: Dl,
_700: Ol,
_800: vl,
_900: Hl
},
orange: {
_100: kl,
_1000: Cl,
_1100: xl,
_1200: Il,
_1300: Fl,
_1400: wl,
_1500: Wl,
_200: Pl,
_300: Al,
_400: zl,
_500: Rl,
_600: Gl,
_700: Yl,
_800: Tl,
_900: Ll
},
purple: {
_100: Xl,
_1000: Ul,
_1100: Ml,
_1200: Vl,
_1300: jl,
_1400: ql,
_1500: El,
_200: Jl,
_300: Kl,
_400: Nl,
_500: Ql,
_600: Zl,
_700: ta,
_800: ea,
_900: na
},
red: {
_100: oa,
_1000: la,
_1100: aa,
_1200: ca,
_1300: ia,
_1400: fa,
_1500: sa,
_200: ra,
_300: da,
_400: ga,
_500: ua,
_600: ha,
_700: ba,
_800: Sa,
_900: Ba
},
white: ma,
yellow: {
_100: _a,
_1000: pa,
_1100: $a,
_1200: ya,
_1300: Da,
_1400: Oa,
_1500: va,
_200: Ha,
_300: ka,
_400: Ca,
_500: xa,
_600: Ia,
_700: Fa,
_800: wa,
_900: Wa
}
}, $c = {
primary: {
stateActive: Pa,
stateDefault: Aa,
stateHover: za
},
secondary: {
stateActive: Ra,
stateDefault: Ga,
stateHover: Ya
},
stateVisited: Ta,
tertiary: {
stateActive: La,
stateDefault: Xa,
stateHover: Ua
}
}, yc = {
backgroundBasic: Ma,
backgroundSubtle: Va,
borderBasic: ja,
borderSubtle: qa,
contentBasic: Ea,
contentSubtle: Ja,
stateActive: Ka,
stateDefault: Na,
stateHover: Qa
}, Dc = {
contentBasic: Za,
contentSubtle: tc,
stateActive: ec,
stateDefault: nc,
stateHover: oc
}, Oc = {
shadow100: {
color01: lc
},
shadow200: {
color01: ac
},
shadow300: {
color01: cc
},
shadow400: {
color01: ic
}
}, vc = {
primary: fc,
secondary: sc,
tertiary: rc
}, Hc = {
background: dc,
border: gc,
component: uc,
disabled: hc,
emotion: bc,
focus: Sc,
formField: Bc,
gradient: mc,
lightDefault: _c,
lightOnBrand: pc,
link: $c,
neutral: yc,
selected: Dc,
shadow: Oc,
text: vc
}, kc = "#1a1b1b80", Cc = "#ffffff1a", xc = "#fff0", Ic = "#ffffff0d", Fc = "#6039cc", wc = "#3c2480", Wc = "#1e1240", Pc = "#a07eff", Ac = "#1e1240", zc = "#bba3ff", Rc = "#a07eff", Gc = "#ae91ff", Yc = "#ffbe00", Tc = "#fff0", Lc = "#fff", Xc = "#ffffff26", Uc = "#fff0", Mc = "#ffffff1a", Vc = "#1e1240", jc = "#3c2480", qc = "#e4daff", Ec = "#fff", Jc = "#f1edff", Kc = "#f8f6ff", Nc = "#fff", Qc = "#1a1b1b26", Zc = "#1a1b1b00", ti = "#1a1b1b1a", ei = "#1a1b1b00", ni = "#fff", oi = "#1a1b1b4d", li = "#1a1b1b33", ai = "#1a1b1b40", ci = "#6039cc", ii = "#1a1b1b26", fi = "#fff0", si = "#1a1b1b1a", ri = "#fff0", di = "#e5e5e5", gi = "#fff", ui = "#f2f2f2", hi = "#ffbe00", bi = "#fff", Si = "#ffffff40", Bi = "#a07eff", mi = "#fff", _i = "#3e9b4f", pi = "#327c3f", $i = "#388b47", yi = "#a07eff", Di = "#4e2ea6", Oi = "#e4daff", vi = "#fff", Hi = "#f1edff", ki = "#ffffff1a", Ci = "#fff3", xi = "#ffffff80", Ii = "#fff3", Fi = "#e40000", wi = "#fce5e5", Wi = "#e93333", Pi = "#ef6666", Ai = "#720000", zi = "#fff", Ri = "#ec4d4d", Gi = "#e40000", Yi = "#e93333", Ti = "#0066d8", Li = "#e5f0fb", Xi = "#3385e0", Ui = "#66a3e8", Mi = "#00336c", Vi = "#fff", ji = "#4d94e4", qi = "#0066d8", Ei = "#3385e0", Ji = "#3e9b4f", Ki = "#ecf5ed", Ni = "#65af72", Qi = "#8bc395", Zi = "#1f4e28", tf = "#fff", ef = "#78b984", nf = "#3e9b4f", of = "#65af72", lf = "#f27d00", af = "#fef2e5", cf = "#f59733", ff = "#f7b166", sf = "#793f00", rf = "#fff", df = "#f6a44d", gf = "#f27d00", uf = "#f59733", hf = "#d2c2ffb2", bf = "#ec4d4d", Sf = "#fff", Bf = "#f9f9f9", mf = "#f1edff", _f = "#ae91ff", pf = "#936cff", $f = "#a07eff", yf = "#ffbe00", Df = "#202020", Of = "#666", vf = "#c9b5ff", Hf = "#fff", kf = "#78b984", Cf = "#f6a44d", xf = "#60606000", If = "#1a1b1b73", Ff = "#ffffff73", wf = "#000", Wf = "#f2f7fd", Pf = "#0066d8", Af = "#005cc2", zf = "#0052ad", Rf = "#00428c", Gf = "#00336c", Yf = "#001a36", Tf = "#e5f0fb", Lf = "#cce0f7", Xf = "#b2d1f3", Uf = "#99c2ef", Mf = "#80b2eb", Vf = "#66a3e8", jf = "#4d94e4", qf = "#3385e0", Ef = "#f9f9f9", Jf = "#7f7f7f", Kf = "#727272", Nf = "#666", Qf = "#535353", Zf = "#404040", ts = "#202020", es = "#f2f2f2", ns = "#e5e5e5", os = "#d9d9d9", ls = "#ccc", as = "#bfbfbf", cs = "#b2b2b2", is = "#a5a5a5", fs = "#999", ss = "#f5faf6", rs = "#3e9b4f", ds = "#388b47", gs = "#327c3f", us = "#286533", hs = "#1f4e28", bs = "#102714", Ss = "#ecf5ed", Bs = "#d8ebdc", ms = "#c5e1ca", _s = "#b2d7b9", ps = "#9ecda7", $s = "#8bc395", ys = "#78b984", Ds = "#65af72", Os = "#fef8f2", vs = "#f27d00", Hs = "#da7100", ks = "#c26400", Cs = "#9d5100", xs = "#793f00", Is = "#3d1f00", Fs = "#fef2e5", ws = "#fce5cc", Ws = "#fbd8b2", Ps = "#facb99", As = "#f9be80", zs = "#f7b166", Rs = "#f6a44d", Gs = "#f59733", Ys = "#f8f6ff", Ts = "#7847ff", Ls = "#6c40e5", Xs = "#6039cc", Us = "#4e2ea6", Ms = "#3c2480", Vs = "#1e1240", js = "#f1edff", qs = "#e4daff", Es = "#d6c8ff", Js = "#c9b5ff", Ks = "#bba3ff", Ns = "#ae91ff", Qs = "#a07eff", Zs = "#936cff", tr = "#fef2f2", er = "#e40000", nr = "#cd0000", or = "#b60000", lr = "#940000", ar = "#720000", cr = "#390000", ir = "#fce5e5", fr = "#facccc", sr = "#f7b2b2", rr = "#f49999", dr = "#f18080", gr = "#ef6666", ur = "#ec4d4d", hr = "#e93333", br = "#fff", Sr = "#fffcf2", Br = "#ffbe00", mr = "#e5ab00", _r = "#cc9800", pr = "#a67c00", $r = "#805f00", yr = "#403000", Dr = "#fff8e5", Or = "#fff2cc", vr = "#ffebb2", Hr = "#ffe599", kr = "#ffdf80", Cr = "#ffd866", xr = "#ffd24d", Ir = "#ffcb33", Fr = "#1a1b1b73", wr = "#ffffff73", Wr = "#000", Pr = "#f2f7fd", Ar = "#0066d8", zr = "#005cc2", Rr = "#0052ad", Gr = "#00428c", Yr = "#00336c", Tr = "#001a36", Lr = "#e5f0fb", Xr = "#cce0f7", Ur = "#b2d1f3", Mr = "#99c2ef", Vr = "#80b2eb", jr = "#66a3e8", qr = "#4d94e4", Er = "#3385e0", Jr = "#f9f9f9", Kr = "#7f7f7f", Nr = "#727272", Qr = "#666", Zr = "#535353", t1 = "#404040", e1 = "#202020", n1 = "#f2f2f2", o1 = "#e5e5e5", l1 = "#d9d9d9", a1 = "#ccc", c1 = "#bfbfbf", i1 = "#b2b2b2", f1 = "#a5a5a5", s1 = "#999", r1 = "#f5faf6", d1 = "#3e9b4f", g1 = "#388b47", u1 = "#327c3f", h1 = "#286533", b1 = "#1f4e28", S1 = "#102714", B1 = "#ecf5ed", m1 = "#d8ebdc", _1 = "#c5e1ca", p1 = "#b2d7b9", $1 = "#9ecda7", y1 = "#8bc395", D1 = "#78b984", O1 = "#65af72", v1 = "#fef8f2", H1 = "#f27d00", k1 = "#da7100", C1 = "#c26400", x1 = "#9d5100", I1 = "#793f00", F1 = "#3d1f00", w1 = "#fef2e5", W1 = "#fce5cc", P1 = "#fbd8b2", A1 = "#facb99", z1 = "#f9be80", R1 = "#f7b166", G1 = "#f6a44d", Y1 = "#f59733", T1 = "#f8f6ff", L1 = "#7847ff", X1 = "#6c40e5", U1 = "#6039cc", M1 = "#4e2ea6", V1 = "#3c2480", j1 = "#1e1240", q1 = "#f1edff", E1 = "#e4daff", J1 = "#d6c8ff", K1 = "#c9b5ff", N1 = "#bba3ff", Q1 = "#ae91ff", Z1 = "#a07eff", td = "#936cff", ed = "#fef2f2", nd = "#e40000", od = "#cd0000", ld = "#b60000", ad = "#940000", cd = "#720000", id = "#390000", fd = "#fce5e5", sd = "#facccc", rd = "#f7b2b2", dd = "#f49999", gd = "#f18080", ud = "#ef6666", hd = "#ec4d4d", bd = "#e93333", Sd = "#fff", Bd = "#fffcf2", md = "#ffbe00", _d = "#e5ab00", pd = "#cc9800", $d = "#a67c00", yd = "#805f00", Dd = "#403000", Od = "#fff8e5", vd = "#fff2cc", Hd = "#ffebb2", kd = "#ffe599", Cd = "#ffdf80", xd = "#ffd866", Id = "#ffd24d", Fd = "#ffcb33", wd = "#e5e5e5", Wd = "#fff", Pd = "#f2f2f2", Ad = "#e5e5e5", zd = "#d6c8ff", Rd = "#f2f2f2", Gd = "#ffbe00", Yd = "#e5e5e5", Td = "#bba3ff", Ld = "#f2f2f2", Xd = "#202020", Ud = "#f2f2f2", Md = "#202020", Vd = "#bfbfbf", jd = "#202020", qd = "#fff", Ed = "#535353", Jd = "#202020", Kd = "#404040", Nd = "#fff", Qd = "#3c2480", Zd = "#ffd24d", tg = "#ffbe00", eg = "#ffcb33", ng = "#00000026", og = "#0003", lg = "#00000040", ag = "#00000040", cg = "#f9f9f9", ig = "#d9d9d9", fg = "#b2b2b2", sg = {
backdrop: kc,
interactive: {
stateActive: Cc,
stateDefault: xc,
stateHover: Ic
},
primary: Fc,
secondary: wc,
tertiary: Wc
}, rg = {
basic: Pc,
focus: Ac,
interactive: {
stateActive: zc,
stateDefault: Rc,
stateHover: Gc,
stateSelected: Yc
}
}, dg = {
button: {
plain: {
border: Tc,
content: Lc,
stateActive: Xc,
stateDefault: Uc,
stateHover: Mc
},
primary: {
border: Vc,
content: jc,
stateActive: qc,
stateDefault: Ec,
stateHover: Jc
},
secondary: {
border: Kc,
content: Nc,
stateActive: Qc,
stateDefault: Zc,
stateHover: ti
},
tertiary: {
border: ei,
content: ni,
stateActive: oi,
stateDefault: li,
stateHover: ai
}
},
header: {
background: ci,
itemBackgroundStateActive: ii,
itemBackgroundStateDefault: fi,
itemBackgroundStateHover: si,
itemBackgroundStateSelected: ri,
itemStateActive: di,
itemStateDefault: gi,
itemStateHover: ui,
itemStateSelected: hi,
stripeStateSelected: bi,
stripeStateUnselected: Si
},
toggle: {
selectedBorder: Bi,
selectedContent: mi,
selectedStateActive: _i,
selectedStateDefault: pi,
selectedStateHover: $i,
unselectedBorder: yi,
unselectedContent: Di,
unselectedStateActive: Oi,
unselectedStateDefault: vi,
unselectedStateHover: Hi
}
}, gg = {
background: ki,
border: Ci,
content: xi,
foreground: Ii
}, ug = {
danger: {
backgroundBasic: Fi,
backgroundSubtle: wi,
borderBasic: Wi,
borderSubtle: Pi,
contentBasic: Ai,
contentSubtle: zi,
stateActive: Ri,
stateDefault: Gi,
stateHover: Yi
},
informative: {
backgroundBasic: Ti,
backgroundSubtle: Li,
borderBasic: Xi,
borderSubtle: Ui,
contentBasic: Mi,
contentSubtle: Vi,
stateActive: ji,
stateDefault: qi,
stateHover: Ei
},
success: {
backgroundBasic: Ji,
backgroundSubtle: Ki,
borderBasic: Ni,
borderSubtle: Qi,
contentBasic: Zi,
contentSubtle: tf,
stateActive: ef,
stateDefault: nf,
stateHover: of
},
warning: {
backgroundBasic: lf,
backgroundSubtle: af,
borderBasic: cf,
borderSubtle: ff,
contentBasic: sf,
contentSubtle: rf,
stateActive: df,
stateDefault: gf,
stateHover: uf
}
}, hg = {
focusRing: {
color01: hf
}
}, bg = {
danger: bf,
filled: {
backgroundStateActive: Sf,
backgroundStateDefault: Bf,
backgroundStateHover: mf,
borderStateActive: pf,
borderStateDefault: _f,
borderStateHover: $f,
borderStateSelected: yf,
content: Df,
placeholder: Of
},
helperText: vf,
label: Hf,
success: kf,
warning: Cf
}, Sg = {
basicOverlay: {
color02: xf
}
}, Bg = {
alphaDark: {
_900: If
},
alphaLight: {
_900: Ff
},
black: wf,
blue: {
_100: Wf,
_1000: Pf,
_1100: Af,
_1200: zf,
_1300: Rf,
_1400: Gf,
_1500: Yf,
_200: Tf,
_300: Lf,
_400: Xf,
_500: Uf,
_600: Mf,
_700: Vf,
_800: jf,
_900: qf
},
cloudy: {
_100: Ef,
_1000: Jf,
_1100: Kf,
_1200: Nf,
_1300: Qf,
_1400: Zf,
_1500: ts,
_200: es,
_300: ns,
_400: os,
_500: ls,
_600: as,
_700: cs,
_800: is,
_900: fs
},
green: {
_100: ss,
_1000: rs,
_1100: ds,
_1200: gs,
_1300: us,
_1400: hs,
_1500: bs,
_200: Ss,
_300: Bs,
_400: ms,
_500: _s,
_600: ps,
_700: $s,
_800: ys,
_900: Ds
},
orange: {
_100: Os,
_1000: vs,
_1100: Hs,
_1200: ks,
_1300: Cs,
_1400: xs,
_1500: Is,
_200: Fs,
_300: ws,
_400: Ws,
_500: Ps,
_600: As,
_700: zs,
_800: Rs,
_900: Gs
},
purple: {
_100: Ys,
_1000: Ts,
_1100: Ls,
_1200: Xs,
_1300: Us,
_1400: Ms,
_1500: Vs,
_200: js,
_300: qs,
_400: Es,
_500: Js,
_600: Ks,
_700: Ns,
_800: Qs,
_900: Zs
},
red: {
_100: tr,
_1000: er,
_1100: nr,
_1200: or,
_1300: lr,
_1400: ar,
_1500: cr,
_200: ir,
_300: fr,
_400: sr,
_500: rr,
_600: dr,
_700: gr,
_800: ur,
_900: hr
},
white: br,
yellow: {
_100: Sr,
_1000: Br,
_1100: mr,
_1200: _r,
_1300: pr,
_1400: $r,
_1500: yr,
_200: Dr,
_300: Or,
_400: vr,
_500: Hr,
_600: kr,
_700: Cr,
_800: xr,
_900: Ir
}
}, mg = {
alphaDark: {
_900: Fr
},
alphaLight: {
_900: wr
},
black: Wr,
blue: {
_100: Pr,
_1000: Ar,
_1100: zr,
_1200: Rr,
_1300: Gr,
_1400: Yr,
_1500: Tr,
_200: Lr,
_300: Xr,
_400: Ur,
_500: Mr,
_600: Vr,
_700: jr,
_800: qr,
_900: Er
},
cloudy: {
_100: Jr,
_1000: Kr,
_1100: Nr,
_1200: Qr,
_1300: Zr,
_1400: t1,
_1500: e1,
_200: n1,
_300: o1,
_400: l1,
_500: a1,
_600: c1,
_700: i1,
_800: f1,
_900: s1
},
green: {
_100: r1,
_1000: d1,
_1100: g1,
_1200: u1,
_1300: h1,
_1400: b1,
_1500: S1,
_200: B1,
_300: m1,
_400: _1,
_500: p1,
_600: $1,
_700: y1,
_800: D1,
_900: O1
},
orange: {
_100: v1,
_1000: H1,
_1100: k1,
_1200: C1,
_1300: x1,
_1400: I1,
_1500: F1,
_200: w1,
_300: W1,
_400: P1,
_500: A1,
_600: z1,
_700: R1,
_800: G1,
_900: Y1
},
purple: {
_100: T1,
_1000: L1,
_1100: X1,
_1200: U1,
_1300: M1,
_1400: V1,
_1500: j1,
_200: q1,
_300: E1,
_400: J1,
_500: K1,
_600: N1,
_700: Q1,
_800: Z1,
_900: td
},
red: {
_100: ed,
_1000: nd,
_1100: od,
_1200: ld,
_1300: ad,
_1400: cd,
_1500: id,
_200: fd,
_300: sd,
_400: rd,
_500: dd,
_600: gd,
_700: ud,
_800: hd,
_900: bd
},
white: Sd,
yellow: {
_100: Bd,
_1000: md,
_1100: _d,
_1200: pd,
_1300: $d,
_1400: yd,
_1500: Dd,
_200: Od,
_300: vd,
_400: Hd,
_500: kd,
_600: Cd,
_700: xd,
_800: Id,
_900: Fd
}
}, _g = {
primary: {
stateActive: wd,
stateDefault: Wd,
stateHover: Pd
},
secondary: {
stateActive: Ad,
stateDefault: zd,
stateHover: Rd
},
stateVisited: Gd,
tertiary: {
stateActive: Yd,
stateDefault: Td,
stateHover: Ld
}
}, pg = {
backgroundBasic: Xd,
backgroundSubtle: Ud,
borderBasic: Md,
borderSubtle: Vd,
contentBasic: jd,
contentSubtle: qd,
stateActive: Ed,
stateDefault: Jd,
stateHover: Kd
}, $g = {
contentBasic: Nd,
contentSubtle: Qd,
stateActive: Zd,
stateDefault: tg,
stateHover: eg
}, yg = {
shadow100: {
color01: ng
},
shadow200: {
color01: og
},
shadow300: {
color01: lg
},
shadow400: {
color01: ag
}
}, Dg = {
primary: cg,
secondary: ig,
tertiary: fg
}, Og = {
background: sg,
border: rg,
component: dg,
disabled: gg,
emotion: ug,
focus: hg,
formField: bg,
gradient: Sg,
lightDefault: Bg,
lightOnBrand: mg,
link: _g,
neutral: pg,
selected: $g,
shadow: yg,
text: Dg
}, Gg = {
themeLightDefault: {
colors: Hc
},
themeLightOnBrand: {
colors: Og
}
};
export {
ne as action,
g as actionInverted,
f as actionInvertedActive,
m as actionInvertedDefault,
b as actionInvertedDisabled,
y as actionInvertedHover,
Bn as actionLink,
n as actionLinkInverted,
S as actionLinkInvertedActive,
v as actionLinkInvertedDefault,
u as actionLinkInvertedDisabled,
h as actionLinkInvertedHover,
x as actionLinkInvertedVisited,
o as actionLinkPrimary,
I as actionLinkPrimaryActive,
p as actionLinkPrimaryDefault,
k as actionLinkPrimaryDisabled,
H as actionLinkPrimaryHover,
D as actionLinkPrimaryVisited,
i as actionLinkSecondary,
W as actionLinkSecondaryActive,
z as actionLinkSecondaryDefault,
F as actionLinkSecondaryDisabled,
T as actionLinkSecondaryHover,
L as actionLinkSecondaryVisited,
M as actionPrimary,
P as actionPrimaryActive,
A as actionPrimaryDefault,
B as actionPrimaryDisabled,
X as actionPrimaryHover,
G as actionSecondary,
w as actionSecondaryActive,
C as actionSecondaryDefault,
R as actionSecondaryDisabled,
U as actionSecondaryHover,
E as actionSelected,
V as actionSelectedActive,
O as actionSelectedDefault,
j as actionSelectedDisabled,
q as actionSelectedHover,
Y as actionTertiary,
J as actionTertiaryActive,
K as actionTertiaryDefault,
N as actionTertiaryDisabled,
Q as actionTertiaryHover,
te as actionUnselected,
Z as actionUnselectedActive,
_ as actionUnselectedDefault,
$ as actionUnselectedDisabled,
ee as actionUnselectedHover,
Se as background,
re as backgroundColor,
oe as backgroundColorBackdrop,
ie as backgroundColorBasic,
ae as backgroundColorCover,
de as backgroundInteractive,
se as backgroundInteractiveActive,
ce as backgroundInteractiveDefault,
le as backgroundInteractiveHover,
ye as backgroundInteractiveInverted,
fe as backgroundInteractiveInvertedActive,
me as backgroundInteractiveInvertedDefault,
be as backgroundInteractiveInvertedHover,
ge as backgroundInverted,
Dn as body,
on as bodyLarge,
$t as bodyLargeTextBold,
en as bodyLargeTextItalic,
tn as bodyLargeTextRegular,
nn as bodyLargeTextSemibold,
ln as bodyMedium,
an as bodyMediumTextBold,
rn as bodyMediumTextItalic,
sn as bodyMediumTextRegular,
cn as bodyMediumTextSemibold,
yn as bodySmall,
dn as bodySmallTextBold,
fn as bodySmallTextItalic,
mn as bodySmallTextRegular,
bn as bodySmallTextSemibold,
hn as bodyXLarge,
gn as bodyXLargeTextBold,
Sn as bodyXLargeTextItalic,
vn as bodyXLargeTextRegular,
un as bodyXLargeTextSemibold,
Hn as bodyXSmall,
xn as bodyXSmallTextBold,
In as bodyXSmallTextItalic,
pn as bodyXSmallTextRegular,
kn as bodyXSmallTextSemibold,
He as border,
pe as borderPrimary,
ve as borderPrimaryActive,
ue as borderPrimaryDefault,
he as borderPrimaryDisabled,
xe as borderPrimaryHover,
Ie as borderPrimarySelected,
ke as borderSecondaryDefault,
e as borderStyle,
a as borderStyle0,
r as borderStyle100,
s as borderStyle200,
t as borderWidth,
c as borderWidth0,
l as borderWidth100,
d as borderWidth200,
An as borders,
ze as brand,
De as brandPrimary,
We as brandSecondary,
wt as breakpointDesktop,
Lt as breakpointMobile,
Bt as breakpointTablet,
Ut as breakpoints,
Xn as colors,
Ft as containerMaxWidth,
Ct as containerPaddingDesktop,
Pt as containerPaddingMobile,
Xt as containerPaddingTablet,
Gt as containerPaddings,
Cn as containers,
_e as emotion,
Be as emotionDanger,
Fe as emotionDangerActive,
Te as emotionDangerBackground,
Le as emotionDangerDefault,
Pe as emotionDangerDisabled,
Ae as emotionDangerHover,
Ue as emotionInformative,
Xe as emotionInformativeActive,
Me as emotionInformativeBackground,
we as emotionInformativeDefault,
Ce as emotionInformativeDisabled,
Re as emotionInformativeHover,
Ee as emotionSuccess,
Ge as emotionSuccessActive,
Ve as emotionSuccessBackground,
Oe as emotionSuccessDefault,
je as emotionSuccessDisabled,
qe as emotionSuccessHover,
Ze as emotionWarning,
Je as emotionWarningActive,
Ke as emotionWarningBackground,
Ne as emotionWarningDefault,
Qe as emotionWarningDisabled,
Ye as emotionWarningHover,
Kt as focus,
$e as focusDefault,
bt as gradientBackgroundBasicOverlay,
Mn as gradients,
Tt as gridColumns,
Rt as gridGutterDesktop,
At as gridGutterMobile,
Mt as gridGutterTablet,
Vt as gridGutters,
Rn as grids,
Pn as heading,
Wn as headingLargeText,
zn as headingMediumText,
Fn as headingSmallText,
Tn as headingXLargeText,
Ln as headingXSmallText,
Un as others,
Gn as radii,
Jt as radius,
Ot as radius0,
jt as radius100,
qt as radius200,
Et as radius300,
_t as shadow,
Nt as shadow100,
Qt as shadow200,
Yt as shadow300,
Zt as shadow400,
Vn as shadows,
zt as space,
yt as space0,
gt as space100,
Ht as space1000,
Dt as space1100,
Wt as space1200,
St as space200,
vt as space300,
ut as space400,
ht as space500,
xt as space600,
It as space700,
pt as space800,
kt as space900,
wn as spaces,
On as styles,
mt as text,
nt as textPrimary,
et as textPrimaryDefault,
tt as textPrimaryDisabled,
at as textPrimaryInverted,
ot as textPrimaryInvertedDefault,
it as textPrimaryInvertedDisabled,
ct as textSecondary,
rt as textSecondaryDefault,
st as textSecondaryDisabled,
ft as textSecondaryInverted,
lt as textSecondaryInvertedDefault,
dt as textSecondaryInvertedDisabled
ht as bodyLargeBold,
bt as bodyLargeItalic,
gt as bodyLargeRegular,
ut as bodyLargeSemibold,
mt as bodyMediumBold,
_t as bodyMediumItalic,
St as bodyMediumRegular,
Bt as bodyMediumSemibold,
yt as bodySmallBold,
Dt as bodySmallItalic,
pt as bodySmallRegular,
$t as bodySmallSemibold,
rt as bodyXlargeBold,
dt as bodyXlargeItalic,
ft as bodyXlargeRegular,
st as bodyXlargeSemibold,
Ht as bodyXsmallBold,
kt as bodyXsmallItalic,
Ot as bodyXsmallRegular,
vt as bodyXsmallSemibold,
vg as borderWidth0,
Hg as borderWidth100,
kg as borderWidth200,
i as breakpointDesktop,
a as breakpointMobile,
c as breakpointTablet,
Fg as breakpoints,
l as containerMaxWidth,
o as containerPaddingDesktop,
e as containerPaddingMobile,
n as containerPaddingTablet,
Ig as containers,
Pg as focus,
_ as focusRing,
t as gradientBasicOverlay,
Cg as gradients,
d as gridColumns,
s as gridSpacingDesktop,
f as gridSpacingMobile,
r as gridSpacingTablet,
wg as grids,
E as headingLargeBold,
J as headingLargeItalic,
j as headingLargeRegular,
q as headingLargeSemibold,
Q as headingMediumBold,
Z as headingMediumItalic,
K as headingMediumRegular,
N as headingMediumSemibold,
nt as headingSmallBold,
ot as headingSmallItalic,
tt as headingSmallRegular,
et as headingSmallSemibold,
M as headingXlargeBold,
V as headingXlargeItalic,
X as headingXlargeRegular,
U as headingXlargeSemibold,
ct as headingXsmallBold,
it as headingXsmallItalic,
lt as headingXsmallRegular,
at as headingXsmallSemibold,
Wg as radii,
g as radius0,
u as radius100,
h as radius200,
b as radius300,
S as radius400,
B as radius500,
m as radiusFull,
p as shadow100,
$ as shadow200,
y as shadow300,
D as shadow400,
Ag as shadows,
O as space0,
v as space100,
P as space1000,
A as space1100,
z as space1200,
R as space1300,
G as space1400,
Y as space1500,
T as space1600,
L as space1700,
H as space200,
k as space300,
C as space400,
x as space500,
I as space600,
F as space700,
w as space800,
W as space900,
zg as spaces,
Rg as styles,
Gg as themes,
xg as tokenPrefix
};

4

package.json
{
"name": "@lmc-eu/spirit-design-tokens",
"version": "3.0.0-alpha.0",
"version": "3.0.0-alpha.1",
"description": "Design tokens for Spirit Design System",

@@ -49,3 +49,3 @@ "license": "MIT",

},
"gitHead": "eda367a6bf7f76f4c64ccce48ac34b84a9645188"
"gitHead": "5c74bf59a9c1ffb3f51f946181e7ffa2eb62d776"
}

162

README.md

@@ -12,19 +12,21 @@ # @lmc-eu/spirit-design-tokens

2. [Theme Tokens](#theme-tokens)
2. [Install](#install)
3. [Basic Usage](#basic-usage)
1. [In JavaScript](#in-javascript)
4. [Rebranding Spirit](#rebranding-spirit)
5. [FAQ](#faq)
6. [License](#license)
2. [Themes](#themes)
3. [Install](#install)
4. [Basic Usage](#basic-usage)
1. [In Sass](#in-sass)
2. [In JavaScript](#in-javascript)
5. [Rebranding Spirit](#rebranding-spirit)
6. [FAQ](#faq)
7. [License](#license)
## Available Design Tokens
Tokens are split into two categories: Global and Themes. Global tokens are
shared across all themes, while the theme tokens are specific to a particular theme.
Technically, design tokens are split into two categories: Global tokens and Theme tokens.
Global tokens are shared independently on themes, while the theme tokens are specific to a particular theme.
They are managed in our [Figma][spirit-figma] and exported to our [Supernova workspace][spirit-supernova].
They are all managed in our [Figma][spirit-figma] and exported to our [Supernova workspace][spirit-supernova].
All content in `src` is generated by Supernova and should not be edited manually.
⚠️ All content in `src` is generated by Supernova and should not be edited manually.
The `scss` directory contains `@global.scss` and `@themes.scss` files linking all available tokens.
The `scss` directory contains `@tokens.scss` linking all available tokens (including both global and theme tokens).

@@ -47,18 +49,23 @@ ### Global Tokens

You can find the list of the themes in the `src/themes` directory. Each theme has
its own directory with the same set of design tokens, but with different values.
Currently, only tokens in the 🎨 Colors group are themeable.
Each theme consists of the same set of tokens, but with different values.
## Themes
The category currently consists only of this group:
You can find the list of the themes in the `@themes` file and in the `scss/themes` directory.
Each theme has its own directory with the same set of design tokens, but with different values.
- 🎨 Colors
As of now, we support two light-mode color themes:
We currently support two themes:
- Light Default (listed first in `@themes`, i.e. the default theme)
- Light on Brand
- Light
- Light Inverted
Both themes can be used anywhere on the same page and combined as needed.
Where the former is the default and both of them can be used on the same page.
### Using Themes
The `scss` directory contains `@themes.scss` linking all available themes as Sass variables.
From the technical point of view, the theming is based on CSS variables. **However, this package
does not provide the CSS variables directly at the moment.** Instead, they are generated from
the `@themes` file in the [`spirit-web`][web-docs] package.
## Install

@@ -84,6 +91,8 @@

SCSS is the primary language for styling Spirit components.
### In Sass
The best way to use the design tokens is to load their path in SASS:
Sass (with the SCSS syntax) is the primary language for styling Spirit components.
The best way to use the design tokens is to load their path in Sass:
```shell

@@ -96,2 +105,24 @@ sass --load-path=node_modules/@lmc-eu/spirit-design-tokens/scss my-styles.scss

<details>
<summary>Vite example:</summary>
```javascript
// vite.config.js
// …
import { defineConfig } from 'vite';
export default defineConfig({
css: {
preprocessorOptions: {
scss: {
includePaths: [path.resolve(__dirname, 'node_modules/@lmc-eu/spirit-design-tokens/scss')],
},
},
},
});
// …
```
</details>
<details>
<summary>Webpack example with <code>sass-loader</code>:</summary>

@@ -117,2 +148,3 @@

path.resolve(__dirname, 'node_modules/@lmc-eu/spirit-design-tokens/scss'),
],
},

@@ -130,20 +162,39 @@ },

##### Using the sass-embedded Library
If you're using `sass-embedded`, you can specify the API as `legacy`, `modern`, or `modern-compiler`. More information can be found in [sass documentation](sass-embedded).
We recommend using the `modern-compiler` option.
Please note that this change also requires updating `includePaths` to `loadPaths`.
<details>
<summary>Vite example:</summary>
<summary>Webpack and <code>sass-embedded</code>:</summary>
```javascript
// vite.config.js
// webpack.config.js
// …
import { defineConfig } from 'vite';
export default defineConfig({
css: {
preprocessorOptions: {
scss: {
includePaths: [path.resolve(__dirname, 'node_modules/@lmc-eu/spirit-design-tokens/scss')],
},
module: {
rules: [
{
test: /\.scss$/,
use: [
'style-loader',
'css-loader',
{
loader: 'sass-loader',
options: {
api: 'modern-compiler',
sassOptions: {
loadPaths: [
path.resolve(__dirname, 'node_modules'),
path.resolve(__dirname, 'node_modules/@lmc-eu/spirit-design-tokens/scss'),
],
},
},
},
],
},
},
});
];
}
// …

@@ -154,11 +205,12 @@ ```

This way the [`spirit-web`][web-docs] package or your own components can simply reach token values like this:
The [`spirit-web`][web-docs] package or your own components can simply reach token values like this:
```scss
@use 'sass:map';
@use '@global' as global-tokens;
@use '@tokens' as tokens;
.MyComponentThatMightGoToSpiritInFuture {
font-family: map.get(global-tokens.$body-1-regular, font-family);
margin-bottom: global-tokens.$space-300;
margin-bottom: tokens.$space-300;
font-family: map.get(tokens.$body-medium-regular, mobile, font-family);
color: tokens.$text-primary;
}

@@ -170,13 +222,8 @@ ```

```scss
@use 'node_modules/@lmc-eu/spirit-design-tokens/scss/@global' as global-tokens;
@use 'node_modules/@lmc-eu/spirit-design-tokens/scss/@tokens' as tokens;
```
As mentioned, all themes contain the same set of tokens, so to use them you need to either
choose which theme you want to use and load it directly or use the `@themes` file to
generate CSS variables and use them in your components. The [`spirit-web`][web-docs] package does
this for you.
### In JavaScript
Additionally the design tokens are also provided as a JavaScript object.
Additionally, the design tokens are also provided as a JavaScript object.

@@ -189,3 +236,3 @@ ```js

The structure is the same as in the SASS.
The structure is the same as in Sass.

@@ -195,4 +242,4 @@ ## Rebranding Spirit

The system is designed to be easily rebranded. To do so, you need to provide
your own design tokens and use `@global` and `@themes` files. Then forward your tokens
to these files and set the correct load path for your project.
your own design tokens and use `@tokens` and `@themes` files. Then forward your tokens
to these files and set the [correct load path](#basic-usage) for your project.

@@ -208,11 +255,11 @@ Your tokens should contain the same structure as the Spirit tokens. The simplest

<summary>
Why do I need to rename <code>@global</code> to <code>global-tokens</code> when @using?
Why do I need to rename <code>@tokens</code> to <code>tokens</code> when @using?
</summary>
Because @using the `@global` module without renaming would produce an error:
Because @using the `@tokens` module without renaming would produce an error:
```log
Error: Invalid Sass identifier "@global"
Error: Invalid Sass identifier "@tokens"
╷
1 │ @use '@global';
1 │ @use '@tokens';
│ ^^^^^^^^^^^^^^

@@ -226,3 +273,3 @@ ```

We prefix the `@global.scss` file with `@` to differentiate it from other Sass
We prefix the `@tokens.scss` file with `@` to differentiate it from other Sass
files in the directory.

@@ -233,3 +280,3 @@

inside Sass files. As a result, it's clear why e.g. `@use 'tools'` refers to
a local file and `@use '@global'` does not. However, **it's only a naming
a local file and `@use '@tokens'` does not. However, **it's only a naming
convention,** there is no special tooling or configuration for Sass partials

@@ -239,3 +286,3 @@ starting with `@`.

Imported module **needs to be renamed to be compatible with SCSS** syntax
when it's used later on. That's why `@use '@global' as global-tokens`.
when it's used later on. That's why `@use '@tokens' as tokens`.

@@ -251,3 +298,3 @@ Look at the following snippets and compare which one offers better

@use 'tools'; // Calls './_tools.scss'. You don't have to explain this to me.
@use 'global'; // Wait, this file doesn't exist… What's going on here? Is it
@use 'tokens'; // Wait, this file doesn't exist… What's going on here? Is it
// an error?

@@ -262,3 +309,3 @@ ```

@use 'tools'; // Calls './_tools.scss'.
@use '@global' as global-tokens; // OK, './_@global.scss' is not here, but the at-sign
@use '@tokens' as tokens; // OK, './_@tokens.scss' is not here, but the at-sign
// prefix suggests a special behavior. Maybe I'll learn more in the docs?

@@ -311,1 +358,2 @@ ```

[web-docs]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web#readme
[sass-embedded]: https://sass-lang.com/documentation/breaking-changes/legacy-js-api/#bundlers

3

types/index.d.ts

@@ -1,1 +0,2 @@

export * from './generated';
export * from './global';
export * from './themes';
scss/@global.scss
scss/global/_borders.scss
scss/global/_gradients.scss
scss/global/_other.scss
scss/global/_radii.scss
scss/global/_shadows.scss
scss/global/_spacing.scss
scss/global/_typography.scss
scss/global/index.scss
types/generated/borders.d.ts
types/generated/colors.d.ts
types/generated/gradients.d.ts
types/generated/index.d.ts
types/generated/measures.d.ts
types/generated/other.d.ts
types/generated/radii.d.ts
types/generated/shadows.d.ts
types/generated/typography.d.ts
scss/@themes.scss

Sorry, the diff of this file is not supported yet

scss/themes/theme-light-default/_colors.scss

Sorry, the diff of this file is not supported yet

scss/themes/theme-light-on-brand/_colors.scss

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc