npm - @laerdal/life-react-components - Versions diffs - 1.0.1-dev.19.full → 1.0.1-dev.22.full - Mend

@laerdal/life-react-components 1.0.1-dev.19.full → 1.0.1-dev.22.full

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 (198) hide show

package/dist/esm/styles/typography.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["React","styled","css","COLORS","TYPOGRAPHY","fontFamily","TypographyBase","color","lineHeight","fontSize","fontWeight","fontStyle","textTransform","textDecorationLine","black","HeadlineBase","HeadlineXL","HeadlineL","HeadlineM","HeadlineS","HeadlineXS","HeadlineXXS","ParagraphStyling","ParagraphBase","props","marginBetweenParagraphs","ParagraphTextStyle","paragraphFontWeight","textStyle","Bold","paragraphFontStyle","Italic","paragraphTextDecorationLine","textDecoration","Underline","ParagraphXL","children","ParagraphL","ParagraphM","ParagraphS","ParagraphXS","ComponentTextStyle","componentFontWeight","UppercaseBold","componentFontStyle","componentTextTransformation","ComponentStyling","ComponentXLStyling","ComponentXL","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","size","width","fontsize"],"mappings":"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","sourcesContent":["import React, { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS } from '.';\nimport { Property } from 'csstype';\n\nconst TYPOGRAPHY = {\n fontFamily: 'Lato, sans-serif',\n};\n\ninterface ITypographyBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n fontWeight: number;\n fontStyle?: string;\n textTransform?: Property.TextTransform;\n textDecorationLine?: Property.TextDecorationLine;\n}\n\nconst TypographyBase = styled('div')<ITypographyBase>(({ color, lineHeight, fontSize, fontWeight, fontStyle, textTransform, textDecorationLine }) => ({\n fontFamily: TYPOGRAPHY.fontFamily,\n fontSize: fontSize,\n fontWeight: fontWeight,\n lineHeight: lineHeight + 'px',\n textTransform: textTransform ? textTransform : 'none',\n textDecorationLine: textDecorationLine ? textDecorationLine : 'none',\n fontStyle: fontStyle ? fontStyle : 'normal',\n color: color ? color : COLORS.black,\n}));\n\ninterface IHeadline {\n color?: string;\n}\n\ninterface IHeadlineBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n}\nconst HeadlineBase = styled(TypographyBase)<IHeadlineBase>(({ color, lineHeight, fontSize }) => ({\n fontSize: fontSize,\n fontWeight: 700,\n lineHeight: lineHeight,\n color: color,\n}));\n\nconst HeadlineXL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '48px',\n lineHeight: '64px',\n color: color,\n}));\n\nconst HeadlineL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '40px',\n lineHeight: '52px',\n color: color,\n}));\n\nconst HeadlineM = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '32px',\n lineHeight: '40px',\n color: color,\n}));\n\nconst HeadlineS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '28px',\n lineHeight: '36px',\n color: color,\n}));\n\nconst HeadlineXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '24px',\n lineHeight: '32px',\n color: color,\n}));\n\nconst HeadlineXXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '20px',\n lineHeight: '24px',\n color: color,\n}));\n\nconst ParagraphStyling = css`\n :lang(ja-jp) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(ko-kr) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(zh-CN) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 34em;\n }\n`;\n\ninterface IParagraphBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n marginBetweenParagraphs?: string;\n}\n\nconst ParagraphBase = styled(TypographyBase)<IParagraphBase>`\n p {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n p:not(:only-of-type) {\n margin-bottom: ${(props) => props.marginBetweenParagraphs \|\| '0'};\n }\n ${ParagraphStyling}\n`;\n\ninterface IParagraph {\n color?: string;\n}\n\nenum ParagraphTextStyle {\n Regular = 1,\n Bold,\n Italic,\n Underline,\n}\n\ntype ParagraphProps = {\n color?: string;\n textStyle?: ParagraphTextStyle;\n};\n\nconst paragraphFontWeight = (textStyle?: ParagraphTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ParagraphTextStyle.Bold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst paragraphFontStyle = (textStyle?: ParagraphTextStyle) => {\n let fontStyle = textStyle && textStyle === ParagraphTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst paragraphTextDecorationLine = (textStyle?: ParagraphTextStyle): Property.TextDecorationLine => {\n let textDecoration: Property.TextDecorationLine = textStyle && textStyle === ParagraphTextStyle.Underline ? 'underline' : 'none';\n return textDecoration;\n};\n\nconst ParagraphXL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={36} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"18px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={32} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"16px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphM: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={28} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"14px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={24} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"12px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphXS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={20} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"10px\">\n {children}\n </ParagraphBase>\n );\n};\n\nenum ComponentTextStyle {\n Regular = 1,\n Bold,\n Italic,\n UppercaseBold,\n}\n\ntype ComponentProps = {\n color?: string;\n textStyle?: ComponentTextStyle;\n};\n\nconst componentFontWeight = (textStyle?: ComponentTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ComponentTextStyle.Bold \|\| textStyle === ComponentTextStyle.UppercaseBold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst componentFontStyle = (textStyle?: ComponentTextStyle) => {\n let fontStyle = textStyle && textStyle === ComponentTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst componentTextTransformation = (textStyle?: ComponentTextStyle): Property.TextTransform => {\n let fontStyle: Property.TextTransform = textStyle && textStyle === ComponentTextStyle.UppercaseBold ? 'uppercase' : 'none';\n return fontStyle;\n};\n\nconst ComponentStyling = (fontSize: string, lineHeight: string, textStyle: ComponentTextStyle, color: string) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${componentFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${componentFontStyle(textStyle)};\n color: ${color ? color : COLORS.black};\n `;\n};\n\nconst ComponentXLStyling = (textStyle: ComponentTextStyle, color: string) => ComponentStyling('24px', '28px', textStyle, color);\nconst ComponentXL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={28} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentLStyling = (textStyle: ComponentTextStyle, color: string) => ComponentStyling('20px', '24px', textStyle, color);\nconst ComponentL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentMStyling = (textStyle: ComponentTextStyle, color: string) => ComponentStyling('18px', '24px', textStyle, color);\nconst ComponentM: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentSStyling = (textStyle: ComponentTextStyle, color: string) => ComponentStyling('16px', '20px', textStyle, color);\nconst ComponentS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={20} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXSStyling = (textStyle: ComponentTextStyle, color: string) => ComponentStyling('14px', '16px', textStyle, color);\nconst ComponentXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXXSStyling = (textStyle: ComponentTextStyle, color: string) => ComponentStyling('12px', '16px', textStyle, color);\nconst ComponentXXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={12} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentResponsive: FunctionComponent<ComponentProps & { size?: 'xxsmall' \| 'xsmall' \| 'small' \| 'medium' \| 'large'; width: number }> = ({\n color,\n textStyle,\n children,\n size,\n width,\n}) => {\n let fontsize = size;\n if (!size) {\n if (width < 768) {\n fontsize = 'small';\n } else if (width < 992) {\n fontsize = 'medium';\n } else {\n fontsize = 'large';\n }\n }\n switch (fontsize) {\n case 'xxsmall':\n return <ComponentXXS color={color} textStyle={textStyle} children={children} />;\n case 'xsmall':\n return <ComponentXS color={color} textStyle={textStyle} children={children} />;\n case 'small':\n return <ComponentS color={color} textStyle={textStyle} children={children} />;\n case 'medium':\n return <ComponentM color={color} textStyle={textStyle} children={children} />;\n case 'large':\n default:\n return <ComponentL color={color} textStyle={textStyle} children={children} />;\n }\n};\n\nexport { TYPOGRAPHY };\nexport { HeadlineXL, HeadlineL, HeadlineM, HeadlineS, HeadlineXS, HeadlineXXS };\nexport { ParagraphTextStyle, ParagraphXL, ParagraphL, ParagraphM, ParagraphS, ParagraphXS };\nexport { ComponentTextStyle, ComponentXL, ComponentL, ComponentM, ComponentS, ComponentXS, ComponentXXS, ComponentResponsive };\nexport { ComponentXLStyling, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling };\n"],"file":"typography.js"}
1	+ {"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["React","styled","css","COLORS","TYPOGRAPHY","fontFamily","TypographyBase","color","lineHeight","fontSize","fontWeight","fontStyle","textTransform","textDecorationLine","black","HeadlineBaseStyling","HeadlineBase","HeadlineXLStyling","HeadlineXL","HeadlineLStyling","HeadlineL","HeadlineMStyling","HeadlineM","HeadlineSStyling","HeadlineS","HeadlineXSStyling","HeadlineXS","HeadlineXXSStyling","HeadlineXXS","ParagraphStyling","ParagraphBase","props","marginBetweenParagraphs","ParagraphTextStyle","paragraphFontWeight","textStyle","Bold","paragraphFontStyle","Italic","paragraphTextDecorationLine","textDecoration","Underline","ParagraphBaseStyling","ParagraphXlStyling","ParagraphXL","children","ParagraphLStyling","ParagraphL","ParagraphMStyling","ParagraphM","ParagraphSStyling","ParagraphS","ParagraphXSStyling","ParagraphXS","ComponentTextStyle","componentFontWeight","UppercaseBold","componentFontStyle","componentTextTransformation","ComponentStyling","ComponentXLStyling","ComponentXL","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","size","width","fontsize"],"mappings":";AAAA,OAAOA,KAAP,MAAyC,OAAzC;AACA,OAAOC,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AACA,SAASC,MAAT,QAAuB,GAAvB;AAGA,MAAMC,UAAU,GAAG;AACjBC,EAAAA,UAAU,EAAE;AADK,CAAnB;AAcA,MAAMC,cAAc,GAAGL,MAAM,CAAC,KAAD,CAAN,CAA+B,CAAC;AAAEM,EAAAA,KAAF;AAASC,EAAAA,UAAT;AAAqBC,EAAAA,QAArB;AAA+BC,EAAAA,UAA/B;AAA2CC,EAAAA,SAA3C;AAAsDC,EAAAA,aAAtD;AAAqEC,EAAAA;AAArE,CAAD,MAAgG;AACpJR,EAAAA,UAAU,EAAED,UAAU,CAACC,UAD6H;AAEpJI,EAAAA,QAAQ,EAAEA,QAF0I;AAGpJC,EAAAA,UAAU,EAAEA,UAHwI;AAIpJF,EAAAA,UAAU,EAAEA,UAAU,GAAG,IAJ2H;AAKpJI,EAAAA,aAAa,EAAEA,aAAa,GAAGA,aAAH,GAAmB,MALqG;AAMpJC,EAAAA,kBAAkB,EAAEA,kBAAkB,GAAGA,kBAAH,GAAwB,MANsF;AAOpJF,EAAAA,SAAS,EAAEA,SAAS,GAAGA,SAAH,GAAe,QAPiH;AAQpJJ,EAAAA,KAAK,EAAEA,KAAK,GAAGA,KAAH,GAAWJ,MAAM,CAACW;AARsH,CAAhG,CAA/B,CAAvB;;AAqBA,MAAMC,mBAAmB,GAAG,CAACN,QAAD,EAAmBD,UAAnB,EAAuCD,KAAvC,KAAyD;AACnF,SAAOL,GAAI;AACb,iBAAiBO,QAAS;AAC1B,mBAAmBD,UAAW;AAC9B;AACA,aAAaD,KAAM;AACnB,GALE;AAMD,CAPD;;AAQA,MAAMS,YAAY,GAAGf,MAAM,CAACK,cAAD,CAAN,CAAsC,CAAC;AAAEC,EAAAA,KAAF;AAASC,EAAAA,UAAT;AAAqBC,EAAAA;AAArB,CAAD,MAAsC;AAC/FA,EAAAA,QAAQ,EAAEA,QADqF;AAE/FC,EAAAA,UAAU,EAAE,GAFmF;AAG/FF,EAAAA,UAAU,EAAEA,UAHmF;AAI/FD,EAAAA,KAAK,EAAEA;AAJwF,CAAtC,CAAtC,CAArB;;AAOA,MAAMU,iBAAiB,GAAIV,KAAD,IAAmBQ,mBAAmB,CAAC,MAAD,EAAS,MAAT,EAAiBR,KAAjB,CAAhE;;AACA,MAAMW,UAAU,GAAGjB,MAAM,CAACe,YAAD,CAAN,CAAgC,CAAC;AAAET,EAAAA;AAAF,CAAD,MAAgB;AACjEE,EAAAA,QAAQ,EAAE,MADuD;AAEjED,EAAAA,UAAU,EAAE,MAFqD;AAGjED,EAAAA,KAAK,EAAEA;AAH0D,CAAhB,CAAhC,CAAnB;;AAMA,MAAMY,gBAAgB,GAAIZ,KAAD,IAAmBQ,mBAAmB,CAAC,MAAD,EAAS,MAAT,EAAiBR,KAAjB,CAA/D;;AACA,MAAMa,SAAS,GAAGnB,MAAM,CAACe,YAAD,CAAN,CAAgC,CAAC;AAAET,EAAAA;AAAF,CAAD,MAAgB;AAChEE,EAAAA,QAAQ,EAAE,MADsD;AAEhED,EAAAA,UAAU,EAAE,MAFoD;AAGhED,EAAAA,KAAK,EAAEA;AAHyD,CAAhB,CAAhC,CAAlB;;AAMA,MAAMc,gBAAgB,GAAId,KAAD,IAAmBQ,mBAAmB,CAAC,MAAD,EAAS,MAAT,EAAiBR,KAAjB,CAA/D;;AACA,MAAMe,SAAS,GAAGrB,MAAM,CAACe,YAAD,CAAN,CAAgC,CAAC;AAAET,EAAAA;AAAF,CAAD,MAAgB;AAChEE,EAAAA,QAAQ,EAAE,MADsD;AAEhED,EAAAA,UAAU,EAAE,MAFoD;AAGhED,EAAAA,KAAK,EAAEA;AAHyD,CAAhB,CAAhC,CAAlB;;AAMA,MAAMgB,gBAAgB,GAAIhB,KAAD,IAAmBQ,mBAAmB,CAAC,MAAD,EAAS,MAAT,EAAiBR,KAAjB,CAA/D;;AACA,MAAMiB,SAAS,GAAGvB,MAAM,CAACe,YAAD,CAAN,CAAgC,CAAC;AAAET,EAAAA;AAAF,CAAD,MAAgB;AAChEE,EAAAA,QAAQ,EAAE,MADsD;AAEhED,EAAAA,UAAU,EAAE,MAFoD;AAGhED,EAAAA,KAAK,EAAEA;AAHyD,CAAhB,CAAhC,CAAlB;;AAMA,MAAMkB,iBAAiB,GAAIlB,KAAD,IAAmBQ,mBAAmB,CAAC,MAAD,EAAS,MAAT,EAAiBR,KAAjB,CAAhE;;AACA,MAAMmB,UAAU,GAAGzB,MAAM,CAACe,YAAD,CAAN,CAAgC,CAAC;AAAET,EAAAA;AAAF,CAAD,MAAgB;AACjEE,EAAAA,QAAQ,EAAE,MADuD;AAEjED,EAAAA,UAAU,EAAE,MAFqD;AAGjED,EAAAA,KAAK,EAAEA;AAH0D,CAAhB,CAAhC,CAAnB;;AAMA,MAAMoB,kBAAkB,GAAIpB,KAAD,IAAmBQ,mBAAmB,CAAC,MAAD,EAAS,MAAT,EAAiBR,KAAjB,CAAjE;;AACA,MAAMqB,WAAW,GAAG3B,MAAM,CAACe,YAAD,CAAN,CAAgC,CAAC;AAAET,EAAAA;AAAF,CAAD,MAAgB;AAClEE,EAAAA,QAAQ,EAAE,MADwD;AAElED,EAAAA,UAAU,EAAE,MAFsD;AAGlED,EAAAA,KAAK,EAAEA;AAH2D,CAAhB,CAAhC,CAApB;AAMA,MAAMsB,gBAAgB,GAAG3B,GAAI;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAjCA;AA0CA,MAAM4B,aAAa,GAAG7B,MAAM,CAACK,cAAD,CAAiC;AAC7D;AACA;AACA;AACA;AACA;AACA,qBAAsByB,KAAD,IAAWA,KAAK,CAACC,uBAAN,IAAiC,GAAI;AACrE;AACA,IAAIH,gBAAiB;AACrB,CATA;IAeKI,kB;;WAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;GAAAA,kB,KAAAA,kB;;AAYL,MAAMC,mBAAmB,GAAIC,SAAD,IAAoC;AAC9D,MAAIzB,UAAU,GAAG,GAAjB;;AACA,MAAIyB,SAAS,KAAKF,kBAAkB,CAACG,IAArC,EAA2C;AACzC1B,IAAAA,UAAU,GAAG,GAAb;AACD;;AACD,SAAOA,UAAP;AACD,CAND;;AAQA,MAAM2B,kBAAkB,GAAIF,SAAD,IAAoC;AAC7D,MAAIxB,SAAS,GAAGwB,SAAS,IAAIA,SAAS,KAAKF,kBAAkB,CAACK,MAA9C,GAAuD,QAAvD,GAAkE,EAAlF;AACA,SAAO3B,SAAP;AACD,CAHD;;AAKA,MAAM4B,2BAA2B,GAAIJ,SAAD,IAAiE;AACnG,MAAIK,cAA2C,GAAGL,SAAS,IAAIA,SAAS,KAAKF,kBAAkB,CAACQ,SAA9C,GAA0D,WAA1D,GAAwE,MAA1H;AACA,SAAOD,cAAP;AACD,CAHD;;AAKA,MAAME,oBAAoB,GAAG,CAACjC,QAAD,EAAmBD,UAAnB,EAAuC2B,SAAvC,EAAsE5B,KAAtE,KAAwF;AACnH,SAAOL,GAAI;AACb,mBAAmBE,UAAU,CAACC,UAAW;AACzC,iBAAiBI,QAAS;AAC1B,mBAAmByB,mBAAmB,CAACC,SAAD,CAAY;AAClD,mBAAmB3B,UAAW;AAC9B,kBAAkB6B,kBAAkB,CAACF,SAAD,CAAY;AAChD,aAAa5B,KAAM;AACnB,GAPE;AAQD,CATD;;AAWA,MAAMoC,kBAAkB,GAAG,CAACR,SAAD,EAAgC5B,KAAhC,KAAkDmC,oBAAoB,CAAC,MAAD,EAAS,MAAT,EAAiBP,SAAjB,EAA4B5B,KAA5B,CAAjG;;AACA,MAAMqC,WAA8C,GAAG,CAAC;AAAErC,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACzF,MAAInC,UAAU,GAAGwB,mBAAmB,CAACC,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG0B,kBAAkB,CAACF,SAAD,CAAlC;AACA,MAAItB,kBAAkB,GAAG0B,2BAA2B,CAACJ,SAAD,CAApD;AACA,sBACE,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAE5B,KAAtB;AAA6B,IAAA,UAAU,EAAE,EAAzC;AAA6C,IAAA,QAAQ,EAAE,EAAvD;AAA2D,IAAA,UAAU,EAAEG,UAAvE;AAAmF,IAAA,SAAS,EAAEC,SAA9F;AAAyG,IAAA,kBAAkB,EAAEE,kBAA7H;AAAiJ,IAAA,uBAAuB,EAAC;AAAzK,KACGgC,QADH,CADF;AAKD,CATD;;;AAlCEtC,EAAAA,K;AACA4B,EAAAA,S;;;AA4CF,MAAMW,iBAAiB,GAAG,CAACX,SAAD,EAAgC5B,KAAhC,KAAkDmC,oBAAoB,CAAC,MAAD,EAAS,MAAT,EAAiBP,SAAjB,EAA4B5B,KAA5B,CAAhG;;AACA,MAAMwC,UAA6C,GAAG,CAAC;AAAExC,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACxF,MAAInC,UAAU,GAAGwB,mBAAmB,CAACC,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG0B,kBAAkB,CAACF,SAAD,CAAlC;AACA,MAAItB,kBAAkB,GAAG0B,2BAA2B,CAACJ,SAAD,CAApD;AACA,sBACE,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAE5B,KAAtB;AAA6B,IAAA,UAAU,EAAE,EAAzC;AAA6C,IAAA,QAAQ,EAAE,EAAvD;AAA2D,IAAA,UAAU,EAAEG,UAAvE;AAAmF,IAAA,SAAS,EAAEC,SAA9F;AAAyG,IAAA,kBAAkB,EAAEE,kBAA7H;AAAiJ,IAAA,uBAAuB,EAAC;AAAzK,KACGgC,QADH,CADF;AAKD,CATD;;;AA9CEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAwDF,MAAMa,iBAAiB,GAAG,CAACb,SAAD,EAAgC5B,KAAhC,KAAkDmC,oBAAoB,CAAC,MAAD,EAAS,MAAT,EAAiBP,SAAjB,EAA4B5B,KAA5B,CAAhG;;AACA,MAAM0C,UAA6C,GAAG,CAAC;AAAE1C,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACxF,MAAInC,UAAU,GAAGwB,mBAAmB,CAACC,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG0B,kBAAkB,CAACF,SAAD,CAAlC;AACA,MAAItB,kBAAkB,GAAG0B,2BAA2B,CAACJ,SAAD,CAApD;AACA,sBACE,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAE5B,KAAtB;AAA6B,IAAA,UAAU,EAAE,EAAzC;AAA6C,IAAA,QAAQ,EAAE,EAAvD;AAA2D,IAAA,UAAU,EAAEG,UAAvE;AAAmF,IAAA,SAAS,EAAEC,SAA9F;AAAyG,IAAA,kBAAkB,EAAEE,kBAA7H;AAAiJ,IAAA,uBAAuB,EAAC;AAAzK,KACGgC,QADH,CADF;AAKD,CATD;;;AA1DEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAoEF,MAAMe,iBAAiB,GAAG,CAACf,SAAD,EAAgC5B,KAAhC,KAAkDmC,oBAAoB,CAAC,MAAD,EAAS,MAAT,EAAiBP,SAAjB,EAA4B5B,KAA5B,CAAhG;;AACA,MAAM4C,UAA6C,GAAG,CAAC;AAAE5C,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACxF,MAAInC,UAAU,GAAGwB,mBAAmB,CAACC,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG0B,kBAAkB,CAACF,SAAD,CAAlC;AACA,MAAItB,kBAAkB,GAAG0B,2BAA2B,CAACJ,SAAD,CAApD;AACA,sBACE,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAE5B,KAAtB;AAA6B,IAAA,UAAU,EAAE,EAAzC;AAA6C,IAAA,QAAQ,EAAE,EAAvD;AAA2D,IAAA,UAAU,EAAEG,UAAvE;AAAmF,IAAA,SAAS,EAAEC,SAA9F;AAAyG,IAAA,kBAAkB,EAAEE,kBAA7H;AAAiJ,IAAA,uBAAuB,EAAC;AAAzK,KACGgC,QADH,CADF;AAKD,CATD;;;AAtEEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAgFF,MAAMiB,kBAAkB,GAAG,CAACjB,SAAD,EAAgC5B,KAAhC,KAAkDmC,oBAAoB,CAAC,MAAD,EAAS,MAAT,EAAiBP,SAAjB,EAA4B5B,KAA5B,CAAjG;;AACA,MAAM8C,WAA8C,GAAG,CAAC;AAAE9C,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACzF,MAAInC,UAAU,GAAGwB,mBAAmB,CAACC,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG0B,kBAAkB,CAACF,SAAD,CAAlC;AACA,MAAItB,kBAAkB,GAAG0B,2BAA2B,CAACJ,SAAD,CAApD;AACA,sBACE,oBAAC,aAAD;AAAe,IAAA,KAAK,EAAE5B,KAAtB;AAA6B,IAAA,UAAU,EAAE,EAAzC;AAA6C,IAAA,QAAQ,EAAE,EAAvD;AAA2D,IAAA,UAAU,EAAEG,UAAvE;AAAmF,IAAA,SAAS,EAAEC,SAA9F;AAAyG,IAAA,kBAAkB,EAAEE,kBAA7H;AAAiJ,IAAA,uBAAuB,EAAC;AAAzK,KACGgC,QADH,CADF;AAKD,CATD;;;AAlFEtC,EAAAA,K;AACA4B,EAAAA,S;;IA4FGmB,kB;;WAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;AAAAA,EAAAA,kB,CAAAA,kB;GAAAA,kB,KAAAA,kB;;AAYL,MAAMC,mBAAmB,GAAIpB,SAAD,IAAoC;AAC9D,MAAIzB,UAAU,GAAG,GAAjB;;AACA,MAAIyB,SAAS,KAAKmB,kBAAkB,CAAClB,IAAjC,IAAyCD,SAAS,KAAKmB,kBAAkB,CAACE,aAA9E,EAA6F;AAC3F9C,IAAAA,UAAU,GAAG,GAAb;AACD;;AACD,SAAOA,UAAP;AACD,CAND;;AAQA,MAAM+C,kBAAkB,GAAItB,SAAD,IAAoC;AAC7D,MAAIxB,SAAS,GAAGwB,SAAS,IAAIA,SAAS,KAAKmB,kBAAkB,CAAChB,MAA9C,GAAuD,QAAvD,GAAkE,EAAlF;AACA,SAAO3B,SAAP;AACD,CAHD;;AAKA,MAAM+C,2BAA2B,GAAIvB,SAAD,IAA4D;AAC9F,MAAIxB,SAAiC,GAAGwB,SAAS,IAAIA,SAAS,KAAKmB,kBAAkB,CAACE,aAA9C,GAA8D,WAA9D,GAA4E,MAApH;AACA,SAAO7C,SAAP;AACD,CAHD;;AAKA,MAAMgD,gBAAgB,GAAG,CAAClD,QAAD,EAAmBD,UAAnB,EAAuC2B,SAAvC,EAAsE5B,KAAtE,KAA2G;AAClI,SAAOL,GAAI;AACb,mBAAmBE,UAAU,CAACC,UAAW;AACzC,iBAAiBI,QAAS;AAC1B,mBAAmB8C,mBAAmB,CAACpB,SAAD,CAAY;AAClD,mBAAmB3B,UAAW;AAC9B,kBAAkBiD,kBAAkB,CAACtB,SAAD,CAAY;AAChD,MAAM5B,KAAK,KAAK,IAAV,GAAiB,EAAjB,GAAuB,UAAUA,KAAK,IAAIJ,MAAM,CAACW,KAAO,GAAG;AACjE,GAPE;AAQD,CATD;;AAWA,MAAM8C,kBAAkB,GAAG,CAACzB,SAAD,EAAgC5B,KAAhC,KAAyDoD,gBAAgB,CAAC,MAAD,EAAS,MAAT,EAAiBxB,SAAjB,EAA4B5B,KAA5B,CAApG;;AACA,MAAMsD,WAA8C,GAAG,CAAC;AAAEtD,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACzF,MAAInC,UAAU,GAAG6C,mBAAmB,CAACpB,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG8C,kBAAkB,CAACtB,SAAD,CAAlC;AACA,sBACE,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE5B,KAAvB;AAA8B,IAAA,UAAU,EAAE,EAA1C;AAA8C,IAAA,QAAQ,EAAE,EAAxD;AAA4D,IAAA,UAAU,EAAEG,UAAxE;AAAoF,IAAA,SAAS,EAAEC;AAA/F,KACGkC,QADH,CADF;AAKD,CARD;;;AAlCEtC,EAAAA,K;AACA4B,EAAAA,S;;;AA2CF,MAAM2B,iBAAiB,GAAG,CAAC3B,SAAD,EAAgC5B,KAAhC,KAAyDoD,gBAAgB,CAAC,MAAD,EAAS,MAAT,EAAiBxB,SAAjB,EAA4B5B,KAA5B,CAAnG;;AACA,MAAMwD,UAA6C,GAAG,CAAC;AAAExD,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACxF,MAAInC,UAAU,GAAG6C,mBAAmB,CAACpB,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG8C,kBAAkB,CAACtB,SAAD,CAAlC;AACA,sBACE,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE5B,KAAvB;AAA8B,IAAA,UAAU,EAAE,EAA1C;AAA8C,IAAA,QAAQ,EAAE,EAAxD;AAA4D,IAAA,UAAU,EAAEG,UAAxE;AAAoF,IAAA,SAAS,EAAEC;AAA/F,KACGkC,QADH,CADF;AAKD,CARD;;;AA7CEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAsDF,MAAM6B,iBAAiB,GAAG,CAAC7B,SAAD,EAAgC5B,KAAhC,KAAqEoD,gBAAgB,CAAC,MAAD,EAAS,MAAT,EAAiBxB,SAAjB,EAA4B5B,KAA5B,CAA/G;;AACA,MAAM0D,UAA6C,GAAG,CAAC;AAAE1D,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACxF,MAAInC,UAAU,GAAG6C,mBAAmB,CAACpB,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG8C,kBAAkB,CAACtB,SAAD,CAAlC;AACA,sBACE,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE5B,KAAvB;AAA8B,IAAA,UAAU,EAAE,EAA1C;AAA8C,IAAA,QAAQ,EAAE,EAAxD;AAA4D,IAAA,UAAU,EAAEG,UAAxE;AAAoF,IAAA,SAAS,EAAEC;AAA/F,KACGkC,QADH,CADF;AAKD,CARD;;;AAxDEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAiEF,MAAM+B,iBAAiB,GAAG,CAAC/B,SAAD,EAAgC5B,KAAhC,KAAyDoD,gBAAgB,CAAC,MAAD,EAAS,MAAT,EAAiBxB,SAAjB,EAA4B5B,KAA5B,CAAnG;;AACA,MAAM4D,UAA6C,GAAG,CAAC;AAAE5D,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACxF,MAAInC,UAAU,GAAG6C,mBAAmB,CAACpB,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG8C,kBAAkB,CAACtB,SAAD,CAAlC;AACA,sBACE,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE5B,KAAvB;AAA8B,IAAA,UAAU,EAAE,EAA1C;AAA8C,IAAA,QAAQ,EAAE,EAAxD;AAA4D,IAAA,UAAU,EAAEG,UAAxE;AAAoF,IAAA,SAAS,EAAEC;AAA/F,KACGkC,QADH,CADF;AAKD,CARD;;;AAnEEtC,EAAAA,K;AACA4B,EAAAA,S;;;AA4EF,MAAMiC,kBAAkB,GAAG,CAACjC,SAAD,EAAgC5B,KAAhC,KAAyDoD,gBAAgB,CAAC,MAAD,EAAS,MAAT,EAAiBxB,SAAjB,EAA4B5B,KAA5B,CAApG;;AACA,MAAM8D,WAA8C,GAAG,CAAC;AAAE9D,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AACzF,MAAInC,UAAU,GAAG6C,mBAAmB,CAACpB,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG8C,kBAAkB,CAACtB,SAAD,CAAlC;AACA,MAAIvB,aAAa,GAAG8C,2BAA2B,CAACvB,SAAD,CAA/C;AACA,sBACE,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE5B,KAAvB;AAA8B,IAAA,UAAU,EAAE,EAA1C;AAA8C,IAAA,QAAQ,EAAE,EAAxD;AAA4D,IAAA,UAAU,EAAEG,UAAxE;AAAoF,IAAA,SAAS,EAAEC,SAA/F;AAA0G,IAAA,aAAa,EAAEC;AAAzH,KACGiC,QADH,CADF;AAKD,CATD;;;AA9EEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAwFF,MAAMmC,mBAAmB,GAAG,CAACnC,SAAD,EAAgC5B,KAAhC,KAAyDoD,gBAAgB,CAAC,MAAD,EAAS,MAAT,EAAiBxB,SAAjB,EAA4B5B,KAA5B,CAArG;;AACA,MAAMgE,YAA+C,GAAG,CAAC;AAAEhE,EAAAA,KAAF;AAAS4B,EAAAA,SAAT;AAAoBU,EAAAA;AAApB,CAAD,KAAoC;AAC1F,MAAInC,UAAU,GAAG6C,mBAAmB,CAACpB,SAAD,CAApC;AACA,MAAIxB,SAAS,GAAG8C,kBAAkB,CAACtB,SAAD,CAAlC;AACA,MAAIvB,aAAa,GAAG8C,2BAA2B,CAACvB,SAAD,CAA/C;AACA,sBACE,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE5B,KAAvB;AAA8B,IAAA,UAAU,EAAE,EAA1C;AAA8C,IAAA,QAAQ,EAAE,EAAxD;AAA4D,IAAA,UAAU,EAAEG,UAAxE;AAAoF,IAAA,SAAS,EAAEC,SAA/F;AAA0G,IAAA,aAAa,EAAEC;AAAzH,KACGiC,QADH,CADF;AAKD,CATD;;;AA1FEtC,EAAAA,K;AACA4B,EAAAA,S;;;AAoGF,MAAMqC,mBAAsI,GAAG,CAAC;AAC9IjE,EAAAA,KAD8I;AAE9I4B,EAAAA,SAF8I;AAG9IU,EAAAA,QAH8I;AAI9I4B,EAAAA,IAJ8I;AAK9IC,EAAAA;AAL8I,CAAD,KAMzI;AACJ,MAAIC,QAAQ,GAAGF,IAAf;;AACA,MAAI,CAACA,IAAL,EAAW;AACT,QAAIC,KAAK,GAAG,GAAZ,EAAiB;AACfC,MAAAA,QAAQ,GAAG,OAAX;AACD,KAFD,MAEO,IAAID,KAAK,GAAG,GAAZ,EAAiB;AACtBC,MAAAA,QAAQ,GAAG,QAAX;AACD,KAFM,MAEA;AACLA,MAAAA,QAAQ,GAAG,OAAX;AACD;AACF;;AACD,UAAQA,QAAR;AACE,SAAK,SAAL;AACE,0BAAO,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEpE,KAArB;AAA4B,QAAA,SAAS,EAAE4B,SAAvC;AAAkD,QAAA,QAAQ,EAAEU;AAA5D,QAAP;;AACF,SAAK,QAAL;AACE,0BAAO,oBAAC,WAAD;AAAa,QAAA,KAAK,EAAEtC,KAApB;AAA2B,QAAA,SAAS,EAAE4B,SAAtC;AAAiD,QAAA,QAAQ,EAAEU;AAA3D,QAAP;;AACF,SAAK,OAAL;AACE,0BAAO,oBAAC,UAAD;AAAY,QAAA,KAAK,EAAEtC,KAAnB;AAA0B,QAAA,SAAS,EAAE4B,SAArC;AAAgD,QAAA,QAAQ,EAAEU;AAA1D,QAAP;;AACF,SAAK,QAAL;AACE,0BAAO,oBAAC,UAAD;AAAY,QAAA,KAAK,EAAEtC,KAAnB;AAA0B,QAAA,SAAS,EAAE4B,SAArC;AAAgD,QAAA,QAAQ,EAAEU;AAA1D,QAAP;;AACF,SAAK,OAAL;AACA;AACE,0BAAO,oBAAC,UAAD;AAAY,QAAA,KAAK,EAAEtC,KAAnB;AAA0B,QAAA,SAAS,EAAE4B,SAArC;AAAgD,QAAA,QAAQ,EAAEU;AAA1D,QAAP;AAXJ;AAaD,CA9BD;;;AArGEtC,EAAAA,K;AACA4B,EAAAA,S;;AAoIF,SAAS/B,UAAT;AACA,SAASc,UAAT,EAAqBE,SAArB,EAAgCE,SAAhC,EAA2CE,SAA3C,EAAsDE,UAAtD,EAAkEE,WAAlE;AACA,SAASK,kBAAT,EAA6BW,WAA7B,EAA0CG,UAA1C,EAAsDE,UAAtD,EAAkEE,UAAlE,EAA8EE,WAA9E;AACA,SAASC,kBAAT,EAA6BO,WAA7B,EAA0CE,UAA1C,EAAsDE,UAAtD,EAAkEE,UAAlE,EAA8EE,WAA9E,EAA2FE,YAA3F,EAAyGC,mBAAzG;AACA,SAASZ,kBAAT,EAA6BE,iBAA7B,EAAgDE,iBAAhD,EAAmEE,iBAAnE,EAAsFE,kBAAtF,EAA0GE,mBAA1G;AACA,SAAS3B,kBAAT,EAA6BG,iBAA7B,EAAgDE,iBAAhD,EAAmEE,iBAAnE,EAAsFE,kBAAtF;AACA,SAASnC,iBAAT,EAA4BE,gBAA5B,EAA8CE,gBAA9C,EAAgEE,gBAAhE,EAAkFE,iBAAlF,EAAqGE,kBAArG","sourcesContent":["import React, { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS } from '.';\nimport { Property } from 'csstype';\n\nconst TYPOGRAPHY = {\n fontFamily: 'Lato, sans-serif',\n};\n\ninterface ITypographyBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n fontWeight: number;\n fontStyle?: string;\n textTransform?: Property.TextTransform;\n textDecorationLine?: Property.TextDecorationLine;\n}\n\nconst TypographyBase = styled('div')<ITypographyBase>(({ color, lineHeight, fontSize, fontWeight, fontStyle, textTransform, textDecorationLine }) => ({\n fontFamily: TYPOGRAPHY.fontFamily,\n fontSize: fontSize,\n fontWeight: fontWeight,\n lineHeight: lineHeight + 'px',\n textTransform: textTransform ? textTransform : 'none',\n textDecorationLine: textDecorationLine ? textDecorationLine : 'none',\n fontStyle: fontStyle ? fontStyle : 'normal',\n color: color ? color : COLORS.black,\n}));\n\ninterface IHeadline {\n color?: string;\n}\n\ninterface IHeadlineBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n}\n\nconst HeadlineBaseStyling = (fontSize: string, lineHeight: string, color: string) => {\n return css`\n font-size: ${fontSize};\n line-height: ${lineHeight};\n font-weight: 700;\n color: ${color};\n `;\n}\nconst HeadlineBase = styled(TypographyBase)<IHeadlineBase>(({ color, lineHeight, fontSize }) => ({\n fontSize: fontSize,\n fontWeight: 700,\n lineHeight: lineHeight,\n color: color,\n}));\n\nconst HeadlineXLStyling = (color: string) => HeadlineBaseStyling('48px', '64px', color);\nconst HeadlineXL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '48px',\n lineHeight: '64px',\n color: color,\n}));\n\nconst HeadlineLStyling = (color: string) => HeadlineBaseStyling('40px', '52px', color);\nconst HeadlineL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '40px',\n lineHeight: '52px',\n color: color,\n}));\n\nconst HeadlineMStyling = (color: string) => HeadlineBaseStyling('32px', '40px', color);\nconst HeadlineM = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '32px',\n lineHeight: '40px',\n color: color,\n}));\n\nconst HeadlineSStyling = (color: string) => HeadlineBaseStyling('28px', '36px', color);\nconst HeadlineS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '28px',\n lineHeight: '36px',\n color: color,\n}));\n\nconst HeadlineXSStyling = (color: string) => HeadlineBaseStyling('24px', '32px', color);\nconst HeadlineXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '24px',\n lineHeight: '32px',\n color: color,\n}));\n\nconst HeadlineXXSStyling = (color: string) => HeadlineBaseStyling('20px', '24px', color);\nconst HeadlineXXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '20px',\n lineHeight: '24px',\n color: color,\n}));\n\nconst ParagraphStyling = css`\n :lang(ja-jp) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(ko-kr) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(zh-CN) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 34em;\n }\n`;\n\ninterface IParagraphBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n marginBetweenParagraphs?: string;\n}\n\nconst ParagraphBase = styled(TypographyBase)<IParagraphBase>`\n p {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n p:not(:only-of-type) {\n margin-bottom: ${(props) => props.marginBetweenParagraphs \|\| '0'};\n }\n ${ParagraphStyling}\n`;\n\ninterface IParagraph {\n color?: string;\n}\n\nenum ParagraphTextStyle {\n Regular = 1,\n Bold,\n Italic,\n Underline,\n}\n\ntype ParagraphProps = {\n color?: string;\n textStyle?: ParagraphTextStyle;\n};\n\nconst paragraphFontWeight = (textStyle?: ParagraphTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ParagraphTextStyle.Bold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst paragraphFontStyle = (textStyle?: ParagraphTextStyle) => {\n let fontStyle = textStyle && textStyle === ParagraphTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst paragraphTextDecorationLine = (textStyle?: ParagraphTextStyle): Property.TextDecorationLine => {\n let textDecoration: Property.TextDecorationLine = textStyle && textStyle === ParagraphTextStyle.Underline ? 'underline' : 'none';\n return textDecoration;\n};\n\nconst ParagraphBaseStyling = (fontSize: string, lineHeight: string, textStyle: ParagraphTextStyle, color: string) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${paragraphFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${paragraphFontStyle(textStyle)};\n color: ${color};\n `;\n}\n\nconst ParagraphXlStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('24px', '36px', textStyle, color);\nconst ParagraphXL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={36} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"18px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphLStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('20px', '32px', textStyle, color);\nconst ParagraphL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={32} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"16px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphMStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('18px', '28px', textStyle, color);\nconst ParagraphM: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={28} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"14px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphSStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('16px', '24px', textStyle, color);\nconst ParagraphS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={24} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"12px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphXSStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('14px', '20px', textStyle, color);\nconst ParagraphXS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={20} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"10px\">\n {children}\n </ParagraphBase>\n );\n};\n\nenum ComponentTextStyle {\n Regular = 1,\n Bold,\n Italic,\n UppercaseBold,\n}\n\ntype ComponentProps = {\n color?: string;\n textStyle?: ComponentTextStyle;\n};\n\nconst componentFontWeight = (textStyle?: ComponentTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ComponentTextStyle.Bold \|\| textStyle === ComponentTextStyle.UppercaseBold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst componentFontStyle = (textStyle?: ComponentTextStyle) => {\n let fontStyle = textStyle && textStyle === ComponentTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst componentTextTransformation = (textStyle?: ComponentTextStyle): Property.TextTransform => {\n let fontStyle: Property.TextTransform = textStyle && textStyle === ComponentTextStyle.UppercaseBold ? 'uppercase' : 'none';\n return fontStyle;\n};\n\nconst ComponentStyling = (fontSize: string, lineHeight: string, textStyle: ComponentTextStyle, color: string \| undefined \| null) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${componentFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${componentFontStyle(textStyle)};\n ${color === null ? '' : `color: ${(color \|\| COLORS.black)};`}\n `;\n};\n\nconst ComponentXLStyling = (textStyle: ComponentTextStyle, color: string \| null) => ComponentStyling('24px', '28px', textStyle, color);\nconst ComponentXL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={28} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentLStyling = (textStyle: ComponentTextStyle, color: string \| null) => ComponentStyling('20px', '24px', textStyle, color);\nconst ComponentL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentMStyling = (textStyle: ComponentTextStyle, color: string \| undefined \| null) => ComponentStyling('18px', '24px', textStyle, color);\nconst ComponentM: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentSStyling = (textStyle: ComponentTextStyle, color: string \| null) => ComponentStyling('16px', '20px', textStyle, color);\nconst ComponentS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={20} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXSStyling = (textStyle: ComponentTextStyle, color: string \| null) => ComponentStyling('14px', '16px', textStyle, color);\nconst ComponentXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXXSStyling = (textStyle: ComponentTextStyle, color: string \| null) => ComponentStyling('12px', '16px', textStyle, color);\nconst ComponentXXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={12} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentResponsive: FunctionComponent<ComponentProps & { size?: 'xxsmall' \| 'xsmall' \| 'small' \| 'medium' \| 'large'; width: number }> = ({\n color,\n textStyle,\n children,\n size,\n width,\n}) => {\n let fontsize = size;\n if (!size) {\n if (width < 768) {\n fontsize = 'small';\n } else if (width < 992) {\n fontsize = 'medium';\n } else {\n fontsize = 'large';\n }\n }\n switch (fontsize) {\n case 'xxsmall':\n return <ComponentXXS color={color} textStyle={textStyle} children={children} />;\n case 'xsmall':\n return <ComponentXS color={color} textStyle={textStyle} children={children} />;\n case 'small':\n return <ComponentS color={color} textStyle={textStyle} children={children} />;\n case 'medium':\n return <ComponentM color={color} textStyle={textStyle} children={children} />;\n case 'large':\n default:\n return <ComponentL color={color} textStyle={textStyle} children={children} />;\n }\n};\n\nexport { TYPOGRAPHY };\nexport { HeadlineXL, HeadlineL, HeadlineM, HeadlineS, HeadlineXS, HeadlineXXS };\nexport { ParagraphTextStyle, ParagraphXL, ParagraphL, ParagraphM, ParagraphS, ParagraphXS };\nexport { ComponentTextStyle, ComponentXL, ComponentL, ComponentM, ComponentS, ComponentXS, ComponentXXS, ComponentResponsive };\nexport { ComponentXLStyling, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling };\nexport { ParagraphXlStyling, ParagraphLStyling, ParagraphMStyling, ParagraphSStyling, ParagraphXSStyling };\nexport { HeadlineXLStyling, HeadlineLStyling, HeadlineMStyling, HeadlineSStyling, HeadlineXSStyling, HeadlineXXSStyling };\n"],"file":"typography.js"}

package/dist/js/AuthPage/Information.js CHANGED Viewed

@@ -11,6 +11,8 @@ var _AuthPageSection = _interopRequireDefault(require("./_AuthPageSection"));
 var _styles = require("../styles");
+var _typography = require("../styles/typography");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -26,11 +28,11 @@ var InformationContent = _styledComponents.default.div(_templateObject2 || (_tem
 exports.InformationContent = InformationContent;
-var InformationHeader = _styledComponents.default.h2(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  font-style: normal;\n  font-weight: 300;\n  font-size: 48px;\n  line-height: 140%;\n  margin-bottom: 0;\n"])));
+var InformationHeader = _styledComponents.default.h2(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n  font-weight: 300;\n  margin-bottom: 0;\n"])), (0, _typography.HeadlineXLStyling)(_styles.COLORS.black));
 exports.InformationHeader = InformationHeader;
-var InformationText = _styledComponents.default.p(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 140%;\n  color: ", ";\n  margin: 8px 0;\n"])), _styles.COLORS.neutral_600);
+var InformationText = _styledComponents.default.p(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  ", "\n  margin: 8px 0;\n"])), (0, _typography.ParagraphLStyling)(_styles.ParagraphTextStyle.Regular, _styles.COLORS.neutral_600));
 exports.InformationText = InformationText;

package/dist/js/AuthPage/Information.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/AuthPage/Information.tsx"],"names":["InformationContainer","AuthPageSection","props","color","BREAKPOINTS","MEDIUM","InformationContent","styled","div","LARGE","InformationHeader","h2","InformationText","p","~~COLORS~~","neutral_600","InformationImage","img"],"mappings":";;;;;;;AACA;;AACA;;AACA;;;;;;;;AAEO,IAAMA,oBAAoB,GAAG,+BAAOC,wBAAP,CAAH,4KAEjB,UAAAC,KAAK;AAAA,SAAIA,KAAK,CAACC,KAAV;AAAA,CAFY,EAI7BC,oBAAYC,MAJiB,CAA1B;;;AAUA,IAAMC,kBAAkB,GAAGC,0BAAOC,GAAV,sRAQ3BJ,oBAAYK,KARe,CAAxB;;;;AAcA,IAAMC,iBAAiB,GAAGH,0BAAOI,EAAV,~~oLAAvB~~;;;;~~AAQA~~,IAAMC,eAAe,~~GAAGL~~,~~0BAAOM~~,CAAV,~~sJAGjBC~~,~~eAAOC~~,~~WAHU~~,CAArB;;;;~~AAOA~~,IAAMC,gBAAgB,~~GAAGT~~,~~0BAAOU~~,GAAV,+GAAtB","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport AuthPageSection from './_AuthPageSection';\nimport { COLORS, ~~BREAKPOINTS~~ } from '../styles';\n\nexport const InformationContainer = styled(AuthPageSection)<{ color: string }>`\n display: none;\n background: ${props => props.color};\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n padding-top: 56px;\n }\n`;\n\nexport const InformationContent = styled.div`\n display: flex;\n flex-direction: column;\n align-self: center;\n align-items: center;\n text-align: center;\n max-width: 100%;\n\n ${BREAKPOINTS.LARGE} {\n align-self: flex-end;\n margin-right: 48px;\n }\n`;\n\nexport const InformationHeader = styled.h2`\n ~~font-style: normal;\~~n font-weight: 300;\n ~~font-size: 48px;\n line-height: 140%;\n~~ margin-bottom: 0;\n`;\n\nexport const InformationText = styled.p`\n ~~font-size: 20px;\n line-height: 140%;\n color:~~ ${COLORS.neutral_600};\n margin: 8px 0;\n`;\n\nexport const InformationImage = styled.img`\n height: 275px;\n max-width: 100%;\n`;\n"],"file":"Information.js"}
1	+ {"version":3,"sources":["../../../src/AuthPage/Information.tsx"],"names":["InformationContainer","AuthPageSection","props","color","BREAKPOINTS","MEDIUM","InformationContent","styled","div","LARGE","InformationHeader","h2","COLORS","black","InformationText","p","ParagraphTextStyle","Regular","neutral_600","InformationImage","img"],"mappings":";;;;;;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEO,IAAMA,oBAAoB,GAAG,+BAAOC,wBAAP,CAAH,4KAEjB,UAAAC,KAAK;AAAA,SAAIA,KAAK,CAACC,KAAV;AAAA,CAFY,EAI7BC,oBAAYC,MAJiB,CAA1B;;;AAUA,IAAMC,kBAAkB,GAAGC,0BAAOC,GAAV,sRAQ3BJ,oBAAYK,KARe,CAAxB;;;;AAcA,IAAMC,iBAAiB,GAAGH,0BAAOI,EAAV,4HAC1B,mCAAkBC,eAAOC,KAAzB,CAD0B,CAAvB;;;;AAMA,IAAMC,eAAe,GAAGP,0BAAOQ,CAAV,oGACxB,mCAAkBC,2BAAmBC,OAArC,EAA8CL,eAAOM,WAArD,CADwB,CAArB;;;;AAKA,IAAMC,gBAAgB,GAAGZ,0BAAOa,GAAV,+GAAtB","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport AuthPageSection from './_AuthPageSection';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, HeadlineXL, ParagraphTextStyle} from '../styles';\nimport {ComponentLStyling, HeadlineXLStyling, ParagraphLStyling} from '../styles/typography';\n\nexport const InformationContainer = styled(AuthPageSection)<{ color: string }>`\n display: none;\n background: ${props => props.color};\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n padding-top: 56px;\n }\n`;\n\nexport const InformationContent = styled.div`\n display: flex;\n flex-direction: column;\n align-self: center;\n align-items: center;\n text-align: center;\n max-width: 100%;\n\n ${BREAKPOINTS.LARGE} {\n align-self: flex-end;\n margin-right: 48px;\n }\n`;\n\nexport const InformationHeader = styled.h2`\n ${HeadlineXLStyling(COLORS.black)}\n font-weight: 300;\n margin-bottom: 0;\n`;\n\nexport const InformationText = styled.p`\n ${ParagraphLStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n margin: 8px 0;\n`;\n\nexport const InformationImage = styled.img`\n height: 275px;\n max-width: 100%;\n`;\n"],"file":"Information.js"}

package/dist/js/Banners/Banner.js CHANGED Viewed

@@ -58,8 +58,8 @@ var BannerContainer = _styledComponents.default.div(_templateObject || (_templat
   return props.link;
 });
-var BannerCenter = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: 18px;\n  display: flex;\n  width: 100%;\n  margin: 0 0 0 16px;\n  ", " {\n    margin: 0 16px 0 32px;\n  }\n  ", " {\n    margin: 0 40px 0 56px;\n  }\n  &.small {\n    margin: 0 0 0 16px;\n  }\n  &.medium {\n    margin: 0 16px 0 32px;\n  }\n  &.large {\n    margin: 0 40px 0 56px;\n  }\n\n  > svg {\n    flex-shrink: 0;\n    margin: 12px 0;\n  }\n"])), function (props) {
-  return props.color;
+var BannerCenter = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  \n  display: flex;\n  width: 100%;\n  margin: 0 0 0 16px;\n  ", " {\n    margin: 0 16px 0 32px;\n  }\n  ", " {\n    margin: 0 40px 0 56px;\n  }\n  &.small {\n    margin: 0 0 0 16px;\n  }\n  &.medium {\n    margin: 0 16px 0 32px;\n  }\n  &.large {\n    margin: 0 40px 0 56px;\n  }\n\n  > svg {\n    flex-shrink: 0;\n    margin: 12px 0;\n  }\n"])), function (props) {
+  return (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, props.color);
 }, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
 var ButtonWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  margin: 0 0 0 auto;\n  ", ";\n"])), function (props) {

package/dist/js/Banners/Banner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","type","COLORS","correct_100","black","bottom","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","color","ButtonWrapper","BannerContentWrapper","Banner","size","children","testId","linkText","onClose","icon","noIcon","React","useState","window","innerWidth","width","setWidth","useEffect","handleResize","addEventListener","formatTypeToLowerCase","toLowerCase","warning_100","warning_700","warning_20","Math","floor","random","white","warning_500","critical_100","critical_700","critical_20","critical_500","correct_700","correct_20","correct_500","primary_100","primary_700","primary_20","primary_500","hover"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { Tip, ThumbsUp, Help, Close, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { IconButton } from '../Button';\nimport { getButtonStyle } from './styles';\nimport { ComponentResponsive } from '../styles/typography';\nimport { HyperLink } from '../HyperLink';\n\n/*\n Styles for <Banner />\n /\nconst BannerContainer = styled.div<BannerProps>`\n background: ${(props: BannerProps) => (props.type ? props.type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: BannerProps) => (props.bottom ? 'auto' : '0')};\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 0 0 16px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 0 0 32px;\n }\n &.small {\n margin: 0 0 0 8px;\n }\n &.medium {\n margin: 0 0 0 16px;\n }\n &.large {\n margin: 0 0 0 32px;\n }\n }\n\n a {\n color: ${(props: BannerProps) => props.link} !important;\n }\n`;\n\nconst BannerCenter = styled.div`\n color: ${(props) => props.color};\n font-size: 18px;\n display: flex;\n width: 100%;\n margin: 0 0 0 16px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 16px 0 32px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 40px 0 56px;\n }\n &.small {\n margin: 0 0 0 16px;\n }\n &.medium {\n margin: 0 16px 0 32px;\n }\n &.large {\n margin: 0 40px 0 56px;\n }\n\n > svg {\n flex-shrink: 0;\n margin: 12px 0;\n }\n`;\n\nconst ButtonWrapper = styled.div<{ type?: string }>`\n margin: 0 0 0 auto;\n ${(props) => (props.type ? getButtonStyle(props.type) : null)};\n`;\n\nconst BannerContentWrapper = styled.div`\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n`;\n\ntype BannerProps = {\n size?: 'small' \| 'medium' \| 'large';\n type?: string;\n link?: string;\n linkText?: string;\n hover?: string;\n bottom?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n onClose?: () => void;\n noIcon?: boolean;\n};\n\nconst Banner: React.FunctionComponent<BannerProps> = ({ size, type, children, bottom, testId, linkText, link, onClose, icon, noIcon }) => {\n const [width, setWidth] = React.useState<number>(window.innerWidth);\n React.useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n window.addEventListener('resize', handleResize);\n });\n\n const formatTypeToLowerCase = type?.toLowerCase();\n switch (formatTypeToLowerCase) {\n case 'warning':\n return (\n <BannerContainer data-testid={testId} type={COLORS.warning_100} link={COLORS.warning_700} hover={COLORS.warning_20} bottom={bottom}>\n <BannerCenter color={COLORS.warning_700} className={size}>\n {icon ? icon : noIcon ? null : <Help color={COLORS.warning_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.warning_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.warning_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'critical':\n return (\n <BannerContainer data-testid={testId} type={COLORS.critical_100} link={COLORS.critical_700} hover={COLORS.critical_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.critical_700} className={size}>\n {icon ? icon : noIcon ? null : <TechnicalWarning color={COLORS.critical_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.critical_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.critical_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'positive':\n return (\n <BannerContainer data-testid={testId} type={COLORS.correct_100} link={COLORS.correct_700} hover={COLORS.correct_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.correct_700} className={size}>\n {icon ? icon : noIcon ? null : <ThumbsUp color={COLORS.correct_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.correct_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.correct_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n default:\n return (\n <BannerContainer data-testid={testId} type={COLORS.primary_100} link={COLORS.primary_700} hover={COLORS.primary_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.primary_700} className={size}>\n {icon ? icon : noIcon ? null : <Tip color={COLORS.primary_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.primary_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type=\"neutral\">\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.primary_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}
1	+ {"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","type","COLORS","correct_100","black","bottom","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentTextStyle","Regular","color","ButtonWrapper","BannerContentWrapper","Banner","size","children","testId","linkText","onClose","icon","noIcon","React","useState","window","innerWidth","width","setWidth","useEffect","handleResize","addEventListener","formatTypeToLowerCase","toLowerCase","warning_100","warning_700","warning_20","Math","floor","random","white","warning_500","critical_100","critical_700","critical_20","critical_500","correct_700","correct_20","correct_500","primary_100","primary_700","primary_20","primary_500","hover"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {Close, Help, TechnicalWarning, ThumbsUp, Tip} from '../icons/systemicons/SystemIcons';\nimport {IconButton} from '../Button';\nimport {getButtonStyle} from './styles';\nimport {ComponentMStyling, ComponentResponsive} from '../styles/typography';\nimport {HyperLink} from '../HyperLink';\n\n/*\n Styles for <Banner />\n /\nconst BannerContainer = styled.div<BannerProps>`\n background: ${(props: BannerProps) => (props.type ? props.type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: BannerProps) => (props.bottom ? 'auto' : '0')};\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 0 0 16px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 0 0 32px;\n }\n &.small {\n margin: 0 0 0 8px;\n }\n &.medium {\n margin: 0 0 0 16px;\n }\n &.large {\n margin: 0 0 0 32px;\n }\n }\n\n a {\n color: ${(props: BannerProps) => props.link} !important;\n }\n`;\n\nconst BannerCenter = styled.div`\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.color)}\n \n display: flex;\n width: 100%;\n margin: 0 0 0 16px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 16px 0 32px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 40px 0 56px;\n }\n &.small {\n margin: 0 0 0 16px;\n }\n &.medium {\n margin: 0 16px 0 32px;\n }\n &.large {\n margin: 0 40px 0 56px;\n }\n\n > svg {\n flex-shrink: 0;\n margin: 12px 0;\n }\n`;\n\nconst ButtonWrapper = styled.div<{ type?: string }>`\n margin: 0 0 0 auto;\n ${(props) => (props.type ? getButtonStyle(props.type) : null)};\n`;\n\nconst BannerContentWrapper = styled.div`\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n`;\n\ntype BannerProps = {\n size?: 'small' \| 'medium' \| 'large';\n type?: string;\n link?: string;\n linkText?: string;\n hover?: string;\n bottom?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n onClose?: () => void;\n noIcon?: boolean;\n};\n\nconst Banner: React.FunctionComponent<BannerProps> = ({ size, type, children, bottom, testId, linkText, link, onClose, icon, noIcon }) => {\n const [width, setWidth] = React.useState<number>(window.innerWidth);\n React.useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n window.addEventListener('resize', handleResize);\n });\n\n const formatTypeToLowerCase = type?.toLowerCase();\n switch (formatTypeToLowerCase) {\n case 'warning':\n return (\n <BannerContainer data-testid={testId} type={COLORS.warning_100} link={COLORS.warning_700} hover={COLORS.warning_20} bottom={bottom}>\n <BannerCenter color={COLORS.warning_700} className={size}>\n {icon ? icon : noIcon ? null : <Help color={COLORS.warning_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.warning_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.warning_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'critical':\n return (\n <BannerContainer data-testid={testId} type={COLORS.critical_100} link={COLORS.critical_700} hover={COLORS.critical_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.critical_700} className={size}>\n {icon ? icon : noIcon ? null : <TechnicalWarning color={COLORS.critical_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.critical_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.critical_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'positive':\n return (\n <BannerContainer data-testid={testId} type={COLORS.correct_100} link={COLORS.correct_700} hover={COLORS.correct_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.correct_700} className={size}>\n {icon ? icon : noIcon ? null : <ThumbsUp color={COLORS.correct_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.correct_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.correct_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n default:\n return (\n <BannerContainer data-testid={testId} type={COLORS.primary_100} link={COLORS.primary_700} hover={COLORS.primary_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.primary_700} className={size}>\n {icon ? icon : noIcon ? null : <Tip color={COLORS.primary_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.primary_700}>\n {children}  \n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper type=\"neutral\">\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.primary_500} size=\"24px\" />\n </IconButton>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}

package/dist/js/Banners/OverviewBanner.js CHANGED Viewed

@@ -17,6 +17,8 @@ var _styles = require("../styles");
 var _Layouts = require("../Layouts");
+var _typography = require("../styles/typography");
 var _templateObject, _templateObject2;
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -29,7 +31,7 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 var BannersWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background-color: ", ";\n"])), _styles.COLORS.primary_20);
-var BannerContent = (0, _styledComponents.default)(_Layouts.PageWidth)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n\n  ", " {\n    flex-direction: row;\n    padding: 48px 12px;\n  }\n\n  & > *:first-child {\n    padding-top: 12px;\n    width: 320px;\n    height: 180px;\n    ", " {\n      padding-top: 0;\n      margin-right: 20px;\n      width: 384px;\n      height: 216px;\n    }\n  }\n  & h2 {\n    font-weight: bold;\n    font-size: 24px;\n    margin: 16px 0 24px 0;\n  }\n  & p {\n    margin: 0;\n    padding: 0 0 28px 0;\n    max-width: 310px;\n  }\n  & div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n    margin-bottom: 18px;\n    ", " {\n      margin-left: 20px;\n      align-items: start;\n      justify-content: start;\n      width: 384px;\n    }\n  }\n"])), _styles.COLORS.primary_20, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.MEDIUM);
+var BannerContent = (0, _styledComponents.default)(_Layouts.PageWidth)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n\n  ", " {\n    flex-direction: row;\n    padding: 48px 12px;\n  }\n\n  & > *:first-child {\n    padding-top: 12px;\n    width: 320px;\n    height: 180px;\n    ", " {\n      padding-top: 0;\n      margin-right: 20px;\n      width: 384px;\n      height: 216px;\n    }\n  }\n  & h2 {\n    ", "\n    margin: 16px 0 24px 0;\n  }\n  & p {\n    margin: 0;\n    padding: 0 0 28px 0;\n    max-width: 310px;\n  }\n  & div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n    margin-bottom: 18px;\n    ", " {\n      margin-left: 20px;\n      align-items: start;\n      justify-content: start;\n      width: 384px;\n    }\n  }\n"])), _styles.COLORS.primary_20, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.MEDIUM, (0, _typography.HeadlineXSStyling)(_styles.COLORS.black), _styles.BREAKPOINTS.MEDIUM);
 var OverviewBanner = function OverviewBanner(_ref) {
   var children = _ref.children,

package/dist/js/Banners/OverviewBanner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/Banners/OverviewBanner.tsx"],"names":["BannersWrapper","styled","div","COLORS","primary_20","BannerContent","PageWidth","BREAKPOINTS","MEDIUM","OverviewBanner","children","testId"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,cAAc,GAAGC,0BAAOC,GAAV,mGACEC,eAAOC,UADT,CAApB;;AAIA,IAAMC,aAAa,GAAG,+BAAOC,kBAAP,CAAH,~~84BACGH~~,eAAOC,UADV,EAOfG,oBAAYC,MAPG,EAgBbD,oBAAYC,MAhBC,~~EAuCbD~~,oBAAYC,~~MAvCC~~,CAAnB;;~~AAkDA~~,~~IAAMC~~,cAAc,GAAG,SAAjBA,cAAiB,OAAiC;AAAA,MAA9BC,QAA8B,QAA9BA,QAA8B;AAAA,MAApBC,MAAoB,QAApBA,MAAoB;AACtD,sBACE,oBAAC,cAAD,qBACE,oBAAC,aAAD;AAAe,mBAAaA;AAA5B,KAAqCD,QAArC,CADF,CADF;AAKD,CAND;;;AAFeA,EAAAA,Q;AAAeC,EAAAA,M;;eAUfF,c","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { PageWidth } from '../Layouts';\n\nconst BannersWrapper = styled.div`\n background-color: ${COLORS.primary_20};\n`;\n\nconst BannerContent = styled(PageWidth)`\n background-color: ${COLORS.primary_20};\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n\n ${BREAKPOINTS.MEDIUM} {\n flex-direction: row;\n padding: 48px 12px;\n }\n\n & > *:first-child {\n padding-top: 12px;\n width: 320px;\n height: 180px;\n ${BREAKPOINTS.MEDIUM} {\n padding-top: 0;\n margin-right: 20px;\n width: 384px;\n height: 216px;\n }\n }\n & h2 {\n ~~font-weight: bold;\~~n ~~font-size: 24px;\n~~ margin: 16px 0 24px 0;\n }\n & p {\n margin: 0;\n padding: 0 0 28px 0;\n max-width: 310px;\n }\n & div {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n margin-bottom: 18px;\n ${BREAKPOINTS.MEDIUM} {\n margin-left: 20px;\n align-items: start;\n justify-content: start;\n width: 384px;\n }\n }\n`;\n\ntype Props = { children: any; testId?: string };\n\nconst OverviewBanner = ({ children, testId }: Props) => {\n return (\n <BannersWrapper>\n <BannerContent data-testid={testId}>{children}</BannerContent>\n </BannersWrapper>\n );\n};\n\nexport default OverviewBanner;\n"],"file":"OverviewBanner.js"}
1	+ {"version":3,"sources":["../../../src/Banners/OverviewBanner.tsx"],"names":["BannersWrapper","styled","div","COLORS","primary_20","BannerContent","PageWidth","BREAKPOINTS","MEDIUM","black","OverviewBanner","children","testId"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,cAAc,GAAGC,0BAAOC,GAAV,mGACEC,eAAOC,UADT,CAApB;;AAIA,IAAMC,aAAa,GAAG,+BAAOC,kBAAP,CAAH,02BACGH,eAAOC,UADV,EAOfG,oBAAYC,MAPG,EAgBbD,oBAAYC,MAhBC,EAwBb,mCAAkBL,eAAOM,KAAzB,CAxBa,EAsCbF,oBAAYC,MAtCC,CAAnB;;AAiDA,IAAME,cAAc,GAAG,SAAjBA,cAAiB,OAAiC;AAAA,MAA9BC,QAA8B,QAA9BA,QAA8B;AAAA,MAApBC,MAAoB,QAApBA,MAAoB;AACtD,sBACE,oBAAC,cAAD,qBACE,oBAAC,aAAD;AAAe,mBAAaA;AAA5B,KAAqCD,QAArC,CADF,CADF;AAKD,CAND;;;AAFeA,EAAAA,Q;AAAeC,EAAAA,M;;eAUfF,c","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS} from '../styles';\nimport {PageWidth} from '../Layouts';\nimport {HeadlineXSStyling} from '../styles/typography';\n\nconst BannersWrapper = styled.div`\n background-color: ${COLORS.primary_20};\n`;\n\nconst BannerContent = styled(PageWidth)`\n background-color: ${COLORS.primary_20};\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n\n ${BREAKPOINTS.MEDIUM} {\n flex-direction: row;\n padding: 48px 12px;\n }\n\n & > *:first-child {\n padding-top: 12px;\n width: 320px;\n height: 180px;\n ${BREAKPOINTS.MEDIUM} {\n padding-top: 0;\n margin-right: 20px;\n width: 384px;\n height: 216px;\n }\n }\n & h2 {\n ${HeadlineXSStyling(COLORS.black)}\n margin: 16px 0 24px 0;\n }\n & p {\n margin: 0;\n padding: 0 0 28px 0;\n max-width: 310px;\n }\n & div {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n margin-bottom: 18px;\n ${BREAKPOINTS.MEDIUM} {\n margin-left: 20px;\n align-items: start;\n justify-content: start;\n width: 384px;\n }\n }\n`;\n\ntype Props = { children: any; testId?: string };\n\nconst OverviewBanner = ({ children, testId }: Props) => {\n return (\n <BannersWrapper>\n <BannerContent data-testid={testId}>{children}</BannerContent>\n </BannersWrapper>\n );\n};\n\nexport default OverviewBanner;\n"],"file":"OverviewBanner.js"}

package/dist/js/Breadcrumb/Breadcrumb.d.ts CHANGED Viewed

@@ -1,7 +1,9 @@
 import * as React from 'react';
 import { BreadcrumbItem } from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';
+declare type availableSizes = 'xsmall' | 'small' | 'medium';
 declare type BreadcrumbProps = {
     items?: BreadcrumbItem[];
+    size?: availableSizes;
 };
 declare const Breadcrumb: React.FunctionComponent<BreadcrumbProps>;
 export default Breadcrumb;

package/dist/js/Breadcrumb/Breadcrumb.js CHANGED Viewed

@@ -17,10 +17,10 @@ var _styles = require("../styles");
 var _ = require("..");
-var _reactRouter = require("react-router");
 var _reactRouterDom = require("react-router-dom");
+var _typography = require("../styles/typography");
 var _templateObject, _templateObject2, _templateObject3;
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -31,32 +31,64 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var fontSize = "16px";
+var BreadcrumbContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display:flex;\n  align-items: center;\n"])));
+var FontStyles = function FontStyles(size, textStyle, color) {
+  switch (size) {
+    case 'xsmall':
+      return (0, _typography.ComponentXXSStyling)(textStyle, color);
-var BreadcrumbContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display:flex;\n  align-items: center;\n  font-size: ", ";\n"])), fontSize);
+    case 'medium':
+      return (0, _typography.ComponentMStyling)(textStyle, color);
-var LastBreadcrumbItem = _styledComponents.default.label(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: bold;\n  margin: 0 7px;\n"])), _styles.COLORS.neutral_800);
+    case 'small':
+    default:
+      return (0, _typography.ComponentSStyling)(textStyle, color);
+  }
+};
+var LastBreadcrumbItem = _styledComponents.default.label(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  margin: 0 7px;\n"])), function (props) {
+  return FontStyles(props.size, _.ComponentTextStyle.Bold, _styles.COLORS.neutral_800);
+});
-var LinkWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  align-items: center;\n  font-size: ", ";\n  color: ", ";\n  \n  a {\n    text-decoration: none;\n    color: ", ";\n    font-size: ", ";\n    margin: 0 7px;\n\n    svg{\n      padding:4px 0 0 0;\n    }\n  }\n  a:hover {\n    color: ", ";\n    font-weight: bold;\n  }\n"])), fontSize, _styles.COLORS.neutral_600, _styles.COLORS.neutral_600, fontSize, _styles.COLORS.neutral_800);
+var LinkWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  align-items: center;\n  ", "\n  \n  a {\n    text-decoration: none;\n    ", "\n    margin: 0 7px;\n\n    svg{\n      padding:4px 0 0 0;\n    }\n  }\n  a:hover {\n    color: ", ";\n  }\n  a:active {\n    color: ", ";\n  }\n"])), function (props) {
+  return FontStyles(props.size, _.ComponentTextStyle.Regular, _styles.COLORS.neutral_600);
+}, function (props) {
+  return FontStyles(props.size, _.ComponentTextStyle.Regular, _styles.COLORS.neutral_600);
+}, _styles.COLORS.primary_700, _styles.COLORS.primary_800);
 var Breadcrumb = function Breadcrumb(_ref) {
-  var items = _ref.items;
-  var history = (0, _reactRouter.useHistory)();
-  return /*#__PURE__*/React.createElement(BreadcrumbContainer, null, /*#__PURE__*/React.createElement(LinkWrapper, null, /*#__PURE__*/React.createElement(_reactRouterDom.Link, {
+  var items = _ref.items,
+      size = _ref.size;
+  size = size || 'small';
+  var iconSize = size === 'xsmall' ? '16' : size === 'small' ? '20' : '24';
+  return /*#__PURE__*/React.createElement(BreadcrumbContainer, null, /*#__PURE__*/React.createElement(LinkWrapper, {
+    size: size
+  }, /*#__PURE__*/React.createElement(_reactRouterDom.Link, {
     to: '/'
   }, /*#__PURE__*/React.createElement(_.SystemIcons.Home, {
-    size: fontSize
+    size: iconSize
   }))), !!items && items.length > 2 && items.slice(0, items.length - 2).map(function (item, i) {
-    return /*#__PURE__*/React.createElement(LinkWrapper, null, "/", /*#__PURE__*/React.createElement(_reactRouterDom.Link, {
+    return /*#__PURE__*/React.createElement(LinkWrapper, {
+      size: size,
+      key: i
+    }, "/", /*#__PURE__*/React.createElement(_reactRouterDom.Link, {
       to: item.url
     }, "..."));
-  }), !!items && items.length > 1 && /*#__PURE__*/React.createElement(LinkWrapper, null, "/", /*#__PURE__*/React.createElement(_reactRouterDom.Link, {
+  }), !!items && items.length > 1 && /*#__PURE__*/React.createElement(LinkWrapper, {
+    size: size
+  }, "/", /*#__PURE__*/React.createElement(_reactRouterDom.Link, {
     to: items[items.length - 2].url
-  }, items[items.length - 2].label)), !!items && items.length > 0 && /*#__PURE__*/React.createElement(LinkWrapper, null, "/", /*#__PURE__*/React.createElement(LastBreadcrumbItem, null, items[items.length - 1].label)));
+  }, items[items.length - 2].label)), !!items && items.length > 0 && /*#__PURE__*/React.createElement(LinkWrapper, {
+    size: size
+  }, "/", /*#__PURE__*/React.createElement(LastBreadcrumbItem, {
+    size: size
+  }, items[items.length - 1].label)));
 };
 Breadcrumb.propTypes = {
-  items: _propTypes.default.array
+  items: _propTypes.default.array,
+  size: _propTypes.default.oneOf(['xsmall', 'small', 'medium'])
 };
 var _default = Breadcrumb;
 exports.default = _default;

package/dist/js/Breadcrumb/Breadcrumb.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/Breadcrumb/Breadcrumb.tsx"],"names":["~~fontSize","~~BreadcrumbContainer","styled","div","LastBreadcrumbItem","label","COLORS","neutral_800","LinkWrapper","neutral_600","Breadcrumb","items","~~history~~","length","slice","map","item","i","url"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA~~;;AAEA~~;;;;;;;;;;;;~~AAOA~~,IAAMA,~~QAAQ~~,~~GAAG~~,~~MAAjB~~;;~~AAEA~~,IAAMC,~~mBAAmB~~,~~GAAGC~~,~~0BAAOC~~,~~GAAV~~,~~qIAGVH~~,~~QAHU~~,~~CAAzB~~;;~~AAMA~~,~~IAAMI~~,kBAAkB,~~GAAGF~~,~~0BAAOG~~,KAAV,~~kIACbC~~,eAAOC,~~WADM~~,CAAxB;;~~AAMA~~,IAAMC,WAAW,~~GAAGN~~,0BAAOC,GAAV,~~uVAEFH~~,~~QAFE~~,~~EAGNM~~,~~eAAOG~~,~~WAHD~~,~~EAOJH~~,~~eAAOG~~,~~WAPH~~,~~EAQAT~~,~~QARA~~,~~EAgBJM~~,~~eAAOC~~,~~WAhBH~~,CAAjB;;AAsBA,~~IAAMG~~,UAAoD,GAAG,SAAvDA,UAAuD,~~OAAe~~;AAAA,~~MAAZC~~,~~KAAY~~,~~QAAZA~~,~~KAAY~~;~~AAC1E~~,~~MAAMC~~,~~OAAO~~,~~GAAG~~,~~8BAAhB~~;AAEA,sBACE,oBAAC,mBAAD,qBACE,oBAAC,WAAD,~~qBACE~~,oBAAC,oBAAD;AAAM,IAAA,EAAE,EAAE;AAAV,kBACE,oBAAC,aAAD,CAAa,IAAb;AAAkB,IAAA,IAAI,~~EAAEZ~~;AAAxB,IADF,CADF,CADF,EAOI,CAAC,~~CAACW~~,KAAF,IAAWA,KAAK,CAACE,MAAN,GAAe,CAA1B,IACAF,KAAK,CAACG,KAAN,CAAY,CAAZ,EAAeH,KAAK,CAACE,MAAN,GAAe,CAA9B,EAAiCE,GAAjC,CAAqC,UAACC,IAAD,EAAOC,CAAP,EAAY;AAC/C,wBACA,oBAAC,WAAD,~~0BAEE~~,oBAAC,oBAAD;AAAM,MAAA,EAAE,EAAED,IAAI,CAACE;AAAf,aAFF,CADA;AAOF,GARA,CARJ,EAkBI,CAAC,CAACP,KAAF,IAAWA,KAAK,CAACE,MAAN,GAAe,CAA1B,iBACA,oBAAC,WAAD,~~0BAEE~~,oBAAC,oBAAD;AAAM,IAAA,EAAE,~~EAAEF~~,KAAK,CAACA,KAAK,CAACE,MAAN,GAAe,CAAhB,CAAL,CAAwBK;AAAlC,KACGP,KAAK,CAACA,KAAK,CAACE,MAAN,GAAe,CAAhB,CAAL,~~CAAwBR~~,KAD3B,CAFF,CAnBJ,EA2BI,CAAC,~~CAACM~~,KAAF,IAAWA,KAAK,CAACE,MAAN,GAAe,CAA1B,iBACA,oBAAC,WAAD,~~0BAEE~~,oBAAC,kBAAD,~~QACGF~~,KAAK,CAACA,KAAK,CAACE,MAAN,GAAe,CAAhB,CAAL,~~CAAwBR~~,KAD3B,CAFF,CA5BJ,CADF;AAsCD,~~CAzCD~~;;;~~AAvCEM~~,EAAAA,K;;~~eAkFaD~~,U","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport { COLORS } from '../styles';\nimport { SystemIcons } from '..';\nimport { useHistory } from 'react-router';\nimport { BreadcrumbItem } from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport { Link } from 'react-router-dom';\n\n\ntype BreadcrumbProps = {\n items?: BreadcrumbItem[]\n};\n\nconst ~~fontSize = \"16px\"\n\nconst~~ BreadcrumbContainer = styled.div`\n display:flex;\n align-items: center;\n ~~font-~~size: ${~~fontSize}~~;\n~~`;\~~n\nconst LastBreadcrumbItem = styled.label`\n ~~color:~~ ${COLORS.neutral_800};\n ~~font-weight: bold;\n~~ margin: 0 7px;\n`;\n\nconst LinkWrapper = styled.div`\n align-items: center;\n ~~font-size:~~ ${~~fontSize};\n color:~~ ${COLORS.neutral_600};\n \n a {\n text-decoration: none;\n ~~color:~~ ${COLORS.neutral_600};\n ~~font-size: ${fontSize};\n~~ margin: 0 7px;\n\n svg{\n padding:4px 0 0 0;\n }\n }\n a:hover {\n color: ${COLORS.~~neutral_800~~};\n ~~font-weight~~: ~~bold~~;\n }\n`;\n\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ items }) => {\n const ~~history~~ = ~~useHistory()~~;\n \n return (\n <BreadcrumbContainer>\n <LinkWrapper>\n <Link to={'/'}>\n <SystemIcons.Home size={~~fontSize~~} />\n </Link>\n </LinkWrapper>\n\n { !!items && items.length > 2 && \n items.slice(0, items.length - 2).map((item, i)=> {\n return (\n <LinkWrapper>\n /\n <Link to={item.url}>\n ...\n </Link>\n </LinkWrapper>\n )})}\n\n { !!items && items.length > 1 && \n <LinkWrapper>\n /\n <Link to={items[items.length - 2].url}>\n {items[items.length - 2].label}\n </Link>\n </LinkWrapper>\n }\n\n { !!items && items.length > 0 && \n <LinkWrapper>\n /\n <LastBreadcrumbItem>\n {items[items.length - 1].label}\n </LastBreadcrumbItem>\n </LinkWrapper>\n }\n\n </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}
1	+ {"version":3,"sources":["../../../src/Breadcrumb/Breadcrumb.tsx"],"names":["BreadcrumbContainer","styled","div","FontStyles","size","textStyle","color","LastBreadcrumbItem","label","props","ComponentTextStyle","Bold","COLORS","neutral_800","LinkWrapper","Regular","neutral_600","primary_700","primary_800","Breadcrumb","items","iconSize","length","slice","map","item","i","url"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {Link} from 'react-router-dom';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\n\n\ntype availableSizes = 'xsmall' \| 'small' \| 'medium';\n\ntype BreadcrumbProps = {\n items?: BreadcrumbItem[];\n size?: availableSizes;\n};\n\nconst BreadcrumbContainer = styled.div`\n display:flex;\n align-items: center;\n`;\n\nconst FontStyles = (size: availableSizes \| undefined, textStyle: ComponentTextStyle, color: string) => {\n switch (size) {\n case 'xsmall':\n return ComponentXXSStyling(textStyle, color);\n case 'medium':\n return ComponentMStyling(textStyle, color);\n case 'small':\n default:\n return ComponentSStyling(textStyle, color);\n }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: availableSizes}>`\n ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n margin: 0 7px;\n`;\n\nconst LinkWrapper = styled.div<{size: availableSizes \| undefined}>`\n align-items: center;\n ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n \n a {\n text-decoration: none;\n ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n margin: 0 7px;\n\n svg{\n padding:4px 0 0 0;\n }\n }\n a:hover {\n color: ${COLORS.primary_700};\n }\n a:active {\n color: ${COLORS.primary_800};\n }\n`;\n\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ items, size }) => {\n\n size = size \|\| 'small';\n\n const iconSize = size === 'xsmall' ? '16' : size === 'small' ? '20' : '24';\n\n return (\n <BreadcrumbContainer>\n <LinkWrapper size={size}>\n <Link to={'/'}>\n <SystemIcons.Home size={iconSize} />\n </Link>\n </LinkWrapper>\n\n { !!items && items.length > 2 && \n items.slice(0, items.length - 2).map((item, i)=> {\n return (\n <LinkWrapper size={size} key={i}>\n /\n <Link to={item.url}>\n ...\n </Link>\n </LinkWrapper>\n )})}\n\n { !!items && items.length > 1 && \n <LinkWrapper size={size}>\n /\n <Link to={items[items.length - 2].url}>\n {items[items.length - 2].label}\n </Link>\n </LinkWrapper>\n }\n\n { !!items && items.length > 0 && \n <LinkWrapper size={size}>\n /\n <LastBreadcrumbItem size={size}>\n {items[items.length - 1].label}\n </LastBreadcrumbItem>\n </LinkWrapper>\n }\n\n </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}

package/dist/js/Button/Iconbutton.d.ts CHANGED Viewed

@@ -14,6 +14,7 @@ declare type Props = {
     borderRadius?: number;
     onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;
     tabbedHereBackgroundColor?: string;
+    type?: 'submit' | 'reset' | 'button' | undefined;
 };
 declare const IconButton: React.FunctionComponent<Props>;
 export default IconButton;

package/dist/js/Button/Iconbutton.js CHANGED Viewed

@@ -96,7 +96,8 @@ var IconButton = function IconButton(_ref) {
       tabIndex = _ref.tabIndex,
       borderRadius = _ref.borderRadius,
       onKeyPress = _ref.onKeyPress,
-      tabbedHereBackgroundColor = _ref.tabbedHereBackgroundColor;
+      tabbedHereBackgroundColor = _ref.tabbedHereBackgroundColor,
+      type = _ref.type;
   var supressFocusRef = React.useRef(null);
   var _React$useState = React.useState(false),
@@ -119,6 +120,7 @@ var IconButton = function IconButton(_ref) {
     case 'secondary':
       return /*#__PURE__*/React.createElement(StyledSecondaryIconButton, {
         id: id,
+        type: type !== null && type !== void 0 ? type : 'button',
         "data-testid": id,
         onClick: function onClick(event) {
           return action(event);
@@ -154,6 +156,7 @@ var IconButton = function IconButton(_ref) {
     default:
       return /*#__PURE__*/React.createElement(StyledPrimaryIconButton, {
         id: id,
+        type: type !== null && type !== void 0 ? type : 'button',
         "data-testid": id,
         onClick: function onClick(event) {
           return action(event);

package/dist/js/Button/Iconbutton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/Button/Iconbutton.tsx"],"names":["tabbedHereStyle","variant","tabbedHereBackgroundColor","css","COLORS","primary_500","neutral_600","primary_700","white","StyledIconButton","styled","button","props","hideOnLowWidth","BREAKPOINTS","MEDIUM","borderRadius","unsetIconSize","StyledPrimaryIconButton","useTransparentBackground","iconColor","primary_800","neutral_200","tabbedHere","StyledSecondaryIconButton","primary_20","primary_100","neutral_300","IconButton","id","shape","action","isInMobileMenu","children","disabled","tabIndex","onKeyPress","supressFocusRef","React","useRef","useState","setTabbedHere","isPressingEnter","e","key","preventDefault","stopPropagation","event","current"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {BREAKPOINTS, COLORS} from '../styles';\n\ninterface HeaderItemProps {\n hideOnLowWidth: boolean;\n inMobileMenu?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n borderRadius?: number;\n shape?: string;\n tabbedHere?: boolean;\n tabbedHereBackgroundColor?: string;\n}\n\nconst tabbedHereStyle = (variant: string, tabbedHereBackgroundColor?: string) => {\n switch (variant) {\n case 'secondary':\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor \|\| 'transparent'} !important;\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n div svg path,\n div svg {\n fill: ${COLORS.neutral_600};\n }\n `;\n case 'primary':\n default:\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor \|\| COLORS.primary_700} !important;\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n `;\n }\n};\n\nconst StyledIconButton = styled.button<HeaderItemProps>`\n border-width: 0;\n cursor: pointer;\n height: 48px;\n width: 48px;\n background: transparent;\n\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n ${BREAKPOINTS.MEDIUM} {\n display: block;\n }\n\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n div {\n height: 36px;\n width: 36px;\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n padding: 0;\n }\n }\n &:only-child {\n margin: 0;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus:not(:disabled) {\n outline: none;\n div {\n outline: none;\n }\n }\n &:active:not(:disabled) {\n div {\n box-shadow: none;\n }\n }\n`;\n\nconst StyledPrimaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n svg {\n fill: ${(props) => props.iconColor \|\| COLORS.white};\n path {\n fill: ${(props) => props.iconColor \|\| COLORS.white};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_700};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_800};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:disabled {\n div {\n background-color: ${COLORS.neutral_200};\n }\n svg {\n path {\n fill: ${COLORS.white};\n }\n fill: ${COLORS.white};\n }\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.tabbedHereBackgroundColor) : '')};\n`;\n\nconst StyledSecondaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n svg {\n fill: ${(props) => props.iconColor \|\| COLORS.neutral_600};\n path {\n fill: ${(props) => props.iconColor \|\| COLORS.neutral_600};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_20};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_700};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_100};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:disabled {\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n }\n svg {\n path {\n fill: ${COLORS.neutral_300};\n }\n fill: ${COLORS.neutral_300};\n }\n }\n\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.tabbedHereBackgroundColor) : '')};\n`;\n\ntype Props = {\n id?: string;\n variant?: 'primary' \| 'secondary';\n shape?: 'square' \| 'circular';\n action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n hideOnLowWidth?: boolean;\n isInMobileMenu?: boolean;\n disabled?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n tabIndex?: number;\n borderRadius?: number;\n onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;\n tabbedHereBackgroundColor?: string;\n};\n\nconst IconButton: React.FunctionComponent<Props> = ({\n id,\n variant,\n shape,\n action,\n hideOnLowWidth,\n isInMobileMenu,\n children,\n useTransparentBackground,\n disabled,\n iconColor,\n unsetIconSize,\n tabIndex,\n borderRadius,\n onKeyPress,\n tabbedHereBackgroundColor,\n}): React.ReactElement<Props> => {\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n // Let's render button\n switch (variant) {\n case 'secondary':\n return (\n <StyledSecondaryIconButton\n id={id}\n data-testid={id}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth \|\| false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex \|\| 0}\n borderRadius={borderRadius \|\| shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledSecondaryIconButton>\n );\n case 'primary':\n default:\n return (\n <StyledPrimaryIconButton\n id={id}\n data-testid={id}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth \|\| false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex \|\| 0}\n borderRadius={borderRadius \|\| shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledPrimaryIconButton>\n );\n }\n};\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}
1	+ {"version":3,"sources":["../../../src/Button/Iconbutton.tsx"],"names":["tabbedHereStyle","variant","tabbedHereBackgroundColor","css","COLORS","primary_500","neutral_600","primary_700","white","StyledIconButton","styled","button","props","hideOnLowWidth","BREAKPOINTS","MEDIUM","borderRadius","unsetIconSize","StyledPrimaryIconButton","useTransparentBackground","iconColor","primary_800","neutral_200","tabbedHere","StyledSecondaryIconButton","primary_20","primary_100","neutral_300","IconButton","id","shape","action","isInMobileMenu","children","disabled","tabIndex","onKeyPress","type","supressFocusRef","React","useRef","useState","setTabbedHere","isPressingEnter","e","key","preventDefault","stopPropagation","event","current"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS } from '../styles';\n\ninterface HeaderItemProps {\n hideOnLowWidth: boolean;\n inMobileMenu?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n borderRadius?: number;\n shape?: string;\n tabbedHere?: boolean;\n tabbedHereBackgroundColor?: string;\n}\n\nconst tabbedHereStyle = (variant: string, tabbedHereBackgroundColor?: string) => {\n switch (variant) {\n case 'secondary':\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor \|\| 'transparent'} !important;\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n div svg path,\n div svg {\n fill: ${COLORS.neutral_600};\n }\n `;\n case 'primary':\n default:\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor \|\| COLORS.primary_700} !important;\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n `;\n }\n};\n\nconst StyledIconButton = styled.button<HeaderItemProps>`\n border-width: 0;\n cursor: pointer;\n height: 48px;\n width: 48px;\n background: transparent;\n\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n ${BREAKPOINTS.MEDIUM} {\n display: block;\n }\n\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n div {\n height: 36px;\n width: 36px;\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n padding: 0;\n }\n }\n &:only-child {\n margin: 0;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus:not(:disabled) {\n outline: none;\n div {\n outline: none;\n }\n }\n &:active:not(:disabled) {\n div {\n box-shadow: none;\n }\n }\n`;\n\nconst StyledPrimaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n svg {\n fill: ${(props) => props.iconColor \|\| COLORS.white};\n path {\n fill: ${(props) => props.iconColor \|\| COLORS.white};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_700};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_800};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:disabled {\n div {\n background-color: ${COLORS.neutral_200};\n }\n svg {\n path {\n fill: ${COLORS.white};\n }\n fill: ${COLORS.white};\n }\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.tabbedHereBackgroundColor) : '')};\n`;\n\nconst StyledSecondaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n svg {\n fill: ${(props) => props.iconColor \|\| COLORS.neutral_600};\n path {\n fill: ${(props) => props.iconColor \|\| COLORS.neutral_600};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_20};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_700};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_100};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:disabled {\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n }\n svg {\n path {\n fill: ${COLORS.neutral_300};\n }\n fill: ${COLORS.neutral_300};\n }\n }\n\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.tabbedHereBackgroundColor) : '')};\n`;\n\ntype Props = {\n id?: string;\n variant?: 'primary' \| 'secondary';\n shape?: 'square' \| 'circular';\n action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n hideOnLowWidth?: boolean;\n isInMobileMenu?: boolean;\n disabled?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n tabIndex?: number;\n borderRadius?: number;\n onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;\n tabbedHereBackgroundColor?: string;\n type?: 'submit' \| 'reset' \| 'button' \| undefined;\n};\n\nconst IconButton: React.FunctionComponent<Props> = ({\n id,\n variant,\n shape,\n action,\n hideOnLowWidth,\n isInMobileMenu,\n children,\n useTransparentBackground,\n disabled,\n iconColor,\n unsetIconSize,\n tabIndex,\n borderRadius,\n onKeyPress,\n tabbedHereBackgroundColor,\n type,\n}): React.ReactElement<Props> => {\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n // Let's render button\n switch (variant) {\n case 'secondary':\n return (\n <StyledSecondaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth \|\| false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex \|\| 0}\n borderRadius={borderRadius \|\| shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledSecondaryIconButton>\n );\n case 'primary':\n default:\n return (\n <StyledPrimaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth \|\| false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex \|\| 0}\n borderRadius={borderRadius \|\| shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => setTabbedHere(false)}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledPrimaryIconButton>\n );\n }\n};\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}