@laerdal/life-react-components 1.3.2-dev.3.full → 1.3.2-dev.4

package/dist/umd/Banners/Banner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","COLORS","correct_100","black","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentMStyling","ComponentTextStyle","ButtonWrapper","ButtonContainer","getButtonStyle","BannerContentWrapper","type","linkText","hover","bottom","testId","icon","onClose","noIcon","Banner","React","window","setWidth","formatTypeToLowerCase","size","warning_700","Math","critical_700","correct_700","primary_700"],"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}&nbsp;&nbsp;\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}&nbsp;&nbsp;\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}&nbsp;&nbsp;\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}&nbsp;&nbsp;\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"}
+{"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","COLORS","correct_100","black","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentMStyling","ComponentTextStyle","ButtonWrapper","ButtonContainer","getButtonStyle","BannerContentWrapper","type","linkText","hover","bottom","testId","icon","onClose","noIcon","Banner","React","window","setWidth","formatTypeToLowerCase","size","warning_700","Math","critical_700","correct_700","primary_700"],"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}&nbsp;&nbsp;\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}&nbsp;&nbsp;\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}&nbsp;&nbsp;\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}&nbsp;&nbsp;\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"}

package/dist/umd/styles/typography.js

@@ -34,22 +34,22 @@
     fontFamily: 'Lato, sans-serif'
   };
   const TypographyBase = (0, _styledComponents2.default)('div')(({
-    color,
+    $color,
     lineHeight,
-    fontSize,
-    fontWeight,
-    fontStyle,
+    $fontSize,
+    $fontWeight,
+    $fontStyle,
     textTransform,
     textDecorationLine
   }) => ({
     fontFamily: TYPOGRAPHY.fontFamily,
-    fontSize: fontSize,
-    fontWeight: fontWeight,
+    fontSize: $fontSize,
+    fontWeight: $fontWeight,
     lineHeight: lineHeight + 'px',
     textTransform: textTransform ? textTransform : 'none',
     textDecorationLine: textDecorationLine ? textDecorationLine : 'none',
-    fontStyle: fontStyle ? fontStyle : 'normal',
-    color: color ? color : _.COLORS.black
+    fontStyle: $fontStyle ? $fontStyle : 'normal',
+    color: $color ? $color : _.COLORS.black
   }));
 
   const HeadlineBaseStyling = (fontSize, lineHeight, color) => {
@@ -63,74 +63,74 @@
   };
 
   const HeadlineBase = (0, _styledComponents2.default)(TypographyBase)(({
-    color,
+    $color,
     lineHeight,
     fontSize
   }) => ({
     fontSize: fontSize,
     fontWeight: 700,
     lineHeight: lineHeight,
-    color: color
+    color: $color
   }));
 
   const HeadlineXLStyling = color => HeadlineBaseStyling('48px', '64px', color);
 
   const HeadlineXL = (0, _styledComponents2.default)(HeadlineBase)(({
-    color
+    $color
   }) => ({
     fontSize: '48px',
     lineHeight: '64px',
-    color: color
+    color: $color
   }));
 
   const HeadlineLStyling = color => HeadlineBaseStyling('40px', '52px', color);
 
   const HeadlineL = (0, _styledComponents2.default)(HeadlineBase)(({
-    color
+    $color
   }) => ({
     fontSize: '40px',
     lineHeight: '52px',
-    color: color
+    color: $color
   }));
 
   const HeadlineMStyling = color => HeadlineBaseStyling('32px', '40px', color);
 
   const HeadlineM = (0, _styledComponents2.default)(HeadlineBase)(({
-    color
+    $color
   }) => ({
     fontSize: '32px',
     lineHeight: '40px',
-    color: color
+    color: $color
   }));
 
   const HeadlineSStyling = color => HeadlineBaseStyling('28px', '36px', color);
 
   const HeadlineS = (0, _styledComponents2.default)(HeadlineBase)(({
-    color
+    $color
   }) => ({
     fontSize: '28px',
     lineHeight: '36px',
-    color: color
+    color: $color
   }));
 
   const HeadlineXSStyling = color => HeadlineBaseStyling('24px', '32px', color);
 
   const HeadlineXS = (0, _styledComponents2.default)(HeadlineBase)(({
-    color
+    $color
   }) => ({
     fontSize: '24px',
     lineHeight: '32px',
-    color: color
+    color: $color
   }));
 
   const HeadlineXXSStyling = color => HeadlineBaseStyling('20px', '24px', color);
 
   const HeadlineXXS = (0, _styledComponents2.default)(HeadlineBase)(({
-    color
+    $color
   }) => ({
     fontSize: '20px',
     lineHeight: '24px',
-    color: color
+    color: $color
   }));
   const ParagraphStyling = _styledComponents.css`
   :lang(ja-jp) > h1,
@@ -227,11 +227,11 @@
     let fontStyle = paragraphFontStyle(textStyle);
     let textDecorationLine = paragraphTextDecorationLine(textStyle);
     return /*#__PURE__*/_react2.default.createElement(ParagraphBase, {
-      color: color,
+      $color: color,
       lineHeight: 36,
-      fontSize: 24,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 24,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textDecorationLine: textDecorationLine,
       marginBetweenParagraphs: "18px"
     }, children);
@@ -253,11 +253,11 @@
     let fontStyle = paragraphFontStyle(textStyle);
     let textDecorationLine = paragraphTextDecorationLine(textStyle);
     return /*#__PURE__*/_react2.default.createElement(ParagraphBase, {
-      color: color,
+      $color: color,
       lineHeight: 32,
-      fontSize: 20,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 20,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textDecorationLine: textDecorationLine,
       marginBetweenParagraphs: "16px"
     }, children);
@@ -279,11 +279,11 @@
     let fontStyle = paragraphFontStyle(textStyle);
     let textDecorationLine = paragraphTextDecorationLine(textStyle);
     return /*#__PURE__*/_react2.default.createElement(ParagraphBase, {
-      color: color,
+      $color: color,
       lineHeight: 28,
-      fontSize: 18,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 18,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textDecorationLine: textDecorationLine,
       marginBetweenParagraphs: "14px"
     }, children);
@@ -305,11 +305,11 @@
     let fontStyle = paragraphFontStyle(textStyle);
     let textDecorationLine = paragraphTextDecorationLine(textStyle);
     return /*#__PURE__*/_react2.default.createElement(ParagraphBase, {
-      color: color,
+      $color: color,
       lineHeight: 24,
-      fontSize: 16,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 16,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textDecorationLine: textDecorationLine,
       marginBetweenParagraphs: "12px"
     }, children);
@@ -331,11 +331,11 @@
     let fontStyle = paragraphFontStyle(textStyle);
     let textDecorationLine = paragraphTextDecorationLine(textStyle);
     return /*#__PURE__*/_react2.default.createElement(ParagraphBase, {
-      color: color,
+      $color: color,
       lineHeight: 20,
-      fontSize: 14,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 14,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textDecorationLine: textDecorationLine,
       marginBetweenParagraphs: "10px"
     }, children);
@@ -397,11 +397,11 @@
     let fontStyle = componentFontStyle(textStyle);
     return /*#__PURE__*/_react2.default.createElement(TypographyBase, {
       className: className,
-      color: color,
+      $color: color,
       lineHeight: 28,
-      fontSize: 24,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle
+      $fontSize: 24,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle
     }, children);
   };
 
@@ -423,11 +423,11 @@
     let fontStyle = componentFontStyle(textStyle);
     return /*#__PURE__*/_react2.default.createElement(TypographyBase, {
       className: className,
-      color: color,
+      $color: color,
       lineHeight: 24,
-      fontSize: 20,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle
+      $fontSize: 20,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle
     }, children);
   };
 
@@ -449,11 +449,11 @@
     let fontStyle = componentFontStyle(textStyle);
     return /*#__PURE__*/_react2.default.createElement(TypographyBase, {
       className: className,
-      color: color,
+      $color: color,
       lineHeight: 24,
-      fontSize: 18,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle
+      $fontSize: 18,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle
     }, children);
   };
 
@@ -475,11 +475,11 @@
     let fontStyle = componentFontStyle(textStyle);
     return /*#__PURE__*/_react2.default.createElement(TypographyBase, {
       className: className,
-      color: color,
+      $color: color,
       lineHeight: 20,
-      fontSize: 16,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle
+      $fontSize: 16,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle
     }, children);
   };
 
@@ -502,11 +502,11 @@
     let textTransform = componentTextTransformation(textStyle);
     return /*#__PURE__*/_react2.default.createElement(TypographyBase, {
       className: className,
-      color: color,
+      $color: color,
       lineHeight: 16,
-      fontSize: 14,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 14,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textTransform: textTransform
     }, children);
   };
@@ -530,11 +530,11 @@
     let textTransform = componentTextTransformation(textStyle);
     return /*#__PURE__*/_react2.default.createElement(TypographyBase, {
       className: className,
-      color: color,
+      $color: color,
       lineHeight: 16,
-      fontSize: 12,
-      fontWeight: fontWeight,
-      fontStyle: fontStyle,
+      $fontSize: 12,
+      $fontWeight: fontWeight,
+      $fontStyle: fontStyle,
       textTransform: textTransform
     }, children);
   };

package/dist/umd/styles/typography.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["TYPOGRAPHY","fontFamily","TypographyBase","textDecorationLine","fontSize","fontWeight","lineHeight","textTransform","fontStyle","color","COLORS","black","HeadlineBaseStyling","css","HeadlineBase","HeadlineXLStyling","HeadlineXL","HeadlineLStyling","HeadlineL","HeadlineMStyling","HeadlineM","HeadlineSStyling","HeadlineS","HeadlineXSStyling","HeadlineXS","HeadlineXXSStyling","HeadlineXXS","ParagraphStyling","ParagraphBase","styled","props","ParagraphTextStyle","textStyle","paragraphFontWeight","paragraphFontStyle","paragraphTextDecorationLine","textDecoration","ParagraphBaseStyling","ParagraphXlStyling","ParagraphXL","children","ParagraphLStyling","ParagraphL","ParagraphMStyling","ParagraphM","ParagraphSStyling","ParagraphS","ParagraphXSStyling","ParagraphXS","ComponentTextStyle","className","componentFontWeight","componentFontStyle","componentTextTransformation","ComponentStyling","ComponentXLStyling","ComponentXL","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","width","fontsize","Size"],"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"}
+{"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["TYPOGRAPHY","fontFamily","TypographyBase","textDecorationLine","fontSize","fontWeight","lineHeight","textTransform","fontStyle","$fontStyle","color","$color","COLORS","black","HeadlineBaseStyling","css","HeadlineBase","HeadlineXLStyling","HeadlineXL","HeadlineLStyling","HeadlineL","HeadlineMStyling","HeadlineM","HeadlineSStyling","HeadlineS","HeadlineXSStyling","HeadlineXS","HeadlineXXSStyling","HeadlineXXS","ParagraphStyling","ParagraphBase","styled","props","ParagraphTextStyle","textStyle","paragraphFontWeight","paragraphFontStyle","paragraphTextDecorationLine","textDecoration","ParagraphBaseStyling","ParagraphXlStyling","ParagraphXL","children","ParagraphLStyling","ParagraphL","ParagraphMStyling","ParagraphM","ParagraphSStyling","ParagraphS","ParagraphXSStyling","ParagraphXS","ComponentTextStyle","className","componentFontWeight","componentFontStyle","componentTextTransformation","ComponentStyling","ComponentXLStyling","ComponentXL","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","width","fontsize","Size"],"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@laerdal/life-react-components",
-  "version": "1.3.2-dev.3.full",
+  "version": "1.3.2-dev.4",
   "private": false,
   "author": "Thomas Kalve <thomas.kalve@laerdal.com>",
   "contributors": [