pds-dev-kit-web-test 0.1.4 → 0.1.6

package/dist/src/sub/DynamicLayout/components/pdsOriginal/hybrid/Spacing/Spacing.js

@@ -22,15 +22,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_components_1 = __importStar(require("styled-components"));
 function Spacing(_a) {
     var size = _a.size, _b = _a.spacingType, spacingType = _b === void 0 ? 'height' : _b;
-    return (react_1.default.createElement(S_Spacing, { "x-pds-name": "Spacing", "x-pds-element-type": "component", "x-pds-device-type": "hybrid", size: size, spacingType: spacingType }));
+    return ((0, jsx_runtime_1.jsx)(S_Spacing, { "x-pds-name": "Spacing", "x-pds-element-type": "component", "x-pds-device-type": "hybrid", size: size, spacingType: spacingType }, void 0));
 }
 var spacing_a = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: ", ";\n  min-height: ", ";\n  min-width: ", ";\n  width: ", ";\n"], ["\n  height: ", ";\n  min-height: ", ";\n  min-width: ", ";\n  width: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/IconButton/IconButton.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { FillIconNameKeys, LineIconNameKeys, UiColors } from '../../common';
+/// <reference types="react" />
+import type { FillIconNameKeys, LineIconNameKeys, UiColors } from '../../common';
 export declare type IconButtonProps = {
     fillType?: 'fill' | 'line';
     shapeType?: 'circular' | 'rectangle';

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/IconButton/IconButton.js

@@ -3,6 +3,17 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
+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 __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]; } });
@@ -22,11 +33,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_components_1 = __importStar(require("styled-components"));
 var hybrid_1 = require("../../hybrid");
 function IconButton(_a) {
@@ -64,8 +72,7 @@ function IconButton(_a) {
         }
         return iconStateColorObj[fillType];
     };
-    return (react_1.default.createElement(S_IconButton, { "x-pds-name": "IconButton", "x-pds-element-type": "component", "x-pds-device-type": "mobile", fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', tabIndex: tabIndex, onClick: handleClick, onMouseDown: handleMouseDown },
-        react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: iconSize, colorKey: IconColorSelect(), fillType: iconFillType })));
+    return ((0, jsx_runtime_1.jsx)(S_IconButton, __assign({ "x-pds-name": "IconButton", "x-pds-element-type": "component", "x-pds-device-type": "mobile", fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', tabIndex: tabIndex, onClick: handleClick, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: iconName, size: iconSize, colorKey: IconColorSelect(), fillType: iconFillType }, void 0) }), void 0));
 }
 var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme, baseColorKey = _a.baseColorKey;

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/MainButton/MainButton.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { FillIconNameKeys, LineIconNameKeys, PDSTextType } from '../../common';
+/// <reference types="react" />
+import type { FillIconNameKeys, LineIconNameKeys, PDSTextType } from '../../common';
 export declare type MainButtonProps = {
     text?: PDSTextType;
     shapeType?: 'round' | 'rectangle';

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/MainButton/MainButton.js

@@ -3,6 +3,17 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
+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 __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]; } });
@@ -22,11 +33,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_components_1 = __importStar(require("styled-components"));
 var components_1 = require("../../common/components");
 var styles_1 = require("../../common/styles");
@@ -135,20 +143,12 @@ function MainButton(_a) {
     };
     var MainButtonVariation = function () {
         if (isLoading) {
-            return (react_1.default.createElement(S_LoadingMainButton, { shapeType: shapeType, size: size, responsiveMode: responsiveMode, state: "disabled", disabled: true }));
+            return ((0, jsx_runtime_1.jsx)(S_LoadingMainButton, { shapeType: shapeType, size: size, responsiveMode: responsiveMode, state: "disabled", disabled: true }, void 0));
         }
         if (isSubmitting) {
-            return (react_1.default.createElement(S_MainButton, { shapeType: shapeType, fillType: fillType, styleTheme: styleTheme, size: size, responsiveMode: responsiveMode, colorTheme: colorTheme, state: "normal", disabled: true },
-                react_1.default.createElement(components_1.CircularProgress, { colorKey: submittingProgressColor(), size: size === 'rlarge' ? 'large' : size })));
+            return ((0, jsx_runtime_1.jsx)(S_MainButton, __assign({ shapeType: shapeType, fillType: fillType, styleTheme: styleTheme, size: size, responsiveMode: responsiveMode, colorTheme: colorTheme, state: "normal", disabled: true }, { children: (0, jsx_runtime_1.jsx)(components_1.CircularProgress, { colorKey: submittingProgressColor(), size: size === 'rlarge' ? 'large' : size }, void 0) }), void 0));
         }
-        return (react_1.default.createElement(S_MainButton, { "x-pds-name": "MainButton", "x-pds-element-type": "component", "x-pds-device-type": "mobile", shapeType: shapeType, fillType: fillType, styleTheme: styleTheme, size: size, responsiveMode: responsiveMode, fontWeight: fontWeight, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
-            size !== 'xsmall' && iconMode === 'left' && (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }),
-                react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }))),
-            react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor(), colorOverride: selectTextThemeColor(), ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" }),
-            size !== 'xsmall' && iconMode === 'right' && (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }),
-                react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType })))));
+        return ((0, jsx_runtime_1.jsxs)(S_MainButton, __assign({ "x-pds-name": "MainButton", "x-pds-element-type": "component", "x-pds-device-type": "mobile", shapeType: shapeType, fillType: fillType, styleTheme: styleTheme, size: size, responsiveMode: responsiveMode, fontWeight: fontWeight, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown }, { children: [size !== 'xsmall' && iconMode === 'left' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }, void 0)] }, void 0)), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor(), colorOverride: selectTextThemeColor(), ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" }, void 0), size !== 'xsmall' && iconMode === 'right' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }, void 0)] }, void 0))] }), void 0));
     };
     return MainButtonVariation();
 }
@@ -209,12 +209,12 @@ var line2 = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 =
     var theme = _a.theme;
     return theme.ui_cpnt_button_line_border_primary;
 });
-var line3 = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  border: solid 1px ", ";\n  background-color: ", ";\n\n  &:active:enabled {\n    ", "\n  }\n"], ["\n  border: solid 1px ", ";\n  background-color: ", ";\n\n  &:active:enabled {\n    ", "\n  }\n"])), function (_a) {
+var line3 = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  background-color: ", ";\n  border: solid 1px ", ";\n\n  &:active:enabled {\n    ", "\n  }\n"], ["\n  background-color: ", ";\n  border: solid 1px ", ";\n\n  &:active:enabled {\n    ", "\n  }\n"])), function (_a) {
     var theme = _a.theme;
-    return theme.ui_cpnt_button_line_border_darktheme_enabled;
+    return theme.ui_cpnt_button_line_base_darktheme_default;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.ui_cpnt_button_line_base_darktheme_default;
+    return theme.ui_cpnt_button_line_border_darktheme_enabled;
 }, function (_a) {
     var theme = _a.theme;
     return "background-color: " + theme.ui_cpnt_button_line_base_darktheme_pressed + ";";

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/TextButton/TextButton.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { PDSTextType } from '../../common';
+/// <reference types="react" />
+import type { PDSTextType } from '../../common';
 export declare type TextButtonProps = {
     text?: PDSTextType;
     size?: 'rlarge' | 'large' | 'medium' | 'small' | 'xsmall';

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/TextButton/TextButton.js

@@ -44,11 +44,8 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_components_1 = __importStar(require("styled-components"));
 var TextLabel_1 = require("../TextLabel");
 var textStyle = {
@@ -71,8 +68,7 @@ function TextButton(_a) {
             onClick(e);
         }
     };
-    return (react_1.default.createElement(S_Button, __assign({ "x-pds-name": "TextButton", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, rest, { size: size, responsiveMode: responsiveMode, onClick: handleClick, type: type, fontWeight: fontWeight, disabled: state === 'disabled', colorTheme: colorTheme }),
-        react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor[colorTheme], singleLineMode: "use" })));
+    return ((0, jsx_runtime_1.jsx)(S_Button, __assign({ "x-pds-name": "TextButton", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, rest, { size: size, responsiveMode: responsiveMode, onClick: handleClick, type: type, fontWeight: fontWeight, disabled: state === 'disabled', colorTheme: colorTheme }, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor[colorTheme], singleLineMode: "use" }, void 0) }), void 0));
 }
 var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: 14px;\n  height: 48px;\n  ", ";\n\n  & > div {\n    height: 48px;\n    line-height: 48px;\n  }\n"], ["\n  border-radius: 14px;\n  height: 48px;\n  ", ";\n\n  & > div {\n    height: 48px;\n    line-height: 48px;\n  }\n"])), function (_a) {
     var size = _a.size;

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/TextLabel/TextLabel.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PDSTextType, UiColors } from '../../common';
+import type { PDSTextType, UiColors } from '../../common';
 export declare type TextLabelProps = {
     text: PDSTextType;
     textAlign?: 'left' | 'center' | 'right';

package/dist/src/sub/DynamicLayout/components/pdsOriginal/mobile/TextLabel/TextLabel.js

@@ -3,6 +3,17 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
+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 __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]; } });
@@ -22,190 +33,183 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_components_1 = __importStar(require("styled-components"));
 var hybrid_1 = require("../../hybrid");
 function TextLabel(_a) {
     var text = _a.text, _b = _a.textAlign, textAlign = _b === void 0 ? 'left' : _b, _c = _a.styleTheme, styleTheme = _c === void 0 ? 'body2Bold' : _c, colorOverride = _a.colorOverride, _d = _a.colorTheme, colorTheme = _d === void 0 ? 'sysTextPrimary' : _d, _e = _a.singleLineMode, singleLineMode = _e === void 0 ? 'none' : _e, _f = _a.ellipsisMode, ellipsisMode = _f === void 0 ? 'none' : _f, lineLimit = _a.lineLimit, _g = _a.userSelectMode, userSelectMode = _g === void 0 ? 'none' : _g, customFontSize = _a.customFontSize, customFontWeight = _a.customFontWeight, _h = _a.textDecorationType, textDecorationType = _h === void 0 ? 'none' : _h, _j = _a.requirementMode, requirementMode = _j === void 0 ? 'none' : _j, _k = _a.bulletPointMode, bulletPointMode = _k === void 0 ? 'none' : _k, _l = _a.wordBreak, wordBreak = _l === void 0 ? 'keep_all' : _l;
-    return (react_1.default.createElement(S_TextLabel, { "x-pds-name": "TextLabel", "x-pds-element-type": "component", "x-pds-device-type": "mobile", textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit, userSelectMode: userSelectMode, customFontSize: customFontSize, customFontWeight: customFontWeight, textDecorationType: textDecorationType, bulletPointMode: bulletPointMode, wordBreak: wordBreak },
-        text,
-        requirementMode === 'use' && (react_1.default.createElement(S_AfterTextBox, { styleTheme: styleTheme },
-            react_1.default.createElement(S_IconWrapper, null,
-                react_1.default.createElement(hybrid_1.Icon, { iconName: "ic_requirement", size: 16, fillType: "line", colorKey: "ui_cpnt_icon_sys_error_01" }))))));
+    return ((0, jsx_runtime_1.jsxs)(S_TextLabel, __assign({ "x-pds-name": "TextLabel", "x-pds-element-type": "component", "x-pds-device-type": "mobile", textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit, userSelectMode: userSelectMode, customFontSize: customFontSize, customFontWeight: customFontWeight, textDecorationType: textDecorationType, bulletPointMode: bulletPointMode, wordBreak: wordBreak }, { children: [text, requirementMode === 'use' && ((0, jsx_runtime_1.jsx)(S_AfterTextBox, __assign({ styleTheme: styleTheme }, { children: (0, jsx_runtime_1.jsx)(S_IconWrapper, { children: (0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: "ic_requirement", size: 16, fillType: "line", colorKey: "ui_cpnt_icon_sys_error_01" }, void 0) }, void 0) }), void 0))] }), void 0));
 }
-var displayBold = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var displayBold = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.displayHeading;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.displayHeading;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.displayHeading;
 });
-var headingBold = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var headingBold = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.heading;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.heading;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.heading;
 });
-var leadParaBold = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var leadParaBold = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.leadParagraph;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.leadParagraph;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.leadParagraph;
 });
-var leadParaRegular = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var leadParaRegular = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.leadParagraph;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.leadParagraph;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.leadParagraph;
 });
-var subTitleBold = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var subTitleBold = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.subtitle;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.subtitle;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.subtitle;
 });
-var subTitleRegular = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var subTitleRegular = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.subtitle;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.subtitle;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.subtitle;
 });
-var body1Bold = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body1Bold = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body1;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.body1;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.body1;
 });
-var body1Regular = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body1Regular = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body1;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.body1;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.body1;
 });
-var body2Bold = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body2Bold = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body2;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.body2;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.body2;
 });
-var body2Regular = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body2Regular = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body2;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.body2;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.body2;
 });
-var caption1Bold = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption1Bold = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption1;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.caption1;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.caption1;
 });
-var caption1Regular = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption1Regular = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption1;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.caption1;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.caption1;
 });
-var caption2Bold = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption2Bold = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption2;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.caption2;
+    return theme.fontWeight.bold;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.bold;
+    return theme.mobileLineHeight.caption2;
 });
-var caption2Regular = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption2Regular = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption2;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.caption2;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.caption2;
 });
-var form1Regular = (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var form1Regular = (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.form1;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.form1;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.form1;
 });
-var form2Regular = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var form2Regular = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.form2;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.form2;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.form2;
 });
-var blog1Regular = (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var blog1Regular = (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.blog1;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.mobileLineHeight.blog1;
+    return theme.fontWeight.normal;
 }, function (_a) {
     var theme = _a.theme;
-    return theme.fontWeight.normal;
+    return theme.mobileLineHeight.blog1;
 });
 var sysTextPrimary = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
@@ -251,7 +255,7 @@ var usrTextBrandOnPrimary = (0, styled_components_1.css)(templateObject_28 || (t
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_usr_brandonprimary;
 });
-var customFontStyle = (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: 1.5;\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: 1.5;\n  font-weight: ", ";\n"])), function (_a) {
+var customFontStyle = (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: 1.5;\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: 1.5;\n"])), function (_a) {
     var customFontSize = _a.customFontSize;
     return customFontSize;
 }, function (_a) {
@@ -262,13 +266,13 @@ var colorOverrideStyle = (0, styled_components_1.css)(templateObject_30 || (temp
     var colorOverride = _a.colorOverride, theme = _a.theme;
     return colorOverride && theme[colorOverride];
 });
-var ellipsisStyle = (0, styled_components_1.css)(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  -webkit-box-orient: vertical;\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  -webkit-box-orient: vertical;\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])), function (_a) {
+var ellipsisStyle = (0, styled_components_1.css)(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: ", ";\n  display: -webkit-box;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: ", ";\n  display: -webkit-box;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])), function (_a) {
     var lineLimit = _a.lineLimit;
     return lineLimit;
 });
-var userSelectModeStyle = (0, styled_components_1.css)(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  -ms-user-select: none;\n  -moz-user-select: -moz-none;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"], ["\n  -ms-user-select: none;\n  -moz-user-select: -moz-none;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"])));
-var bulletPointModeStyle = (0, styled_components_1.css)(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    position: absolute;\n    left: 0;\n    width: 16px;\n  }\n"], ["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    position: absolute;\n    left: 0;\n    width: 16px;\n  }\n"])));
-var S_TextLabel = styled_components_1.default.div(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  box-sizing: border-box;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n  overflow-wrap: break-word;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  box-sizing: border-box;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n  overflow-wrap: break-word;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
+var userSelectModeStyle = (0, styled_components_1.css)(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  -khtml-user-select: none;\n  -moz-user-select: -moz-none;\n  -ms-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"], ["\n  -khtml-user-select: none;\n  -moz-user-select: -moz-none;\n  -ms-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"])));
+var bulletPointModeStyle = (0, styled_components_1.css)(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    left: 0;\n    position: absolute;\n    width: 16px;\n  }\n"], ["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    left: 0;\n    position: absolute;\n    width: 16px;\n  }\n"])));
+var S_TextLabel = styled_components_1.default.div(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  box-sizing: border-box;\n  overflow-wrap: break-word;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  box-sizing: border-box;\n  overflow-wrap: break-word;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
     var textAlign = _a.textAlign;
     return textAlign;
 }, function (_a) {
@@ -362,6 +366,6 @@ var S_AfterTextBox = styled_components_1.default.div(templateObject_35 || (templ
             return 'vertical-align: middle';
     }
 });
-var S_IconWrapper = styled_components_1.default.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n"])));
+var S_IconWrapper = styled_components_1.default.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 16px;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 16px;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n"])));
 exports.default = TextLabel;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36;

package/dist/src/sub/DynamicLayout/mock_samplePage.d.ts

@@ -1,4 +1,4 @@
-import { ISection } from './types';
+import type { ISection } from './types';
 export declare const samplePageIntroSection: ISection;
 export declare const samplePageContentsCarouselSection: ISection;
 export declare const samplePageIntroSection2: ISection;

package/dist/src/sub/DynamicLayout/sections/ContentsCarouselSection/ContentsCarouselSection.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-import { ISection } from '../../types';
+import type { ISection } from '../../types';
 declare function ContentsCarouselSection({ ...props }: ISection): JSX.Element;
 export default ContentsCarouselSection;

package/dist/src/sub/DynamicLayout/sections/ContentsCarouselSection/ContentsCarouselSection.js

@@ -29,26 +29,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../components");
 var templates_1 = require("./templates");
 function ContentsCarouselSection(_a) {
     var props = __rest(_a, []);
-    return (react_1.default.createElement(S_SectionWrapper, { "x-dlayout-section-type": "ContentsCarousel" },
-        react_1.default.createElement(components_1.Section, __assign({}, props),
-            react_1.default.createElement(TemplateMatcher, { styleTemplate: props.template }))));
+    return ((0, jsx_runtime_1.jsx)(S_SectionWrapper, __assign({ "x-dlayout-section-type": "ContentsCarousel" }, { children: (0, jsx_runtime_1.jsx)(components_1.Section, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(TemplateMatcher, { styleTemplate: props.template }, void 0) }), void 0) }), void 0));
 }
 var S_SectionWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
 function TemplateMatcher(_a) {
     var styleTemplate = _a.styleTemplate;
     switch (styleTemplate) {
         case 'BASE_CONTENTS_CAROUSEL_A':
-            return react_1.default.createElement(templates_1.TemplateA, null);
+            return (0, jsx_runtime_1.jsx)(templates_1.TemplateA, {}, void 0);
         case 'BASE_CONTENTS_CAROUSEL_B':
-            return react_1.default.createElement(templates_1.TemplateB, null);
+            return (0, jsx_runtime_1.jsx)(templates_1.TemplateB, {}, void 0);
         default:
-            return react_1.default.createElement(react_1.default.Fragment, null);
+            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
     }
 }
 exports.default = ContentsCarouselSection;

package/dist/src/sub/DynamicLayout/sections/ContentsCarouselSection/templates/TemplateA/TemplateA.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 TemplateA() {
     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_TemplateA, null),
-        DESKTOP: react_1.default.createElement(desktop_1.D_TemplateA, null)
-    }[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));
 }
 exports.default = TemplateA;