pds-dev-kit-web-test 2.5.407 → 2.5.408

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.d.ts

@@ -1,27 +0,0 @@
-/// <reference types="react" />
-export declare const ProgressDesign1: ({ progress, leftTimeSec }: {
-    progress: number;
-    leftTimeSec: number;
-}) => JSX.Element;
-export declare const ProgressDesign2: ({ progress, leftTimeSec }: {
-    progress: number;
-    leftTimeSec: number;
-}) => JSX.Element;
-export declare const ProgressDesign3: ({ progress }: {
-    progress: number;
-}) => JSX.Element;
-export declare const ProgressDesign4: ({ progress }: {
-    progress: number;
-}) => JSX.Element;
-export declare const ProgressDesign5: ({ progress }: {
-    progress: number;
-}) => JSX.Element;
-export declare const ProgressDesign6: ({ progress }: {
-    progress: number;
-}) => JSX.Element;
-export declare const ProgressDesign7: ({ progress }: {
-    progress: number;
-}) => JSX.Element;
-export declare const ProgressDesign8: ({ progress }: {
-    progress: number;
-}) => JSX.Element;

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

@@ -1,96 +0,0 @@
-"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.ProgressDesign8 = exports.ProgressDesign7 = exports.ProgressDesign6 = exports.ProgressDesign5 = exports.ProgressDesign4 = exports.ProgressDesign3 = exports.ProgressDesign2 = exports.ProgressDesign1 = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-var styled_components_1 = __importDefault(require("styled-components"));
-var ProgressDesign1 = function (_a) {
-    var progress = _a.progress, leftTimeSec = _a.leftTimeSec;
-    return ((0, jsx_runtime_1.jsxs)(S_ProgressDesign1, { children: [(0, jsx_runtime_1.jsxs)("svg", __assign({ viewBox: "0 0 48 48", style: {
-                    '--progress': 1 - progress,
-                    transition: 'all 0.03s ease-out'
-                } }, { children: [(0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "bg-circle" }), (0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "progress-circle" })] })), (0, jsx_runtime_1.jsx)("span", { children: Math.ceil(leftTimeSec) })] }));
-};
-exports.ProgressDesign1 = ProgressDesign1;
-var ProgressDesign2 = function (_a) {
-    var progress = _a.progress, leftTimeSec = _a.leftTimeSec;
-    return ((0, jsx_runtime_1.jsxs)(S_ProgressDesign2, { children: [(0, jsx_runtime_1.jsxs)("svg", __assign({ viewBox: "0 0 48 48", style: {
-                    '--progress': 1 - progress,
-                    transition: 'all 0.03s linear'
-                } }, { children: [(0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "bg-circle" }), (0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "progress-circle" })] })), (0, jsx_runtime_1.jsx)("span", { children: Math.ceil(leftTimeSec) })] }));
-};
-exports.ProgressDesign2 = ProgressDesign2;
-var ProgressDesign3 = function (_a) {
-    var progress = _a.progress;
-    return ((0, jsx_runtime_1.jsx)(S_ProgressDesign3, { children: (0, jsx_runtime_1.jsxs)("svg", __assign({ viewBox: "0 0 48 48", style: {
-                '--progress': 1 - progress,
-                transition: 'all 0.03s ease-out'
-            } }, { children: [(0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "bg-circle" }), (0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "progress-circle" })] })) }));
-};
-exports.ProgressDesign3 = ProgressDesign3;
-var ProgressDesign4 = function (_a) {
-    var progress = _a.progress;
-    return ((0, jsx_runtime_1.jsx)(S_ProgressDesign4, { children: (0, jsx_runtime_1.jsxs)("svg", __assign({ viewBox: "0 0 48 48", style: {
-                '--progress': 1 - progress,
-                transition: 'all 0.03s linear'
-            } }, { children: [(0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "bg-circle" }), (0, jsx_runtime_1.jsx)("circle", { cx: "24", cy: "24", r: "20", className: "progress-circle" })] })) }));
-};
-exports.ProgressDesign4 = ProgressDesign4;
-var ProgressDesign5 = function (_a) {
-    var progress = _a.progress;
-    return ((0, jsx_runtime_1.jsx)(S_ProgressDesign5, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "progress-bar-container" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "progress-bar-fill", style: {
-                    '--progress': 1 - progress,
-                    transition: 'all 0.03s ease-out'
-                } }) })) }));
-};
-exports.ProgressDesign5 = ProgressDesign5;
-var ProgressDesign6 = function (_a) {
-    var progress = _a.progress;
-    return ((0, jsx_runtime_1.jsx)(S_ProgressDesign6, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "progress-bar-container" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "progress-bar-fill", style: {
-                    '--progress': 1 - progress,
-                    transition: 'all 0.03s ease-out'
-                } }) })) }));
-};
-exports.ProgressDesign6 = ProgressDesign6;
-var ProgressDesign7 = function (_a) {
-    var progress = _a.progress;
-    return ((0, jsx_runtime_1.jsx)(S_ProgressDesign7, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "progress-bar-container" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "progress-bar-fill", style: {
-                    '--progress': 1 - progress,
-                    transition: 'all 0.03s ease-out'
-                } }) })) }));
-};
-exports.ProgressDesign7 = ProgressDesign7;
-var ProgressDesign8 = function (_a) {
-    var progress = _a.progress;
-    return ((0, jsx_runtime_1.jsx)(S_ProgressDesign8, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "progress-bar-container" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "progress-bar-fill", style: {
-                    '--progress': 1 - progress,
-                    transition: 'all 0.03s ease-out'
-                } }) })) }));
-};
-exports.ProgressDesign8 = ProgressDesign8;
-var S_ProgressDesign1 = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #ffffff;\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: rgba(255, 255, 255, 0.2);\n      stroke-dasharray: none;\n      stroke-width: 4px;\n    }\n  }\n"], ["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #ffffff;\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: rgba(255, 255, 255, 0.2);\n      stroke-dasharray: none;\n      stroke-width: 4px;\n    }\n  }\n"])));
-var S_ProgressDesign2 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  align-items: center;\n  color: #333333;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #333333;\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: rgba(0, 0, 0, 0.2);\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: #333333;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #333333;\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: rgba(0, 0, 0, 0.2);\n      stroke-dasharray: none;\n      stroke-width: 4px;\n    }\n  }\n\n  span {\n    font-size: 11px;\n    z-index: 11;\n  }\n"])));
-var S_ProgressDesign3 = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #ffffff;\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: rgba(255, 255, 255, 0.2);\n      stroke-dasharray: none;\n      stroke-width: 4px;\n    }\n  }\n"], ["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #ffffff;\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: rgba(255, 255, 255, 0.2);\n      stroke-dasharray: none;\n      stroke-width: 4px;\n    }\n  }\n"])));
-var S_ProgressDesign4 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  color: #333333;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #333333;\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: rgba(0, 0, 0, 0.2);\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: #333333;\n  display: flex;\n  font-weight: bold;\n  height: 48px;\n  justify-content: center;\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: #333333;\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: rgba(0, 0, 0, 0.2);\n      stroke-dasharray: none;\n      stroke-width: 4px;\n    }\n  }\n\n  span {\n    font-size: 11px;\n    z-index: 11;\n  }\n"])));
-var S_ProgressDesign5 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(255, 255, 255, 0.2);\n    border-radius: 3px;\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #ffffff;\n    border-radius: 3px;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"], ["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(255, 255, 255, 0.2);\n    border-radius: 3px;\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #ffffff;\n    border-radius: 3px;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"])));
-var S_ProgressDesign6 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  align-items: center;\n  color: #333333;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(0, 0, 0, 0.2);\n    border-radius: 3px;\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #333333;\n    border-radius: 3px;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"], ["\n  align-items: center;\n  color: #333333;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(0, 0, 0, 0.2);\n    border-radius: 3px;\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #333333;\n    border-radius: 3px;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"])));
-var S_ProgressDesign7 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(255, 255, 255, 0.2);\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #ffffff;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"], ["\n  align-items: center;\n  color: #ffffff;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(255, 255, 255, 0.2);\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #ffffff;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"])));
-var S_ProgressDesign8 = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  align-items: center;\n  color: #333333;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(0, 0, 0, 0.2);\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #333333;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"], ["\n  align-items: center;\n  color: #333333;\n  display: flex;\n  flex-direction: column;\n  font-weight: bold;\n  padding-bottom: 12px;\n  padding-right: 12px;\n  width: 80px;\n\n  .progress-bar-container {\n    background-color: rgba(0, 0, 0, 0.2);\n    height: 6px;\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n  }\n\n  .progress-bar-fill {\n    background-color: #333333;\n    height: 100%;\n    transition: width 0.1s ease-out;\n    width: calc(var(--progress) * 100%);\n  }\n"])));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/VideoPlayer.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import type { CB_VIDEOPLAYER_PROPERTIES_TYPE, IndexForIntersection } from '../../../../../../../DynamicLayout/sections/CustomSection/util/types';
-type Props = CB_VIDEOPLAYER_PROPERTIES_TYPE & IndexForIntersection;
-declare function VideoPlayer(props: Props): JSX.Element;
-export default VideoPlayer;

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

@@ -1,148 +0,0 @@
-"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 });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var Icon_1 = require("../../../../../../../DynamicLayout/components/pdsOriginal/hybrid/Icon");
-var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamicLayoutContext");
-var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/hooks");
-var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
-var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
-var styled_components_1 = __importDefault(require("styled-components"));
-var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
-var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
-var S_HiddenCover_1 = require("../components/S_HiddenCover");
-var helper_1 = require("./helper");
-function VideoPlayer(props) {
-    var _a = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
-    var CB_CONTENT_PROP_VIDEO = props.CB_CONTENT_PROP_VIDEO;
-    var index = props.index, CB_STYLE_PROP_BGCOLOR = props.CB_STYLE_PROP_BGCOLOR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
-    var isEditMode = mode === 'EDIT';
-    var _b = getBGColorStyles(CB_STYLE_PROP_BGCOLOR, device), bgColorStyle = _b.style, bgColorHoverStyle = _b.hoverStyle;
-    var _c = (0, util_1.parseProperties)(props, device), propsStyle = _c.style, propsHoverStyle = _c.hoverStyle, layoutStyle = _c.layout, effect = _c.effect;
-    var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
-    if (mode === 'EDIT') {
-        propsStyle.visibility = 'visible';
-    }
-    var cbRef = (0, react_1.useRef)(null);
-    var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false }, [
-        index
-    ]);
-    var _d = (0, react_1.useState)(false), videoStarted = _d[0], setVideoStarted = _d[1];
-    var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
-    var effectCssProperties = isVisible ? effect : {};
-    var isNoneEffectType = device === 'DESKTOP'
-        ? CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE === 'NONE'
-        : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
-    var hasEffect = !isNoneEffectType;
-    var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
-    var CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR = CB_CONTENT_PROP_VIDEO.CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR, CB_CONTENT_PROP_VIDEO_SPEC_STARTTIME = CB_CONTENT_PROP_VIDEO.CB_CONTENT_PROP_VIDEO_SPEC_STARTTIME, CB_CONTENT_PROP_VIDEO_SPEC_THUMB = CB_CONTENT_PROP_VIDEO.CB_CONTENT_PROP_VIDEO_SPEC_THUMB, CB_CONTENT_PROP_VIDEO_SPEC_MAUTOPLAY = CB_CONTENT_PROP_VIDEO.CB_CONTENT_PROP_VIDEO_SPEC_MAUTOPLAY, CB_CONTENT_PROP_VIDEO_SPEC_AUTOPLAY = CB_CONTENT_PROP_VIDEO.CB_CONTENT_PROP_VIDEO_SPEC_AUTOPLAY;
-    var shouldAutoplay = (CB_CONTENT_PROP_VIDEO_SPEC_AUTOPLAY && device === 'DESKTOP') ||
-        (CB_CONTENT_PROP_VIDEO_SPEC_MAUTOPLAY && device === 'MOBILE');
-    var videoRef = (0, react_1.useRef)(null);
-    var _e = (0, react_1.useState)(false), videoLoaded = _e[0], setVideoLoaded = _e[1];
-    var _f = (0, react_1.useState)(function () {
-        return (0, helper_1.parseTargetUrl)(CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR).encodedURL;
-    }), videoURL = _f[0], setVideoURL = _f[1];
-    var onVideoError = function () {
-        var fallbackURL = (0, helper_1.parseTargetUrl)(CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR).fallbackURL;
-        var isFallbackURL = fallbackURL === videoURL;
-        if (fallbackURL && !isFallbackURL) {
-            setVideoURL(fallbackURL);
-            return;
-        }
-    };
-    var onLoadedMetadata = function () {
-        setVideoLoaded(true);
-    };
-    var onPlay = function () {
-        var video = videoRef.current;
-        if (!video || isEditMode || videoStarted || shouldAutoplay) {
-            return;
-        }
-        if (typeof CB_CONTENT_PROP_VIDEO_SPEC_STARTTIME === 'number') {
-            video.currentTime = CB_CONTENT_PROP_VIDEO_SPEC_STARTTIME;
-            setVideoStarted(true);
-        }
-    };
-    (0, react_1.useEffect)(function () {
-        var video = videoRef.current;
-        if (!video || isEditMode || !videoLoaded || !shouldAutoplay) {
-            return;
-        }
-        var handleIntersection = function (entries) {
-            entries.forEach(function (entry) {
-                if (entry.isIntersecting) {
-                    if (typeof CB_CONTENT_PROP_VIDEO_SPEC_STARTTIME === 'number') {
-                        video.currentTime = CB_CONTENT_PROP_VIDEO_SPEC_STARTTIME;
-                    }
-                    video.muted = true;
-                    video.play().catch(function (err) {
-                        // eslint-disable-next-line no-console
-                        console.error('Error: CB VIDEO_PLAYER:', err);
-                    });
-                }
-                else {
-                    video.pause();
-                }
-            });
-        };
-        var observer = new IntersectionObserver(handleIntersection, {
-            threshold: 0.2
-        });
-        observer.observe(video);
-        return function () {
-            observer.disconnect();
-        };
-    }, [videoLoaded, isEditMode, shouldAutoplay]);
-    (0, react_1.useEffect)(function () {
-        setVideoURL((0, helper_1.parseTargetUrl)(CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR).encodedURL);
-    }, [CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (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", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: [isEditMode && ((0, jsx_runtime_1.jsx)("div", __assign({ style: {
-                                position: 'absolute',
-                                top: '50%',
-                                left: '50%',
-                                width: '100%',
-                                height: '100%',
-                                display: 'flex',
-                                alignItems: 'center',
-                                justifyContent: 'center',
-                                transform: 'translate(-50%, -50%)'
-                            } }, { children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { iconName: "ic_video_play_circle", fillType: "fill", colorKey: "ui_cpnt_icon_sys_white", size: 48 }) }))), (0, jsx_runtime_1.jsxs)(S_Video, __assign({ muted: true, playsInline: true, controls: !isEditMode, isEditMode: isEditMode, ref: videoRef, poster: CB_CONTENT_PROP_VIDEO_SPEC_THUMB, onLoadedMetadata: onLoadedMetadata, onPlay: onPlay, onError: onVideoError, "data-src": CB_CONTENT_PROP_VIDEO_SPEC_SELECTOR }, { children: [(0, jsx_runtime_1.jsx)("source", { src: videoURL }), "Your browser does not support the video tag."] }), videoURL + CB_CONTENT_PROP_VIDEO_SPEC_THUMB)] })) }))] }));
-}
-function getBGColorStyles(props, device) {
-    var availableSpecCodes = [
-        'CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_COLOR',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC',
-        'CB_STYLE_PROP_BGCOLOR_SPEC_TYPE'
-    ];
-    return (0, colorUtil_1.parseStyleColorToCSSProp)({ availableSpecCodes: availableSpecCodes, props: props, propKey: 'BGCOLOR', device: device });
-}
-var S_Video = styled_components_1.default.video(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  aspect-ratio: 16 / 9;\n  height: 100%;\n  max-height: 100%;\n  object-fit: cover;\n  pointer-events: ", ";\n  width: 100%;\n"], ["\n  aspect-ratio: 16 / 9;\n  height: 100%;\n  max-height: 100%;\n  object-fit: cover;\n  pointer-events: ", ";\n  width: 100%;\n"])), function (_a) {
-    var isEditMode = _a.isEditMode;
-    return (isEditMode ? 'none' : 'auto');
-});
-exports.default = VideoPlayer;
-var templateObject_1;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/helper.d.ts

@@ -1,4 +0,0 @@
-export declare function parseTargetUrl(url: string): {
-    encodedURL: string;
-    fallbackURL: string | null;
-};

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/helper.js

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseTargetUrl = void 0;
-function parseTargetUrl(url) {
-    var _a = url.split('?'), encodedURL = _a[0], query = _a[1];
-    if (!query) {
-        return {
-            encodedURL: encodedURL,
-            fallbackURL: null
-        };
-    }
-    var params = new URLSearchParams(query);
-    var fallbackUrl = params.get('fallbackUrl');
-    if (!fallbackUrl) {
-        return {
-            encodedURL: encodedURL,
-            fallbackURL: null
-        };
-    }
-    return {
-        encodedURL: encodedURL,
-        fallbackURL: "http://".concat(fallbackUrl)
-    };
-}
-exports.parseTargetUrl = parseTargetUrl;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/index.d.ts

@@ -1 +0,0 @@
-export { default as VideoPlayer } from './VideoPlayer';

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/index.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.VideoPlayer = void 0;
-var VideoPlayer_1 = require("./VideoPlayer");
-Object.defineProperty(exports, "VideoPlayer", { enumerable: true, get: function () { return __importDefault(VideoPlayer_1).default; } });