pds-dev-kit-web-test 2.5.419 → 2.5.421

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/slideBannerUtils.js

@@ -21,37 +21,39 @@ function parseSlideBannerStyleToSlideBannerCoreProp(_a) {
     var props = _a.props, device = _a.device;
     var availableSpecCodes = Object.keys(props).filter(function (key) { return !key.includes(':HOVER') && !key.includes(':MOBILE'); });
     return availableSpecCodes.reduce(function (acc, currentKey) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e;
         var keyWithDevice = device === 'DESKTOP' ? currentKey : "".concat(currentKey, ":MOBILE");
         var keyWithHover = "".concat(keyWithDevice.toString(), ":HOVER");
         var slideBannerCorePropertyKey = getSlideBannerCorePropKey(currentKey);
         if (slideBannerCorePropertyKey === 'customStyle') {
             var value = props[keyWithDevice];
             var hoverValue = props[keyWithHover];
+            if (hoverValue === null || hoverValue === undefined) {
+                return {
+                    normalStyle: __assign(__assign({}, acc.normalStyle), (_a = {}, _a[slideBannerCorePropertyKey] = getStyle(value), _a)),
+                    hoverStyle: __assign({}, acc.hoverStyle)
+                };
+            }
             return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), (_a = {}, _a[slideBannerCorePropertyKey] = getStyle(value), _a)),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), (_b = {}, _b[slideBannerCorePropertyKey] = getStyle(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value), _b))
+                normalStyle: __assign(__assign({}, acc.normalStyle), (_b = {}, _b[slideBannerCorePropertyKey] = getStyle(value), _b)),
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), (_c = {}, _c[slideBannerCorePropertyKey] = getStyle(hoverValue), _c))
             };
         }
         if (slideBannerCorePropertyKey === 'useAutoplay') {
             var value = props[keyWithDevice];
             var hoverValue = props[keyWithHover];
             return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { useAutoplay: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { useAutoplay: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                normalStyle: __assign(__assign({}, acc.normalStyle), { useAutoplay: value === true }),
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { useAutoplay: hoverValue === true })
             };
         }
         if (slideBannerCorePropertyKey === 'autoplayDelay') {
             var value = props[keyWithDevice];
             var hoverValue = props[keyWithHover];
             return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { autoplay: {
-                        delay: value * 1000,
-                        disableOnInteraction: false,
-                        pauseOnMouseEnter: true
-                    } }),
+                normalStyle: __assign(__assign({}, acc.normalStyle), { autoplay: { delay: value * 1000, disableOnInteraction: false, pauseOnMouseEnter: true } }),
                 hoverStyle: __assign(__assign({}, acc.hoverStyle), { autoplay: {
-                        delay: (hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) * 1000,
+                        delay: hoverValue * 1000,
                         disableOnInteraction: false,
                         pauseOnMouseEnter: true
                     } })
@@ -61,8 +63,8 @@ function parseSlideBannerStyleToSlideBannerCoreProp(_a) {
             var value = props[keyWithDevice];
             var hoverValue = props[keyWithHover];
             return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), (_c = {}, _c[slideBannerCorePropertyKey] = value, _c)),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), (_d = {}, _d[slideBannerCorePropertyKey] = hoverValue !== null && hoverValue !== void 0 ? hoverValue : value, _d))
+                normalStyle: __assign(__assign({}, acc.normalStyle), (_d = {}, _d[slideBannerCorePropertyKey] = value === false ? false : true, _d)),
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), (_e = {}, _e[slideBannerCorePropertyKey] = hoverValue === false ? false : true, _e))
             };
         }
         return {
@@ -107,10 +109,11 @@ function getStyle(value) {
         case 'DESIGN1':
             return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        height: 100%;\n        width: 100%;\n      "], ["\n        height: 100%;\n        width: 100%;\n      "])));
         case 'DESIGN2': {
-            return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n        height: 100%;\n        width: 100%;\n      "], ["\n        height: 100%;\n        width: 100%;\n      "])));
+            var overlayEffect = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n        background: rgba(255, 255, 255, 0.7);\n        content: '';\n        height: 100%;\n        position: absolute;\n        top: 0; /* \uD22C\uBA85\uB3C4 \uC870\uC808 (0 = \uC644\uC804 \uD22C\uBA85, 1 = \uBD88\uD22C\uBA85) */\n        width: 20%;\n        z-index: 2;\n      "], ["\n        background: rgba(255, 255, 255, 0.7);\n        content: '';\n        height: 100%;\n        position: absolute;\n        top: 0; /* \uD22C\uBA85\uB3C4 \uC870\uC808 (0 = \uC644\uC804 \uD22C\uBA85, 1 = \uBD88\uD22C\uBA85) */\n        width: 20%;\n        z-index: 2;\n      "])));
+            return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        overflow: hidden;\n        position: relative;\n\n        &::before {\n          ", "\n          left: 0;\n        }\n\n        &::after {\n          ", "\n          right: 0;\n        }\n      "], ["\n        overflow: hidden;\n        position: relative;\n\n        &::before {\n          ", "\n          left: 0;\n        }\n\n        &::after {\n          ", "\n          right: 0;\n        }\n      "])), overlayEffect, overlayEffect);
         }
         default: {
-            return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        height: 100%;\n        width: 100%;\n      "], ["\n        height: 100%;\n        width: 100%;\n      "])));
+            return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n        height: 100%;\n        width: 100%;\n      "], ["\n        height: 100%;\n        width: 100%;\n      "])));
         }
     }
 }
@@ -126,7 +129,7 @@ function parseSlideBannerStyleToCustomPaginationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { type: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { type: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { type: hoverValue })
             };
         }
         if (customPaginationPropertyKey === 'offset') {
@@ -134,7 +137,7 @@ function parseSlideBannerStyleToCustomPaginationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { offset: getCustomPaginationOffset(value) }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { offset: getCustomPaginationOffset(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { offset: getCustomPaginationOffset(hoverValue) })
             };
         }
         if (customPaginationPropertyKey === 'size') {
@@ -142,23 +145,7 @@ function parseSlideBannerStyleToCustomPaginationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { size: getCustomPaginationSize(value) }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { size: getCustomPaginationSize(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
-            };
-        }
-        if (customPaginationPropertyKey === 'primaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { primaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { primaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
-            };
-        }
-        if (customPaginationPropertyKey === 'secondaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { secondaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { secondaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { size: getCustomPaginationSize(hoverValue) })
             };
         }
         return {
@@ -188,16 +175,6 @@ function getCustomPaginationPropKey(key) {
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONSIZE:MOBILE":
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONSIZE:MOBILE:HOVER":
             return 'size';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONPRIMARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONPRIMARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONPRIMARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONPRIMARYCOLOR:MOBILE:HOVER":
-            return 'primaryColor';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONSECONDARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONSECONDARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONSECONDARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PAGINATIONSECONDARYCOLOR:MOBILE:HOVER":
-            return 'secondaryColor';
         default:
             return '';
     }
@@ -282,7 +259,7 @@ function getCustomPaginationOffset(value) {
             return {
                 top: '100%',
                 left: '0px',
-                translateX: -100,
+                translateX: -50,
                 translateY: -100,
                 transformOrigin: 'right top'
             };
@@ -290,7 +267,7 @@ function getCustomPaginationOffset(value) {
             return {
                 top: '50%',
                 left: '0px',
-                translateX: -100,
+                translateX: -50,
                 translateY: -50,
                 transformOrigin: 'right top'
             };
@@ -298,13 +275,13 @@ function getCustomPaginationOffset(value) {
             return {
                 top: '0px',
                 left: '0px',
-                translateX: -100,
+                translateX: -50,
                 translateY: 0,
                 transformOrigin: 'right top'
             };
-        case 'INSET1':
+        case 'INSET13':
             return { top: '0px', left: '0px', translateX: 0, translateY: 0, transformOrigin: 'left top' };
-        case 'INSET2':
+        case 'INSET14':
             return {
                 top: '0px',
                 left: '50%',
@@ -312,7 +289,7 @@ function getCustomPaginationOffset(value) {
                 translateY: 0,
                 transformOrigin: 'left top'
             };
-        case 'INSET3':
+        case 'INSET15':
             return {
                 top: '0px',
                 left: '100%',
@@ -320,7 +297,7 @@ function getCustomPaginationOffset(value) {
                 translateY: 0,
                 transformOrigin: 'left top'
             };
-        case 'INSET4':
+        case 'INSET16':
             return {
                 top: '50%',
                 left: '100%',
@@ -328,7 +305,7 @@ function getCustomPaginationOffset(value) {
                 translateY: -50,
                 transformOrigin: 'left top'
             };
-        case 'INSET5':
+        case 'INSET17':
             return {
                 top: '100%',
                 left: '100%',
@@ -336,7 +313,7 @@ function getCustomPaginationOffset(value) {
                 translateY: -100,
                 transformOrigin: 'left top'
             };
-        case 'INSET6':
+        case 'INSET18':
             return {
                 top: '100%',
                 left: '50%',
@@ -344,7 +321,7 @@ function getCustomPaginationOffset(value) {
                 translateY: -100,
                 transformOrigin: 'left top'
             };
-        case 'INSET7':
+        case 'INSET19':
             return {
                 top: '100%',
                 left: '0px',
@@ -352,7 +329,7 @@ function getCustomPaginationOffset(value) {
                 translateY: -100,
                 transformOrigin: 'top left'
             };
-        case 'INSET8':
+        case 'INSET20':
             return {
                 top: '50%',
                 left: '0px',
@@ -369,9 +346,9 @@ function getCustomPaginationSize(value) {
         case 'SMALL':
             return 1;
         case 'MEDIUM':
-            return 1.5;
-        case 'LARGE':
             return 2;
+        case 'LARGE':
+            return 3;
         default:
             return 1;
     }
@@ -388,7 +365,7 @@ function parseSlideBannerStyleToCustomNavigationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { prevBtnType: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnType: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnType: hoverValue })
             };
         }
         if (customNavigationPropertyKey === 'prevBtnOffset') {
@@ -396,7 +373,7 @@ function parseSlideBannerStyleToCustomNavigationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { prevBtnOffset: getCustomNavigationOffset(value) }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnOffset: getCustomNavigationOffset(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnOffset: getCustomNavigationOffset(hoverValue) })
             };
         }
         if (customNavigationPropertyKey === 'prevBtnSize') {
@@ -404,23 +381,7 @@ function parseSlideBannerStyleToCustomNavigationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { prevBtnSize: getCustomNavigationSize(value) }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnSize: getCustomNavigationSize(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
-            };
-        }
-        if (customNavigationPropertyKey === 'prevBtnPrimaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { prevBtnPrimaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnPrimaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
-            };
-        }
-        if (customNavigationPropertyKey === 'prevBtnSecondaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { prevBtnSecondaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnSecondaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { prevBtnSize: getCustomNavigationSize(hoverValue) })
             };
         }
         if (customNavigationPropertyKey === 'nextBtnType') {
@@ -428,7 +389,7 @@ function parseSlideBannerStyleToCustomNavigationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { nextBtnType: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnType: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnType: hoverValue })
             };
         }
         if (customNavigationPropertyKey === 'nextBtnOffset') {
@@ -436,7 +397,7 @@ function parseSlideBannerStyleToCustomNavigationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { nextBtnOffset: getCustomNavigationOffset(value) }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnOffset: getCustomNavigationOffset(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnOffset: getCustomNavigationOffset(hoverValue) })
             };
         }
         if (customNavigationPropertyKey === 'nextBtnSize') {
@@ -444,23 +405,7 @@ function parseSlideBannerStyleToCustomNavigationProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { nextBtnSize: getCustomNavigationSize(value) }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnSize: getCustomNavigationSize(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
-            };
-        }
-        if (customNavigationPropertyKey === 'nextBtnPrimaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { nextBtnPrimaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnPrimaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
-            };
-        }
-        if (customNavigationPropertyKey === 'nextBtnSecondaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { nextBtnSecondaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnSecondaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { nextBtnSize: getCustomNavigationSize(hoverValue) })
             };
         }
         return {
@@ -490,16 +435,6 @@ function getCustomNavigationPropKey(key) {
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNSIZE:MOBILE":
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNSIZE:MOBILE:HOVER":
             return 'prevBtnSize';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNPRIMARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNPRIMARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNPRIMARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNPRIMARYCOLOR:MOBILE:HOVER":
-            return 'prevBtnPrimaryColor';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNSECONDARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNSECONDARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNSECONDARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PREVBTNSECONDARYCOLOR:MOBILE:HOVER":
-            return 'prevBtnSecondaryColor';
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSTYLE":
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSTYLE:HOVER":
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSTYLE:MOBILE":
@@ -515,16 +450,6 @@ function getCustomNavigationPropKey(key) {
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSIZE:MOBILE":
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSIZE:MOBILE:HOVER":
             return 'nextBtnSize';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNPRIMARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNPRIMARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNPRIMARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNPRIMARYCOLOR:MOBILE:HOVER":
-            return 'nextBtnPrimaryColor';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSECONDARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSECONDARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSECONDARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_NEXTBTNSECONDARYCOLOR:MOBILE:HOVER":
-            return 'nextBtnSecondaryColor';
         default:
             return '';
     }
@@ -609,7 +534,7 @@ function getCustomNavigationOffset(value) {
             return {
                 top: '100%',
                 left: '0px',
-                translateX: -100,
+                translateX: -50,
                 translateY: -100,
                 transformOrigin: 'right top'
             };
@@ -617,7 +542,7 @@ function getCustomNavigationOffset(value) {
             return {
                 top: '50%',
                 left: '0px',
-                translateX: -100,
+                translateX: -50,
                 translateY: -50,
                 transformOrigin: 'right top'
             };
@@ -625,13 +550,13 @@ function getCustomNavigationOffset(value) {
             return {
                 top: '0px',
                 left: '0px',
-                translateX: -100,
+                translateX: -50,
                 translateY: 0,
                 transformOrigin: 'right top'
             };
-        case 'INSET1':
+        case 'INSET13':
             return { top: '0px', left: '0px', translateX: 0, translateY: 0, transformOrigin: 'left top' };
-        case 'INSET2':
+        case 'INSET14':
             return {
                 top: '0px',
                 left: '50%',
@@ -639,7 +564,7 @@ function getCustomNavigationOffset(value) {
                 translateY: 0,
                 transformOrigin: 'left top'
             };
-        case 'INSET3':
+        case 'INSET15':
             return {
                 top: '0px',
                 left: '100%',
@@ -647,7 +572,7 @@ function getCustomNavigationOffset(value) {
                 translateY: 0,
                 transformOrigin: 'left top'
             };
-        case 'INSET4':
+        case 'INSET16':
             return {
                 top: '50%',
                 left: '100%',
@@ -655,7 +580,7 @@ function getCustomNavigationOffset(value) {
                 translateY: -50,
                 transformOrigin: 'left top'
             };
-        case 'INSET5':
+        case 'INSET17':
             return {
                 top: '100%',
                 left: '100%',
@@ -663,7 +588,7 @@ function getCustomNavigationOffset(value) {
                 translateY: -100,
                 transformOrigin: 'left top'
             };
-        case 'INSET6':
+        case 'INSET18':
             return {
                 top: '100%',
                 left: '50%',
@@ -671,7 +596,7 @@ function getCustomNavigationOffset(value) {
                 translateY: -100,
                 transformOrigin: 'left top'
             };
-        case 'INSET7':
+        case 'INSET19':
             return {
                 top: '100%',
                 left: '0px',
@@ -679,7 +604,7 @@ function getCustomNavigationOffset(value) {
                 translateY: -100,
                 transformOrigin: 'top left'
             };
-        case 'INSET8':
+        case 'INSET20':
             return {
                 top: '50%',
                 left: '0px',
@@ -696,11 +621,11 @@ function getCustomNavigationSize(value) {
         case 'SMALL':
             return 1;
         case 'MEDIUM':
-            return 1.5;
+            return 2;
         case 'LARGE':
             return 3;
         default:
-            return 2;
+            return 1;
     }
 }
 function parseSlideBannerStyleToCustomProgressbarProp(_a) {
@@ -715,32 +640,16 @@ function parseSlideBannerStyleToCustomProgressbarProp(_a) {
             var hoverValue = props[keyWithHover];
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { type: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { type: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { type: hoverValue })
             };
         }
         if (customProgressbarPropertyKey === 'size') {
             var value = props[keyWithDevice];
             var hoverValue = props[keyWithHover];
-            var offset = getCustomProgressbarOffset('INSET5');
+            var offset = getCustomProgressbarOffset('INSET17');
             return {
                 normalStyle: __assign(__assign({}, acc.normalStyle), { size: getCustomProgressbarSize(value), offset: offset }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { size: getCustomProgressbarSize(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value), offset: offset })
-            };
-        }
-        if (customProgressbarPropertyKey === 'primaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { primaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { primaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
-            };
-        }
-        if (customProgressbarPropertyKey === 'secondaryColor') {
-            var value = props[keyWithDevice];
-            var hoverValue = props[keyWithHover];
-            return {
-                normalStyle: __assign(__assign({}, acc.normalStyle), { secondaryColor: value }),
-                hoverStyle: __assign(__assign({}, acc.hoverStyle), { secondaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), { size: getCustomProgressbarSize(hoverValue), offset: offset })
             };
         }
         return {
@@ -765,16 +674,6 @@ function getCustomProgressbarPropKey(key) {
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARSIZE:MOBILE":
         case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARSIZE:MOBILE:HOVER":
             return 'size';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARPRIMARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARPRIMARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARPRIMARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARPRIMARYCOLOR:MOBILE:HOVER":
-            return 'primaryColor';
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARSECONDARYCOLOR":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARSECONDARYCOLOR:HOVER":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARSECONDARYCOLOR:MOBILE":
-        case "CB_STYLE_PROP_SLIDEBANNER_SPEC_PROGRESSBARSECONDARYCOLOR:MOBILE:HOVER":
-            return 'secondaryColor';
         default:
             return '';
     }
@@ -879,9 +778,9 @@ function getCustomProgressbarOffset(value) {
                 translateY: 0,
                 transformOrigin: 'right top'
             };
-        case 'INSET1':
+        case 'INSET13':
             return { top: '0px', left: '0px', translateX: 0, translateY: 0, transformOrigin: 'left top' };
-        case 'INSET2':
+        case 'INSET14':
             return {
                 top: '0px',
                 left: '50%',
@@ -889,7 +788,7 @@ function getCustomProgressbarOffset(value) {
                 translateY: 0,
                 transformOrigin: 'left top'
             };
-        case 'INSET3':
+        case 'INSET15':
             return {
                 top: '0px',
                 left: '100%',
@@ -897,7 +796,7 @@ function getCustomProgressbarOffset(value) {
                 translateY: 0,
                 transformOrigin: 'left top'
             };
-        case 'INSET4':
+        case 'INSET16':
             return {
                 top: '50%',
                 left: '100%',
@@ -905,7 +804,7 @@ function getCustomProgressbarOffset(value) {
                 translateY: -50,
                 transformOrigin: 'left top'
             };
-        case 'INSET5':
+        case 'INSET17':
             return {
                 top: '100%',
                 left: '100%',
@@ -913,7 +812,7 @@ function getCustomProgressbarOffset(value) {
                 translateY: -100,
                 transformOrigin: 'left top'
             };
-        case 'INSET6':
+        case 'INSET18':
             return {
                 top: '100%',
                 left: '50%',
@@ -921,7 +820,7 @@ function getCustomProgressbarOffset(value) {
                 translateY: -100,
                 transformOrigin: 'left top'
             };
-        case 'INSET7':
+        case 'INSET19':
             return {
                 top: '100%',
                 left: '0px',
@@ -929,7 +828,7 @@ function getCustomProgressbarOffset(value) {
                 translateY: -100,
                 transformOrigin: 'top left'
             };
-        case 'INSET8':
+        case 'INSET20':
             return {
                 top: '50%',
                 left: '0px',
@@ -946,11 +845,11 @@ function getCustomProgressbarSize(value) {
         case 'SMALL':
             return 1;
         case 'MEDIUM':
-            return 1.5;
-        case 'LARGE':
             return 2;
+        case 'LARGE':
+            return 3;
         default:
             return 1;
     }
 }
-var templateObject_1, templateObject_2, templateObject_3;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;