pds-dev-kit-web-test 0.1.3 → 0.1.5

package/dist/src/sub/DynamicLayout/sections/IntroSection/templates/TemplateC/desktop/D_TemplateC.js

@@ -3,30 +3,23 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
-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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
 };
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var styled_components_1 = __importDefault(require("styled-components"));
 var desktop_1 = require("../../../../../components/desktop");
 var Section_1 = require("../../../../../components/Section");
@@ -36,25 +29,16 @@ function TemplateC() {
     var _b = section.styles, titleColorInHex = _b.titleColorInHex, descriptionColorInHex = _b.descriptionColorInHex;
     var _c = section.properties, buttonAlphaLabel = _c.buttonAlphaLabel, buttonAlphaLinkSrc = _c.buttonAlphaLinkSrc, buttonAlphaLinkType = _c.buttonAlphaLinkType, buttonBravoLabel = _c.buttonBravoLabel, buttonBravoLinkSrc = _c.buttonBravoLinkSrc, buttonBravoLinkType = _c.buttonBravoLinkType, buttonCharlieLabel = _c.buttonCharlieLabel, buttonCharlieLinkSrc = _c.buttonCharlieLinkSrc, buttonCharlieLinkType = _c.buttonCharlieLinkType;
     var _d = section.styles, buttonAlphaDesignType = _d.buttonAlphaDesignType, buttonAlphaBackgroundColorInHex = _d.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _d.buttonAlphaLabelColorInHex, buttonBravoDesignType = _d.buttonBravoDesignType, buttonBravoBackgroundColorInHex = _d.buttonBravoBackgroundColorInHex, buttonBravoLabelColorInHex = _d.buttonBravoLabelColorInHex, buttonCharlieDesignType = _d.buttonCharlieDesignType, buttonCharlieBackgroundColorInHex = _d.buttonCharlieBackgroundColorInHex, buttonCharlieLabelColorInHex = _d.buttonCharlieLabelColorInHex;
-    return (react_1.default.createElement(S_FullScreenWrapper, null,
-        react_1.default.createElement(S_ContentsArea, null,
-            react_1.default.createElement(S_ContentsBox, null,
-                title && (react_1.default.createElement(desktop_1.Section.Title, { text: title, color: titleColorInHex, customFontSize: "60px", customFontWeight: "bold", lineHeight: 1.2 })),
-                description && (react_1.default.createElement(S_SectionDescriptionBox, { hasTitle: !!title },
-                    react_1.default.createElement(desktop_1.Section.Description, { text: description, color: descriptionColorInHex, styleTheme: "headingBold" }))),
-                (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && (react_1.default.createElement(S_SectionButtonBox, { hasTitle: !!title, hasDescription: !!description },
-                    buttonAlphaLinkSrc && (react_1.default.createElement(desktop_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex })),
-                    buttonBravoLinkSrc && (react_1.default.createElement(desktop_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex })),
-                    buttonCharlieLinkSrc && (react_1.default.createElement(desktop_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex }))))))));
+    return ((0, jsx_runtime_1.jsx)(S_FullScreenWrapper, { children: (0, jsx_runtime_1.jsx)(S_ContentsArea, { children: (0, jsx_runtime_1.jsxs)(S_ContentsBox, { children: [title && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Title, { text: title, color: titleColorInHex, customFontSize: "60px", customFontWeight: "bold", lineHeight: 1.2 }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_SectionDescriptionBox, __assign({ hasTitle: !!title }, { children: (0, jsx_runtime_1.jsx)(desktop_1.Section.Description, { text: description, color: descriptionColorInHex, styleTheme: "headingBold" }, void 0) }), void 0)), (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && ((0, jsx_runtime_1.jsxs)(S_SectionButtonBox, __assign({ hasTitle: !!title, hasDescription: !!description }, { children: [buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0)), buttonBravoLinkSrc && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex }, void 0)), buttonCharlieLinkSrc && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex }, void 0))] }), void 0))] }, void 0) }, void 0) }, void 0));
 }
-var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  min-height: 80vh;\n  height: auto;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n"], ["\n  width: 100%;\n  min-height: 80vh;\n  height: auto;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n"])));
-var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\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  min-width: var(--min-width-px);\n  max-width: var(--max-width-px);\n  display: flex;\n  align-items: center;\n  margin: 160px 0;\n"], ["\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\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  min-width: var(--min-width-px);\n  max-width: var(--max-width-px);\n  display: flex;\n  align-items: center;\n  margin: 160px 0;\n"])));
+var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  box-sizing: border-box;\n  display: flex;\n  height: auto;\n  justify-content: center;\n  min-height: 80vh;\n  width: 100%;\n"], ["\n  box-sizing: border-box;\n  display: flex;\n  height: auto;\n  justify-content: center;\n  min-height: 80vh;\n  width: 100%;\n"])));
+var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __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  align-items: center;\n  display: flex;\n  margin: 160px 0;\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  align-items: center;\n  display: flex;\n  margin: 160px 0;\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"])));
 var S_ContentsBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  max-width: 800px;\n"], ["\n  max-width: 800px;\n"])));
 var S_SectionDescriptionBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-top: ", ";\n"], ["\n  margin-top: ", ";\n"])), function (_a) {
     var theme = _a.theme, hasTitle = _a.hasTitle;
     return hasTitle && theme.spacing.spacingF;
 });
-var S_SectionButtonBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  margin-top: ", ";\n  display: flex;\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"], ["\n  margin-top: ", ";\n  display: flex;\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"])), function (_a) {
+var S_SectionButtonBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  margin-top: ", ";\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"], ["\n  display: flex;\n  margin-top: ", ";\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme, hasTitle = _a.hasTitle, hasDescription = _a.hasDescription;
     return (hasTitle || hasDescription) && theme.spacing.spacingH;
 }, function (_a) {

package/dist/src/sub/DynamicLayout/sections/IntroSection/templates/TemplateC/mobile/M_TemplateC.js

@@ -3,30 +3,23 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
-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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
 };
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var styled_components_1 = __importDefault(require("styled-components"));
 var mobile_1 = require("../../../../../components/mobile");
 var Section_1 = require("../../../../../components/Section");
@@ -36,18 +29,10 @@ function TemplateC() {
     var _b = section.styles, titleColorInHex = _b.titleColorInHex, descriptionColorInHex = _b.descriptionColorInHex;
     var _c = section.properties, buttonAlphaLabel = _c.buttonAlphaLabel, buttonAlphaLinkSrc = _c.buttonAlphaLinkSrc, buttonAlphaLinkType = _c.buttonAlphaLinkType, buttonBravoLabel = _c.buttonBravoLabel, buttonBravoLinkSrc = _c.buttonBravoLinkSrc, buttonBravoLinkType = _c.buttonBravoLinkType, buttonCharlieLabel = _c.buttonCharlieLabel, buttonCharlieLinkSrc = _c.buttonCharlieLinkSrc, buttonCharlieLinkType = _c.buttonCharlieLinkType;
     var _d = section.styles, buttonAlphaDesignType = _d.buttonAlphaDesignType, buttonAlphaBackgroundColorInHex = _d.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _d.buttonAlphaLabelColorInHex, buttonBravoDesignType = _d.buttonBravoDesignType, buttonBravoBackgroundColorInHex = _d.buttonBravoBackgroundColorInHex, buttonBravoLabelColorInHex = _d.buttonBravoLabelColorInHex, buttonCharlieDesignType = _d.buttonCharlieDesignType, buttonCharlieBackgroundColorInHex = _d.buttonCharlieBackgroundColorInHex, buttonCharlieLabelColorInHex = _d.buttonCharlieLabelColorInHex;
-    return (react_1.default.createElement(S_FullScreenWrapper, null,
-        react_1.default.createElement(S_ContentsArea, null,
-            title && (react_1.default.createElement(mobile_1.Section.Title, { text: title, color: titleColorInHex, customFontSize: "37px", customFontWeight: "bold", lineHeight: 1.3 })),
-            description && (react_1.default.createElement(S_SectionDescriptionBox, { hasTitle: !!title },
-                react_1.default.createElement(mobile_1.Section.Description, { text: description, color: descriptionColorInHex, styleTheme: "body1Bold" }))),
-            (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && (react_1.default.createElement(S_SectionButtonBox, { hasTitle: !!title, hasDescription: !!description },
-                buttonAlphaLinkSrc && (react_1.default.createElement(mobile_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex })),
-                buttonBravoLinkSrc && (react_1.default.createElement(mobile_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex })),
-                buttonCharlieLinkSrc && (react_1.default.createElement(mobile_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex })))))));
+    return ((0, jsx_runtime_1.jsx)(S_FullScreenWrapper, { children: (0, jsx_runtime_1.jsxs)(S_ContentsArea, { children: [title && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Title, { text: title, color: titleColorInHex, customFontSize: "37px", customFontWeight: "bold", lineHeight: 1.3 }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_SectionDescriptionBox, __assign({ hasTitle: !!title }, { children: (0, jsx_runtime_1.jsx)(mobile_1.Section.Description, { text: description, color: descriptionColorInHex, styleTheme: "body1Bold" }, void 0) }), void 0)), (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && ((0, jsx_runtime_1.jsxs)(S_SectionButtonBox, __assign({ hasTitle: !!title, hasDescription: !!description }, { children: [buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0)), buttonBravoLinkSrc && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex }, void 0)), buttonCharlieLinkSrc && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex }, void 0))] }), void 0))] }, void 0) }, void 0));
 }
-var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  min-height: 80vh;\n  display: flex;\n  align-items: center;\n"], ["\n  width: 100%;\n  min-height: 80vh;\n  display: flex;\n  align-items: center;\n"])));
-var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n"], ["\n  width: 100%;\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n"])), function (_a) {
+var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  min-height: 80vh;\n  width: 100%;\n"], ["\n  align-items: center;\n  display: flex;\n  min-height: 80vh;\n  width: 100%;\n"])));
+var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n  width: 100%;\n"], ["\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n  width: 100%;\n"])), function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingG;
 }, function (_a) {

package/dist/src/sub/DynamicLayout/sections/IntroSection/templates/TemplateD/TemplateD.js

@@ -1,33 +1,15 @@
 "use strict";
-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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var dynamicLayoutContext_1 = require("../../../../dynamicLayoutContext");
 var desktop_1 = require("./desktop");
 var mobile_1 = require("./mobile");
 function TemplateD() {
     var device = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext).device;
-    return (react_1.default.createElement(react_1.default.Fragment, null, {
-        MOBILE: react_1.default.createElement(mobile_1.M_TemplateD, null),
-        DESKTOP: react_1.default.createElement(desktop_1.D_TemplateD, null)
-    }[device]));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: {
+            MOBILE: (0, jsx_runtime_1.jsx)(mobile_1.M_TemplateD, {}, void 0),
+            DESKTOP: (0, jsx_runtime_1.jsx)(desktop_1.D_TemplateD, {}, void 0)
+        }[device] }, void 0));
 }
 exports.default = TemplateD;

package/dist/src/sub/DynamicLayout/sections/IntroSection/templates/TemplateD/desktop/D_TemplateD.js

@@ -3,30 +3,23 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
-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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
 };
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var styled_components_1 = __importDefault(require("styled-components"));
 var desktop_1 = require("../../../../../components/desktop");
 var Section_1 = require("../../../../../components/Section");
@@ -36,24 +29,15 @@ function TemplateD() {
     var _b = section.styles, titleColorInHex = _b.titleColorInHex, descriptionColorInHex = _b.descriptionColorInHex;
     var _c = section.properties, buttonAlphaLabel = _c.buttonAlphaLabel, buttonAlphaLinkSrc = _c.buttonAlphaLinkSrc, buttonAlphaLinkType = _c.buttonAlphaLinkType, buttonBravoLabel = _c.buttonBravoLabel, buttonBravoLinkSrc = _c.buttonBravoLinkSrc, buttonBravoLinkType = _c.buttonBravoLinkType, buttonCharlieLabel = _c.buttonCharlieLabel, buttonCharlieLinkSrc = _c.buttonCharlieLinkSrc, buttonCharlieLinkType = _c.buttonCharlieLinkType;
     var _d = section.styles, buttonAlphaDesignType = _d.buttonAlphaDesignType, buttonAlphaBackgroundColorInHex = _d.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _d.buttonAlphaLabelColorInHex, buttonBravoDesignType = _d.buttonBravoDesignType, buttonBravoBackgroundColorInHex = _d.buttonBravoBackgroundColorInHex, buttonBravoLabelColorInHex = _d.buttonBravoLabelColorInHex, buttonCharlieDesignType = _d.buttonCharlieDesignType, buttonCharlieBackgroundColorInHex = _d.buttonCharlieBackgroundColorInHex, buttonCharlieLabelColorInHex = _d.buttonCharlieLabelColorInHex;
-    return (react_1.default.createElement(S_FullScreenWrapper, null,
-        react_1.default.createElement(S_ContentsArea, null,
-            react_1.default.createElement("div", null,
-                title && (react_1.default.createElement(desktop_1.Section.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "60px", customFontWeight: "bold", lineHeight: 1.2 })),
-                description && (react_1.default.createElement(S_SectionDescriptionBox, { hasTitle: !!title },
-                    react_1.default.createElement(desktop_1.Section.Description, { text: description, color: descriptionColorInHex, textAlign: "center", styleTheme: "headingBold" }))),
-                (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && (react_1.default.createElement(S_SectionButtonBox, { hasTitle: !!title, hasDescription: !!description },
-                    buttonAlphaLinkSrc && (react_1.default.createElement(desktop_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex })),
-                    buttonBravoLinkSrc && (react_1.default.createElement(desktop_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex })),
-                    buttonCharlieLinkSrc && (react_1.default.createElement(desktop_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex }))))))));
+    return ((0, jsx_runtime_1.jsx)(S_FullScreenWrapper, { children: (0, jsx_runtime_1.jsx)(S_ContentsArea, { children: (0, jsx_runtime_1.jsxs)("div", { children: [title && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "60px", customFontWeight: "bold", lineHeight: 1.2 }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_SectionDescriptionBox, __assign({ hasTitle: !!title }, { children: (0, jsx_runtime_1.jsx)(desktop_1.Section.Description, { text: description, color: descriptionColorInHex, textAlign: "center", styleTheme: "headingBold" }, void 0) }), void 0)), (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && ((0, jsx_runtime_1.jsxs)(S_SectionButtonBox, __assign({ hasTitle: !!title, hasDescription: !!description }, { children: [buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0)), buttonBravoLinkSrc && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex }, void 0)), buttonCharlieLinkSrc && ((0, jsx_runtime_1.jsx)(desktop_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex }, void 0))] }), void 0))] }, void 0) }, void 0) }, void 0));
 }
-var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  min-height: 80vh;\n  height: auto;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"], ["\n  width: 100%;\n  min-height: 80vh;\n  height: auto;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));
-var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\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  min-width: var(--min-width-px);\n  max-width: var(--max-width-px);\n  margin: 160px auto;\n"], ["\n  --min-width: 1000;\n  --min-width-px: 1000px;\n  --max-width: 1500;\n  --max-width-px: 1500px;\n  --min-viewport-width: 1200;\n  --min-viewport-width-px: 1200px;\n  --max-viewport-width: 1920;\n  --max-viewport-width-px: 1920px;\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  min-width: var(--min-width-px);\n  max-width: var(--max-width-px);\n  margin: 160px auto;\n"])));
+var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  box-sizing: border-box;\n  display: flex;\n  height: auto;\n  justify-content: center;\n  min-height: 80vh;\n  width: 100%;\n"], ["\n  align-items: center;\n  box-sizing: border-box;\n  display: flex;\n  height: auto;\n  justify-content: center;\n  min-height: 80vh;\n  width: 100%;\n"])));
+var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __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: 160px 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: 160px 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"])));
 var S_SectionDescriptionBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  margin-top: ", ";\n"], ["\n  margin-top: ", ";\n"])), function (_a) {
     var theme = _a.theme, hasTitle = _a.hasTitle;
     return hasTitle && theme.spacing.spacingF;
 });
-var S_SectionButtonBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-top: ", ";\n  display: flex;\n  justify-content: center;\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"], ["\n  margin-top: ", ";\n  display: flex;\n  justify-content: center;\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"])), function (_a) {
+var S_SectionButtonBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  margin-top: ", ";\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"], ["\n  display: flex;\n  justify-content: center;\n  margin-top: ", ";\n\n  & > div {\n    &:not(:first-child) {\n      margin-left: ", ";\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme, hasTitle = _a.hasTitle, hasDescription = _a.hasDescription;
     return (hasTitle || hasDescription) && theme.spacing.spacingH;
 }, function (_a) {

package/dist/src/sub/DynamicLayout/sections/IntroSection/templates/TemplateD/mobile/M_TemplateD.js

@@ -3,30 +3,23 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
-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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
 };
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var styled_components_1 = __importDefault(require("styled-components"));
 var mobile_1 = require("../../../../../components/mobile");
 var Section_1 = require("../../../../../components/Section");
@@ -36,18 +29,10 @@ function TemplateD() {
     var _b = section.styles, titleColorInHex = _b.titleColorInHex, descriptionColorInHex = _b.descriptionColorInHex;
     var _c = section.properties, buttonAlphaLabel = _c.buttonAlphaLabel, buttonAlphaLinkSrc = _c.buttonAlphaLinkSrc, buttonAlphaLinkType = _c.buttonAlphaLinkType, buttonBravoLabel = _c.buttonBravoLabel, buttonBravoLinkSrc = _c.buttonBravoLinkSrc, buttonBravoLinkType = _c.buttonBravoLinkType, buttonCharlieLabel = _c.buttonCharlieLabel, buttonCharlieLinkSrc = _c.buttonCharlieLinkSrc, buttonCharlieLinkType = _c.buttonCharlieLinkType;
     var _d = section.styles, buttonAlphaDesignType = _d.buttonAlphaDesignType, buttonAlphaBackgroundColorInHex = _d.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _d.buttonAlphaLabelColorInHex, buttonBravoDesignType = _d.buttonBravoDesignType, buttonBravoBackgroundColorInHex = _d.buttonBravoBackgroundColorInHex, buttonBravoLabelColorInHex = _d.buttonBravoLabelColorInHex, buttonCharlieDesignType = _d.buttonCharlieDesignType, buttonCharlieBackgroundColorInHex = _d.buttonCharlieBackgroundColorInHex, buttonCharlieLabelColorInHex = _d.buttonCharlieLabelColorInHex;
-    return (react_1.default.createElement(S_FullScreenWrapper, null,
-        react_1.default.createElement(S_ContentsArea, null,
-            title && (react_1.default.createElement(mobile_1.Section.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "37px", customFontWeight: "bold", lineHeight: 1.3 })),
-            description && (react_1.default.createElement(S_SectionDescriptionBox, { hasTitle: !!title },
-                react_1.default.createElement(mobile_1.Section.Description, { text: description, color: descriptionColorInHex, textAlign: "center", styleTheme: "body1Bold" }))),
-            (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && (react_1.default.createElement(S_SectionButtonBox, { hasTitle: !!title, hasDescription: !!description },
-                buttonAlphaLinkSrc && (react_1.default.createElement(mobile_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex })),
-                buttonBravoLinkSrc && (react_1.default.createElement(mobile_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex })),
-                buttonCharlieLinkSrc && (react_1.default.createElement(mobile_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex })))))));
+    return ((0, jsx_runtime_1.jsx)(S_FullScreenWrapper, { children: (0, jsx_runtime_1.jsxs)(S_ContentsArea, { children: [title && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "37px", customFontWeight: "bold", lineHeight: 1.3 }, void 0)), description && ((0, jsx_runtime_1.jsx)(S_SectionDescriptionBox, __assign({ hasTitle: !!title }, { children: (0, jsx_runtime_1.jsx)(mobile_1.Section.Description, { text: description, color: descriptionColorInHex, textAlign: "center", styleTheme: "body1Bold" }, void 0) }), void 0)), (buttonAlphaLinkSrc || buttonBravoLinkSrc || buttonCharlieLinkSrc) && ((0, jsx_runtime_1.jsxs)(S_SectionButtonBox, __assign({ hasTitle: !!title, hasDescription: !!description }, { children: [buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Button, { text: buttonAlphaLabel, src: buttonAlphaLinkSrc, linkType: buttonAlphaLinkType, buttonType: buttonAlphaDesignType, backgroundColor: buttonAlphaBackgroundColorInHex, textColor: buttonAlphaLabelColorInHex, borderColor: buttonAlphaLabelColorInHex }, void 0)), buttonBravoLinkSrc && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Button, { text: buttonBravoLabel, src: buttonBravoLinkSrc, linkType: buttonBravoLinkType, buttonType: buttonBravoDesignType, backgroundColor: buttonBravoBackgroundColorInHex, textColor: buttonBravoLabelColorInHex, borderColor: buttonBravoLabelColorInHex }, void 0)), buttonCharlieLinkSrc && ((0, jsx_runtime_1.jsx)(mobile_1.Section.Button, { text: buttonCharlieLabel, src: buttonCharlieLinkSrc, linkType: buttonCharlieLinkType, buttonType: buttonCharlieDesignType, backgroundColor: buttonCharlieBackgroundColorInHex, textColor: buttonCharlieLabelColorInHex, borderColor: buttonCharlieLabelColorInHex }, void 0))] }), void 0))] }, void 0) }, void 0));
 }
-var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  min-height: 80vh;\n  display: flex;\n  align-items: center;\n"], ["\n  width: 100%;\n  min-height: 80vh;\n  display: flex;\n  align-items: center;\n"])));
-var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n"], ["\n  width: 100%;\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n"])), function (_a) {
+var S_FullScreenWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  min-height: 80vh;\n  width: 100%;\n"], ["\n  align-items: center;\n  display: flex;\n  min-height: 80vh;\n  width: 100%;\n"])));
+var S_ContentsArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n  width: 100%;\n"], ["\n  box-sizing: border-box;\n  margin: ", " 0;\n  padding: 0 ", ";\n  width: 100%;\n"])), function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingG;
 }, function (_a) {
@@ -58,7 +43,7 @@ var S_SectionDescriptionBox = styled_components_1.default.div(templateObject_3 |
     var theme = _a.theme, hasTitle = _a.hasTitle;
     return hasTitle && theme.spacing.spacingE;
 });
-var S_SectionButtonBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-top: ", ";\n\n  & > div {\n    margin-top: ", ";\n    width: fit-content;\n    margin-left: auto;\n    margin-right: auto;\n  }\n"], ["\n  margin-top: ", ";\n\n  & > div {\n    margin-top: ", ";\n    width: fit-content;\n    margin-left: auto;\n    margin-right: auto;\n  }\n"])), function (_a) {
+var S_SectionButtonBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-top: ", ";\n\n  & > div {\n    margin-left: auto;\n    margin-right: auto;\n    margin-top: ", ";\n    width: fit-content;\n  }\n"], ["\n  margin-top: ", ";\n\n  & > div {\n    margin-left: auto;\n    margin-right: auto;\n    margin-top: ", ";\n    width: fit-content;\n  }\n"])), function (_a) {
     var theme = _a.theme, hasTitle = _a.hasTitle, hasDescription = _a.hasDescription;
     return (hasTitle || hasDescription) && theme.spacing.spacingG;
 }, function (_a) {

package/dist/src/sub/index.d.ts

@@ -1,2 +1 @@
 export { DynamicLayout } from './DynamicLayout';
-export * from './AdminList';

package/dist/src/sub/index.js

@@ -1,16 +1,6 @@
 "use strict";
-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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DynamicLayout = void 0;
+// NOTE: 이름은 변경될 수 있습니다.
 var DynamicLayout_1 = require("./DynamicLayout");
 Object.defineProperty(exports, "DynamicLayout", { enumerable: true, get: function () { return DynamicLayout_1.DynamicLayout; } });
-__exportStar(require("./AdminList"), exports);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web-test",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",
@@ -34,7 +34,7 @@
   },
   "scripts": {
     "build": "rm -rf ./dist && tsc",
-    "prepare": "npm run build",
+    "prepare": "npm run build | husky install",
     "sync:color": "dotenv -e env/.env node syncColor.ts",
     "storybook": "start-storybook -p 6006",
     "build:storybook": "build-storybook",
@@ -94,9 +94,12 @@
     "eslint-config-airbnb": "^18.2.1",
     "eslint-config-prettier": "^8.3.0",
     "eslint-import-resolver-typescript": "^2.4.0",
+    "eslint-plugin-better-styled-components": "^1.1.2",
     "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-react": "^7.24.0",
+    "husky": "^8.0.3",
+    "lint-staged": "^13.1.2",
     "prettier": "^2.4.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",

package/release-note.md

@@ -1,10 +1,12 @@
-# pds-dev-kit-web-test Release Notes
-## [v0.1.3]
+# PDS-DEV-KIT-WEB-TEST Release Notes
+## [v0.1.5]
+## 기준 pds-dev-kit-web 버전 @1.9.18
 
-## 기준 pds-dev-kit-web 버전 @1.9.12
-### Component
-* PageTitleTextGroup
-  * tooltipText prop 추가
-  * dateBtn 관련 props 추가
-### sub
-  * AdminList 추가
+### Package
+* eslint가 올바르게 동작하도록 수정
+  * tsconfig.json에서 baseUrl 추가
+  * styled-components order lint가 적용되도록 eslint-plugin-better-styled-components 추가
+* husky 추가
+* commitlint 라이브러리의 의존성 이슈로 기능을 구현해서 추가
+* 스토리북 북마크 작성시 타입 전달이 잘 되도록 수정
+  * export const Default = Template.bind({}); 부분에서 bind이후에 Default에도 타입이 이어지도록 수정

package/tsconfig.extend.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./",
+    "paths": {
+      "@common/*": ["./src/common/*"],
+      "@desktop/*": ["./src/desktop/*"],
+      "@hybrid/*": ["./src/hybrid/*"],
+      "@mobile/*": ["./src/mobile/*"],
+      "@sub/*": ["./src/sub/*"]
+    }
+  },
+  "exclude": ["**/*.stories.*"]
+}

package/dist/src/desktop/components/PageTitleTextGroup/DateButton.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { PDSTextType } from '../../../common';
-declare type Props = {
-    titleText?: PDSTextType;
-    contentText?: PDSTextType;
-    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
-    onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
-};
-declare function DateButton({ titleText, contentText, onClick, onMouseDown }: Props): JSX.Element;
-export default DateButton;

package/dist/src/sub/AdminList/AdminList/AdminList.d.ts

@@ -1,54 +0,0 @@
-import { TFunctionResult } from 'i18next';
-import React from 'react';
-import { PDSValueOption } from '../../../common';
-import BulkActionBar from '../BulkActionBar/BulkActionBar';
-import ToolBar from '../ToolBar/ToolBar';
-declare type ColumnWidthType = 'small' | 'medium' | 'large';
-declare type Props = {
-    selectionMode?: 'none' | 'single' | 'multi';
-    headerRowMode?: 'none' | 'use';
-    column2HeaderText: TFunctionResult;
-    column3HeaderText?: TFunctionResult;
-    column3Width?: ColumnWidthType;
-    column4HeaderText?: TFunctionResult;
-    column4Width?: ColumnWidthType;
-    column5HeaderText?: TFunctionResult;
-    column5Width?: ColumnWidthType;
-    column6HeaderText?: TFunctionResult;
-    column6Width?: ColumnWidthType;
-    column7HeaderText?: TFunctionResult;
-    column7Width?: ColumnWidthType;
-    column8HeaderText?: TFunctionResult;
-    column8Width?: ColumnWidthType;
-    column9HeaderText?: TFunctionResult;
-    column9Width?: ColumnWidthType;
-    column10HeaderText?: TFunctionResult;
-    column10Width?: ColumnWidthType;
-    quickActionBtnMode?: 'none' | 'btn_amount1' | 'btn_amount2' | 'btn_amount3';
-    quickActionBtn1Text?: TFunctionResult;
-    quickActionBtn2Text?: TFunctionResult;
-    quickActionBtn3Text?: TFunctionResult;
-    quickActionBtnType?: 'hover' | 'fix';
-    emptyText?: TFunctionResult;
-    scrollMode?: 'infinite' | 'none' | 'page';
-    scrollVisibleType?: 'moving' | 'hidden' | 'visible';
-    headerRowCheckboxName?: string;
-    flexibleHideInfoMode?: 'use' | 'none';
-    toolBar?: React.ReactElement<React.ComponentProps<typeof ToolBar>>;
-    bulkActionBar?: React.ReactElement<React.ComponentProps<typeof BulkActionBar>>;
-    onChangeDropdown1?: (value: PDSValueOption) => void;
-    onChangeDropdown2?: (value: PDSValueOption) => void;
-    onChangeDropdown3?: (value: PDSValueOption) => void;
-    onClickTBtn1?: () => void;
-    onClickTBtn2?: () => void;
-    onClickTBtn3?: () => void;
-    onClickQuickActionBtn1?: (id: number) => void;
-    onClickQuickActionBtn2?: (id: number) => void;
-    onClickQuickActionBtn3?: (id: number) => void;
-    children?: React.ReactNode;
-    onSelect?: (ids: number[]) => void;
-    selectedIds?: number[];
-    maintainIds?: number[];
-};
-declare function AdminList({ toolBar, bulkActionBar, selectionMode, headerRowMode, column2HeaderText, column3HeaderText, column3Width, column4HeaderText, column4Width, column5HeaderText, column5Width, column6HeaderText, column6Width, column7HeaderText, column7Width, column8HeaderText, column8Width, column9HeaderText, column9Width, column10HeaderText, column10Width, quickActionBtnMode, quickActionBtn1Text, quickActionBtn2Text, quickActionBtn3Text, quickActionBtnType, emptyText, scrollMode, scrollVisibleType, selectedIds, maintainIds, children, headerRowCheckboxName, flexibleHideInfoMode, onClickQuickActionBtn1, onClickQuickActionBtn2, onClickQuickActionBtn3, onSelect }: Props): JSX.Element;
-export default AdminList;