pds-dev-kit-web-test 0.2.2 → 0.2.4

package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackgroundMedia.js

@@ -0,0 +1,68 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CustomSectionBackgroundMedia = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable @typescript-eslint/no-unused-vars */
+var react_1 = require("react");
+var styled_components_1 = __importDefault(require("styled-components"));
+var pdsOriginal_1 = require("../../pdsOriginal");
+var YouTubeIframe_1 = require("../../YouTubeIframe");
+function CustomSectionBackgroundMedia(_a) {
+    var specs = _a.specs, playerId = _a.playerId, mediaType = _a.mediaType;
+    var CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME = specs.CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT = specs.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION = specs.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR = specs.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR, CB_STYLE_PROP_BGMEDIA_SPEC_MPLAY = specs.CB_STYLE_PROP_BGMEDIA_SPEC_MPLAY, CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY = specs.CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY, CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL = specs.CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL, CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME = specs.CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME, CB_STYLE_PROP_BGMEDIA_SPEC_YSRC = specs.CB_STYLE_PROP_BGMEDIA_SPEC_YSRC;
+    var scaleType = (0, react_1.useMemo)(function () {
+        switch (CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT) {
+            case 'FILL':
+                return 'fill';
+            case 'CONTAIN':
+                return 'contain';
+            case 'COVER':
+                return 'cover';
+            case 'NONE':
+                return 'none';
+            default:
+                return undefined;
+        }
+    }, [CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT]);
+    switch (mediaType) {
+        case 'IMAGE':
+            return ((0, jsx_runtime_1.jsx)(S_ImageWrapper, __assign({ isOverflowScroll: CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL, scaleType: scaleType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR, width: "responsive", height: "responsive", scaleType: scaleType, shapeType: "rectangle" }, void 0) }), void 0));
+        case 'YOUTUBE':
+            return ((0, jsx_runtime_1.jsx)(S_YoutubeContainer, { children: (0, jsx_runtime_1.jsx)(YouTubeIframe_1.YouTubeIframe, { id: playerId, src: CB_STYLE_PROP_BGMEDIA_SPEC_YSRC }, void 0) }, void 0));
+        default:
+            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+    }
+}
+exports.CustomSectionBackgroundMedia = CustomSectionBackgroundMedia;
+var S_ImageWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  overflow: ", ";\n\n  ", ";\n"], ["\n  overflow: ", ";\n\n  ", ";\n"])), function (_a) {
+    var isOverflowScroll = _a.isOverflowScroll;
+    return (isOverflowScroll ? 'scroll' : 'hidden');
+}, function (_a) {
+    var scaleType = _a.scaleType;
+    switch (scaleType) {
+        case 'cover':
+            return "height: 100%;\n        width: 100%;";
+        default:
+            return "height: auto;\n        width: auto";
+    }
+});
+var S_YoutubeContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 100%;\n  width: 100%;\n"], ["\n  height: 100%;\n  width: 100%;\n"])));
+var templateObject_1, templateObject_2;

package/dist/src/sub/DynamicLayout/components/SectionMatcher/SectionMatcher.js

@@ -23,10 +23,12 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var CustomSection_1 = require("../../../DynamicLayout/sections/CustomSection");
 var sections_1 = require("../../sections");
 function SectionMatcher(_a) {
     var props = __rest(_a, []);
+    if (props.type === 'CUSTOM') {
+        return (0, jsx_runtime_1.jsx)(sections_1.CustomSection, __assign({}, props), void 0);
+    }
     var schema = props.manifest.schema;
     switch (schema) {
         case 'BASE_INTRO':
@@ -43,10 +45,8 @@ function SectionMatcher(_a) {
             return (0, jsx_runtime_1.jsx)(sections_1.FullscreenIframeSection, __assign({}, props), void 0);
         case 'PRG_MEMBERSHIP_DISPLAY':
             return (0, jsx_runtime_1.jsx)(sections_1.NormalTypeMembershipSection, __assign({}, props), void 0);
-        case 'CUSTOM_SECTION':
-            return (0, jsx_runtime_1.jsx)(CustomSection_1.CustomSection, __assign({}, props), void 0);
         default:
-            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "ERROR: Schema NOT FOUND" }, void 0);
     }
 }
 exports.default = SectionMatcher;

package/dist/src/sub/DynamicLayout/components/desktop/common/Carousel.d.ts

@@ -11,7 +11,6 @@ interface Carousel {
     mode?: 'normal' | 'loop' | 'autoplay';
     autoplayDelay?: number;
     buttonSpacing?: string;
-    allowTouchMove?: boolean;
 }
-declare function Carousel({ children, spaceBetween, slidesPerView, slidesPerGroup, breakpoints, mode, autoplayDelay, buttonSpacing, allowTouchMove }: Carousel): JSX.Element;
+declare function Carousel({ children, spaceBetween, slidesPerView, slidesPerGroup, breakpoints, mode, autoplayDelay, buttonSpacing }: Carousel): JSX.Element;
 export default Carousel;

package/dist/src/sub/DynamicLayout/components/desktop/common/Carousel.js

@@ -45,12 +45,12 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var pdsOriginal_1 = require("../../pdsOriginal");
 var swiper_style_1 = __importDefault(require("./swiper.style"));
 function Carousel(_a) {
-    var children = _a.children, spaceBetween = _a.spaceBetween, slidesPerView = _a.slidesPerView, slidesPerGroup = _a.slidesPerGroup, breakpoints = _a.breakpoints, _b = _a.mode, mode = _b === void 0 ? 'normal' : _b, _c = _a.autoplayDelay, autoplayDelay = _c === void 0 ? 3 : _c, buttonSpacing = _a.buttonSpacing, _d = _a.allowTouchMove, allowTouchMove = _d === void 0 ? true : _d;
+    var children = _a.children, spaceBetween = _a.spaceBetween, slidesPerView = _a.slidesPerView, slidesPerGroup = _a.slidesPerGroup, breakpoints = _a.breakpoints, _b = _a.mode, mode = _b === void 0 ? 'normal' : _b, _c = _a.autoplayDelay, autoplayDelay = _c === void 0 ? 3 : _c, buttonSpacing = _a.buttonSpacing;
     var swiperRef = (0, react_1.useRef)(null);
-    var _e = (0, react_1.useState)(true), isBeginning = _e[0], setIsBeginning = _e[1];
-    var _f = (0, react_1.useState)(true), isEnd = _f[0], setIsEnd = _f[1];
-    var _g = (0, react_1.useState)(true), isLocked = _g[0], setIsLocked = _g[1];
-    var _h = (0, react_1.useState)(mode), targetMode = _h[0], setTargetMode = _h[1];
+    var _d = (0, react_1.useState)(true), isBeginning = _d[0], setIsBeginning = _d[1];
+    var _e = (0, react_1.useState)(true), isEnd = _e[0], setIsEnd = _e[1];
+    var _f = (0, react_1.useState)(true), isLocked = _f[0], setIsLocked = _f[1];
+    var _g = (0, react_1.useState)(mode), targetMode = _g[0], setTargetMode = _g[1];
     /**
      * @when : 캐러셀이 처음 화면에 렌더링될 때
      * @expected
@@ -66,7 +66,7 @@ function Carousel(_a) {
         }
         setTargetMode(mode);
     }, [slidesPerView, mode, children]);
-    return ((0, jsx_runtime_1.jsxs)(S_Carousel, { children: [(0, jsx_runtime_1.jsx)(S_SwiperStyleWrapper, { children: (0, jsx_runtime_1.jsx)(react_2.Swiper, __assign({ allowTouchMove: allowTouchMove, modules: [swiper_1.Navigation, swiper_1.Autoplay], centerInsufficientSlides: true, spaceBetween: spaceBetween, slidesPerView: slidesPerView, slidesPerGroup: slidesPerGroup, breakpoints: breakpoints, loop: targetMode === 'loop' || targetMode === 'autoplay', autoplay: targetMode === 'autoplay'
+    return ((0, jsx_runtime_1.jsxs)(S_Carousel, { children: [(0, jsx_runtime_1.jsx)(S_SwiperStyleWrapper, { children: (0, jsx_runtime_1.jsx)(react_2.Swiper, __assign({ modules: [swiper_1.Navigation, swiper_1.Autoplay], centerInsufficientSlides: true, spaceBetween: spaceBetween, slidesPerView: slidesPerView, slidesPerGroup: slidesPerGroup, breakpoints: breakpoints, loop: targetMode === 'loop' || targetMode === 'autoplay', autoplay: targetMode === 'autoplay'
                         ? { delay: autoplayDelay * 1000, disableOnInteraction: false }
                         : undefined, onSwiper: function (swiper) {
                         swiperRef.current = swiper;

package/dist/src/sub/DynamicLayout/components/index.d.ts

@@ -1,3 +1,2 @@
 export * from './pdsOriginal';
 export { Section } from './Section';
-export { default as Box } from './Box';

package/dist/src/sub/DynamicLayout/components/index.js

@@ -9,13 +9,8 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Box = exports.Section = void 0;
+exports.Section = void 0;
 __exportStar(require("./pdsOriginal"), exports);
 var Section_1 = require("./Section");
 Object.defineProperty(exports, "Section", { enumerable: true, get: function () { return Section_1.Section; } });
-var Box_1 = require("./Box");
-Object.defineProperty(exports, "Box", { enumerable: true, get: function () { return __importDefault(Box_1).default; } });

package/dist/src/sub/DynamicLayout/mock_customSection.d.ts

@@ -0,0 +1,2 @@
+import type { ISection } from './types';
+export declare const customSectionMock1: ISection;