@laerdal/life-react-components 5.1.0 → 6.0.0-dev.1

package/dist/Accordion/styles.cjs

@@ -5,13 +5,114 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AccordionMenuWrapper = exports.AccordionItemHeaderContainer = exports.AccordionItemContainer = exports.AccordionItemBodyContainer = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _styles = require("../styles");
 var _zIndexes = require("../styles/z-indexes");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-const AccordionMenuWrapper = exports.AccordionMenuWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  min-width: 320px;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n"])));
-const AccordionItemHeaderContainer = exports.AccordionItemHeaderContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  cursor: pointer;\n  outline: none;\n  box-sizing: border-box;\n\n  ", "\n\n  div:last-child {\n    margin-left: auto;\n  }\n\n  padding: 0 16px;\n  min-height: 48px;\n  \n  svg {\n    width: 20px;\n    height: 20px;\n  }\n  \n  .medium & {\n    ", "\n    padding: 0 24px;\n    min-height: 56px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .large & {\n    ", "\n    padding: 0 32px;\n    min-height: 64px;\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  &:focus:not(:active) {\n    ", "\n  }\n\n  &:hover {\n    background: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &:active {\n    color: ", ";\n    background: ", ";\n    z-index: ", ";\n  }\n\n  &.active {\n    color: ", ";\n  }\n\n  &.disabled {\n    background: ", "!important;\n    color: ", ";\n    cursor: not-allowed;\n    pointer-events: none;\n    svg {\n      color: ", "!important;\n    }\n  }\n"])), props => (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme)), props => (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme)), props => (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme)), _styles.focusStyles, props => _styles.COLORS.getColor('primary_20', props.theme), props => _styles.COLORS.getColor('primary_700', props.theme), _zIndexes.Z_INDEXES.hover, props => _styles.COLORS.getColor('primary_800', props.theme), props => _styles.COLORS.getColor('primary_100', props.theme), _zIndexes.Z_INDEXES.active, props => _styles.COLORS.getColor('neutral_800', props.theme), props => _styles.COLORS.getColor('white', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme), props => _styles.COLORS.getColor('neutral_300', props.theme));
-const AccordionItemContainer = exports.AccordionItemContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  \n  &:not(:last-child) ", ":not(.active) {\n    border-bottom: 1px solid ", ";\n  }\n"])), AccordionItemHeaderContainer, props => _styles.COLORS.getColor('neutral_100', props.theme));
-const AccordionItemBodyContainer = exports.AccordionItemBodyContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  padding: ", ";\n  background: ", ";\n  \n  ", "\n  \n  .medium & {\n    padding: ", ";\n    ", "\n  }\n  \n  .large & {\n    padding: ", ";\n    ", "\n  }\n\n"])), props => props.$padding || '8px 16px', props => _styles.COLORS.getColor('white', props.theme), (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), props => props.$padding || '12px 24px', (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null), props => props.$padding || '14px 32px', (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null));
+const AccordionMenuWrapper = exports.AccordionMenuWrapper = _styledComponents.default.div`
+  min-width: 320px;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+`;
+const AccordionItemHeaderContainer = exports.AccordionItemHeaderContainer = _styledComponents.default.div`
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+  outline: none;
+  box-sizing: border-box;
+
+  ${props => (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme))}
+
+  div:last-child {
+    margin-left: auto;
+  }
+
+  padding: 0 16px;
+  min-height: 48px;
+  
+  svg {
+    width: 20px;
+    height: 20px;
+  }
+  
+  .medium & {
+    ${props => (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme))}
+    padding: 0 24px;
+    min-height: 56px;
+
+    svg {
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  .large & {
+    ${props => (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme))}
+    padding: 0 32px;
+    min-height: 64px;
+    svg {
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  &:focus:not(:active) {
+    ${_styles.focusStyles}
+  }
+
+  &:hover {
+    background: ${props => _styles.COLORS.getColor('primary_20', props.theme)};
+    color: ${props => _styles.COLORS.getColor('primary_700', props.theme)};
+    z-index: ${_zIndexes.Z_INDEXES.hover};
+  }
+
+  &:active {
+    color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+    background: ${props => _styles.COLORS.getColor('primary_100', props.theme)};
+    z-index: ${_zIndexes.Z_INDEXES.active};
+  }
+
+  &.active {
+    color: ${props => _styles.COLORS.getColor('neutral_800', props.theme)};
+  }
+
+  &.disabled {
+    background: ${props => _styles.COLORS.getColor('white', props.theme)}!important;
+    color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
+    cursor: not-allowed;
+    pointer-events: none;
+    svg {
+      color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)}!important;
+    }
+  }
+`;
+const AccordionItemContainer = exports.AccordionItemContainer = _styledComponents.default.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  
+  &:not(:last-child) ${AccordionItemHeaderContainer}:not(.active) {
+    border-bottom: 1px solid ${props => _styles.COLORS.getColor('neutral_100', props.theme)};
+  }
+`;
+const AccordionItemBodyContainer = exports.AccordionItemBodyContainer = _styledComponents.default.div`
+  padding: ${props => props.$padding || '8px 16px'};
+  background: ${props => _styles.COLORS.getColor('white', props.theme)};
+  
+  ${(0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null)}
+  
+  .medium & {
+    padding: ${props => props.$padding || '12px 24px'};
+    ${(0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null)}
+  }
+  
+  .large & {
+    padding: ${props => props.$padding || '14px 32px'};
+    ${(0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null)}
+  }
+
+`;
 //# sourceMappingURL=styles.cjs.map

package/dist/Accordion/styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styles.cjs","names":["_styledComponents","_interopRequireDefault","require","_styles","_zIndexes","_templateObject","_templateObject2","_templateObject3","_templateObject4","AccordionMenuWrapper","exports","styled","div","_taggedTemplateLiteral2","default","AccordionItemHeaderContainer","props","ComponentSStyling","ComponentTextStyle","Regular","COLORS","getColor","theme","ComponentMStyling","ComponentLStyling","focusStyles","Z_INDEXES","hover","active","AccordionItemContainer","AccordionItemBodyContainer","$padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport {\r\n  COLORS,\r\n  ComponentLStyling,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  focusStyles\r\n} from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nexport const AccordionMenuWrapper = styled.div`\r\n  min-width: 320px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n`;\r\n\r\n\r\n\r\nexport const AccordionItemHeaderContainer = styled.div`\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  cursor: pointer;\r\n  outline: none;\r\n  box-sizing: border-box;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  div:last-child {\r\n    margin-left: auto;\r\n  }\r\n\r\n  padding: 0 16px;\r\n  min-height: 48px;\r\n  \r\n  svg {\r\n    width: 20px;\r\n    height: 20px;\r\n  }\r\n  \r\n  .medium & {\r\n    ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 24px;\r\n    min-height: 56px;\r\n\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  .large & {\r\n    ${props => ComponentLStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 32px;\r\n    min-height: 64px;\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  &:focus:not(:active) {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    z-index: ${Z_INDEXES.hover};\r\n  }\r\n\r\n  &:active {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.active {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.disabled {\r\n    background: ${props => COLORS.getColor('white', props.theme)}!important;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    cursor: not-allowed;\r\n    pointer-events: none;\r\n    svg {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)}!important;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const AccordionItemContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  \r\n  &:not(:last-child) ${AccordionItemHeaderContainer}:not(.active) {\r\n    border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const AccordionItemBodyContainer = styled.div<{ $padding?: string }>`\r\n  padding: ${(props) => props.$padding || '8px 16px'};\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  \r\n  ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n  \r\n  .medium & {\r\n    padding: ${(props) => props.$padding || '12px 24px'};\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n  \r\n  .large & {\r\n    padding: ${(props) => props.$padding || '14px 32px'};\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n\r\n`;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"styles.cjs","names":["_styledComponents","_interopRequireDefault","require","_styles","_zIndexes","AccordionMenuWrapper","exports","styled","div","AccordionItemHeaderContainer","props","ComponentSStyling","ComponentTextStyle","Regular","COLORS","getColor","theme","ComponentMStyling","ComponentLStyling","focusStyles","Z_INDEXES","hover","active","AccordionItemContainer","AccordionItemBodyContainer","$padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport {\r\n  COLORS,\r\n  ComponentLStyling,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  focusStyles\r\n} from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nexport const AccordionMenuWrapper = styled.div`\r\n  min-width: 320px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n`;\r\n\r\n\r\n\r\nexport const AccordionItemHeaderContainer = styled.div`\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  cursor: pointer;\r\n  outline: none;\r\n  box-sizing: border-box;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  div:last-child {\r\n    margin-left: auto;\r\n  }\r\n\r\n  padding: 0 16px;\r\n  min-height: 48px;\r\n  \r\n  svg {\r\n    width: 20px;\r\n    height: 20px;\r\n  }\r\n  \r\n  .medium & {\r\n    ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 24px;\r\n    min-height: 56px;\r\n\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  .large & {\r\n    ${props => ComponentLStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 32px;\r\n    min-height: 64px;\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  &:focus:not(:active) {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    z-index: ${Z_INDEXES.hover};\r\n  }\r\n\r\n  &:active {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.active {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.disabled {\r\n    background: ${props => COLORS.getColor('white', props.theme)}!important;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    cursor: not-allowed;\r\n    pointer-events: none;\r\n    svg {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)}!important;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const AccordionItemContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  \r\n  &:not(:last-child) ${AccordionItemHeaderContainer}:not(.active) {\r\n    border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const AccordionItemBodyContainer = styled.div<{ $padding?: string }>`\r\n  padding: ${(props) => props.$padding || '8px 16px'};\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  \r\n  ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n  \r\n  .medium & {\r\n    padding: ${(props) => props.$padding || '12px 24px'};\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n  \r\n  .large & {\r\n    padding: ${(props) => props.$padding || '14px 32px'};\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n\r\n`;\r\n"],"mappings":";;;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAQA,IAAAE,SAAA,GAAAF,OAAA;AAEO,MAAMG,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC9C;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMC,4BAA4B,GAAAH,OAAA,CAAAG,4BAAA,GAAGF,yBAAM,CAACC,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIE,KAAK,IAAI,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMN,KAAK,IAAI,IAAAO,yBAAiB,EAACL,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC;AACzG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMN,KAAK,IAAI,IAAAQ,yBAAiB,EAACN,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC,CAAC;AACzG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMG,mBAAW;AACjB;AACA;AACA;AACA,kBAAkBT,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,YAAY,EAAEL,KAAK,CAACM,KAAK,CAAC;AACrE,aAAaN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACjE,eAAeI,mBAAS,CAACC,KAAK;AAC9B;AACA;AACA;AACA,aAAaX,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACjE,kBAAkBN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACtE,eAAeI,mBAAS,CAACE,MAAM;AAC/B;AACA;AACA;AACA,aAAaZ,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACjE;AACA;AACA;AACA,kBAAkBN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEL,KAAK,CAACM,KAAK,CAAC;AAChE,aAAaN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACjE;AACA;AACA;AACA,eAAeN,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACnE;AACA;AACA,CAAC;AAEM,MAAMO,sBAAsB,GAAAjB,OAAA,CAAAiB,sBAAA,GAAGhB,yBAAM,CAACC,GAAG;AAChD;AACA;AACA;AACA;AACA;AACA,uBAAuBC,4BAA4B;AACnD,+BAA+BC,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEL,KAAK,CAACM,KAAK,CAAC;AACnF;AACA,CAAC;AAEM,MAAMQ,0BAA0B,GAAAlB,OAAA,CAAAkB,0BAAA,GAAGjB,yBAAM,CAACC,GAA0B;AAC3E,aAAcE,KAAK,IAAKA,KAAK,CAACe,QAAQ,IAAI,UAAU;AACpD,gBAAgBf,KAAK,IAAII,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEL,KAAK,CAACM,KAAK,CAAC;AAC9D;AACA,IAAI,IAAAL,yBAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAE,IAAI,CAAC;AACvD;AACA;AACA,eAAgBH,KAAK,IAAKA,KAAK,CAACe,QAAQ,IAAI,WAAW;AACvD,MAAM,IAAAR,yBAAiB,EAACL,0BAAkB,CAACC,OAAO,EAAE,IAAI,CAAC;AACzD;AACA;AACA;AACA,eAAgBH,KAAK,IAAKA,KAAK,CAACe,QAAQ,IAAI,WAAW;AACvD,MAAM,IAAAP,yBAAiB,EAACN,0BAAkB,CAACC,OAAO,EAAE,IAAI,CAAC;AACzD;AACA;AACA,CAAC","ignoreList":[]}

package/dist/Accordion/styles.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
-export declare const AccordionMenuWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const AccordionItemHeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const AccordionItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const AccordionItemBodyContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    $padding?: string | undefined;
-}>> & string;
+export declare const AccordionMenuWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const AccordionItemHeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const AccordionItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const AccordionItemBodyContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $padding?: string;
+}>> & string;

package/dist/Accordion/styles.js

@@ -1,10 +1,111 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 import styled from 'styled-components';
 import { COLORS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, focusStyles } from '../styles';
 import { Z_INDEXES } from '../styles/z-indexes';
-export const AccordionMenuWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  min-width: 320px;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n"])));
-export const AccordionItemHeaderContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  cursor: pointer;\n  outline: none;\n  box-sizing: border-box;\n\n  ", "\n\n  div:last-child {\n    margin-left: auto;\n  }\n\n  padding: 0 16px;\n  min-height: 48px;\n  \n  svg {\n    width: 20px;\n    height: 20px;\n  }\n  \n  .medium & {\n    ", "\n    padding: 0 24px;\n    min-height: 56px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .large & {\n    ", "\n    padding: 0 32px;\n    min-height: 64px;\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  &:focus:not(:active) {\n    ", "\n  }\n\n  &:hover {\n    background: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &:active {\n    color: ", ";\n    background: ", ";\n    z-index: ", ";\n  }\n\n  &.active {\n    color: ", ";\n  }\n\n  &.disabled {\n    background: ", "!important;\n    color: ", ";\n    cursor: not-allowed;\n    pointer-events: none;\n    svg {\n      color: ", "!important;\n    }\n  }\n"])), props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme)), props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme)), props => ComponentLStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme)), focusStyles, props => COLORS.getColor('primary_20', props.theme), props => COLORS.getColor('primary_700', props.theme), Z_INDEXES.hover, props => COLORS.getColor('primary_800', props.theme), props => COLORS.getColor('primary_100', props.theme), Z_INDEXES.active, props => COLORS.getColor('neutral_800', props.theme), props => COLORS.getColor('white', props.theme), props => COLORS.getColor('neutral_300', props.theme), props => COLORS.getColor('neutral_300', props.theme));
-export const AccordionItemContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  \n  &:not(:last-child) ", ":not(.active) {\n    border-bottom: 1px solid ", ";\n  }\n"])), AccordionItemHeaderContainer, props => COLORS.getColor('neutral_100', props.theme));
-export const AccordionItemBodyContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  padding: ", ";\n  background: ", ";\n  \n  ", "\n  \n  .medium & {\n    padding: ", ";\n    ", "\n  }\n  \n  .large & {\n    padding: ", ";\n    ", "\n  }\n\n"])), props => props.$padding || '8px 16px', props => COLORS.getColor('white', props.theme), ComponentSStyling(ComponentTextStyle.Regular, null), props => props.$padding || '12px 24px', ComponentMStyling(ComponentTextStyle.Regular, null), props => props.$padding || '14px 32px', ComponentLStyling(ComponentTextStyle.Regular, null));
+export const AccordionMenuWrapper = styled.div`
+  min-width: 320px;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+`;
+export const AccordionItemHeaderContainer = styled.div`
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+  outline: none;
+  box-sizing: border-box;
+
+  ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}
+
+  div:last-child {
+    margin-left: auto;
+  }
+
+  padding: 0 16px;
+  min-height: 48px;
+  
+  svg {
+    width: 20px;
+    height: 20px;
+  }
+  
+  .medium & {
+    ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}
+    padding: 0 24px;
+    min-height: 56px;
+
+    svg {
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  .large & {
+    ${props => ComponentLStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}
+    padding: 0 32px;
+    min-height: 64px;
+    svg {
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  &:focus:not(:active) {
+    ${focusStyles}
+  }
+
+  &:hover {
+    background: ${props => COLORS.getColor('primary_20', props.theme)};
+    color: ${props => COLORS.getColor('primary_700', props.theme)};
+    z-index: ${Z_INDEXES.hover};
+  }
+
+  &:active {
+    color: ${props => COLORS.getColor('primary_800', props.theme)};
+    background: ${props => COLORS.getColor('primary_100', props.theme)};
+    z-index: ${Z_INDEXES.active};
+  }
+
+  &.active {
+    color: ${props => COLORS.getColor('neutral_800', props.theme)};
+  }
+
+  &.disabled {
+    background: ${props => COLORS.getColor('white', props.theme)}!important;
+    color: ${props => COLORS.getColor('neutral_300', props.theme)};
+    cursor: not-allowed;
+    pointer-events: none;
+    svg {
+      color: ${props => COLORS.getColor('neutral_300', props.theme)}!important;
+    }
+  }
+`;
+export const AccordionItemContainer = styled.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  
+  &:not(:last-child) ${AccordionItemHeaderContainer}:not(.active) {
+    border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};
+  }
+`;
+export const AccordionItemBodyContainer = styled.div`
+  padding: ${props => props.$padding || '8px 16px'};
+  background: ${props => COLORS.getColor('white', props.theme)};
+  
+  ${ComponentSStyling(ComponentTextStyle.Regular, null)}
+  
+  .medium & {
+    padding: ${props => props.$padding || '12px 24px'};
+    ${ComponentMStyling(ComponentTextStyle.Regular, null)}
+  }
+  
+  .large & {
+    padding: ${props => props.$padding || '14px 32px'};
+    ${ComponentLStyling(ComponentTextStyle.Regular, null)}
+  }
+
+`;
 //# sourceMappingURL=styles.js.map

package/dist/Accordion/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","focusStyles","Z_INDEXES","AccordionMenuWrapper","div","_templateObject","_taggedTemplateLiteral","AccordionItemHeaderContainer","_templateObject2","props","Regular","getColor","theme","hover","active","AccordionItemContainer","_templateObject3","AccordionItemBodyContainer","_templateObject4","$padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport {\r\n  COLORS,\r\n  ComponentLStyling,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  focusStyles\r\n} from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nexport const AccordionMenuWrapper = styled.div`\r\n  min-width: 320px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n`;\r\n\r\n\r\n\r\nexport const AccordionItemHeaderContainer = styled.div`\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  cursor: pointer;\r\n  outline: none;\r\n  box-sizing: border-box;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  div:last-child {\r\n    margin-left: auto;\r\n  }\r\n\r\n  padding: 0 16px;\r\n  min-height: 48px;\r\n  \r\n  svg {\r\n    width: 20px;\r\n    height: 20px;\r\n  }\r\n  \r\n  .medium & {\r\n    ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 24px;\r\n    min-height: 56px;\r\n\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  .large & {\r\n    ${props => ComponentLStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 32px;\r\n    min-height: 64px;\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  &:focus:not(:active) {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    z-index: ${Z_INDEXES.hover};\r\n  }\r\n\r\n  &:active {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.active {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.disabled {\r\n    background: ${props => COLORS.getColor('white', props.theme)}!important;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    cursor: not-allowed;\r\n    pointer-events: none;\r\n    svg {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)}!important;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const AccordionItemContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  \r\n  &:not(:last-child) ${AccordionItemHeaderContainer}:not(.active) {\r\n    border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const AccordionItemBodyContainer = styled.div<{ $padding?: string }>`\r\n  padding: ${(props) => props.$padding || '8px 16px'};\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  \r\n  ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n  \r\n  .medium & {\r\n    padding: ${(props) => props.$padding || '12px 24px'};\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n  \r\n  .large & {\r\n    padding: ${(props) => props.$padding || '14px 32px'};\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n\r\n`;\r\n"],"mappings":";;AAAA,OAAOA,MAAM,MAAe,mBAAmB;AAC/C,SACEC,MAAM,EACNC,iBAAiB,EACjBC,iBAAiB,EACjBC,iBAAiB,EACjBC,kBAAkB,EAClBC,WAAW,QACN,WAAW;AAClB,SAASC,SAAS,QAAQ,qBAAqB;AAE/C,OAAO,MAAMC,oBAAoB,GAAGR,MAAM,CAACS,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,uGAK7C;AAID,OAAO,MAAMC,4BAA4B,GAAGZ,MAAM,CAACS,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,sBAAA,g/BASlDG,KAAK,IAAIV,iBAAiB,CAACC,kBAAkB,CAACU,OAAO,EAAEd,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC,EAejGH,KAAK,IAAIX,iBAAiB,CAACE,kBAAkB,CAACU,OAAO,EAAEd,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC,EAWnGH,KAAK,IAAIZ,iBAAiB,CAACG,kBAAkB,CAACU,OAAO,EAAEd,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAAC,EAUnGX,WAAW,EAICQ,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,YAAY,EAAEF,KAAK,CAACG,KAAK,CAAC,EACxDH,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,EAClDV,SAAS,CAACW,KAAK,EAIjBJ,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,EAC/CH,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,EACvDV,SAAS,CAACY,MAAM,EAIlBL,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,EAI/CH,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC,EACnDH,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,EAIlDH,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAGlE;AAED,OAAO,MAAMG,sBAAsB,GAAGpB,MAAM,CAACS,GAAG,CAAAY,gBAAA,KAAAA,gBAAA,GAAAV,sBAAA,0LAMzBC,4BAA4B,EACpBE,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC,CAElF;AAED,OAAO,MAAMK,0BAA0B,GAAGtB,MAAM,CAACS,GAAG,CAAAc,gBAAA,KAAAA,gBAAA,GAAAZ,sBAAA,2KACtCG,KAAK,IAAKA,KAAK,CAACU,QAAQ,IAAI,UAAU,EACpCV,KAAK,IAAIb,MAAM,CAACe,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC,EAE1Db,iBAAiB,CAACC,kBAAkB,CAACU,OAAO,EAAE,IAAI,CAAC,EAGvCD,KAAK,IAAKA,KAAK,CAACU,QAAQ,IAAI,WAAW,EACjDrB,iBAAiB,CAACE,kBAAkB,CAACU,OAAO,EAAE,IAAI,CAAC,EAIzCD,KAAK,IAAKA,KAAK,CAACU,QAAQ,IAAI,WAAW,EACjDtB,iBAAiB,CAACG,kBAAkB,CAACU,OAAO,EAAE,IAAI,CAAC,CAGxD","ignoreList":[]}
+{"version":3,"file":"styles.js","names":["styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","focusStyles","Z_INDEXES","AccordionMenuWrapper","div","AccordionItemHeaderContainer","props","Regular","getColor","theme","hover","active","AccordionItemContainer","AccordionItemBodyContainer","$padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport {\r\n  COLORS,\r\n  ComponentLStyling,\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  focusStyles\r\n} from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nexport const AccordionMenuWrapper = styled.div`\r\n  min-width: 320px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n`;\r\n\r\n\r\n\r\nexport const AccordionItemHeaderContainer = styled.div`\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  cursor: pointer;\r\n  outline: none;\r\n  box-sizing: border-box;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  div:last-child {\r\n    margin-left: auto;\r\n  }\r\n\r\n  padding: 0 16px;\r\n  min-height: 48px;\r\n  \r\n  svg {\r\n    width: 20px;\r\n    height: 20px;\r\n  }\r\n  \r\n  .medium & {\r\n    ${props => ComponentMStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 24px;\r\n    min-height: 56px;\r\n\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  .large & {\r\n    ${props => ComponentLStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n    padding: 0 32px;\r\n    min-height: 64px;\r\n    svg {\r\n      width: 24px;\r\n      height: 24px;\r\n    }\r\n  }\r\n\r\n  &:focus:not(:active) {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    z-index: ${Z_INDEXES.hover};\r\n  }\r\n\r\n  &:active {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.active {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.disabled {\r\n    background: ${props => COLORS.getColor('white', props.theme)}!important;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    cursor: not-allowed;\r\n    pointer-events: none;\r\n    svg {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)}!important;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const AccordionItemContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  \r\n  &:not(:last-child) ${AccordionItemHeaderContainer}:not(.active) {\r\n    border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n`;\r\n\r\nexport const AccordionItemBodyContainer = styled.div<{ $padding?: string }>`\r\n  padding: ${(props) => props.$padding || '8px 16px'};\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  \r\n  ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n  \r\n  .medium & {\r\n    padding: ${(props) => props.$padding || '12px 24px'};\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n  \r\n  .large & {\r\n    padding: ${(props) => props.$padding || '14px 32px'};\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n  }\r\n\r\n`;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/AuthPage/AuthPage.cjs

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.AuthPageWrapper = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
 var _ScreenSetsContainer = _interopRequireDefault(require("./ScreenSetsContainer"));
@@ -14,12 +13,30 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _Panel = require("../Panel");
 var _styles = require("../styles");
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-const AuthPageWrapper = exports.AuthPageWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  height: 100%;\n\n  .panel {\n    flex: 1;\n    display: none;\n  }\n\n  ", " {\n    .panel {\n      display: flex;\n    }\n  }\n\n  &.reverse {\n    flex-direction: row-reverse;\n  }\n"])), _styles.BREAKPOINTS.MEDIUM);
+const AuthPageWrapper = exports.AuthPageWrapper = _styledComponents.default.div`
+  display: flex;
+  align-items: center;
+  height: 100%;
+
+  .panel {
+    flex: 1;
+    display: none;
+  }
+
+  ${_styles.BREAKPOINTS.MEDIUM} {
+    .panel {
+      display: flex;
+    }
+  }
+
+  &.reverse {
+    flex-direction: row-reverse;
+  }
+`;
 const AuthPage = _ref => {
   let {
     screenSetsContainerId,
@@ -30,7 +47,7 @@ const AuthPage = _ref => {
     className: order,
     children: [panel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Panel.Panel, _objectSpread(_objectSpread({}, panel), {}, {
       order: order,
-      className: "panel ".concat(panel.className || '')
+      className: `panel ${panel.className || ''}`
     })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScreenSetsContainer.default, {
       id: screenSetsContainerId,
       $centerContents: !panel

package/dist/AuthPage/AuthPage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AuthPage.cjs","names":["React","_interopRequireWildcard","require","_ScreenSetsContainer","_interopRequireDefault","_styledComponents","_Panel","_styles","_jsxRuntime","_templateObject","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","AuthPageWrapper","exports","styled","div","_taggedTemplateLiteral2","BREAKPOINTS","MEDIUM","AuthPage","_ref","screenSetsContainerId","panel","order","jsxs","className","children","jsx","Panel","concat","id","$centerContents","propTypes","_propTypes","oneOf","string","isRequired","_default"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport ScreenSetsContainer from './ScreenSetsContainer';\r\nimport styled from \"styled-components\";\r\nimport {Panel, PanelProps} from \"../Panel\";\r\nimport {BREAKPOINTS} from \"../styles\";\r\n\r\n\r\nexport const AuthPageWrapper = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  height: 100%;\r\n\r\n  .panel {\r\n    flex: 1;\r\n    display: none;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    .panel {\r\n      display: flex;\r\n    }\r\n  }\r\n\r\n  &.reverse {\r\n    flex-direction: row-reverse;\r\n  }\r\n`;\r\n\r\nexport type AuthPageProps = {\r\n  panel?: PanelProps;\r\n  order?: 'default' | 'reverse';\r\n  screenSetsContainerId: string;\r\n};\r\n\r\nconst AuthPage = ({\r\n                    screenSetsContainerId,\r\n                    panel,\r\n                    order = 'default'\r\n                  }: AuthPageProps) => {\r\n  return (\r\n    <AuthPageWrapper className={order}>\r\n      {\r\n        panel && <Panel {...panel} order={order} className={`panel ${panel.className || ''}`}/>\r\n      }\r\n      <ScreenSetsContainer id={screenSetsContainerId} $centerContents={!panel}/>\r\n    </AuthPageWrapper>\r\n  );\r\n};\r\n\r\nexport default AuthPage;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"AuthPage.cjs","names":["React","_interopRequireWildcard","require","_ScreenSetsContainer","_interopRequireDefault","_styledComponents","_Panel","_styles","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","AuthPageWrapper","exports","styled","div","BREAKPOINTS","MEDIUM","AuthPage","_ref","screenSetsContainerId","panel","order","jsxs","className","children","jsx","Panel","id","$centerContents","propTypes","_propTypes","oneOf","string","isRequired","_default"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport ScreenSetsContainer from './ScreenSetsContainer';\r\nimport styled from \"styled-components\";\r\nimport {Panel, PanelProps} from \"../Panel\";\r\nimport {BREAKPOINTS} from \"../styles\";\r\n\r\n\r\nexport const AuthPageWrapper = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  height: 100%;\r\n\r\n  .panel {\r\n    flex: 1;\r\n    display: none;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    .panel {\r\n      display: flex;\r\n    }\r\n  }\r\n\r\n  &.reverse {\r\n    flex-direction: row-reverse;\r\n  }\r\n`;\r\n\r\nexport type AuthPageProps = {\r\n  panel?: PanelProps;\r\n  order?: 'default' | 'reverse';\r\n  screenSetsContainerId: string;\r\n};\r\n\r\nconst AuthPage = ({\r\n                    screenSetsContainerId,\r\n                    panel,\r\n                    order = 'default'\r\n                  }: AuthPageProps) => {\r\n  return (\r\n    <AuthPageWrapper className={order}>\r\n      {\r\n        panel && <Panel {...panel} order={order} className={`panel ${panel.className || ''}`}/>\r\n      }\r\n      <ScreenSetsContainer id={screenSetsContainerId} $centerContents={!panel}/>\r\n    </AuthPageWrapper>\r\n  );\r\n};\r\n\r\nexport default AuthPage;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/AuthPage/AuthPage.d.ts

@@ -1,10 +1,10 @@
-import * as React from 'react';
-import { PanelProps } from "../Panel";
-export declare const AuthPageWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export type AuthPageProps = {
-    panel?: PanelProps;
-    order?: 'default' | 'reverse';
-    screenSetsContainerId: string;
-};
-declare const AuthPage: ({ screenSetsContainerId, panel, order }: AuthPageProps) => React.JSX.Element;
-export default AuthPage;
+import * as React from 'react';
+import { PanelProps } from "../Panel";
+export declare const AuthPageWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export type AuthPageProps = {
+    panel?: PanelProps;
+    order?: 'default' | 'reverse';
+    screenSetsContainerId: string;
+};
+declare const AuthPage: ({ screenSetsContainerId, panel, order }: AuthPageProps) => React.JSX.Element;
+export default AuthPage;

package/dist/AuthPage/AuthPage.js

@@ -1,7 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
-var _templateObject;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import * as React from 'react';
@@ -10,7 +8,26 @@ import styled from "styled-components";
 import { Panel } from "../Panel";
 import { BREAKPOINTS } from "../styles";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const AuthPageWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  height: 100%;\n\n  .panel {\n    flex: 1;\n    display: none;\n  }\n\n  ", " {\n    .panel {\n      display: flex;\n    }\n  }\n\n  &.reverse {\n    flex-direction: row-reverse;\n  }\n"])), BREAKPOINTS.MEDIUM);
+export const AuthPageWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  height: 100%;
+
+  .panel {
+    flex: 1;
+    display: none;
+  }
+
+  ${BREAKPOINTS.MEDIUM} {
+    .panel {
+      display: flex;
+    }
+  }
+
+  &.reverse {
+    flex-direction: row-reverse;
+  }
+`;
 const AuthPage = _ref => {
   let {
     screenSetsContainerId,
@@ -21,7 +38,7 @@ const AuthPage = _ref => {
     className: order,
     children: [panel && /*#__PURE__*/_jsx(Panel, _objectSpread(_objectSpread({}, panel), {}, {
       order: order,
-      className: "panel ".concat(panel.className || '')
+      className: `panel ${panel.className || ''}`
     })), /*#__PURE__*/_jsx(ScreenSetsContainer, {
       id: screenSetsContainerId,
       $centerContents: !panel

package/dist/AuthPage/AuthPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuthPage.js","names":["React","ScreenSetsContainer","styled","Panel","BREAKPOINTS","jsx","_jsx","jsxs","_jsxs","AuthPageWrapper","div","_templateObject","_taggedTemplateLiteral","MEDIUM","AuthPage","_ref","screenSetsContainerId","panel","order","className","children","_objectSpread","concat","id","$centerContents","propTypes","_pt","oneOf","string","isRequired"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport ScreenSetsContainer from './ScreenSetsContainer';\r\nimport styled from \"styled-components\";\r\nimport {Panel, PanelProps} from \"../Panel\";\r\nimport {BREAKPOINTS} from \"../styles\";\r\n\r\n\r\nexport const AuthPageWrapper = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  height: 100%;\r\n\r\n  .panel {\r\n    flex: 1;\r\n    display: none;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    .panel {\r\n      display: flex;\r\n    }\r\n  }\r\n\r\n  &.reverse {\r\n    flex-direction: row-reverse;\r\n  }\r\n`;\r\n\r\nexport type AuthPageProps = {\r\n  panel?: PanelProps;\r\n  order?: 'default' | 'reverse';\r\n  screenSetsContainerId: string;\r\n};\r\n\r\nconst AuthPage = ({\r\n                    screenSetsContainerId,\r\n                    panel,\r\n                    order = 'default'\r\n                  }: AuthPageProps) => {\r\n  return (\r\n    <AuthPageWrapper className={order}>\r\n      {\r\n        panel && <Panel {...panel} order={order} className={`panel ${panel.className || ''}`}/>\r\n      }\r\n      <ScreenSetsContainer id={screenSetsContainerId} $centerContents={!panel}/>\r\n    </AuthPageWrapper>\r\n  );\r\n};\r\n\r\nexport default AuthPage;\r\n"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,mBAAmB,MAAM,uBAAuB;AACvD,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,KAAK,QAAmB,UAAU;AAC1C,SAAQC,WAAW,QAAO,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGtC,OAAO,MAAMC,eAAe,GAAGP,MAAM,CAACQ,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,+OAUrCR,WAAW,CAACS,MAAM,CASrB;AAQD,MAAMC,QAAQ,GAAGC,IAAA,IAIsB;EAAA,IAJrB;IACEC,qBAAqB;IACrBC,KAAK;IACLC,KAAK,GAAG;EACK,CAAC,GAAAH,IAAA;EAChC,oBACEP,KAAA,CAACC,eAAe;IAACU,SAAS,EAAED,KAAM;IAAAE,QAAA,GAE9BH,KAAK,iBAAIX,IAAA,CAACH,KAAK,EAAAkB,aAAA,CAAAA,aAAA,KAAKJ,KAAK;MAAEC,KAAK,EAAEA,KAAM;MAACC,SAAS,WAAAG,MAAA,CAAWL,KAAK,CAACE,SAAS,IAAI,EAAE;IAAG,EAAC,CAAC,eAEzFb,IAAA,CAACL,mBAAmB;MAACsB,EAAE,EAAEP,qBAAsB;MAACQ,eAAe,EAAE,CAACP;IAAM,CAAC,CAAC;EAAA,CAC3D,CAAC;AAEtB,CAAC;AAACH,QAAA,CAAAW,SAAA;EAjBAP,KAAK,EAAAQ,GAAA,CAAAC,KAAA,EAAG,SAAS,EAAG,SAAS;EAC7BX,qBAAqB,EAAAU,GAAA,CAAAE,MAAA,CAAAC;AAAA;AAkBvB,eAAef,QAAQ","ignoreList":[]}
+{"version":3,"file":"AuthPage.js","names":["React","ScreenSetsContainer","styled","Panel","BREAKPOINTS","jsx","_jsx","jsxs","_jsxs","AuthPageWrapper","div","MEDIUM","AuthPage","_ref","screenSetsContainerId","panel","order","className","children","_objectSpread","id","$centerContents","propTypes","_pt","oneOf","string","isRequired"],"sources":["../../src/AuthPage/AuthPage.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport ScreenSetsContainer from './ScreenSetsContainer';\r\nimport styled from \"styled-components\";\r\nimport {Panel, PanelProps} from \"../Panel\";\r\nimport {BREAKPOINTS} from \"../styles\";\r\n\r\n\r\nexport const AuthPageWrapper = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  height: 100%;\r\n\r\n  .panel {\r\n    flex: 1;\r\n    display: none;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    .panel {\r\n      display: flex;\r\n    }\r\n  }\r\n\r\n  &.reverse {\r\n    flex-direction: row-reverse;\r\n  }\r\n`;\r\n\r\nexport type AuthPageProps = {\r\n  panel?: PanelProps;\r\n  order?: 'default' | 'reverse';\r\n  screenSetsContainerId: string;\r\n};\r\n\r\nconst AuthPage = ({\r\n                    screenSetsContainerId,\r\n                    panel,\r\n                    order = 'default'\r\n                  }: AuthPageProps) => {\r\n  return (\r\n    <AuthPageWrapper className={order}>\r\n      {\r\n        panel && <Panel {...panel} order={order} className={`panel ${panel.className || ''}`}/>\r\n      }\r\n      <ScreenSetsContainer id={screenSetsContainerId} $centerContents={!panel}/>\r\n    </AuthPageWrapper>\r\n  );\r\n};\r\n\r\nexport default AuthPage;\r\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,mBAAmB,MAAM,uBAAuB;AACvD,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,KAAK,QAAmB,UAAU;AAC1C,SAAQC,WAAW,QAAO,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGtC,OAAO,MAAMC,eAAe,GAAGP,MAAM,CAACQ,GAAG;AACzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIN,WAAW,CAACO,MAAM;AACtB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAQD,MAAMC,QAAQ,GAAGC,IAAA,IAIsB;EAAA,IAJrB;IACEC,qBAAqB;IACrBC,KAAK;IACLC,KAAK,GAAG;EACK,CAAC,GAAAH,IAAA;EAChC,oBACEL,KAAA,CAACC,eAAe;IAACQ,SAAS,EAAED,KAAM;IAAAE,QAAA,GAE9BH,KAAK,iBAAIT,IAAA,CAACH,KAAK,EAAAgB,aAAA,CAAAA,aAAA,KAAKJ,KAAK;MAAEC,KAAK,EAAEA,KAAM;MAACC,SAAS,EAAE,SAASF,KAAK,CAACE,SAAS,IAAI,EAAE;IAAG,EAAC,CAAC,eAEzFX,IAAA,CAACL,mBAAmB;MAACmB,EAAE,EAAEN,qBAAsB;MAACO,eAAe,EAAE,CAACN;IAAM,CAAC,CAAC;EAAA,CAC3D,CAAC;AAEtB,CAAC;AAACH,QAAA,CAAAU,SAAA;EAjBAN,KAAK,EAAAO,GAAA,CAAAC,KAAA,EAAG,SAAS,EAAG,SAAS;EAC7BV,qBAAqB,EAAAS,GAAA,CAAAE,MAAA,CAAAC;AAAA;AAkBvB,eAAed,QAAQ","ignoreList":[]}

package/dist/AuthPage/ScreenSetsContainer.cjs

@@ -5,10 +5,42 @@ 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;
-const ScreenSetsContainer = _styledComponents.default.section(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  box-sizing: border-box;\n\n  padding: 8px;\n  width: 100%;\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    padding: 24px;\n    width: 50%;\n\n    .gigya-screen {\n      margin: 0;\n      padding: 36px 25px !important;\n    }\n  }\n\n  ", " {\n    .gigya-screen {\n      max-width: 550px;\n    }\n  }\n"])), props => props.$centerContents ? 'center' : 'unset', _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
+const ScreenSetsContainer = _styledComponents.default.section`
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  box-sizing: border-box;
+
+  padding: 8px;
+  width: 100%;
+  align-items: ${props => props.$centerContents ? 'center' : 'unset'};
+
+  .gigya-screen-caption {
+    display: none;
+  }
+
+  .gigya-screen {
+    max-width: 100%;
+    margin: auto;
+  }
+
+  ${_styles.BREAKPOINTS.MEDIUM} {
+    padding: 24px;
+    width: 50%;
+
+    .gigya-screen {
+      margin: 0;
+      padding: 36px 25px !important;
+    }
+  }
+
+  ${_styles.BREAKPOINTS.LARGE} {
+    .gigya-screen {
+      max-width: 550px;
+    }
+  }
+`;
 var _default = exports.default = ScreenSetsContainer;
 //# sourceMappingURL=ScreenSetsContainer.cjs.map

package/dist/AuthPage/ScreenSetsContainer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenSetsContainer.cjs","names":["_styledComponents","_interopRequireDefault","require","_styles","_templateObject","ScreenSetsContainer","styled","section","_taggedTemplateLiteral2","default","props","$centerContents","BREAKPOINTS","MEDIUM","LARGE","_default","exports"],"sources":["../../src/AuthPage/ScreenSetsContainer.tsx"],"sourcesContent":["import styled from 'styled-components';\r\nimport {BREAKPOINTS} from '../styles';\r\n\r\nconst ScreenSetsContainer = styled.section<{ $centerContents: boolean }>`\r\n  display: flex;\r\n  flex-direction: column;\r\n  flex: 1;\r\n  box-sizing: border-box;\r\n\r\n  padding: 8px;\r\n  width: 100%;\r\n  align-items: ${props => (props.$centerContents ? 'center' : 'unset')};\r\n\r\n  .gigya-screen-caption {\r\n    display: none;\r\n  }\r\n\r\n  .gigya-screen {\r\n    max-width: 100%;\r\n    margin: auto;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    padding: 24px;\r\n    width: 50%;\r\n\r\n    .gigya-screen {\r\n      margin: 0;\r\n      padding: 36px 25px !important;\r\n    }\r\n  }\r\n\r\n  ${BREAKPOINTS.LARGE} {\r\n    .gigya-screen {\r\n      max-width: 550px;\r\n    }\r\n  }\r\n`;\r\n\r\nexport default ScreenSetsContainer;\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAAsC,IAAAE,eAAA;AAEtC,MAAMC,mBAAmB,GAAGC,yBAAM,CAACC,OAAO,CAAAH,eAAA,KAAAA,eAAA,OAAAI,uBAAA,CAAAC,OAAA,oeAQzBC,KAAK,IAAKA,KAAK,CAACC,eAAe,GAAG,QAAQ,GAAG,OAAQ,EAWlEC,mBAAW,CAACC,MAAM,EAUlBD,mBAAW,CAACE,KAAK,CAKpB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAP,OAAA,GAEaJ,mBAAmB","ignoreList":[]}
+{"version":3,"file":"ScreenSetsContainer.cjs","names":["_styledComponents","_interopRequireDefault","require","_styles","ScreenSetsContainer","styled","section","props","$centerContents","BREAKPOINTS","MEDIUM","LARGE","_default","exports","default"],"sources":["../../src/AuthPage/ScreenSetsContainer.tsx"],"sourcesContent":["import styled from 'styled-components';\r\nimport {BREAKPOINTS} from '../styles';\r\n\r\nconst ScreenSetsContainer = styled.section<{ $centerContents: boolean }>`\r\n  display: flex;\r\n  flex-direction: column;\r\n  flex: 1;\r\n  box-sizing: border-box;\r\n\r\n  padding: 8px;\r\n  width: 100%;\r\n  align-items: ${props => (props.$centerContents ? 'center' : 'unset')};\r\n\r\n  .gigya-screen-caption {\r\n    display: none;\r\n  }\r\n\r\n  .gigya-screen {\r\n    max-width: 100%;\r\n    margin: auto;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    padding: 24px;\r\n    width: 50%;\r\n\r\n    .gigya-screen {\r\n      margin: 0;\r\n      padding: 36px 25px !important;\r\n    }\r\n  }\r\n\r\n  ${BREAKPOINTS.LARGE} {\r\n    .gigya-screen {\r\n      max-width: 550px;\r\n    }\r\n  }\r\n`;\r\n\r\nexport default ScreenSetsContainer;\r\n"],"mappings":";;;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAEA,MAAME,mBAAmB,GAAGC,yBAAM,CAACC,OAAqC;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiBC,KAAK,IAAKA,KAAK,CAACC,eAAe,GAAG,QAAQ,GAAG,OAAQ;AACtE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIC,mBAAW,CAACC,MAAM;AACtB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAID,mBAAW,CAACE,KAAK;AACrB;AACA;AACA;AACA;AACA,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEaV,mBAAmB","ignoreList":[]}

package/dist/AuthPage/ScreenSetsContainer.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-declare const ScreenSetsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {
-    $centerContents: boolean;
-}>> & string;
-export default ScreenSetsContainer;
+declare const ScreenSetsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {
+    $centerContents: boolean;
+}>> & string;
+export default ScreenSetsContainer;

package/dist/AuthPage/ScreenSetsContainer.js

@@ -1,7 +1,39 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-var _templateObject;
 import styled from 'styled-components';
 import { BREAKPOINTS } from '../styles';
-const ScreenSetsContainer = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  box-sizing: border-box;\n\n  padding: 8px;\n  width: 100%;\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    padding: 24px;\n    width: 50%;\n\n    .gigya-screen {\n      margin: 0;\n      padding: 36px 25px !important;\n    }\n  }\n\n  ", " {\n    .gigya-screen {\n      max-width: 550px;\n    }\n  }\n"])), props => props.$centerContents ? 'center' : 'unset', BREAKPOINTS.MEDIUM, BREAKPOINTS.LARGE);
+const ScreenSetsContainer = styled.section`
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  box-sizing: border-box;
+
+  padding: 8px;
+  width: 100%;
+  align-items: ${props => props.$centerContents ? 'center' : 'unset'};
+
+  .gigya-screen-caption {
+    display: none;
+  }
+
+  .gigya-screen {
+    max-width: 100%;
+    margin: auto;
+  }
+
+  ${BREAKPOINTS.MEDIUM} {
+    padding: 24px;
+    width: 50%;
+
+    .gigya-screen {
+      margin: 0;
+      padding: 36px 25px !important;
+    }
+  }
+
+  ${BREAKPOINTS.LARGE} {
+    .gigya-screen {
+      max-width: 550px;
+    }
+  }
+`;
 export default ScreenSetsContainer;
 //# sourceMappingURL=ScreenSetsContainer.js.map