pds-dev-kit-web-test 2.7.213 → 2.7.214

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.
@@ -307,7 +307,7 @@ exports.SAMPLE_CONTENTSCAROUSEL_CB = {
307
307
  'CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD_SPEC_INFINITESCROLL:MOBILE': null
308
308
  },
309
309
  CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR: {
310
- CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR_SPEC_PROGRESSBAR: 'DESIGN1',
310
+ CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR_SPEC_PROGRESSBAR: 'DESIGN7',
311
311
  'CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR_SPEC_PROGRESSBAR:MOBILE': null,
312
312
  CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR_SPEC_PROGRESSBARPRIMARYCOLOR: 'rgba(239, 69, 69, 1)',
313
313
  'CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR_SPEC_PROGRESSBARPRIMARYCOLOR:MOBILE': null,
@@ -81,7 +81,7 @@ var CustomProgressbar = function (_a) {
81
81
  case 'DESIGN6':
82
82
  return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign6, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
83
83
  case 'DESIGN7':
84
- return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign7, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
84
+ return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign7, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor, sizeEnum: styles.size }));
85
85
  case 'DESIGN8':
86
86
  return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign8, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
87
87
  default:
@@ -37,11 +37,12 @@ export declare const ProgressDesign6: ({ progress, progressColor, bufferColor, s
37
37
  bufferColor?: string | undefined;
38
38
  size: number;
39
39
  }) => JSX.Element;
40
- export declare const ProgressDesign7: ({ progress, progressColor, bufferColor, size }: {
40
+ export declare const ProgressDesign7: ({ progress, progressColor, bufferColor, size, sizeEnum }: {
41
41
  progress: number;
42
42
  progressColor?: string | undefined;
43
43
  bufferColor?: string | undefined;
44
44
  size: number;
45
+ sizeEnum?: "SMALL" | "MEDIUM" | "LARGE" | undefined;
45
46
  }) => JSX.Element;
46
47
  export declare const ProgressDesign8: ({ progress, progressColor, bufferColor, size }: {
47
48
  progress: number;
@@ -70,8 +70,8 @@ var ProgressDesign6 = function (_a) {
70
70
  };
71
71
  exports.ProgressDesign6 = ProgressDesign6;
72
72
  var ProgressDesign7 = function (_a) {
73
- var progress = _a.progress, progressColor = _a.progressColor, bufferColor = _a.bufferColor, size = _a.size;
74
- return ((0, jsx_runtime_1.jsx)(S_ProgressDesign7, __assign({ size: size, className: "cb-contentscarousel-progressbar-design7", barColor: progressColor, bgColor: bufferColor }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "progress-bar-container" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "progress-bar-fill", style: {
73
+ var progress = _a.progress, progressColor = _a.progressColor, bufferColor = _a.bufferColor, size = _a.size, sizeEnum = _a.sizeEnum;
74
+ return ((0, jsx_runtime_1.jsx)(S_ProgressDesign7, __assign({ size: size, sizeEnum: sizeEnum, className: "cb-contentscarousel-progressbar-design7", barColor: progressColor, bgColor: bufferColor }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "progress-bar-container" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "progress-bar-fill", style: {
75
75
  '--progress': 1 - progress,
76
76
  transition: 'all 0.03s ease-out'
77
77
  } }) })) })));
@@ -94,7 +94,7 @@ var S_ProgressDesign1 = styled_components_1.default.div(templateObject_1 || (tem
94
94
  }, function (props) { return props.size; }, function (props) { return props.size; }, function (_a) {
95
95
  var bgColor = _a.bgColor;
96
96
  return bgColor;
97
- }, function (props) { return Math.floor(props.size / 4); });
97
+ }, function (props) { return Math.floor(props.size / 2); });
98
98
  var S_ProgressDesign2 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n color: ", ";\n display: flex;\n font-weight: bold;\n height: 48px;\n justify-content: center;\n position: relative;\n width: 48px;\n svg {\n --progress: 0;\n fill: none;\n height: calc(100% - 10px);\n left: 5px;\n position: absolute;\n stroke: ", ";\n stroke-dasharray: 125.6;\n stroke-dashoffset: calc(125.6px * (1 - var(--progress)));\n stroke-width: 4px;\n top: 5px;\n transform: rotate(-90deg);\n width: calc(100% - 10px);\n z-index: 10;\n\n .bg-circle {\n stroke: ", ";\n stroke-dasharray: none;\n stroke-width: 4px;\n }\n }\n\n span {\n font-size: 11px;\n z-index: 11;\n }\n"], ["\n align-items: center;\n color: ", ";\n display: flex;\n font-weight: bold;\n height: 48px;\n justify-content: center;\n position: relative;\n width: 48px;\n svg {\n --progress: 0;\n fill: none;\n height: calc(100% - 10px);\n left: 5px;\n position: absolute;\n stroke: ", ";\n stroke-dasharray: 125.6;\n stroke-dashoffset: calc(125.6px * (1 - var(--progress)));\n stroke-width: 4px;\n top: 5px;\n transform: rotate(-90deg);\n width: calc(100% - 10px);\n z-index: 10;\n\n .bg-circle {\n stroke: ", ";\n stroke-dasharray: none;\n stroke-width: 4px;\n }\n }\n\n span {\n font-size: 11px;\n z-index: 11;\n }\n"])), function (_a) {
99
99
  var barColor = _a.barColor;
100
100
  return barColor;
@@ -139,12 +139,18 @@ var S_ProgressDesign6 = styled_components_1.default.div(templateObject_6 || (tem
139
139
  var bgColor = _a.bgColor;
140
140
  return bgColor;
141
141
  });
142
- var S_ProgressDesign7 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-items: center;\n color: ", ";\n display: flex;\n flex-direction: column;\n font-weight: bold;\n width: 80px;\n\n .progress-bar-container {\n background-color: ", ";\n height: 6px;\n overflow: hidden;\n position: relative;\n width: 100%;\n }\n\n .progress-bar-fill {\n background-color: ", ";\n height: 100%;\n transition: width 0.1s ease-out;\n width: calc(var(--progress) * 100%);\n }\n"], ["\n align-items: center;\n color: ", ";\n display: flex;\n flex-direction: column;\n font-weight: bold;\n width: 80px;\n\n .progress-bar-container {\n background-color: ", ";\n height: 6px;\n overflow: hidden;\n position: relative;\n width: 100%;\n }\n\n .progress-bar-fill {\n background-color: ", ";\n height: 100%;\n transition: width 0.1s ease-out;\n width: calc(var(--progress) * 100%);\n }\n"])), function (_a) {
142
+ var S_ProgressDesign7 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-items: center;\n color: ", ";\n display: flex;\n flex-direction: column;\n font-weight: bold;\n width: ", ";\n\n .progress-bar-container {\n background-color: ", ";\n height: ", ";\n overflow: hidden;\n position: relative;\n width: 100%;\n }\n\n .progress-bar-fill {\n background-color: ", ";\n height: 100%;\n transition: width 0.1s ease-out;\n width: calc(var(--progress) * 100%);\n }\n"], ["\n align-items: center;\n color: ", ";\n display: flex;\n flex-direction: column;\n font-weight: bold;\n width: ", ";\n\n .progress-bar-container {\n background-color: ", ";\n height: ", ";\n overflow: hidden;\n position: relative;\n width: 100%;\n }\n\n .progress-bar-fill {\n background-color: ", ";\n height: 100%;\n transition: width 0.1s ease-out;\n width: calc(var(--progress) * 100%);\n }\n"])), function (_a) {
143
143
  var barColor = _a.barColor;
144
144
  return barColor;
145
+ }, function (_a) {
146
+ var sizeEnum = _a.sizeEnum;
147
+ return sizeEnum === 'LARGE' ? '120px' : sizeEnum === 'SMALL' ? '60px' : '80px';
145
148
  }, function (_a) {
146
149
  var bgColor = _a.bgColor;
147
150
  return bgColor;
151
+ }, function (_a) {
152
+ var sizeEnum = _a.sizeEnum;
153
+ return sizeEnum === 'LARGE' ? '8px' : sizeEnum === 'SMALL' ? '5px' : '6px';
148
154
  }, function (_a) {
149
155
  var barColor = _a.barColor;
150
156
  return barColor;
@@ -102,7 +102,7 @@ var S_ProgressDesign1 = styled_components_1.default.div(templateObject_1 || (tem
102
102
  return bgColor;
103
103
  }, function (_a) {
104
104
  var size = _a.size;
105
- return Math.floor(size / 4);
105
+ return Math.floor(size / 2);
106
106
  });
107
107
  var S_ProgressDesign2 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n color: ", ";\n display: flex;\n font-weight: bold;\n height: 48px;\n justify-content: center;\n position: relative;\n width: 48px;\n\n svg {\n --progress: 0;\n fill: none;\n height: calc(100% - 10px);\n left: 5px;\n position: absolute;\n stroke: ", ";\n stroke-dasharray: 125.6;\n stroke-dashoffset: calc(125.6px * (1 - var(--progress)));\n stroke-width: 4px;\n top: 5px;\n transform: rotate(-90deg);\n width: calc(100% - 10px);\n z-index: 10;\n\n .bg-circle {\n stroke: ", ";\n stroke-dasharray: none;\n stroke-width: 4px;\n }\n }\n\n span {\n font-size: 11px;\n z-index: 11;\n }\n"], ["\n align-items: center;\n color: ", ";\n display: flex;\n font-weight: bold;\n height: 48px;\n justify-content: center;\n position: relative;\n width: 48px;\n\n svg {\n --progress: 0;\n fill: none;\n height: calc(100% - 10px);\n left: 5px;\n position: absolute;\n stroke: ", ";\n stroke-dasharray: 125.6;\n stroke-dashoffset: calc(125.6px * (1 - var(--progress)));\n stroke-width: 4px;\n top: 5px;\n transform: rotate(-90deg);\n width: calc(100% - 10px);\n z-index: 10;\n\n .bg-circle {\n stroke: ", ";\n stroke-dasharray: none;\n stroke-width: 4px;\n }\n }\n\n span {\n font-size: 11px;\n z-index: 11;\n }\n"])), function (_a) {
108
108
  var barColor = _a.barColor;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "2.7.213",
3
+ "version": "2.7.214",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",