pds-dev-kit-web-test 0.2.20 → 0.2.22

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 (14) hide show
  1. package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js +1 -2
  2. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js +6 -2
  3. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Divider/Divider.js +7 -2
  4. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js +7 -3
  5. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/RichText/RichText.js +6 -2
  6. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js +6 -2
  7. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Twitter/Twitter.js +7 -2
  8. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Youtube/Youtube.js +7 -3
  9. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.d.ts +6 -0
  10. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.js +27 -0
  11. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_Box.js +1 -1
  12. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_BoxWithShadow.js +14 -7
  13. package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/textUtil.js +1 -1
  14. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js CHANGED
@@ -181,8 +181,7 @@ function CustomSection(props) {
181
181
  minWidth: isMobile ? GLE_MIN_WIDTH_MOBILE_PX : GLE_MIN_WIDTH_DESKTOP_PX
182
182
  }, onLayoutChange: onLayoutChange, onDragStop: onDragStop, onResizeStop: onResizeStop, onWidthChange: onWidthChange, minNbRow: rows, isDraggable: isEditMode, isResizable: isEditMode }, { children: (componentBlocks === null || componentBlocks === void 0 ? void 0 : componentBlocks.length) ? (componentBlocks.map(function (each) { return ((0, jsx_runtime_1.jsx)("div", __assign({ className: selectedCB === each.id ? 'react-grid-item-selected' : '' }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ style: {
183
183
  width: '100%',
184
- height: '100%',
185
- overflow: 'hidden'
184
+ height: '100%'
186
185
  }, onClick: function (e) {
187
186
  e.stopPropagation();
188
187
  onClickCB(each.id);
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js CHANGED
@@ -22,6 +22,7 @@ var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection
22
22
  var newUtils_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils");
23
23
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
24
24
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
25
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
25
26
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
26
27
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
27
28
  var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
@@ -41,10 +42,13 @@ function Button(props) {
41
42
  propsStyle.visibility = 'visible';
42
43
  }
43
44
  var cbRef = (0, react_1.useRef)(null);
44
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
45
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
45
46
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
46
47
  var effectCssProperties = isVisible ? effect : {};
47
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, btnTextStyle), propsStyle), layoutStyle), effectCssProperties), btnColorStyle), { cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign({}, btnTextHoverStyle), propsHoverStyle), btnColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK, ref: cbRef }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT }), void 0)] }, void 0));
48
+ var hasEffect = props.CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
49
+ props.CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
50
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
51
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, btnTextStyle), propsStyle), layoutStyle), effectCssProperties), btnColorStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign(__assign({}, btnTextHoverStyle), propsHoverStyle), btnColorHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT }), void 0) }), void 0)] }, void 0));
48
52
  }
49
53
  function getBTNStyles(props, device) {
50
54
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Divider/Divider.js CHANGED
@@ -40,20 +40,25 @@ var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
40
40
  var styled_components_1 = __importStar(require("styled-components"));
41
41
  var hooks_1 = require("../../../../hooks");
42
42
  var util_1 = require("../../../../util");
43
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
43
44
  var S_CB_Box_1 = require("../components/S_CB_Box");
44
45
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
45
46
  function Divider(props) {
46
47
  var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
48
+ var CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
47
49
  var _b = (0, util_1.parseProperties)(props, device), propsStyle = _b.style, propsHoverStyle = _b.hoverStyle, layoutStyle = _b.layout, effect = _b.effect;
48
50
  var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
49
51
  if (mode === 'EDIT') {
50
52
  propsStyle.visibility = 'visible';
51
53
  }
52
54
  var cbRef = (0, react_1.useRef)(null);
53
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
55
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
54
56
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
55
57
  var effectCssProperties = isVisible ? effect : {};
56
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: layoutStyle, hoverStyle: {}, ref: cbRef }, { children: (0, jsx_runtime_1.jsx)(S_DIVIDER, { className: "cb-divider", normalStyle: __assign(__assign({}, propsStyle), effectCssProperties), hoverStyle: __assign({}, propsHoverStyle) }, void 0) }), void 0)] }, void 0));
58
+ var hasEffect = CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
59
+ CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
60
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
61
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: layoutStyle, hoverStyle: {} }, { children: (0, jsx_runtime_1.jsx)(S_DIVIDER, { className: "cb-divider", normalStyle: __assign(__assign({}, propsStyle), effectCssProperties), hoverStyle: __assign({}, propsHoverStyle) }, void 0) }), void 0) }), void 0)] }, void 0));
57
62
  }
58
63
  var S_DIVIDER = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"], ["\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), function (_a) {
59
64
  var normalStyle = _a.normalStyle;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js CHANGED
@@ -43,11 +43,12 @@ var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
43
43
  var styled_components_1 = __importStar(require("styled-components"));
44
44
  var hooks_1 = require("../../../../hooks");
45
45
  var util_1 = require("../../../../util");
46
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
46
47
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
47
48
  var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
48
49
  function Image(props) {
49
50
  var device = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext).device;
50
- var CB_CONTENT_PROP_IMAGE = props.CB_CONTENT_PROP_IMAGE, _a = props.CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CLINK_SPEC_SRC = _a.CB_CONTENT_PROP_CLINK_SPEC_SRC, CB_CONTENT_PROP_CLINK_SPEC_TYPE = _a.CB_CONTENT_PROP_CLINK_SPEC_TYPE, CB_CONTENT_PROP_CLINK_SPEC_NEWTAB = _a.CB_CONTENT_PROP_CLINK_SPEC_NEWTAB, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW;
51
+ var CB_CONTENT_PROP_IMAGE = props.CB_CONTENT_PROP_IMAGE, _a = props.CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CLINK_SPEC_SRC = _a.CB_CONTENT_PROP_CLINK_SPEC_SRC, CB_CONTENT_PROP_CLINK_SPEC_TYPE = _a.CB_CONTENT_PROP_CLINK_SPEC_TYPE, CB_CONTENT_PROP_CLINK_SPEC_NEWTAB = _a.CB_CONTENT_PROP_CLINK_SPEC_NEWTAB, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
51
52
  var _b = (0, useCLINK_1.default)({
52
53
  src: CB_CONTENT_PROP_CLINK_SPEC_SRC,
53
54
  type: CB_CONTENT_PROP_CLINK_SPEC_TYPE,
@@ -55,10 +56,13 @@ function Image(props) {
55
56
  }), onClickCLINK = _b.onClickCLINK, CLINKCursor = _b.CLINKCursor;
56
57
  var _c = (0, util_1.parseProperties)(props, device), style = _c.style, hoverStyle = _c.hoverStyle, layout = _c.layout, effect = _c.effect;
57
58
  var cbRef = (0, react_1.useRef)(null);
58
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
59
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
59
60
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
60
61
  var effectCssProperties = isVisible ? effect : {};
61
- return ((0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign({}, layout), effectCssProperties), { cursor: CLINKCursor }), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, ref: cbRef, onClick: onClickCLINK }, { children: (0, jsx_runtime_1.jsx)(S_Image, __assign({ src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, normalStyle: style, hoverStyle: hoverStyle }, { children: (0, jsx_runtime_1.jsx)("img", { src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, style: { visibility: 'hidden', width: '100%', height: '100%' } }, void 0) }), void 0) }), void 0));
62
+ var hasEffect = CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
63
+ CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
64
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
65
+ return ((0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, layout), effectCssProperties), style), { cursor: CLINKCursor }), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: (0, jsx_runtime_1.jsx)(S_Image, __assign({ src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, normalStyle: style, hoverStyle: hoverStyle }, { children: (0, jsx_runtime_1.jsx)("img", { src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, style: { visibility: 'hidden', width: '100%', height: '100%' } }, void 0) }), void 0) }), void 0) }), void 0));
62
66
  }
63
67
  var S_Image = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-image: ", ";\n background-repeat: no-repeat;\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n\n & img {\n ", ";\n }\n\n &:hover img {\n ", ";\n }\n"], ["\n background-image: ", ";\n background-repeat: no-repeat;\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n\n & img {\n ", ";\n }\n\n &:hover img {\n ", ";\n }\n"])), function (_a) {
64
68
  var src = _a.src;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/RichText/RichText.js CHANGED
@@ -27,6 +27,7 @@ var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection
27
27
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
28
28
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
29
29
  var styled_components_1 = __importDefault(require("styled-components"));
30
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
30
31
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
31
32
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
32
33
  function RichText(props) {
@@ -39,10 +40,13 @@ function RichText(props) {
39
40
  propsStyle.visibility = 'visible';
40
41
  }
41
42
  var cbRef = (0, react_1.useRef)(null);
42
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
43
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
43
44
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
44
45
  var effectCssProperties = isVisible ? effect : {};
45
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(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, ref: cbRef }, { children: (0, jsx_runtime_1.jsx)(S_RichTextWrapper, { children: (0, jsx_runtime_1.jsx)(RichText_1.RichText, { text: props.CB_CONTENT_PROP_TEXTEDIT.CB_CONTENT_PROP_TEXTEDIT_SPEC_EDITOR }, void 0) }, void 0) }), void 0)] }, void 0));
46
+ var hasEffect = props.CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
47
+ props.CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
48
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
49
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(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: (0, jsx_runtime_1.jsx)(S_RichTextWrapper, { children: (0, jsx_runtime_1.jsx)(RichText_1.RichText, { text: props.CB_CONTENT_PROP_TEXTEDIT.CB_CONTENT_PROP_TEXTEDIT_SPEC_EDITOR }, void 0) }, void 0) }), void 0) }), void 0)] }, void 0));
46
50
  }
47
51
  function getBGColorStyles(props, device) {
48
52
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js CHANGED
@@ -21,6 +21,7 @@ var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
21
21
  var hooks_1 = require("../../../../hooks");
22
22
  var textUtil_1 = require("../../../../newUtils/textUtil");
23
23
  var util_1 = require("../../../../util");
24
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
24
25
  var S_CB_Box_1 = require("../components/S_CB_Box");
25
26
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
26
27
  var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
@@ -39,10 +40,13 @@ function Text(props) {
39
40
  propsStyle.visibility = 'visible';
40
41
  }
41
42
  var cbRef = (0, react_1.useRef)(null);
42
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
43
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
43
44
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
44
45
  var effectCssProperties = isVisible ? effect : {};
45
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre', wordBreak: 'keep-all', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre', wordBreak: 'keep-all' }), onClick: onClickCLINK, ref: cbRef }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT }), void 0)] }, void 0));
46
+ var hasEffect = props.CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
47
+ props.CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
48
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
49
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT }), void 0) }), void 0)] }, void 0));
46
50
  }
47
51
  function getTextStyles(props, device) {
48
52
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Twitter/Twitter.js CHANGED
@@ -17,10 +17,12 @@ var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
17
17
  var ComponentBlocks_1 = require("../../../../../../../DynamicLayout/components/ComponentBlocks");
18
18
  var hooks_1 = require("../../../../hooks");
19
19
  var util_1 = require("../../../../util");
20
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
20
21
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
21
22
  function Twitter(props) {
22
23
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
23
24
  var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
25
+ var CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
24
26
  var CB_CONTENT_PROP_TWITTER_SPEC_SRC = props.CB_CONTENT_PROP_TWITTER.CB_CONTENT_PROP_TWITTER_SPEC_SRC, CB_STYLE_PROP_TWITTER_SPEC_THEME = props.CB_STYLE_PROP_TWITTER.CB_STYLE_PROP_TWITTER_SPEC_THEME, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW;
25
27
  var _b = (0, util_1.parseProperties)(props, device), style = _b.style, hoverStyle = _b.hoverStyle, layout = _b.layout, effect = _b.effect;
26
28
  var userId = CB_CONTENT_PROP_TWITTER_SPEC_SRC.replace('https://twitter.com/', '');
@@ -35,10 +37,13 @@ function Twitter(props) {
35
37
  delete layout.justifyContent;
36
38
  }
37
39
  var cbRef = (0, react_1.useRef)(null);
38
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
40
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
39
41
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
40
42
  var effectCssProperties = isVisible ? effect : {};
41
43
  var editModeStyle = mode === 'EDIT' ? { pointerEvents: 'none' } : {};
42
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), { overflowY: 'auto' }), editModeStyle), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, ref: cbRef }, { children: (0, jsx_runtime_1.jsx)(ComponentBlocks_1.TwitterTimeline, { userId: userId, theme: theme }, void 0) }), void 0) }, void 0));
44
+ var hasEffect = CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
45
+ CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
46
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
47
+ return ((0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), { overflowY: 'auto' }), editModeStyle), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(ComponentBlocks_1.TwitterTimeline, { userId: userId, theme: theme }, void 0) }), void 0) }), void 0));
43
48
  }
44
49
  exports.default = Twitter;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Youtube/Youtube.js CHANGED
@@ -25,12 +25,13 @@ var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection
25
25
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
26
26
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
27
27
  var styled_components_1 = __importDefault(require("styled-components"));
28
+ var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
28
29
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
29
30
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
30
31
  var parseYoutubeContentProp_1 = __importDefault(require("./parseYoutubeContentProp"));
31
32
  function Youtube(props) {
32
33
  var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
33
- var CB_CONTENT_PROP_YOUTUBE = props.CB_CONTENT_PROP_YOUTUBE, CB_STYLE_PROP_BGCOLOR = props.CB_STYLE_PROP_BGCOLOR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW;
34
+ var CB_CONTENT_PROP_YOUTUBE = props.CB_CONTENT_PROP_YOUTUBE, 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;
34
35
  var _b = (0, parseYoutubeContentProp_1.default)(CB_CONTENT_PROP_YOUTUBE), youtubeSrc = _b.youtubeSrc, thumbnailSrc = _b.thumbnailSrc, id = _b.id;
35
36
  var isEditMode = mode === 'EDIT';
36
37
  var _c = getBGColorStyles(CB_STYLE_PROP_BGCOLOR, device), bgColorStyle = _c.style, bgColorHoverStyle = _c.hoverStyle;
@@ -40,10 +41,13 @@ function Youtube(props) {
40
41
  propsStyle.visibility = 'visible';
41
42
  }
42
43
  var cbRef = (0, react_1.useRef)(null);
43
- var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 1, freezeOnceVisible: true });
44
+ var entry = (0, hooks_1.useIntersectionObserver)(cbRef, { threshold: 0.2, freezeOnceVisible: false });
44
45
  var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
45
46
  var effectCssProperties = isVisible ? effect : {};
46
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(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, ref: cbRef }, { children: isEditMode ? ((0, jsx_runtime_1.jsxs)(S_ThumbnailBox, { children: [(0, jsx_runtime_1.jsx)(YoutubeButton, {}, void 0), (0, jsx_runtime_1.jsx)(S_Thumbnail, { src: thumbnailSrc }, void 0)] }, void 0)) : ((0, jsx_runtime_1.jsx)(S_Iframe, { title: id, src: youtubeSrc, allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture" }, void 0)) }), void 0)] }, void 0));
47
+ var hasEffect = CB_EFFECT_PROP_ENTANIM.CB_EFFECT_PROP_ENTANIM_SPEC_TYPE !== 'NONE' &&
48
+ CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] !== 'NONE';
49
+ var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
50
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}, void 0), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(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.jsxs)(S_ThumbnailBox, { children: [(0, jsx_runtime_1.jsx)(YoutubeButton, {}, void 0), (0, jsx_runtime_1.jsx)(S_Thumbnail, { src: thumbnailSrc }, void 0)] }, void 0)) : ((0, jsx_runtime_1.jsx)(S_Iframe, { title: id, src: youtubeSrc, allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture" }, void 0)) }), void 0) }), void 0)] }, void 0));
47
51
  }
48
52
  function getBGColorStyles(props, device) {
49
53
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ declare type Props = {
3
+ effectVisibleStyle: React.CSSProperties;
4
+ };
5
+ export declare const S_CB_AnimationObserverBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Props, never>;
6
+ export {};
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_AnimationObserverBox.js ADDED
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ var __assign = (this && this.__assign) || function () {
7
+ __assign = Object.assign || function(t) {
8
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
9
+ s = arguments[i];
10
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
+ t[p] = s[p];
12
+ }
13
+ return t;
14
+ };
15
+ return __assign.apply(this, arguments);
16
+ };
17
+ var __importDefault = (this && this.__importDefault) || function (mod) {
18
+ return (mod && mod.__esModule) ? mod : { "default": mod };
19
+ };
20
+ Object.defineProperty(exports, "__esModule", { value: true });
21
+ exports.S_CB_AnimationObserverBox = void 0;
22
+ var styled_components_1 = __importDefault(require("styled-components"));
23
+ exports.S_CB_AnimationObserverBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n\n ", ";\n"], ["\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (_a) {
24
+ var effectVisibleStyle = _a.effectVisibleStyle;
25
+ return effectVisibleStyle && __assign({}, effectVisibleStyle);
26
+ });
27
+ var templateObject_1;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_Box.js CHANGED
@@ -36,7 +36,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
36
36
  Object.defineProperty(exports, "__esModule", { value: true });
37
37
  exports.S_CB_Box = void 0;
38
38
  var styled_components_1 = __importStar(require("styled-components"));
39
- exports.S_CB_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n overflow: hidden;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"], ["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n overflow: hidden;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), function (_a) {
39
+ exports.S_CB_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"], ["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), function (_a) {
40
40
  var normalStyle = _a.normalStyle;
41
41
  return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign(__assign({}, normalStyle), { boxShadow: '' }));
42
42
  }, function (_a) {
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_CB_BoxWithShadow.js CHANGED
@@ -33,10 +33,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
33
33
  __setModuleDefault(result, mod);
34
34
  return result;
35
35
  };
36
+ var __importDefault = (this && this.__importDefault) || function (mod) {
37
+ return (mod && mod.__esModule) ? mod : { "default": mod };
38
+ };
36
39
  Object.defineProperty(exports, "__esModule", { value: true });
37
40
  exports.S_CB_BoxWithShadow = void 0;
41
+ var isNullOrUndefined_1 = __importDefault(require("../../../../../../../DynamicLayout/sections/CustomSection/util/isNullOrUndefined"));
38
42
  var styled_components_1 = __importStar(require("styled-components"));
39
- exports.S_CB_BoxWithShadow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n overflow: hidden;\n width: 100%;\n\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n\n &:hover {\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n }\n"], ["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n overflow: hidden;\n width: 100%;\n\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n\n &:hover {\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n }\n"])), function (_a) {
43
+ exports.S_CB_BoxWithShadow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n\n &:hover {\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n }\n"], ["\n /*\n Introduced in IE 10.\n See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n */\n\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n\n &:hover {\n ", ";\n\n &:before {\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n border-top-left-radius: ", "px;\n border-top-right-radius: ", "px;\n box-shadow: ", ";\n content: '';\n height: 100%;\n left: 0;\n opacity: ", ";\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 100%;\n }\n }\n"])), function (_a) {
40
44
  var normalStyle = _a.normalStyle;
41
45
  return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign(__assign({}, normalStyle), { boxShadow: '' }));
42
46
  }, function (_a) {
@@ -60,7 +64,9 @@ exports.S_CB_BoxWithShadow = styled_components_1.default.div(templateObject_3 ||
60
64
  case 'DESKTOP':
61
65
  return Number(cbStylePropsShadowSpecs.CB_STYLE_PROP_SHADOW_SPEC_OPACITY) / 100;
62
66
  case 'MOBILE':
63
- return Number(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE']) / 100;
67
+ return (0, isNullOrUndefined_1.default)(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE'])
68
+ ? Number(cbStylePropsShadowSpecs.CB_STYLE_PROP_SHADOW_SPEC_OPACITY) / 100
69
+ : Number(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE']) / 100;
64
70
  }
65
71
  }, function (_a) {
66
72
  var hoverStyle = _a.hoverStyle;
@@ -84,12 +90,13 @@ exports.S_CB_BoxWithShadow = styled_components_1.default.div(templateObject_3 ||
84
90
  var cbStylePropsShadowSpecs = _a.cbStylePropsShadowSpecs, device = _a.device;
85
91
  switch (device) {
86
92
  case 'DESKTOP':
87
- return cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:HOVER']
88
- ? cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:HOVER'] / 100
89
- : cbStylePropsShadowSpecs.CB_STYLE_PROP_SHADOW_SPEC_OPACITY;
93
+ return (0, isNullOrUndefined_1.default)(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:HOVER'])
94
+ ? Number(cbStylePropsShadowSpecs.CB_STYLE_PROP_SHADOW_SPEC_OPACITY) / 100
95
+ : Number(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:HOVER']) / 100;
90
96
  case 'MOBILE':
91
- return (Number(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE:HOVER']) /
92
- 100);
97
+ return (0, isNullOrUndefined_1.default)(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE'])
98
+ ? Number(cbStylePropsShadowSpecs.CB_STYLE_PROP_SHADOW_SPEC_OPACITY) / 100
99
+ : Number(cbStylePropsShadowSpecs['CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE']) / 100;
93
100
  }
94
101
  });
95
102
  var templateObject_1, templateObject_2, templateObject_3;
package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/textUtil.js CHANGED
@@ -169,7 +169,7 @@ function getFontName(value) {
169
169
  case 'SYSSERIF':
170
170
  return 'serif';
171
171
  case 'PRETENDARD':
172
- return 'Pretendard-Regular';
172
+ return 'Pretendard-Regular, sans-serif';
173
173
  default:
174
174
  return '';
175
175
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "0.2.20",
3
+ "version": "0.2.22",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",