@laerdal/life-react-components 1.4.1-dev.1.full → 1.4.1-dev.13

package/dist/esm/AuthPage/Information.js

@@ -1,40 +0,0 @@
-import styled from 'styled-components';
-import AuthPageSection from './_AuthPageSection';
-import { BREAKPOINTS, COLORS, ParagraphTextStyle } from '../styles';
-import { HeadlineXLStyling, ParagraphLStyling } from '../styles/typography';
-export const InformationContainer = styled(AuthPageSection)`
-  display: none;
-  background: ${props => props.$color};
-
-  ${BREAKPOINTS.MEDIUM} {
-    display: flex;
-    padding-top: 56px;
-  }
-`;
-export const InformationContent = styled.div`
-  display: flex;
-  flex-direction: column;
-  align-self: center;
-  align-items: center;
-  text-align: center;
-  max-width: 100%;
-
-  ${BREAKPOINTS.LARGE} {
-    align-self: flex-end;
-    margin-right: 48px;
-  }
-`;
-export const InformationHeader = styled.h2`
-  ${HeadlineXLStyling(COLORS.black)}
-  font-weight: 300;
-  margin-bottom: 0;
-`;
-export const InformationText = styled.p`
-  ${ParagraphLStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}
-  margin: 8px 0;
-`;
-export const InformationImage = styled.img`
-  height: 275px;
-  max-width: 100%;
-`;
-//# sourceMappingURL=Information.js.map

package/dist/esm/AuthPage/Information.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/AuthPage/Information.tsx"],"names":["styled","AuthPageSection","BREAKPOINTS","COLORS","ParagraphTextStyle","HeadlineXLStyling","ParagraphLStyling","InformationContainer","props","$color","MEDIUM","InformationContent","div","LARGE","InformationHeader","h2","black","InformationText","p","Regular","neutral_600","InformationImage","img"],"mappings":"AACA,OAAOA,MAAP,MAAmB,mBAAnB;AACA,OAAOC,eAAP,MAA4B,oBAA5B;AACA,SAASC,WAAT,EAAsBC,MAAtB,EAA8DC,kBAA9D,QAAwF,WAAxF;AACA,SAA4BC,iBAA5B,EAA+CC,iBAA/C,QAAwE,sBAAxE;AAEA,OAAO,MAAMC,oBAAoB,GAAGP,MAAM,CAACC,eAAD,CAAsC;AAChF;AACA,gBAAiBO,KAAD,IAAWA,KAAK,CAACC,MAAO;AACxC;AACA,IAAIP,WAAW,CAACQ,MAAO;AACvB;AACA;AACA;AACA,CARO;AAUP,OAAO,MAAMC,kBAAkB,GAAGX,MAAM,CAACY,GAAI;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIV,WAAW,CAACW,KAAM;AACtB;AACA;AACA;AACA,CAZO;AAcP,OAAO,MAAMC,iBAAiB,GAAGd,MAAM,CAACe,EAAG;AAC3C,IAAIV,iBAAiB,CAACF,MAAM,CAACa,KAAR,CAAe;AACpC;AACA;AACA,CAJO;AAMP,OAAO,MAAMC,eAAe,GAAGjB,MAAM,CAACkB,CAAE;AACxC,IAAIZ,iBAAiB,CAACF,kBAAkB,CAACe,OAApB,EAA6BhB,MAAM,CAACiB,WAApC,CAAiD;AACtE;AACA,CAHO;AAKP,OAAO,MAAMC,gBAAgB,GAAGrB,MAAM,CAACsB,GAAI;AAC3C;AACA;AACA,CAHO","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport AuthPageSection from './_AuthPageSection';\nimport { BREAKPOINTS, COLORS, ComponentTextStyle, HeadlineXL, ParagraphTextStyle } from '../styles';\nimport { ComponentLStyling, HeadlineXLStyling, ParagraphLStyling } from '../styles/typography';\n\nexport const InformationContainer = styled(AuthPageSection)<{ $color: string }>`\n  display: none;\n  background: ${(props) => props.$color};\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n    padding-top: 56px;\n  }\n`;\n\nexport const InformationContent = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-self: center;\n  align-items: center;\n  text-align: center;\n  max-width: 100%;\n\n  ${BREAKPOINTS.LARGE} {\n    align-self: flex-end;\n    margin-right: 48px;\n  }\n`;\n\nexport const InformationHeader = styled.h2`\n  ${HeadlineXLStyling(COLORS.black)}\n  font-weight: 300;\n  margin-bottom: 0;\n`;\n\nexport const InformationText = styled.p`\n  ${ParagraphLStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  margin: 8px 0;\n`;\n\nexport const InformationImage = styled.img`\n  height: 275px;\n  max-width: 100%;\n`;\n"],"file":"Information.js"}

package/dist/esm/AuthPage/ScreenSetsContainer.js

@@ -1,32 +0,0 @@
-import styled from 'styled-components';
-import AuthPageSection from './_AuthPageSection';
-import { BREAKPOINTS } from '../styles';
-const ScreenSetsContainer = styled(AuthPageSection)`
-  padding: 8px;
-  width: calc(100% - 16px);
-  align-items: ${props => props.centerContents ? 'center' : 'unset'};
-
-  .gigya-screen-caption {
-    display: none;
-  }
-
-  .gigya-screen {
-    max-width: 100%;
-    margin: auto;
-  }
-
-  ${BREAKPOINTS.MEDIUM} {
-    .gigya-screen {
-      margin: 0;
-      padding: 36px 25px !important;
-    }
-  }
-
-  ${BREAKPOINTS.XLARGE} {
-    .gigya-screen {
-      max-width: 500px;
-    }
-  }
-`;
-export default ScreenSetsContainer;
-//# sourceMappingURL=ScreenSetsContainer.js.map

package/dist/esm/AuthPage/ScreenSetsContainer.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/AuthPage/ScreenSetsContainer.tsx"],"names":["styled","AuthPageSection","BREAKPOINTS","ScreenSetsContainer","props","centerContents","MEDIUM","XLARGE"],"mappings":"AAAA,OAAOA,MAAP,MAAmB,mBAAnB;AACA,OAAOC,eAAP,MAA4B,oBAA5B;AACA,SAASC,WAAT,QAA4B,WAA5B;AAEA,MAAMC,mBAAmB,GAAGH,MAAM,CAACC,eAAD,CAA+C;AACjF;AACA;AACA,iBAAiBG,KAAK,IAAKA,KAAK,CAACC,cAAN,GAAuB,QAAvB,GAAkC,OAAS;AACtE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIH,WAAW,CAACI,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA,IAAIJ,WAAW,CAACK,MAAO;AACvB;AACA;AACA;AACA;AACA,CA1BA;AA4BA,eAAeJ,mBAAf","sourcesContent":["import styled from 'styled-components';\nimport AuthPageSection from './_AuthPageSection';\nimport { BREAKPOINTS } from '../styles';\n\nconst ScreenSetsContainer = styled(AuthPageSection)<{ centerContents: boolean }>`\n  padding: 8px;\n  width: calc(100% - 16px);\n  align-items: ${props => (props.centerContents ? 'center' : 'unset')};\n\n  .gigya-screen-caption {\n    display: none;\n  }\n\n  .gigya-screen {\n    max-width: 100%;\n    margin: auto;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    .gigya-screen {\n      margin: 0;\n      padding: 36px 25px !important;\n    }\n  }\n\n  ${BREAKPOINTS.XLARGE} {\n    .gigya-screen {\n      max-width: 500px;\n    }\n  }\n`;\n\nexport default ScreenSetsContainer;\n"],"file":"ScreenSetsContainer.js"}

package/dist/esm/AuthPage/_AuthPageSection.js

@@ -1,14 +0,0 @@
-import styled from 'styled-components';
-import { BREAKPOINTS } from '../styles';
-const AuthPageSection = styled.section`
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-
-  ${BREAKPOINTS.MEDIUM} {
-    padding: 24px;
-    width: calc(50% - 48px);
-  }
-`;
-export default AuthPageSection;
-//# sourceMappingURL=_AuthPageSection.js.map

package/dist/esm/AuthPage/_AuthPageSection.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/AuthPage/_AuthPageSection.tsx"],"names":["styled","BREAKPOINTS","AuthPageSection","section","MEDIUM"],"mappings":"AAAA,OAAOA,MAAP,MAAmB,mBAAnB;AACA,SAASC,WAAT,QAA4B,WAA5B;AAEA,MAAMC,eAAe,GAAGF,MAAM,CAACG,OAAQ;AACvC;AACA;AACA;AACA;AACA,IAAIF,WAAW,CAACG,MAAO;AACvB;AACA;AACA;AACA,CATA;AAWA,eAAeF,eAAf","sourcesContent":["import styled from 'styled-components';\nimport { BREAKPOINTS } from '../styles';\n\nconst AuthPageSection = styled.section`\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n\n  ${BREAKPOINTS.MEDIUM} {\n    padding: 24px;\n    width: calc(50% - 48px);\n  }\n`;\n\nexport default AuthPageSection;\n"],"file":"_AuthPageSection.js"}

package/dist/esm/AuthPage/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/AuthPage/index.ts"],"names":["ScreenSetsContainer","InformationContainer","InformationContent","InformationHeader","InformationText","InformationImage","AuthPage","screenSetsErrorMessages_EN"],"mappings":"AAAA,OAAOA,mBAAP,MAAgC,uBAAhC;AACA,SAASC,oBAAT,EAA+BC,kBAA/B,EAAmDC,iBAAnD,EAAsEC,eAAtE,EAAuFC,gBAAvF,QAA+G,eAA/G;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAASC,0BAAT,QAA2C,2BAA3C;AAEA,SAASP,mBAAT,EAA8BC,oBAA9B,EAAoDC,kBAApD,EAAwEC,iBAAxE,EAA2FC,eAA3F,EAA4GC,gBAA5G,EAA8HC,QAA9H,EAAwIC,0BAAxI","sourcesContent":["import ScreenSetsContainer from './ScreenSetsContainer';\nimport { InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage } from './Information';\nimport AuthPage from './AuthPage';\nimport { screenSetsErrorMessages_EN } from './screenSetsErrorMessages';\n\nexport { ScreenSetsContainer, InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage, AuthPage, screenSetsErrorMessages_EN };\n"],"file":"index.js"}

package/dist/esm/AuthPage/screenSetsErrorMessages.js

@@ -1,6 +0,0 @@
-export const screenSetsErrorMessages_EN = {
-  email_already_exists: 'An account with that email already exists - try <a href class="sign-in-link" style="font-size: inherit;" data-switch-screen="gigya-login-screen">signing in</a>',
-  email_address_is_invalid: 'Invalid email address',
-  please_enter_fieldname: 'Enter your %fieldname'
-};
-//# sourceMappingURL=screenSetsErrorMessages.js.map

package/dist/esm/AuthPage/screenSetsErrorMessages.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/AuthPage/screenSetsErrorMessages.ts"],"names":["screenSetsErrorMessages_EN","email_already_exists","email_address_is_invalid","please_enter_fieldname"],"mappings":"AAAA,OAAO,MAAMA,0BAA0B,GAAG;AACxCC,EAAAA,oBAAoB,EAClB,iKAFsC;AAGxCC,EAAAA,wBAAwB,EAAE,uBAHc;AAIxCC,EAAAA,sBAAsB,EAAE;AAJgB,CAAnC","sourcesContent":["export const screenSetsErrorMessages_EN = {\n  email_already_exists:\n    'An account with that email already exists - try <a href class=\"sign-in-link\" style=\"font-size: inherit;\" data-switch-screen=\"gigya-login-screen\">signing in</a>',\n  email_address_is_invalid: 'Invalid email address',\n  please_enter_fieldname: 'Enter your %fieldname',\n};\n"],"file":"screenSetsErrorMessages.js"}

package/dist/esm/Banners/Banner.js

@@ -1,264 +0,0 @@
-import _pt from "prop-types";
-import * as React from 'react';
-import styled from 'styled-components';
-import { BREAKPOINTS, COLORS, ComponentTextStyle } from '../styles';
-import { Close, Help, TechnicalWarning, ThumbsUp, Tip } from '../icons/systemicons/SystemIcons';
-import { IconButton } from '../Button';
-import { getButtonStyle } from './styles';
-import { ComponentMStyling, ComponentResponsive } from '../styles/typography';
-import { HyperLink } from '../HyperLink';
-/**
- * Styles for <Banner />
- */
-
-const BannerContainer = styled.div`
-  background: ${props => props.$type ? props.$type : COLORS.correct_100};
-  min-height: 48px;
-  display: flex;
-  color: ${COLORS.black};
-  margin-top: ${props => props.bottom ? 'auto' : '0'};
-
-  button:last-child {
-    line-height: 0;
-    margin: 0 0 0 8px;
-    ${BREAKPOINTS.MEDIUM} {
-      margin: 0 0 0 16px;
-    }
-    ${BREAKPOINTS.LARGE} {
-      margin: 0 0 0 32px;
-    }
-    &.small {
-      margin: 0 0 0 8px;
-    }
-    &.medium {
-      margin: 0 0 0 16px;
-    }
-    &.large {
-      margin: 0 0 0 32px;
-    }
-  }
-
-  a {
-    color: ${props => props.link} !important;
-  }
-`;
-const BannerCenter = styled.div`
-  ${props => ComponentMStyling(ComponentTextStyle.Regular, props.$color)}
-
-  display: flex;
-  width: 100%;
-  margin: 0 0 0 16px;
-  ${BREAKPOINTS.MEDIUM} {
-    margin: 0 16px 0 32px;
-  }
-  ${BREAKPOINTS.LARGE} {
-    margin: 0 40px 0 56px;
-  }
-  &.small {
-    margin: 0 0 0 16px;
-  }
-  &.medium {
-    margin: 0 16px 0 32px;
-  }
-  &.large {
-    margin: 0 40px 0 56px;
-  }
-
-  > svg {
-    flex-shrink: 0;
-    margin: 12px 0;
-  }
-`;
-const ButtonWrapper = styled.div`
-  margin: 0 0 0 auto;
-`;
-const ButtonContainer = styled.div`
-  display: contents;
-  ${props => props.$type ? getButtonStyle(props.$type) : null};
-`;
-const BannerContentWrapper = styled.div`
-  display: flex;
-  align-items: center;
-  margin: 12px 0;
-  &:not(:first-child) {
-    margin-left: 8px;
-  }
-`;
-
-const Banner = ({
-  size,
-  type,
-  children,
-  bottom,
-  testId,
-  linkText,
-  link,
-  onClose,
-  icon,
-  noIcon
-}) => {
-  const [width, setWidth] = React.useState(window.innerWidth);
-  React.useEffect(() => {
-    function handleResize() {
-      setWidth(window.innerWidth);
-    }
-
-    window.addEventListener('resize', handleResize);
-  });
-  const formatTypeToLowerCase = type?.toLowerCase();
-
-  switch (formatTypeToLowerCase) {
-    case 'warning':
-      return /*#__PURE__*/React.createElement(BannerContainer, {
-        "data-testid": testId,
-        $type: COLORS.warning_100,
-        link: COLORS.warning_700,
-        hover: COLORS.warning_20,
-        bottom: bottom
-      }, /*#__PURE__*/React.createElement(BannerCenter, {
-        $color: COLORS.warning_700,
-        className: size
-      }, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(Help, {
-        color: COLORS.warning_700,
-        size: "24px"
-      }), /*#__PURE__*/React.createElement(BannerContentWrapper, null, /*#__PURE__*/React.createElement(ComponentResponsive, {
-        size: size,
-        width: width,
-        color: COLORS.warning_700
-      }, children, "\xA0\xA0", link && linkText && /*#__PURE__*/React.createElement(HyperLink, {
-        id: `${Math.floor(Math.random() * 999999999999)}_BannerLink`,
-        href: link,
-        variant: "default"
-      }, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
-        $type: formatTypeToLowerCase
-      }, /*#__PURE__*/React.createElement(IconButton, {
-        variant: "secondary",
-        shape: "circular",
-        useTransparentBackground: true,
-        tabbedHereBackgroundColor: COLORS.white,
-        action: () => onClose()
-      }, /*#__PURE__*/React.createElement(Close, {
-        color: COLORS.warning_500,
-        size: "24px"
-      }))))));
-
-    case 'critical':
-      return /*#__PURE__*/React.createElement(BannerContainer, {
-        "data-testid": testId,
-        $type: COLORS.critical_100,
-        link: COLORS.critical_700,
-        hover: COLORS.critical_20,
-        bottom: bottom,
-        className: size
-      }, /*#__PURE__*/React.createElement(BannerCenter, {
-        $color: COLORS.critical_700,
-        className: size
-      }, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(TechnicalWarning, {
-        color: COLORS.critical_700,
-        size: "24px"
-      }), /*#__PURE__*/React.createElement(BannerContentWrapper, null, /*#__PURE__*/React.createElement(ComponentResponsive, {
-        size: size,
-        width: width,
-        color: COLORS.critical_700
-      }, children, "\xA0\xA0", link && linkText && /*#__PURE__*/React.createElement(HyperLink, {
-        id: `${Math.floor(Math.random() * 999999999999)}_BannerLink`,
-        href: link,
-        variant: "default"
-      }, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
-        $type: formatTypeToLowerCase
-      }, /*#__PURE__*/React.createElement(IconButton, {
-        variant: "secondary",
-        shape: "circular",
-        useTransparentBackground: true,
-        tabbedHereBackgroundColor: COLORS.white,
-        action: () => onClose()
-      }, /*#__PURE__*/React.createElement(Close, {
-        color: COLORS.critical_500,
-        size: "24px"
-      }))))));
-
-    case 'positive':
-      return /*#__PURE__*/React.createElement(BannerContainer, {
-        "data-testid": testId,
-        $type: COLORS.correct_100,
-        link: COLORS.correct_700,
-        hover: COLORS.correct_20,
-        bottom: bottom,
-        className: size
-      }, /*#__PURE__*/React.createElement(BannerCenter, {
-        $color: COLORS.correct_700,
-        className: size
-      }, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(ThumbsUp, {
-        color: COLORS.correct_700,
-        size: "24px"
-      }), /*#__PURE__*/React.createElement(BannerContentWrapper, null, /*#__PURE__*/React.createElement(ComponentResponsive, {
-        size: size,
-        width: width,
-        color: COLORS.correct_700
-      }, children, "\xA0\xA0", link && linkText && /*#__PURE__*/React.createElement(HyperLink, {
-        id: `${Math.floor(Math.random() * 999999999999)}_BannerLink`,
-        href: link,
-        variant: "default"
-      }, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
-        $type: formatTypeToLowerCase
-      }, /*#__PURE__*/React.createElement(IconButton, {
-        variant: "secondary",
-        shape: "circular",
-        useTransparentBackground: true,
-        tabbedHereBackgroundColor: COLORS.white,
-        action: () => onClose()
-      }, /*#__PURE__*/React.createElement(Close, {
-        color: COLORS.correct_500,
-        size: "24px"
-      }))))));
-
-    default:
-      return /*#__PURE__*/React.createElement(BannerContainer, {
-        "data-testid": testId,
-        $type: COLORS.primary_100,
-        link: COLORS.primary_700,
-        hover: COLORS.primary_20,
-        bottom: bottom,
-        className: size
-      }, /*#__PURE__*/React.createElement(BannerCenter, {
-        $color: COLORS.primary_700,
-        className: size
-      }, icon ? icon : noIcon ? null : /*#__PURE__*/React.createElement(Tip, {
-        color: COLORS.primary_700,
-        size: "24px"
-      }), /*#__PURE__*/React.createElement(BannerContentWrapper, null, /*#__PURE__*/React.createElement(ComponentResponsive, {
-        size: size,
-        width: width,
-        color: COLORS.primary_700
-      }, children, "\xA0\xA0", link && linkText && /*#__PURE__*/React.createElement(HyperLink, {
-        id: `${Math.floor(Math.random() * 999999999999)}_BannerLink`,
-        href: link,
-        variant: "default"
-      }, linkText))), onClose && /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(ButtonContainer, {
-        $type: "neutral"
-      }, /*#__PURE__*/React.createElement(IconButton, {
-        variant: "secondary",
-        shape: "circular",
-        useTransparentBackground: true,
-        tabbedHereBackgroundColor: COLORS.white,
-        action: () => onClose()
-      }, /*#__PURE__*/React.createElement(Close, {
-        color: COLORS.primary_500,
-        size: "24px"
-      }))))));
-  }
-};
-
-Banner.propTypes = {
-  type: _pt.string,
-  link: _pt.string,
-  linkText: _pt.string,
-  hover: _pt.string,
-  bottom: _pt.bool,
-  testId: _pt.string,
-  icon: _pt.node,
-  onClose: _pt.func,
-  noIcon: _pt.bool
-};
-export default Banner;
-//# sourceMappingURL=Banner.js.map

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","Close","Help","TechnicalWarning","ThumbsUp","Tip","IconButton","getButtonStyle","ComponentMStyling","ComponentResponsive","HyperLink","BannerContainer","div","props","$type","correct_100","black","bottom","MEDIUM","LARGE","link","BannerCenter","Regular","$color","ButtonWrapper","ButtonContainer","BannerContentWrapper","Banner","size","type","children","testId","linkText","onClose","icon","noIcon","width","setWidth","useState","window","innerWidth","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}&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/esm/Banners/OverviewBanner.js

@@ -1,71 +0,0 @@
-import _pt from "prop-types";
-import * as React from 'react';
-import styled from 'styled-components';
-import { BREAKPOINTS, COLORS } from '../styles';
-import { PageWidth } from '../Layouts';
-import { HeadlineXSStyling } from '../styles/typography';
-const BannersWrapper = styled.div`
-  background-color: ${COLORS.primary_20};
-`;
-const BannerContent = styled(PageWidth)`
-  background-color: ${COLORS.primary_20};
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-
-  ${BREAKPOINTS.MEDIUM} {
-    flex-direction: row;
-    padding: 48px 12px;
-  }
-
-  & > *:first-child {
-    padding-top: 12px;
-    width: 320px;
-    height: 180px;
-    ${BREAKPOINTS.MEDIUM} {
-      padding-top: 0;
-      margin-right: 20px;
-      width: 384px;
-      height: 216px;
-    }
-  }
-  & h2 {
-    ${HeadlineXSStyling(COLORS.black)}
-    margin: 16px 0 24px 0;
-  }
-  & p {
-    margin: 0;
-    padding: 0 0 28px 0;
-    max-width: 310px;
-  }
-  & div {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-    margin-bottom: 18px;
-    ${BREAKPOINTS.MEDIUM} {
-      margin-left: 20px;
-      align-items: start;
-      justify-content: start;
-      width: 384px;
-    }
-  }
-`;
-
-const OverviewBanner = ({
-  children,
-  testId
-}) => {
-  return /*#__PURE__*/React.createElement(BannersWrapper, null, /*#__PURE__*/React.createElement(BannerContent, {
-    "data-testid": testId
-  }, children));
-};
-
-OverviewBanner.propTypes = {
-  children: _pt.any.isRequired,
-  testId: _pt.string
-};
-export default OverviewBanner;
-//# sourceMappingURL=OverviewBanner.js.map

package/dist/esm/Banners/OverviewBanner.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Banners/OverviewBanner.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","PageWidth","HeadlineXSStyling","BannersWrapper","div","primary_20","BannerContent","MEDIUM","black","OverviewBanner","children","testId"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,WAAR,EAAqBC,MAArB,QAAkC,WAAlC;AACA,SAAQC,SAAR,QAAwB,YAAxB;AACA,SAAQC,iBAAR,QAAgC,sBAAhC;AAEA,MAAMC,cAAc,GAAGL,MAAM,CAACM,GAAI;AAClC,sBAAsBJ,MAAM,CAACK,UAAW;AACxC,CAFA;AAIA,MAAMC,aAAa,GAAGR,MAAM,CAACG,SAAD,CAAY;AACxC,sBAAsBD,MAAM,CAACK,UAAW;AACxC;AACA;AACA;AACA;AACA;AACA,IAAIN,WAAW,CAACQ,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMR,WAAW,CAACQ,MAAO;AACzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAML,iBAAiB,CAACF,MAAM,CAACQ,KAAR,CAAe;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMT,WAAW,CAACQ,MAAO;AACzB;AACA;AACA;AACA;AACA;AACA;AACA,CA7CA;;AAiDA,MAAME,cAAc,GAAG,CAAC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAD,KAAiC;AACtD,sBACE,oBAAC,cAAD,qBACE,oBAAC,aAAD;AAAe,mBAAaA;AAA5B,KAAqCD,QAArC,CADF,CADF;AAKD,CAND;;;AAFeA,EAAAA,Q;AAAeC,EAAAA,M;;AAU9B,eAAeF,cAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS} from '../styles';\nimport {PageWidth} from '../Layouts';\nimport {HeadlineXSStyling} from '../styles/typography';\n\nconst BannersWrapper = styled.div`\n  background-color: ${COLORS.primary_20};\n`;\n\nconst BannerContent = styled(PageWidth)`\n  background-color: ${COLORS.primary_20};\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n\n  ${BREAKPOINTS.MEDIUM} {\n    flex-direction: row;\n    padding: 48px 12px;\n  }\n\n  & > *:first-child {\n    padding-top: 12px;\n    width: 320px;\n    height: 180px;\n    ${BREAKPOINTS.MEDIUM} {\n      padding-top: 0;\n      margin-right: 20px;\n      width: 384px;\n      height: 216px;\n    }\n  }\n  & h2 {\n    ${HeadlineXSStyling(COLORS.black)}\n    margin: 16px 0 24px 0;\n  }\n  & p {\n    margin: 0;\n    padding: 0 0 28px 0;\n    max-width: 310px;\n  }\n  & div {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n    margin-bottom: 18px;\n    ${BREAKPOINTS.MEDIUM} {\n      margin-left: 20px;\n      align-items: start;\n      justify-content: start;\n      width: 384px;\n    }\n  }\n`;\n\ntype Props = { children: any; testId?: string };\n\nconst OverviewBanner = ({ children, testId }: Props) => {\n  return (\n    <BannersWrapper>\n      <BannerContent data-testid={testId}>{children}</BannerContent>\n    </BannersWrapper>\n  );\n};\n\nexport default OverviewBanner;\n"],"file":"OverviewBanner.js"}

package/dist/esm/Banners/__tests__/Banner.test.js

@@ -1,51 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { Banner } from '../index';
-import 'jest-styled-components';
-import { COLORS } from '../../styles';
-describe('<Banner />', () => {
-  it('Renders warning banner', async () => {
-    const {
-      queryByText,
-      getByTestId
-    } = render( /*#__PURE__*/React.createElement(Banner, {
-      type: "warning",
-      testId: "TestBanner"
-    }, /*#__PURE__*/React.createElement("h2", null, "TestBanner")));
-    expect(queryByText('TestHeader')).toBeDefined();
-    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.warning_100);
-  });
-  it('Renders critial banner', async () => {
-    const {
-      queryByText,
-      getByTestId
-    } = render( /*#__PURE__*/React.createElement(Banner, {
-      type: "critical",
-      testId: "TestBanner"
-    }, /*#__PURE__*/React.createElement("h2", null, "TestBanner")));
-    expect(queryByText('TestHeader')).toBeDefined();
-    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.critical_100);
-  });
-  it('Renders positive banner', async () => {
-    const {
-      queryByText,
-      getByTestId
-    } = render( /*#__PURE__*/React.createElement(Banner, {
-      type: "positive",
-      testId: "TestBanner"
-    }, /*#__PURE__*/React.createElement("h2", null, "TestBanner")));
-    expect(queryByText('TestHeader')).toBeDefined();
-    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.correct_100);
-  });
-  it('Renders default banner', async () => {
-    const {
-      queryByText,
-      getByTestId
-    } = render( /*#__PURE__*/React.createElement(Banner, {
-      testId: "TestBanner"
-    }, /*#__PURE__*/React.createElement("h2", null, "TestBanner")));
-    expect(queryByText('TestHeader')).toBeDefined();
-    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.primary_100);
-  });
-});
-//# sourceMappingURL=Banner.test.js.map

package/dist/esm/Banners/__tests__/Banner.test.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/Banners/__tests__/Banner.test.tsx"],"names":["React","render","Banner","COLORS","describe","it","queryByText","getByTestId","expect","toBeDefined","toHaveStyleRule","warning_100","critical_100","correct_100","primary_100"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,MAAT,QAAuB,wBAAvB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,OAAO,wBAAP;AACA,SAASC,MAAT,QAAuB,cAAvB;AAEAC,QAAQ,CAAC,YAAD,EAAe,MAAM;AAC3BC,EAAAA,EAAE,CAAC,wBAAD,EAA2B,YAAY;AACvC,UAAM;AAAEC,MAAAA,WAAF;AAAeC,MAAAA;AAAf,QAA+BN,MAAM,eACzC,oBAAC,MAAD;AAAQ,MAAA,IAAI,EAAC,SAAb;AAAuB,MAAA,MAAM,EAAC;AAA9B,oBACE,6CADF,CADyC,CAA3C;AAKAO,IAAAA,MAAM,CAACF,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,WAAlC;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,eAAlC,CAAkD,YAAlD,EAAgEP,MAAM,CAACQ,WAAvE;AACD,GARC,CAAF;AASAN,EAAAA,EAAE,CAAC,wBAAD,EAA2B,YAAY;AACvC,UAAM;AAAEC,MAAAA,WAAF;AAAeC,MAAAA;AAAf,QAA+BN,MAAM,eACzC,oBAAC,MAAD;AAAQ,MAAA,IAAI,EAAC,UAAb;AAAwB,MAAA,MAAM,EAAC;AAA/B,oBACE,6CADF,CADyC,CAA3C;AAKAO,IAAAA,MAAM,CAACF,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,WAAlC;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,eAAlC,CAAkD,YAAlD,EAAgEP,MAAM,CAACS,YAAvE;AACD,GARC,CAAF;AASAP,EAAAA,EAAE,CAAC,yBAAD,EAA4B,YAAY;AACxC,UAAM;AAAEC,MAAAA,WAAF;AAAeC,MAAAA;AAAf,QAA+BN,MAAM,eACzC,oBAAC,MAAD;AAAQ,MAAA,IAAI,EAAC,UAAb;AAAwB,MAAA,MAAM,EAAC;AAA/B,oBACE,6CADF,CADyC,CAA3C;AAKAO,IAAAA,MAAM,CAACF,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,WAAlC;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,eAAlC,CAAkD,YAAlD,EAAgEP,MAAM,CAACU,WAAvE;AACD,GARC,CAAF;AASAR,EAAAA,EAAE,CAAC,wBAAD,EAA2B,YAAY;AACvC,UAAM;AAAEC,MAAAA,WAAF;AAAeC,MAAAA;AAAf,QAA+BN,MAAM,eACzC,oBAAC,MAAD;AAAQ,MAAA,MAAM,EAAC;AAAf,oBACE,6CADF,CADyC,CAA3C;AAKAO,IAAAA,MAAM,CAACF,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,WAAlC;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,eAAlC,CAAkD,YAAlD,EAAgEP,MAAM,CAACW,WAAvE;AACD,GARC,CAAF;AASD,CArCO,CAAR","sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport { Banner } from '../index';\nimport 'jest-styled-components';\nimport { COLORS } from '../../styles';\n\ndescribe('<Banner />', () => {\n  it('Renders warning banner', async () => {\n    const { queryByText, getByTestId } = render(\n      <Banner type=\"warning\" testId=\"TestBanner\">\n        <h2>TestBanner</h2>\n      </Banner>,\n    );\n    expect(queryByText('TestHeader')).toBeDefined();\n    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.warning_100);\n  });\n  it('Renders critial banner', async () => {\n    const { queryByText, getByTestId } = render(\n      <Banner type=\"critical\" testId=\"TestBanner\">\n        <h2>TestBanner</h2>\n      </Banner>,\n    );\n    expect(queryByText('TestHeader')).toBeDefined();\n    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.critical_100);\n  });\n  it('Renders positive banner', async () => {\n    const { queryByText, getByTestId } = render(\n      <Banner type=\"positive\" testId=\"TestBanner\">\n        <h2>TestBanner</h2>\n      </Banner>,\n    );\n    expect(queryByText('TestHeader')).toBeDefined();\n    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.correct_100);\n  });\n  it('Renders default banner', async () => {\n    const { queryByText, getByTestId } = render(\n      <Banner testId=\"TestBanner\">\n        <h2>TestBanner</h2>\n      </Banner>,\n    );\n    expect(queryByText('TestHeader')).toBeDefined();\n    expect(getByTestId('TestBanner')).toHaveStyleRule('background', COLORS.primary_100);\n  });\n});\n"],"file":"Banner.test.js"}

package/dist/esm/Banners/__tests__/OverviewBanner.test.js

@@ -1,18 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { OverviewBanner } from '../index';
-import 'jest-styled-components';
-import { COLORS } from '../../styles';
-describe('<OverviewBanner />', () => {
-  it('Renders', async () => {
-    const {
-      queryByText,
-      getByTestId
-    } = render( /*#__PURE__*/React.createElement(OverviewBanner, {
-      testId: "TestBanner"
-    }, /*#__PURE__*/React.createElement("h2", null, "TestHeader")));
-    expect(queryByText('TestHeader')).toBeDefined();
-    expect(getByTestId('TestBanner')).toHaveStyleRule('background-color', COLORS.primary_20);
-  });
-});
-//# sourceMappingURL=OverviewBanner.test.js.map

package/dist/esm/Banners/__tests__/OverviewBanner.test.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/Banners/__tests__/OverviewBanner.test.tsx"],"names":["React","render","OverviewBanner","COLORS","describe","it","queryByText","getByTestId","expect","toBeDefined","toHaveStyleRule","primary_20"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,MAAT,QAAuB,wBAAvB;AACA,SAASC,cAAT,QAA+B,UAA/B;AACA,OAAO,wBAAP;AACA,SAASC,MAAT,QAAuB,cAAvB;AAEAC,QAAQ,CAAC,oBAAD,EAAuB,MAAM;AACnCC,EAAAA,EAAE,CAAC,SAAD,EAAY,YAAY;AACxB,UAAM;AAAEC,MAAAA,WAAF;AAAeC,MAAAA;AAAf,QAA+BN,MAAM,eACzC,oBAAC,cAAD;AAAgB,MAAA,MAAM,EAAC;AAAvB,oBACE,6CADF,CADyC,CAA3C;AAKAO,IAAAA,MAAM,CAACF,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,WAAlC;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,YAAD,CAAZ,CAAN,CAAkCG,eAAlC,CAAkD,kBAAlD,EAAsEP,MAAM,CAACQ,UAA7E;AACD,GARC,CAAF;AASD,CAVO,CAAR","sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport { OverviewBanner } from '../index';\nimport 'jest-styled-components';\nimport { COLORS } from '../../styles';\n\ndescribe('<OverviewBanner />', () => {\n  it('Renders', async () => {\n    const { queryByText, getByTestId } = render(\n      <OverviewBanner testId=\"TestBanner\">\n        <h2>TestHeader</h2>\n      </OverviewBanner>,\n    );\n    expect(queryByText('TestHeader')).toBeDefined();\n    expect(getByTestId('TestBanner')).toHaveStyleRule('background-color', COLORS.primary_20);\n  });\n});\n"],"file":"OverviewBanner.test.js"}

package/dist/esm/Banners/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Banners/index.ts"],"names":["Banner","OverviewBanner"],"mappings":"AAAA,OAAOA,MAAP,MAAmB,UAAnB;AACA,OAAOC,cAAP,MAA2B,kBAA3B,C,CAEA;;AACA,SAASD,MAAT,EAAiBC,cAAjB","sourcesContent":["import Banner from './Banner';\nimport OverviewBanner from './OverviewBanner';\n\n// eslint-disable-next-line import/prefer-default-export\nexport { Banner, OverviewBanner };\n"],"file":"index.js"}