@laerdal/life-react-components 2.0.1-dev.2.full → 2.0.1-dev.20.full

package/dist/AuthPage/AuthPage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AuthPage.cjs","names":["AuthPage","showInformationSection","signUp","signUpPlaceholderImage","signInPlaceholderImage","signUpPlaceholderImageAlt","signInPlaceholderImageAlt","signUpInformationHeader","signInInformationHeader","signUpInformationText","signInInformationText","screenSetsContainerId","COLORS","accent1_20","primary_20"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport ScreenSetsContainer from './ScreenSetsContainer';\nimport { InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage } from './Information';\n\ntype AuthPageProps = {\n  /** set this to 'false' to hide the left side illustration/information section */\n  showInformationSection: boolean;\n  /** true if 'sign-up' screen-set is showing, otherwise false.\n   * The value can be set using 'onBeforeScreenLoad' in 'gigya.accounts.showScreenSet(...)' and checking the loaded screen-set */\n  signUp: boolean;\n  /** img src string for 'sign-up' placeholder image */\n  signUpPlaceholderImage?: string;\n  /** img src string for 'sign-in' placeholder image */\n  signInPlaceholderImage?: string;\n  /** img alt text string for 'sign-up' placeholder image */\n  signUpPlaceholderImageAlt?: string;\n  /** img alt text string for 'sign-in' placeholder image */\n  signInPlaceholderImageAlt?: string;\n  /** information header text string below 'sign-up' placeholder image */\n  signUpInformationHeader?: string;\n  /** information header text string below 'sign-in' placeholder image */\n  signInInformationHeader?: string;\n  /** information text string below 'sign-up' header text */\n  signUpInformationText?: string;\n  /** information text string below 'sign-in' header text */\n  signInInformationText?: string;\n  /** ID that will be given to the SAP CDC screen-sets container (must match 'containerID' in 'gigya.accounts.showScreenSet(...)'!) */\n  screenSetsContainerId: string;\n};\n\n/**\n * The 'AuthPage' component consist of two containers: an 'Information' container on the left, and a 'ScreenSetsContainer' on the right.\n * The 'Information' container is optional and its contents depend on the context (sign-up or sign-in).\n * The 'ScreenSetsContainer' will contain the SAP CDC screen-sets.\n */\nconst AuthPage = ({\n  showInformationSection,\n  signUp,\n  signUpPlaceholderImage,\n  signInPlaceholderImage,\n  signUpPlaceholderImageAlt,\n  signInPlaceholderImageAlt,\n  signUpInformationHeader,\n  signInInformationHeader,\n  signUpInformationText,\n  signInInformationText,\n  screenSetsContainerId,\n}: AuthPageProps) => {\n  return (\n    <>\n      {showInformationSection && (\n        <InformationContainer $color={signUp ? COLORS.accent1_20 : COLORS.primary_20}>\n          <InformationContent>\n            {(signUpPlaceholderImage || signInPlaceholderImage) && (\n              <InformationImage src={signUp ? signUpPlaceholderImage : signInPlaceholderImage} alt={signUp ? signUpPlaceholderImageAlt : signInPlaceholderImageAlt} />\n            )}\n            {(signUpInformationHeader || signInInformationHeader) && <InformationHeader>{signUp ? signUpInformationHeader : signInInformationHeader}</InformationHeader>}\n            {(signUpInformationText || signInInformationText) && <InformationText>{signUp ? signUpInformationText : signInInformationText}</InformationText>}\n          </InformationContent>\n        </InformationContainer>\n      )}\n      <ScreenSetsContainer id={screenSetsContainerId} centerContents={!showInformationSection} />\n    </>\n  );\n};\n\nexport default AuthPage;\n"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AA4BA;AACA;AACA;AACA;AACA;AACA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,OAYI;EAAA,IAXnBC,sBAWmB,QAXnBA,sBAWmB;EAAA,IAVnBC,MAUmB,QAVnBA,MAUmB;EAAA,IATnBC,sBASmB,QATnBA,sBASmB;EAAA,IARnBC,sBAQmB,QARnBA,sBAQmB;EAAA,IAPnBC,yBAOmB,QAPnBA,yBAOmB;EAAA,IANnBC,yBAMmB,QANnBA,yBAMmB;EAAA,IALnBC,uBAKmB,QALnBA,uBAKmB;EAAA,IAJnBC,uBAImB,QAJnBA,uBAImB;EAAA,IAHnBC,qBAGmB,QAHnBA,qBAGmB;EAAA,IAFnBC,qBAEmB,QAFnBA,qBAEmB;EAAA,IADnBC,qBACmB,QADnBA,qBACmB;EACnB,oBACE;IAAA,WACGV,sBAAsB,iBACrB,qBAAC,iCAAD;MAAsB,MAAM,EAAEC,MAAM,GAAGU,cAAA,CAAOC,UAAV,GAAuBD,cAAA,CAAOE,UAAlE;MAAA,uBACE,sBAAC,+BAAD;QAAA,WACG,CAACX,sBAAsB,IAAIC,sBAA3B,kBACC,qBAAC,6BAAD;UAAkB,GAAG,EAAEF,MAAM,GAAGC,sBAAH,GAA4BC,sBAAzD;UAAiF,GAAG,EAAEF,MAAM,GAAGG,yBAAH,GAA+BC;QAA3H,EAFJ,EAIG,CAACC,uBAAuB,IAAIC,uBAA5B,kBAAwD,qBAAC,8BAAD;UAAA,UAAoBN,MAAM,GAAGK,uBAAH,GAA6BC;QAAvD,EAJ3D,EAKG,CAACC,qBAAqB,IAAIC,qBAA1B,kBAAoD,qBAAC,4BAAD;UAAA,UAAkBR,MAAM,GAAGO,qBAAH,GAA2BC;QAAnD,EALvD;MAAA;IADF,EAFJ,eAYE,qBAAC,4BAAD;MAAqB,EAAE,EAAEC,qBAAzB;MAAgD,cAAc,EAAE,CAACV;IAAjE,EAZF;EAAA,EADF;AAgBD,CA7BD;;;EA7BEA,sB;EAGAC,M;EAEAC,sB;EAEAC,sB;EAEAC,yB;EAEAC,yB;EAEAC,uB;EAEAC,uB;EAEAC,qB;EAEAC,qB;EAEAC,qB;;eAuCaX,Q"}
+{"version":3,"file":"AuthPage.cjs","names":["AuthPage","showInformationSection","signUp","signUpPlaceholderImage","signInPlaceholderImage","signUpPlaceholderImageAlt","signInPlaceholderImageAlt","signUpInformationHeader","signInInformationHeader","signUpInformationText","signInInformationText","screenSetsContainerId","COLORS","accent1_20","primary_20"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport ScreenSetsContainer from './ScreenSetsContainer';\nimport { InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage } from './Information';\n\ntype AuthPageProps = {\n  /** set this to 'false' to hide the left side illustration/information section */\n  showInformationSection: boolean;\n  /** true if 'sign-up' screen-set is showing, otherwise false.\n   * The value can be set using 'onBeforeScreenLoad' in 'gigya.accounts.showScreenSet(...)' and checking the loaded screen-set */\n  signUp: boolean;\n  /** img src string for 'sign-up' placeholder image */\n  signUpPlaceholderImage?: string;\n  /** img src string for 'sign-in' placeholder image */\n  signInPlaceholderImage?: string;\n  /** img alt text string for 'sign-up' placeholder image */\n  signUpPlaceholderImageAlt?: string;\n  /** img alt text string for 'sign-in' placeholder image */\n  signInPlaceholderImageAlt?: string;\n  /** information header text string below 'sign-up' placeholder image */\n  signUpInformationHeader?: string;\n  /** information header text string below 'sign-in' placeholder image */\n  signInInformationHeader?: string;\n  /** information text string below 'sign-up' header text */\n  signUpInformationText?: string;\n  /** information text string below 'sign-in' header text */\n  signInInformationText?: string;\n  /** ID that will be given to the SAP CDC screen-sets container (must match 'containerID' in 'gigya.accounts.showScreenSet(...)'!) */\n  screenSetsContainerId: string;\n};\n\n/**\n * The 'AuthPage' component consist of two containers: an 'Information' container on the left, and a 'ScreenSetsContainer' on the right.\n * The 'Information' container is optional and its contents depend on the context (sign-up or sign-in).\n * The 'ScreenSetsContainer' will contain the SAP CDC screen-sets.\n */\nconst AuthPage = ({\n  showInformationSection,\n  signUp,\n  signUpPlaceholderImage,\n  signInPlaceholderImage,\n  signUpPlaceholderImageAlt,\n  signInPlaceholderImageAlt,\n  signUpInformationHeader,\n  signInInformationHeader,\n  signUpInformationText,\n  signInInformationText,\n  screenSetsContainerId,\n}: AuthPageProps) => {\n  return (\n    <>\n      {showInformationSection && (\n        <InformationContainer $color={signUp ? COLORS.accent1_20 : COLORS.primary_20}>\n          <InformationContent>\n            {(signUpPlaceholderImage || signInPlaceholderImage) && (\n              <InformationImage src={signUp ? signUpPlaceholderImage : signInPlaceholderImage} alt={signUp ? signUpPlaceholderImageAlt : signInPlaceholderImageAlt} />\n            )}\n            {(signUpInformationHeader || signInInformationHeader) && <InformationHeader>{signUp ? signUpInformationHeader : signInInformationHeader}</InformationHeader>}\n            {(signUpInformationText || signInInformationText) && <InformationText>{signUp ? signUpInformationText : signInInformationText}</InformationText>}\n          </InformationContent>\n        </InformationContainer>\n      )}\n      <ScreenSetsContainer id={screenSetsContainerId} centerContents={!showInformationSection} />\n    </>\n  );\n};\n\nexport default AuthPage;\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AAA+H;AAAA;AAAA;AA4B/H;AACA;AACA;AACA;AACA;AACA,IAAMA,QAAQ,GAAG,SAAXA,QAAQ,OAYO;EAAA,IAXnBC,sBAAsB,QAAtBA,sBAAsB;IACtBC,MAAM,QAANA,MAAM;IACNC,sBAAsB,QAAtBA,sBAAsB;IACtBC,sBAAsB,QAAtBA,sBAAsB;IACtBC,yBAAyB,QAAzBA,yBAAyB;IACzBC,yBAAyB,QAAzBA,yBAAyB;IACzBC,uBAAuB,QAAvBA,uBAAuB;IACvBC,uBAAuB,QAAvBA,uBAAuB;IACvBC,qBAAqB,QAArBA,qBAAqB;IACrBC,qBAAqB,QAArBA,qBAAqB;IACrBC,qBAAqB,QAArBA,qBAAqB;EAErB,oBACE;IAAA,WACGV,sBAAsB,iBACrB,qBAAC,iCAAoB;MAAC,MAAM,EAAEC,MAAM,GAAGU,cAAM,CAACC,UAAU,GAAGD,cAAM,CAACE,UAAW;MAAA,uBAC3E,sBAAC,+BAAkB;QAAA,WAChB,CAACX,sBAAsB,IAAIC,sBAAsB,kBAChD,qBAAC,6BAAgB;UAAC,GAAG,EAAEF,MAAM,GAAGC,sBAAsB,GAAGC,sBAAuB;UAAC,GAAG,EAAEF,MAAM,GAAGG,yBAAyB,GAAGC;QAA0B,EACtJ,EACA,CAACC,uBAAuB,IAAIC,uBAAuB,kBAAK,qBAAC,8BAAiB;UAAA,UAAEN,MAAM,GAAGK,uBAAuB,GAAGC;QAAuB,EAAqB,EAC3J,CAACC,qBAAqB,IAAIC,qBAAqB,kBAAK,qBAAC,4BAAe;UAAA,UAAER,MAAM,GAAGO,qBAAqB,GAAGC;QAAqB,EAAmB;MAAA;IAC7H,EAExB,eACD,qBAAC,4BAAmB;MAAC,EAAE,EAAEC,qBAAsB;MAAC,cAAc,EAAE,CAACV;IAAuB,EAAG;EAAA,EAC1F;AAEP,CAAC;AAAC;EA1DAA,sBAAsB;EAGtBC,MAAM;EAENC,sBAAsB;EAEtBC,sBAAsB;EAEtBC,yBAAyB;EAEzBC,yBAAyB;EAEzBC,uBAAuB;EAEvBC,uBAAuB;EAEvBC,qBAAqB;EAErBC,qBAAqB;EAErBC,qBAAqB;AAAA;AAAA,eAuCRX,QAAQ;AAAA"}

package/dist/AuthPage/AuthPage.d.ts

@@ -1,4 +1,4 @@
-declare type AuthPageProps = {
+type AuthPageProps = {
     /** set this to 'false' to hide the left side illustration/information section */
     showInformationSection: boolean;
     /** true if 'sign-up' screen-set is showing, otherwise false.

package/dist/AuthPage/AuthPage.js

@@ -6,7 +6,6 @@ import { InformationContainer, InformationContent, InformationHeader, Informatio
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
-
 /**
  * The 'AuthPage' component consist of two containers: an 'Information' container on the left, and a 'ScreenSetsContainer' on the right.
  * The 'Information' container is optional and its contents depend on the context (sign-up or sign-in).
@@ -14,16 +13,16 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
  */
 var AuthPage = function AuthPage(_ref) {
   var showInformationSection = _ref.showInformationSection,
-      signUp = _ref.signUp,
-      signUpPlaceholderImage = _ref.signUpPlaceholderImage,
-      signInPlaceholderImage = _ref.signInPlaceholderImage,
-      signUpPlaceholderImageAlt = _ref.signUpPlaceholderImageAlt,
-      signInPlaceholderImageAlt = _ref.signInPlaceholderImageAlt,
-      signUpInformationHeader = _ref.signUpInformationHeader,
-      signInInformationHeader = _ref.signInInformationHeader,
-      signUpInformationText = _ref.signUpInformationText,
-      signInInformationText = _ref.signInInformationText,
-      screenSetsContainerId = _ref.screenSetsContainerId;
+    signUp = _ref.signUp,
+    signUpPlaceholderImage = _ref.signUpPlaceholderImage,
+    signInPlaceholderImage = _ref.signInPlaceholderImage,
+    signUpPlaceholderImageAlt = _ref.signUpPlaceholderImageAlt,
+    signInPlaceholderImageAlt = _ref.signInPlaceholderImageAlt,
+    signUpInformationHeader = _ref.signUpInformationHeader,
+    signInInformationHeader = _ref.signInInformationHeader,
+    signUpInformationText = _ref.signUpInformationText,
+    signInInformationText = _ref.signInInformationText,
+    screenSetsContainerId = _ref.screenSetsContainerId;
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [showInformationSection && /*#__PURE__*/_jsx(InformationContainer, {
       $color: signUp ? COLORS.accent1_20 : COLORS.primary_20,
@@ -43,7 +42,6 @@ var AuthPage = function AuthPage(_ref) {
     })]
   });
 };
-
 AuthPage.propTypes = {
   showInformationSection: _pt.bool.isRequired,
   signUp: _pt.bool.isRequired,

package/dist/AuthPage/AuthPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuthPage.js","names":["React","COLORS","ScreenSetsContainer","InformationContainer","InformationContent","InformationHeader","InformationText","InformationImage","AuthPage","showInformationSection","signUp","signUpPlaceholderImage","signInPlaceholderImage","signUpPlaceholderImageAlt","signInPlaceholderImageAlt","signUpInformationHeader","signInInformationHeader","signUpInformationText","signInInformationText","screenSetsContainerId","accent1_20","primary_20"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport ScreenSetsContainer from './ScreenSetsContainer';\nimport { InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage } from './Information';\n\ntype AuthPageProps = {\n  /** set this to 'false' to hide the left side illustration/information section */\n  showInformationSection: boolean;\n  /** true if 'sign-up' screen-set is showing, otherwise false.\n   * The value can be set using 'onBeforeScreenLoad' in 'gigya.accounts.showScreenSet(...)' and checking the loaded screen-set */\n  signUp: boolean;\n  /** img src string for 'sign-up' placeholder image */\n  signUpPlaceholderImage?: string;\n  /** img src string for 'sign-in' placeholder image */\n  signInPlaceholderImage?: string;\n  /** img alt text string for 'sign-up' placeholder image */\n  signUpPlaceholderImageAlt?: string;\n  /** img alt text string for 'sign-in' placeholder image */\n  signInPlaceholderImageAlt?: string;\n  /** information header text string below 'sign-up' placeholder image */\n  signUpInformationHeader?: string;\n  /** information header text string below 'sign-in' placeholder image */\n  signInInformationHeader?: string;\n  /** information text string below 'sign-up' header text */\n  signUpInformationText?: string;\n  /** information text string below 'sign-in' header text */\n  signInInformationText?: string;\n  /** ID that will be given to the SAP CDC screen-sets container (must match 'containerID' in 'gigya.accounts.showScreenSet(...)'!) */\n  screenSetsContainerId: string;\n};\n\n/**\n * The 'AuthPage' component consist of two containers: an 'Information' container on the left, and a 'ScreenSetsContainer' on the right.\n * The 'Information' container is optional and its contents depend on the context (sign-up or sign-in).\n * The 'ScreenSetsContainer' will contain the SAP CDC screen-sets.\n */\nconst AuthPage = ({\n  showInformationSection,\n  signUp,\n  signUpPlaceholderImage,\n  signInPlaceholderImage,\n  signUpPlaceholderImageAlt,\n  signInPlaceholderImageAlt,\n  signUpInformationHeader,\n  signInInformationHeader,\n  signUpInformationText,\n  signInInformationText,\n  screenSetsContainerId,\n}: AuthPageProps) => {\n  return (\n    <>\n      {showInformationSection && (\n        <InformationContainer $color={signUp ? COLORS.accent1_20 : COLORS.primary_20}>\n          <InformationContent>\n            {(signUpPlaceholderImage || signInPlaceholderImage) && (\n              <InformationImage src={signUp ? signUpPlaceholderImage : signInPlaceholderImage} alt={signUp ? signUpPlaceholderImageAlt : signInPlaceholderImageAlt} />\n            )}\n            {(signUpInformationHeader || signInInformationHeader) && <InformationHeader>{signUp ? signUpInformationHeader : signInInformationHeader}</InformationHeader>}\n            {(signUpInformationText || signInInformationText) && <InformationText>{signUp ? signUpInformationText : signInInformationText}</InformationText>}\n          </InformationContent>\n        </InformationContainer>\n      )}\n      <ScreenSetsContainer id={screenSetsContainerId} centerContents={!showInformationSection} />\n    </>\n  );\n};\n\nexport default AuthPage;\n"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,OAAOC,mBAAP,MAAgC,uBAAhC;AACA,SAASC,oBAAT,EAA+BC,kBAA/B,EAAmDC,iBAAnD,EAAsEC,eAAtE,EAAuFC,gBAAvF,QAA+G,eAA/G;;;;;AA4BA;AACA;AACA;AACA;AACA;AACA,IAAMC,QAAQ,GAAG,SAAXA,QAAW,OAYI;EAAA,IAXnBC,sBAWmB,QAXnBA,sBAWmB;EAAA,IAVnBC,MAUmB,QAVnBA,MAUmB;EAAA,IATnBC,sBASmB,QATnBA,sBASmB;EAAA,IARnBC,sBAQmB,QARnBA,sBAQmB;EAAA,IAPnBC,yBAOmB,QAPnBA,yBAOmB;EAAA,IANnBC,yBAMmB,QANnBA,yBAMmB;EAAA,IALnBC,uBAKmB,QALnBA,uBAKmB;EAAA,IAJnBC,uBAImB,QAJnBA,uBAImB;EAAA,IAHnBC,qBAGmB,QAHnBA,qBAGmB;EAAA,IAFnBC,qBAEmB,QAFnBA,qBAEmB;EAAA,IADnBC,qBACmB,QADnBA,qBACmB;EACnB,oBACE;IAAA,WACGV,sBAAsB,iBACrB,KAAC,oBAAD;MAAsB,MAAM,EAAEC,MAAM,GAAGT,MAAM,CAACmB,UAAV,GAAuBnB,MAAM,CAACoB,UAAlE;MAAA,uBACE,MAAC,kBAAD;QAAA,WACG,CAACV,sBAAsB,IAAIC,sBAA3B,kBACC,KAAC,gBAAD;UAAkB,GAAG,EAAEF,MAAM,GAAGC,sBAAH,GAA4BC,sBAAzD;UAAiF,GAAG,EAAEF,MAAM,GAAGG,yBAAH,GAA+BC;QAA3H,EAFJ,EAIG,CAACC,uBAAuB,IAAIC,uBAA5B,kBAAwD,KAAC,iBAAD;UAAA,UAAoBN,MAAM,GAAGK,uBAAH,GAA6BC;QAAvD,EAJ3D,EAKG,CAACC,qBAAqB,IAAIC,qBAA1B,kBAAoD,KAAC,eAAD;UAAA,UAAkBR,MAAM,GAAGO,qBAAH,GAA2BC;QAAnD,EALvD;MAAA;IADF,EAFJ,eAYE,KAAC,mBAAD;MAAqB,EAAE,EAAEC,qBAAzB;MAAgD,cAAc,EAAE,CAACV;IAAjE,EAZF;EAAA,EADF;AAgBD,CA7BD;;;EA7BEA,sB;EAGAC,M;EAEAC,sB;EAEAC,sB;EAEAC,yB;EAEAC,yB;EAEAC,uB;EAEAC,uB;EAEAC,qB;EAEAC,qB;EAEAC,qB;;AAuCF,eAAeX,QAAf"}
+{"version":3,"file":"AuthPage.js","names":["React","COLORS","ScreenSetsContainer","InformationContainer","InformationContent","InformationHeader","InformationText","InformationImage","AuthPage","showInformationSection","signUp","signUpPlaceholderImage","signInPlaceholderImage","signUpPlaceholderImageAlt","signInPlaceholderImageAlt","signUpInformationHeader","signInInformationHeader","signUpInformationText","signInInformationText","screenSetsContainerId","accent1_20","primary_20"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport ScreenSetsContainer from './ScreenSetsContainer';\nimport { InformationContainer, InformationContent, InformationHeader, InformationText, InformationImage } from './Information';\n\ntype AuthPageProps = {\n  /** set this to 'false' to hide the left side illustration/information section */\n  showInformationSection: boolean;\n  /** true if 'sign-up' screen-set is showing, otherwise false.\n   * The value can be set using 'onBeforeScreenLoad' in 'gigya.accounts.showScreenSet(...)' and checking the loaded screen-set */\n  signUp: boolean;\n  /** img src string for 'sign-up' placeholder image */\n  signUpPlaceholderImage?: string;\n  /** img src string for 'sign-in' placeholder image */\n  signInPlaceholderImage?: string;\n  /** img alt text string for 'sign-up' placeholder image */\n  signUpPlaceholderImageAlt?: string;\n  /** img alt text string for 'sign-in' placeholder image */\n  signInPlaceholderImageAlt?: string;\n  /** information header text string below 'sign-up' placeholder image */\n  signUpInformationHeader?: string;\n  /** information header text string below 'sign-in' placeholder image */\n  signInInformationHeader?: string;\n  /** information text string below 'sign-up' header text */\n  signUpInformationText?: string;\n  /** information text string below 'sign-in' header text */\n  signInInformationText?: string;\n  /** ID that will be given to the SAP CDC screen-sets container (must match 'containerID' in 'gigya.accounts.showScreenSet(...)'!) */\n  screenSetsContainerId: string;\n};\n\n/**\n * The 'AuthPage' component consist of two containers: an 'Information' container on the left, and a 'ScreenSetsContainer' on the right.\n * The 'Information' container is optional and its contents depend on the context (sign-up or sign-in).\n * The 'ScreenSetsContainer' will contain the SAP CDC screen-sets.\n */\nconst AuthPage = ({\n  showInformationSection,\n  signUp,\n  signUpPlaceholderImage,\n  signInPlaceholderImage,\n  signUpPlaceholderImageAlt,\n  signInPlaceholderImageAlt,\n  signUpInformationHeader,\n  signInInformationHeader,\n  signUpInformationText,\n  signInInformationText,\n  screenSetsContainerId,\n}: AuthPageProps) => {\n  return (\n    <>\n      {showInformationSection && (\n        <InformationContainer $color={signUp ? COLORS.accent1_20 : COLORS.primary_20}>\n          <InformationContent>\n            {(signUpPlaceholderImage || signInPlaceholderImage) && (\n              <InformationImage src={signUp ? signUpPlaceholderImage : signInPlaceholderImage} alt={signUp ? signUpPlaceholderImageAlt : signInPlaceholderImageAlt} />\n            )}\n            {(signUpInformationHeader || signInInformationHeader) && <InformationHeader>{signUp ? signUpInformationHeader : signInInformationHeader}</InformationHeader>}\n            {(signUpInformationText || signInInformationText) && <InformationText>{signUp ? signUpInformationText : signInInformationText}</InformationText>}\n          </InformationContent>\n        </InformationContainer>\n      )}\n      <ScreenSetsContainer id={screenSetsContainerId} centerContents={!showInformationSection} />\n    </>\n  );\n};\n\nexport default AuthPage;\n"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,MAAM,QAAQ,WAAW;AAClC,OAAOC,mBAAmB,MAAM,uBAAuB;AACvD,SAASC,oBAAoB,EAAEC,kBAAkB,EAAEC,iBAAiB,EAAEC,eAAe,EAAEC,gBAAgB,QAAQ,eAAe;AAAC;AAAA;AAAA;AA4B/H;AACA;AACA;AACA;AACA;AACA,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAYO;EAAA,IAXnBC,sBAAsB,QAAtBA,sBAAsB;IACtBC,MAAM,QAANA,MAAM;IACNC,sBAAsB,QAAtBA,sBAAsB;IACtBC,sBAAsB,QAAtBA,sBAAsB;IACtBC,yBAAyB,QAAzBA,yBAAyB;IACzBC,yBAAyB,QAAzBA,yBAAyB;IACzBC,uBAAuB,QAAvBA,uBAAuB;IACvBC,uBAAuB,QAAvBA,uBAAuB;IACvBC,qBAAqB,QAArBA,qBAAqB;IACrBC,qBAAqB,QAArBA,qBAAqB;IACrBC,qBAAqB,QAArBA,qBAAqB;EAErB,oBACE;IAAA,WACGV,sBAAsB,iBACrB,KAAC,oBAAoB;MAAC,MAAM,EAAEC,MAAM,GAAGT,MAAM,CAACmB,UAAU,GAAGnB,MAAM,CAACoB,UAAW;MAAA,uBAC3E,MAAC,kBAAkB;QAAA,WAChB,CAACV,sBAAsB,IAAIC,sBAAsB,kBAChD,KAAC,gBAAgB;UAAC,GAAG,EAAEF,MAAM,GAAGC,sBAAsB,GAAGC,sBAAuB;UAAC,GAAG,EAAEF,MAAM,GAAGG,yBAAyB,GAAGC;QAA0B,EACtJ,EACA,CAACC,uBAAuB,IAAIC,uBAAuB,kBAAK,KAAC,iBAAiB;UAAA,UAAEN,MAAM,GAAGK,uBAAuB,GAAGC;QAAuB,EAAqB,EAC3J,CAACC,qBAAqB,IAAIC,qBAAqB,kBAAK,KAAC,eAAe;UAAA,UAAER,MAAM,GAAGO,qBAAqB,GAAGC;QAAqB,EAAmB;MAAA;IAC7H,EAExB,eACD,KAAC,mBAAmB;MAAC,EAAE,EAAEC,qBAAsB;MAAC,cAAc,EAAE,CAACV;IAAuB,EAAG;EAAA,EAC1F;AAEP,CAAC;AAAC;EA1DAA,sBAAsB;EAGtBC,MAAM;EAENC,sBAAsB;EAEtBC,sBAAsB;EAEtBC,yBAAyB;EAEzBC,yBAAyB;EAEzBC,uBAAuB;EAEvBC,uBAAuB;EAEvBC,qBAAqB;EAErBC,qBAAqB;EAErBC,qBAAqB;AAAA;AAuCvB,eAAeX,QAAQ"}

package/dist/AuthPage/Information.cjs

@@ -1,42 +1,26 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InformationText = exports.InformationImage = exports.InformationHeader = exports.InformationContent = exports.InformationContainer = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _AuthPageSection = _interopRequireDefault(require("./_AuthPageSection"));
-
 var _styles = require("../styles");
-
 var _typography = require("../styles/typography");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
 var InformationContainer = (0, _styledComponents.default)(_AuthPageSection.default)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: none;\n  background: ", ";\n\n  ", " {\n    display: flex;\n    padding-top: 56px;\n  }\n"])), function (props) {
   return props.$color;
 }, _styles.BREAKPOINTS.MEDIUM);
 exports.InformationContainer = InformationContainer;
-
 var InformationContent = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\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  ", " {\n    align-self: flex-end;\n    margin-right: 48px;\n  }\n"])), _styles.BREAKPOINTS.LARGE);
-
 exports.InformationContent = InformationContent;
-
 var InformationHeader = _styledComponents.default.h2(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  font-weight: 300;\n  margin-bottom: 0;\n"])), (0, _typography.HeadlineXLStyling)(_styles.COLORS.black));
-
 exports.InformationHeader = InformationHeader;
-
 var InformationText = _styledComponents.default.p(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  margin: 8px 0;\n"])), (0, _typography.ParagraphLStyling)(_styles.ParagraphTextStyle.Regular, _styles.COLORS.neutral_600));
-
 exports.InformationText = InformationText;
-
 var InformationImage = _styledComponents.default.img(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  height: 275px;\n  max-width: 100%;\n"])));
-
 exports.InformationImage = InformationImage;
 //# sourceMappingURL=Information.cjs.map

package/dist/AuthPage/Information.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Information.cjs","names":["InformationContainer","styled","AuthPageSection","props","$color","BREAKPOINTS","MEDIUM","InformationContent","div","LARGE","InformationHeader","h2","HeadlineXLStyling","COLORS","black","InformationText","p","ParagraphLStyling","ParagraphTextStyle","Regular","neutral_600","InformationImage","img"],"sources":["../../src/AuthPage/Information.tsx"],"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"],"mappings":";;;;;;;;;;;AACA;;AACA;;AACA;;AACA;;;;AAEO,IAAMA,oBAAoB,GAAG,IAAAC,yBAAA,EAAOC,wBAAP,CAAH,0LAEjB,UAACC,KAAD;EAAA,OAAWA,KAAK,CAACC,MAAjB;AAAA,CAFiB,EAI7BC,mBAAA,CAAYC,MAJiB,CAA1B;;;AAUA,IAAMC,kBAAkB,GAAGN,yBAAA,CAAOO,GAAV,oSAQ3BH,mBAAA,CAAYI,KARe,CAAxB;;;;AAcA,IAAMC,iBAAiB,GAAGT,yBAAA,CAAOU,EAAV,0IAC1B,IAAAC,6BAAA,EAAkBC,cAAA,CAAOC,KAAzB,CAD0B,CAAvB;;;;AAMA,IAAMC,eAAe,GAAGd,yBAAA,CAAOe,CAAV,kHACxB,IAAAC,6BAAA,EAAkBC,0BAAA,CAAmBC,OAArC,EAA8CN,cAAA,CAAOO,WAArD,CADwB,CAArB;;;;AAKA,IAAMC,gBAAgB,GAAGpB,yBAAA,CAAOqB,GAAV,6HAAtB"}
+{"version":3,"file":"Information.cjs","names":["InformationContainer","styled","AuthPageSection","props","$color","BREAKPOINTS","MEDIUM","InformationContent","div","LARGE","InformationHeader","h2","HeadlineXLStyling","COLORS","black","InformationText","p","ParagraphLStyling","ParagraphTextStyle","Regular","neutral_600","InformationImage","img"],"sources":["../../src/AuthPage/Information.tsx"],"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"],"mappings":";;;;;;;;AACA;AACA;AACA;AACA;AAA+F;AAExF,IAAMA,oBAAoB,GAAG,IAAAC,yBAAM,EAACC,wBAAe,CAAC,0LAE3C,UAACC,KAAK;EAAA,OAAKA,KAAK,CAACC,MAAM;AAAA,GAEnCC,mBAAW,CAACC,MAAM,CAIrB;AAAC;AAEK,IAAMC,kBAAkB,GAAGN,yBAAM,CAACO,GAAG,oSAQxCH,mBAAW,CAACI,KAAK,CAIpB;AAAC;AAEK,IAAMC,iBAAiB,GAAGT,yBAAM,CAACU,EAAE,0IACtC,IAAAC,6BAAiB,EAACC,cAAM,CAACC,KAAK,CAAC,CAGlC;AAAC;AAEK,IAAMC,eAAe,GAAGd,yBAAM,CAACe,CAAC,kHACnC,IAAAC,6BAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAEN,cAAM,CAACO,WAAW,CAAC,CAEpE;AAAC;AAEK,IAAMC,gBAAgB,GAAGpB,yBAAM,CAACqB,GAAG,6HAGzC;AAAC"}

package/dist/AuthPage/Information.js

@@ -1,7 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
 import styled from 'styled-components';
 import AuthPageSection from './_AuthPageSection';
 import { BREAKPOINTS, COLORS, ParagraphTextStyle } from '../styles';

package/dist/AuthPage/Information.js.map

@@ -1 +1 @@
-{"version":3,"file":"Information.js","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"],"sources":["../../src/AuthPage/Information.tsx"],"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"],"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,IAAMC,oBAAoB,GAAGP,MAAM,CAACC,eAAD,CAAT,4KAEjB,UAACO,KAAD;EAAA,OAAWA,KAAK,CAACC,MAAjB;AAAA,CAFiB,EAI7BP,WAAW,CAACQ,MAJiB,CAA1B;AAUP,OAAO,IAAMC,kBAAkB,GAAGX,MAAM,CAACY,GAAV,sRAQ3BV,WAAW,CAACW,KARe,CAAxB;AAcP,OAAO,IAAMC,iBAAiB,GAAGd,MAAM,CAACe,EAAV,4HAC1BV,iBAAiB,CAACF,MAAM,CAACa,KAAR,CADS,CAAvB;AAMP,OAAO,IAAMC,eAAe,GAAGjB,MAAM,CAACkB,CAAV,oGACxBZ,iBAAiB,CAACF,kBAAkB,CAACe,OAApB,EAA6BhB,MAAM,CAACiB,WAApC,CADO,CAArB;AAKP,OAAO,IAAMC,gBAAgB,GAAGrB,MAAM,CAACsB,GAAV,+GAAtB"}
+{"version":3,"file":"Information.js","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"],"sources":["../../src/AuthPage/Information.tsx"],"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"],"mappings":";;AACA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,OAAOC,eAAe,MAAM,oBAAoB;AAChD,SAASC,WAAW,EAAEC,MAAM,EAAkCC,kBAAkB,QAAQ,WAAW;AACnG,SAA4BC,iBAAiB,EAAEC,iBAAiB,QAAQ,sBAAsB;AAE9F,OAAO,IAAMC,oBAAoB,GAAGP,MAAM,CAACC,eAAe,CAAC,4KAE3C,UAACO,KAAK;EAAA,OAAKA,KAAK,CAACC,MAAM;AAAA,GAEnCP,WAAW,CAACQ,MAAM,CAIrB;AAED,OAAO,IAAMC,kBAAkB,GAAGX,MAAM,CAACY,GAAG,sRAQxCV,WAAW,CAACW,KAAK,CAIpB;AAED,OAAO,IAAMC,iBAAiB,GAAGd,MAAM,CAACe,EAAE,4HACtCV,iBAAiB,CAACF,MAAM,CAACa,KAAK,CAAC,CAGlC;AAED,OAAO,IAAMC,eAAe,GAAGjB,MAAM,CAACkB,CAAC,oGACnCZ,iBAAiB,CAACF,kBAAkB,CAACe,OAAO,EAAEhB,MAAM,CAACiB,WAAW,CAAC,CAEpE;AAED,OAAO,IAAMC,gBAAgB,GAAGrB,MAAM,CAACsB,GAAG,+GAGzC"}

package/dist/AuthPage/ScreenSetsContainer.cjs

@@ -1,22 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _AuthPageSection = _interopRequireDefault(require("./_AuthPageSection"));
-
 var _styles = require("../styles");
-
 var _templateObject;
-
 var ScreenSetsContainer = (0, _styledComponents.default)(_AuthPageSection.default)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 8px;\n  width: calc(100% - 16px);\n  align-items: ", ";\n\n  .gigya-screen-caption {\n    display: none;\n  }\n\n  .gigya-screen {\n    max-width: 100%;\n    margin: auto;\n  }\n\n  ", " {\n    .gigya-screen {\n      margin: 0;\n      padding: 36px 25px !important;\n    }\n  }\n\n  ", " {\n    .gigya-screen {\n      max-width: 500px;\n    }\n  }\n"])), function (props) {
   return props.centerContents ? 'center' : 'unset';
 }, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.XLARGE);

package/dist/AuthPage/ScreenSetsContainer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenSetsContainer.cjs","names":["ScreenSetsContainer","styled","AuthPageSection","props","centerContents","BREAKPOINTS","MEDIUM","XLARGE"],"sources":["../../src/AuthPage/ScreenSetsContainer.tsx"],"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"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;;;AAEA,IAAMA,mBAAmB,GAAG,IAAAC,yBAAA,EAAOC,wBAAP,CAAH,8bAGR,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACC,cAAN,GAAuB,QAAvB,GAAkC,OAAvC;AAAA,CAHG,EAcrBC,mBAAA,CAAYC,MAdS,EAqBrBD,mBAAA,CAAYE,MArBS,CAAzB;eA4BeP,mB"}
+{"version":3,"file":"ScreenSetsContainer.cjs","names":["ScreenSetsContainer","styled","AuthPageSection","props","centerContents","BREAKPOINTS","MEDIUM","XLARGE"],"sources":["../../src/AuthPage/ScreenSetsContainer.tsx"],"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"],"mappings":";;;;;;;;AAAA;AACA;AACA;AAAwC;AAExC,IAAMA,mBAAmB,GAAG,IAAAC,yBAAM,EAACC,wBAAe,CAAC,8bAGlC,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACC,cAAc,GAAG,QAAQ,GAAG,OAAO;AAAA,CAAC,EAWjEC,mBAAW,CAACC,MAAM,EAOlBD,mBAAW,CAACE,MAAM,CAKrB;AAAC,eAEaP,mBAAmB;AAAA"}

package/dist/AuthPage/ScreenSetsContainer.js

@@ -1,7 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-
 var _templateObject;
-
 import styled from 'styled-components';
 import AuthPageSection from './_AuthPageSection';
 import { BREAKPOINTS } from '../styles';

package/dist/AuthPage/ScreenSetsContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenSetsContainer.js","names":["styled","AuthPageSection","BREAKPOINTS","ScreenSetsContainer","props","centerContents","MEDIUM","XLARGE"],"sources":["../../src/AuthPage/ScreenSetsContainer.tsx"],"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"],"mappings":";;;;AAAA,OAAOA,MAAP,MAAmB,mBAAnB;AACA,OAAOC,eAAP,MAA4B,oBAA5B;AACA,SAASC,WAAT,QAA4B,WAA5B;AAEA,IAAMC,mBAAmB,GAAGH,MAAM,CAACC,eAAD,CAAT,gbAGR,UAAAG,KAAK;EAAA,OAAKA,KAAK,CAACC,cAAN,GAAuB,QAAvB,GAAkC,OAAvC;AAAA,CAHG,EAcrBH,WAAW,CAACI,MAdS,EAqBrBJ,WAAW,CAACK,MArBS,CAAzB;AA4BA,eAAeJ,mBAAf"}
+{"version":3,"file":"ScreenSetsContainer.js","names":["styled","AuthPageSection","BREAKPOINTS","ScreenSetsContainer","props","centerContents","MEDIUM","XLARGE"],"sources":["../../src/AuthPage/ScreenSetsContainer.tsx"],"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"],"mappings":";;AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,OAAOC,eAAe,MAAM,oBAAoB;AAChD,SAASC,WAAW,QAAQ,WAAW;AAEvC,IAAMC,mBAAmB,GAAGH,MAAM,CAACC,eAAe,CAAC,gbAGlC,UAAAG,KAAK;EAAA,OAAKA,KAAK,CAACC,cAAc,GAAG,QAAQ,GAAG,OAAO;AAAA,CAAC,EAWjEH,WAAW,CAACI,MAAM,EAOlBJ,WAAW,CAACK,MAAM,CAKrB;AAED,eAAeJ,mBAAmB"}

package/dist/AuthPage/_AuthPageSection.cjs

@@ -1,22 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _styles = require("../styles");
-
 var _templateObject;
-
 var AuthPageSection = _styledComponents.default.section(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n\n  ", " {\n    padding: 24px;\n    width: calc(50% - 48px);\n  }\n"])), _styles.BREAKPOINTS.MEDIUM);
-
 var _default = AuthPageSection;
 exports.default = _default;
 //# sourceMappingURL=_AuthPageSection.cjs.map

package/dist/AuthPage/_AuthPageSection.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"_AuthPageSection.cjs","names":["AuthPageSection","styled","section","BREAKPOINTS","MEDIUM"],"sources":["../../src/AuthPage/_AuthPageSection.tsx"],"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"],"mappings":";;;;;;;;;;;AAAA;;AACA;;;;AAEA,IAAMA,eAAe,GAAGC,yBAAA,CAAOC,OAAV,kNAKjBC,mBAAA,CAAYC,MALK,CAArB;;eAWeJ,e"}
+{"version":3,"file":"_AuthPageSection.cjs","names":["AuthPageSection","styled","section","BREAKPOINTS","MEDIUM"],"sources":["../../src/AuthPage/_AuthPageSection.tsx"],"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"],"mappings":";;;;;;;;AAAA;AACA;AAAwC;AAExC,IAAMA,eAAe,GAAGC,yBAAM,CAACC,OAAO,kNAKlCC,mBAAW,CAACC,MAAM,CAIrB;AAAC,eAEaJ,eAAe;AAAA"}

package/dist/AuthPage/_AuthPageSection.js

@@ -1,7 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-
 var _templateObject;
-
 import styled from 'styled-components';
 import { BREAKPOINTS } from '../styles';
 var AuthPageSection = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n\n  ", " {\n    padding: 24px;\n    width: calc(50% - 48px);\n  }\n"])), BREAKPOINTS.MEDIUM);

package/dist/AuthPage/_AuthPageSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"_AuthPageSection.js","names":["styled","BREAKPOINTS","AuthPageSection","section","MEDIUM"],"sources":["../../src/AuthPage/_AuthPageSection.tsx"],"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"],"mappings":";;;;AAAA,OAAOA,MAAP,MAAmB,mBAAnB;AACA,SAASC,WAAT,QAA4B,WAA5B;AAEA,IAAMC,eAAe,GAAGF,MAAM,CAACG,OAAV,oMAKjBF,WAAW,CAACG,MALK,CAArB;AAWA,eAAeF,eAAf"}
+{"version":3,"file":"_AuthPageSection.js","names":["styled","BREAKPOINTS","AuthPageSection","section","MEDIUM"],"sources":["../../src/AuthPage/_AuthPageSection.tsx"],"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"],"mappings":";;AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,WAAW,QAAQ,WAAW;AAEvC,IAAMC,eAAe,GAAGF,MAAM,CAACG,OAAO,oMAKlCF,WAAW,CAACG,MAAM,CAIrB;AAED,eAAeF,eAAe"}

package/dist/AuthPage/index.cjs

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -53,12 +52,8 @@ Object.defineProperty(exports, "screenSetsErrorMessages_EN", {
     return _screenSetsErrorMessages.screenSetsErrorMessages_EN;
   }
 });
-
 var _ScreenSetsContainer = _interopRequireDefault(require("./ScreenSetsContainer"));
-
 var _Information = require("./Information");
-
 var _AuthPage = _interopRequireDefault(require("./AuthPage"));
-
 var _screenSetsErrorMessages = require("./screenSetsErrorMessages");
 //# sourceMappingURL=index.cjs.map

package/dist/AuthPage/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../src/AuthPage/index.ts"],"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"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../../src/AuthPage/index.ts"],"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"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA"}

package/dist/AuthPage/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ScreenSetsContainer","InformationContainer","InformationContent","InformationHeader","InformationText","InformationImage","AuthPage","screenSetsErrorMessages_EN"],"sources":["../../src/AuthPage/index.ts"],"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"],"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"}
+{"version":3,"file":"index.js","names":["ScreenSetsContainer","InformationContainer","InformationContent","InformationHeader","InformationText","InformationImage","AuthPage","screenSetsErrorMessages_EN"],"sources":["../../src/AuthPage/index.ts"],"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"],"mappings":"AAAA,OAAOA,mBAAmB,MAAM,uBAAuB;AACvD,SAASC,oBAAoB,EAAEC,kBAAkB,EAAEC,iBAAiB,EAAEC,eAAe,EAAEC,gBAAgB,QAAQ,eAAe;AAC9H,OAAOC,QAAQ,MAAM,YAAY;AACjC,SAASC,0BAA0B,QAAQ,2BAA2B;AAEtE,SAASP,mBAAmB,EAAEC,oBAAoB,EAAEC,kBAAkB,EAAEC,iBAAiB,EAAEC,eAAe,EAAEC,gBAAgB,EAAEC,QAAQ,EAAEC,0BAA0B"}

package/dist/AuthPage/screenSetsErrorMessages.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"screenSetsErrorMessages.cjs","names":["screenSetsErrorMessages_EN","email_already_exists","email_address_is_invalid","please_enter_fieldname"],"sources":["../../src/AuthPage/screenSetsErrorMessages.ts"],"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"],"mappings":";;;;;;AAAO,IAAMA,0BAA0B,GAAG;EACxCC,oBAAoB,EAClB,iKAFsC;EAGxCC,wBAAwB,EAAE,uBAHc;EAIxCC,sBAAsB,EAAE;AAJgB,CAAnC"}
+{"version":3,"file":"screenSetsErrorMessages.cjs","names":["screenSetsErrorMessages_EN","email_already_exists","email_address_is_invalid","please_enter_fieldname"],"sources":["../../src/AuthPage/screenSetsErrorMessages.ts"],"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"],"mappings":";;;;;;AAAO,IAAMA,0BAA0B,GAAG;EACxCC,oBAAoB,EAClB,iKAAiK;EACnKC,wBAAwB,EAAE,uBAAuB;EACjDC,sBAAsB,EAAE;AAC1B,CAAC;AAAC"}

package/dist/AuthPage/screenSetsErrorMessages.js.map

@@ -1 +1 @@
-{"version":3,"file":"screenSetsErrorMessages.js","names":["screenSetsErrorMessages_EN","email_already_exists","email_address_is_invalid","please_enter_fieldname"],"sources":["../../src/AuthPage/screenSetsErrorMessages.ts"],"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"],"mappings":"AAAA,OAAO,IAAMA,0BAA0B,GAAG;EACxCC,oBAAoB,EAClB,iKAFsC;EAGxCC,wBAAwB,EAAE,uBAHc;EAIxCC,sBAAsB,EAAE;AAJgB,CAAnC"}
+{"version":3,"file":"screenSetsErrorMessages.js","names":["screenSetsErrorMessages_EN","email_already_exists","email_address_is_invalid","please_enter_fieldname"],"sources":["../../src/AuthPage/screenSetsErrorMessages.ts"],"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"],"mappings":"AAAA,OAAO,IAAMA,0BAA0B,GAAG;EACxCC,oBAAoB,EAClB,iKAAiK;EACnKC,wBAAwB,EAAE,uBAAuB;EACjDC,sBAAsB,EAAE;AAC1B,CAAC"}

package/dist/Banners/Banner.cjs

@@ -1,56 +1,32 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _styles = require("../styles");
-
 var _SystemIcons = require("../icons/systemicons/SystemIcons");
-
 var _Button = require("../Button");
-
 var _styles2 = require("./styles");
-
 var _HyperLink = require("../HyperLink");
-
 var _HyperLink2 = require("../HyperLink/HyperLink");
-
 var _utils = require("../utils/utils");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _excluded = ["size", "type", "children", "bottom", "testId", "linkText", "link", "onClose", "icon", "noIcon", "linkAction", "fullWidth", "className"];
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var BannerContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  min-height: 48px;\n  display: flex;\n  color: ", ";\n  margin-top: ", ";\n  border-radius: 4px;\n\n  button:last-child {\n    line-height: 0;\n    margin: 0 0 0 8px;\n    ", " {\n      margin: 0 0 0 16px;\n    }\n    ", " {\n      margin: 0 0 0 32px;\n    }\n    &.small {\n      margin: 0 0 0 8px;\n    }\n    &.medium {\n      margin: 0 0 0 16px;\n    }\n    &.large {\n      margin: 0 0 0 32px;\n    }\n  }\n\n  ", " {\n    &:link {\n      color: ", ";\n    }\n    &:visited {\n      color: ", ";\n    }\n    &:focus,\n    &:active {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n\n  &.full-width-banner {\n    margin: 8px;\n  }\n"])), function (props) {
   return props.$type ? props.$type : _styles.COLORS.correct_100;
 }, _styles.COLORS.black, function (props) {
@@ -62,44 +38,36 @@ var BannerContainer = _styledComponents.default.div(_templateObject || (_templat
 }, function (props) {
   return props.linkFocused;
 }, _styles.COLORS.white);
-
 var BannerCenter = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n\n  display: flex;\n  width: 100%;\n  margin: 0 16px;\n  ", " {\n    margin: 0 32px;\n  }\n  ", " {\n    margin: 0 56px;\n  }\n  &.small {\n    margin: 0 16px;\n  }\n  &.medium {\n    margin: 0 32px;\n  }\n  &.large {\n    margin: 0 56px;\n  }\n\n  > svg {\n    flex-shrink: 0;\n    margin: 12px 0;\n  }\n\n  .full-width-banner & {\n    margin: 0 16px;\n\n    ", " {\n      margin: 0 24px;\n    }\n    ", " {\n      margin: 0 48px;\n    }\n\n    &.small {\n      margin: 0 16px;\n    }\n\n    &.medium {\n      margin: 0 24px;\n    }\n\n    &.large {\n      margin: 0 48px;\n    }\n  }\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null), _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
-
 var ButtonWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 0 0 auto;\n"])));
-
 var ButtonContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: contents;\n  ", ";\n"])), function (props) {
   return props.$type ? (0, _styles2.getButtonStyle)(props.$type) : null;
 });
-
 var BannerContentWrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  margin: 12px 0;\n  &:not(:first-child) {\n    margin-left: 8px;\n  }\n"])));
-
 var Banner = function Banner(_ref) {
   var size = _ref.size,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'neutral' : _ref$type,
-      children = _ref.children,
-      bottom = _ref.bottom,
-      testId = _ref.testId,
-      linkText = _ref.linkText,
-      link = _ref.link,
-      onClose = _ref.onClose,
-      icon = _ref.icon,
-      noIcon = _ref.noIcon,
-      linkAction = _ref.linkAction,
-      fullWidth = _ref.fullWidth,
-      className = _ref.className,
-      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'neutral' : _ref$type,
+    children = _ref.children,
+    bottom = _ref.bottom,
+    testId = _ref.testId,
+    linkText = _ref.linkText,
+    link = _ref.link,
+    onClose = _ref.onClose,
+    icon = _ref.icon,
+    noIcon = _ref.noIcon,
+    linkAction = _ref.linkAction,
+    fullWidth = _ref.fullWidth,
+    className = _ref.className,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var _React$useState = React.useState((0, _utils.hasWindow)() ? window.innerWidth : -1),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      width = _React$useState2[0],
-      setWidth = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    width = _React$useState2[0],
+    setWidth = _React$useState2[1];
   React.useEffect(function () {
     function handleResize() {
       setWidth(window.innerWidth);
     }
-
     window.addEventListener('resize', handleResize);
     return function () {
       return window.removeEventListener('resize', handleResize);
@@ -116,7 +84,6 @@ var Banner = function Banner(_ref) {
     linkVisited: _styles.COLORS.primary_600,
     linkFocused: _styles.COLORS.primary_800
   };
-
   switch (type) {
     case 'warning':
       bannerParams.typeColor = _styles.COLORS.warning_100;
@@ -128,7 +95,6 @@ var Banner = function Banner(_ref) {
       bannerParams.linkVisited = _styles.COLORS.warning_800;
       bannerParams.linkFocused = _styles.COLORS.warning_800;
       break;
-
     case 'critical':
       bannerParams.typeColor = _styles.COLORS.critical_100;
       bannerParams.accentColor = _styles.COLORS.critical_700;
@@ -139,7 +105,6 @@ var Banner = function Banner(_ref) {
       bannerParams.linkVisited = _styles.COLORS.critical_800;
       bannerParams.linkFocused = _styles.COLORS.critical_800;
       break;
-
     case 'positive':
       bannerParams.typeColor = _styles.COLORS.correct_100;
       bannerParams.accentColor = _styles.COLORS.correct_700;
@@ -151,7 +116,6 @@ var Banner = function Banner(_ref) {
       bannerParams.linkFocused = _styles.COLORS.correct_800;
       break;
   }
-
   var cls = "".concat(className !== null && className !== void 0 ? className : '', " ").concat(fullWidth ? 'full-width-banner' : '');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(BannerContainer, _objectSpread(_objectSpread({
     "data-testid": testId,
@@ -161,7 +125,8 @@ var Banner = function Banner(_ref) {
     link: bannerParams.accentColor,
     hover: bannerParams.hoverColor,
     bottom: bottom,
-    className: cls
+    className: cls,
+    role: "note"
   }, rest), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(BannerCenter, {
       style: {
@@ -210,7 +175,6 @@ var Banner = function Banner(_ref) {
     })
   }));
 };
-
 Banner.propTypes = {
   type: _propTypes.default.oneOf(['warning', 'critical', 'positive', 'neutral']),
   link: _propTypes.default.string,