pds-dev-kit-web-test 0.2.28 → 0.2.30

package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/MembershipSection.js

@@ -36,18 +36,18 @@ var templates_1 = require("./templates");
 function NormalTypeMembershipSection(_a) {
     var props = __rest(_a, []);
     var template = props.template;
-    return ((0, jsx_runtime_1.jsx)(S_SectionWrapper, __assign({ "x-dlayout-section-type": "Membership" }, { children: (0, jsx_runtime_1.jsx)(components_1.Section, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(TemplateMather, { styleTemplate: template }, void 0) }), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(S_SectionWrapper, __assign({ "x-dlayout-section-type": "Membership" }, { children: (0, jsx_runtime_1.jsx)(components_1.Section, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(TemplateMather, { styleTemplate: template }) })) })));
 }
 var S_SectionWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
 function TemplateMather(_a) {
     var styleTemplate = _a.styleTemplate;
     switch (styleTemplate) {
         case 'PRG_MEMBERSHIP_DISPLAY_A':
-            return (0, jsx_runtime_1.jsx)(templates_1.TemplateA, {}, void 0);
+            return (0, jsx_runtime_1.jsx)(templates_1.TemplateA, {});
         case 'PRG_MEMBERSHIP_DISPLAY_B':
-            return (0, jsx_runtime_1.jsx)(templates_1.TemplateB, {}, void 0);
+            return (0, jsx_runtime_1.jsx)(templates_1.TemplateB, {});
         default:
-            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
 }
 exports.default = NormalTypeMembershipSection;

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

@@ -8,8 +8,8 @@ var mobile_1 = require("./mobile");
 function TemplateA() {
     var device = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).device;
     return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: {
-            MOBILE: (0, jsx_runtime_1.jsx)(mobile_1.M_TemplateA, {}, void 0),
-            DESKTOP: (0, jsx_runtime_1.jsx)(desktop_1.D_TemplateA, {}, void 0)
-        }[device] }, void 0));
+            MOBILE: (0, jsx_runtime_1.jsx)(mobile_1.M_TemplateA, {}),
+            DESKTOP: (0, jsx_runtime_1.jsx)(desktop_1.D_TemplateA, {})
+        }[device] }));
 }
 exports.default = TemplateA;

package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateA/desktop/D_TemplateA.js

@@ -13,7 +13,7 @@ var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamic
 var styled_components_1 = __importDefault(require("styled-components"));
 var SectionContents_1 = __importDefault(require("./components/SectionContents"));
 function TemplateA() {
-    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}, void 0), (0, jsx_runtime_1.jsx)(MembershipSection, {}, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}), (0, jsx_runtime_1.jsx)(MembershipSection, {})] }));
 }
 var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  margin: ", " auto;\n  max-width: var(--max-width-px);\n  min-width: var(--min-width-px);\n  width: calc(\n    (100% - var(--min-viewport-width-px)) * (var(--max-width) - var(--min-width)) /\n      (var(--max-viewport-width) - var(--min-viewport-width)) + var(--min-width-px)\n  );\n"], ["\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  margin: ", " auto;\n  max-width: var(--max-width-px);\n  min-width: var(--min-width-px);\n  width: calc(\n    (100% - var(--min-viewport-width-px)) * (var(--max-width) - var(--min-width)) /\n      (var(--max-viewport-width) - var(--min-viewport-width)) + var(--min-width-px)\n  );\n"])), function (_a) {
     var theme = _a.theme;
@@ -22,9 +22,9 @@ var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (t
 function MembershipSection() {
     var programmedSectionComponents = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).programmedSectionComponents;
     if (!programmedSectionComponents) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
-    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0));
+    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
 }
 exports.default = TemplateA;
 var templateObject_1;

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

@@ -26,12 +26,12 @@ var styled_components_1 = __importDefault(require("styled-components"));
 function SectionContents() {
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
     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;
     var isEmptySection = !title && !description && !buttonAlphaLabel;
-    return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySection: isEmptySection }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, customFontSize: "48px", customFontWeight: "bold" }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "headingBold" }, void 0) }, void 0)), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_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({ isEmptySection: isEmptySection }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, customFontSize: "48px", customFontWeight: "bold" })), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "headingBold" }) })), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }) }))] })));
 }
 var S_SectionDataBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-bottom: ", ";\n"], ["\n  margin-bottom: ", ";\n"])), function (_a) {
     var isEmptySection = _a.isEmptySection;

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

@@ -13,7 +13,7 @@ var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamic
 var styled_components_1 = __importDefault(require("styled-components"));
 var SectionContents_1 = __importDefault(require("./components/SectionContents"));
 function TemplateA() {
-    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}, void 0), (0, jsx_runtime_1.jsx)(MembershipSection, {}, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}), (0, jsx_runtime_1.jsx)(MembershipSection, {})] }));
 }
 var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: ", " auto;\n  padding: 0 ", ";\n"], ["\n  margin: ", " auto;\n  padding: 0 ", ";\n"])), function (_a) {
     var theme = _a.theme;
@@ -25,9 +25,9 @@ var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (t
 function MembershipSection() {
     var programmedSectionComponents = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).programmedSectionComponents;
     if (!programmedSectionComponents) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
-    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0));
+    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
 }
 exports.default = TemplateA;
 var templateObject_1;

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

@@ -26,11 +26,11 @@ var styled_components_1 = __importDefault(require("styled-components"));
 function SectionContents() {
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
     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, 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));
+    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" })), 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" }) })), 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 }) }))] })));
 }
 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/TemplateB.js

@@ -8,8 +8,8 @@ var mobile_1 = require("./mobile");
 function TemplateB() {
     var device = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).device;
     return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: {
-            MOBILE: (0, jsx_runtime_1.jsx)(mobile_1.M_TemplateB, {}, void 0),
-            DESKTOP: (0, jsx_runtime_1.jsx)(desktop_1.D_TemplateB, {}, void 0)
-        }[device] }, void 0));
+            MOBILE: (0, jsx_runtime_1.jsx)(mobile_1.M_TemplateB, {}),
+            DESKTOP: (0, jsx_runtime_1.jsx)(desktop_1.D_TemplateB, {})
+        }[device] }));
 }
 exports.default = TemplateB;

package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateB/desktop/D_TemplateB.js

@@ -13,7 +13,7 @@ var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamic
 var styled_components_1 = __importDefault(require("styled-components"));
 var SectionContents_1 = __importDefault(require("./components/SectionContents"));
 function TemplateB() {
-    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}, void 0), (0, jsx_runtime_1.jsx)(MembershipSection, {}, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}), (0, jsx_runtime_1.jsx)(MembershipSection, {})] }));
 }
 var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  margin: ", " auto;\n  max-width: var(--max-width-px);\n  min-width: var(--min-width-px);\n  width: calc(\n    (100% - var(--min-viewport-width-px)) * (var(--max-width) - var(--min-width)) /\n      (var(--max-viewport-width) - var(--min-viewport-width)) + var(--min-width-px)\n  );\n"], ["\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  margin: ", " auto;\n  max-width: var(--max-width-px);\n  min-width: var(--min-width-px);\n  width: calc(\n    (100% - var(--min-viewport-width-px)) * (var(--max-width) - var(--min-width)) /\n      (var(--max-viewport-width) - var(--min-viewport-width)) + var(--min-width-px)\n  );\n"])), function (_a) {
     var theme = _a.theme;
@@ -22,9 +22,9 @@ var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (t
 function MembershipSection() {
     var programmedSectionComponents = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).programmedSectionComponents;
     if (!programmedSectionComponents) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
-    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0));
+    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
 }
 exports.default = TemplateB;
 var templateObject_1;

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

@@ -26,11 +26,11 @@ var styled_components_1 = __importDefault(require("styled-components"));
 function SectionContents() {
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
     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.D_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, customFontSize: "48px", customFontWeight: "bold" }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "headingBold" }, void 0) }, void 0)), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_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.D_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, customFontSize: "48px", customFontWeight: "bold" })), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "headingBold" }) })), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.D_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }) }))] })));
 }
 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;

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

@@ -13,7 +13,7 @@ var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamic
 var styled_components_1 = __importDefault(require("styled-components"));
 var SectionContents_1 = __importDefault(require("./components/SectionContents"));
 function TemplateB() {
-    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}, void 0), (0, jsx_runtime_1.jsx)(MembershipSection, {}, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_MembershipSection, { children: [(0, jsx_runtime_1.jsx)(SectionContents_1.default, {}), (0, jsx_runtime_1.jsx)(MembershipSection, {})] }));
 }
 var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: ", " auto;\n  padding: 0 ", ";\n"], ["\n  margin: ", " auto;\n  padding: 0 ", ";\n"])), function (_a) {
     var theme = _a.theme;
@@ -25,9 +25,9 @@ var S_MembershipSection = styled_components_1.default.div(templateObject_1 || (t
 function MembershipSection() {
     var programmedSectionComponents = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).programmedSectionComponents;
     if (!programmedSectionComponents) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
-    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0));
+    return programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY ? (programmedSectionComponents.PRG_MEMBERSHIP_DISPLAY) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
 }
 exports.default = TemplateB;
 var templateObject_1;

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

@@ -26,11 +26,11 @@ var styled_components_1 = __importDefault(require("styled-components"));
 function SectionContents() {
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
     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, 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));
+    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" })), 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" }) })), 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 }) }))] })));
 }
 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/components/desktop/MembershipSectionItem.d.ts

@@ -16,7 +16,7 @@ declare namespace MembershipSectionItem {
     var ColorOverrideIcon: ({ iconColor, iconName }: ColorOverrideIconProps) => JSX.Element;
     var XlargeMainButton: ({ buttonTextColor, buttonBackgroundColor, state, buttonText, $paddingBottom }: XlargeMainButtonProps) => JSX.Element;
 }
-declare type IconButtonProps = {
+type IconButtonProps = {
     iconButtonIconColor: string;
     iconButtonDisabledIconColor: string;
     iconButtonBackgroundColor: string;
@@ -27,14 +27,14 @@ declare type IconButtonProps = {
     state?: 'normal' | 'disabled';
     onClick?: (value?: number | string) => void;
 };
-declare type MembershipCardProps = {
+type MembershipCardProps = {
     membershipCardTemplate: IMembershipCardTemplate;
 };
-declare type ColorOverrideIconProps = {
+type ColorOverrideIconProps = {
     iconColor: string;
     iconName: FillIconNameKeys | LineIconNameKeys;
 };
-declare type XlargeMainButtonProps = {
+type XlargeMainButtonProps = {
     buttonTextColor?: string;
     buttonBackgroundColor?: string;
     state?: 'normal' | 'disabled';

package/dist/src/sub/DynamicLayout/sections/MembershipSection/components/desktop/MembershipSectionItem.js

@@ -16,7 +16,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -52,7 +56,7 @@ var dynamicLayoutContext_1 = require("../../../../../DynamicLayout/dynamicLayout
 var styled_components_1 = __importStar(require("styled-components"));
 var constants_1 = require("../../constants");
 function MembershipSectionItem() {
-    return (0, jsx_runtime_1.jsx)(S_Item, { "x-dlayout-section-element-name": "Item", isClickable: false }, void 0);
+    return (0, jsx_runtime_1.jsx)(S_Item, { "x-dlayout-section-element-name": "Item", isClickable: false });
 }
 var S_Item = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  ", "\n"], ["\n  position: relative;\n  ", "\n"])), function (_a) {
     var isClickable = _a.isClickable;
@@ -60,7 +64,7 @@ var S_Item = styled_components_1.default.div(templateObject_1 || (templateObject
 });
 function Title(_a) {
     var text = _a.text, color = _a.color, _b = _a.lineHeight, lineHeight = _b === void 0 ? 1.5 : _b, textLabelProps = __rest(_a, ["text", "color", "lineHeight"]);
-    return ((0, jsx_runtime_1.jsx)(S_TitleStyleWrapper, __assign({ "x-dlayout-membership-item-element-name": "Title", color: color, lineHeight: lineHeight }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_TextLabel, __assign({ text: text, colorTheme: "sysTextPrimary" }, textLabelProps), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(S_TitleStyleWrapper, __assign({ "x-dlayout-membership-item-element-name": "Title", color: color, lineHeight: lineHeight }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_TextLabel, __assign({ text: text, colorTheme: "sysTextPrimary" }, textLabelProps)) })));
 }
 var S_TitleStyleWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  & > div {\n    color: ", ";\n    line-height: ", ";\n  }\n"], ["\n  & > div {\n    color: ", ";\n    line-height: ", ";\n  }\n"])), function (_a) {
     var color = _a.color;
@@ -71,14 +75,14 @@ var S_TitleStyleWrapper = styled_components_1.default.div(templateObject_2 || (t
 });
 function Description(_a) {
     var text = _a.text, color = _a.color, fontWeight = _a.fontWeight, textLabelProps = __rest(_a, ["text", "color", "fontWeight"]);
-    return ((0, jsx_runtime_1.jsx)(S_DescriptionStyleWrapper, __assign({ "x-dlayout-membership-item-element-name": "Description", color: color, fontWeight: fontWeight }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_TextLabel, __assign({ text: text, colorTheme: "sysTextSecondary" }, textLabelProps), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(S_DescriptionStyleWrapper, __assign({ "x-dlayout-membership-item-element-name": "Description", color: color, fontWeight: fontWeight }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_TextLabel, __assign({ text: text, colorTheme: "sysTextSecondary" }, textLabelProps)) })));
 }
 var S_DescriptionStyleWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  & > div {\n    color: ", ";\n    width: 100%;\n\n    ", ";\n  }\n"], ["\n  & > div {\n    color: ", ";\n    width: 100%;\n\n    ", ";\n  }\n"])), function (_a) {
     var color = _a.color;
     return color;
 }, function (_a) {
     var fontWeight = _a.fontWeight;
-    return fontWeight && "font-weight : " + fontWeight + ";";
+    return fontWeight && "font-weight : ".concat(fontWeight, ";");
 });
 function DesignedSectionButton(_a) {
     var buttonType = _a.buttonType, backgroundColor = _a.backgroundColor, textColor = _a.textColor, text = _a.text, _b = _a.linkType, linkType = _b === void 0 ? 'NONE' : _b, _c = _a.src, src = _c === void 0 ? '' : _c, _d = _a.linkMethod, linkMethod = _d === void 0 ? 'CLICK_BUTTON_IN_ITEM' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, borderColor = _a.borderColor;
@@ -91,28 +95,28 @@ function DesignedSectionButton(_a) {
         typeof navigationHandler === 'function' && navigationHandler(linkType, src);
     };
     if (!src || linkMethod !== 'CLICK_BUTTON_IN_ITEM')
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     switch (buttonType) {
         case 'A':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 0, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 0, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'B':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 6, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 6, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'C':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 14, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 14, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'D':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 24, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 24, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'E':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 0, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 0, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'F':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 6, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 6, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'G':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 14, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 14, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'H':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 24, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionMainButtonWrapper, __assign({ "x-dlayout-membership-item-element-name": "Button", backgroundColor: backgroundColor, color: textColor, radius: 24, borderWidth: 2, borderColor: borderColor, state: state, type: buttonType }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: text || 'BUTTON', state: state, onClick: handleClickButton }) })));
         case 'I':
-            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionTextButtonWrapper, __assign({ color: textColor, state: state }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_TextButton, { text: text || 'BUTTON', onClick: handleClickButton, state: state }, void 0) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_DesignedSectionTextButtonWrapper, __assign({ color: textColor, state: state }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_TextButton, { text: text || 'BUTTON', onClick: handleClickButton, state: state }) })));
         default:
-            return (0, jsx_runtime_1.jsx)("button", __assign({ type: "button" }, { children: "wrong type" }), void 0);
+            return (0, jsx_runtime_1.jsx)("button", __assign({ type: "button" }, { children: "wrong type" }));
     }
 }
 var S_DesignedSectionMainButtonWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  & > button {\n    background-color: ", ";\n    border: ", ";\n    border-radius: ", ";\n\n    box-sizing: border-box;\n\n    & div {\n      color: ", ";\n    }\n  }\n"], ["\n  & > button {\n    background-color: ", ";\n    border: ", ";\n    border-radius: ", ";\n\n    box-sizing: border-box;\n\n    & div {\n      color: ", ";\n    }\n  }\n"])), function (_a) {
@@ -125,16 +129,16 @@ var S_DesignedSectionMainButtonWrapper = styled_components_1.default.div(templat
     var borderWidth = _a.borderWidth, borderColor = _a.borderColor, state = _a.state, type = _a.type, theme = _a.theme;
     if (type === 'E' || type === 'F' || type === 'G' || type === 'H') {
         if (borderWidth && borderColor && state === 'normal') {
-            return borderWidth + "px solid " + borderColor;
+            return "".concat(borderWidth, "px solid ").concat(borderColor);
         }
         if (borderWidth && state === 'disabled') {
-            return borderWidth + "px solid " + theme.ui_cpnt_button_line_border_disabled;
+            return "".concat(borderWidth, "px solid ").concat(theme.ui_cpnt_button_line_border_disabled);
         }
     }
     return 'none';
 }, function (_a) {
     var radius = _a.radius;
-    return radius + "px";
+    return "".concat(radius, "px");
 }, function (_a) {
     var color = _a.color, state = _a.state, theme = _a.theme;
     if (state === 'normal') {
@@ -154,20 +158,20 @@ function IconButton(_a) {
     var handleOnClick = function () {
         onClick && onClick();
     };
-    return ((0, jsx_runtime_1.jsx)(S_IconButtonWrapper, __assign({ iconButtonIconColor: iconButtonIconColor, iconButtonDisabledIconColor: iconButtonDisabledIconColor, iconButtonBackgroundColor: iconButtonBackgroundColor, iconButtonDisabledBackgroundColor: iconButtonDisabledBackgroundColor, iconButtonBorderColor: iconButtonBorderColor, isDisabled: isDisabled }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_IconButton, { fillType: "line", shapeType: "circular", baseSize: "large", iconName: iconName, state: state, onClick: handleOnClick }, void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(S_IconButtonWrapper, __assign({ iconButtonIconColor: iconButtonIconColor, iconButtonDisabledIconColor: iconButtonDisabledIconColor, iconButtonBackgroundColor: iconButtonBackgroundColor, iconButtonDisabledBackgroundColor: iconButtonDisabledBackgroundColor, iconButtonBorderColor: iconButtonBorderColor, isDisabled: isDisabled }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_IconButton, { fillType: "line", shapeType: "circular", baseSize: "large", iconName: iconName, state: state, onClick: handleOnClick }) })));
 }
 var S_IconButtonWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  & > button {\n    background-color: ", ";\n    border: ", ";\n  }\n\n  & > button:hover:enabled {\n    background-color: ", ";\n    border: ", ";\n  }\n\n  & > button > svg > path {\n    stroke: ", ";\n  }\n"], ["\n  & > button {\n    background-color: ", ";\n    border: ", ";\n  }\n\n  & > button:hover:enabled {\n    background-color: ", ";\n    border: ", ";\n  }\n\n  & > button > svg > path {\n    stroke: ", ";\n  }\n"])), function (_a) {
     var iconButtonBackgroundColor = _a.iconButtonBackgroundColor, iconButtonDisabledBackgroundColor = _a.iconButtonDisabledBackgroundColor, isDisabled = _a.isDisabled;
     return (isDisabled ? iconButtonDisabledBackgroundColor : iconButtonBackgroundColor);
 }, function (_a) {
     var iconButtonBorderColor = _a.iconButtonBorderColor;
-    return "1px " + iconButtonBorderColor + " solid";
+    return "1px ".concat(iconButtonBorderColor, " solid");
 }, function (_a) {
     var iconButtonBackgroundColor = _a.iconButtonBackgroundColor;
     return iconButtonBackgroundColor;
 }, function (_a) {
     var iconButtonBorderColor = _a.iconButtonBorderColor;
-    return "1px " + iconButtonBorderColor + " solid";
+    return "1px ".concat(iconButtonBorderColor, " solid");
 }, function (_a) {
     var iconButtonIconColor = _a.iconButtonIconColor, iconButtonDisabledIconColor = _a.iconButtonDisabledIconColor, isDisabled = _a.isDisabled;
     return isDisabled ? iconButtonDisabledIconColor : iconButtonIconColor;
@@ -175,7 +179,7 @@ var S_IconButtonWrapper = styled_components_1.default.div(templateObject_6 || (t
 function MembershipCard(_a) {
     var membershipCardTemplate = _a.membershipCardTemplate;
     var backgroundImageSrc = membershipCardTemplate.backgroundImageSrc, designSchema = membershipCardTemplate.designSchema, logoImageSrc = membershipCardTemplate.logoImageSrc, overlayColorPrimary = membershipCardTemplate.overlayColorPrimary, overlayColorSecondary = membershipCardTemplate.overlayColorSecondary, overlayType = membershipCardTemplate.overlayType;
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: { position: 'relative' } }, { children: [(0, jsx_runtime_1.jsxs)(S_MembershipCardBox, { children: [(0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: backgroundImageSrc, width: 288, height: 455, scaleType: "cover" }, void 0), (0, jsx_runtime_1.jsx)(S_GlossyOverlayWrapper, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: constants_1.COMMON_OVERLAY_IMAGE_SRC, width: 288, height: 455, ratio: "10_16", scaleType: "cover" }, void 0) }, void 0), (0, jsx_runtime_1.jsx)(S_LogoImageWrapper, __assign({ designSchema: designSchema }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: logoImageSrc, width: "responsive", scaleType: "contain" }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(S_MembershipCardOverlay, { overlayType: overlayType, overlayColorPrimary: overlayColorPrimary, overlayColorSecondary: overlayColorSecondary }, void 0)] }, void 0), (0, jsx_runtime_1.jsx)(S_MembershipCardShadow, {}, void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: { position: 'relative' } }, { children: [(0, jsx_runtime_1.jsxs)(S_MembershipCardBox, { children: [(0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: backgroundImageSrc, width: 288, height: 455, scaleType: "cover" }), (0, jsx_runtime_1.jsx)(S_GlossyOverlayWrapper, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: constants_1.COMMON_OVERLAY_IMAGE_SRC, width: 288, height: 455, ratio: "10_16", scaleType: "cover" }) }), (0, jsx_runtime_1.jsx)(S_LogoImageWrapper, __assign({ designSchema: designSchema }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.ImageView, { src: logoImageSrc, width: "responsive", scaleType: "contain" }) })), (0, jsx_runtime_1.jsx)(S_MembershipCardOverlay, { overlayType: overlayType, overlayColorPrimary: overlayColorPrimary, overlayColorSecondary: overlayColorSecondary })] }), (0, jsx_runtime_1.jsx)(S_MembershipCardShadow, {})] })));
 }
 var S_MembershipCardBox = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  border-radius: 12px;\n  height: 455px;\n  min-width: 288px;\n  overflow: hidden;\n  position: relative;\n"], ["\n  border-radius: 12px;\n  height: 455px;\n  min-width: 288px;\n  overflow: hidden;\n  position: relative;\n"])));
 var S_GlossyOverlayWrapper = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  inset: 0;\n  position: absolute;\n  z-index: 4;\n"], ["\n  inset: 0;\n  position: absolute;\n  z-index: 4;\n"])));
@@ -198,7 +202,7 @@ var overlaySolidType = (0, styled_components_1.css)(templateObject_12 || (templa
 });
 var overlayGradientType = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  background: ", ";\n"], ["\n  background: ", ";\n"])), function (_a) {
     var overlayColorPrimary = _a.overlayColorPrimary, overlayColorSecondary = _a.overlayColorSecondary;
-    return "linear-gradient(135deg, " + overlayColorPrimary + ", " + overlayColorSecondary + ")";
+    return "linear-gradient(135deg, ".concat(overlayColorPrimary, ", ").concat(overlayColorSecondary, ")");
 });
 var S_MembershipCardOverlay = styled_components_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  height: 455px;\n  position: absolute;\n  top: 0;\n  width: 288px;\n  z-index: 2;\n\n  ", "\n"], ["\n  height: 455px;\n  position: absolute;\n  top: 0;\n  width: 288px;\n  z-index: 2;\n\n  ", "\n"])), function (_a) {
     var overlayType = _a.overlayType;
@@ -216,7 +220,7 @@ var S_MembershipCardOverlay = styled_components_1.default.div(templateObject_14
 var S_MembershipCardShadow = styled_components_1.default.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  height: 455px;\n  position: absolute;\n  top: 0;\n  width: 288px;\n\n  &::after {\n    border-radius: 12px;\n    box-shadow: 0 25px 30px 0 rgba(0, 0, 0, 0.2);\n    content: '';\n    height: 100%;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n"], ["\n  height: 455px;\n  position: absolute;\n  top: 0;\n  width: 288px;\n\n  &::after {\n    border-radius: 12px;\n    box-shadow: 0 25px 30px 0 rgba(0, 0, 0, 0.2);\n    content: '';\n    height: 100%;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n"])));
 function ColorOverrideIcon(_a) {
     var iconColor = _a.iconColor, iconName = _a.iconName;
-    return ((0, jsx_runtime_1.jsx)(S_ColorOverrideIconWrapper, __assign({ "x-dlayout-membership-item-element-name": "Icon", iconColor: iconColor }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.Icon, { colorKey: "ui_cpnt_icon_sys_grey_01", iconName: iconName }, void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(S_ColorOverrideIconWrapper, __assign({ "x-dlayout-membership-item-element-name": "Icon", iconColor: iconColor }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.Icon, { colorKey: "ui_cpnt_icon_sys_grey_01", iconName: iconName }) })));
 }
 var S_ColorOverrideIconWrapper = styled_components_1.default.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  justify-content: center;\n\n  & path {\n    stroke: ", ";\n  }\n"], ["\n  align-items: center;\n  display: flex;\n  justify-content: center;\n\n  & path {\n    stroke: ", ";\n  }\n"])), function (_a) {
     var iconColor = _a.iconColor;
@@ -224,7 +228,7 @@ var S_ColorOverrideIconWrapper = styled_components_1.default.div(templateObject_
 });
 function XlargeMainButton(_a) {
     var buttonTextColor = _a.buttonTextColor, buttonBackgroundColor = _a.buttonBackgroundColor, _b = _a.state, state = _b === void 0 ? 'normal' : _b, buttonText = _a.buttonText, $paddingBottom = _a.$paddingBottom;
-    return ((0, jsx_runtime_1.jsx)(S_XlargeMainButtonPropsWrapper, __assign({ "x-dlayout-membership-item-element-name": "Icon", buttonTextColor: buttonTextColor, buttonBackgroundColor: buttonBackgroundColor, "$paddingBottom": $paddingBottom }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: buttonText, size: "rlarge", state: state, responsiveMode: "use" }, void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(S_XlargeMainButtonPropsWrapper, __assign({ "x-dlayout-membership-item-element-name": "Icon", buttonTextColor: buttonTextColor, buttonBackgroundColor: buttonBackgroundColor, "$paddingBottom": $paddingBottom }, { children: (0, jsx_runtime_1.jsx)(pdsOriginal_1.D_MainButton, { text: buttonText, size: "rlarge", state: state, responsiveMode: "use" }) })));
 }
 var S_XlargeMainButtonPropsWrapper = styled_components_1.default.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  margin-top: ", ";\n  padding-bottom: ", ";\n\n  & > button {\n    background-color: ", ";\n    box-sizing: border-box;\n    height: 64px;\n\n    & div {\n      color: ", ";\n      text-align: center;\n    }\n  }\n"], ["\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  margin-top: ", ";\n  padding-bottom: ", ";\n\n  & > button {\n    background-color: ", ";\n    box-sizing: border-box;\n    height: 64px;\n\n    & div {\n      color: ", ";\n      text-align: center;\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/sub/DynamicLayout/sections/MembershipSection/components/mobile/MembershipSectionItem.d.ts

@@ -16,7 +16,7 @@ declare namespace MembershipSectionItem {
     var ColorOverrideIcon: ({ iconColor, iconName }: ColorOverrideIconProps) => JSX.Element;
     var XlargeMainButton: ({ buttonTextColor, buttonBackgroundColor, buttonText, onClick, state }: XlargeMainButtonProps) => JSX.Element;
 }
-declare type IconButtonProps = {
+type IconButtonProps = {
     iconButtonIconColor: string;
     iconButtonDisabledIconColor: string;
     iconButtonBorderColor: string;
@@ -27,15 +27,15 @@ declare type IconButtonProps = {
     state?: 'normal' | 'disabled';
     onClick?: (value?: number | string) => void;
 };
-declare type MembershipCardProps = {
+type MembershipCardProps = {
     membershipCardTemplate: IMembershipCardTemplate;
     cardWidth?: number;
 };
-declare type ColorOverrideIconProps = {
+type ColorOverrideIconProps = {
     iconColor: string;
     iconName: FillIconNameKeys | LineIconNameKeys;
 };
-declare type XlargeMainButtonProps = {
+type XlargeMainButtonProps = {
     buttonTextColor?: string;
     buttonBackgroundColor?: string;
     buttonText?: string;