pds-dev-kit-web-test 2.7.298 → 2.7.300
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.
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js +1 -1
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js +27 -10
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_HeightFitContentCover.d.ts +3 -0
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_HeightFitContentCover.js +13 -0
- package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/types.d.ts +1 -0
- package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parsePlacement.d.ts +1 -1
- package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parsePlacement.js +2 -2
- package/package.json +1 -2
|
@@ -173,7 +173,7 @@ function ContentsCarousel(props) {
|
|
|
173
173
|
display: layout.display,
|
|
174
174
|
flexDirection: layout.flexDirection,
|
|
175
175
|
justifyContent: layout.justifyContent
|
|
176
|
-
} }, { children: (0, jsx_runtime_1.jsx)(ContentsCarouselCore_1.default, __assign({ ref: swiperRef, className: "cb-contentscarousel", allowTouchMove: mode !== 'EDIT' ? true : false, onSwiper: onSwiper, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onAutoplayTimeLeft: onAutoplayTimeLeft, slidesPerView:
|
|
176
|
+
} }, { children: (0, jsx_runtime_1.jsx)(ContentsCarouselCore_1.default, __assign({ ref: swiperRef, className: "cb-contentscarousel", allowTouchMove: mode !== 'EDIT' ? true : false, onSwiper: onSwiper, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onAutoplayTimeLeft: onAutoplayTimeLeft, slidesPerView: displayCounts, styles: isHovered ? contentsCarouselHoverStyle : contentsCarouselNormalStyle, effect: CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE === null || CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE === void 0 ? void 0 : CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE.toLowerCase() }, { children: (0, createCompositions_1.createCompositions)({
|
|
177
177
|
valueType: CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE,
|
|
178
178
|
queryPath: CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA,
|
|
179
179
|
limit: displayCounts,
|
|
@@ -26,13 +26,28 @@ var textUtil_1 = require("../../../../newUtils/textUtil");
|
|
|
26
26
|
var util_1 = require("../../../../util");
|
|
27
27
|
var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
|
|
28
28
|
var S_CB_Box_1 = require("../components/S_CB_Box");
|
|
29
|
+
var S_HeightFitContentCover_1 = require("../components/S_HeightFitContentCover");
|
|
29
30
|
var S_HiddenCover_1 = require("../components/S_HiddenCover");
|
|
30
31
|
var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
|
|
31
32
|
var textSpecFormatOptions_1 = require("./textSpecFormatOptions");
|
|
32
33
|
function Text(props) {
|
|
33
|
-
var _a
|
|
34
|
+
var _a, _b, _c, _d;
|
|
35
|
+
var _e = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _e.device, mode = _e.mode;
|
|
34
36
|
var queryContext = (0, compositionQueryContext_1.useCCBQueryPath)();
|
|
35
|
-
var index = props.index,
|
|
37
|
+
var index = props.index, _f = props.CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CLINK_SPEC_SRC = _f.CB_CONTENT_PROP_CLINK_SPEC_SRC, CB_CONTENT_PROP_CLINK_SPEC_TYPE = _f.CB_CONTENT_PROP_CLINK_SPEC_TYPE, CB_CONTENT_PROP_CLINK_SPEC_NEWTAB = _f.CB_CONTENT_PROP_CLINK_SPEC_NEWTAB, CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC = _f.CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC, CB_CONTENT_PROP_CLINK_SPEC_VALUETYPE = _f.CB_CONTENT_PROP_CLINK_SPEC_VALUETYPE, CB_CONTENT_PROP_CLINK_SPEC_CONNECTDATA = _f.CB_CONTENT_PROP_CLINK_SPEC_CONNECTDATA, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, _g = props.CB_CONTENT_PROP_TEXT, CB_CONTENT_PROP_TEXT_SPEC_VALUETYPE = _g.CB_CONTENT_PROP_TEXT_SPEC_VALUETYPE, CB_CONTENT_PROP_TEXT_SPEC_CONNECTDATA = _g.CB_CONTENT_PROP_TEXT_SPEC_CONNECTDATA, CB_CONTENT_PROP_TEXTOPTION = props.CB_CONTENT_PROP_TEXTOPTION;
|
|
38
|
+
// const {
|
|
39
|
+
// CB_CONTENT_PROP_TEXTOPTION_SPEC_SUFFIX,
|
|
40
|
+
// CB_CONTENT_PROP_TEXTOPTION_SPEC_PREFIX,
|
|
41
|
+
// CB_CONTENT_PROP_TEXTOPTION_SPEC_FORMAT
|
|
42
|
+
// } = CB_CONTENT_PROP_TEXTOPTION ?? {
|
|
43
|
+
// CB_CONTENT_PROP_TEXTOPTION_SPEC_SUFFIX: '',
|
|
44
|
+
// CB_CONTENT_PROP_TEXTOPTION_SPEC_PREFIX: '',
|
|
45
|
+
// CB_CONTENT_PROP_TEXTOPTION_SPEC_FORMAT: 'NONE'
|
|
46
|
+
// };
|
|
47
|
+
var textSuffix = (_a = CB_CONTENT_PROP_TEXTOPTION === null || CB_CONTENT_PROP_TEXTOPTION === void 0 ? void 0 : CB_CONTENT_PROP_TEXTOPTION.CB_CONTENT_PROP_TEXTOPTION_SPEC_SUFFIX) !== null && _a !== void 0 ? _a : '';
|
|
48
|
+
var textPrefix = (_b = CB_CONTENT_PROP_TEXTOPTION === null || CB_CONTENT_PROP_TEXTOPTION === void 0 ? void 0 : CB_CONTENT_PROP_TEXTOPTION.CB_CONTENT_PROP_TEXTOPTION_SPEC_PREFIX) !== null && _b !== void 0 ? _b : '';
|
|
49
|
+
var textFormat = (_c = CB_CONTENT_PROP_TEXTOPTION === null || CB_CONTENT_PROP_TEXTOPTION === void 0 ? void 0 : CB_CONTENT_PROP_TEXTOPTION.CB_CONTENT_PROP_TEXTOPTION_SPEC_FORMAT) !== null && _c !== void 0 ? _c : 'NONE';
|
|
50
|
+
var heightFitContent = (_d = CB_CONTENT_PROP_TEXTOPTION === null || CB_CONTENT_PROP_TEXTOPTION === void 0 ? void 0 : CB_CONTENT_PROP_TEXTOPTION.CB_CONTENT_PROP_TEXTOPTION_SPEC_FITCONTENT) !== null && _d !== void 0 ? _d : false;
|
|
36
51
|
var cLinkValue = function () {
|
|
37
52
|
if (CB_CONTENT_PROP_CLINK_SPEC_VALUETYPE === 'DATA' ||
|
|
38
53
|
CB_CONTENT_PROP_CLINK_SPEC_VALUETYPE === 'DELEGATEDDATA') {
|
|
@@ -47,15 +62,16 @@ function Text(props) {
|
|
|
47
62
|
}
|
|
48
63
|
return CB_CONTENT_PROP_CLINK_SPEC_SRC;
|
|
49
64
|
};
|
|
50
|
-
var
|
|
65
|
+
var _h = (0, useCLINK_1.default)({
|
|
51
66
|
src: cLinkValue(),
|
|
52
67
|
type: CB_CONTENT_PROP_CLINK_SPEC_TYPE,
|
|
53
68
|
openNewTab: CB_CONTENT_PROP_CLINK_SPEC_NEWTAB,
|
|
54
69
|
internalSrc: String(CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC)
|
|
55
|
-
}), CLINKCursor =
|
|
56
|
-
var
|
|
57
|
-
var
|
|
70
|
+
}), CLINKCursor = _h.CLINKCursor, onClickCLINK = _h.onClickCLINK;
|
|
71
|
+
var _j = getTextStyles(props.CB_STYLE_PROP_TEXT, device), textStyle = _j.style, textHoverStyle = _j.hoverStyle;
|
|
72
|
+
var _k = (0, util_1.parseProperties)(props, device), propsStyle = _k.style, propsHoverStyle = _k.hoverStyle, layoutStyle = _k.layout, effect = _k.effect;
|
|
58
73
|
var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
|
|
74
|
+
var isEditModeAndHeightFitContent = heightFitContent && mode === 'EDIT';
|
|
59
75
|
var googleFonts = (0, getGoogleFonts_1.getGoogleFontsFromTextSpecCode)(props.CB_STYLE_PROP_TEXT, device === 'MOBILE');
|
|
60
76
|
(0, useGoogleFonts_1.default)({ fonts: googleFonts });
|
|
61
77
|
if (mode === 'EDIT') {
|
|
@@ -73,7 +89,7 @@ function Text(props) {
|
|
|
73
89
|
var hasEffect = !isNoneEffectType;
|
|
74
90
|
var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
|
|
75
91
|
var textValue = function () {
|
|
76
|
-
var FORMATOPTION =
|
|
92
|
+
var FORMATOPTION = textFormat;
|
|
77
93
|
var formatOption = textSpecFormatOptions_1.TEXT_SPEC_FORMAT_OPRIONS[FORMATOPTION];
|
|
78
94
|
var isDataConnected = CB_CONTENT_PROP_TEXT_SPEC_VALUETYPE === 'DATA' ||
|
|
79
95
|
CB_CONTENT_PROP_TEXT_SPEC_VALUETYPE === 'DELEGATEDDATA';
|
|
@@ -125,15 +141,16 @@ function Text(props) {
|
|
|
125
141
|
}
|
|
126
142
|
return text;
|
|
127
143
|
};
|
|
128
|
-
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({ style: {
|
|
144
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), isEditModeAndHeightFitContent && ((0, jsx_runtime_1.jsx)(S_HeightFitContentCover_1.S_HeightFitContentCover, { bottomText: "<\uC774\uAC70 \uBB34\uC870\uAC74 \uB2E4\uBCF4\uC784>" })), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ style: {
|
|
129
145
|
height: '100%',
|
|
130
146
|
display: 'flex',
|
|
131
|
-
alignItems: textStyle.alignItems
|
|
147
|
+
// alignItems: textStyle.alignItems,
|
|
148
|
+
overflowY: heightFitContent ? 'auto' : 'scroll'
|
|
132
149
|
}, ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_Box_1.S_CB_Box, __assign({ onMouseEnter: function (e) {
|
|
133
150
|
e.currentTarget.classList.add('hovered');
|
|
134
151
|
}, onMouseLeave: function (e) {
|
|
135
152
|
e.currentTarget.classList.remove('hovered');
|
|
136
|
-
}, className: "cb-layout-box cb-text", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor, height: 'fit-content', minWidth: "calc(2ch + ".concat(layoutStyle.paddingLeft, " + ").concat(layoutStyle.paddingRight, ")") }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: [
|
|
153
|
+
}, className: "cb-layout-box cb-text", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor, height: 'fit-content', minWidth: "calc(2ch + ".concat(layoutStyle.paddingLeft, " + ").concat(layoutStyle.paddingRight, ")") }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: [textPrefix, textValue() === 'ERROR' ? 'EDITOR:FALLBACK_TEXT' : getTruncatedText(textValue()), textSuffix] })) }))] }));
|
|
137
154
|
}
|
|
138
155
|
exports.default = Text;
|
|
139
156
|
function getTextStyles(props, device) {
|
|
@@ -0,0 +1,13 @@
|
|
|
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 __importDefault = (this && this.__importDefault) || function (mod) {
|
|
7
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
8
|
+
};
|
|
9
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
|
+
exports.S_HeightFitContentCover = void 0;
|
|
11
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
+
exports.S_HeightFitContentCover = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n /* --- 1. \uAE30\uC874 \uC624\uBC84\uB808\uC774 \uC2A4\uD0C0\uC77C --- */\n /* background: linear-gradient(to top, ", " 0%, transparent 100%); */\n background: linear-gradient(139deg, #fb8817, #ff4b01, #c12127, #e02aff);\n bottom: 0;\n height: 100%;\n left: 0;\n opacity: 0.5;\n pointer-events: none;\n position: absolute;\n width: 100%;\n\n /* * [\uC911\uC694] \n * \uC774 \uC694\uC18C \uC804\uCCB4\uB294 \uD074\uB9AD\uC774 \uD1B5\uACFC\uB429\uB2C8\uB2E4. \n * (\uC790\uC2DD\uC778 ::after\uB3C4 \uC774 \uC18D\uC131\uC744 \uC0C1\uC18D\uBC1B\uC2B5\uB2C8\uB2E4)\n */\n z-index: 2;\n\n /* --- 2. ::after \uAC00\uC0C1 \uC694\uC18C\uB97C \uC0AC\uC6A9\uD574 \uAE00\uC790 \uCD94\uAC00 --- */\n &::after {\n bottom: 0;\n color: #ffffffff;\n content: '", "';\n font-size: 11px;\n font-weight: bold;\n left: 0;\n pointer-events: none;\n position: absolute;\n text-align: center;\n width: 100%;\n }\n"], ["\n /* --- 1. \uAE30\uC874 \uC624\uBC84\uB808\uC774 \uC2A4\uD0C0\uC77C --- */\n /* background: linear-gradient(to top, ", " 0%, transparent 100%); */\n background: linear-gradient(139deg, #fb8817, #ff4b01, #c12127, #e02aff);\n bottom: 0;\n height: 100%;\n left: 0;\n opacity: 0.5;\n pointer-events: none;\n position: absolute;\n width: 100%;\n\n /* * [\uC911\uC694] \n * \uC774 \uC694\uC18C \uC804\uCCB4\uB294 \uD074\uB9AD\uC774 \uD1B5\uACFC\uB429\uB2C8\uB2E4. \n * (\uC790\uC2DD\uC778 ::after\uB3C4 \uC774 \uC18D\uC131\uC744 \uC0C1\uC18D\uBC1B\uC2B5\uB2C8\uB2E4)\n */\n z-index: 2;\n\n /* --- 2. ::after \uAC00\uC0C1 \uC694\uC18C\uB97C \uC0AC\uC6A9\uD574 \uAE00\uC790 \uCD94\uAC00 --- */\n &::after {\n bottom: 0;\n color: #ffffffff;\n content: '", "';\n font-size: 11px;\n font-weight: bold;\n left: 0;\n pointer-events: none;\n position: absolute;\n text-align: center;\n width: 100%;\n }\n"])), function (props) { return '#58ab81ff'; }, function (props) { return props.bottomText || ''; });
|
|
13
|
+
var templateObject_1;
|
|
@@ -14,6 +14,7 @@ export type CB_CONTENT_PROP_TEXTOPTION = {
|
|
|
14
14
|
CB_CONTENT_PROP_TEXTOPTION_SPEC_PREFIX: STRING_PLAIN;
|
|
15
15
|
CB_CONTENT_PROP_TEXTOPTION_SPEC_SUFFIX: STRING_PLAIN;
|
|
16
16
|
CB_CONTENT_PROP_TEXTOPTION_SPEC_FORMAT: ENUM_STRING;
|
|
17
|
+
CB_CONTENT_PROP_TEXTOPTION_SPEC_FITCONTENT: boolean;
|
|
17
18
|
};
|
|
18
19
|
export type CB_CONTENT_PROP_CLINK = {
|
|
19
20
|
CB_CONTENT_PROP_CLINK_SPEC_TYPE: 'INTERNAL' | 'EXTERNAL' | 'DISABLED';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComponentBlock } from '../types';
|
|
1
|
+
import type { ComponentBlock } from '../types';
|
|
2
2
|
import type { PlaceRestrictionType } from '../../../../DynamicLayout/types';
|
|
3
3
|
import type { ZOrder } from 'publ-echo-test/dist/lib/GridLayoutEditor/group';
|
|
4
4
|
import type { LayoutItem } from 'publ-echo/dist/lib';
|
|
@@ -11,7 +11,6 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
11
11
|
};
|
|
12
12
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
13
13
|
exports.parsePlacement = void 0;
|
|
14
|
-
var types_1 = require("../types");
|
|
15
14
|
function parsePlacement(components, zOrders, placementRestriction) {
|
|
16
15
|
if (!zOrders) {
|
|
17
16
|
console.error('Z-ORDER NOT FOUND');
|
|
@@ -56,7 +55,8 @@ function parsePropPlacement(props, id, cbCode, zOrders, cbRestriction) {
|
|
|
56
55
|
};
|
|
57
56
|
}
|
|
58
57
|
var AUTO_RESIZE_CODES = [
|
|
59
|
-
|
|
58
|
+
'none'
|
|
59
|
+
// CB_ALL_CODES.CB_TEXT
|
|
60
60
|
// CB_ALL_CODES.CB_LIST,
|
|
61
61
|
// CB_ALL_CODES.CB_CONTENTSCAROUSEL,
|
|
62
62
|
// CB_ALL_CODES.CB_SLIDEBANNER
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "pds-dev-kit-web-test",
|
|
3
|
-
"version": "2.7.
|
|
3
|
+
"version": "2.7.300",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"private": false,
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -24,7 +24,6 @@
|
|
|
24
24
|
"i18next-intervalplural-postprocessor": "^3.0.0",
|
|
25
25
|
"lottie-react": "^2.3.1",
|
|
26
26
|
"nuka-carousel": "^4.8.4",
|
|
27
|
-
"pds-dev-kit-web-test": "^2.7.241",
|
|
28
27
|
"publ-echo": "^0.0.120",
|
|
29
28
|
"publ-echo-test": "^0.0.342",
|
|
30
29
|
"react-hook-form": "^7.28.1",
|