pds-dev-kit-web 2.0.14-alpha.0 → 2.0.14

package/dist/src/mobile/components/TextField/TextField.js

@@ -46,7 +46,7 @@ var IconButton_1 = require("../IconButton");
 var TextLabel_1 = require("../TextLabel");
 function TextField(_a) {
     var _b;
-    var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, _c = _a.textAlign, textAlign = _c === void 0 ? 'left' : _c, prefixText = _a.prefixText, suffixText = _a.suffixText, validation = _a.validation, _d = _a.validationPoint, validationPoint = _d === void 0 ? 'onBlur' : _d, _e = _a.preventBlankMode, preventBlankMode = _e === void 0 ? 'none' : _e, _f = _a.enterSubmitMode, enterSubmitMode = _f === void 0 ? 'none' : _f, _g = _a.size, size = _g === void 0 ? 'large' : _g, _h = _a.responsiveMode, responsiveMode = _h === void 0 ? 'none' : _h, _j = _a.textLineType, textLineType = _j === void 0 ? 'single' : _j, _k = _a.multiRows, multiRows = _k === void 0 ? 8 : _k, _l = _a.autoMinRows, autoMinRows = _l === void 0 ? 8 : _l, autoMaxRows = _a.autoMaxRows, _m = _a.inputType, inputType = _m === void 0 ? 'text' : _m, _o = _a.state, state = _o === void 0 ? 'normal' : _o, iBtn1IconName = _a.iBtn1IconName, _p = _a.iBtn1IconFillType, iBtn1IconFillType = _p === void 0 ? 'line' : _p, iBtn2IconName = _a.iBtn2IconName, _q = _a.iBtn2IconFillType, iBtn2IconFillType = _q === void 0 ? 'line' : _q, _r = _a.colorTheme, colorTheme = _r === void 0 ? 'none' : _r, max = _a.max, maxLength = _a.maxLength, min = _a.min, customWidth = _a.customWidth, _s = _a.autoComplete, autoComplete = _s === void 0 ? 'on' : _s, onBlur = _a.onBlur, onChange = _a.onChange, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onFocus = _a.onFocus, onKeyUp = _a.onKeyUp, onKeyDown = _a.onKeyDown, onTarget = _a.onTarget;
+    var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, _c = _a.textAlign, textAlign = _c === void 0 ? 'left' : _c, prefixText = _a.prefixText, suffixText = _a.suffixText, validation = _a.validation, _d = _a.validationPoint, validationPoint = _d === void 0 ? 'onBlur' : _d, _e = _a.preventBlankMode, preventBlankMode = _e === void 0 ? 'none' : _e, _f = _a.enterSubmitMode, enterSubmitMode = _f === void 0 ? 'none' : _f, _g = _a.size, size = _g === void 0 ? 'large' : _g, _h = _a.responsiveMode, responsiveMode = _h === void 0 ? 'none' : _h, _j = _a.textLineType, textLineType = _j === void 0 ? 'single' : _j, _k = _a.multiRows, multiRows = _k === void 0 ? 8 : _k, _l = _a.autoMinRows, autoMinRows = _l === void 0 ? 8 : _l, autoMaxRows = _a.autoMaxRows, _m = _a.inputType, inputType = _m === void 0 ? 'text' : _m, _o = _a.state, state = _o === void 0 ? 'normal' : _o, iBtn1IconName = _a.iBtn1IconName, _p = _a.iBtn1IconFillType, iBtn1IconFillType = _p === void 0 ? 'line' : _p, iBtn2IconName = _a.iBtn2IconName, _q = _a.iBtn2IconFillType, iBtn2IconFillType = _q === void 0 ? 'line' : _q, _r = _a.colorTheme, colorTheme = _r === void 0 ? 'none' : _r, max = _a.max, maxLength = _a.maxLength, min = _a.min, customWidth = _a.customWidth, _s = _a.autoComplete, autoComplete = _s === void 0 ? 'on' : _s, _t = _a.numberStepperMode, numberStepperMode = _t === void 0 ? 'none' : _t, numberStep = _a.numberStep, onBlur = _a.onBlur, onChange = _a.onChange, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onFocus = _a.onFocus, onKeyUp = _a.onKeyUp, onKeyDown = _a.onKeyDown, onTarget = _a.onTarget;
     var basicThemeIconColors = {
         normal: 'ui_cpnt_button_icon_default',
         read_only: 'ui_cpnt_button_icon_default',
@@ -62,9 +62,9 @@ function TextField(_a) {
         read_only: 'ui_cpnt_textfield_icon_colortheme_transparent_readonly',
         disabled: 'ui_cpnt_textfield_icon_colortheme_transparent_disabled'
     };
-    var _t = (0, react_1.useState)(false), isFocused = _t[0], setIsFocused = _t[1];
-    var _u = (0, react_hook_form_1.useFormContext)(), register = _u.register, trigger = _u.trigger, errors = _u.formState.errors;
-    var _v = register(name, validation), validateOnChange = _v.onChange, validateOnBlur = _v.onBlur;
+    var _u = (0, react_1.useState)(false), isFocused = _u[0], setIsFocused = _u[1];
+    var _v = (0, react_hook_form_1.useFormContext)(), register = _v.register, trigger = _v.trigger, errors = _v.formState.errors;
+    var _w = register(name, validation), validateOnChange = _w.onChange, validateOnBlur = _w.onBlur;
     var isError = Object.keys(errors).some(function (error) { return error === name; });
     var handleClickIBtn1 = function () {
         if (onClickIBtn1) {
@@ -136,7 +136,7 @@ function TextField(_a) {
                     break;
                 }
             }
-            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [prefixText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: prefixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", singleLineMode: "use" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0)] }, void 0)), (0, jsx_runtime_1.jsx)(components_1.TextFieldBase, { name: name, hintText: hintText, defaultText: defaultText, textAlign: textAlign, validation: validation, preventBlankMode: preventBlankMode, enterSubmitMode: enterSubmitMode, textLineType: "single", inputType: inputType, state: state, colorTheme: colorTheme, min: min, max: max, maxLength: maxLength, textSize: "form2", textWeight: "normal", deleteIconMode: "use", deleteIconSize: size === 'large' || size === 'rlarge' ? 20 : 16, deleteIconColor: deleteIconColor, isFocused: isFocused, autoComplete: autoComplete, onFocus: handleFocus, onTarget: handleTarget, onChange: handleChange, onBlur: handleBlur, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown }, void 0), (0, jsx_runtime_1.jsxs)(S_RightBox, { children: [suffixText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: suffixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", textAlign: "right", singleLineMode: "use" }, void 0), size === 'large' ? ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0)) : ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }, void 0))] }, void 0)), iBtn2IconName && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: iBtn2IconName, baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: size === 'large' || size === 'rlarge' ? 20 : 16, iconColorKey: colorTheme &&
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [prefixText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: prefixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", singleLineMode: "use" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0)] }, void 0)), (0, jsx_runtime_1.jsx)(components_1.TextFieldBase, { name: name, hintText: hintText, defaultText: defaultText, textAlign: inputType === 'number' && numberStepperMode === 'use' ? 'right' : textAlign, validation: validation, preventBlankMode: preventBlankMode, enterSubmitMode: enterSubmitMode, textLineType: "single", inputType: inputType, state: state, colorTheme: colorTheme, min: min, max: max, maxLength: maxLength, textSize: "form2", textWeight: "normal", deleteIconMode: "use", deleteIconSize: size === 'large' || size === 'rlarge' ? 20 : 16, deleteIconColor: deleteIconColor, isFocused: isFocused, autoComplete: autoComplete, stepperMode: inputType === 'number' && numberStepperMode === 'use' ? 'use' : 'none', innerSpinButtonSize: size === 'small' ? 12 : 16, step: numberStep, onFocus: handleFocus, onTarget: handleTarget, onChange: handleChange, onBlur: handleBlur, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown }, void 0), (0, jsx_runtime_1.jsxs)(S_RightBox, { children: [suffixText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: suffixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", textAlign: "right", singleLineMode: "use" }, void 0), size === 'large' ? ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0)) : ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }, void 0))] }, void 0)), iBtn2IconName && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: iBtn2IconName, baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: size === 'large' || size === 'rlarge' ? 20 : 16, iconColorKey: colorTheme &&
                                     {
                                         none: basicThemeIconColors[state],
                                         dark: darkThemeIconColors[state],

package/dist/src/sub/DynamicLayout/mock_storybook.js

@@ -1146,18 +1146,21 @@ exports.SampleSectionsMock = [
         updatedAt: '2023-01-12T08:03:48'
     },
     {
-        display: true,
         type: 'PROGRAMMED',
         program: 'MEMBERSHIP_DISPLAY',
-        dynamicLayoutSectionItems: [],
+        display: true,
+        dynamicLayoutSectionItems: null,
         id: 6010,
+        insertedAt: '2023-01-06T09:05:45',
         manifest: {
             availableProperties: [
                 'title',
                 'description',
                 'button_alpha_label',
                 'button_alpha_link_type',
-                'button_alpha_link_src'
+                'button_alpha_link_src',
+                'section_content_media_type',
+                'section_content_media_src'
             ],
             availableStyles: [
                 'title_color_in_hex',
@@ -1176,7 +1179,7 @@ exports.SampleSectionsMock = [
             availableTemplates: ['PRG_MEMBERSHIP_DISPLAY_A', 'PRG_MEMBERSHIP_DISPLAY_B'],
             schema: 'PRG_MEMBERSHIP_DISPLAY'
         },
-        order: 8,
+        order: 10,
         properties: {
             buttonAlphaLabel: 'Lorem Ipsum',
             buttonAlphaLinkSrc: 'https://team.publ.space',
@@ -1197,140 +1200,45 @@ exports.SampleSectionsMock = [
             carouselAutoplayTime: 3,
             carouselInfiniteLoopMode: 'NO_USE',
             description: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
+            itemLinkMethod: 'CLICK_BUTTON_IN_ITEM',
             sectionContentMediaSrc: '',
             sectionContentMediaType: 'IMAGE',
             title: 'Lorem Ipsum',
-            multiPurposeUrl: 'https://app.publr.co/',
-            itemLinkMethod: 'NONE'
+            multiPurposeUrl: 'https://app.publr.co/'
         },
         styles: {
-            backgroundColorInHex: '#4A5D78AB',
+            backgroundColorInHex: '#FF1D973B',
             backgroundMediaSrc: '',
             backgroundMediaType: 'IMAGE',
             backgroundOverlayColorInHex: '#FFFFFF00',
-            buttonAlphaBackgroundColorInHex: '#313131FF',
+            buttonAlphaBackgroundColorInHex: '#FFC0CBFF',
             buttonAlphaDesignType: 'C',
             buttonAlphaLabelColorInHex: '#f5efd9FF',
-            buttonBravoBackgroundColorInHex: '#313131FF',
+            buttonBravoBackgroundColorInHex: '#FFC0CBFF',
             buttonBravoDesignType: 'E',
             buttonBravoLabelColorInHex: '#FFFFFFFF',
             buttonCharlieBackgroundColorInHex: '#465FF000',
             buttonCharlieDesignType: 'E',
             buttonCharlieLabelColorInHex: '#FFFFFFFF',
-            buttonDeltaBackgroundColorInHex: '#313131FF',
+            buttonDeltaBackgroundColorInHex: '#FFC0CBFF',
             buttonDeltaDesignType: 'A',
             buttonDeltaLabelColorInHex: '#FFFFFFFF',
-            buttonEchoBackgroundColorInHex: '#313131FF',
+            buttonEchoBackgroundColorInHex: '#FFC0CBFF',
             buttonEchoDesignType: 'A',
             buttonEchoLabelColorInHex: '#FFFFFFFF',
-            descriptionColorInHex: '#DEECFFA6',
-            itemButtonBackgroundColorInHex: '#313131FF',
+            descriptionColorInHex: '#FEECD8FF',
+            itemButtonBackgroundColorInHex: '#FFC0CBFF',
             itemButtonDesignType: 'A',
             itemButtonLabelColorInHex: '#FFFFFFFF',
             itemDescriptionColorInHex: '#68686BFF',
             itemTitleColorInHex: '#1E1E20FF',
-            titleColorInHex: '#DEECFFFF',
-            itemHighlightingColorInHex: '#ff7f50FF',
+            itemHighlightingColorInHex: '#FF1D97FF',
             itemToneType: 'LIGHT',
+            titleColorInHex: '#F8FFACFF',
             programmedItemActionButtonTextType: 'A'
         },
-        template: 'PRG_MEMBERSHIP_DISPLAY_A',
-        programData: {
-            mdid: 'mdid',
-            preview: {
-                availableResources: ['REAL.MEMBERSHIP_DISPLAY'],
-                resources: {
-                    mock: {},
-                    real: {
-                        membershipDisplay: {
-                            id: 1,
-                            mdid: "MEMBERSHIP_DISPLAY_MD_ID",
-                            title: "MEMBERSHIP_DISPLAY_MD_TITLE",
-                            isDefault: true,
-                            connectedMemberships: Array.from({ length: 6 }, function (_, i) {
-                                var alphabet = ['A', 'B', 'C', 'D', 'E', 'F'];
-                                var cardImage = [
-                                    'https://cdn.dev.publishingkit.net/7f3f7a31-023b-4852-9a11-cbac31d25d93',
-                                    'https://cdn.dev.publishingkit.net/c8973261-6c2a-4833-9b9f-20ee355647e4',
-                                    'https://cdn.dev.publishingkit.net/8e585c93-9591-4300-ad93-d002560cbeae',
-                                    'https://cdn.dev.publishingkit.net/4aaa2811-b3ff-435c-b50a-9486376ab230',
-                                    'https://cdn.dev.publishingkit.net/5111c33c-07ba-4b91-8eb6-9975f4cd906a',
-                                    'https://cdn.dev.publishingkit.net/16ac0a8a-acb1-465b-960c-6be66f2a04e8.jpg'
-                                ];
-                                var getOverlayType = function () {
-                                    if (i % 3 === 1)
-                                        return 'SOLID';
-                                    if (i % 3 === 2)
-                                        return 'GRADIENT';
-                                    return 'NONE';
-                                };
-                                var getDesignSchema = function () {
-                                    if (i % 3 === 1)
-                                        return 'B';
-                                    if (i % 3 === 2)
-                                        return 'C';
-                                    return 'A';
-                                };
-                                return {
-                                    id: i + 1,
-                                    order: i,
-                                    mdid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_MD_ID",
-                                    mid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_M_ID",
-                                    membership: {
-                                        id: i + 1,
-                                        type: 'GENERAL',
-                                        mid: "MEMBERSHIP_" + alphabet[i] + "_MID",
-                                        title: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
-                                        insertedAt: '2023-01-06T09:05:45',
-                                        updatedAt: '2023-01-06T09:05:45',
-                                        membershipCardTemplate: {
-                                            backgroundImageSrc: cardImage[i],
-                                            logoImageSrc: 'https://publ-upload-local.s3.ap-northeast-2.amazonaws.com/e11d1a92-a1c0-4faa-b341-13a32f21828d_image',
-                                            overlayType: getOverlayType(),
-                                            overlayColorPrimary: '#FFC0CB49',
-                                            overlayColorSecondary: '#31313149',
-                                            designSchema: getDesignSchema()
-                                        },
-                                        membershipBenefitInfo: {
-                                            benefitAlpha: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
-                                            benefitBravo: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
-                                            benefitCharlie: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
-                                            benefitDelta: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
-                                            benefitEcho: 'Lorem ipsum dolor sit amet. Et magnam molestiae.'
-                                        },
-                                        totalSubscriptionProducts: 3
-                                    },
-                                    connectedSubscriptionProducts: Array.from({ length: 1 }, function () {
-                                        return {
-                                            id: i + 1,
-                                            order: i,
-                                            connectedMembershipId: i + 1,
-                                            subscriptionProductId: i + 1,
-                                            subscriptionProduct: {
-                                                id: i + 1,
-                                                type: 'COUPON_ONCE_FINITE',
-                                                title: '청춘이 황금시대를 우리의 같은 무엇을',
-                                                alias: "CONNECTED_SUBSCRIPTION_PRODUCTS_" + alphabet[i] + "_ALIAS",
-                                                expiryPeriodInDays: 7,
-                                                isDeactivated: i % 2 === 0,
-                                                fee: {
-                                                    currency: 'KRW',
-                                                    amount: 10000
-                                                },
-                                                insertedAt: '2023-01-06T09:05:45',
-                                                updatedAt: '2023-01-06T09:05:45'
-                                            }
-                                        };
-                                    })
-                                };
-                            })
-                        }
-                    }
-                }
-            }
-        },
-        insertedAt: '2023-01-30T10:24:35',
-        updatedAt: '2023-01-30T10:24:35'
+        template: 'PRG_MEMBERSHIP_DISPLAY_B',
+        updatedAt: '2023-01-06T09:05:45'
     }
 ];
 var MembershipSectionsMock = function (templateType) { return [

package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateA/mobile/components/SectionContents.js

@@ -30,7 +30,7 @@ function SectionContents() {
     }
     var _a = section.styles, buttonAlphaBackgroundColorInHex = _a.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _a.buttonAlphaLabelColorInHex, buttonAlphaDesignType = _a.buttonAlphaDesignType, descriptionColorInHex = _a.descriptionColorInHex, titleColorInHex = _a.titleColorInHex;
     var _b = section.properties, title = _b.title, description = _b.description, buttonAlphaLabel = _b.buttonAlphaLabel, buttonAlphaLinkSrc = _b.buttonAlphaLinkSrc, buttonAlphaLinkType = _b.buttonAlphaLinkType;
-    return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "32px", customFontWeight: "bold", lineHeight: 1.3 }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, color: descriptionColorInHex, textAlign: "center", customFontSize: "18px", fontWeight: "600" }, void 0) }, void 0)), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0) }, void 0))] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, styleTheme: "headingBold" }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "body1Regular" }, void 0) }, void 0)), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0) }, void 0))] }), void 0));
 }
 var S_SectionDataBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-bottom: ", ";\n"], ["\n  margin-bottom: ", ";\n"])), function (_a) {
     var isEmptySectionData = _a.isEmptySectionData, theme = _a.theme;

package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateB/mobile/components/SectionContents.js

@@ -30,7 +30,7 @@ function SectionContents() {
     }
     var _a = section.styles, buttonAlphaBackgroundColorInHex = _a.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _a.buttonAlphaLabelColorInHex, buttonAlphaDesignType = _a.buttonAlphaDesignType, descriptionColorInHex = _a.descriptionColorInHex, titleColorInHex = _a.titleColorInHex;
     var _b = section.properties, title = _b.title, description = _b.description, buttonAlphaLabel = _b.buttonAlphaLabel, buttonAlphaLinkSrc = _b.buttonAlphaLinkSrc, buttonAlphaLinkType = _b.buttonAlphaLinkType;
-    return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "32px", customFontWeight: "bold", lineHeight: 1.3 }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, color: descriptionColorInHex, textAlign: "center", customFontSize: "18px", fontWeight: "600" }, void 0) }, void 0)), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0) }, void 0))] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, styleTheme: "headingBold" }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "body1Regular" }, void 0) }, void 0)), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0) }, void 0))] }), void 0));
 }
 var S_SectionDataBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-bottom: ", ";\n"], ["\n  margin-bottom: ", ";\n"])), function (_a) {
     var isEmptySectionData = _a.isEmptySectionData, theme = _a.theme;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web",
-  "version": "2.0.14-alpha.0",
+  "version": "2.0.14",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",

package/release-note.md

@@ -1,9 +1,15 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v2.0.14-alpha.0]
+## [v2.0.14]
+## daily|https://design.storybook.publ.biz/
 
-## alpha|https://storybook-pds-alpha.test.publ.biz
-
-### sub
-* DynamicLayout
-    * membership section 모바일 템플릿 디자인 수정
-      * sectionSheet의 EDITMODE와 NORMALMODE가 동일하게 보이도록 수정
+### components
+* Icon
+    * ic_dotted_circle line icon 추가
+* IconButton
+    * tooltip 기능 추가
+* TextField
+    * stepper 기능 추가 
+### layout
+* WSI_1 생성
+### Color
+* 컬러 키 값 23.06.21 18시 30분 기준 싱크