npm - gantri-components - Versions diffs - 1.7.4 → 1.7.7 - Mend

gantri-components 1.7.4 → 1.7.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (301) hide show

package/dist/index.esm.js ADDED Viewed

@@ -0,0 +1 @@

+ import{__assign as e,__makeTemplateObject as n,__spreadArray as o,__rest as r,__awaiter as t,__generator as i}from"tslib";import*as a from"react";import l,{useState as s,forwardRef as c,useRef as m}from"react";import d,{createGlobalStyle as p,ThemeProvider as u,css as h}from"styled-components";import{generateMedia as g}from"styled-media-query";import f from"lodash.isobject";import w from"lodash/startCase";import{useAsync as y}from"react-use";import{useTranslation as v,Trans as P}from"react-i18next";import"react-spring";import{Cloudinary as b}from"@cloudinary/url-gen";import"@cloudinary/url-gen/actions/resize";import"@cloudinary/url-gen/actions";import"@cloudinary/url-gen/qualifiers";var _,x={height:"unset",margin:"unset",maxWidth:"100vw",overflow:"unset",padding:"unset",width:"unset"},k={blue_100:"#ECF1FF",blue_200:"#BDCFFF",blue_300:"#7393E8",blue_400:"#335DC9",blue_500:"#151852",gold_100:"#FCF3E6",gold_200:"#EAD0AF",gold_300:"#D5AF7B",gold_400:"#BF8E47",gold_500:"#946A18",green_100:"#DFFBEC",green_200:"#9FF4C7",green_300:"#00cc88",green_400:"#00855B",green_500:"#25352F",monochrome_050:"#F8F8F8",monochrome_100:"#F0F0F0",monochrome_200:"#DFDFDF",monochrome_300:"#CECECE",monochrome_400:"#A1A1A1",monochrome_500:"#848484",monochrome_600:"#8F8C8B",monochrome_700:"#686868",monochrome_800:"#343434",monochrome_900:"#1C1C1C",monochrome_black:"#000000",monochrome_white:"#FFFFFF",pink_300:"#FFD8F4",pink_400:"#FFB1BA",pink_500:"#E00C7B",red_100:"#FFF0F1",red_200:"#FFCBD0",red_300:"#F47783",red_400:"#D43444",red_500:"#920110",translucent_black:"rgba(28, 28, 28, 0.7)",translucent_cream:"rgba(245, 245, 245, 0.2)",translucent_white:"rgba(255, 255, 255, 0.7)",yellow_100:"#FFFBF2",yellow_200:"#FFF5DB",yellow_300:"#FFECB4",yellow_400:"#FADC87",yellow_500:"#BD8C02"},A={border:"1px solid ".concat(k.monochrome_300),borderRadius:".6rem",dimensions:{gridGutter:"2.4rem",headerHeight:{lg:"6.4rem",sm:"4.8rem"},maxWidth:"78rem",spacing:{s1:"1.6rem",s2:"2rem",s3:"2.4rem",s4:"4rem",s5:"6rem",s6:"12rem"}},fonts:{boldFontFamily:"Sohne Halbfett",h1:{family:"Sohne Halbfett",lineHeight:"7rem",lineHeightMedium:"5rem",lineHeightSmaller:"5rem",size:"5.8rem",sizeMedium:"4rem",sizeSmaller:"4rem"},h2:{family:"Sohne Halbfett",lineHeight:"4.8rem",lineHeightMedium:"3.4rem",lineHeightSmaller:"3.4rem",size:"3.8rem",sizeMedium:"2.8rem",sizeSmaller:"2.8rem"},h3:{family:"Sohne Dreiviertelfett",lineHeight:"3.6rem",lineHeightMedium:"2.6rem",lineHeightSmaller:"2.6rem",size:"2.8rem",sizeMedium:"2rem",sizeSmaller:"2rem"},h4:{family:"Sohne Dreiviertelfett",lineHeight:"2.2rem",lineHeightMedium:"2.2rem",lineHeightSmaller:"2.2rem",size:"1.8rem",sizeMedium:"1.8rem",sizeSmaller:"1.8rem"},h5:{family:"Sohne Halbfett",lineHeight:"2rem",lineHeightMedium:"2rem",lineHeightSmaller:"2rem",size:"1.6rem",sizeMedium:"1.6rem",sizeSmaller:"1.6rem"},hero:{family:"Sohne Kraftig",familyMedium:"Sohne Halbfett",familySmaller:"Sohne Halbfett",lineHeight:"8.6rem",lineHeightMedium:"5.8rem",lineHeightSmaller:"5.8rem",size:"7.2rem",sizeMedium:"5.2rem",sizeSmaller:"5.2rem"},p0:{family:"Sohne Buch",lineHeight:"3.6rem",lineHeightMedium:"3rem",lineHeightSmaller:"3rem",size:"2.4rem",sizeMedium:"2.2rem",sizeSmaller:"2.2rem"},p1:{family:"Sohne Buch",lineHeight:"2.7rem",lineHeightMedium:"2.7rem",lineHeightSmaller:"2.7rem",size:"1.8rem",sizeMedium:"1.8rem",sizeSmaller:"1.8rem"},p2:{family:"Sohne Buch",lineHeight:"2.2rem",lineHeightSmaller:"2.2rem",size:"1.5rem",sizeSmaller:"1.5rem"},p3:{family:"Sohne Buch",lineHeight:"1.5rem",lineHeightSmaller:"1.5rem",size:"1.2rem",sizeSmaller:"1.2rem"},regularFontFamily:"Sohne Buch"},shadow:"0 .2rem .6rem rgba(0, 0, 0, 0.12)",transitions:{base:"0.15s ease",slow:"0.3s ease",slowest:"2s ease",turtle:"0.8s ease"}},F=e(e({},A),{colors:{dividers:{t1:k.monochrome_100,t2:k.monochrome_300,t3:k.monochrome_900},iconography:{alert:k.red_400,link:k.green_400,t1:k.monochrome_500,t2:k.monochrome_900,t3:k.monochrome_white,warning:k.gold_400},palette:k,surface:{alert:k.red_100,hover:k.monochrome_050,level1:k.monochrome_white,level2:k.monochrome_100,level3:k.monochrome_200,selected:k.monochrome_050,success:k.blue_100,successAlt:k.green_400,warning:k.yellow_100},typography:{alert:k.red_400,alt:k.monochrome_white,link:k.green_400,success:k.blue_400,t1:k.monochrome_900,t2:k.monochrome_500,t3:k.monochrome_300,warning:k.gold_400}},name:"Light Theme"}),S=e(e({},A),{colors:{dividers:{t1:k.monochrome_600,t2:k.monochrome_400,t3:k.monochrome_white},iconography:{alert:k.red_200,link:k.green_300,t1:k.monochrome_300,t2:k.monochrome_100,t3:k.monochrome_900,warning:k.gold_200},palette:k,surface:{alert:k.red_500,hover:k.monochrome_800,level1:k.monochrome_900,level2:k.monochrome_800,level3:k.monochrome_600,selected:k.monochrome_800,success:k.blue_500,successAlt:k.blue_100,warning:k.gold_500},typography:{alert:k.red_200,alt:k.monochrome_900,link:k.green_300,success:k.blue_200,t1:k.monochrome_white,t2:k.monochrome_300,t3:k.monochrome_500,warning:k.gold_200}},name:"Dark Theme"}),z=function(e,n){var o,r;return void 0===n&&(n=F),null!==(r=null===(o=n.colors.palette)||void 0===o?void 0:o[e])&&void 0!==r?r:e},C=function(e,n){var o;return void 0===n&&(n=F),null!==(o=n.dimensions.spacing[e])&&void 0!==o?o:"default"===e?n.dimensions.gridGutter:null!=e?e:"unset"},H=function(e){return void 0===e&&(e=F),{alert:{background:e.colors.palette.red_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.red_300,selected:e.colors.palette.red_500},black:{background:e.colors.palette.monochrome_900,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_500,selected:e.colors.palette.green_500},blue:{background:e.colors.palette.blue_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.blue_300,selected:e.colors.palette.blue_500},gold:{background:e.colors.palette.gold_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.gold_300,selected:e.colors.palette.gold_500},green:{background:e.colors.palette.green_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.green_300,selected:e.colors.palette.green_500},grey:{background:e.colors.palette.monochrome_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_300,selected:e.colors.palette.monochrome_500},greyLight:{background:e.colors.palette.monochrome_200,color:e.colors.palette.monochrome_black,hover:e.colors.palette.monochrome_300,selected:e.colors.palette.monochrome_400},pink:{background:e.colors.palette.pink_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.red_300,selected:e.colors.palette.monochrome_black},primary:{background:e.colors.palette.green_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.green_300,selected:e.colors.palette.green_500},secondary:{background:e.colors.palette.green_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_500,selected:e.colors.palette.green_500},secondaryAlt:{background:e.colors.palette.monochrome_black,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_500,selected:e.colors.palette.green_500},white:{background:e.colors.palette.monochrome_white,color:e.colors.palette.monochrome_black,hover:e.colors.palette.monochrome_300,selected:e.colors.palette.monochrome_500},yellow:{background:e.colors.palette.yellow_500,color:e.colors.palette.monochrome_white,hover:e.colors.palette.green_400,selected:e.colors.palette.monochrome_black}}},I=p(_||(_=n(['\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: "Sohne Halbfett", "Helvetica", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ',";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(https://www.gantri.com/static/fonts/soehne-web-buch.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-dreiviertelfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(https://www.gantri.com/static/fonts/public/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig-kursiv.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n"],['\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: "Sohne Halbfett", "Helvetica", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ',";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(https://www.gantri.com/static/fonts/soehne-web-buch.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-dreiviertelfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(https://www.gantri.com/static/fonts/public/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig-kursiv.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n"])),z("gold_400")),j=function(e){var n=e.children,o=e.theme;return l.createElement(u,{theme:o},l.createElement(I,null),n)};j.defaultProps={theme:F};var E,B,M,D=g({lg:"75em",md:"64em",sm:"45.06em"}),T=function(e,n){var o;if(f(e)){var r=e,t=r.lg,i=r.md,a=r.sm;switch(n){case"lg":default:return t;case"md":return null!=i?i:t;case"sm":return null!==(o=null!=a?a:i)&&void 0!==o?o:t}}return e};function R(r){var t="",i="",a="";return r.forEach((function(n){if(n.lookIn&&Array.isArray(n.resolutionAwareProp))throw new Error("Specifying lookIn property when resolutionAwareProp is an array is not allowed");var r=function(n){var r;if(Array.isArray(n))return n.reduce((function(n,r){return e(e({},n),{lg:o(o([],n.lg,!0),[T(r,"lg")],!1),md:o(o([],n.md,!0),[T(r,"md")],!1),sm:o(o([],n.sm,!0),[T(r,"sm")],!1)})}),{lg:[],md:[],sm:[]});if(f(n)){var t=n,i=t.lg,a=t.md,l=t.sm;return{lg:i,md:null!=a?a:i,sm:null!==(r=null!=l?l:a)&&void 0!==r?r:i}}return{lg:n,md:n,sm:n}}(n.resolutionAwareProp),l=r.lg,s=r.md,c=r.sm;if(void 0!==l){var m=n.lookIn&&n.lookIn[l]||l;t+="".concat(n.cssProperty,": ").concat(n.valueFormatter?n.valueFormatter(m,"lg"):m," ").concat(n.isImportant?"!important":"",";;")}if(void 0!==s){m=n.lookIn&&n.lookIn[s]||s;i+="".concat(n.cssProperty,": ").concat(n.valueFormatter?n.valueFormatter(m,"md"):m," ").concat(n.isImportant?"!important":"",";;")}if(void 0!==c){m=n.lookIn&&n.lookIn[c]||c;a+="".concat(n.cssProperty,": ").concat(n.valueFormatter?n.valueFormatter(m,"sm"):m," ").concat(n.isImportant?"!important":"",";")}})),h(M||(M=n(["\n ","\n\n ","\n\n ","\n "],["\n ","\n\n ","\n\n ","\n "])),t,i&&D.lessThan("md")(E||(E=n(["\n ","\n "],["\n ","\n "])),i),a&&D.lessThan("sm")(B||(B=n(["\n ","\n "],["\n ","\n "])),a))}var L,W,N,V,G=d.div.withConfig({displayName:"StyledBoxContainer",componentId:"sc-1k2wf0b-0"})(W||(W=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.backgroundColor,r=e.padding,t=e.verticalPadding,i=e.horizontalPadding,a=e.paddingLeft,l=void 0===a?i:a,s=e.paddingRight,c=void 0===s?i:s,m=e.paddingTop,d=void 0===m?t:m,p=e.paddingBottom,u=void 0===p?t:p,g=e.margin,f=e.verticalMargin,w=e.horizontalMargin,y=e.marginLeft,v=void 0===y?w:y,P=e.marginRight,b=void 0===P?w:P,_=e.marginTop,x=void 0===_?f:_,k=e.marginBottom,A=void 0===k?f:k,F=e.theme,S=e.borderRadius,C=e.hidden,H=e.textAlign,I=e.height,j=e.minHeight,E=e.width,B=e.minWidth,M=e.maxWidth,D=e.overflow,T=e.alignSelf,W=e.justifySelf,N=[{cssProperty:"background-color",resolutionAwareProp:o,valueFormatter:function(e){return z(e)}},{cssProperty:"padding",lookIn:F.dimensions.spacing,resolutionAwareProp:r},{cssProperty:"padding-left",lookIn:F.dimensions.spacing,resolutionAwareProp:l},{cssProperty:"padding-right",lookIn:F.dimensions.spacing,resolutionAwareProp:c},{cssProperty:"padding-top",lookIn:F.dimensions.spacing,resolutionAwareProp:d},{cssProperty:"padding-bottom",lookIn:F.dimensions.spacing,resolutionAwareProp:u},{cssProperty:"margin",lookIn:F.dimensions.spacing,resolutionAwareProp:g},{cssProperty:"margin-left",lookIn:F.dimensions.spacing,resolutionAwareProp:v},{cssProperty:"margin-right",lookIn:F.dimensions.spacing,resolutionAwareProp:b},{cssProperty:"margin-top",lookIn:F.dimensions.spacing,resolutionAwareProp:x},{cssProperty:"margin-bottom",lookIn:F.dimensions.spacing,resolutionAwareProp:A},{cssProperty:"display",resolutionAwareProp:C,valueFormatter:function(e){return!0===e?"none":"block"}},{cssProperty:"border-radius",resolutionAwareProp:S},{cssProperty:"text-align",resolutionAwareProp:H},{cssProperty:"width",resolutionAwareProp:E},{cssProperty:"height",resolutionAwareProp:I},{cssProperty:"min-height",resolutionAwareProp:j},{cssProperty:"min-width",resolutionAwareProp:B},{cssProperty:"max-width",resolutionAwareProp:M},{cssProperty:"align-self",resolutionAwareProp:T},{cssProperty:"justify-self",resolutionAwareProp:W}];return h(L||(L=n(["\n position: relative;\n overflow: ",";\n ",";\n "],["\n position: relative;\n overflow: ",";\n ",";\n "])),D,R(N))})),K=function(n){var o=e(e({},x),n);return a.createElement(G,e({},o))},q=d.svg.withConfig({displayName:"StyledSvgIcon",componentId:"sc-1jh49e-0"})(V||(V=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.size,r=e.nwidth,t=e.nheight,i=e.cursor,a=e.top,l=e.bottom,s=e.right,c=e.left,m=[{cssProperty:"width",resolutionAwareProp:null!=r?r:o},{cssProperty:"height",resolutionAwareProp:null!=t?t:o}];return h(N||(N=n(["\n ",";\n cursor: ",";\n position: relative;\n top: ",";\n bottom: ",";\n right: ",";\n left: ",";\n "],["\n ",";\n cursor: ",";\n position: relative;\n top: ",";\n bottom: ",";\n right: ",";\n left: ",";\n "])),R(m),i,a||"unset",l||"unset",s||"unset",c||"unset")})),Y=function(n){var o=n.name,a=n.width,c=n.height,m=r(n,["name","width","height"]),d=s(null),p=d[0],u=d[1];return y((function(){return t(void 0,void 0,void 0,(function(){var e,n,r;return i(this,(function(t){switch(t.label){case 0:return o?(e=o.split(":"),n="".concat(e[0],"/").concat(w(e[1])).replace("_","").replace(/ /g,""),[4,import("./generated/".concat(n,".tsx"))]):[3,2];case 1:r=t.sent(),u(r.default),t.label=2;case 2:return[2]}}))}))}),[o]),p?l.createElement(q,e({as:p,nheight:c,nwidth:a},m)):null};Y.defaultProps={color:"link",cursor:"unset",opacity:1,size:"2rem"};var J,O,Q=d.p.withConfig({displayName:"StyledText",componentId:"sc-uyk9pj-0"})(O||(O=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.theme,r=e.variant,t=e.transform,i=e.color,a=e.align,l=e.lineHeight,s=e.fontSize,c=e.fontWeight,m=e.whiteSpace,d=e.padding,p=e.verticalPadding,u=e.horizontalPadding,g=e.paddingLeft,f=void 0===g?u:g,w=e.paddingRight,y=void 0===w?u:w,v=e.paddingTop,P=void 0===v?p:v,b=e.paddingBottom,_=void 0===b?p:b,x=e.margin,k=e.verticalMargin,A=e.horizontalMargin,F=e.marginLeft,S=void 0===F?A:F,z=e.marginRight,C=void 0===z?A:z,H=e.marginTop,I=void 0===H?k:H,j=e.marginBottom,E=void 0===j?k:j,B=e.alignSelf,M=e.justifySelf,D=e.display,T=e.hidden,L=e.minWidth,W=e.maxWidth,N=e.letterSpacing,V=e.textShadow,G=e.onClick,K=r||"p2",q=i||"",Y=s||{lg:o.fonts[K].size,md:o.fonts[K].sizeMedium,sm:o.fonts[K].sizeSmaller},O=l||{lg:o.fonts[K].lineHeight,md:o.fonts[K].lineHeightMedium,sm:o.fonts[K].lineHeightSmaller},Q=[{cssProperty:"text-align",resolutionAwareProp:a},{cssProperty:"font-family",resolutionAwareProp:{lg:o.fonts[K].family,sm:o.fonts[K].familySmaller},valueFormatter:function(e){return"".concat(e,', "Helvetica", sans-serif;')}},{cssProperty:"font-size",resolutionAwareProp:Y},{cssProperty:"line-height",resolutionAwareProp:O},{cssProperty:"min-width",resolutionAwareProp:L},{cssProperty:"max-width",resolutionAwareProp:W},{cssProperty:"padding",lookIn:o.dimensions.spacing,resolutionAwareProp:d},{cssProperty:"padding-left",lookIn:o.dimensions.spacing,resolutionAwareProp:f},{cssProperty:"padding-right",lookIn:o.dimensions.spacing,resolutionAwareProp:y},{cssProperty:"padding-top",lookIn:o.dimensions.spacing,resolutionAwareProp:P},{cssProperty:"padding-bottom",lookIn:o.dimensions.spacing,resolutionAwareProp:_},{cssProperty:"margin",lookIn:o.dimensions.spacing,resolutionAwareProp:x},{cssProperty:"margin-left",lookIn:o.dimensions.spacing,resolutionAwareProp:S},{cssProperty:"margin-right",lookIn:o.dimensions.spacing,resolutionAwareProp:C},{cssProperty:"margin-top",lookIn:o.dimensions.spacing,resolutionAwareProp:I},{cssProperty:"margin-bottom",lookIn:o.dimensions.spacing,resolutionAwareProp:E},{cssProperty:"align-self",resolutionAwareProp:B},{cssProperty:"justify-self",resolutionAwareProp:M},{cssProperty:"letter-spacing",resolutionAwareProp:N},{cssProperty:"white-space",resolutionAwareProp:m},{cssProperty:"display",resolutionAwareProp:[D,T],valueFormatter:function(e){var n=e[0];return!0===e[1]?"none":n}}];return h(J||(J=n(["\n color: ",";\n text-transform: ",";\n transition: all ",";\n font-weight: ",";\n cursor: ",";\n text-shadow: ",";\n\n ",";\n\n a {\n display: inline-block;\n font-size: inherit;\n line-height: inherit;\n }\n "],["\n color: ",";\n text-transform: ",";\n transition: all ",";\n font-weight: ",";\n cursor: ",";\n text-shadow: ",";\n\n ",";\n\n a {\n display: inline-block;\n font-size: inherit;\n line-height: inherit;\n }\n "])),o.colors.typography[q]||o.colors.palette[q]||i,t,o.transitions.base,c||o.fonts[K].fontWeight||400,G?"pointer":"unset",V,R(Q))})),U={badge:"span",hero:"h1",p0:"p",p1:"p",p2:"p",p3:"p"},X=c((function(n,o){var t,i,a=n.type,s=n.variant,c=n.tx,m=n.txValues,d=n.text,p=n.htmlText,u=n.textStyle,h=n.color,g=r(n,["type","variant","tx","txValues","text","htmlText","textStyle","color"]),f=v().t;return p?l.createElement(Q,e({as:null!==(t=null!=a?a:U[s||""])&&void 0!==t?t:s,color:null!=h?h:"black",dangerouslySetInnerHTML:{__html:p},ref:o,textStyle:u,variant:s},g)):l.createElement(Q,e({as:null!==(i=null!=a?a:U[s||""])&&void 0!==i?i:s,color:null!=h?h:"black",ref:o,textStyle:u,tx:c,variant:s},g),c?l.createElement(P,{t:f,values:m},c):d)}));X.defaultProps={color:"t1",display:"block",variant:"p2",whiteSpace:"inherit"};var Z,$,ee,ne,oe,re,te,ie={md:"15rem",sm:"14rem",xl:"17rem"},ae=d.button.withConfig({displayName:"StyledButton",componentId:"sc-12w1zik-0"})(ne||(ne=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.theme,r=e.variant,t=e.color,i=e.width,a=e.minWidth,l=e.disabled,s=e.borderRadius,c=e.alignSelf,m=e.justifySelf,d=e.hidden,p=e.size,u=[{cssProperty:"width",resolutionAwareProp:i,valueFormatter:function(e){var n;return null!==(n=ie[e])&&void 0!==n?n:e}},{cssProperty:"min-width",resolutionAwareProp:a||"unset"},{cssProperty:"border-radius",resolutionAwareProp:"action"===r?"none":s||("small"===p?"0.4rem":"4.9rem")},{cssProperty:"align-self",resolutionAwareProp:c},{cssProperty:"justify-self",resolutionAwareProp:m},{cssProperty:"display",resolutionAwareProp:d,valueFormatter:function(e){return!0===e?"none":"flex"}}];return h(ee||(ee=n(["\n &,\n &:active,\n &:focus {\n display: flex;\n ",";\n position: relative;\n border-style: solid;\n border-width: ",";\n outline: none;\n padding: 0 ",";\n cursor: ",";\n pointer-events: ",";\n opacity: ",";\n transition: ",";\n user-select: none;\n overflow: hidden;\n height: ",";\n min-width: max-content;\n\n ","\n\n ","\n }\n "],["\n &,\n &:active,\n &:focus {\n display: flex;\n ",";\n position: relative;\n border-style: solid;\n border-width: ",";\n outline: none;\n padding: 0 ",";\n cursor: ",";\n pointer-events: ",";\n opacity: ",";\n transition: ",";\n user-select: none;\n overflow: hidden;\n height: ",";\n min-width: max-content;\n\n ","\n\n ","\n }\n "])),R(u),"default"===r?"unset":"1px","small"===p?"1rem":"2.4rem",l?"not-allowed":"pointer",l?"none":"all",l?.3:1,o.transitions.base,"large"===p?"4.6rem":"3.4rem",function(e,o,r){var t,i=null!==(t=H(r)[e])&&void 0!==t?t:H(r).white,a=!("secondary"===o||"action"===o);return h(Z||(Z=n(["\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n\n &:hover {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n\n &:active {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n "],["\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n\n &:hover {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n\n &:active {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n "])),a?i.background:"transparent",i.background,a?i.color||i.background:i.background||i.color,a?i.hover:"transparent",i.hover,a?i.color||i.hover:i.hover||i.color,a?i.selected:"transparent",i.selected,a?i.color||i.selected:i.selected||i.color)}(String(t),r,o),"action"===r&&h($||($=n(["\n border: none;\n padding: 0;\n width: max-content;\n min-width: 0;\n\n &:hover,\n &:active {\n border: unset;\n\n * {\n text-decoration: underline;\n }\n }\n "],["\n border: none;\n padding: 0;\n width: max-content;\n min-width: 0;\n\n &:hover,\n &:active {\n border: unset;\n\n * {\n text-decoration: underline;\n }\n }\n "]))))})),le=d.div.withConfig({displayName:"StyledButtonContent",componentId:"sc-12w1zik-1"})(te||(te=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.theme,r=e.textVariant;return h(re||(re=n(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n transform: translateY(0);\n opacity: 1;\n transition: ",";\n\n & > *:not(:last-child) {\n margin-right: ",";\n position: relative;\n\n ","\n }\n "],["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n transform: translateY(0);\n opacity: 1;\n transition: ",";\n\n & > *:not(:last-child) {\n margin-right: ",";\n position: relative;\n\n ","\n }\n "])),o.transitions.base,"p3"===r?".6rem":".8rem",D.lessThan("sm")(oe||(oe=n(["\n margin-right: ",";\n "],["\n margin-right: ",";\n "])),"p3"===r?".3rem":".5rem"))})),se=c((function(n,o){var t=n.tx,i=n.text,l=n.txValues,s=n.textVariant,c=n.textLineHeight,m=n.fontSize,d=n.type,p=n.disabled,u=n.icon,h=n.iconLocation,g=n.processing,f=n.onClick,w=r(n,["tx","text","txValues","textVariant","textLineHeight","fontSize","type","disabled","icon","iconLocation","processing","onClick"]);return a.createElement(ae,e({disabled:p,ref:o,textVariant:s,type:d,onClick:f},w),a.createElement(le,e({},w),u&&!g&&"left"===h&&u,"action"!==w.variant&&g&&a.createElement(Y,{name:"animated:loader_24",size:"1.6rem"}),(t||i)&&a.createElement(X,{display:"contents",fontSize:m,lineHeight:c,text:i,textStyle:"bold",tx:t,txValues:l,variant:s,whiteSpace:"nowrap"}),u&&"right"===h&&u))}));se.defaultProps={color:"primary",disabled:!1,iconLocation:"left",size:"large",textLineHeight:"unset",textVariant:"p2",type:"button",variant:"primary"};var ce,me,de=d.div.withConfig({displayName:"StyledCell",componentId:"sc-hxvxkk-0"})(me||(me=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.width,r=e.height,t=e.row,i=e.column,a=e.hidden,l=e.textAlign,s=e.alignSelf,c=e.alignItems,m=e.alignContent,d=e.justifyContent,p=e.justifyItems,u=e.gap,g=e.columnGap,f=void 0===g?u:g,w=e.rowGap,y=void 0===w?u:w,v=e.position,P=e.borderRadius,b=e.padding,_=e.backgroundColor,x=e.verticalPadding,k=e.horizontalPadding,A=e.paddingLeft,F=void 0===A?k:A,S=e.paddingRight,H=void 0===S?k:S,I=e.paddingTop,j=void 0===I?x:I,E=e.paddingBottom,B=void 0===E?x:E,M=e.theme,D=[{cssProperty:"background-color",resolutionAwareProp:_,valueFormatter:function(e){return z(e,M)}},{cssProperty:"display",resolutionAwareProp:a,valueFormatter:function(e){return e?"none":"grid"}},{cssProperty:"text-align",resolutionAwareProp:l},{cssProperty:"align-self",resolutionAwareProp:s},{cssProperty:"align-items",resolutionAwareProp:c},{cssProperty:"align-content",resolutionAwareProp:m},{cssProperty:"grid-column-gap",resolutionAwareProp:f,valueFormatter:function(e){return C(e,M)}},{cssProperty:"grid-row-gap",resolutionAwareProp:y,valueFormatter:function(e){return C(e,M)}},{cssProperty:"justify-content",resolutionAwareProp:d},{cssProperty:"justify-items",resolutionAwareProp:p},{cssProperty:"border-radius",resolutionAwareProp:P},{cssProperty:"padding",lookIn:M.dimensions.spacing,resolutionAwareProp:b},{cssProperty:"padding-left",lookIn:M.dimensions.spacing,resolutionAwareProp:F},{cssProperty:"padding-right",lookIn:M.dimensions.spacing,resolutionAwareProp:H},{cssProperty:"padding-top",lookIn:M.dimensions.spacing,resolutionAwareProp:j},{cssProperty:"padding-bottom",lookIn:M.dimensions.spacing,resolutionAwareProp:B}];return o?D.push({cssProperty:"grid-column",resolutionAwareProp:o,valueFormatter:function(e){return"span ".concat(e)}}):i&&D.push({cssProperty:"grid-column",resolutionAwareProp:i}),r?D.push({cssProperty:"grid-row",resolutionAwareProp:r,valueFormatter:function(e){return"span ".concat(e)}}):t&&D.push({cssProperty:"grid-row",resolutionAwareProp:t}),h(ce||(ce=n(["\n display: grid;\n position: ",";\n ",";\n "],["\n display: grid;\n position: ",";\n ",";\n "])),v,R(D))})),pe=c((function(n,o){var t=n.children,i=r(n,["children"]);return a.createElement(de,e({ref:o},i),t)}));pe.defaultProps={column:null,row:null,textAlign:"left"};var ue,he,ge=d(K).withConfig({displayName:"StyledFlexContainer",componentId:"sc-17zjsog-0"})(he||(he=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.direction,r=e.justifyContent,t=e.alignItems,i=e.backgroundColor,a=e.gap,l=e.hidden,s=e.height,c=e.width,m=e.theme,d=R([{cssProperty:"flex-direction",resolutionAwareProp:o},{cssProperty:"justify-content",resolutionAwareProp:r},{cssProperty:"align-items",resolutionAwareProp:t},{cssProperty:"display",resolutionAwareProp:l,valueFormatter:function(e){return!0===e?"none":"flex"}},{cssProperty:"background-color",resolutionAwareProp:i,valueFormatter:function(e){return z(e,m)}},{cssProperty:"height",resolutionAwareProp:s},{cssProperty:"width",resolutionAwareProp:c},{cssProperty:"gap",resolutionAwareProp:a,valueFormatter:function(e){return C(e,m)}}]);return h(ue||(ue=n(["\n display: flex;\n width: 100%;\n ","\n "],["\n display: flex;\n width: 100%;\n ","\n "])),d)})),fe=function(n){return l.createElement(ge,e({},n))};fe.defaultProps={alignItems:"unset",borderRadius:"unset",direction:"row",height:"unset",justifyContent:"unset",padding:"unset"};var we,ye,ve,Pe,be=function(e){return"string"==typeof e?e:"repeat(".concat(e,", 1fr);")},_e=function(e){return"string"==typeof e?e:"repeat(".concat(e,", max-content);")},xe=d.div.withConfig({displayName:"StyledGrid",componentId:"sc-b5we8g-0"})(ye||(ye=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.width,r=e.height,t=e.columns,i=e.autoColumns,a=e.rows,l=e.autoRows,s=e.flow,c=e.gap,m=e.columnGap,d=void 0===m?c:m,p=e.rowGap,u=void 0===p?c:p,g=e.padding,f=e.horizontalPadding,w=void 0===f?g:f,y=e.paddingLeft,v=void 0===y?w:y,P=e.paddingRight,b=void 0===P?w:P,_=e.verticalPadding,x=void 0===_?g:_,k=e.paddingTop,A=void 0===k?x:k,F=e.paddingBottom,S=void 0===F?x:F,H=e.margin,I=e.horizontalMargin,j=void 0===I?H:I,E=e.marginLeft,B=void 0===E?j:E,M=e.marginRight,D=void 0===M?j:M,T=e.verticalMargin,L=void 0===T?H:T,W=e.marginTop,N=void 0===W?L:W,V=e.marginBottom,G=void 0===V?L:V,K=e.justifyContent,q=e.alignContent,Y=e.justifyItems,J=e.justifySelf,O=e.alignItems,Q=e.hidden,U=e.maxWidth,X=e.minWidth,Z=e.minHeight,$=e.maxHeight,ee=e.backgroundColor,ne=e.border,oe=e.borderRadius,re=e.theme,te=[{cssProperty:"grid-auto-flow",resolutionAwareProp:s},{cssProperty:"grid-auto-columns",resolutionAwareProp:i},{cssProperty:"grid-auto-rows",resolutionAwareProp:l},{cssProperty:"grid-template-columns",resolutionAwareProp:t,valueFormatter:be},{cssProperty:"grid-template-rows",resolutionAwareProp:a,valueFormatter:_e},{cssProperty:"grid-column-gap",resolutionAwareProp:d,valueFormatter:function(e){return C(e,re)}},{cssProperty:"grid-row-gap",resolutionAwareProp:u,valueFormatter:function(e){return C(e,re)}},{cssProperty:"padding-left",resolutionAwareProp:v,valueFormatter:function(e){return C(e,re)}},{cssProperty:"padding-right",resolutionAwareProp:b,valueFormatter:function(e){return C(e,re)}},{cssProperty:"padding-top",resolutionAwareProp:A,valueFormatter:function(e){return C(e,re)}},{cssProperty:"padding-bottom",resolutionAwareProp:S,valueFormatter:function(e){return C(e,re)}},{cssProperty:"margin-left",resolutionAwareProp:B,valueFormatter:function(e){return C(e,re)}},{cssProperty:"margin-right",resolutionAwareProp:D,valueFormatter:function(e){return C(e,re)}},{cssProperty:"margin-top",resolutionAwareProp:N,valueFormatter:function(e){return C(e,re)}},{cssProperty:"margin-bottom",resolutionAwareProp:G,valueFormatter:function(e){return C(e,re)}},{cssProperty:"align-content",resolutionAwareProp:q},{cssProperty:"justify-content",resolutionAwareProp:K},{cssProperty:"align-items",resolutionAwareProp:O},{cssProperty:"justify-items",resolutionAwareProp:Y},{cssProperty:"justify-self",resolutionAwareProp:J},{cssProperty:"display",resolutionAwareProp:Q,valueFormatter:function(e){return!0===e?"none":"grid"}},{cssProperty:"max-width",resolutionAwareProp:U},{cssProperty:"min-width",resolutionAwareProp:X},{cssProperty:"min-height",resolutionAwareProp:Z},{cssProperty:"max-height",resolutionAwareProp:$},{cssProperty:"background-color",resolutionAwareProp:ee,valueFormatter:function(e){return z(e,re)}},{cssProperty:"width",resolutionAwareProp:o},{cssProperty:"height",resolutionAwareProp:r},{cssProperty:"border-radius",resolutionAwareProp:oe}];return h(we||(we=n(["\n display: grid;\n position: relative;\n border: ",";\n ",";\n "],["\n display: grid;\n position: relative;\n border: ",";\n ",";\n "])),ne||"unset",R(te))})),ke=c((function(n,o){var t=n.children,i=r(n,["children"]);return a.createElement(xe,e({ref:o},i),t)}));ke.defaultProps={backgroundColor:"unset",flow:"row",gap:{lg:"s3",md:"s3",sm:"s1"},height:"unset",maxWidth:"unset",padding:"unset",width:"unset"},ve||(ve=n(["\n ","\n"],["\n ","\n"])),Pe||(Pe=n(["\n ","\n"],["\n ","\n"])),new b({cloud:{cloudName:"gantri"},url:{secure:!0}});var Ae,Fe,Se,ze,Ce,He,Ie=d.div.withConfig({displayName:"StyledRadioContainer",componentId:"sc-kxjg4j-0"})(Ae||(Ae=n(["\n cursor: pointer;\n"],["\n cursor: pointer;\n"]))),je=d.div.withConfig({displayName:"StyledRadio",componentId:"sc-kxjg4j-1"})(Se||(Se=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.theme;return h(Fe||(Fe=n(["\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n border: 1px solid ",";\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n cursor: pointer;\n "],["\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n border: 1px solid ",";\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n cursor: pointer;\n "])),o.colors.palette.monochrome_200)})),Ee=d.input.withConfig({displayName:"StyledRadioInput",componentId:"sc-kxjg4j-2"})(ze||(ze=n(["\n width: 20px;\n height: 20px;\n opacity: 0;\n cursor: pointer;\n"],["\n width: 20px;\n height: 20px;\n opacity: 0;\n cursor: pointer;\n"]))),Be=d.span.withConfig({displayName:"StyledRadioMarker",componentId:"sc-kxjg4j-3"})(He||(He=n(["\n ","\n"],["\n ","\n"])),(function(e){var o=e.theme;return h(Ce||(Ce=n(["\n position: absolute;\n width: calc(100% - 1.2rem);\n height: calc(100% - 1.2rem);\n display: inline-block;\n border-radius: 50%;\n background-color: ",";\n "],["\n position: absolute;\n width: calc(100% - 1.2rem);\n height: calc(100% - 1.2rem);\n display: inline-block;\n border-radius: 50%;\n background-color: ",";\n "])),o.colors.palette.monochrome_black)})),Me=function(n){var o=n.flow,t=n.children,i=n.justifyContent,a=n.justifyItems,s=n.alignContent,c=n.maxWidth,m=n.minHeight,d=n.height,p=r(n,["flow","children","justifyContent","justifyItems","alignContent","maxWidth","minHeight","height"]);return l.createElement(ke,e({alignContent:s,alignItems:"center",columns:"column"===o?"minmax(min-content,".concat(c||"max-content",")"):"unset",flow:o,height:d,justifyContent:i,justifyItems:a,maxWidth:c,minHeight:m},p),t)};Me.defaultProps={alignContent:"start",flow:"row",gap:"s1",height:"100%",horizontalPadding:{lg:"s3",sm:"s1"},justifyContent:"unset",padding:"unset"};var De=function(e){var n=e.name,o=e.labelTx,r=e.labelText,t=e.labelPosition,i=e.labelVariant,a=e.value,s=e.groupValue,c=e.onChange,d=e.onSelected,p=m(),u=a===s;return l.createElement(Ie,null,l.createElement(Me,{flow:"column",gap:"1rem",padding:"unset"},(o||r)&&"left"===t&&l.createElement(X,{color:u?"t1":"t2",text:r,tx:o,variant:i}),l.createElement(je,null,u&&l.createElement(Be,null),l.createElement(Ee,{checked:u,id:"".concat(n,"-").concat(a),name:n,ref:p,type:"radio",value:a,onChange:function(e){c&&c(e),d&&d(e.target.value)}})),(o||r)&&"right"===t&&l.createElement(X,{color:u?"t1":"t2",htmlFor:"".concat(n,"-").concat(a),text:r,tx:o,variant:i})))};De.defaultProps={labelPosition:"right",labelVariant:"p3",name:""};export{K as Box,se as Button,pe as Cell,fe as Flex,ke as Grid,Y as Icon,De as Radio,Me as Stack,j as ThemeProvider,X as Typography,H as combinationsByColor,S as darkTheme,z as getThemeColor,C as getThemeSpacing,F as lightTheme,D as media,k as palette};

package/dist/index.umd.js ADDED Viewed

@@ -0,0 +1 @@

+ !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("styled-components"),require("styled-media-query"),require("lodash.isobject"),require("lodash/startCase"),require("react-use"),require("react-i18next"),require("react-spring"),require("@cloudinary/url-gen"),require("@cloudinary/url-gen/actions/resize"),require("@cloudinary/url-gen/actions"),require("@cloudinary/url-gen/qualifiers")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","styled-media-query","lodash.isobject","lodash/startCase","react-use","react-i18next","react-spring","@cloudinary/url-gen","@cloudinary/url-gen/actions/resize","@cloudinary/url-gen/actions","@cloudinary/url-gen/qualifiers"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).GantriComponents={},e.React,e.styled,e.styledMediaQuery,e.isObject,e.startCase,e.reactUse,e.reactI18next,null,e.urlGen)}(this,(function(e,n,o,t,r,i,a,l,s,c){"use strict";function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(o){if("default"!==o){var t=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(n,o,t.get?t:{enumerable:!0,get:function(){return e[o]}})}})),n.default=e,Object.freeze(n)}var m=d(n),p=u(n),f=d(o),h=d(r),g=d(i),w=function(){return w=Object.assign||function(e){for(var n,o=1,t=arguments.length;o<t;o++)for(var r in n=arguments[o])Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r]);return e},w.apply(this,arguments)};function y(e,n){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&n.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(t=Object.getOwnPropertySymbols(e);r<t.length;r++)n.indexOf(t[r])<0&&Object.prototype.propertyIsEnumerable.call(e,t[r])&&(o[t[r]]=e[t[r]])}return o}function v(e,n,o,t){return new(o||(o=Promise))((function(r,i){function a(e){try{s(t.next(e))}catch(e){i(e)}}function l(e){try{s(t.throw(e))}catch(e){i(e)}}function s(e){var n;e.done?r(e.value):(n=e.value,n instanceof o?n:new o((function(e){e(n)}))).then(a,l)}s((t=t.apply(e,n||[])).next())}))}function P(e,n){var o,t,r,i,a={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return i={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function l(i){return function(l){return function(i){if(o)throw new TypeError("Generator is already executing.");for(;a;)try{if(o=1,t&&(r=2&i[0]?t.return:i[0]?t.throw||((r=t.return)&&r.call(t),0):t.next)&&!(r=r.call(t,i[1])).done)return r;switch(t=0,r&&(i=[2&i[0],r.value]),i[0]){case 0:case 1:r=i;break;case 4:return a.label++,{value:i[1],done:!1};case 5:a.label++,t=i[1],i=[0];continue;case 7:i=a.ops.pop(),a.trys.pop();continue;default:if(!(r=a.trys,(r=r.length>0&&r[r.length-1])||6!==i[0]&&2!==i[0])){a=0;continue}if(3===i[0]&&(!r||i[1]>r[0]&&i[1]<r[3])){a.label=i[1];break}if(6===i[0]&&a.label<r[1]){a.label=r[1],r=i;break}if(r&&a.label<r[2]){a.label=r[2],a.ops.push(i);break}r[2]&&a.ops.pop(),a.trys.pop();continue}i=n.call(e,a)}catch(e){i=[6,e],t=0}finally{o=r=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,l])}}}function b(e,n,o){if(o||2===arguments.length)for(var t,r=0,i=n.length;r<i;r++)!t&&r in n||(t||(t=Array.prototype.slice.call(n,0,r)),t[r]=n[r]);return e.concat(t||Array.prototype.slice.call(n))}function _(e,n){return Object.defineProperty?Object.defineProperty(e,"raw",{value:n}):e.raw=n,e}var x,k={height:"unset",margin:"unset",maxWidth:"100vw",overflow:"unset",padding:"unset",width:"unset"},A={blue_100:"#ECF1FF",blue_200:"#BDCFFF",blue_300:"#7393E8",blue_400:"#335DC9",blue_500:"#151852",gold_100:"#FCF3E6",gold_200:"#EAD0AF",gold_300:"#D5AF7B",gold_400:"#BF8E47",gold_500:"#946A18",green_100:"#DFFBEC",green_200:"#9FF4C7",green_300:"#00cc88",green_400:"#00855B",green_500:"#25352F",monochrome_050:"#F8F8F8",monochrome_100:"#F0F0F0",monochrome_200:"#DFDFDF",monochrome_300:"#CECECE",monochrome_400:"#A1A1A1",monochrome_500:"#848484",monochrome_600:"#8F8C8B",monochrome_700:"#686868",monochrome_800:"#343434",monochrome_900:"#1C1C1C",monochrome_black:"#000000",monochrome_white:"#FFFFFF",pink_300:"#FFD8F4",pink_400:"#FFB1BA",pink_500:"#E00C7B",red_100:"#FFF0F1",red_200:"#FFCBD0",red_300:"#F47783",red_400:"#D43444",red_500:"#920110",translucent_black:"rgba(28, 28, 28, 0.7)",translucent_cream:"rgba(245, 245, 245, 0.2)",translucent_white:"rgba(255, 255, 255, 0.7)",yellow_100:"#FFFBF2",yellow_200:"#FFF5DB",yellow_300:"#FFECB4",yellow_400:"#FADC87",yellow_500:"#BD8C02"},S={border:"1px solid ".concat(A.monochrome_300),borderRadius:".6rem",dimensions:{gridGutter:"2.4rem",headerHeight:{lg:"6.4rem",sm:"4.8rem"},maxWidth:"78rem",spacing:{s1:"1.6rem",s2:"2rem",s3:"2.4rem",s4:"4rem",s5:"6rem",s6:"12rem"}},fonts:{boldFontFamily:"Sohne Halbfett",h1:{family:"Sohne Halbfett",lineHeight:"7rem",lineHeightMedium:"5rem",lineHeightSmaller:"5rem",size:"5.8rem",sizeMedium:"4rem",sizeSmaller:"4rem"},h2:{family:"Sohne Halbfett",lineHeight:"4.8rem",lineHeightMedium:"3.4rem",lineHeightSmaller:"3.4rem",size:"3.8rem",sizeMedium:"2.8rem",sizeSmaller:"2.8rem"},h3:{family:"Sohne Dreiviertelfett",lineHeight:"3.6rem",lineHeightMedium:"2.6rem",lineHeightSmaller:"2.6rem",size:"2.8rem",sizeMedium:"2rem",sizeSmaller:"2rem"},h4:{family:"Sohne Dreiviertelfett",lineHeight:"2.2rem",lineHeightMedium:"2.2rem",lineHeightSmaller:"2.2rem",size:"1.8rem",sizeMedium:"1.8rem",sizeSmaller:"1.8rem"},h5:{family:"Sohne Halbfett",lineHeight:"2rem",lineHeightMedium:"2rem",lineHeightSmaller:"2rem",size:"1.6rem",sizeMedium:"1.6rem",sizeSmaller:"1.6rem"},hero:{family:"Sohne Kraftig",familyMedium:"Sohne Halbfett",familySmaller:"Sohne Halbfett",lineHeight:"8.6rem",lineHeightMedium:"5.8rem",lineHeightSmaller:"5.8rem",size:"7.2rem",sizeMedium:"5.2rem",sizeSmaller:"5.2rem"},p0:{family:"Sohne Buch",lineHeight:"3.6rem",lineHeightMedium:"3rem",lineHeightSmaller:"3rem",size:"2.4rem",sizeMedium:"2.2rem",sizeSmaller:"2.2rem"},p1:{family:"Sohne Buch",lineHeight:"2.7rem",lineHeightMedium:"2.7rem",lineHeightSmaller:"2.7rem",size:"1.8rem",sizeMedium:"1.8rem",sizeSmaller:"1.8rem"},p2:{family:"Sohne Buch",lineHeight:"2.2rem",lineHeightSmaller:"2.2rem",size:"1.5rem",sizeSmaller:"1.5rem"},p3:{family:"Sohne Buch",lineHeight:"1.5rem",lineHeightSmaller:"1.5rem",size:"1.2rem",sizeSmaller:"1.2rem"},regularFontFamily:"Sohne Buch"},shadow:"0 .2rem .6rem rgba(0, 0, 0, 0.12)",transitions:{base:"0.15s ease",slow:"0.3s ease",slowest:"2s ease",turtle:"0.8s ease"}},F=w(w({},S),{colors:{dividers:{t1:A.monochrome_100,t2:A.monochrome_300,t3:A.monochrome_900},iconography:{alert:A.red_400,link:A.green_400,t1:A.monochrome_500,t2:A.monochrome_900,t3:A.monochrome_white,warning:A.gold_400},palette:A,surface:{alert:A.red_100,hover:A.monochrome_050,level1:A.monochrome_white,level2:A.monochrome_100,level3:A.monochrome_200,selected:A.monochrome_050,success:A.blue_100,successAlt:A.green_400,warning:A.yellow_100},typography:{alert:A.red_400,alt:A.monochrome_white,link:A.green_400,success:A.blue_400,t1:A.monochrome_900,t2:A.monochrome_500,t3:A.monochrome_300,warning:A.gold_400}},name:"Light Theme"}),z=w(w({},S),{colors:{dividers:{t1:A.monochrome_600,t2:A.monochrome_400,t3:A.monochrome_white},iconography:{alert:A.red_200,link:A.green_300,t1:A.monochrome_300,t2:A.monochrome_100,t3:A.monochrome_900,warning:A.gold_200},palette:A,surface:{alert:A.red_500,hover:A.monochrome_800,level1:A.monochrome_900,level2:A.monochrome_800,level3:A.monochrome_600,selected:A.monochrome_800,success:A.blue_500,successAlt:A.blue_100,warning:A.gold_500},typography:{alert:A.red_200,alt:A.monochrome_900,link:A.green_300,success:A.blue_200,t1:A.monochrome_white,t2:A.monochrome_300,t3:A.monochrome_500,warning:A.gold_200}},name:"Dark Theme"}),C=function(e,n){var o,t;return void 0===n&&(n=F),null!==(t=null===(o=n.colors.palette)||void 0===o?void 0:o[e])&&void 0!==t?t:e},I=function(e,n){var o;return void 0===n&&(n=F),null!==(o=n.dimensions.spacing[e])&&void 0!==o?o:"default"===e?n.dimensions.gridGutter:null!=e?e:"unset"},H=function(e){return void 0===e&&(e=F),{alert:{background:e.colors.palette.red_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.red_300,selected:e.colors.palette.red_500},black:{background:e.colors.palette.monochrome_900,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_500,selected:e.colors.palette.green_500},blue:{background:e.colors.palette.blue_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.blue_300,selected:e.colors.palette.blue_500},gold:{background:e.colors.palette.gold_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.gold_300,selected:e.colors.palette.gold_500},green:{background:e.colors.palette.green_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.green_300,selected:e.colors.palette.green_500},grey:{background:e.colors.palette.monochrome_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_300,selected:e.colors.palette.monochrome_500},greyLight:{background:e.colors.palette.monochrome_200,color:e.colors.palette.monochrome_black,hover:e.colors.palette.monochrome_300,selected:e.colors.palette.monochrome_400},pink:{background:e.colors.palette.pink_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.red_300,selected:e.colors.palette.monochrome_black},primary:{background:e.colors.palette.green_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.green_300,selected:e.colors.palette.green_500},secondary:{background:e.colors.palette.green_400,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_500,selected:e.colors.palette.green_500},secondaryAlt:{background:e.colors.palette.monochrome_black,color:e.colors.palette.monochrome_white,hover:e.colors.palette.monochrome_500,selected:e.colors.palette.green_500},white:{background:e.colors.palette.monochrome_white,color:e.colors.palette.monochrome_black,hover:e.colors.palette.monochrome_300,selected:e.colors.palette.monochrome_500},yellow:{background:e.colors.palette.yellow_500,color:e.colors.palette.monochrome_white,hover:e.colors.palette.green_400,selected:e.colors.palette.monochrome_black}}},j=o.createGlobalStyle(x||(x=_(['\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: "Sohne Halbfett", "Helvetica", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ',";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(https://www.gantri.com/static/fonts/soehne-web-buch.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-dreiviertelfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(https://www.gantri.com/static/fonts/public/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig-kursiv.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n"],['\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: \'Sohne Buch\', "Helvetica", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: "Sohne Halbfett", "Helvetica", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ',";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(https://www.gantri.com/static/fonts/soehne-web-buch.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-dreiviertelfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(https://www.gantri.com/static/fonts/public/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig-kursiv.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n"])),C("gold_400")),E=function(e){var n=e.children,t=e.theme;return m.default.createElement(o.ThemeProvider,{theme:t},m.default.createElement(j,null),n)};E.defaultProps={theme:F};var B,M,T,R=t.generateMedia({lg:"75em",md:"64em",sm:"45.06em"}),O=function(e,n){var o;if(h.default(e)){var t=e,r=t.lg,i=t.md,a=t.sm;switch(n){case"lg":default:return r;case"md":return null!=i?i:r;case"sm":return null!==(o=null!=a?a:i)&&void 0!==o?o:r}}return e};function D(e){var n="",t="",r="";return e.forEach((function(e){if(e.lookIn&&Array.isArray(e.resolutionAwareProp))throw new Error("Specifying lookIn property when resolutionAwareProp is an array is not allowed");var o=function(e){var n;if(Array.isArray(e))return e.reduce((function(e,n){return w(w({},e),{lg:b(b([],e.lg,!0),[O(n,"lg")],!1),md:b(b([],e.md,!0),[O(n,"md")],!1),sm:b(b([],e.sm,!0),[O(n,"sm")],!1)})}),{lg:[],md:[],sm:[]});if(h.default(e)){var o=e,t=o.lg,r=o.md,i=o.sm;return{lg:t,md:null!=r?r:t,sm:null!==(n=null!=i?i:r)&&void 0!==n?n:t}}return{lg:e,md:e,sm:e}}(e.resolutionAwareProp),i=o.lg,a=o.md,l=o.sm;if(void 0!==i){var s=e.lookIn&&e.lookIn[i]||i;n+="".concat(e.cssProperty,": ").concat(e.valueFormatter?e.valueFormatter(s,"lg"):s," ").concat(e.isImportant?"!important":"",";;")}if(void 0!==a){s=e.lookIn&&e.lookIn[a]||a;t+="".concat(e.cssProperty,": ").concat(e.valueFormatter?e.valueFormatter(s,"md"):s," ").concat(e.isImportant?"!important":"",";;")}if(void 0!==l){s=e.lookIn&&e.lookIn[l]||l;r+="".concat(e.cssProperty,": ").concat(e.valueFormatter?e.valueFormatter(s,"sm"):s," ").concat(e.isImportant?"!important":"",";")}})),o.css(T||(T=_(["\n ","\n\n ","\n\n ","\n "],["\n ","\n\n ","\n\n ","\n "])),n,t&&R.lessThan("md")(B||(B=_(["\n ","\n "],["\n ","\n "])),t),r&&R.lessThan("sm")(M||(M=_(["\n ","\n "],["\n ","\n "])),r))}var q,L,W,N,V=f.default.div.withConfig({displayName:"StyledBoxContainer",componentId:"sc-1k2wf0b-0"})(L||(L=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.backgroundColor,t=e.padding,r=e.verticalPadding,i=e.horizontalPadding,a=e.paddingLeft,l=void 0===a?i:a,s=e.paddingRight,c=void 0===s?i:s,d=e.paddingTop,u=void 0===d?r:d,m=e.paddingBottom,p=void 0===m?r:m,f=e.margin,h=e.verticalMargin,g=e.horizontalMargin,w=e.marginLeft,y=void 0===w?g:w,v=e.marginRight,P=void 0===v?g:v,b=e.marginTop,x=void 0===b?h:b,k=e.marginBottom,A=void 0===k?h:k,S=e.theme,F=e.borderRadius,z=e.hidden,I=e.textAlign,H=e.height,j=e.minHeight,E=e.width,B=e.minWidth,M=e.maxWidth,T=e.overflow,R=e.alignSelf,O=e.justifySelf,L=[{cssProperty:"background-color",resolutionAwareProp:n,valueFormatter:function(e){return C(e)}},{cssProperty:"padding",lookIn:S.dimensions.spacing,resolutionAwareProp:t},{cssProperty:"padding-left",lookIn:S.dimensions.spacing,resolutionAwareProp:l},{cssProperty:"padding-right",lookIn:S.dimensions.spacing,resolutionAwareProp:c},{cssProperty:"padding-top",lookIn:S.dimensions.spacing,resolutionAwareProp:u},{cssProperty:"padding-bottom",lookIn:S.dimensions.spacing,resolutionAwareProp:p},{cssProperty:"margin",lookIn:S.dimensions.spacing,resolutionAwareProp:f},{cssProperty:"margin-left",lookIn:S.dimensions.spacing,resolutionAwareProp:y},{cssProperty:"margin-right",lookIn:S.dimensions.spacing,resolutionAwareProp:P},{cssProperty:"margin-top",lookIn:S.dimensions.spacing,resolutionAwareProp:x},{cssProperty:"margin-bottom",lookIn:S.dimensions.spacing,resolutionAwareProp:A},{cssProperty:"display",resolutionAwareProp:z,valueFormatter:function(e){return!0===e?"none":"block"}},{cssProperty:"border-radius",resolutionAwareProp:F},{cssProperty:"text-align",resolutionAwareProp:I},{cssProperty:"width",resolutionAwareProp:E},{cssProperty:"height",resolutionAwareProp:H},{cssProperty:"min-height",resolutionAwareProp:j},{cssProperty:"min-width",resolutionAwareProp:B},{cssProperty:"max-width",resolutionAwareProp:M},{cssProperty:"align-self",resolutionAwareProp:R},{cssProperty:"justify-self",resolutionAwareProp:O}];return o.css(q||(q=_(["\n position: relative;\n overflow: ",";\n ",";\n "],["\n position: relative;\n overflow: ",";\n ",";\n "])),T,D(L))})),G=function(e){var n=w(w({},k),e);return p.createElement(V,w({},n))},K=f.default.svg.withConfig({displayName:"StyledSvgIcon",componentId:"sc-1jh49e-0"})(N||(N=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.size,t=e.nwidth,r=e.nheight,i=e.cursor,a=e.top,l=e.bottom,s=e.right,c=e.left,d=[{cssProperty:"width",resolutionAwareProp:null!=t?t:n},{cssProperty:"height",resolutionAwareProp:null!=r?r:n}];return o.css(W||(W=_(["\n ",";\n cursor: ",";\n position: relative;\n top: ",";\n bottom: ",";\n right: ",";\n left: ",";\n "],["\n ",";\n cursor: ",";\n position: relative;\n top: ",";\n bottom: ",";\n right: ",";\n left: ",";\n "])),D(d),i,a||"unset",l||"unset",s||"unset",c||"unset")})),Y=function(e){var o=e.name,t=e.width,r=e.height,i=y(e,["name","width","height"]),l=n.useState(null),s=l[0],c=l[1];return a.useAsync((function(){return v(void 0,void 0,void 0,(function(){var e,n,t;return P(this,(function(r){switch(r.label){case 0:return o?(e=o.split(":"),n="".concat(e[0],"/").concat(g.default(e[1])).replace("_","").replace(/ /g,""),[4,import("./generated/".concat(n,".tsx"))]):[3,2];case 1:t=r.sent(),c(t.default),r.label=2;case 2:return[2]}}))}))}),[o]),s?m.default.createElement(K,w({as:s,nheight:r,nwidth:t},i)):null};Y.defaultProps={color:"link",cursor:"unset",opacity:1,size:"2rem"};var Q,U,J=f.default.p.withConfig({displayName:"StyledText",componentId:"sc-uyk9pj-0"})(U||(U=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.theme,t=e.variant,r=e.transform,i=e.color,a=e.align,l=e.lineHeight,s=e.fontSize,c=e.fontWeight,d=e.whiteSpace,u=e.padding,m=e.verticalPadding,p=e.horizontalPadding,f=e.paddingLeft,h=void 0===f?p:f,g=e.paddingRight,w=void 0===g?p:g,y=e.paddingTop,v=void 0===y?m:y,P=e.paddingBottom,b=void 0===P?m:P,x=e.margin,k=e.verticalMargin,A=e.horizontalMargin,S=e.marginLeft,F=void 0===S?A:S,z=e.marginRight,C=void 0===z?A:z,I=e.marginTop,H=void 0===I?k:I,j=e.marginBottom,E=void 0===j?k:j,B=e.alignSelf,M=e.justifySelf,T=e.display,R=e.hidden,O=e.minWidth,q=e.maxWidth,L=e.letterSpacing,W=e.textShadow,N=e.onClick,V=t||"p2",G=i||"",K=s||{lg:n.fonts[V].size,md:n.fonts[V].sizeMedium,sm:n.fonts[V].sizeSmaller},Y=l||{lg:n.fonts[V].lineHeight,md:n.fonts[V].lineHeightMedium,sm:n.fonts[V].lineHeightSmaller},U=[{cssProperty:"text-align",resolutionAwareProp:a},{cssProperty:"font-family",resolutionAwareProp:{lg:n.fonts[V].family,sm:n.fonts[V].familySmaller},valueFormatter:function(e){return"".concat(e,', "Helvetica", sans-serif;')}},{cssProperty:"font-size",resolutionAwareProp:K},{cssProperty:"line-height",resolutionAwareProp:Y},{cssProperty:"min-width",resolutionAwareProp:O},{cssProperty:"max-width",resolutionAwareProp:q},{cssProperty:"padding",lookIn:n.dimensions.spacing,resolutionAwareProp:u},{cssProperty:"padding-left",lookIn:n.dimensions.spacing,resolutionAwareProp:h},{cssProperty:"padding-right",lookIn:n.dimensions.spacing,resolutionAwareProp:w},{cssProperty:"padding-top",lookIn:n.dimensions.spacing,resolutionAwareProp:v},{cssProperty:"padding-bottom",lookIn:n.dimensions.spacing,resolutionAwareProp:b},{cssProperty:"margin",lookIn:n.dimensions.spacing,resolutionAwareProp:x},{cssProperty:"margin-left",lookIn:n.dimensions.spacing,resolutionAwareProp:F},{cssProperty:"margin-right",lookIn:n.dimensions.spacing,resolutionAwareProp:C},{cssProperty:"margin-top",lookIn:n.dimensions.spacing,resolutionAwareProp:H},{cssProperty:"margin-bottom",lookIn:n.dimensions.spacing,resolutionAwareProp:E},{cssProperty:"align-self",resolutionAwareProp:B},{cssProperty:"justify-self",resolutionAwareProp:M},{cssProperty:"letter-spacing",resolutionAwareProp:L},{cssProperty:"white-space",resolutionAwareProp:d},{cssProperty:"display",resolutionAwareProp:[T,R],valueFormatter:function(e){var n=e[0];return!0===e[1]?"none":n}}];return o.css(Q||(Q=_(["\n color: ",";\n text-transform: ",";\n transition: all ",";\n font-weight: ",";\n cursor: ",";\n text-shadow: ",";\n\n ",";\n\n a {\n display: inline-block;\n font-size: inherit;\n line-height: inherit;\n }\n "],["\n color: ",";\n text-transform: ",";\n transition: all ",";\n font-weight: ",";\n cursor: ",";\n text-shadow: ",";\n\n ",";\n\n a {\n display: inline-block;\n font-size: inherit;\n line-height: inherit;\n }\n "])),n.colors.typography[G]||n.colors.palette[G]||i,r,n.transitions.base,c||n.fonts[V].fontWeight||400,N?"pointer":"unset",W,D(U))})),X={badge:"span",hero:"h1",p0:"p",p1:"p",p2:"p",p3:"p"},Z=n.forwardRef((function(e,n){var o,t,r=e.type,i=e.variant,a=e.tx,s=e.txValues,c=e.text,d=e.htmlText,u=e.textStyle,p=e.color,f=y(e,["type","variant","tx","txValues","text","htmlText","textStyle","color"]),h=l.useTranslation().t;return d?m.default.createElement(J,w({as:null!==(o=null!=r?r:X[i||""])&&void 0!==o?o:i,color:null!=p?p:"black",dangerouslySetInnerHTML:{__html:d},ref:n,textStyle:u,variant:i},f)):m.default.createElement(J,w({as:null!==(t=null!=r?r:X[i||""])&&void 0!==t?t:i,color:null!=p?p:"black",ref:n,textStyle:u,tx:a,variant:i},f),a?m.default.createElement(l.Trans,{t:h,values:s},a):c)}));Z.defaultProps={color:"t1",display:"block",variant:"p2",whiteSpace:"inherit"};var $,ee,ne,oe,te,re,ie,ae={md:"15rem",sm:"14rem",xl:"17rem"},le=f.default.button.withConfig({displayName:"StyledButton",componentId:"sc-12w1zik-0"})(oe||(oe=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.theme,t=e.variant,r=e.color,i=e.width,a=e.minWidth,l=e.disabled,s=e.borderRadius,c=e.alignSelf,d=e.justifySelf,u=e.hidden,m=e.size,p=[{cssProperty:"width",resolutionAwareProp:i,valueFormatter:function(e){var n;return null!==(n=ae[e])&&void 0!==n?n:e}},{cssProperty:"min-width",resolutionAwareProp:a||"unset"},{cssProperty:"border-radius",resolutionAwareProp:"action"===t?"none":s||("small"===m?"0.4rem":"4.9rem")},{cssProperty:"align-self",resolutionAwareProp:c},{cssProperty:"justify-self",resolutionAwareProp:d},{cssProperty:"display",resolutionAwareProp:u,valueFormatter:function(e){return!0===e?"none":"flex"}}];return o.css(ne||(ne=_(["\n &,\n &:active,\n &:focus {\n display: flex;\n ",";\n position: relative;\n border-style: solid;\n border-width: ",";\n outline: none;\n padding: 0 ",";\n cursor: ",";\n pointer-events: ",";\n opacity: ",";\n transition: ",";\n user-select: none;\n overflow: hidden;\n height: ",";\n min-width: max-content;\n\n ","\n\n ","\n }\n "],["\n &,\n &:active,\n &:focus {\n display: flex;\n ",";\n position: relative;\n border-style: solid;\n border-width: ",";\n outline: none;\n padding: 0 ",";\n cursor: ",";\n pointer-events: ",";\n opacity: ",";\n transition: ",";\n user-select: none;\n overflow: hidden;\n height: ",";\n min-width: max-content;\n\n ","\n\n ","\n }\n "])),D(p),"default"===t?"unset":"1px","small"===m?"1rem":"2.4rem",l?"not-allowed":"pointer",l?"none":"all",l?.3:1,n.transitions.base,"large"===m?"4.6rem":"3.4rem",function(e,n,t){var r,i=null!==(r=H(t)[e])&&void 0!==r?r:H(t).white,a=!("secondary"===n||"action"===n);return o.css($||($=_(["\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n\n &:hover {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n\n &:active {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n "],["\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n\n &:hover {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n\n &:active {\n background-color: ",";\n border: 1px solid ",";\n\n * {\n color: ",";\n }\n }\n "])),a?i.background:"transparent",i.background,a?i.color||i.background:i.background||i.color,a?i.hover:"transparent",i.hover,a?i.color||i.hover:i.hover||i.color,a?i.selected:"transparent",i.selected,a?i.color||i.selected:i.selected||i.color)}(String(r),t,n),"action"===t&&o.css(ee||(ee=_(["\n border: none;\n padding: 0;\n width: max-content;\n min-width: 0;\n\n &:hover,\n &:active {\n border: unset;\n\n * {\n text-decoration: underline;\n }\n }\n "],["\n border: none;\n padding: 0;\n width: max-content;\n min-width: 0;\n\n &:hover,\n &:active {\n border: unset;\n\n * {\n text-decoration: underline;\n }\n }\n "]))))})),se=f.default.div.withConfig({displayName:"StyledButtonContent",componentId:"sc-12w1zik-1"})(ie||(ie=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.theme,t=e.textVariant;return o.css(re||(re=_(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n transform: translateY(0);\n opacity: 1;\n transition: ",";\n\n & > *:not(:last-child) {\n margin-right: ",";\n position: relative;\n\n ","\n }\n "],["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n transform: translateY(0);\n opacity: 1;\n transition: ",";\n\n & > *:not(:last-child) {\n margin-right: ",";\n position: relative;\n\n ","\n }\n "])),n.transitions.base,"p3"===t?".6rem":".8rem",R.lessThan("sm")(te||(te=_(["\n margin-right: ",";\n "],["\n margin-right: ",";\n "])),"p3"===t?".3rem":".5rem"))})),ce=n.forwardRef((function(e,n){var o=e.tx,t=e.text,r=e.txValues,i=e.textVariant,a=e.textLineHeight,l=e.fontSize,s=e.type,c=e.disabled,d=e.icon,u=e.iconLocation,m=e.processing,f=e.onClick,h=y(e,["tx","text","txValues","textVariant","textLineHeight","fontSize","type","disabled","icon","iconLocation","processing","onClick"]);return p.createElement(le,w({disabled:c,ref:n,textVariant:i,type:s,onClick:f},h),p.createElement(se,w({},h),d&&!m&&"left"===u&&d,"action"!==h.variant&&m&&p.createElement(Y,{name:"animated:loader_24",size:"1.6rem"}),(o||t)&&p.createElement(Z,{display:"contents",fontSize:l,lineHeight:a,text:t,textStyle:"bold",tx:o,txValues:r,variant:i,whiteSpace:"nowrap"}),d&&"right"===u&&d))}));ce.defaultProps={color:"primary",disabled:!1,iconLocation:"left",size:"large",textLineHeight:"unset",textVariant:"p2",type:"button",variant:"primary"};var de,ue,me=f.default.div.withConfig({displayName:"StyledCell",componentId:"sc-hxvxkk-0"})(ue||(ue=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.width,t=e.height,r=e.row,i=e.column,a=e.hidden,l=e.textAlign,s=e.alignSelf,c=e.alignItems,d=e.alignContent,u=e.justifyContent,m=e.justifyItems,p=e.gap,f=e.columnGap,h=void 0===f?p:f,g=e.rowGap,w=void 0===g?p:g,y=e.position,v=e.borderRadius,P=e.padding,b=e.backgroundColor,x=e.verticalPadding,k=e.horizontalPadding,A=e.paddingLeft,S=void 0===A?k:A,F=e.paddingRight,z=void 0===F?k:F,H=e.paddingTop,j=void 0===H?x:H,E=e.paddingBottom,B=void 0===E?x:E,M=e.theme,T=[{cssProperty:"background-color",resolutionAwareProp:b,valueFormatter:function(e){return C(e,M)}},{cssProperty:"display",resolutionAwareProp:a,valueFormatter:function(e){return e?"none":"grid"}},{cssProperty:"text-align",resolutionAwareProp:l},{cssProperty:"align-self",resolutionAwareProp:s},{cssProperty:"align-items",resolutionAwareProp:c},{cssProperty:"align-content",resolutionAwareProp:d},{cssProperty:"grid-column-gap",resolutionAwareProp:h,valueFormatter:function(e){return I(e,M)}},{cssProperty:"grid-row-gap",resolutionAwareProp:w,valueFormatter:function(e){return I(e,M)}},{cssProperty:"justify-content",resolutionAwareProp:u},{cssProperty:"justify-items",resolutionAwareProp:m},{cssProperty:"border-radius",resolutionAwareProp:v},{cssProperty:"padding",lookIn:M.dimensions.spacing,resolutionAwareProp:P},{cssProperty:"padding-left",lookIn:M.dimensions.spacing,resolutionAwareProp:S},{cssProperty:"padding-right",lookIn:M.dimensions.spacing,resolutionAwareProp:z},{cssProperty:"padding-top",lookIn:M.dimensions.spacing,resolutionAwareProp:j},{cssProperty:"padding-bottom",lookIn:M.dimensions.spacing,resolutionAwareProp:B}];return n?T.push({cssProperty:"grid-column",resolutionAwareProp:n,valueFormatter:function(e){return"span ".concat(e)}}):i&&T.push({cssProperty:"grid-column",resolutionAwareProp:i}),t?T.push({cssProperty:"grid-row",resolutionAwareProp:t,valueFormatter:function(e){return"span ".concat(e)}}):r&&T.push({cssProperty:"grid-row",resolutionAwareProp:r}),o.css(de||(de=_(["\n display: grid;\n position: ",";\n ",";\n "],["\n display: grid;\n position: ",";\n ",";\n "])),y,D(T))})),pe=n.forwardRef((function(e,n){var o=e.children,t=y(e,["children"]);return p.createElement(me,w({ref:n},t),o)}));pe.defaultProps={column:null,row:null,textAlign:"left"};var fe,he,ge=f.default(G).withConfig({displayName:"StyledFlexContainer",componentId:"sc-17zjsog-0"})(he||(he=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.direction,t=e.justifyContent,r=e.alignItems,i=e.backgroundColor,a=e.gap,l=e.hidden,s=e.height,c=e.width,d=e.theme,u=D([{cssProperty:"flex-direction",resolutionAwareProp:n},{cssProperty:"justify-content",resolutionAwareProp:t},{cssProperty:"align-items",resolutionAwareProp:r},{cssProperty:"display",resolutionAwareProp:l,valueFormatter:function(e){return!0===e?"none":"flex"}},{cssProperty:"background-color",resolutionAwareProp:i,valueFormatter:function(e){return C(e,d)}},{cssProperty:"height",resolutionAwareProp:s},{cssProperty:"width",resolutionAwareProp:c},{cssProperty:"gap",resolutionAwareProp:a,valueFormatter:function(e){return I(e,d)}}]);return o.css(fe||(fe=_(["\n display: flex;\n width: 100%;\n ","\n "],["\n display: flex;\n width: 100%;\n ","\n "])),u)})),we=function(e){return m.default.createElement(ge,w({},e))};we.defaultProps={alignItems:"unset",borderRadius:"unset",direction:"row",height:"unset",justifyContent:"unset",padding:"unset"};var ye,ve,Pe,be,_e=function(e){return"string"==typeof e?e:"repeat(".concat(e,", 1fr);")},xe=function(e){return"string"==typeof e?e:"repeat(".concat(e,", max-content);")},ke=f.default.div.withConfig({displayName:"StyledGrid",componentId:"sc-b5we8g-0"})(ve||(ve=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.width,t=e.height,r=e.columns,i=e.autoColumns,a=e.rows,l=e.autoRows,s=e.flow,c=e.gap,d=e.columnGap,u=void 0===d?c:d,m=e.rowGap,p=void 0===m?c:m,f=e.padding,h=e.horizontalPadding,g=void 0===h?f:h,w=e.paddingLeft,y=void 0===w?g:w,v=e.paddingRight,P=void 0===v?g:v,b=e.verticalPadding,x=void 0===b?f:b,k=e.paddingTop,A=void 0===k?x:k,S=e.paddingBottom,F=void 0===S?x:S,z=e.margin,H=e.horizontalMargin,j=void 0===H?z:H,E=e.marginLeft,B=void 0===E?j:E,M=e.marginRight,T=void 0===M?j:M,R=e.verticalMargin,O=void 0===R?z:R,q=e.marginTop,L=void 0===q?O:q,W=e.marginBottom,N=void 0===W?O:W,V=e.justifyContent,G=e.alignContent,K=e.justifyItems,Y=e.justifySelf,Q=e.alignItems,U=e.hidden,J=e.maxWidth,X=e.minWidth,Z=e.minHeight,$=e.maxHeight,ee=e.backgroundColor,ne=e.border,oe=e.borderRadius,te=e.theme,re=[{cssProperty:"grid-auto-flow",resolutionAwareProp:s},{cssProperty:"grid-auto-columns",resolutionAwareProp:i},{cssProperty:"grid-auto-rows",resolutionAwareProp:l},{cssProperty:"grid-template-columns",resolutionAwareProp:r,valueFormatter:_e},{cssProperty:"grid-template-rows",resolutionAwareProp:a,valueFormatter:xe},{cssProperty:"grid-column-gap",resolutionAwareProp:u,valueFormatter:function(e){return I(e,te)}},{cssProperty:"grid-row-gap",resolutionAwareProp:p,valueFormatter:function(e){return I(e,te)}},{cssProperty:"padding-left",resolutionAwareProp:y,valueFormatter:function(e){return I(e,te)}},{cssProperty:"padding-right",resolutionAwareProp:P,valueFormatter:function(e){return I(e,te)}},{cssProperty:"padding-top",resolutionAwareProp:A,valueFormatter:function(e){return I(e,te)}},{cssProperty:"padding-bottom",resolutionAwareProp:F,valueFormatter:function(e){return I(e,te)}},{cssProperty:"margin-left",resolutionAwareProp:B,valueFormatter:function(e){return I(e,te)}},{cssProperty:"margin-right",resolutionAwareProp:T,valueFormatter:function(e){return I(e,te)}},{cssProperty:"margin-top",resolutionAwareProp:L,valueFormatter:function(e){return I(e,te)}},{cssProperty:"margin-bottom",resolutionAwareProp:N,valueFormatter:function(e){return I(e,te)}},{cssProperty:"align-content",resolutionAwareProp:G},{cssProperty:"justify-content",resolutionAwareProp:V},{cssProperty:"align-items",resolutionAwareProp:Q},{cssProperty:"justify-items",resolutionAwareProp:K},{cssProperty:"justify-self",resolutionAwareProp:Y},{cssProperty:"display",resolutionAwareProp:U,valueFormatter:function(e){return!0===e?"none":"grid"}},{cssProperty:"max-width",resolutionAwareProp:J},{cssProperty:"min-width",resolutionAwareProp:X},{cssProperty:"min-height",resolutionAwareProp:Z},{cssProperty:"max-height",resolutionAwareProp:$},{cssProperty:"background-color",resolutionAwareProp:ee,valueFormatter:function(e){return C(e,te)}},{cssProperty:"width",resolutionAwareProp:n},{cssProperty:"height",resolutionAwareProp:t},{cssProperty:"border-radius",resolutionAwareProp:oe}];return o.css(ye||(ye=_(["\n display: grid;\n position: relative;\n border: ",";\n ",";\n "],["\n display: grid;\n position: relative;\n border: ",";\n ",";\n "])),ne||"unset",D(re))})),Ae=n.forwardRef((function(e,n){var o=e.children,t=y(e,["children"]);return p.createElement(ke,w({ref:n},t),o)}));Ae.defaultProps={backgroundColor:"unset",flow:"row",gap:{lg:"s3",md:"s3",sm:"s1"},height:"unset",maxWidth:"unset",padding:"unset",width:"unset"},Pe||(Pe=_(["\n ","\n"],["\n ","\n"])),be||(be=_(["\n ","\n"],["\n ","\n"])),new c.Cloudinary({cloud:{cloudName:"gantri"},url:{secure:!0}});var Se,Fe,ze,Ce,Ie,He,je=f.default.div.withConfig({displayName:"StyledRadioContainer",componentId:"sc-kxjg4j-0"})(Se||(Se=_(["\n cursor: pointer;\n"],["\n cursor: pointer;\n"]))),Ee=f.default.div.withConfig({displayName:"StyledRadio",componentId:"sc-kxjg4j-1"})(ze||(ze=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.theme;return o.css(Fe||(Fe=_(["\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n border: 1px solid ",";\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n cursor: pointer;\n "],["\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n border: 1px solid ",";\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n cursor: pointer;\n "])),n.colors.palette.monochrome_200)})),Be=f.default.input.withConfig({displayName:"StyledRadioInput",componentId:"sc-kxjg4j-2"})(Ce||(Ce=_(["\n width: 20px;\n height: 20px;\n opacity: 0;\n cursor: pointer;\n"],["\n width: 20px;\n height: 20px;\n opacity: 0;\n cursor: pointer;\n"]))),Me=f.default.span.withConfig({displayName:"StyledRadioMarker",componentId:"sc-kxjg4j-3"})(He||(He=_(["\n ","\n"],["\n ","\n"])),(function(e){var n=e.theme;return o.css(Ie||(Ie=_(["\n position: absolute;\n width: calc(100% - 1.2rem);\n height: calc(100% - 1.2rem);\n display: inline-block;\n border-radius: 50%;\n background-color: ",";\n "],["\n position: absolute;\n width: calc(100% - 1.2rem);\n height: calc(100% - 1.2rem);\n display: inline-block;\n border-radius: 50%;\n background-color: ",";\n "])),n.colors.palette.monochrome_black)})),Te=function(e){var n=e.flow,o=e.children,t=e.justifyContent,r=e.justifyItems,i=e.alignContent,a=e.maxWidth,l=e.minHeight,s=e.height,c=y(e,["flow","children","justifyContent","justifyItems","alignContent","maxWidth","minHeight","height"]);return m.default.createElement(Ae,w({alignContent:i,alignItems:"center",columns:"column"===n?"minmax(min-content,".concat(a||"max-content",")"):"unset",flow:n,height:s,justifyContent:t,justifyItems:r,maxWidth:a,minHeight:l},c),o)};Te.defaultProps={alignContent:"start",flow:"row",gap:"s1",height:"100%",horizontalPadding:{lg:"s3",sm:"s1"},justifyContent:"unset",padding:"unset"};var Re=function(e){var o=e.name,t=e.labelTx,r=e.labelText,i=e.labelPosition,a=e.labelVariant,l=e.value,s=e.groupValue,c=e.onChange,d=e.onSelected,u=n.useRef(),p=l===s;return m.default.createElement(je,null,m.default.createElement(Te,{flow:"column",gap:"1rem",padding:"unset"},(t||r)&&"left"===i&&m.default.createElement(Z,{color:p?"t1":"t2",text:r,tx:t,variant:a}),m.default.createElement(Ee,null,p&&m.default.createElement(Me,null),m.default.createElement(Be,{checked:p,id:"".concat(o,"-").concat(l),name:o,ref:u,type:"radio",value:l,onChange:function(e){c&&c(e),d&&d(e.target.value)}})),(t||r)&&"right"===i&&m.default.createElement(Z,{color:p?"t1":"t2",htmlFor:"".concat(o,"-").concat(l),text:r,tx:t,variant:a})))};Re.defaultProps={labelPosition:"right",labelVariant:"p3",name:""},e.Box=G,e.Button=ce,e.Cell=pe,e.Flex=we,e.Grid=Ae,e.Icon=Y,e.Radio=Re,e.Stack=Te,e.ThemeProvider=E,e.Typography=Z,e.combinationsByColor=H,e.darkTheme=z,e.getThemeColor=C,e.getThemeSpacing=I,e.lightTheme=F,e.media=R,e.palette=A,Object.defineProperty(e,"__esModule",{value:!0})}));

package/package.json CHANGED Viewed

@@ -1,15 +1,21 @@
 {
   "name": "gantri-components",
-  "version": "1.7.4",
+  "version": "1.7.7",
   "main": "dist/index.cjs.js",
-  "module": "dist/src/index.js",
-  "types": "lib/index.d.ts",
+  "module": "dist/index.esm.js",
+  "umd": "dist/index.umd.js",
+  "types": "dist/index.d.ts",
   "repository": "git@github.com:gantri/ui-library.git",
   "author": "Danny <danny@gantri.com>",
   "sideEffects": false,
   "license": "MIT",
   "scripts": {
-    "build": "rollup -c",
+    "clean-build": "npm-run-all clean build",
+    "build": "tsc --outDir dist --declarationDir dist --declaration true && rollup -c",
+    "build-watch": "rollup -c -w",
+    "clean": "rimraf dist",
+    "typecheck": "tsc -p --noEmit",
+    "type-check:watch": "npm run type-check -- --watch",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook",
     "prepare": "husky install",
@@ -19,16 +25,25 @@
   "peerDependencies": {
     "formik": "^2.2.9",
     "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react-dom": "^17.0.2",
+    "styled-components": "^5.3.5"
   },
   "devDependencies": {
     "@babel/core": "^7.17.5",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7",
+    "@babel/plugin-proposal-optional-chaining": "^7.16.7",
+    "@babel/plugin-transform-runtime": "^7.17.0",
+    "@babel/preset-env": "^7.16.11",
+    "@babel/preset-react": "^7.16.7",
     "@commitlint/cli": "^16.2.1",
     "@commitlint/config-conventional": "^16.2.1",
     "@react-theming/storybook-addon": "^1.1.5",
+    "@rollup/plugin-babel": "^5.3.1",
     "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.1.3",
+    "@rollup/plugin-replace": "^4.0.0",
+    "@rollup/plugin-typescript": "^8.3.2",
     "@semantic-release/changelog": "^6.0.1",
     "@semantic-release/commit-analyzer": "^9.0.2",
     "@semantic-release/git": "^10.0.1",
@@ -52,6 +67,7 @@
     "@typescript-eslint/parser": "^5.14.0",
     "@web/rollup-plugin-copy": "^0.3.0",
     "babel-loader": "^8.2.3",
+    "babel-plugin-styled-components": "^2.0.7",
     "del-cli": "^4.0.1",
     "eslint": "^8.10.0",
     "eslint-config-airbnb": "^19.0.4",
@@ -70,16 +86,20 @@
     "eslint-plugin-typescript-sort-keys": "^2.1.0",
     "husky": "^7.0.4",
     "lint-staged": "^12.3.5",
+    "npm-run-all": "^4.1.5",
     "postcss": "^8.4.8",
     "prettier": "^2.5.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-use": "^17.3.2",
+    "rimraf": "^3.0.2",
     "rollup": "^2.70.0",
     "rollup-plugin-copy": "^3.4.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-postcss": "^4.0.2",
+    "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-typescript2": "^0.31.2",
+    "styled-components": "^5.3.5",
     "typescript": "^4.6.2"
   },
   "dependencies": {
@@ -92,7 +112,7 @@
     "styled-media-query": "^2.1.2"
   },
   "files": [
-    "lib"
+    "dist"
   ],
   "engines": {
     "node": ">= 14.17.0",

package/lib/components/aspect-ratio/aspect-ratio.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-import { AspectRatioProps } from './aspect-ratio.types';
-export declare const AspectRatio: FC<PropsWithChildren<AspectRatioProps>>;

package/lib/components/aspect-ratio/aspect-ratio.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { AspectRatioProps } from "./aspect-ratio.types";
2	- export declare const AspectRatioPresets: AspectRatioProps;

package/lib/components/aspect-ratio/aspect-ratio.styles.d.ts DELETED Viewed

@@ -1,5 +0,0 @@
-import { ResolutionAwareProp, ResolutionAwarePropBase } from '../../types/resolution-aware-prop.type';
-import { AspectRatioProps } from './aspect-ratio.types';
-export declare const populateAspectRatioStyles: (aspectRatio: ResolutionAwareProp<string>, height?: 0 | (string & {}) | "unset" | "-moz-initial" | "inherit" | "initial" | "revert" | "-moz-max-content" | "-moz-min-content" | "-webkit-fit-content" | "auto" | "fit-content" | "max-content" | "min-content" | ResolutionAwarePropBase<0> | ResolutionAwarePropBase<string & {}> | ResolutionAwarePropBase<"unset"> | ResolutionAwarePropBase<"-moz-initial"> | ResolutionAwarePropBase<"inherit"> | ResolutionAwarePropBase<"initial"> | ResolutionAwarePropBase<"revert"> | ResolutionAwarePropBase<"-moz-max-content"> | ResolutionAwarePropBase<"-moz-min-content"> | ResolutionAwarePropBase<"-webkit-fit-content"> | ResolutionAwarePropBase<"auto"> | ResolutionAwarePropBase<"fit-content"> | ResolutionAwarePropBase<"max-content"> | ResolutionAwarePropBase<"min-content"> | undefined) => import("styled-components").FlattenSimpleInterpolation;
-export declare const StyledAspectRatio: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Partial<AspectRatioProps>, never>;
-export declare const StyledAspectRatioContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/lib/components/aspect-ratio/aspect-ratio.types.d.ts DELETED Viewed

@@ -1,11 +0,0 @@
-import { Property } from "csstype";
-import { ResolutionAwareProp } from "../../types/resolution-aware-prop.type";
-import { BaseProps } from "../box/box.types";
-import { PaletteColor } from "../../styles";
-export interface AspectRatioProps extends BaseProps {
-    aspectRatio?: ResolutionAwareProp<string>;
-    backgroundColor?: ResolutionAwareProp<PaletteColor>;
-    height?: ResolutionAwareProp<Property.Height>;
-    hidden?: ResolutionAwareProp<boolean>;
-    width?: ResolutionAwareProp<Property.Width>;
-}

package/lib/components/aspect-ratio/index.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export { AspectRatio } from "./aspect-ratio";

package/lib/components/box/box.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-import { BoxProps } from './box.types';
-export declare const Box: FC<PropsWithChildren<BoxProps>>;

package/lib/components/box/box.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { BoxProps } from './box.types';
2	- export declare const BoxPresets: BoxProps;

package/lib/components/box/box.styles.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { BoxProps } from './box.types';
2	- export declare const StyledBoxContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, BoxProps, never>;

package/lib/components/box/box.types.d.ts DELETED Viewed

@@ -1,38 +0,0 @@
-import { HTMLAttributes } from 'react';
-import { Globals, Property } from 'csstype';
-import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
-import { PaletteColor } from '../../styles';
-export declare type BoxDimension = 's1' | 's2' | 's3' | 's4' | 's5' | 's6' | Globals | string;
-export interface BaseProps extends HTMLAttributes<any> {
-    children?: any;
-    className?: string;
-}
-export interface BoxProps extends BaseProps {
-    alignSelf?: ResolutionAwareProp<Property.AlignSelf>;
-    backgroundColor?: ResolutionAwareProp<PaletteColor>;
-    borderRadius?: ResolutionAwareProp<Property.BorderRadius>;
-    height?: ResolutionAwareProp<Property.Height>;
-    hidden?: ResolutionAwareProp<boolean>;
-    horizontalMargin?: ResolutionAwareProp<BoxDimension>;
-    horizontalPadding?: ResolutionAwareProp<BoxDimension>;
-    justifySelf?: ResolutionAwareProp<Property.JustifySelf>;
-    margin?: ResolutionAwareProp<BoxDimension>;
-    marginBottom?: ResolutionAwareProp<BoxDimension>;
-    marginLeft?: ResolutionAwareProp<BoxDimension>;
-    marginRight?: ResolutionAwareProp<BoxDimension>;
-    marginTop?: ResolutionAwareProp<BoxDimension>;
-    maxHeight?: ResolutionAwareProp<Property.MaxHeight>;
-    maxWidth?: ResolutionAwareProp<string>;
-    minHeight?: ResolutionAwareProp<Property.MinHeight>;
-    minWidth?: ResolutionAwareProp<string>;
-    overflow?: Property.Overflow;
-    padding?: ResolutionAwareProp<BoxDimension>;
-    paddingBottom?: ResolutionAwareProp<BoxDimension>;
-    paddingLeft?: ResolutionAwareProp<BoxDimension>;
-    paddingRight?: ResolutionAwareProp<BoxDimension>;
-    paddingTop?: ResolutionAwareProp<BoxDimension>;
-    textAlign?: ResolutionAwareProp<string>;
-    verticalMargin?: ResolutionAwareProp<BoxDimension>;
-    verticalPadding?: ResolutionAwareProp<BoxDimension>;
-    width?: ResolutionAwareProp<string>;
-}

package/lib/components/box/index.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export { Box } from './box';

package/lib/components/button/button.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-import { ButtonProps } from './button.types';
-export declare const Button: FC<ButtonProps>;

package/lib/components/button/button.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { ButtonProps } from './button.types';
2	- export declare const ButtonPresets: Partial<ButtonProps>;

package/lib/components/button/button.styles.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { DefaultTheme } from 'styled-components/macro';
-export declare const StyledButton: import("styled-components").StyledComponent<"button", DefaultTheme, any, never>;
-export declare const StyledButtonContent: import("styled-components").StyledComponent<"div", DefaultTheme, any, never>;

package/lib/components/button/button.types.d.ts DELETED Viewed

@@ -1,32 +0,0 @@
-/// <reference types="react" />
-import { Property } from 'csstype';
-import { BaseProps } from '../box/box.types';
-import { TextVariant } from '../typography/typography.types';
-import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
-export declare type ButtonVariant = 'default' | 'primary' | 'secondary' | 'action';
-export declare type ButtonColor = 'primary' | 'grey' | 'greyLight' | 'black' | 'alert' | 'secondary' | 'secondaryAlt' | 'blue' | 'gold' | 'green' | 'yellow' | 'pink' | string;
-export declare type ButtonWidth = 'sm' | 'md' | 'lg' | string;
-export interface ButtonProps extends BaseProps {
-    alignSelf?: ResolutionAwareProp<Property.AlignSelf>;
-    borderRadius?: ResolutionAwareProp<Property.BorderRadius>;
-    color?: ButtonColor;
-    disabled?: boolean;
-    fontSize?: ResolutionAwareProp<Property.Font>;
-    height?: ResolutionAwareProp<Property.Height>;
-    hidden?: ResolutionAwareProp<boolean>;
-    icon?: JSX.Element;
-    iconLocation?: 'left' | 'right';
-    justifySelf?: ResolutionAwareProp<Property.JustifySelf>;
-    minWidth?: ResolutionAwareProp<Property.Width>;
-    onClick?: () => void;
-    processing?: boolean;
-    size?: 'large' | 'small';
-    text?: string;
-    textLineHeight?: Property.LineHeight;
-    textVariant?: TextVariant;
-    tx?: string;
-    txValues?: Record<string, unknown>;
-    type?: 'submit' | 'button';
-    variant?: ButtonVariant;
-    width?: ResolutionAwareProp<ButtonWidth>;
-}

package/lib/components/button/index.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export * from './button';

package/lib/components/cell/cell.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-import { CellProps } from './cell.types';
-export declare const Cell: FC<PropsWithChildren<CellProps>>;

package/lib/components/cell/cell.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { CellProps } from './cell.types';
2	- export declare const CellPresets: CellProps;

package/lib/components/cell/cell.styles.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { CellProps } from './cell.types';
2	- export declare const StyledCell: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, CellProps, never>;

package/lib/components/cell/cell.types.d.ts DELETED Viewed

@@ -1,34 +0,0 @@
-import { CSSProperties } from 'react';
-import { Property } from 'csstype';
-import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
-import { BaseProps, BoxDimension } from '../box/box.types';
-import { Measure } from '../grid/grid.types';
-import { PaletteColor } from '../../styles';
-export interface CellProps extends BaseProps {
-    alignContent?: ResolutionAwareProp<Property.AlignContent>;
-    alignItems?: ResolutionAwareProp<Property.AlignItems>;
-    alignSelf?: ResolutionAwareProp<Property.AlignSelf>;
-    area?: ResolutionAwareProp<string>;
-    backgroundColor?: ResolutionAwareProp<PaletteColor>;
-    borderRadius?: Property.BorderRadius<string>;
-    column?: ResolutionAwareProp<any>;
-    columnGap?: ResolutionAwareProp<Measure>;
-    gap?: ResolutionAwareProp<Property.Gap>;
-    height?: ResolutionAwareProp<number>;
-    hidden?: ResolutionAwareProp<boolean>;
-    horizontalPadding?: ResolutionAwareProp<BoxDimension>;
-    justifyContent?: ResolutionAwareProp<Property.JustifyContent>;
-    justifyItems?: ResolutionAwareProp<Property.JustifyItems>;
-    padding?: ResolutionAwareProp<Property.Padding>;
-    paddingBottom?: ResolutionAwareProp<BoxDimension>;
-    paddingLeft?: ResolutionAwareProp<BoxDimension>;
-    paddingRight?: ResolutionAwareProp<BoxDimension>;
-    paddingTop?: ResolutionAwareProp<BoxDimension>;
-    position?: Property.Position;
-    row?: ResolutionAwareProp<any>;
-    rowGap?: ResolutionAwareProp<Measure>;
-    style?: CSSProperties;
-    textAlign?: ResolutionAwareProp<Property.TextAlign>;
-    verticalPadding?: ResolutionAwareProp<BoxDimension>;
-    width?: ResolutionAwareProp<number>;
-}

package/lib/components/cell/index.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export { Cell } from './cell';

package/lib/components/checkbox/checkbox.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-import { CheckboxProps } from './checkbox.types';
-export declare const Checkbox: FC<CheckboxProps>;

package/lib/components/checkbox/checkbox.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { CheckboxProps } from './checkbox.types';
2	- export declare const CheckboxPresets: CheckboxProps;

package/lib/components/checkbox/checkbox.styles.d.ts DELETED Viewed

@@ -1,4 +0,0 @@
-export declare const StyledCheckboxContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    disabled: boolean;
-}, never>;
-export declare const StyledCheckbox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/lib/components/checkbox/checkbox.types.d.ts DELETED Viewed

@@ -1,12 +0,0 @@
-import { TextVariant } from '../typography/typography.types';
-export interface CheckboxProps {
-    checked?: boolean;
-    disabled?: boolean;
-    extraProps?: any;
-    labelPosition?: 'left' | 'right';
-    labelText?: string;
-    labelTx?: string;
-    labelVariant?: TextVariant;
-    name?: string;
-    onChange?: (value: boolean, extraProps?: any) => void;
-}

package/lib/components/checkbox/index.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export { Checkbox } from './checkbox';

package/lib/components/flex/flex.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-import { FlexProps } from './flex.types';
-export declare const Flex: FC<FlexProps>;

package/lib/components/flex/flex.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { FlexProps } from './flex.types';
2	- export declare const FlexPresets: FlexProps;

package/lib/components/flex/flex.styles.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import { FlexProps } from './flex.types';
-export declare const StyledFlexContainer: import("styled-components").StyledComponent<import("react").FC<import("react").PropsWithChildren<import("../box/box.types").BoxProps>>, import("styled-components").DefaultTheme, FlexProps, never>;

package/lib/components/flex/flex.types.d.ts DELETED Viewed

@@ -1,11 +0,0 @@
-import { Property } from 'csstype';
-import { BoxProps } from '../box/box.types';
-import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
-export interface FlexProps extends BoxProps {
-    alignItems?: ResolutionAwareProp<Property.AlignItems>;
-    direction?: ResolutionAwareProp<any>;
-    gap?: ResolutionAwareProp<Property.Gap>;
-    height?: ResolutionAwareProp<string>;
-    justifyContent?: ResolutionAwareProp<Property.JustifyContent>;
-    width?: ResolutionAwareProp<string>;
-}

package/lib/components/flex/index.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export { Flex } from './flex';

package/lib/components/grid/grid.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-import { GridProps } from './grid.types';
-export declare const Grid: FC<PropsWithChildren<GridProps>>;

package/lib/components/grid/grid.presets.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { GridProps } from './grid.types';
2	- export declare const GridPresets: GridProps;

package/lib/components/grid/grid.styles.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import { GridProps } from './grid.types';
2	- export declare const StyledGrid: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, GridProps, never>;

package/lib/components/grid/grid.types.d.ts DELETED Viewed

@@ -1,26 +0,0 @@
-import { ReactNode } from 'react';
-import { Property } from 'csstype';
-import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
-import { BoxDimension, BoxProps } from '../box/box.types';
-import { PaletteColor } from '../../styles';
-export interface GridProps extends BoxProps {
-    alignContent?: ResolutionAwareProp<Property.AlignContent>;
-    alignItems?: ResolutionAwareProp<Property.AlignItems>;
-    areas?: ResolutionAwareProp<string[]>;
-    autoColumns?: ResolutionAwareProp<Property.GridAutoColumns>;
-    autoRows?: ResolutionAwareProp<Property.GridAutoRows>;
-    backgroundColor?: ResolutionAwareProp<PaletteColor>;
-    border?: string;
-    children?: ReactNode;
-    columnGap?: ResolutionAwareProp<BoxDimension>;
-    columns?: ResolutionAwareProp<string | number>;
-    flow?: ResolutionAwareProp<Property.GridAutoFlow>;
-    gap?: ResolutionAwareProp<BoxDimension>;
-    justifyContent?: ResolutionAwareProp<Property.JustifyContent>;
-    justifyItems?: ResolutionAwareProp<Property.JustifyItems>;
-    justifySelf?: ResolutionAwareProp<Property.JustifySelf>;
-    maxWidth?: ResolutionAwareProp<string>;
-    minWidth?: ResolutionAwareProp<string>;
-    rowGap?: ResolutionAwareProp<BoxDimension>;
-    rows?: ResolutionAwareProp<string | number>;
-}