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

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.
Files changed (8) hide show
  1. package/dist/src/sub/DynamicLayout/mock_contentsCarousel.js +1 -1
  2. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomProgressbar.js +1 -1
  3. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.d.ts +2 -1
  4. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.js +10 -4
  5. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomProgressbar.js +2 -1
  6. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.d.ts +2 -1
  7. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.js +10 -4
  8. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/mock_contentsCarousel.js CHANGED
@@ -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,
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomProgressbar.js CHANGED
@@ -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:
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.d.ts CHANGED
@@ -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;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.js CHANGED
@@ -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;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomProgressbar.js CHANGED
@@ -56,6 +56,7 @@ var CustomProgressbar = function (_a) {
56
56
  return function () { return cancelAnimationFrame(animationId); };
57
57
  }, []);
58
58
  var renderProgressByType = function () {
59
+ var _a;
59
60
  // const buttonSize: IconButtonProps['baseSize'] = 'large';
60
61
  var iconSize = 36;
61
62
  if (styles.size === 'SMALL') {
@@ -82,7 +83,7 @@ var CustomProgressbar = function (_a) {
82
83
  case 'DESIGN6':
83
84
  return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign6, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
84
85
  case 'DESIGN7':
85
- return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign7, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
86
+ return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign7, { size: iconSize, sizeEnum: (_a = styles.size) !== null && _a !== void 0 ? _a : 'MEDIUM', progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
86
87
  case 'DESIGN8':
87
88
  return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign8, { size: iconSize, progress: progress, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor }));
88
89
  default:
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.d.ts CHANGED
@@ -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';
45
46
  }) => JSX.Element;
46
47
  export declare const ProgressDesign8: ({ progress, progressColor, bufferColor, size }: {
47
48
  progress: number;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.js CHANGED
@@ -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, 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({ sizeEnum: sizeEnum, size: size, 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
  } }) })) })));
@@ -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;
@@ -148,12 +148,18 @@ var S_ProgressDesign6 = styled_components_1.default.div(templateObject_6 || (tem
148
148
  var bgColor = _a.bgColor;
149
149
  return bgColor;
150
150
  });
151
- 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) {
151
+ 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) {
152
152
  var barColor = _a.barColor;
153
153
  return barColor;
154
+ }, function (_a) {
155
+ var sizeEnum = _a.sizeEnum;
156
+ return sizeEnum === 'LARGE' ? '120px' : sizeEnum === 'SMALL' ? '60px' : '80px';
154
157
  }, function (_a) {
155
158
  var bgColor = _a.bgColor;
156
159
  return bgColor;
160
+ }, function (_a) {
161
+ var sizeEnum = _a.sizeEnum;
162
+ return sizeEnum === 'LARGE' ? '8px' : sizeEnum === 'SMALL' ? '5px' : '6px';
157
163
  }, function (_a) {
158
164
  var barColor = _a.barColor;
159
165
  return 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.215",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",