pds-dev-kit-web-test 2.7.338 → 2.7.339
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/dist/src/sub/DynamicLayout/gleStyles.js +1 -1
- package/dist/src/sub/DynamicLayout/mock_fade.json +4266 -203
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js +2 -2
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/hooks/elementPositions.js +2 -1
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/types.d.ts +1 -1
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/hooks/elementPositions.js +2 -1
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBanner.js +2 -3
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomProgressbar.js +1 -1
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.js +2 -2
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/elementPositions.js +2 -1
- package/package.json +1 -1
|
@@ -115,7 +115,7 @@ function ContentsCarousel(props) {
|
|
|
115
115
|
createNextButton(customNavigationNormalStyle, customNavigationHoverStyle, isHovered),
|
|
116
116
|
{
|
|
117
117
|
type: 'PROGRESSBAR',
|
|
118
|
-
position: '
|
|
118
|
+
position: 'INSET_PROGRESS',
|
|
119
119
|
designType: customProgressbarNormalStyle.type || 'NONE'
|
|
120
120
|
}
|
|
121
121
|
].filter(function (component) { return component !== undefined; });
|
|
@@ -161,7 +161,7 @@ function ContentsCarousel(props) {
|
|
|
161
161
|
}
|
|
162
162
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), Object.entries(componentGroups).map(function (_a) {
|
|
163
163
|
var position = _a[0], groupComponents = _a[1];
|
|
164
|
-
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentscarousel-button-group ccb-elements", ref: function (el) {
|
|
164
|
+
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentscarousel-button-group ccb-elements ".concat(position), ref: function (el) {
|
|
165
165
|
if (el) {
|
|
166
166
|
positionRefs.current[position] = el;
|
|
167
167
|
}
|
|
@@ -153,7 +153,8 @@ exports.POS_INSET = {
|
|
|
153
153
|
INSET5: { bottom: GAP, right: GAP },
|
|
154
154
|
INSET6: { bottom: GAP, left: '50%', transform: 'translateX(-50%)' },
|
|
155
155
|
INSET7: { left: GAP, bottom: GAP },
|
|
156
|
-
INSET8: { top: '50%', left: GAP, transform: 'translateY(-50%)' }
|
|
156
|
+
INSET8: { top: '50%', left: GAP, transform: 'translateY(-50%)' },
|
|
157
|
+
INSET_PROGRESS: { bottom: GAP }
|
|
157
158
|
};
|
|
158
159
|
exports.POS_OUTSET_NAVIGATION = {
|
|
159
160
|
OUTSET1: { bottom: 20 },
|
|
@@ -2,7 +2,7 @@ import type { NUMBER_INTEGER } from '../../../../../../../DynamicLayout/sections
|
|
|
2
2
|
import type { SwiperProps } from 'swiper/react';
|
|
3
3
|
export type ContentsCarouselPropsKeys = keyof CB_STYLE_PROP_CONTENTSCAROUSEL_SPECS;
|
|
4
4
|
export type OUTSET_POSTIION = 'OUTSET1' | 'OUTSET2' | 'OUTSET3' | 'OUTSET4' | 'OUTSET5' | 'OUTSET6' | 'OUTSET7' | 'OUTSET8' | 'OUTSET9' | 'OUTSET10' | 'OUTSET11' | 'OUTSET12';
|
|
5
|
-
export type INSET_POSTIION = 'INSET1' | 'INSET2' | 'INSET3' | 'INSET4' | 'INSET5' | 'INSET6' | 'INSET7' | 'INSET8';
|
|
5
|
+
export type INSET_POSTIION = 'INSET1' | 'INSET2' | 'INSET3' | 'INSET4' | 'INSET5' | 'INSET6' | 'INSET7' | 'INSET8' | 'INSET_PROGRESS';
|
|
6
6
|
export type CB_STYLE_PROP_CONTENTSCAROUSEL_SPEC_STYLE_TYPE = 'DESIGN1' | 'DESIGN2';
|
|
7
7
|
export type CB_STYLE_PROP_CONTENTSCAROUSEL_SPEC_ITEMSPACING_TYPE = 'WIDE' | 'NORMAL' | 'NARROW';
|
|
8
8
|
export type CB_STYLE_PROP_CONTENTSCAROUSEL_SPEC_ITEMCURSOR_TYPE = 'ONCE' | 'ALL' | 'SCROLL';
|
|
@@ -24,7 +24,8 @@ exports.POS_INSET = {
|
|
|
24
24
|
INSET5: { bottom: GAP, right: GAP },
|
|
25
25
|
INSET6: { bottom: GAP, left: '50%', transform: 'translateX(-50%)' },
|
|
26
26
|
INSET7: { left: GAP, bottom: GAP },
|
|
27
|
-
INSET8: { top: '50%', left: GAP, transform: 'translateY(-50%)' }
|
|
27
|
+
INSET8: { top: '50%', left: GAP, transform: 'translateY(-50%)' },
|
|
28
|
+
INSET_PROGRESS: { bottom: GAP }
|
|
28
29
|
};
|
|
29
30
|
var POS_OUTSET_PAGINATION = {
|
|
30
31
|
OUTSET1: { bottom: 15 },
|
|
@@ -118,7 +118,7 @@ function SlideBanner(props) {
|
|
|
118
118
|
createPrevButton(customNavigationNormalStyle, customNavigationHoverStyle, isHovered),
|
|
119
119
|
createNextButton(customNavigationNormalStyle, customNavigationHoverStyle, isHovered),
|
|
120
120
|
createPagination(customPaginationNormalStyle, customPaginationHoverStyle, isHovered),
|
|
121
|
-
{ type: 'PROGRESSBAR', position: '
|
|
121
|
+
{ type: 'PROGRESSBAR', position: 'INSET_PROGRESS' }
|
|
122
122
|
].filter(function (component) { return component !== undefined; });
|
|
123
123
|
var _l = (0, useFlexGridLayout_1.useFlexGridLayout)({ components: components }), layoutRef = _l.layoutRef, positionRefs = _l.positionRefs, ccbInset = _l.ccbInset, componentGroups = _l.componentGroups, getPositionStyle = _l.getPositionStyle, getComponentGroupLayout = _l.getComponentGroupLayout;
|
|
124
124
|
var renderElements = function (component, positionStyle) {
|
|
@@ -149,10 +149,9 @@ function SlideBanner(props) {
|
|
|
149
149
|
if (mode === 'EDIT') {
|
|
150
150
|
style.visibility = 'visible';
|
|
151
151
|
}
|
|
152
|
-
console.log(style.boxShadow);
|
|
153
152
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), Object.entries(componentGroups).map(function (_a) {
|
|
154
153
|
var position = _a[0], groupComponents = _a[1];
|
|
155
|
-
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-slidebanner-button-group ccb-elements", ref: function (el) {
|
|
154
|
+
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-slidebanner-button-group ccb-elements ".concat(position), ref: function (el) {
|
|
156
155
|
if (el) {
|
|
157
156
|
positionRefs.current[position] = el;
|
|
158
157
|
}
|
|
@@ -111,7 +111,7 @@ var CustomProgressbar = function (_a) {
|
|
|
111
111
|
return ((0, jsx_runtime_1.jsx)(progressConfigs_1.ProgressDesign1, { progress: progressRender, leftTimeSec: timeLeftRender, progressColor: styles.primaryColor, bufferColor: styles.secondaryColor, size: (_e = styles.size) !== null && _e !== void 0 ? _e : 'MEDIUM' }));
|
|
112
112
|
}
|
|
113
113
|
};
|
|
114
|
-
return ((0, jsx_runtime_1.jsx)(S_ProgressWrapper, __assign({ className: "cb-
|
|
114
|
+
return ((0, jsx_runtime_1.jsx)(S_ProgressWrapper, __assign({ className: "cb-slidebanner-progressbar-wrapper", "$size": styles.size }, { children: renderProgressByType() })));
|
|
115
115
|
};
|
|
116
116
|
exports.CustomProgressbar = CustomProgressbar;
|
|
117
117
|
var S_ProgressWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: fit-content;\n width: max-content;\n"], ["\n height: fit-content;\n width: max-content;\n"])));
|
|
@@ -194,10 +194,10 @@ var S_ProgressDesign6 = styled_components_1.default.div(templateObject_6 || (tem
|
|
|
194
194
|
var bgColor = _a.bgColor;
|
|
195
195
|
return bgColor;
|
|
196
196
|
});
|
|
197
|
-
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:
|
|
197
|
+
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: 100%;\n\n .progress-bar-container {\n background-color: ", ";\n height: ", "px;\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: 100%;\n\n .progress-bar-container {\n background-color: ", ";\n height: ", "px;\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) {
|
|
198
198
|
var barColor = _a.barColor;
|
|
199
199
|
return barColor;
|
|
200
|
-
}, function (
|
|
200
|
+
}, function (_a) {
|
|
201
201
|
var bgColor = _a.bgColor;
|
|
202
202
|
return bgColor;
|
|
203
203
|
}, function (_a) {
|
|
@@ -153,7 +153,8 @@ exports.POS_INSET = {
|
|
|
153
153
|
INSET5: { bottom: GAP, right: GAP },
|
|
154
154
|
INSET6: { bottom: GAP, left: '50%', transform: 'translateX(-50%)' },
|
|
155
155
|
INSET7: { left: GAP, bottom: GAP },
|
|
156
|
-
INSET8: { top: '50%', left: GAP, transform: 'translateY(-50%)' }
|
|
156
|
+
INSET8: { top: '50%', left: GAP, transform: 'translateY(-50%)' },
|
|
157
|
+
INSET_PROGRESS: { bottom: GAP }
|
|
157
158
|
};
|
|
158
159
|
exports.POS_OUTSET_NAVIGATION = {
|
|
159
160
|
OUTSET1: { bottom: 20 },
|