pds-dev-kit-web-test 2.7.272 → 2.7.273

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 (5) hide show
  1. package/dist/src/sub/DynamicLayout/mock_contentsCarousel.js +6388 -6375
  2. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js +25 -7
  3. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/ContentsList.js +21 -3
  4. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBanner.js +27 -7
  5. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js CHANGED
@@ -29,6 +29,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
29
29
  Object.defineProperty(exports, "__esModule", { value: true });
30
30
  var jsx_runtime_1 = require("react/jsx-runtime");
31
31
  var react_1 = require("react");
32
+ var react_i18next_1 = require("react-i18next");
32
33
  var CustomSectionBackgroundMedia_1 = require("../../../../../../../DynamicLayout/components/Section/components/CustomSectionBackgroundMedia");
33
34
  var createCompositions_1 = require("../../../../../../../DynamicLayout/CompositionRenderer/createCompositions");
34
35
  var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamicLayoutContext");
@@ -166,7 +167,7 @@ function ContentsCarousel(props) {
166
167
  }) })) }), position));
167
168
  }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () {
168
169
  setIsHovered(true);
169
- }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-columns": displayCounts, "data-number-of-items": displayCounts, "data-column-gap": columnGap, "data-cols": displayCounts, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), (0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-contentscarousel-layout-box", ref: layoutRef, style: __assign({}, pointerEventsObj) }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-contentscarousel-wrapper", ccbInset: ccbInset, customStyle: isHovered
170
+ }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-columns": displayCounts, "data-number-of-items": displayCounts, "data-column-gap": columnGap, "data-cols": displayCounts, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-contentscarousel-layout-box", ref: layoutRef, style: __assign({}, pointerEventsObj) }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-contentscarousel-wrapper", ccbInset: ccbInset, customStyle: isHovered
170
171
  ? contentsCarouselHoverStyle === null || contentsCarouselHoverStyle === void 0 ? void 0 : contentsCarouselHoverStyle.customStyle
171
172
  : contentsCarouselNormalStyle === null || contentsCarouselNormalStyle === void 0 ? void 0 : contentsCarouselNormalStyle.customStyle, style: {
172
173
  display: layout.display,
@@ -180,9 +181,26 @@ function ContentsCarousel(props) {
180
181
  compositions: orderedCompositions
181
182
  }) }), CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE +
182
183
  autoPlayEnabled +
183
- orderedCompositions.length) })) }))] })) }))] }));
184
+ orderedCompositions.length) })) }))) : ((0, jsx_runtime_1.jsx)(EmptyString, {}))] })) }))] }));
184
185
  }
185
- var S_Overlay = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"], ["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"])));
186
+ function EmptyString() {
187
+ var t = (0, react_i18next_1.useTranslation)('translation').t;
188
+ return (0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: t('str_9806') });
189
+ }
190
+ var S_EmptyLayer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: rgba(0, 0, 0, 0.6);\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin: auto;\n padding: ", ";\n text-align: center;\n word-break: keep-all;\n"], ["\n background-color: rgba(0, 0, 0, 0.6);\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin: auto;\n padding: ", ";\n text-align: center;\n word-break: keep-all;\n"])), function (_a) {
191
+ var theme = _a.theme;
192
+ return theme.desktopFontSize.body2;
193
+ }, function (_a) {
194
+ var theme = _a.theme;
195
+ return theme.fontWeight.bold;
196
+ }, function (_a) {
197
+ var theme = _a.theme;
198
+ return theme.desktopLineHeight.body2;
199
+ }, function (_a) {
200
+ var theme = _a.theme;
201
+ return theme.spacing.spacingE;
202
+ });
203
+ var S_Overlay = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"], ["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"])));
186
204
  function getIsBgMedia(isMobile, specs) {
187
205
  if (!specs) {
188
206
  return false;
@@ -203,8 +221,8 @@ function getMediaType(isMobile, specs) {
203
221
  }
204
222
  return specs.CB_STYLE_PROP_BGMEDIA_SPEC_TYPE;
205
223
  }
206
- var S_SwiperLayout = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"], ["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"])));
207
- var S_SwiperWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"], ["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"])), function (_a) {
224
+ var S_SwiperLayout = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"], ["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"])));
225
+ var S_SwiperWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"], ["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"])), function (_a) {
208
226
  var ccbInset = _a.ccbInset;
209
227
  return ccbInset.bottom;
210
228
  }, function (_a) {
@@ -220,6 +238,6 @@ var S_SwiperWrapper = styled_components_1.default.div(templateObject_3 || (templ
220
238
  var customStyle = _a.customStyle;
221
239
  return customStyle;
222
240
  });
223
- var S_CustomBackgroundWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"], ["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"])));
241
+ var S_CustomBackgroundWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"], ["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"])));
224
242
  exports.default = ContentsCarousel;
225
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
243
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/ContentsList.js CHANGED
@@ -30,6 +30,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
30
30
  var jsx_runtime_1 = require("react/jsx-runtime");
31
31
  /* eslint-disable @typescript-eslint/no-unused-vars */
32
32
  var react_1 = require("react");
33
+ var react_i18next_1 = require("react-i18next");
33
34
  var CustomSectionBackgroundMedia_1 = require("../../../../../../../DynamicLayout/components/Section/components/CustomSectionBackgroundMedia");
34
35
  var createCompositions_1 = require("../../../../../../../DynamicLayout/CompositionRenderer/createCompositions");
35
36
  var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamicLayoutContext");
@@ -179,7 +180,7 @@ function ContentsList(props) {
179
180
  }, style: __assign(__assign({}, getPositionStyle(position, ccbInset, 'GROUP', 'GROUP', 'GROUP')), { zIndex: 3, position: 'absolute' }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-layout-box", style: getComponentGroupLayout(groupComponents, position) }, { children: groupComponents.map(function (component) {
180
181
  return renderElements(component, getPositionStyle(position, ccbInset, component.designType, component.size, component.type));
181
182
  }) })) }), position));
182
- }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ id: "contentslist-box", className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-items": CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length, "data-number-of-columns": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-row-gap": rowGap, "data-column-gap": columnGap, "data-cols": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-min-width": listMinWidth, "data-min-height": listMinHeight, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), (0, jsx_runtime_1.jsx)(S_ContentsListLayout, __assign({ className: "cb-contentslist-layout-box", ref: layoutRef, style: {
183
+ }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ id: "contentslist-box", className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-items": CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length, "data-number-of-columns": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-row-gap": rowGap, "data-column-gap": columnGap, "data-cols": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-min-width": listMinWidth, "data-min-height": listMinHeight, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_ContentsListLayout, __assign({ className: "cb-contentslist-layout-box", ref: layoutRef, style: {
183
184
  display: layout.display,
184
185
  flexDirection: layout.flexDirection,
185
186
  justifyContent: layout.justifyContent
@@ -191,7 +192,7 @@ function ContentsList(props) {
191
192
  limit: displayCounts,
192
193
  queryData: queryData,
193
194
  compositions: orderedCompositions
194
- }).slice(startIndex, endIndex + 1) })) }))] })) }))] }));
195
+ }).slice(startIndex, endIndex + 1) })) }))) : ((0, jsx_runtime_1.jsx)(EmptyString, {}))] })) }))] }));
195
196
  }
196
197
  function getIsBgMedia(isMobile, specs) {
197
198
  if (!specs) {
@@ -281,5 +282,22 @@ function getCompositionMinValue(composition, device) {
281
282
  };
282
283
  }
283
284
  }
285
+ function EmptyString() {
286
+ var t = (0, react_i18next_1.useTranslation)('translation').t;
287
+ return (0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: t('str_9806') });
288
+ }
289
+ var S_EmptyLayer = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: rgba(0, 0, 0, 0.6);\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin: auto;\n padding: ", ";\n text-align: center;\n word-break: keep-all;\n"], ["\n background-color: rgba(0, 0, 0, 0.6);\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin: auto;\n padding: ", ";\n text-align: center;\n word-break: keep-all;\n"])), function (_a) {
290
+ var theme = _a.theme;
291
+ return theme.desktopFontSize.body2;
292
+ }, function (_a) {
293
+ var theme = _a.theme;
294
+ return theme.fontWeight.bold;
295
+ }, function (_a) {
296
+ var theme = _a.theme;
297
+ return theme.desktopLineHeight.body2;
298
+ }, function (_a) {
299
+ var theme = _a.theme;
300
+ return theme.spacing.spacingE;
301
+ });
284
302
  exports.default = ContentsList;
285
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
303
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBanner.js CHANGED
@@ -29,6 +29,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
29
29
  Object.defineProperty(exports, "__esModule", { value: true });
30
30
  var jsx_runtime_1 = require("react/jsx-runtime");
31
31
  var react_1 = require("react");
32
+ var react_i18next_1 = require("react-i18next");
32
33
  var CustomSectionBackgroundMedia_1 = require("../../../../../../../DynamicLayout/components/Section/components/CustomSectionBackgroundMedia");
33
34
  var createCompositions_1 = require("../../../../../../../DynamicLayout/CompositionRenderer/createCompositions");
34
35
  var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamicLayoutContext");
@@ -154,7 +155,9 @@ function SlideBanner(props) {
154
155
  }, style: __assign(__assign({}, getPositionStyle(position, ccbInset, 'GROUP', 'GROUP', 'GROUP')), { zIndex: 3, position: 'absolute' }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-slidebanner-button-layout-box", style: getComponentGroupLayout(groupComponents, position) }, { children: groupComponents.map(function (component) {
155
156
  return renderElements(component, getPositionStyle(position, ccbInset, component.designType, component.size, component.type));
156
157
  }) })) }), position));
157
- }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), (0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-slidebanner-layout-box", ref: layoutRef }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-slidebanner-wrapper", ccbInset: ccbInset, customStyle: isHovered ? slideBannerHoverStyle === null || slideBannerHoverStyle === void 0 ? void 0 : slideBannerHoverStyle.customStyle : slideBannerNormalStyle === null || slideBannerNormalStyle === void 0 ? void 0 : slideBannerNormalStyle.customStyle }, { children: (0, jsx_runtime_1.jsx)(SlideBannerCore_1.default, __assign({ ref: swiperRef, className: "cb-slidebanner", onSwiper: onSwiper, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onAutoplayTimeLeft: onAutoplayTimeLeft, slidesPerView: 1, styles: isHovered ? slideBannerHoverStyle : slideBannerNormalStyle, effect: CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE.toLowerCase() }, { children: (0, createCompositions_1.createCompositions)({
158
+ }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-slidebanner-layout-box", ref: layoutRef }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-slidebanner-wrapper", ccbInset: ccbInset, customStyle: isHovered
159
+ ? slideBannerHoverStyle === null || slideBannerHoverStyle === void 0 ? void 0 : slideBannerHoverStyle.customStyle
160
+ : slideBannerNormalStyle === null || slideBannerNormalStyle === void 0 ? void 0 : slideBannerNormalStyle.customStyle }, { children: (0, jsx_runtime_1.jsx)(SlideBannerCore_1.default, __assign({ ref: swiperRef, className: "cb-slidebanner", onSwiper: onSwiper, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onAutoplayTimeLeft: onAutoplayTimeLeft, slidesPerView: 1, styles: isHovered ? slideBannerHoverStyle : slideBannerNormalStyle, effect: CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE.toLowerCase() }, { children: (0, createCompositions_1.createCompositions)({
158
161
  valueType: CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE,
159
162
  queryPath: CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA,
160
163
  limit: CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS,
@@ -162,10 +165,27 @@ function SlideBanner(props) {
162
165
  compositions: orderedCompositions
163
166
  }) }), CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE +
164
167
  autoPlayEnabled +
165
- orderedCompositions.length) })) }))] })) }))] }));
168
+ orderedCompositions.length) })) }))) : ((0, jsx_runtime_1.jsx)(EmptyString, {}))] })) }))] }));
166
169
  }
167
- var S_Overlay = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"], ["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"])));
168
- var S_CustomBackgroundWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"], ["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"])));
170
+ function EmptyString() {
171
+ var t = (0, react_i18next_1.useTranslation)('translation').t;
172
+ return (0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: t('str_9806') });
173
+ }
174
+ var S_EmptyLayer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: rgba(0, 0, 0, 0.6);\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin: auto;\n padding: ", ";\n text-align: center;\n word-break: keep-all;\n"], ["\n background-color: rgba(0, 0, 0, 0.6);\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin: auto;\n padding: ", ";\n text-align: center;\n word-break: keep-all;\n"])), function (_a) {
175
+ var theme = _a.theme;
176
+ return theme.desktopFontSize.body2;
177
+ }, function (_a) {
178
+ var theme = _a.theme;
179
+ return theme.fontWeight.bold;
180
+ }, function (_a) {
181
+ var theme = _a.theme;
182
+ return theme.desktopLineHeight.body2;
183
+ }, function (_a) {
184
+ var theme = _a.theme;
185
+ return theme.spacing.spacingE;
186
+ });
187
+ var S_Overlay = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"], ["\n border-radius: inherit;\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n"])));
188
+ var S_CustomBackgroundWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"], ["\n align-items: center;\n border-radius: inherit;\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n overflow: hidden;\n position: absolute;\n right: 0;\n top: 0;\n z-index: -2;\n"])));
169
189
  function getIsBgMedia(isMobile, specs) {
170
190
  if (!specs) {
171
191
  return false;
@@ -186,8 +206,8 @@ function getMediaType(isMobile, specs) {
186
206
  }
187
207
  return specs.CB_STYLE_PROP_BGMEDIA_SPEC_TYPE;
188
208
  }
189
- var S_SwiperLayout = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"], ["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"])));
190
- var S_SwiperWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"], ["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"])), function (_a) {
209
+ var S_SwiperLayout = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"], ["\n height: 100%;\n margin: 0 auto;\n position: relative;\n width: 100%;\n"])));
210
+ var S_SwiperWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"], ["\n bottom: ", ";\n left: ", ";\n position: absolute;\n right: ", ";\n top: ", ";\n ", ";\n"])), function (_a) {
191
211
  var ccbInset = _a.ccbInset;
192
212
  return ccbInset.bottom;
193
213
  }, function (_a) {
@@ -204,4 +224,4 @@ var S_SwiperWrapper = styled_components_1.default.div(templateObject_4 || (templ
204
224
  return customStyle;
205
225
  });
206
226
  exports.default = SlideBanner;
207
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
227
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "2.7.272",
3
+ "version": "2.7.273",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",