@mvf/external-components 3.21.4-dev.2 → 3.21.5-dev.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Experiments/CRO-582/Atoms/ProgressBar/IComponentProps.d.ts +7 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/IComponentProps.js +3 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/IComponentProps.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.d.ts +7 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.js +39 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.test.d.ts +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.test.js +22 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.test.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.d.ts +5 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.js +28 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.test.d.ts +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.test.js +40 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.test.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarStory.d.ts +7 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarStory.js +13 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarStory.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/defaultProps.d.ts +4 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/defaultProps.js +7 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/defaultProps.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/index.d.ts +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/index.js +9 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/index.js.map +1 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/makeProgressBarStyling.d.ts +7 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/makeProgressBarStyling.js +43 -0
- package/Experiments/CRO-582/Atoms/ProgressBar/makeProgressBarStyling.js.map +1 -0
- package/Experiments/CRO-584/Molecules/IconTileRadioButton/IconTileRadioButton.js +0 -1
- package/Experiments/CRO-584/Molecules/IconTileRadioButton/IconTileRadioButton.js.map +1 -1
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/IComponentProps.d.ts +7 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/IComponentProps.js +3 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/IComponentProps.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.d.ts +7 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.js +42 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.test.d.ts +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.test.js +22 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.test.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.d.ts +8 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.js +38 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.test.d.ts +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.test.js +40 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.test.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarStory.d.ts +7 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarStory.js +13 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarStory.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/defaultProps.d.ts +4 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/defaultProps.js +7 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/defaultProps.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/index.d.ts +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/index.js +9 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/index.js.map +1 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/makeProgressBarStyling.d.ts +8 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/makeProgressBarStyling.js +71 -0
- package/Experiments/CRO-585-Alyona/Atoms/ProgressBar/makeProgressBarStyling.js.map +1 -0
- package/Interfaces/Atoms/ProgressBar/ProgressBar.js +6 -0
- package/Interfaces/Atoms/ProgressBar/ProgressBar.js.map +1 -1
- package/Interfaces/Molecules/IconTileRadioButton/IconTileRadioButton.js +0 -3
- package/Interfaces/Molecules/IconTileRadioButton/IconTileRadioButton.js.map +1 -1
- package/package.json +1 -1
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"IComponentProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/IComponentProps.ts"],"names":[],"mappings":""}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import { FunctionComponentWithDefaultProps } from '../../../../Helpers/React';
|
2
|
+
import defaultProps from './defaultProps';
|
3
|
+
import IComponentProps from './IComponentProps';
|
4
|
+
import WithExperimentName from '../../../../@types/WithExperimentName';
|
5
|
+
export declare type ProgressBarType = FunctionComponentWithDefaultProps<WithExperimentName<IComponentProps>, typeof defaultProps>;
|
6
|
+
declare const ProgressBar: ProgressBarType;
|
7
|
+
export default ProgressBar;
|
@@ -0,0 +1,39 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
3
|
+
__assign = Object.assign || function(t) {
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
5
|
+
s = arguments[i];
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
7
|
+
t[p] = s[p];
|
8
|
+
}
|
9
|
+
return t;
|
10
|
+
};
|
11
|
+
return __assign.apply(this, arguments);
|
12
|
+
};
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
15
|
+
};
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
17
|
+
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
18
|
+
/** @jsxImportSource @emotion/react */
|
19
|
+
var Box_1 = __importDefault(require("@mui/material/Box"));
|
20
|
+
var LinearProgress_1 = __importDefault(require("@mui/material/LinearProgress"));
|
21
|
+
var Typography_1 = __importDefault(require("@mui/material/Typography"));
|
22
|
+
var defaultProps_1 = __importDefault(require("./defaultProps"));
|
23
|
+
var react_1 = require("@emotion/react");
|
24
|
+
var ProgressBarHelpers_1 = require("./ProgressBarHelpers");
|
25
|
+
var makeProgressBarStyling_1 = __importDefault(require("./makeProgressBarStyling"));
|
26
|
+
var ProgressBar = function (_a) {
|
27
|
+
var id = _a.id, progress = _a.progress, text = _a.text, testId = _a.testId;
|
28
|
+
var theme = (0, react_1.useTheme)();
|
29
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
30
|
+
progressBarFilledColor: theme.mvf.palette.component.progressBarFilledColor,
|
31
|
+
progressBarUnfilledColor: theme.mvf.palette.component.progressBarUnfilledColor,
|
32
|
+
progress: progress,
|
33
|
+
});
|
34
|
+
var styles = (0, makeProgressBarStyling_1.default)(theme, useLightText);
|
35
|
+
return ((0, jsx_runtime_1.jsxs)(Box_1.default, __assign({ css: styles.container, "data-testid": testId }, { children: [(0, jsx_runtime_1.jsxs)(Typography_1.default, __assign({ css: styles.text }, { children: [text, " ", progress, "%"] })), (0, jsx_runtime_1.jsx)(LinearProgress_1.default, { variant: "determinate", css: styles.progressBar, id: id, value: progress })] })));
|
36
|
+
};
|
37
|
+
ProgressBar.defaultProps = defaultProps_1.default;
|
38
|
+
exports.default = ProgressBar;
|
39
|
+
//# sourceMappingURL=ProgressBar.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,sCAAsC;AACtC,0DAAoC;AACpC,gFAA0D;AAC1D,wEAAkD;AAElD,gEAA0C;AAE1C,wCAA0C;AAC1C,2DAA0D;AAE1D,oFAA8D;AAQ9D,IAAM,WAAW,GAAoB,UAAC,EAA8B;QAA5B,EAAE,QAAA,EAAE,QAAQ,cAAA,EAAE,IAAI,UAAA,EAAE,MAAM,YAAA;IAChE,IAAM,KAAK,GAAW,IAAA,gBAAQ,GAAE,CAAC;IACjC,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;QACtC,sBAAsB,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,sBAAsB;QAC1E,wBAAwB,EACtB,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,wBAAwB;QACtD,QAAQ,UAAA;KACT,CAAC,CAAC;IAEH,IAAM,MAAM,GAAG,IAAA,gCAAsB,EAAC,KAAK,EAAE,YAAY,CAAC,CAAC;IAC3D,OAAO,CACL,wBAAC,aAAG,aAAC,GAAG,EAAE,MAAM,CAAC,SAAS,iBAAe,MAAM,iBAC7C,wBAAC,oBAAU,aAAC,GAAG,EAAE,MAAM,CAAC,IAAI,iBACzB,IAAI,OAAG,QAAQ,UACL,EACb,uBAAC,wBAAc,IACb,OAAO,EAAC,aAAa,EACrB,GAAG,EAAE,MAAM,CAAC,WAAW,EACvB,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,QAAQ,GACf,KACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,WAAW,CAAC,YAAY,GAAG,sBAAY,CAAC;AAExC,kBAAe,WAAW,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,22 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
7
|
+
/** @jsxImportSource @emotion/react */
|
8
|
+
var renderWithProviders_1 = __importDefault(require("../../../../Helpers/React/renderWithProviders"));
|
9
|
+
var ProgressBar_1 = __importDefault(require("./ProgressBar"));
|
10
|
+
describe('<ProgressBar />', function () {
|
11
|
+
it('should display progress bar', function () {
|
12
|
+
var getByTestId = (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(ProgressBar_1.default, { id: "test-id", testId: "test-id", progress: 50, experimentName: "default" })).getByTestId;
|
13
|
+
expect(getByTestId('test-id')).toBeTruthy();
|
14
|
+
});
|
15
|
+
it('should display progress text', function () {
|
16
|
+
var text = 'Progress:';
|
17
|
+
var getByText = (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(ProgressBar_1.default, { id: "test-id", progress: 50, text: text, experimentName: "default" })).getByText;
|
18
|
+
expect(getByText(/50%/)).toBeTruthy();
|
19
|
+
expect(getByText(/Progress:/)).toBeTruthy();
|
20
|
+
});
|
21
|
+
});
|
22
|
+
//# sourceMappingURL=ProgressBar.test.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBar.test.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/ProgressBar.test.tsx"],"names":[],"mappings":";;;;;;AAAA,sCAAsC;AACtC,sGAAgF;AAChF,8DAAwC;AAExC,QAAQ,CAAC,iBAAiB,EAAE;IAC1B,EAAE,CAAC,6BAA6B,EAAE;QACxB,IAAA,WAAW,GAAK,IAAA,6BAAmB,EACzC,uBAAC,qBAAW,IACV,EAAE,EAAC,SAAS,EACZ,MAAM,EAAC,SAAS,EAChB,QAAQ,EAAE,EAAE,EACZ,cAAc,EAAC,SAAS,GACxB,CACH,YAPkB,CAOjB;QACF,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8BAA8B,EAAE;QACjC,IAAM,IAAI,GAAG,WAAW,CAAC;QACjB,IAAA,SAAS,GAAK,IAAA,6BAAmB,EACvC,uBAAC,qBAAW,IACV,EAAE,EAAC,SAAS,EACZ,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAE,IAAI,EACV,cAAc,EAAC,SAAS,GACxB,CACH,UAPgB,CAOf;QACF,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;QACtC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
@@ -0,0 +1,28 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.shouldUseLightText = void 0;
|
4
|
+
/**
|
5
|
+
* calculateYIQ uses the luma conversion formula to calculate the relative luminescence of a color.
|
6
|
+
* see https://en.wikipedia.org/wiki/YIQ
|
7
|
+
* @param hexColor: rgb color
|
8
|
+
* @returns number: YIQ = (Y)luminance (IQ)chrominance for the RGB colour provided
|
9
|
+
*/
|
10
|
+
var calculateYIQ = function (hexcolor) {
|
11
|
+
var _a, _b, _c;
|
12
|
+
var rgb = hexcolor.replace(/[^0-9\,]/g, ''); // remove everything except numbers and commas
|
13
|
+
var split = rgb.split(',');
|
14
|
+
var r = parseInt((_a = split[0]) !== null && _a !== void 0 ? _a : 0, 16);
|
15
|
+
var g = parseInt((_b = split[1]) !== null && _b !== void 0 ? _b : 0, 16);
|
16
|
+
var b = parseInt((_c = split[2]) !== null && _c !== void 0 ? _c : 0, 16);
|
17
|
+
var yiq = (r * 0.299 + g * 0.587 + b * 0.114) / 1000;
|
18
|
+
return yiq;
|
19
|
+
};
|
20
|
+
var shouldUseLightText = function (_a) {
|
21
|
+
var progressBarFilledColor = _a.progressBarFilledColor, progressBarUnfilledColor = _a.progressBarUnfilledColor, progress = _a.progress;
|
22
|
+
var textBackground = progress > 50 ? progressBarFilledColor : progressBarUnfilledColor;
|
23
|
+
// This matches the hexadecimal 138 value suggested by Vlad Gutkovsky see https://www.infinityinsight.com/blog/?p=411
|
24
|
+
var DARK_YIQ = 0.31;
|
25
|
+
return calculateYIQ(textBackground) < DARK_YIQ;
|
26
|
+
};
|
27
|
+
exports.shouldUseLightText = shouldUseLightText;
|
28
|
+
//# sourceMappingURL=ProgressBarHelpers.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBarHelpers.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.ts"],"names":[],"mappings":";;;AAAA;;;;;GAKG;AACH,IAAM,YAAY,GAAG,UAAC,QAAgB;;IACpC,IAAM,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,CAAC,8CAA8C;IAC7F,IAAM,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC7B,IAAM,CAAC,GAAG,QAAQ,CAAC,MAAA,KAAK,CAAC,CAAC,CAAC,mCAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IACtC,IAAM,CAAC,GAAG,QAAQ,CAAC,MAAA,KAAK,CAAC,CAAC,CAAC,mCAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IACtC,IAAM,CAAC,GAAG,QAAQ,CAAC,MAAA,KAAK,CAAC,CAAC,CAAC,mCAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IACtC,IAAM,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC;IACvD,OAAO,GAAG,CAAC;AACb,CAAC,CAAC;AAEK,IAAM,kBAAkB,GAAG,UAAC,EAQlC;QAPC,sBAAsB,4BAAA,EACtB,wBAAwB,8BAAA,EACxB,QAAQ,cAAA;IAMR,IAAM,cAAc,GAClB,QAAQ,GAAG,EAAE,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,wBAAwB,CAAC;IAEpE,qHAAqH;IACrH,IAAM,QAAQ,GAAG,IAAI,CAAC;IACtB,OAAO,YAAY,CAAC,cAAc,CAAC,GAAG,QAAQ,CAAC;AACjD,CAAC,CAAC;AAfW,QAAA,kBAAkB,sBAe7B"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,40 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
var ProgressBarHelpers_1 = require("./ProgressBarHelpers");
|
4
|
+
describe('ProgressBarHelpers', function () {
|
5
|
+
var darkBackground = 'rgb(0, 0, 0)';
|
6
|
+
var lightBackground = 'rgb(255, 255, 255)';
|
7
|
+
it('should use light text for dark filled text background', function () {
|
8
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
9
|
+
progressBarFilledColor: darkBackground,
|
10
|
+
progressBarUnfilledColor: lightBackground,
|
11
|
+
progress: 51,
|
12
|
+
});
|
13
|
+
expect(useLightText).toBe(true);
|
14
|
+
});
|
15
|
+
it('should use dark text for light filled text background', function () {
|
16
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
17
|
+
progressBarFilledColor: lightBackground,
|
18
|
+
progressBarUnfilledColor: darkBackground,
|
19
|
+
progress: 51,
|
20
|
+
});
|
21
|
+
expect(useLightText).toBe(false);
|
22
|
+
});
|
23
|
+
it('should use light text for dark unfilled text background', function () {
|
24
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
25
|
+
progressBarFilledColor: lightBackground,
|
26
|
+
progressBarUnfilledColor: darkBackground,
|
27
|
+
progress: 50,
|
28
|
+
});
|
29
|
+
expect(useLightText).toBe(true);
|
30
|
+
});
|
31
|
+
it('should use dark text for light unfilled text background', function () {
|
32
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
33
|
+
progressBarFilledColor: darkBackground,
|
34
|
+
progressBarUnfilledColor: lightBackground,
|
35
|
+
progress: 50,
|
36
|
+
});
|
37
|
+
expect(useLightText).toBe(false);
|
38
|
+
});
|
39
|
+
});
|
40
|
+
//# sourceMappingURL=ProgressBarHelpers.test.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBarHelpers.test.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarHelpers.test.ts"],"names":[],"mappings":";;AAAA,2DAA0D;AAE1D,QAAQ,CAAC,oBAAoB,EAAE;IAC7B,IAAM,cAAc,GAAG,cAAc,CAAC;IACtC,IAAM,eAAe,GAAG,oBAAoB,CAAC;IAE7C,EAAE,CAAC,uDAAuD,EAAE;QAC1D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,cAAc;YACtC,wBAAwB,EAAE,eAAe;YACzC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uDAAuD,EAAE;QAC1D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,eAAe;YACvC,wBAAwB,EAAE,cAAc;YACxC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yDAAyD,EAAE;QAC5D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,eAAe;YACvC,wBAAwB,EAAE,cAAc;YACxC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yDAAyD,EAAE;QAC5D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,cAAc;YACtC,wBAAwB,EAAE,eAAe;YACzC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
7
|
+
var ProgressBar_1 = __importDefault(require("./ProgressBar"));
|
8
|
+
var ProgressBarStory = function (_a) {
|
9
|
+
var text = _a.text, progress = _a.progress;
|
10
|
+
return ((0, jsx_runtime_1.jsx)(ProgressBar_1.default, { id: "id", progress: progress, text: text, experimentName: "default" }));
|
11
|
+
};
|
12
|
+
exports.default = ProgressBarStory;
|
13
|
+
//# sourceMappingURL=ProgressBarStory.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBarStory.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/ProgressBarStory.tsx"],"names":[],"mappings":";;;;;;AACA,8DAAwC;AAOxC,IAAM,gBAAgB,GAAyB,UAAC,EAAkB;QAAhB,IAAI,UAAA,EAAE,QAAQ,cAAA;IAAO,OAAA,CACrE,uBAAC,qBAAW,IACV,EAAE,EAAC,IAAI,EACP,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,cAAc,EAAC,SAAS,GACxB,CACH;AAPsE,CAOtE,CAAC;AAEF,kBAAe,gBAAgB,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"defaultProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/defaultProps.ts"],"names":[],"mappings":";;AAAA,IAAM,YAAY,GAAG;IACnB,IAAI,EAAE,WAAW;CAClB,CAAC;AAEF,kBAAe,YAAY,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export { default } from './ProgressBar';
|
@@ -0,0 +1,9 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
exports.default = void 0;
|
7
|
+
var ProgressBar_1 = require("./ProgressBar");
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ProgressBar_1).default; } });
|
9
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/index.ts"],"names":[],"mappings":";;;;;;AAAA,6CAAwC;AAA/B,uHAAA,OAAO,OAAA"}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import { ITheme } from '../../../../Themes';
|
2
|
+
declare const makeProgressBarStyling: (theme: ITheme, useLightText: boolean) => {
|
3
|
+
container: import("@emotion/react").SerializedStyles;
|
4
|
+
progressBar: import("@emotion/react").SerializedStyles;
|
5
|
+
text: import("@emotion/react").SerializedStyles;
|
6
|
+
};
|
7
|
+
export default makeProgressBarStyling;
|
@@ -0,0 +1,43 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
var react_1 = require("@emotion/react");
|
4
|
+
var LIGHT_TEXT_SHADOW = 'rgb(255, 255, 255) 1px 1px 4px';
|
5
|
+
var DARK_TEXT_SHADOW = 'rgb(0, 0, 0) 1px 1px 4px';
|
6
|
+
var DARK_TEXT_COLOR = 'rgb(0, 0, 0)';
|
7
|
+
var LIGHT_TEXT_COLOR = 'rgb(255, 255, 255)';
|
8
|
+
var makeProgressBarStyling = function (theme, useLightText) {
|
9
|
+
return {
|
10
|
+
container: (0, react_1.css)({
|
11
|
+
height: 25,
|
12
|
+
display: 'grid',
|
13
|
+
width: '100%',
|
14
|
+
}),
|
15
|
+
progressBar: (0, react_1.css)({
|
16
|
+
height: '100%',
|
17
|
+
position: 'relative',
|
18
|
+
gridRowStart: 1,
|
19
|
+
gridColumnStart: 1,
|
20
|
+
'& .MuiLinearProgress-barColorPrimary': {
|
21
|
+
backgroundColor: theme.mvf.palette.component.progressBarFilledColor,
|
22
|
+
},
|
23
|
+
'&.MuiLinearProgress-colorPrimary': {
|
24
|
+
backgroundColor: theme.mvf.palette.component.progressBarUnfilledColor,
|
25
|
+
},
|
26
|
+
}),
|
27
|
+
text: (0, react_1.css)({
|
28
|
+
gridRowStart: 1,
|
29
|
+
gridColumnStart: 1,
|
30
|
+
position: 'relative',
|
31
|
+
width: 'inherit',
|
32
|
+
zIndex: 1,
|
33
|
+
lineHeight: '25px',
|
34
|
+
fontSize: theme.mvf.fontSize.compact,
|
35
|
+
textShadow: useLightText ? DARK_TEXT_SHADOW : LIGHT_TEXT_SHADOW,
|
36
|
+
color: useLightText ? LIGHT_TEXT_COLOR : DARK_TEXT_COLOR,
|
37
|
+
textAlign: 'center',
|
38
|
+
transition: 'color 0.5s ease, textShadow 0.5s ease',
|
39
|
+
}),
|
40
|
+
};
|
41
|
+
};
|
42
|
+
exports.default = makeProgressBarStyling;
|
43
|
+
//# sourceMappingURL=makeProgressBarStyling.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"makeProgressBarStyling.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-582/Atoms/ProgressBar/makeProgressBarStyling.ts"],"names":[],"mappings":";;AAAA,wCAAqC;AAGrC,IAAM,iBAAiB,GAAG,gCAAgC,CAAC;AAC3D,IAAM,gBAAgB,GAAG,0BAA0B,CAAC;AACpD,IAAM,eAAe,GAAG,cAAc,CAAC;AACvC,IAAM,gBAAgB,GAAG,oBAAoB,CAAC;AAE9C,IAAM,sBAAsB,GAAG,UAAC,KAAa,EAAE,YAAqB;IAClE,OAAO;QACL,SAAS,EAAE,IAAA,WAAG,EAAC;YACb,MAAM,EAAE,EAAE;YACV,OAAO,EAAE,MAAM;YACf,KAAK,EAAE,MAAM;SACd,CAAC;QACF,WAAW,EAAE,IAAA,WAAG,EAAC;YACf,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,UAAU;YACpB,YAAY,EAAE,CAAC;YACf,eAAe,EAAE,CAAC;YAClB,sCAAsC,EAAE;gBACtC,eAAe,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,sBAAsB;aACpE;YACD,kCAAkC,EAAE;gBAClC,eAAe,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,wBAAwB;aACtE;SACF,CAAC;QACF,IAAI,EAAE,IAAA,WAAG,EAAC;YACR,YAAY,EAAE,CAAC;YACf,eAAe,EAAE,CAAC;YAClB,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,CAAC;YACT,UAAU,EAAE,MAAM;YAClB,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,OAAO;YACpC,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,iBAAiB;YAC/D,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe;YACxD,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,uCAAuC;SACpD,CAAC;KACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,sBAAsB,CAAC"}
|
@@ -27,7 +27,6 @@ var deviceSpecificHandlers_1 = require("../../../../Helpers/deviceSpecificHandle
|
|
27
27
|
var makeIconTileRadioButtonStyling_1 = __importDefault(require("./makeIconTileRadioButtonStyling"));
|
28
28
|
var IconTileRadioButton = function (_a) {
|
29
29
|
var Icon = _a.Icon, id = _a.id, isOtherOption = _a.isOtherOption, onClick = _a.onClick, onChange = _a.onChange, onKeyDown = _a.onKeyDown, otherInputError = _a.otherInputError, otherInputValue = _a.otherInputValue, text = _a.text, experimentName = _a.experimentName;
|
30
|
-
console.log('Experimental IconTileRadioButton', experimentName);
|
31
30
|
var _b = (0, react_1.useContext)(RadioGroupContext_1.default), selectedId = _b.selectedId, setSelectedId = _b.setSelectedId;
|
32
31
|
var _c = (0, react_1.useState)(false), isFocused = _c[0], setIsFocused = _c[1];
|
33
32
|
var _d = (0, react_1.useState)(otherInputValue), otherValue = _d[0], setOtherValue = _d[1];
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"IconTileRadioButton.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-584/Molecules/IconTileRadioButton/IconTileRadioButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,sCAAsC;AACtC,+BAAgE;AAGhE,iFAA2D;AAC3D,0DAAoC;AACpC,mGAA6E;AAC7E,qEAA+C;AAE/C,gEAA0C;AAC1C,2FAAsE;AACtE,qFAA6E;AAC7E,oGAA8E;AAO9E,IAAM,mBAAmB,GAA4B,UAAC,EAWrD;QAVC,IAAI,UAAA,EACJ,EAAE,QAAA,EACF,aAAa,mBAAA,EACb,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,eAAe,qBAAA,EACf,eAAe,qBAAA,EACf,IAAI,UAAA,EACJ,cAAc,oBAAA;
|
1
|
+
{"version":3,"file":"IconTileRadioButton.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-584/Molecules/IconTileRadioButton/IconTileRadioButton.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"IComponentProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/IComponentProps.ts"],"names":[],"mappings":""}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import { FunctionComponentWithDefaultProps } from '../../../../Helpers/React';
|
2
|
+
import defaultProps from './defaultProps';
|
3
|
+
import IComponentProps from './IComponentProps';
|
4
|
+
import WithExperimentName from '../../../../@types/WithExperimentName';
|
5
|
+
export declare type ProgressBarType = FunctionComponentWithDefaultProps<WithExperimentName<IComponentProps>, typeof defaultProps>;
|
6
|
+
declare const ProgressBar: ProgressBarType;
|
7
|
+
export default ProgressBar;
|
@@ -0,0 +1,42 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
3
|
+
__assign = Object.assign || function(t) {
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
5
|
+
s = arguments[i];
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
7
|
+
t[p] = s[p];
|
8
|
+
}
|
9
|
+
return t;
|
10
|
+
};
|
11
|
+
return __assign.apply(this, arguments);
|
12
|
+
};
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
15
|
+
};
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
17
|
+
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
18
|
+
/** @jsxImportSource @emotion/react */
|
19
|
+
var Box_1 = __importDefault(require("@mui/material/Box"));
|
20
|
+
var LinearProgress_1 = __importDefault(require("@mui/material/LinearProgress"));
|
21
|
+
var Typography_1 = __importDefault(require("@mui/material/Typography"));
|
22
|
+
var defaultProps_1 = __importDefault(require("./defaultProps"));
|
23
|
+
var react_1 = require("@emotion/react");
|
24
|
+
var ProgressBarHelpers_1 = require("./ProgressBarHelpers");
|
25
|
+
var makeProgressBarStyling_1 = __importDefault(require("./makeProgressBarStyling"));
|
26
|
+
var ProgressBar = function (_a) {
|
27
|
+
var id = _a.id, progress = _a.progress, text = _a.text, testId = _a.testId;
|
28
|
+
var theme = (0, react_1.useTheme)();
|
29
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
30
|
+
progressBarFilledColor: theme.mvf.palette.component.progressBarFilledColor,
|
31
|
+
progressBarUnfilledColor: theme.mvf.palette.component.progressBarUnfilledColor,
|
32
|
+
progress: progress,
|
33
|
+
});
|
34
|
+
var newBar = (0, ProgressBarHelpers_1.carBar)({
|
35
|
+
progress: progress,
|
36
|
+
});
|
37
|
+
var styles = (0, makeProgressBarStyling_1.default)(theme, useLightText, newBar);
|
38
|
+
return ((0, jsx_runtime_1.jsxs)(Box_1.default, __assign({ css: styles.container, "data-testid": testId }, { children: [(0, jsx_runtime_1.jsxs)(Typography_1.default, __assign({ css: styles.text }, { children: [text, " ", progress, "%"] })), (0, jsx_runtime_1.jsx)(LinearProgress_1.default, { variant: "determinate", css: styles.car, value: progress }), (0, jsx_runtime_1.jsx)(LinearProgress_1.default, { variant: "determinate", css: styles.progressBar, id: id, value: progress })] })));
|
39
|
+
};
|
40
|
+
ProgressBar.defaultProps = defaultProps_1.default;
|
41
|
+
exports.default = ProgressBar;
|
42
|
+
//# sourceMappingURL=ProgressBar.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,sCAAsC;AACtC,0DAAoC;AACpC,gFAA0D;AAC1D,wEAAkD;AAElD,gEAA0C;AAE1C,wCAA0C;AAC1C,2DAAkE;AAElE,oFAA8D;AAQ9D,IAAM,WAAW,GAAoB,UAAC,EAA8B;QAA5B,EAAE,QAAA,EAAE,QAAQ,cAAA,EAAE,IAAI,UAAA,EAAE,MAAM,YAAA;IAChE,IAAM,KAAK,GAAW,IAAA,gBAAQ,GAAE,CAAC;IACjC,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;QACtC,sBAAsB,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,sBAAsB;QAC1E,wBAAwB,EACtB,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,wBAAwB;QACtD,QAAQ,UAAA;KACT,CAAC,CAAC;IAEH,IAAM,MAAM,GAAG,IAAA,2BAAM,EAAC;QACpB,QAAQ,UAAA;KACT,CAAC,CAAC;IAEH,IAAM,MAAM,GAAG,IAAA,gCAAsB,EAAC,KAAK,EAAE,YAAY,EAAE,MAAM,CAAC,CAAC;IACnE,OAAO,CACL,wBAAC,aAAG,aAAC,GAAG,EAAE,MAAM,CAAC,SAAS,iBAAe,MAAM,iBAC7C,wBAAC,oBAAU,aAAC,GAAG,EAAE,MAAM,CAAC,IAAI,iBACzB,IAAI,OAAG,QAAQ,UACL,EACb,uBAAC,wBAAc,IAAC,OAAO,EAAC,aAAa,EAAC,GAAG,EAAE,MAAM,CAAC,GAAG,EAAE,KAAK,EAAE,QAAQ,GAAI,EAC1E,uBAAC,wBAAc,IACb,OAAO,EAAC,aAAa,EACrB,GAAG,EAAE,MAAM,CAAC,WAAW,EACvB,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,QAAQ,GACf,KACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,WAAW,CAAC,YAAY,GAAG,sBAAY,CAAC;AAExC,kBAAe,WAAW,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,22 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
7
|
+
/** @jsxImportSource @emotion/react */
|
8
|
+
var renderWithProviders_1 = __importDefault(require("../../../../Helpers/React/renderWithProviders"));
|
9
|
+
var ProgressBar_1 = __importDefault(require("./ProgressBar"));
|
10
|
+
describe('<ProgressBar />', function () {
|
11
|
+
it('should display progress bar', function () {
|
12
|
+
var getByTestId = (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(ProgressBar_1.default, { id: "test-id", testId: "test-id", progress: 50, experimentName: "default" })).getByTestId;
|
13
|
+
expect(getByTestId('test-id')).toBeTruthy();
|
14
|
+
});
|
15
|
+
it('should display progress text', function () {
|
16
|
+
var text = 'Progress:';
|
17
|
+
var getByText = (0, renderWithProviders_1.default)((0, jsx_runtime_1.jsx)(ProgressBar_1.default, { id: "test-id", progress: 50, text: text, experimentName: "default" })).getByText;
|
18
|
+
expect(getByText(/50%/)).toBeTruthy();
|
19
|
+
expect(getByText(/Progress:/)).toBeTruthy();
|
20
|
+
});
|
21
|
+
});
|
22
|
+
//# sourceMappingURL=ProgressBar.test.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBar.test.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar.test.tsx"],"names":[],"mappings":";;;;;;AAAA,sCAAsC;AACtC,sGAAgF;AAChF,8DAAwC;AAExC,QAAQ,CAAC,iBAAiB,EAAE;IAC1B,EAAE,CAAC,6BAA6B,EAAE;QACxB,IAAA,WAAW,GAAK,IAAA,6BAAmB,EACzC,uBAAC,qBAAW,IACV,EAAE,EAAC,SAAS,EACZ,MAAM,EAAC,SAAS,EAChB,QAAQ,EAAE,EAAE,EACZ,cAAc,EAAC,SAAS,GACxB,CACH,YAPkB,CAOjB;QACF,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8BAA8B,EAAE;QACjC,IAAM,IAAI,GAAG,WAAW,CAAC;QACjB,IAAA,SAAS,GAAK,IAAA,6BAAmB,EACvC,uBAAC,qBAAW,IACV,EAAE,EAAC,SAAS,EACZ,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAE,IAAI,EACV,cAAc,EAAC,SAAS,GACxB,CACH,UAPgB,CAOf;QACF,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;QACtC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
export declare const shouldUseLightText: ({ progressBarFilledColor, progressBarUnfilledColor, progress, }: {
|
2
|
+
progressBarFilledColor: string;
|
3
|
+
progressBarUnfilledColor: string;
|
4
|
+
progress: number;
|
5
|
+
}) => boolean;
|
6
|
+
export declare const carBar: ({ progress }: {
|
7
|
+
progress: number;
|
8
|
+
}) => 0 | -45;
|
@@ -0,0 +1,38 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.carBar = exports.shouldUseLightText = void 0;
|
4
|
+
/**
|
5
|
+
* calculateYIQ uses the luma conversion formula to calculate the relative luminescence of a color.
|
6
|
+
* see https://en.wikipedia.org/wiki/YIQ
|
7
|
+
* @param hexColor: rgb color
|
8
|
+
* @returns number: YIQ = (Y)luminance (IQ)chrominance for the RGB colour provided
|
9
|
+
*/
|
10
|
+
var calculateYIQ = function (hexcolor) {
|
11
|
+
var _a, _b, _c;
|
12
|
+
var rgb = hexcolor.replace(/[^0-9\,]/g, ''); // remove everything except numbers and commas
|
13
|
+
var split = rgb.split(',');
|
14
|
+
var r = parseInt((_a = split[0]) !== null && _a !== void 0 ? _a : 0, 16);
|
15
|
+
var g = parseInt((_b = split[1]) !== null && _b !== void 0 ? _b : 0, 16);
|
16
|
+
var b = parseInt((_c = split[2]) !== null && _c !== void 0 ? _c : 0, 16);
|
17
|
+
var yiq = (r * 0.299 + g * 0.587 + b * 0.114) / 1000;
|
18
|
+
return yiq;
|
19
|
+
};
|
20
|
+
var shouldUseLightText = function (_a) {
|
21
|
+
var progressBarFilledColor = _a.progressBarFilledColor, progressBarUnfilledColor = _a.progressBarUnfilledColor, progress = _a.progress;
|
22
|
+
var textBackground = progress > 50 ? progressBarFilledColor : progressBarUnfilledColor;
|
23
|
+
// This matches the hexadecimal 138 value suggested by Vlad Gutkovsky see https://www.infinityinsight.com/blog/?p=411
|
24
|
+
var DARK_YIQ = 0.31;
|
25
|
+
return calculateYIQ(textBackground) < DARK_YIQ;
|
26
|
+
};
|
27
|
+
exports.shouldUseLightText = shouldUseLightText;
|
28
|
+
/* Move the image a bit if 7% of the form is completed.
|
29
|
+
When the value of the progress panel = 0%, the image moves to the right by -45 pixels, outside the loading bar, to be visible.
|
30
|
+
When the value = 7% (approximate width of the image), the image changes its position and becomes above the progress bar on the right edge.
|
31
|
+
*/
|
32
|
+
var carBar = function (_a) {
|
33
|
+
var progress = _a.progress;
|
34
|
+
var res = progress > 7 ? 0 : -45;
|
35
|
+
return res;
|
36
|
+
};
|
37
|
+
exports.carBar = carBar;
|
38
|
+
//# sourceMappingURL=ProgressBarHelpers.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBarHelpers.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.ts"],"names":[],"mappings":";;;AAAA;;;;;GAKG;AACH,IAAM,YAAY,GAAG,UAAC,QAAgB;;IACpC,IAAM,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,CAAC,8CAA8C;IAC7F,IAAM,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC7B,IAAM,CAAC,GAAG,QAAQ,CAAC,MAAA,KAAK,CAAC,CAAC,CAAC,mCAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IACtC,IAAM,CAAC,GAAG,QAAQ,CAAC,MAAA,KAAK,CAAC,CAAC,CAAC,mCAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IACtC,IAAM,CAAC,GAAG,QAAQ,CAAC,MAAA,KAAK,CAAC,CAAC,CAAC,mCAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IACtC,IAAM,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC;IACvD,OAAO,GAAG,CAAC;AACb,CAAC,CAAC;AAEK,IAAM,kBAAkB,GAAG,UAAC,EAQlC;QAPC,sBAAsB,4BAAA,EACtB,wBAAwB,8BAAA,EACxB,QAAQ,cAAA;IAMR,IAAM,cAAc,GAClB,QAAQ,GAAG,EAAE,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,wBAAwB,CAAC;IAEpE,qHAAqH;IACrH,IAAM,QAAQ,GAAG,IAAI,CAAC;IACtB,OAAO,YAAY,CAAC,cAAc,CAAC,GAAG,QAAQ,CAAC;AACjD,CAAC,CAAC;AAfW,QAAA,kBAAkB,sBAe7B;AAEF;;;EAGE;AACK,IAAM,MAAM,GAAG,UAAC,EAAkC;QAAhC,QAAQ,cAAA;IAC/B,IAAM,GAAG,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,OAAO,GAAG,CAAC;AACb,CAAC,CAAC;AAHW,QAAA,MAAM,UAGjB"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,40 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
var ProgressBarHelpers_1 = require("./ProgressBarHelpers");
|
4
|
+
describe('ProgressBarHelpers', function () {
|
5
|
+
var darkBackground = 'rgb(0, 0, 0)';
|
6
|
+
var lightBackground = 'rgb(255, 255, 255)';
|
7
|
+
it('should use light text for dark filled text background', function () {
|
8
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
9
|
+
progressBarFilledColor: darkBackground,
|
10
|
+
progressBarUnfilledColor: lightBackground,
|
11
|
+
progress: 51,
|
12
|
+
});
|
13
|
+
expect(useLightText).toBe(true);
|
14
|
+
});
|
15
|
+
it('should use dark text for light filled text background', function () {
|
16
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
17
|
+
progressBarFilledColor: lightBackground,
|
18
|
+
progressBarUnfilledColor: darkBackground,
|
19
|
+
progress: 51,
|
20
|
+
});
|
21
|
+
expect(useLightText).toBe(false);
|
22
|
+
});
|
23
|
+
it('should use light text for dark unfilled text background', function () {
|
24
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
25
|
+
progressBarFilledColor: lightBackground,
|
26
|
+
progressBarUnfilledColor: darkBackground,
|
27
|
+
progress: 50,
|
28
|
+
});
|
29
|
+
expect(useLightText).toBe(true);
|
30
|
+
});
|
31
|
+
it('should use dark text for light unfilled text background', function () {
|
32
|
+
var useLightText = (0, ProgressBarHelpers_1.shouldUseLightText)({
|
33
|
+
progressBarFilledColor: darkBackground,
|
34
|
+
progressBarUnfilledColor: lightBackground,
|
35
|
+
progress: 50,
|
36
|
+
});
|
37
|
+
expect(useLightText).toBe(false);
|
38
|
+
});
|
39
|
+
});
|
40
|
+
//# sourceMappingURL=ProgressBarHelpers.test.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBarHelpers.test.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarHelpers.test.ts"],"names":[],"mappings":";;AAAA,2DAA0D;AAE1D,QAAQ,CAAC,oBAAoB,EAAE;IAC7B,IAAM,cAAc,GAAG,cAAc,CAAC;IACtC,IAAM,eAAe,GAAG,oBAAoB,CAAC;IAE7C,EAAE,CAAC,uDAAuD,EAAE;QAC1D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,cAAc;YACtC,wBAAwB,EAAE,eAAe;YACzC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uDAAuD,EAAE;QAC1D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,eAAe;YACvC,wBAAwB,EAAE,cAAc;YACxC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yDAAyD,EAAE;QAC5D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,eAAe;YACvC,wBAAwB,EAAE,cAAc;YACxC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yDAAyD,EAAE;QAC5D,IAAM,YAAY,GAAG,IAAA,uCAAkB,EAAC;YACtC,sBAAsB,EAAE,cAAc;YACtC,wBAAwB,EAAE,eAAe;YACzC,QAAQ,EAAE,EAAE;SACb,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
7
|
+
var ProgressBar_1 = __importDefault(require("./ProgressBar"));
|
8
|
+
var ProgressBarStory = function (_a) {
|
9
|
+
var text = _a.text, progress = _a.progress;
|
10
|
+
return ((0, jsx_runtime_1.jsx)(ProgressBar_1.default, { id: "id", progress: progress, text: text, experimentName: "default" }));
|
11
|
+
};
|
12
|
+
exports.default = ProgressBarStory;
|
13
|
+
//# sourceMappingURL=ProgressBarStory.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ProgressBarStory.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBarStory.tsx"],"names":[],"mappings":";;;;;;AACA,8DAAwC;AAOxC,IAAM,gBAAgB,GAAyB,UAAC,EAAkB;QAAhB,IAAI,UAAA,EAAE,QAAQ,cAAA;IAAO,OAAA,CACrE,uBAAC,qBAAW,IACV,EAAE,EAAC,IAAI,EACP,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,cAAc,EAAC,SAAS,GACxB,CACH;AAPsE,CAOtE,CAAC;AAEF,kBAAe,gBAAgB,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"defaultProps.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/defaultProps.ts"],"names":[],"mappings":";;AAAA,IAAM,YAAY,GAAG;IACnB,IAAI,EAAE,WAAW;CAClB,CAAC;AAEF,kBAAe,YAAY,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export { default } from './ProgressBar';
|
@@ -0,0 +1,9 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
exports.default = void 0;
|
7
|
+
var ProgressBar_1 = require("./ProgressBar");
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ProgressBar_1).default; } });
|
9
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/index.ts"],"names":[],"mappings":";;;;;;AAAA,6CAAwC;AAA/B,uHAAA,OAAO,OAAA"}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import { ITheme } from '../../../../Themes/themes';
|
2
|
+
declare const makeProgressBarStyling: (theme: ITheme, useLightText: boolean, newBar: number) => {
|
3
|
+
container: import("@emotion/react").SerializedStyles;
|
4
|
+
progressBar: import("@emotion/react").SerializedStyles;
|
5
|
+
text: import("@emotion/react").SerializedStyles;
|
6
|
+
car: import("@emotion/react").SerializedStyles;
|
7
|
+
};
|
8
|
+
export default makeProgressBarStyling;
|
@@ -0,0 +1,71 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
var react_1 = require("@emotion/react");
|
4
|
+
var LIGHT_TEXT_SHADOW = 'rgb(255, 255, 255) 1px 1px 4px';
|
5
|
+
var DARK_TEXT_SHADOW = 'rgb(0, 0, 0) 1px 1px 4px';
|
6
|
+
var DARK_TEXT_COLOR = 'rgb(0, 0, 0)';
|
7
|
+
var LIGHT_TEXT_COLOR = 'rgb(255, 255, 255)';
|
8
|
+
var CAR_IMAGE = "url(\"data:image/svg+xml,%3Csvg width='62px' height='32px' viewBox='0 0 62 32' fill='none' xmlns='http://www.w3.org/2000/svg' transform='rotate(0) scale(1, 1)'%3E%3Cpath d='M47 30C49.7614 30 52 27.7614 52 25C52 22.2386 49.7614 20 47 20C44.2386 20 42 22.2386 42 25C42 27.7614 44.2386 30 47 30Z' stroke='%2339da96' stroke-width='4'/%3E%3Cpath d='M15 30C17.7614 30 20 27.7614 20 25C20 22.2386 17.7614 20 15 20C12.2386 20 10 22.2386 10 25C10 27.7614 12.2386 30 15 30Z' stroke='%2339da96' stroke-width='4'/%3E%3Cpath d='M2 19V11L14.2 10L18.4 2H39.4L43.7 11L60 11.8V19' stroke='%2339da96' stroke-width='4'/%3E%3C/svg%3E\")";
|
9
|
+
var makeProgressBarStyling = function (theme, useLightText, newBar) {
|
10
|
+
return {
|
11
|
+
container: (0, react_1.css)({
|
12
|
+
height: 52,
|
13
|
+
display: 'grid',
|
14
|
+
width: '100%',
|
15
|
+
position: 'relative',
|
16
|
+
}),
|
17
|
+
progressBar: (0, react_1.css)({
|
18
|
+
height: '100%',
|
19
|
+
position: 'relative',
|
20
|
+
gridRowStart: 2,
|
21
|
+
gridColumnStart: 1,
|
22
|
+
'& .MuiLinearProgress-barColorPrimary': {
|
23
|
+
backgroundColor: theme.mvf.palette.component.progressBarFilledColor,
|
24
|
+
},
|
25
|
+
'&.MuiLinearProgress-colorPrimary': {
|
26
|
+
backgroundColor: theme.mvf.palette.component.progressBarUnfilledColor,
|
27
|
+
height: 25,
|
28
|
+
},
|
29
|
+
}),
|
30
|
+
text: (0, react_1.css)({
|
31
|
+
gridRowStart: 2,
|
32
|
+
gridColumnStart: 1,
|
33
|
+
position: 'relative',
|
34
|
+
width: 'inherit',
|
35
|
+
zIndex: 1,
|
36
|
+
lineHeight: '25px',
|
37
|
+
fontSize: theme.mvf.fontSize.tiny,
|
38
|
+
textShadow: useLightText ? DARK_TEXT_SHADOW : LIGHT_TEXT_SHADOW,
|
39
|
+
color: useLightText ? LIGHT_TEXT_COLOR : DARK_TEXT_COLOR,
|
40
|
+
textAlign: 'center',
|
41
|
+
transition: 'color 0.5s ease, textShadow 0.5s ease',
|
42
|
+
}),
|
43
|
+
car: (0, react_1.css)({
|
44
|
+
gridRowStart: 1,
|
45
|
+
gridColumnStart: 1,
|
46
|
+
zIndex: 2,
|
47
|
+
height: 27,
|
48
|
+
'& .MuiLinearProgress-barColorPrimary': {
|
49
|
+
backgroundColor: 'transparent',
|
50
|
+
'&:before': {
|
51
|
+
content: '""',
|
52
|
+
position: 'absolute',
|
53
|
+
bottom: 2,
|
54
|
+
right: newBar,
|
55
|
+
backgroundImage: CAR_IMAGE,
|
56
|
+
backgroundRepeat: 'no-repeat',
|
57
|
+
backgroundSize: 'contain',
|
58
|
+
backgroundPosition: '50% 50%',
|
59
|
+
width: 42,
|
60
|
+
height: 22,
|
61
|
+
transition: "right .3s linear",
|
62
|
+
},
|
63
|
+
},
|
64
|
+
'&.MuiLinearProgress-colorPrimary': {
|
65
|
+
backgroundColor: 'transparent',
|
66
|
+
},
|
67
|
+
}),
|
68
|
+
};
|
69
|
+
};
|
70
|
+
exports.default = makeProgressBarStyling;
|
71
|
+
//# sourceMappingURL=makeProgressBarStyling.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"makeProgressBarStyling.js","sourceRoot":"","sources":["../../../../../src/Experiments/CRO-585-Alyona/Atoms/ProgressBar/makeProgressBarStyling.ts"],"names":[],"mappings":";;AAAA,wCAAqC;AAGrC,IAAM,iBAAiB,GAAG,gCAAgC,CAAC;AAC3D,IAAM,gBAAgB,GAAG,0BAA0B,CAAC;AACpD,IAAM,eAAe,GAAG,cAAc,CAAC;AACvC,IAAM,gBAAgB,GAAG,oBAAoB,CAAC;AAC9C,IAAM,SAAS,GAAG,0mBAAwmB,CAAC;AAE3nB,IAAM,sBAAsB,GAAG,UAC7B,KAAa,EACb,YAAqB,EACrB,MAAc;IAEd,OAAO;QACL,SAAS,EAAE,IAAA,WAAG,EAAC;YACb,MAAM,EAAE,EAAE;YACV,OAAO,EAAE,MAAM;YACf,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,UAAU;SACrB,CAAC;QACF,WAAW,EAAE,IAAA,WAAG,EAAC;YACf,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,UAAU;YACpB,YAAY,EAAE,CAAC;YACf,eAAe,EAAE,CAAC;YAClB,sCAAsC,EAAE;gBACtC,eAAe,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,sBAAsB;aACpE;YACD,kCAAkC,EAAE;gBAClC,eAAe,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,wBAAwB;gBACrE,MAAM,EAAE,EAAE;aACX;SACF,CAAC;QACF,IAAI,EAAE,IAAA,WAAG,EAAC;YACR,YAAY,EAAE,CAAC;YACf,eAAe,EAAE,CAAC;YAClB,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,CAAC;YACT,UAAU,EAAE,MAAM;YAClB,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI;YACjC,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,iBAAiB;YAC/D,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe;YACxD,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,uCAAuC;SACpD,CAAC;QACF,GAAG,EAAE,IAAA,WAAG,EAAC;YACP,YAAY,EAAE,CAAC;YACf,eAAe,EAAE,CAAC;YAClB,MAAM,EAAE,CAAC;YACT,MAAM,EAAE,EAAE;YACV,sCAAsC,EAAE;gBACtC,eAAe,EAAE,aAAa;gBAC9B,UAAU,EAAE;oBACV,OAAO,EAAE,IAAI;oBACb,QAAQ,EAAE,UAAU;oBACpB,MAAM,EAAE,CAAC;oBACT,KAAK,EAAE,MAAM;oBACb,eAAe,EAAE,SAAS;oBAC1B,gBAAgB,EAAE,WAAW;oBAC7B,cAAc,EAAE,SAAS;oBACzB,kBAAkB,EAAE,SAAS;oBAC7B,KAAK,EAAE,EAAE;oBACT,MAAM,EAAE,EAAE;oBACV,UAAU,EAAE,kBAAkB;iBAC/B;aACF;YACD,kCAAkC,EAAE;gBAClC,eAAe,EAAE,aAAa;aAC/B;SACF,CAAC;KACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,sBAAsB,CAAC"}
|
@@ -17,8 +17,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
17
|
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
18
18
|
var ProgressBar_1 = __importDefault(require("../../../Components/Atoms/ProgressBar/ProgressBar"));
|
19
19
|
var defaultProps_1 = __importDefault(require("../../../Components/Atoms/ProgressBar/defaultProps"));
|
20
|
+
var ProgressBar_2 = __importDefault(require("../../../Experiments/CRO-582/Atoms/ProgressBar/ProgressBar"));
|
21
|
+
var ProgressBar_3 = __importDefault(require("../../../Experiments/CRO-585-Alyona/Atoms/ProgressBar/ProgressBar"));
|
20
22
|
var ProgressBar = function (props) {
|
21
23
|
switch (props.experimentName) {
|
24
|
+
case 'CRO-585-Alyona':
|
25
|
+
return (0, jsx_runtime_1.jsx)(ProgressBar_3.default, __assign({}, props));
|
26
|
+
case 'CRO-582':
|
27
|
+
return (0, jsx_runtime_1.jsx)(ProgressBar_2.default, __assign({}, props));
|
22
28
|
default:
|
23
29
|
return (0, jsx_runtime_1.jsx)(ProgressBar_1.default, __assign({}, props));
|
24
30
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../../src/Interfaces/Atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kGAE2D;AAC3D,oGAA8E;
|
1
|
+
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../../src/Interfaces/Atoms/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kGAE2D;AAC3D,oGAA8E;AAC9E,2GAA2F;AAC3F,kHAAwG;AAExG,IAAM,WAAW,GAAoB,UAAC,KAAK;IACzC,QAAQ,KAAK,CAAC,cAAc,EAAE;QAC5B,KAAK,gBAAgB;YACnB,OAAO,uBAAC,qBAAuB,eAAK,KAAK,EAAI,CAAC;QAChD,KAAK,SAAS;YACZ,OAAO,uBAAC,qBAAiB,eAAK,KAAK,EAAI,CAAC;QAC1C;YACE,OAAO,uBAAC,qBAAkB,eAAK,KAAK,EAAI,CAAC;KAC5C;AACH,CAAC,CAAC;AAEF,WAAW,CAAC,YAAY,GAAG,sBAAY,CAAC;AAExC,kBAAe,WAAW,CAAC"}
|
@@ -19,13 +19,10 @@ var IconTileRadioButton_1 = __importDefault(require("../../../Components/Molecul
|
|
19
19
|
var IconTileRadioButton_2 = __importDefault(require("../../../Experiments/CRO-584/Molecules/IconTileRadioButton/IconTileRadioButton"));
|
20
20
|
var defaultProps_1 = __importDefault(require("../../../Components/Molecules/IconTileRadioButton/defaultProps"));
|
21
21
|
var IconTileRadioButton = function (props) {
|
22
|
-
console.log('Interface IconTileRadioButton', props);
|
23
22
|
switch (props.experimentName) {
|
24
23
|
case 'CRO-584':
|
25
|
-
console.log('Using experiment');
|
26
24
|
return (0, jsx_runtime_1.jsx)(IconTileRadioButton_2.default, __assign({}, props));
|
27
25
|
default:
|
28
|
-
console.log('Using default');
|
29
26
|
return (0, jsx_runtime_1.jsx)(IconTileRadioButton_1.default, __assign({}, props));
|
30
27
|
}
|
31
28
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"IconTileRadioButton.js","sourceRoot":"","sources":["../../../../src/Interfaces/Molecules/IconTileRadioButton/IconTileRadioButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8HAE+E;AAC/E,uIAAuH;AACvH,gHAA0F;AAE1F,IAAM,mBAAmB,GAA4B,UAAC,KAAK;IACzD,
|
1
|
+
{"version":3,"file":"IconTileRadioButton.js","sourceRoot":"","sources":["../../../../src/Interfaces/Molecules/IconTileRadioButton/IconTileRadioButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8HAE+E;AAC/E,uIAAuH;AACvH,gHAA0F;AAE1F,IAAM,mBAAmB,GAA4B,UAAC,KAAK;IACzD,QAAQ,KAAK,CAAC,cAAc,EAAE;QAC5B,KAAK,SAAS;YACZ,OAAO,uBAAC,6BAAyB,eAAK,KAAK,EAAI,CAAC;QAClD;YACE,OAAO,uBAAC,6BAA0B,eAAK,KAAK,EAAI,CAAC;KACpD;AACH,CAAC,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,sBAAY,CAAC;AAEhD,kBAAe,mBAAmB,CAAC"}
|