@laerdal/life-react-components 1.3.2-dev.3.full → 1.3.2-dev.4
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.
- package/dist/esm/AuthPage/AuthPage.js +1 -1
- package/dist/esm/AuthPage/AuthPage.js.map +1 -1
- package/dist/esm/AuthPage/Information.js +1 -1
- package/dist/esm/AuthPage/Information.js.map +1 -1
- package/dist/esm/Banners/Banner.js +16 -16
- package/dist/esm/Banners/Banner.js.map +1 -1
- package/dist/esm/styles/typography.js +66 -66
- package/dist/esm/styles/typography.js.map +1 -1
- package/dist/js/AuthPage/AuthPage.js +1 -1
- package/dist/js/AuthPage/AuthPage.js.map +1 -1
- package/dist/js/AuthPage/Information.d.ts +1 -1
- package/dist/js/AuthPage/Information.js +1 -1
- package/dist/js/AuthPage/Information.js.map +1 -1
- package/dist/js/Banners/Banner.js +16 -19
- package/dist/js/Banners/Banner.js.map +1 -1
- package/dist/js/styles/typography.d.ts +6 -6
- package/dist/js/styles/typography.js +66 -66
- package/dist/js/styles/typography.js.map +1 -1
- package/dist/umd/AuthPage/AuthPage.js +1 -1
- package/dist/umd/AuthPage/AuthPage.js.map +1 -1
- package/dist/umd/AuthPage/Information.js +1 -1
- package/dist/umd/AuthPage/Information.js.map +1 -1
- package/dist/umd/Banners/Banner.js +16 -16
- package/dist/umd/Banners/Banner.js.map +1 -1
- package/dist/umd/styles/typography.js +66 -66
- package/dist/umd/styles/typography.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["React","styled","css","COLORS","Size","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","className","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","size","width","fontsize","Small","Medium","Large","XXSmall","XSmall"],"mappings":"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","sourcesContent":["import React, { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS } from '.';\nimport { Property } from 'csstype';\nimport { Size } from '../types';\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-family: ${TYPOGRAPHY.fontFamily};\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 className?: 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase className={className} 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase className={className} color={color} lineHeight={16} fontSize={12} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentResponsive: FunctionComponent<ComponentProps & { size?: Size; 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 = Size.Small;\n } else if (width < 992) {\n fontsize = Size.Medium;\n } else {\n fontsize = Size.Large;\n }\n }\n switch (fontsize) {\n case Size.XXSmall:\n return <ComponentXXS color={color} textStyle={textStyle} children={children} />;\n case Size.XSmall:\n return <ComponentXS color={color} textStyle={textStyle} children={children} />;\n case Size.Small:\n return <ComponentS color={color} textStyle={textStyle} children={children} />;\n case Size.Medium:\n return <ComponentM color={color} textStyle={textStyle} children={children} />;\n case Size.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"}
|
|
1
|
+
{"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["React","styled","css","COLORS","Size","TYPOGRAPHY","fontFamily","TypographyBase","$color","lineHeight","$fontSize","$fontWeight","$fontStyle","textTransform","textDecorationLine","fontSize","fontWeight","fontStyle","color","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","className","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","size","width","fontsize","Small","Medium","Large","XXSmall","XSmall"],"mappings":"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","sourcesContent":["import React, { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS } from '.';\nimport { Property } from 'csstype';\nimport { Size } from '../types';\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-family: ${TYPOGRAPHY.fontFamily};\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\n $color={color}\n lineHeight={36}\n $fontSize={24}\n $fontWeight={fontWeight}\n $fontStyle={fontStyle}\n textDecorationLine={textDecorationLine}\n 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\n $color={color}\n lineHeight={32}\n $fontSize={20}\n $fontWeight={fontWeight}\n $fontStyle={fontStyle}\n textDecorationLine={textDecorationLine}\n 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\n $color={color}\n lineHeight={28}\n $fontSize={18}\n $fontWeight={fontWeight}\n $fontStyle={fontStyle}\n textDecorationLine={textDecorationLine}\n 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\n $color={color}\n lineHeight={24}\n $fontSize={16}\n $fontWeight={fontWeight}\n $fontStyle={fontStyle}\n textDecorationLine={textDecorationLine}\n 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\n $color={color}\n lineHeight={20}\n $fontSize={14}\n $fontWeight={fontWeight}\n $fontStyle={fontStyle}\n textDecorationLine={textDecorationLine}\n 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 className?: 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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} $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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} $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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} $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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase className={className} $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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase className={className} $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, className }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase className={className} $color={color} lineHeight={16} $fontSize={12} $fontWeight={fontWeight} $fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentResponsive: FunctionComponent<ComponentProps & { size?: Size; width: number }> = ({ color, textStyle, children, size, width }) => {\n let fontsize = size;\n if (!size) {\n if (width < 768) {\n fontsize = Size.Small;\n } else if (width < 992) {\n fontsize = Size.Medium;\n } else {\n fontsize = Size.Large;\n }\n }\n switch (fontsize) {\n case Size.XXSmall:\n return <ComponentXXS color={color} textStyle={textStyle} children={children} />;\n case Size.XSmall:\n return <ComponentXS color={color} textStyle={textStyle} children={children} />;\n case Size.Small:\n return <ComponentS color={color} textStyle={textStyle} children={children} />;\n case Size.Medium:\n return <ComponentM color={color} textStyle={textStyle} children={children} />;\n case Size.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"}
|
|
@@ -41,7 +41,7 @@ var AuthPage = function AuthPage(_ref) {
|
|
|
41
41
|
signInInformationText = _ref.signInInformationText,
|
|
42
42
|
screenSetsContainerId = _ref.screenSetsContainerId;
|
|
43
43
|
return /*#__PURE__*/React.createElement(React.Fragment, null, showInformationSection && /*#__PURE__*/React.createElement(_Information.InformationContainer, {
|
|
44
|
-
color: signUp ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_20
|
|
44
|
+
$color: signUp ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_20
|
|
45
45
|
}, /*#__PURE__*/React.createElement(_Information.InformationContent, null, (signUpPlaceholderImage || signInPlaceholderImage) && /*#__PURE__*/React.createElement(_Information.InformationImage, {
|
|
46
46
|
src: signUp ? signUpPlaceholderImage : signInPlaceholderImage,
|
|
47
47
|
alt: signUp ? signUpPlaceholderImageAlt : signInPlaceholderImageAlt
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/AuthPage/AuthPage.tsx"],"names":["AuthPage","showInformationSection","signUp","signUpPlaceholderImage","signInPlaceholderImage","signUpPlaceholderImageAlt","signInPlaceholderImageAlt","signUpInformationHeader","signInInformationHeader","signUpInformationText","signInInformationText","screenSetsContainerId","COLORS","accent1_20","primary_20"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AA4BA;AACA;AACA;AACA;AACA;AACA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,OAYI;AAAA,MAXnBC,sBAWmB,QAXnBA,sBAWmB;AAAA,MAVnBC,MAUmB,QAVnBA,MAUmB;AAAA,MATnBC,sBASmB,QATnBA,sBASmB;AAAA,MARnBC,sBAQmB,QARnBA,sBAQmB;AAAA,MAPnBC,yBAOmB,QAPnBA,yBAOmB;AAAA,MANnBC,yBAMmB,QANnBA,yBAMmB;AAAA,MALnBC,uBAKmB,QALnBA,uBAKmB;AAAA,MAJnBC,uBAImB,QAJnBA,uBAImB;AAAA,MAHnBC,qBAGmB,QAHnBA,qBAGmB;AAAA,MAFnBC,qBAEmB,QAFnBA,qBAEmB;AAAA,MADnBC,qBACmB,QADnBA,qBACmB;AACnB,sBACE,0CACGV,sBAAsB,iBACrB,oBAAC,iCAAD;AAAsB,IAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/AuthPage/AuthPage.tsx"],"names":["AuthPage","showInformationSection","signUp","signUpPlaceholderImage","signInPlaceholderImage","signUpPlaceholderImageAlt","signInPlaceholderImageAlt","signUpInformationHeader","signInInformationHeader","signUpInformationText","signInInformationText","screenSetsContainerId","COLORS","accent1_20","primary_20"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AA4BA;AACA;AACA;AACA;AACA;AACA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,OAYI;AAAA,MAXnBC,sBAWmB,QAXnBA,sBAWmB;AAAA,MAVnBC,MAUmB,QAVnBA,MAUmB;AAAA,MATnBC,sBASmB,QATnBA,sBASmB;AAAA,MARnBC,sBAQmB,QARnBA,sBAQmB;AAAA,MAPnBC,yBAOmB,QAPnBA,yBAOmB;AAAA,MANnBC,yBAMmB,QANnBA,yBAMmB;AAAA,MALnBC,uBAKmB,QALnBA,uBAKmB;AAAA,MAJnBC,uBAImB,QAJnBA,uBAImB;AAAA,MAHnBC,qBAGmB,QAHnBA,qBAGmB;AAAA,MAFnBC,qBAEmB,QAFnBA,qBAEmB;AAAA,MADnBC,qBACmB,QADnBA,qBACmB;AACnB,sBACE,0CACGV,sBAAsB,iBACrB,oBAAC,iCAAD;AAAsB,IAAA,MAAM,EAAEC,MAAM,GAAGU,eAAOC,UAAV,GAAuBD,eAAOE;AAAlE,kBACE,oBAAC,+BAAD,QACG,CAACX,sBAAsB,IAAIC,sBAA3B,kBACC,oBAAC,6BAAD;AAAkB,IAAA,GAAG,EAAEF,MAAM,GAAGC,sBAAH,GAA4BC,sBAAzD;AAAiF,IAAA,GAAG,EAAEF,MAAM,GAAGG,yBAAH,GAA+BC;AAA3H,IAFJ,EAIG,CAACC,uBAAuB,IAAIC,uBAA5B,kBAAwD,oBAAC,8BAAD,QAAoBN,MAAM,GAAGK,uBAAH,GAA6BC,uBAAvD,CAJ3D,EAKG,CAACC,qBAAqB,IAAIC,qBAA1B,kBAAoD,oBAAC,4BAAD,QAAkBR,MAAM,GAAGO,qBAAH,GAA2BC,qBAAnD,CALvD,CADF,CAFJ,eAYE,oBAAC,4BAAD;AAAqB,IAAA,EAAE,EAAEC,qBAAzB;AAAgD,IAAA,cAAc,EAAE,CAACV;AAAjE,IAZF,CADF;AAgBD,CA7BD;;;AA7BEA,EAAAA,sB;AAGAC,EAAAA,M;AAEAC,EAAAA,sB;AAEAC,EAAAA,sB;AAEAC,EAAAA,yB;AAEAC,EAAAA,yB;AAEAC,EAAAA,uB;AAEAC,EAAAA,uB;AAEAC,EAAAA,qB;AAEAC,EAAAA,qB;AAEAC,EAAAA,qB;;eAuCaX,Q","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport ScreenSetsContainer from './ScreenSetsContainer';\nimport { InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage } from './Information';\n\ntype AuthPageProps = {\n /** set this to 'false' to hide the left side illustration/information section */\n showInformationSection: boolean;\n /** true if 'sign-up' screen-set is showing, otherwise false.\n * The value can be set using 'onBeforeScreenLoad' in 'gigya.accounts.showScreenSet(...)' and checking the loaded screen-set */\n signUp: boolean;\n /** img src string for 'sign-up' placeholder image */\n signUpPlaceholderImage?: string;\n /** img src string for 'sign-in' placeholder image */\n signInPlaceholderImage?: string;\n /** img alt text string for 'sign-up' placeholder image */\n signUpPlaceholderImageAlt?: string;\n /** img alt text string for 'sign-in' placeholder image */\n signInPlaceholderImageAlt?: string;\n /** information header text string below 'sign-up' placeholder image */\n signUpInformationHeader?: string;\n /** information header text string below 'sign-in' placeholder image */\n signInInformationHeader?: string;\n /** information text string below 'sign-up' header text */\n signUpInformationText?: string;\n /** information text string below 'sign-in' header text */\n signInInformationText?: string;\n /** ID that will be given to the SAP CDC screen-sets container (must match 'containerID' in 'gigya.accounts.showScreenSet(...)'!) */\n screenSetsContainerId: string;\n};\n\n/**\n * The 'AuthPage' component consist of two containers: an 'Information' container on the left, and a 'ScreenSetsContainer' on the right.\n * The 'Information' container is optional and its contents depend on the context (sign-up or sign-in).\n * The 'ScreenSetsContainer' will contain the SAP CDC screen-sets.\n */\nconst AuthPage = ({\n showInformationSection,\n signUp,\n signUpPlaceholderImage,\n signInPlaceholderImage,\n signUpPlaceholderImageAlt,\n signInPlaceholderImageAlt,\n signUpInformationHeader,\n signInInformationHeader,\n signUpInformationText,\n signInInformationText,\n screenSetsContainerId,\n}: AuthPageProps) => {\n return (\n <>\n {showInformationSection && (\n <InformationContainer $color={signUp ? COLORS.accent1_20 : COLORS.primary_20}>\n <InformationContent>\n {(signUpPlaceholderImage || signInPlaceholderImage) && (\n <InformationImage src={signUp ? signUpPlaceholderImage : signInPlaceholderImage} alt={signUp ? signUpPlaceholderImageAlt : signInPlaceholderImageAlt} />\n )}\n {(signUpInformationHeader || signInInformationHeader) && <InformationHeader>{signUp ? signUpInformationHeader : signInInformationHeader}</InformationHeader>}\n {(signUpInformationText || signInInformationText) && <InformationText>{signUp ? signUpInformationText : signInInformationText}</InformationText>}\n </InformationContent>\n </InformationContainer>\n )}\n <ScreenSetsContainer id={screenSetsContainerId} centerContents={!showInformationSection} />\n </>\n );\n};\n\nexport default AuthPage;\n"],"file":"AuthPage.js"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const InformationContainer: import("styled-components").StyledComponent<"section", any, {
|
|
2
|
-
color: string;
|
|
2
|
+
$color: string;
|
|
3
3
|
}, never>;
|
|
4
4
|
export declare const InformationContent: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
5
|
export declare const InformationHeader: import("styled-components").StyledComponent<"h2", any, {}, never>;
|
|
@@ -20,7 +20,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
20
20
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
21
21
|
|
|
22
22
|
var InformationContainer = (0, _styledComponents.default)(_AuthPageSection.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: none;\n background: ", ";\n\n ", " {\n display: flex;\n padding-top: 56px;\n }\n"])), function (props) {
|
|
23
|
-
return props
|
|
23
|
+
return props.$color;
|
|
24
24
|
}, _styles.BREAKPOINTS.MEDIUM);
|
|
25
25
|
exports.InformationContainer = InformationContainer;
|
|
26
26
|
|
|
@@ -1 +1 @@
|
|
|
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,
|
|
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,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,MAAjB;AAAA,CAFiB,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"}
|
|
@@ -47,25 +47,22 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
|
47
47
|
|
|
48
48
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
49
49
|
|
|
50
|
-
/**
|
|
51
|
-
* Styles for <Banner />
|
|
52
|
-
*/
|
|
53
50
|
var BannerContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background: ", ";\n min-height: 48px;\n display: flex;\n color: ", ";\n margin-top: ", ";\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ", " {\n margin: 0 0 0 16px;\n }\n ", " {\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: ", " !important;\n }\n"])), function (props) {
|
|
54
|
-
return props
|
|
51
|
+
return props.$type ? props.$type : _styles.COLORS.correct_100;
|
|
55
52
|
}, _styles.COLORS.black, function (props) {
|
|
56
53
|
return props.bottom ? 'auto' : '0';
|
|
57
54
|
}, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE, function (props) {
|
|
58
55
|
return props.link;
|
|
59
56
|
});
|
|
60
57
|
|
|
61
|
-
var BannerCenter = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", "\n
|
|
62
|
-
return (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, props
|
|
58
|
+
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) {
|
|
59
|
+
return (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, props.$color);
|
|
63
60
|
}, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
|
|
64
61
|
|
|
65
62
|
var ButtonWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin: 0 0 0 auto;\n"])));
|
|
66
63
|
|
|
67
64
|
var ButtonContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: contents;\n ", ";\n"])), function (props) {
|
|
68
|
-
return props
|
|
65
|
+
return props.$type ? (0, _styles2.getButtonStyle)(props.$type) : null;
|
|
69
66
|
});
|
|
70
67
|
|
|
71
68
|
var BannerContentWrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n"])));
|
|
@@ -100,12 +97,12 @@ var Banner = function Banner(_ref) {
|
|
|
100
97
|
case 'warning':
|
|
101
98
|
return /*#__PURE__*/React.createElement(BannerContainer, {
|
|
102
99
|
"data-testid": testId,
|
|
103
|
-
type: _styles.COLORS.warning_100,
|
|
100
|
+
$type: _styles.COLORS.warning_100,
|
|
104
101
|
link: _styles.COLORS.warning_700,
|
|
105
102
|
hover: _styles.COLORS.warning_20,
|
|
106
103
|
bottom: bottom
|
|
107
104
|
}, /*#__PURE__*/React.createElement(BannerCenter, {
|
|
108
|
-
color: _styles.COLORS.warning_700,
|
|
105
|
+
$color: _styles.COLORS.warning_700,
|
|
109
106
|
className: size
|
|
110
107
|
}, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(_SystemIcons.Help, {
|
|
111
108
|
color: _styles.COLORS.warning_700,
|
|
@@ -119,7 +116,7 @@ var Banner = function Banner(_ref) {
|
|
|
119
116
|
href: link,
|
|
120
117
|
variant: "default"
|
|
121
118
|
}, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
|
|
122
|
-
type: formatTypeToLowerCase
|
|
119
|
+
$type: formatTypeToLowerCase
|
|
123
120
|
}, /*#__PURE__*/React.createElement(_Button.IconButton, {
|
|
124
121
|
variant: "secondary",
|
|
125
122
|
shape: "circular",
|
|
@@ -136,13 +133,13 @@ var Banner = function Banner(_ref) {
|
|
|
136
133
|
case 'critical':
|
|
137
134
|
return /*#__PURE__*/React.createElement(BannerContainer, {
|
|
138
135
|
"data-testid": testId,
|
|
139
|
-
type: _styles.COLORS.critical_100,
|
|
136
|
+
$type: _styles.COLORS.critical_100,
|
|
140
137
|
link: _styles.COLORS.critical_700,
|
|
141
138
|
hover: _styles.COLORS.critical_20,
|
|
142
139
|
bottom: bottom,
|
|
143
140
|
className: size
|
|
144
141
|
}, /*#__PURE__*/React.createElement(BannerCenter, {
|
|
145
|
-
color: _styles.COLORS.critical_700,
|
|
142
|
+
$color: _styles.COLORS.critical_700,
|
|
146
143
|
className: size
|
|
147
144
|
}, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(_SystemIcons.TechnicalWarning, {
|
|
148
145
|
color: _styles.COLORS.critical_700,
|
|
@@ -156,7 +153,7 @@ var Banner = function Banner(_ref) {
|
|
|
156
153
|
href: link,
|
|
157
154
|
variant: "default"
|
|
158
155
|
}, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
|
|
159
|
-
type: formatTypeToLowerCase
|
|
156
|
+
$type: formatTypeToLowerCase
|
|
160
157
|
}, /*#__PURE__*/React.createElement(_Button.IconButton, {
|
|
161
158
|
variant: "secondary",
|
|
162
159
|
shape: "circular",
|
|
@@ -173,13 +170,13 @@ var Banner = function Banner(_ref) {
|
|
|
173
170
|
case 'positive':
|
|
174
171
|
return /*#__PURE__*/React.createElement(BannerContainer, {
|
|
175
172
|
"data-testid": testId,
|
|
176
|
-
type: _styles.COLORS.correct_100,
|
|
173
|
+
$type: _styles.COLORS.correct_100,
|
|
177
174
|
link: _styles.COLORS.correct_700,
|
|
178
175
|
hover: _styles.COLORS.correct_20,
|
|
179
176
|
bottom: bottom,
|
|
180
177
|
className: size
|
|
181
178
|
}, /*#__PURE__*/React.createElement(BannerCenter, {
|
|
182
|
-
color: _styles.COLORS.correct_700,
|
|
179
|
+
$color: _styles.COLORS.correct_700,
|
|
183
180
|
className: size
|
|
184
181
|
}, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(_SystemIcons.ThumbsUp, {
|
|
185
182
|
color: _styles.COLORS.correct_700,
|
|
@@ -193,7 +190,7 @@ var Banner = function Banner(_ref) {
|
|
|
193
190
|
href: link,
|
|
194
191
|
variant: "default"
|
|
195
192
|
}, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
|
|
196
|
-
type: formatTypeToLowerCase
|
|
193
|
+
$type: formatTypeToLowerCase
|
|
197
194
|
}, /*#__PURE__*/React.createElement(_Button.IconButton, {
|
|
198
195
|
variant: "secondary",
|
|
199
196
|
shape: "circular",
|
|
@@ -210,13 +207,13 @@ var Banner = function Banner(_ref) {
|
|
|
210
207
|
default:
|
|
211
208
|
return /*#__PURE__*/React.createElement(BannerContainer, {
|
|
212
209
|
"data-testid": testId,
|
|
213
|
-
type: _styles.COLORS.primary_100,
|
|
210
|
+
$type: _styles.COLORS.primary_100,
|
|
214
211
|
link: _styles.COLORS.primary_700,
|
|
215
212
|
hover: _styles.COLORS.primary_20,
|
|
216
213
|
bottom: bottom,
|
|
217
214
|
className: size
|
|
218
215
|
}, /*#__PURE__*/React.createElement(BannerCenter, {
|
|
219
|
-
color: _styles.COLORS.primary_700,
|
|
216
|
+
$color: _styles.COLORS.primary_700,
|
|
220
217
|
className: size
|
|
221
218
|
}, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(_SystemIcons.Tip, {
|
|
222
219
|
color: _styles.COLORS.primary_700,
|
|
@@ -230,7 +227,7 @@ var Banner = function Banner(_ref) {
|
|
|
230
227
|
href: link,
|
|
231
228
|
variant: "default"
|
|
232
229
|
}, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
|
|
233
|
-
type: "neutral"
|
|
230
|
+
$type: "neutral"
|
|
234
231
|
}, /*#__PURE__*/React.createElement(_Button.IconButton, {
|
|
235
232
|
variant: "secondary",
|
|
236
233
|
shape: "circular",
|
|
@@ -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","ComponentTextStyle","Regular","color","ButtonWrapper","ButtonContainer","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 {Size} from '../types';\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`\n margin: 0 0 0 auto;\n`;\n\nconst ButtonContainer = styled.div<{ type?: string }>`\n display: contents;\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?: Size.Small | Size.Medium | Size.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>\n <ButtonContainer 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 </ButtonContainer>\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>\n <ButtonContainer 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 </ButtonContainer>\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>\n <ButtonContainer 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 </ButtonContainer>\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>\n <ButtonContainer 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 </ButtonContainer>\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","ButtonContainer","BannerContentWrapper","Banner","size","type","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 { Size } from '../types';\nimport { ComponentMStyling, ComponentResponsive } from '../styles/typography';\nimport { HyperLink } from '../HyperLink';\n\n/**\n * Styles for <Banner />\n */\ntype StyleBannerProps = BannerProps & { $type: string };\n\nconst BannerContainer = styled.div<StyleBannerProps>`\n background: ${(props: StyleBannerProps) => (props.$type ? props.$type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: StyleBannerProps) => (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<{ $color: string }>`\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`\n margin: 0 0 0 auto;\n`;\n\nconst ButtonContainer = styled.div<{ $type?: string }>`\n display: contents;\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?: Size.Small | Size.Medium | Size.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>\n <ButtonContainer $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 </ButtonContainer>\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>\n <ButtonContainer $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 </ButtonContainer>\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>\n <ButtonContainer $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 </ButtonContainer>\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>\n <ButtonContainer $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 </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}
|
|
@@ -5,19 +5,19 @@ declare const TYPOGRAPHY: {
|
|
|
5
5
|
fontFamily: string;
|
|
6
6
|
};
|
|
7
7
|
interface ITypographyBase {
|
|
8
|
-
color?: string;
|
|
8
|
+
$color?: string;
|
|
9
9
|
lineHeight: number;
|
|
10
|
-
fontSize: number;
|
|
11
|
-
fontWeight: number;
|
|
12
|
-
fontStyle?: string;
|
|
10
|
+
$fontSize: number;
|
|
11
|
+
$fontWeight: number;
|
|
12
|
+
$fontStyle?: string;
|
|
13
13
|
textTransform?: Property.TextTransform;
|
|
14
14
|
textDecorationLine?: Property.TextDecorationLine;
|
|
15
15
|
}
|
|
16
16
|
interface IHeadline {
|
|
17
|
-
color?: string;
|
|
17
|
+
$color?: string;
|
|
18
18
|
}
|
|
19
19
|
interface IHeadlineBase {
|
|
20
|
-
color?: string;
|
|
20
|
+
$color?: string;
|
|
21
21
|
lineHeight: number;
|
|
22
22
|
fontSize: number;
|
|
23
23
|
}
|