@mvf/external-components 3.37.0 → 3.38.0

package/Experiments/CRO-710/Atoms/Text/makeTextStyling.js

@@ -0,0 +1,257 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("@emotion/react");
+/**
+ * getTickIconSvg:
+ * Generates a data URL for an SVG tick icon with a customizable fill color.
+ *
+ * @param {string} color - The color to be used for the fill of the SVG tick icon.
+ * @returns {string} A base64-encoded data URL representing the tick icon SVG, which can be used as a background image in CSS.
+ *
+ * The function creates an SVG string representing a tick (checkmark) icon, with the fill color dynamically set based on the input `color` parameter.
+ * The SVG is then converted to a base64-encoded data URL that can be used in CSS as a background image.
+ */
+var getTickIconSvg = function (color) {
+    var tickIconSvg = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"".concat(color, "\">\n      <path d=\"M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z\"/>\n    </svg>");
+    var tickIconSvgBase64 = btoa(tickIconSvg);
+    return "url(data:image/svg+xml;base64,".concat(tickIconSvgBase64, ")");
+};
+var makeTextStyling = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+    var variant = _a.variant;
+    var _q = (0, react_1.useTheme)(), mvf = _q.mvf, breakpoints = _q.breakpoints;
+    var lineHeight = mvf.lineHeight, palette = mvf.palette, fontSize = mvf.fontSize, typography = mvf.typography, spacing = mvf.spacing;
+    var weight = typography.weight;
+    return (0, react_1.css)(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({ fontFamily: typography.fontFamily, letterSpacing: 'inherit' }, (variant === 'footer' && (_b = {
+            fontSize: fontSize.tiny
+        },
+        _b[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.little,
+        },
+        _b.color = palette.text.secondaryTextColor,
+        _b.textAlign = 'left',
+        _b.lineHeight = lineHeight.small,
+        _b))), (variant === 'header' && (_c = {
+            fontSize: fontSize.small
+        },
+        _c[breakpoints.up('mobileMedium')] = {
+            fontSize: fontSize.compact,
+        },
+        _c[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.medium,
+        },
+        _c[breakpoints.up('tabletMedium')] = {
+            fontSize: fontSize.swoll,
+        },
+        _c[breakpoints.up('desktopSmall')] = {
+            fontSize: fontSize.large,
+        },
+        _c[breakpoints.up('desktopMedium')] = {
+            fontSize: fontSize.big,
+        },
+        _c.fontWeight = typography.weight.thick,
+        _c))), (variant === 'summary' && (_d = {
+            fontSize: fontSize.mini
+        },
+        _d[breakpoints.up('mobileMedium')] = {
+            fontSize: fontSize.small,
+        },
+        _d[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.compact,
+        },
+        _d.lineHeight = lineHeight.small,
+        _d.textAlign = 'left',
+        _d.whiteSpace = 'pre-line',
+        _d['& ol'] = {
+            counterReset: 'li',
+            listStyleType: 'none',
+            paddingLeft: '0px',
+            marginTop: '0px',
+            '& li': {
+                position: 'relative',
+                padding: '20px 0 0 35px',
+                '&::before': {
+                    counterIncrement: 'li',
+                    content: 'counter(li)',
+                    border: "2px solid ".concat(palette.component.answerSelectedColor),
+                    fontWeight: 'bold',
+                    borderRadius: '50%',
+                    position: 'absolute',
+                    height: '20px',
+                    width: '20px',
+                    left: '0',
+                    top: '18px',
+                    textAlign: 'center',
+                    color: palette.component.answerSelectedColor,
+                },
+            },
+        },
+        _d))), (variant === 'note' && (_e = {
+            fontSize: fontSize.little
+        },
+        _e[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.mini,
+        },
+        _e[breakpoints.up('desktopSmall')] = {
+            fontSize: fontSize.small,
+        },
+        _e.backgroundColor = palette.background.secondaryBackgroundColor,
+        _e.color = palette.text.secondaryTextColor,
+        _e.paddingLeft = spacing.medium,
+        _e.paddingRight = spacing.medium,
+        _e.paddingTop = spacing.tiny,
+        _e.paddingBottom = spacing.tiny,
+        _e.borderRadius = 4,
+        _e))), (variant === 'question' && (_f = {
+            fontSize: fontSize.medium
+        },
+        _f[breakpoints.up('mobileMedium')] = {
+            fontSize: fontSize.hefty,
+        },
+        _f[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.swoll,
+        },
+        _f[breakpoints.up('tabletMedium')] = {
+            fontSize: fontSize.large,
+        },
+        _f[breakpoints.up('desktopSmall')] = {
+            fontSize: fontSize.big,
+        },
+        _f[breakpoints.up('desktopMedium')] = {
+            fontSize: fontSize.huge,
+        },
+        _f.fontWeight = typography.weight.thick,
+        _f))), ((variant === 'listItem' || variant === 'listItemWithSubtext') && __assign((_g = { wordBreak: 'break-word', fontSize: fontSize.mini }, _g[breakpoints.up('mobileMedium')] = {
+        fontSize: fontSize.small,
+    }, _g[breakpoints.up('tabletSmall')] = {
+        fontSize: fontSize.compact,
+    }, _g.lineHeight = lineHeight.small, _g.fontWeight = typography.weight.thick, _g), (variant === 'listItem' && {
+        padding: spacing.tiny,
+    })))), (variant === 'listItemSubtext' && (_h = {
+            fontSize: fontSize.little
+        },
+        _h[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.mini,
+        },
+        _h[breakpoints.up('desktopMedium')] = {
+            fontSize: fontSize.small,
+        },
+        _h))), (variant === 'tileItem' && (_j = {
+            fontSize: fontSize.mini,
+            wordBreak: 'break-word'
+        },
+        _j[breakpoints.up('mobileMedium')] = {
+            fontSize: fontSize.small,
+        },
+        _j[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.compact,
+        },
+        _j[breakpoints.up('desktopMedium')] = {
+            fontSize: fontSize.medium,
+        },
+        _j.textAlign = 'center',
+        _j.margin = spacing.tiny,
+        _j.lineHeight = lineHeight.small,
+        _j.wordWrap = 'break-word',
+        _j.fontWeight = typography.weight.thick,
+        _j))), (variant === 'tileItemSubtext' && (_k = {
+            fontSize: fontSize.tiny,
+            wordBreak: 'break-word'
+        },
+        _k[breakpoints.up('mobileMedium')] = {
+            fontSize: fontSize.little,
+        },
+        _k[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.mini,
+        },
+        _k[breakpoints.up('desktopMedium')] = {
+            fontSize: fontSize.small,
+        },
+        _k.textAlign = 'center',
+        _k.lineHeight = lineHeight.small,
+        _k.wordWrap = 'break-word',
+        _k.fontWeight = typography.weight.medium,
+        _k))), (variant === 'text' && (_l = {
+            fontSize: fontSize.mini
+        },
+        _l[breakpoints.up('mobileMedium')] = {
+            fontSize: fontSize.small,
+        },
+        _l[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.compact,
+        },
+        _l.color = palette.text.secondaryTextColor,
+        _l.lineHeight = lineHeight.small,
+        _l))), (variant === 'contentWithList' && (_m = {
+            fontSize: fontSize.little
+        },
+        _m[breakpoints.up('tabletSmall')] = {
+            fontSize: fontSize.mini,
+        },
+        _m[breakpoints.up('desktopSmall')] = {
+            fontSize: fontSize.small,
+        },
+        _m.backgroundColor = palette.background.secondaryBackgroundColor,
+        _m.color = palette.text.secondaryTextColor,
+        _m.paddingLeft = spacing.medium,
+        _m.paddingRight = spacing.medium,
+        _m.paddingTop = spacing.tiny,
+        _m.paddingBottom = spacing.tiny,
+        _m.borderRadius = 4,
+        _m.textAlign = 'center',
+        _m['& span, & ol, & ul'] = {
+            backgroundColor: 'inherit',
+            display: 'block',
+        },
+        _m['& ol, & ul'] = {
+            paddingLeft: '0px',
+            marginTop: '0px',
+            listStylePosition: 'inside',
+        },
+        _m['& li'] = {
+            margin: '0',
+        },
+        _m.margin = 0,
+        _m.padding = 0,
+        _m))), (variant === 'tickedList' && {
+        color: palette.text.primaryTextColor,
+        fontSize: fontSize.medium,
+        fontWeight: weight.thick,
+        '& li': (_o = {
+                listStyleType: 'none',
+                paddingLeft: 33,
+                lineHeight: lineHeight.medium,
+                fontWeight: weight.medium,
+                fontSize: fontSize.compact
+            },
+            _o[breakpoints.up('tabletSmall')] = {
+                fontSize: fontSize.medium,
+                fontWeight: weight.thick,
+            },
+            _o.background = "".concat(getTickIconSvg(palette.component.answerSelectedColor), " no-repeat left 3px"),
+            _o.backgroundSize = '20px 20px',
+            _o),
+        '& ul': (_p = {
+                margin: '0 auto',
+                width: 'fit-content'
+            },
+            _p[breakpoints.up('tabletSmall')] = {
+                width: '100%',
+            },
+            _p.padding = 0,
+            _p),
+    })));
+};
+exports.default = makeTextStyling;
+//# sourceMappingURL=makeTextStyling.js.map

package/Experiments/CRO-710/Atoms/Text/makeTextStyling.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"makeTextStyling.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Atoms/Text/makeTextStyling.ts"],"names":[],"mappings":"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"}

package/Experiments/CRO-710/Molecules/NavBar/IComponentProps.d.ts

@@ -0,0 +1,12 @@
+interface IComponentProps {
+    buttonDisabled: boolean;
+    buttonLabel: string;
+    disabled: boolean;
+    loading: boolean;
+    onClickBack: () => void;
+    onClickContinue: () => void;
+    textOverflowHandling: 'none' | 'dynamicFontSize' | 'newline';
+    continueButtonHidden: boolean;
+    continueButtonShouldPulse?: boolean;
+}
+export default IComponentProps;

package/Experiments/CRO-710/Molecules/NavBar/IComponentProps.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=IComponentProps.js.map

package/Experiments/CRO-710/Molecules/NavBar/IComponentProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IComponentProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/IComponentProps.ts"],"names":[],"mappings":""}

package/Experiments/CRO-710/Molecules/NavBar/NavBar.d.ts

@@ -0,0 +1,7 @@
+import { FunctionComponentWithDefaultProps } from '../../../../Helpers/React/FunctionComponentWithDefaultProps';
+import defaultProps from './defaultProps';
+import IComponentProps from './IComponentProps';
+import WithExperimentName from '../../../../@types/WithExperimentName';
+export type NavBarType = FunctionComponentWithDefaultProps<WithExperimentName<IComponentProps>, typeof defaultProps>;
+declare const NavBar: NavBarType;
+export default NavBar;

package/Experiments/CRO-710/Molecules/NavBar/NavBar.js

@@ -0,0 +1,32 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+/** @jsxImportSource @emotion/react */
+var Box_1 = __importDefault(require("@mui/material/Box"));
+var KeyboardArrowLeft_1 = __importDefault(require("@mui/icons-material/KeyboardArrowLeft"));
+var Button_1 = __importDefault(require("../../Atoms/Button/Button"));
+var IconButton_1 = __importDefault(require("../../Atoms/IconButton/IconButton"));
+var defaultProps_1 = __importDefault(require("./defaultProps"));
+var makeNavBarStyles_1 = __importDefault(require("./makeNavBarStyles"));
+var NavBar = function (_a) {
+    var buttonDisabled = _a.buttonDisabled, buttonLabel = _a.buttonLabel, disabled = _a.disabled, loading = _a.loading, onClickBack = _a.onClickBack, onClickContinue = _a.onClickContinue, _b = _a.textOverflowHandling, textOverflowHandling = _b === void 0 ? 'none' : _b, continueButtonHidden = _a.continueButtonHidden, experimentName = _a.experimentName, continueButtonShouldPulse = _a.continueButtonShouldPulse;
+    var styles = (0, makeNavBarStyles_1.default)();
+    return ((0, jsx_runtime_1.jsxs)(Box_1.default, __assign({ css: styles.container }, { children: [(0, jsx_runtime_1.jsx)(Box_1.default, __assign({ css: styles.backButton }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.default, { disabled: disabled, icon: (0, jsx_runtime_1.jsx)(KeyboardArrowLeft_1.default, {}), onClick: onClickBack, dataTestId: "backcta", experimentName: experimentName }) })), (0, jsx_runtime_1.jsx)(Box_1.default, __assign({ css: styles.space }, { children: "\u00A0" })), (0, jsx_runtime_1.jsx)(Box_1.default, __assign({ css: styles.continueButton, sx: { display: continueButtonHidden ? 'none' : 'block' } }, { children: (0, jsx_runtime_1.jsx)(Button_1.default, { disabled: buttonDisabled, onClick: onClickContinue, label: buttonLabel, loading: loading, dataTestId: "continuecta", textOverflowHandling: textOverflowHandling, experimentName: experimentName, shouldPulse: continueButtonShouldPulse }) }))] })));
+};
+NavBar.defaultProps = defaultProps_1.default;
+exports.default = NavBar;
+//# sourceMappingURL=NavBar.js.map

package/Experiments/CRO-710/Molecules/NavBar/NavBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBar.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/NavBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,sCAAsC;AACtC,0DAAsC;AACtC,4FAAsE;AAEtE,qEAA+C;AAC/C,iFAA2D;AAC3D,gEAA0C;AAE1C,wEAAkD;AAQlD,IAAM,MAAM,GAAe,UAAC,EAW3B;QAVC,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,4BAA6B,EAA7B,oBAAoB,mBAAG,MAAM,KAAA,EAC7B,oBAAoB,0BAAA,EACpB,cAAc,oBAAA,EACd,yBAAyB,+BAAA;IAEzB,IAAM,MAAM,GAAG,IAAA,0BAAgB,GAAE,CAAC;IAClC,OAAO,CACL,wBAAC,aAAK,aAAC,GAAG,EAAE,MAAM,CAAC,SAAS,iBAC1B,uBAAC,aAAK,aAAC,GAAG,EAAE,MAAM,CAAC,UAAU,gBAC3B,uBAAC,oBAAU,IACT,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,uBAAC,2BAAiB,KAAG,EAC3B,OAAO,EAAE,WAAW,EACpB,UAAU,EAAC,SAAS,EACpB,cAAc,EAAE,cAAc,GAC9B,IACI,EACR,uBAAC,aAAK,aAAC,GAAG,EAAE,MAAM,CAAC,KAAK,4BAAgB,EACxC,uBAAC,aAAK,aACJ,GAAG,EAAE,MAAM,CAAC,cAAc,EAC1B,EAAE,EAAE,EAAE,OAAO,EAAE,oBAAoB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAE,gBAExD,uBAAC,gBAAM,IACL,QAAQ,EAAE,cAAc,EACxB,OAAO,EAAE,eAAe,EACxB,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAC,aAAa,EACxB,oBAAoB,EAAE,oBAAoB,EAC1C,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,yBAAyB,GACtC,IACI,KACF,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,YAAY,GAAG,sBAAY,CAAC;AAEnC,kBAAe,MAAM,CAAC"}

package/Experiments/CRO-710/Molecules/NavBar/NavBar.test.d.ts

@@ -0,0 +1 @@
+export {};

package/Experiments/CRO-710/Molecules/NavBar/NavBar.test.js

@@ -0,0 +1,36 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var renderWithProviders_1 = __importDefault(require("../../../../Helpers/React/renderWithProviders"));
+var NavBar_1 = __importDefault(require("./NavBar"));
+var react_1 = require("@testing-library/react");
+describe('<NavBar />', function () {
+    it('should display button component', function () {
+        var getByText = (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(NavBar_1.default, { buttonLabel: 'Continue', experimentName: "default" })).getByText;
+        expect(getByText('Continue')).toBeTruthy();
+    });
+});
+describe('<NavBar />', function () {
+    it('should display button component when a textOverflowHandling is passed', function () {
+        var getByText = (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(NavBar_1.default, { buttonLabel: 'Continue', textOverflowHandling: 'dynamicFontSize', experimentName: "default" })).getByText;
+        expect(getByText('Continue')).toBeTruthy();
+    });
+});
+describe('NavBar', function () {
+    describe('continueButtonHidden prop', function () {
+        it('should hide continue button when continueButtonHidden is true', function () {
+            (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(NavBar_1.default, { buttonLabel: "Continue", onClickBack: function () { }, onClickContinue: function () { }, continueButtonHidden: true, experimentName: "default" }));
+            var continueButton = react_1.screen.getByTestId('continuecta').parentElement;
+            expect(continueButton).toHaveStyle({ display: 'none' });
+        });
+        it('should show continue button when continueButtonHidden is false', function () {
+            (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(NavBar_1.default, { buttonLabel: "Continue", onClickBack: function () { }, onClickContinue: function () { }, continueButtonHidden: false, experimentName: "default" }));
+            var continueButton = react_1.screen.getByTestId('continuecta').parentElement;
+            expect(continueButton).toHaveStyle({ display: 'block' });
+        });
+    });
+});
+//# sourceMappingURL=NavBar.test.js.map

package/Experiments/CRO-710/Molecules/NavBar/NavBar.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBar.test.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/NavBar.test.tsx"],"names":[],"mappings":";;;;;;AAAA,sGAAgF;AAChF,oDAA8B;AAC9B,gDAAgD;AAEhD,QAAQ,CAAC,YAAY,EAAE;IACrB,EAAE,CAAC,iCAAiC,EAAE;QAC5B,IAAA,SAAS,GAAK,IAAA,6BAAmB,EACvC,uBAAC,gBAAM,IAAC,WAAW,EAAE,UAAU,EAAE,cAAc,EAAC,SAAS,GAAG,CAC7D,UAFgB,CAEf;QACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC7C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,YAAY,EAAE;IACrB,EAAE,CAAC,uEAAuE,EAAE;QAClE,IAAA,SAAS,GAAK,IAAA,6BAAmB,EACvC,uBAAC,gBAAM,IACL,WAAW,EAAE,UAAU,EACvB,oBAAoB,EAAE,iBAAiB,EACvC,cAAc,EAAC,SAAS,GACxB,CACH,UANgB,CAMf;QACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC7C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,QAAQ,EAAE;IACjB,QAAQ,CAAC,2BAA2B,EAAE;QACpC,EAAE,CAAC,+DAA+D,EAAE;YAClE,IAAA,6BAAmB,EACjB,uBAAC,gBAAM,IACL,WAAW,EAAC,UAAU,EACtB,WAAW,EAAE,cAAO,CAAC,EACrB,eAAe,EAAE,cAAO,CAAC,EACzB,oBAAoB,EAAE,IAAI,EAC1B,cAAc,EAAC,SAAS,GACxB,CACH,CAAC;YAEF,IAAM,cAAc,GAAG,cAAM,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,aAAa,CAAC;YACvE,MAAM,CAAC,cAAc,CAAC,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;QAC1D,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,gEAAgE,EAAE;YACnE,IAAA,6BAAmB,EACjB,uBAAC,gBAAM,IACL,WAAW,EAAC,UAAU,EACtB,WAAW,EAAE,cAAO,CAAC,EACrB,eAAe,EAAE,cAAO,CAAC,EACzB,oBAAoB,EAAE,KAAK,EAC3B,cAAc,EAAC,SAAS,GACxB,CACH,CAAC;YAEF,IAAM,cAAc,GAAG,cAAM,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,aAAa,CAAC;YACvE,MAAM,CAAC,cAAc,CAAC,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/Experiments/CRO-710/Molecules/NavBar/NavBarStory.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+type NavBarStoryType = React.FunctionComponent<{
+    disabled: boolean;
+    buttonDisabled: boolean;
+    buttonLabel: string;
+    buttonVariant: 'outlined' | 'contained';
+    loading: boolean;
+    textOverflowHandling: 'none' | 'dynamicFontSize' | 'newline';
+    continueButtonHidden: boolean;
+}>;
+declare const NavBarStory: NavBarStoryType;
+export default NavBarStory;

package/Experiments/CRO-710/Molecules/NavBar/NavBarStory.js

@@ -0,0 +1,25 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var addon_actions_1 = require("@storybook/addon-actions");
+var NavBar_1 = __importDefault(require("./NavBar"));
+var NavBarStory = function (_a) {
+    var disabled = _a.disabled, buttonDisabled = _a.buttonDisabled, buttonLabel = _a.buttonLabel, buttonVariant = _a.buttonVariant, loading = _a.loading, textOverflowHandling = _a.textOverflowHandling, continueButtonHidden = _a.continueButtonHidden;
+    return ((0, jsx_runtime_1.jsx)("div", __assign({ style: { maxWidth: '460px' } }, { children: (0, jsx_runtime_1.jsx)(NavBar_1.default, { disabled: disabled, onClickBack: (0, addon_actions_1.action)('Icon Button Clicked'), buttonDisabled: buttonDisabled, buttonLabel: buttonLabel, onClickContinue: (0, addon_actions_1.action)('Button Clicked'), buttonVariant: buttonVariant, loading: loading, textOverflowHandling: textOverflowHandling, continueButtonHidden: continueButtonHidden, experimentName: "default" }) })));
+};
+exports.default = NavBarStory;
+//# sourceMappingURL=NavBarStory.js.map

package/Experiments/CRO-710/Molecules/NavBar/NavBarStory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBarStory.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/NavBarStory.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,0DAAkD;AAClD,oDAA8B;AAY9B,IAAM,WAAW,GAAoB,UAAC,EAQrC;QAPC,QAAQ,cAAA,EACR,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,OAAO,aAAA,EACP,oBAAoB,0BAAA,EACpB,oBAAoB,0BAAA;IAChB,OAAA,CACJ,yCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,gBAC/B,uBAAC,gBAAM,IACL,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,IAAA,sBAAM,EAAC,qBAAqB,CAAC,EAC1C,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,IAAA,sBAAM,EAAC,gBAAgB,CAAC,EACzC,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,oBAAoB,EAAE,oBAAoB,EAC1C,oBAAoB,EAAE,oBAAoB,EAC1C,cAAc,EAAC,SAAS,GACxB,IACE,CACP;AAfK,CAeL,CAAC;AAEF,kBAAe,WAAW,CAAC"}

package/Experiments/CRO-710/Molecules/NavBar/defaultProps.d.ts

@@ -0,0 +1,11 @@
+declare const defaultProps: {
+    buttonDisabled: boolean;
+    buttonVariant: "outlined" | "contained";
+    disabled: boolean;
+    loading: boolean;
+    onClickBack: () => void;
+    onClickContinue: () => void;
+    textOverflowHandling: "none" | "dynamicFontSize" | "newline";
+    continueButtonHidden: boolean;
+};
+export default defaultProps;

package/Experiments/CRO-710/Molecules/NavBar/defaultProps.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var defaultProps = {
+    buttonDisabled: false,
+    buttonVariant: 'contained',
+    disabled: false,
+    loading: false,
+    onClickBack: function () {
+        // do nothing
+    },
+    onClickContinue: function () {
+        // do nothing
+    },
+    textOverflowHandling: 'none',
+    continueButtonHidden: false,
+};
+exports.default = defaultProps;
+//# sourceMappingURL=defaultProps.js.map

package/Experiments/CRO-710/Molecules/NavBar/defaultProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/defaultProps.ts"],"names":[],"mappings":";;AAAA,IAAM,YAAY,GAAG;IACnB,cAAc,EAAE,KAAgB;IAChC,aAAa,EAAE,WAAuC;IACtD,QAAQ,EAAE,KAAK;IACf,OAAO,EAAE,KAAK;IACd,WAAW,EAAE;QACX,aAAa;IACf,CAAC;IACD,eAAe,EAAE;QACf,aAAa;IACf,CAAC;IACD,oBAAoB,EAAE,MAAgD;IACtE,oBAAoB,EAAE,KAAK;CAC5B,CAAC;AAEF,kBAAe,YAAY,CAAC"}

package/Experiments/CRO-710/Molecules/NavBar/index.d.ts

@@ -0,0 +1 @@
+export { default } from './NavBar';

package/Experiments/CRO-710/Molecules/NavBar/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var NavBar_1 = require("./NavBar");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(NavBar_1).default; } });
+//# sourceMappingURL=index.js.map

package/Experiments/CRO-710/Molecules/NavBar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/index.ts"],"names":[],"mappings":";;;;;;AAAA,mCAAmC;AAA1B,kHAAA,OAAO,OAAA"}

package/Experiments/CRO-710/Molecules/NavBar/makeNavBarStyles.d.ts

@@ -0,0 +1,7 @@
+declare const makeNavBarStyles: () => {
+    container: import("@emotion/react").SerializedStyles;
+    space: import("@emotion/react").SerializedStyles;
+    continueButton: import("@emotion/react").SerializedStyles;
+    backButton: import("@emotion/react").SerializedStyles;
+};
+export default makeNavBarStyles;

package/Experiments/CRO-710/Molecules/NavBar/makeNavBarStyles.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("@emotion/react");
+var makeNavBarStyles = function () {
+    var _a, _b;
+    var theme = (0, react_1.useTheme)();
+    return {
+        container: (0, react_1.css)((_a = {
+                height: 45
+            },
+            _a[theme.breakpoints.up('tabletSmall')] = {
+                height: 55,
+            },
+            _a.width = '100%',
+            _a.display = 'flex',
+            _a.flexDirection = 'row',
+            _a)),
+        space: (0, react_1.css)({
+            width: theme.mvf.spacing.small,
+        }),
+        continueButton: (0, react_1.css)({
+            width: '100%',
+            height: '100%',
+            '& .MuiButtonBase-root': {
+                borderRadius: '12px',
+                boxShadow: theme.mvf.boxShadow.navigation.primary,
+                '@media (hover: hover)': {
+                    '&:hover': {
+                        boxShadow: theme.mvf.boxShadow.navigation.secondary,
+                    },
+                },
+            },
+        }),
+        backButton: (0, react_1.css)({
+            height: '100%',
+            '& .MuiButtonBase-root': (_b = {
+                    minWidth: '45px !important'
+                },
+                _b[theme.breakpoints.up('tabletSmall')] = {
+                    minWidth: '55px !important',
+                },
+                _b.borderRadius = '12px',
+                _b['@media (hover: hover)'] = {
+                    '&:hover': {
+                        boxShadow: theme.mvf.boxShadow.navigation.secondary,
+                    },
+                },
+                _b),
+        }),
+    };
+};
+exports.default = makeNavBarStyles;
+//# sourceMappingURL=makeNavBarStyles.js.map

package/Experiments/CRO-710/Molecules/NavBar/makeNavBarStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"makeNavBarStyles.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/NavBar/makeNavBarStyles.ts"],"names":[],"mappings":";;AAAA,wCAA+C;AAE/C,IAAM,gBAAgB,GAAG;;IACvB,IAAM,KAAK,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAEzB,OAAO;QACL,SAAS,EAAE,IAAA,WAAG;gBACZ,MAAM,EAAE,EAAE;;YACV,GAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,aAAa,CAAC,IAAG;gBACrC,MAAM,EAAE,EAAE;aACX;YACD,QAAK,GAAE,MAAM;YACb,UAAO,GAAE,MAAM;YACf,gBAAa,GAAE,KAAK;gBACpB;QAEF,KAAK,EAAE,IAAA,WAAG,EAAC;YACT,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK;SAC/B,CAAC;QAEF,cAAc,EAAE,IAAA,WAAG,EAAC;YAClB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,uBAAuB,EAAE;gBACvB,YAAY,EAAE,MAAM;gBACpB,SAAS,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO;gBACjD,uBAAuB,EAAE;oBACvB,SAAS,EAAE;wBACT,SAAS,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,UAAU,CAAC,SAAS;qBACpD;iBACF;aACF;SACF,CAAC;QAEF,UAAU,EAAE,IAAA,WAAG,EAAC;YACd,MAAM,EAAE,MAAM;YACd,uBAAuB;oBACrB,QAAQ,EAAE,iBAAiB;;gBAC3B,GAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,aAAa,CAAC,IAAG;oBACrC,QAAQ,EAAE,iBAAiB;iBAC5B;gBACD,eAAY,GAAE,MAAM;gBACpB,2BAAuB,GAAE;oBACvB,SAAS,EAAE;wBACT,SAAS,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,UAAU,CAAC,SAAS;qBACpD;iBACF;mBACF;SACF,CAAC;KACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,gBAAgB,CAAC"}

package/Experiments/CRO-710/Molecules/SupplierCard/ISupplierCardProps.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+export interface ISupplierCardCallbackParams {
+    id: string;
+    selected?: boolean;
+}
+interface ISupplierCardProps {
+    SupplierLogo?: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>;
+    badgeText?: string;
+    supplierName?: string;
+    CtaIcon?: React.ReactNode;
+    ctaText?: string;
+    dataTestId?: string;
+    id: string;
+    includeCta: boolean;
+    invertCtaColors: boolean;
+    onClick?: (item: ISupplierCardCallbackParams) => void;
+    onClickCta: () => void;
+    selected: boolean;
+    includeCheckbox: boolean;
+}
+export default ISupplierCardProps;

package/Experiments/CRO-710/Molecules/SupplierCard/ISupplierCardProps.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=ISupplierCardProps.js.map

package/Experiments/CRO-710/Molecules/SupplierCard/ISupplierCardProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ISupplierCardProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-710/Molecules/SupplierCard/ISupplierCardProps.ts"],"names":[],"mappings":""}

package/Experiments/CRO-710/Molecules/SupplierCard/SupplierCard.d.ts

@@ -0,0 +1,7 @@
+import { FunctionComponentWithDefaultProps } from '../../../../Helpers/React/FunctionComponentWithDefaultProps';
+import ISupplierCardProps from './ISupplierCardProps';
+import defaultProps from './defaultProps';
+import WithExperimentName from '../../../../@types/WithExperimentName';
+export type SupplierCardType = FunctionComponentWithDefaultProps<WithExperimentName<ISupplierCardProps>, typeof defaultProps>;
+declare const SupplierCard: SupplierCardType;
+export default SupplierCard;

package/Experiments/CRO-710/Molecules/SupplierCard/SupplierCard.js

@@ -0,0 +1,35 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+/** @jsxImportSource @emotion/react */
+var Button_1 = __importDefault(require("../../Atoms/Button/Button"));
+var CardButton_1 = __importDefault(require("../../Atoms/CardButton/CardButton"));
+var defaultProps_1 = __importDefault(require("./defaultProps"));
+var material_1 = require("@mui/material");
+var makeSupplierCardStyling_1 = __importDefault(require("./makeSupplierCardStyling"));
+var Text_1 = __importDefault(require("../../Atoms/Text/Text"));
+var InsetCheckbox_1 = __importDefault(require("../../Atoms/InsetCheckbox/InsetCheckbox"));
+var SupplierCard = function (_a) {
+    var SupplierLogo = _a.SupplierLogo, supplierName = _a.supplierName, badgeText = _a.badgeText, children = _a.children, CtaIcon = _a.CtaIcon, ctaText = _a.ctaText, dataTestId = _a.dataTestId, id = _a.id, includeCheckbox = _a.includeCheckbox, includeCta = _a.includeCta, invertCtaColors = _a.invertCtaColors, onClick = _a.onClick, onClickCta = _a.onClickCta, selected = _a.selected, experimentName = _a.experimentName;
+    var isClickable = typeof onClick === 'function';
+    var styles = (0, makeSupplierCardStyling_1.default)({ isClickable: isClickable });
+    var ctaBoxInUse = Boolean(includeCta || ctaText);
+    return ((0, jsx_runtime_1.jsx)("div", __assign({ css: styles.container }, { children: (0, jsx_runtime_1.jsxs)(CardButton_1.default, __assign({ onClick: isClickable ? function () { return onClick({ id: id, selected: selected }); } : undefined, "data-testid": dataTestId, selected: !!selected, experimentName: experimentName }, { children: [includeCheckbox && includeCta === false && ((0, jsx_runtime_1.jsx)(InsetCheckbox_1.default, { checked: selected, customCss: styles.topRightCheckbox, dataTestId: dataTestId ? "".concat(dataTestId, "-topRightCheckbox") : undefined, experimentName: experimentName })), badgeText && ((0, jsx_runtime_1.jsx)(material_1.Box, __assign({ css: styles.badge }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ css: styles.badgeText, "data-testid": dataTestId ? "".concat(dataTestId, "-badge") : undefined }, { children: badgeText })) }))), (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, direction: "row", alignItems: "center", css: styles.cardContainer }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12, tabletSmall: 3 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, alignItems: "center", justifyContent: "center", direction: "column", css: styles.logoGridContainer }, { children: [SupplierLogo && ((0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, css: styles.logoGridItem }, { children: SupplierLogo }))), supplierName && ((0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ id: "".concat(id, "-supplierName"), css: styles.supplierName, "data-testid": dataTestId ? "".concat(dataTestId, "-supplierName") : undefined }, { children: supplierName })) })))] })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12, tabletSmall: ctaBoxInUse || includeCheckbox ? 6 : 8 }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ container: true, direction: "column", justifyContent: "center", css: styles.textGridItem }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(Text_1.default, __assign({ id: "".concat(id, "-mainText"), align: "left", variant: "tickedList", "data-testid": dataTestId ? "".concat(dataTestId, "-mainText") : undefined, experimentName: experimentName }, { children: children })) })) })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12, tabletSmall: ctaBoxInUse || includeCheckbox ? 3 : 0 }, { children: includeCta ? ((0, jsx_runtime_1.jsx)(material_1.Box, __assign({ css: styles.buttonContainer }, { children: (0, jsx_runtime_1.jsx)(Button_1.default, { label: ctaText || '', onClick: onClickCta, selected: includeCheckbox ? selected : undefined, Icon: CtaIcon, invertColors: invertCtaColors, dataTestId: dataTestId ? "".concat(dataTestId, "-cta") : undefined, experimentName: experimentName }) }))) : ((0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, alignItems: "center", justifyContent: "center" }, { children: [includeCheckbox && ((0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(InsetCheckbox_1.default, { checked: selected, customCss: styles.rightCheckbox, dataTestId: dataTestId ? "".concat(dataTestId, "-rightCheckbox") : undefined, experimentName: experimentName }) }))), ctaText && ((0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ css: styles.rightText, "data-testid": dataTestId ? "".concat(dataTestId, "-rightText") : undefined }, { children: ctaText })) })))] }))) }))] }))] })) })));
+};
+SupplierCard.defaultProps = defaultProps_1.default;
+exports.default = SupplierCard;
+//# sourceMappingURL=SupplierCard.js.map