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

package/dist/src/mobile/common/components/TextFieldBase/TextFieldBase.js

@@ -16,7 +16,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -139,11 +143,11 @@ function TextFieldBase(_a) {
         }
         if (autoMinRows === 1) {
             textAreaRef.current.style.height = '0';
-            textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
             return;
         }
-        textAreaRef.current.style.height = fieldHeight - 2 + "px";
-        textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+        textAreaRef.current.style.height = "".concat(fieldHeight - 2, "px");
+        textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
     }, []);
     /**
      * 텍스트 필드 내부 value에 맞게 초기 height 값을 부여한다.
@@ -156,7 +160,7 @@ function TextFieldBase(_a) {
             return;
         }
         if (getValues(name)) {
-            textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
         }
     }, [getValues(name)]);
     var handleResizeHeight = (0, react_1.useCallback)(function () {
@@ -165,11 +169,11 @@ function TextFieldBase(_a) {
         }
         if (autoMinRows === 1) {
             textAreaRef.current.style.height = '0';
-            textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
             return;
         }
-        textAreaRef.current.style.height = fieldHeight - 2 + "px";
-        textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+        textAreaRef.current.style.height = "".concat(fieldHeight - 2, "px");
+        textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
     }, []);
     function deleteValue() {
         setValue(name, '', { shouldDirty: true });
@@ -193,23 +197,23 @@ function TextFieldBase(_a) {
     }
     var S_TextFieldBase = function () {
         if (textLineType === 'single') {
-            return ((0, jsx_runtime_1.jsxs)(S_InputWrapper, { children: [stepperMode === 'use' && ((0, jsx_runtime_1.jsxs)(S_IconBox, __assign({ innerSpinButtonSize: innerSpinButtonSize, isFocused: isFocused, stepperRightSpacing: stepperRightSpacing }, { children: [(0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_up_stepper", fillType: "fill", size: innerSpinButtonSize }, void 0), (0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_down_stepper", fillType: "fill", size: innerSpinButtonSize }, void 0)] }), void 0)), (0, jsx_runtime_1.jsx)(S_Input, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, type: inputType, state: state, readOnly: state === 'read_only', disabled: state === 'disabled', maxLength: maxLength, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, colorTheme: colorTheme, min: min, max: max, autoComplete: autoComplete, stepperMode: stepperMode, innerSpinButtonSize: innerSpinButtonSize, step: step, deleteIconMode: deleteIconMode, suffixText: suffixText, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing, isFocused: isFocused, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref }), void 0), (deleteIconMode === 'use' || suffixText) && ((0, jsx_runtime_1.jsxs)(S_RightBox, __assign({ deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, innerSpinButtonSize: innerSpinButtonSize }, { children: [deleteIconMode === 'use' && ((0, jsx_runtime_1.jsx)(S_IconButtonWrapper, __assign({ innerSpinButtonSize: innerSpinButtonSize, deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, isFocused: isFocused, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing }, { children: isFocused && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: deleteValue }, void 0)) }), void 0)), suffixText && ((0, jsx_runtime_1.jsxs)(S_SuffixTextBox, __assign({ ref: suffixTextRef }, { children: [(0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: suffixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", colorOverride: stepperMode === 'use' && isFocused ? 'ui_106' : undefined, textAlign: "right", singleLineMode: "use" }, void 0), suffixTextRightSpacingMode === 'use' && ((0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }, void 0))] }), void 0))] }), void 0))] }, void 0));
+            return ((0, jsx_runtime_1.jsxs)(S_InputWrapper, { children: [stepperMode === 'use' && ((0, jsx_runtime_1.jsxs)(S_IconBox, __assign({ innerSpinButtonSize: innerSpinButtonSize, isFocused: isFocused, stepperRightSpacing: stepperRightSpacing }, { children: [(0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_up_stepper", fillType: "fill", size: innerSpinButtonSize }), (0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_down_stepper", fillType: "fill", size: innerSpinButtonSize })] }))), (0, jsx_runtime_1.jsx)(S_Input, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, type: inputType, state: state, readOnly: state === 'read_only', disabled: state === 'disabled', maxLength: maxLength, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, colorTheme: colorTheme, min: min, max: max, autoComplete: autoComplete, stepperMode: stepperMode, innerSpinButtonSize: innerSpinButtonSize, step: step, deleteIconMode: deleteIconMode, suffixText: suffixText, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing, isFocused: isFocused, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref })), (deleteIconMode === 'use' || suffixText) && ((0, jsx_runtime_1.jsxs)(S_RightBox, __assign({ deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, innerSpinButtonSize: innerSpinButtonSize }, { children: [deleteIconMode === 'use' && ((0, jsx_runtime_1.jsx)(S_IconButtonWrapper, __assign({ innerSpinButtonSize: innerSpinButtonSize, deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, isFocused: isFocused, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing }, { children: isFocused && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: deleteValue })) }))), suffixText && ((0, jsx_runtime_1.jsxs)(S_SuffixTextBox, __assign({ ref: suffixTextRef }, { children: [(0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: suffixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", colorOverride: stepperMode === 'use' && isFocused ? 'ui_106' : undefined, textAlign: "right", singleLineMode: "use" }), suffixTextRightSpacingMode === 'use' && ((0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }))] })))] })))] }));
         }
         if (textLineType === 'multi') {
-            return ((0, jsx_runtime_1.jsx)(S_Multi, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, rows: multiRows, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, textPadding: textPadding, colorTheme: colorTheme, autoComplete: autoComplete, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_Multi, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, rows: multiRows, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, textPadding: textPadding, colorTheme: colorTheme, autoComplete: autoComplete, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref })));
         }
         if (textLineType === 'auto') {
             return ((0, jsx_runtime_1.jsx)(S_Auto, __assign({}, refRest, rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, autoMinRows: autoMinRows, autoMaxRows: autoMaxRows, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, textPadding: textPadding, fieldHeight: fieldHeight, colorTheme: colorTheme, autoComplete: autoComplete, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: function (e) {
                     ref(e);
                     textAreaRef.current = e;
-                }, onInput: handleResizeHeight }), void 0));
+                }, onInput: handleResizeHeight })));
         }
     };
-    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: S_TextFieldBase() }, void 0);
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: S_TextFieldBase() });
 }
 var stepper_and_delete_style = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: absolute;\n  right: ", ";\n"], ["\n  position: absolute;\n  right: ", ";\n"])), function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize, stepperRightSpacing = _a.stepperRightSpacing;
-    return innerSpinButtonSize && stepperRightSpacing && innerSpinButtonSize + stepperRightSpacing + "px";
+    return innerSpinButtonSize && stepperRightSpacing && "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
 });
 var S_IconButtonWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n\n  ", "\n"], ["\n  ", ";\n\n  ", "\n"])), function (_a) {
     var deleteIconMode = _a.deleteIconMode, stepperMode = _a.stepperMode, suffixText = _a.suffixText;
@@ -220,7 +224,7 @@ var S_IconButtonWrapper = styled_components_1.default.div(templateObject_2 || (t
         if (isFocused) {
             if (innerSpinButtonSize) {
                 if (innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE > suffixTextWidth) {
-                    return "margin-right: " + (innerSpinButtonSize - suffixTextWidth + stepperRightSpacing) + "px;";
+                    return "margin-right: ".concat(innerSpinButtonSize - suffixTextWidth + stepperRightSpacing, "px;");
                 }
                 return;
             }
@@ -241,13 +245,13 @@ var S_RightBox = styled_components_1.default.div(templateObject_3 || (templateOb
 });
 var S_IconBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-direction: column;\n  height: ", ";\n  justify-content: center;\n  position: absolute;\n  right: ", ";\n  width: ", ";\n  visibility: hidden;\n\n  ", ";\n"], ["\n  align-items: center;\n  display: flex;\n  flex-direction: column;\n  height: ", ";\n  justify-content: center;\n  position: absolute;\n  right: ", ";\n  width: ", ";\n  visibility: hidden;\n\n  ", ";\n"])), function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize * 2 + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize * 2, "px");
 }, function (_a) {
     var stepperRightSpacing = _a.stepperRightSpacing;
-    return stepperRightSpacing && stepperRightSpacing + "px";
+    return stepperRightSpacing && "".concat(stepperRightSpacing, "px");
 }, function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
 }, function (_a) {
     var isFocused = _a.isFocused;
     return isFocused && 'visibility: visible;';
@@ -319,10 +323,10 @@ var basicStyle = (0, styled_components_1.css)(templateObject_9 || (templateObjec
         }[state];
 }, function (_a) {
     var fieldPaddingRight = _a.fieldPaddingRight;
-    return fieldPaddingRight && "padding-right: " + fieldPaddingRight + "px;";
+    return fieldPaddingRight && "padding-right: ".concat(fieldPaddingRight, "px;");
 }, function (_a) {
     var fieldPaddingLeft = _a.fieldPaddingLeft;
-    return fieldPaddingLeft && "padding-left: " + fieldPaddingLeft + "px;";
+    return fieldPaddingLeft && "padding-left: ".concat(fieldPaddingLeft, "px;");
 }, function (_a) {
     var deleteIconMode = _a.deleteIconMode, stepperMode = _a.stepperMode, suffixText = _a.suffixText;
     if (deleteIconMode === 'use' && stepperMode === 'use' && suffixText) {
@@ -346,19 +350,19 @@ var delete_stepper_suffix = (0, styled_components_1.css)(templateObject_10 || (t
             if (innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing <
                 constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth) {
                 if (fieldPaddingRight) {
-                    return constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + fieldPaddingRight + "px";
+                    return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + fieldPaddingRight, "px");
                 }
-                return constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + "px";
+                return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth, "px");
             }
             if (fieldPaddingRight) {
-                return constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + fieldPaddingRight + stepperRightSpacing + "px";
+                return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + fieldPaddingRight + stepperRightSpacing, "px");
             }
-            return constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + stepperRightSpacing + "px";
+            return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return suffixTextWidth + fieldPaddingRight + "px";
+            return "".concat(suffixTextWidth + fieldPaddingRight, "px");
         }
-        return suffixTextWidth + "px";
+        return "".concat(suffixTextWidth, "px");
     }
     return;
 });
@@ -367,12 +371,12 @@ var delete_stepper = (0, styled_components_1.css)(templateObject_11 || (template
     if (innerSpinButtonSize && stepperRightSpacing) {
         if (isFocused) {
             if (fieldPaddingRight) {
-                return innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + fieldPaddingRight + stepperRightSpacing + "px";
+                return "".concat(innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + fieldPaddingRight + stepperRightSpacing, "px");
             }
-            return innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing + "px";
+            return "".concat(innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return fieldPaddingRight + "px";
+            return "".concat(fieldPaddingRight, "px");
         }
         return;
     }
@@ -384,19 +388,19 @@ var stepper_suffix = (0, styled_components_1.css)(templateObject_12 || (template
         if (isFocused) {
             if (innerSpinButtonSize + stepperRightSpacing < suffixTextWidth) {
                 if (fieldPaddingRight) {
-                    return suffixTextWidth + fieldPaddingRight + "px";
+                    return "".concat(suffixTextWidth + fieldPaddingRight, "px");
                 }
-                return suffixTextWidth + "px";
+                return "".concat(suffixTextWidth, "px");
             }
             if (fieldPaddingRight) {
-                return innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight + "px";
+                return "".concat(innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight, "px");
             }
-            return innerSpinButtonSize + stepperRightSpacing + "px";
+            return "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return suffixTextWidth + fieldPaddingRight + "px";
+            return "".concat(suffixTextWidth + fieldPaddingRight, "px");
         }
-        return suffixTextWidth + "px";
+        return "".concat(suffixTextWidth, "px");
     }
     return;
 });
@@ -405,12 +409,12 @@ var stepper = (0, styled_components_1.css)(templateObject_13 || (templateObject_
     if (innerSpinButtonSize && stepperRightSpacing) {
         if (isFocused) {
             if (fieldPaddingRight) {
-                return innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight + "px";
+                return "".concat(innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight, "px");
             }
-            return innerSpinButtonSize + stepperRightSpacing + "px";
+            return "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return fieldPaddingRight + "px";
+            return "".concat(fieldPaddingRight, "px");
         }
         return;
     }
@@ -418,19 +422,19 @@ var stepper = (0, styled_components_1.css)(templateObject_13 || (templateObject_
 });
 var inputInnerSpinButtonStyle = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  -webkit-appearance: none;\n  z-index: 1;\n  cursor: pointer;\n  height: ", ";\n  margin-left: ", ";\n  opacity: 1;\n  width: ", ";\n  position: absolute;\n  right: ", ";\n  top: calc(\n    50% - ", "\n  );\n"], ["\n  -webkit-appearance: none;\n  z-index: 1;\n  cursor: pointer;\n  height: ", ";\n  margin-left: ", ";\n  opacity: 1;\n  width: ", ";\n  position: absolute;\n  right: ", ";\n  top: calc(\n    50% - ", "\n  );\n"])), function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize * 2 + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize * 2, "px");
 }, function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingB;
 }, function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
 }, function (_a) {
     var stepperRightSpacing = _a.stepperRightSpacing;
-    return stepperRightSpacing && stepperRightSpacing + "px";
+    return stepperRightSpacing && "".concat(stepperRightSpacing, "px");
 }, function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
 });
 var S_Input = styled_components_1.default.input(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  ", "\n  line-height: ", ";\n  position: relative;\n\n  ::-webkit-inner-spin-button {\n    ", "\n  }\n  ::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n"], ["\n  ", "\n  line-height: ", ";\n  position: relative;\n\n  ::-webkit-inner-spin-button {\n    ", "\n  }\n  ::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n"])), basicStyle, function (_a) {
     var theme = _a.theme;
@@ -445,16 +449,16 @@ var S_Auto = styled_components_1.default.textarea(templateObject_16 || (template
     var autoMaxRows = _a.autoMaxRows, textSize = _a.textSize, fieldHeight = _a.fieldHeight;
     return autoMaxRows &&
         fieldHeight &&
-        "max-height: " + Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
+        "max-height: ".concat(Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
             Number(common_1.desktopLineHeight[textSize]) *
-            autoMaxRows + "px;";
+            autoMaxRows, "px;");
 }, function (_a) {
     var autoMinRows = _a.autoMinRows, textSize = _a.textSize, fieldHeight = _a.fieldHeight;
     return autoMinRows &&
         fieldHeight &&
-        "min-height: " + Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
+        "min-height: ".concat(Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
             Number(common_1.desktopLineHeight[textSize]) *
-            autoMinRows + "px;";
+            autoMinRows, "px;");
 });
 var S_Multi = styled_components_1.default.textarea(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  ", "\n  display: block;\n  overflow-y: auto;\n  resize: none;\n"], ["\n  ", "\n  display: block;\n  overflow-y: auto;\n  resize: none;\n"])), basicStyle);
 exports.default = TextFieldBase;

package/dist/src/mobile/components/BasicButtonGroup/BasicButtonGroup.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { BasicButtonGroupValueOption } from '../../../common/types';
-export declare type BasicButtonGroupProps = {
+export type BasicButtonGroupProps = {
     size?: 'large' | 'medium' | 'small';
     valueArray: BasicButtonGroupValueOption[];
     state?: 'normal' | 'disabled';

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

@@ -16,7 +16,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -50,8 +54,8 @@ function BasicButtonGroup(_a) {
     };
     return ((0, jsx_runtime_1.jsx)(S_BasicButtonGroup, __assign({ "x-pds-name": "BasicButtonGroup", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, { children: valueArray.map(function (_a, index) {
             var iconName = _a.iconName, _b = _a.iconFillType, iconFillType = _b === void 0 ? 'line' : _b, _c = _a.state, buttonState = _c === void 0 ? 'normal' : _c, _d = _a.iconColorTheme, iconColorTheme = _d === void 0 ? 'none' : _d, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
-            return ((0, jsx_runtime_1.jsx)(S_BasicButton, __assign({ size: size, onClick: function (e) { return onClick && onClick(e); }, onMouseDown: function (e) { return onMouseDown && onMouseDown(e); }, disabled: state === 'disabled' || buttonState === 'disabled' }, { children: (0, jsx_runtime_1.jsx)(components_1.Icon, { iconName: iconName, size: size === 'small' ? 20 : 24, fillType: iconFillType, colorKey: getColorKey(buttonState, iconColorTheme) }, void 0) }), iconName + index));
-        }) }), void 0));
+            return ((0, jsx_runtime_1.jsx)(S_BasicButton, __assign({ size: size, onClick: function (e) { return onClick && onClick(e); }, onMouseDown: function (e) { return onMouseDown && onMouseDown(e); }, disabled: state === 'disabled' || buttonState === 'disabled' }, { children: (0, jsx_runtime_1.jsx)(components_1.Icon, { iconName: iconName, size: size === 'small' ? 20 : 24, fillType: iconFillType, colorKey: getColorKey(buttonState, iconColorTheme) }) }), iconName + index));
+        }) })));
 }
 var S_BasicButtonGroup = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: max-content;\n\n  & > button:not(:last-child) {\n    margin-right: ", ";\n  }\n"], ["\n  width: max-content;\n\n  & > button:not(:last-child) {\n    margin-right: ", ";\n  }\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/components/BasicChatListItem/BasicChatListItem.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { PDSTextType, PDSValueOption } from '../../../common';
-declare type Props = {
+type Props = {
     titleText?: PDSTextType;
     contentText?: PDSTextType;
     leftImageMode?: 'none' | 'use';

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

@@ -67,7 +67,7 @@ function BasicChatListItem(_a) {
         }
         setIsContextMenuOpen(false);
     };
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(S_BasicChatListItem, __assign({ "x-pds-name": "BasicChatListItem", "x-pds-element-type": "component", "x-pds-device-type": "mobile", colorTheme: colorTheme }, { children: [leftImageMode === 'use' && ((0, jsx_runtime_1.jsx)(S_ImageViewWrapper, { children: (0, jsx_runtime_1.jsx)(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: "responsive" }, void 0) }, void 0)), (0, jsx_runtime_1.jsx)(S_TitleTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: "caption1Bold", wordBreak: "break_all", colorTheme: titleTextColors[colorTheme] }, void 0) }, void 0), (0, jsx_runtime_1.jsx)(S_ContentTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: contentText, styleTheme: "caption1Regular", colorTheme: colorTheme === 'subscriber_transparent' ? 'sysTextWhite' : 'sysTextPrimary', wordBreak: "break_all" }, void 0) }, void 0), hoverMode === 'use' && ((0, jsx_runtime_1.jsx)(S_SeeMoreButton, __assign({ isContextMenuOpen: isContextMenuOpen, hoverMode: hoverMode, ref: contextMenuRef }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: "xsmall", iconFillType: "fill", iconSize: 20, iconName: "ic_more", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: "ui_cpnt_button_icon_enabled", onClick: handleMoreButtonClick }, void 0) }), void 0)), (0, jsx_runtime_1.jsx)(Popup_1.PopupProvider, { children: (0, jsx_runtime_1.jsx)(Popup_1.Popup, __assign({ targetRef: contextMenuRef, isOpen: isContextMenuOpen, placement: "v-auto", wrapperHeight: chatBodyRect === null || chatBodyRect === void 0 ? void 0 : chatBodyRect.height, onClickOutside: function () { return setIsContextMenuOpen(false); } }, { children: (0, jsx_runtime_1.jsx)(ContextMenu_1.ContextMenu, { children: contextMenuOptionArray === null || contextMenuOptionArray === void 0 ? void 0 : contextMenuOptionArray.map(function (el) { return ((0, jsx_runtime_1.jsx)(ContextMenuItem_1.ContextMenuItem, { option: el, onClick: handleContextMenuItemClick, state: contextMenuState }, el.value)); }) }, void 0) }), void 0) }, void 0)] }), void 0) }, void 0));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(S_BasicChatListItem, __assign({ "x-pds-name": "BasicChatListItem", "x-pds-element-type": "component", "x-pds-device-type": "mobile", colorTheme: colorTheme }, { children: [leftImageMode === 'use' && ((0, jsx_runtime_1.jsx)(S_ImageViewWrapper, { children: (0, jsx_runtime_1.jsx)(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: "responsive" }) })), (0, jsx_runtime_1.jsx)(S_TitleTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: "caption1Bold", wordBreak: "break_all", colorTheme: titleTextColors[colorTheme] }) }), (0, jsx_runtime_1.jsx)(S_ContentTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: contentText, styleTheme: "caption1Regular", colorTheme: colorTheme === 'subscriber_transparent' ? 'sysTextWhite' : 'sysTextPrimary', wordBreak: "break_all" }) }), hoverMode === 'use' && ((0, jsx_runtime_1.jsx)(S_SeeMoreButton, __assign({ isContextMenuOpen: isContextMenuOpen, hoverMode: hoverMode, ref: contextMenuRef }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: "xsmall", iconFillType: "fill", iconSize: 20, iconName: "ic_more", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: "ui_cpnt_button_icon_enabled", onClick: handleMoreButtonClick }) }))), (0, jsx_runtime_1.jsx)(Popup_1.PopupProvider, { children: (0, jsx_runtime_1.jsx)(Popup_1.Popup, __assign({ targetRef: contextMenuRef, isOpen: isContextMenuOpen, placement: "v-auto", wrapperHeight: chatBodyRect === null || chatBodyRect === void 0 ? void 0 : chatBodyRect.height, onClickOutside: function () { return setIsContextMenuOpen(false); } }, { children: (0, jsx_runtime_1.jsx)(ContextMenu_1.ContextMenu, { children: contextMenuOptionArray === null || contextMenuOptionArray === void 0 ? void 0 : contextMenuOptionArray.map(function (el) { return ((0, jsx_runtime_1.jsx)(ContextMenuItem_1.ContextMenuItem, { option: el, onClick: handleContextMenuItemClick, state: contextMenuState }, el.value)); }) }) })) })] })) }));
 }
 var S_BasicChatListItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  display: flex;\n  height: fit-content;\n  max-width: 100%;\n  min-height: 24px;\n  padding-bottom: ", ";\n  padding-left: ", ";\n  padding-right: ", ";\n  padding-top: ", ";\n"], ["\n  background-color: ", ";\n  display: flex;\n  height: fit-content;\n  max-width: 100%;\n  min-height: 24px;\n  padding-bottom: ", ";\n  padding-left: ", ";\n  padding-right: ", ";\n  padding-top: ", ";\n"])), function (_a) {
     var colorTheme = _a.colorTheme, theme = _a.theme;

package/dist/src/mobile/components/BasicChatListItem/Popup.d.ts

@@ -1,5 +1,5 @@
 import { MutableRefObject } from 'react';
-declare type Props = {
+type Props = {
     targetRef: MutableRefObject<HTMLElement | null>;
     isOpen: boolean;
     onClickOutside?: () => void;

package/dist/src/mobile/components/BasicChatListItem/Popup.js

@@ -30,13 +30,13 @@ function getHAutoPlacement(_a) {
     var targetRect = _a.targetRect, popupRect = _a.popupRect;
     var leftSpaced = targetRect.right + popupRect.width > window.innerWidth;
     var topSpaced = targetRect.bottom + popupRect.height > window.innerHeight;
-    return (leftSpaced ? 'left' : 'right') + "-" + (topSpaced ? 'end' : 'start');
+    return "".concat(leftSpaced ? 'left' : 'right', "-").concat(topSpaced ? 'end' : 'start');
 }
 function getVAutoPlacement(_a) {
     var targetRect = _a.targetRect, popupRect = _a.popupRect, wrapperHeight = _a.wrapperHeight;
     var leftSpaced = targetRect.right + popupRect.width > window.innerWidth;
     var topSpaced = targetRect.bottom + popupRect.height > (wrapperHeight || window.innerWidth);
-    return (topSpaced ? 'top' : 'bottom') + "-" + (leftSpaced ? 'end' : 'start');
+    return "".concat(topSpaced ? 'top' : 'bottom', "-").concat(leftSpaced ? 'end' : 'start');
 }
 function getVCenterPlacement(_a) {
     var targetRect = _a.targetRect, popupRect = _a.popupRect;
@@ -73,93 +73,93 @@ function updatePosition(_a) {
     var normPlacement = getNormalizedPlacement({ placement: placement, targetRect: targetRect, popupRect: popupRect, wrapperHeight: wrapperHeight });
     switch (normPlacement) {
         case 'top':
-            popupElem.style.top = targetRect.top - popupRect.height + "px";
-            popupElem.style.left = targetRect.left - (popupRect.width - targetRect.width) / 2 + "px";
+            popupElem.style.top = "".concat(targetRect.top - popupRect.height, "px");
+            popupElem.style.left = "".concat(targetRect.left - (popupRect.width - targetRect.width) / 2, "px");
             popupElem.style.width = 'auto';
             break;
         case 'top-start':
-            popupElem.style.top = targetRect.top - popupRect.height + "px";
-            popupElem.style.left = targetRect.left + "px";
+            popupElem.style.top = "".concat(targetRect.top - popupRect.height, "px");
+            popupElem.style.left = "".concat(targetRect.left, "px");
             popupElem.style.width = 'auto';
             break;
         case 'top-end':
-            popupElem.style.top = targetRect.top - popupRect.height + "px";
-            popupElem.style.left = targetRect.left + targetRect.width - popupRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - popupRect.height, "px");
+            popupElem.style.left = "".concat(targetRect.left + targetRect.width - popupRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'top-both':
-            popupElem.style.top = targetRect.top - popupRect.height + "px";
-            popupElem.style.left = targetRect.left + "px";
-            popupElem.style.width = targetRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - popupRect.height, "px");
+            popupElem.style.left = "".concat(targetRect.left, "px");
+            popupElem.style.width = "".concat(targetRect.width, "px");
             break;
         case 'top-center':
-            popupElem.style.top = targetRect.top - popupRect.height + "px";
-            popupElem.style.left = targetRect.left - (popupRect.width - targetRect.width) / 2 + "px";
+            popupElem.style.top = "".concat(targetRect.top - popupRect.height, "px");
+            popupElem.style.left = "".concat(targetRect.left - (popupRect.width - targetRect.width) / 2, "px");
             popupElem.style.width = 'auto';
             break;
         case 'bottom':
-            popupElem.style.top = targetRect.bottom + "px";
-            popupElem.style.left = targetRect.left - (popupRect.width - targetRect.width) / 2 + "px";
+            popupElem.style.top = "".concat(targetRect.bottom, "px");
+            popupElem.style.left = "".concat(targetRect.left - (popupRect.width - targetRect.width) / 2, "px");
             popupElem.style.width = 'auto';
             break;
         case 'bottom-start':
-            popupElem.style.top = targetRect.bottom + "px";
-            popupElem.style.left = targetRect.left + "px";
+            popupElem.style.top = "".concat(targetRect.bottom, "px");
+            popupElem.style.left = "".concat(targetRect.left, "px");
             popupElem.style.width = 'auto';
             break;
         case 'bottom-end':
-            popupElem.style.top = targetRect.bottom + "px";
-            popupElem.style.left = targetRect.right - popupRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.bottom, "px");
+            popupElem.style.left = "".concat(targetRect.right - popupRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'bottom-both':
-            popupElem.style.top = targetRect.bottom + "px";
-            popupElem.style.left = targetRect.left + "px";
-            popupElem.style.width = targetRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.bottom, "px");
+            popupElem.style.left = "".concat(targetRect.left, "px");
+            popupElem.style.width = "".concat(targetRect.width, "px");
             break;
         case 'bottom-center':
-            popupElem.style.top = targetRect.bottom + "px";
-            popupElem.style.left = targetRect.left - (popupRect.width - targetRect.width) / 2 + "px";
+            popupElem.style.top = "".concat(targetRect.bottom, "px");
+            popupElem.style.left = "".concat(targetRect.left - (popupRect.width - targetRect.width) / 2, "px");
             popupElem.style.width = 'auto';
             break;
         case 'left':
-            popupElem.style.top = targetRect.top - (popupRect.height - targetRect.height) / 2 + "px";
-            popupElem.style.left = targetRect.left - popupRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - (popupRect.height - targetRect.height) / 2, "px");
+            popupElem.style.left = "".concat(targetRect.left - popupRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'left-start':
-            popupElem.style.top = targetRect.top + "px";
-            popupElem.style.left = targetRect.left - popupRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top, "px");
+            popupElem.style.left = "".concat(targetRect.left - popupRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'left-end':
-            popupElem.style.top = targetRect.top - (popupRect.height - targetRect.height) + "px";
-            popupElem.style.left = targetRect.left - popupRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - (popupRect.height - targetRect.height), "px");
+            popupElem.style.left = "".concat(targetRect.left - popupRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'left-center':
-            popupElem.style.top = targetRect.top - (popupRect.height - targetRect.height) / 2 + "px";
-            popupElem.style.left = targetRect.left - popupRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - (popupRect.height - targetRect.height) / 2, "px");
+            popupElem.style.left = "".concat(targetRect.left - popupRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'right':
-            popupElem.style.top = targetRect.top - (popupRect.height - targetRect.height) / 2 + "px";
-            popupElem.style.left = targetRect.left + targetRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - (popupRect.height - targetRect.height) / 2, "px");
+            popupElem.style.left = "".concat(targetRect.left + targetRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'right-start':
-            popupElem.style.top = targetRect.top + "px";
-            popupElem.style.left = targetRect.left + targetRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top, "px");
+            popupElem.style.left = "".concat(targetRect.left + targetRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'right-end':
-            popupElem.style.top = targetRect.top - (popupRect.height - targetRect.height) + "px";
-            popupElem.style.left = targetRect.left + targetRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - (popupRect.height - targetRect.height), "px");
+            popupElem.style.left = "".concat(targetRect.left + targetRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         case 'right-center':
-            popupElem.style.top = targetRect.top - (popupRect.height - targetRect.height) / 2 + "px";
-            popupElem.style.left = targetRect.left + targetRect.width + "px";
+            popupElem.style.top = "".concat(targetRect.top - (popupRect.height - targetRect.height) / 2, "px");
+            popupElem.style.left = "".concat(targetRect.left + targetRect.width, "px");
             popupElem.style.width = 'auto';
             break;
         default:
@@ -209,9 +209,9 @@ function Popup(_a) {
         }
     }
     if (!popupRootRef || !popupRootRef.current || !isOpen) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
-    var popupComponent = ((0, jsx_runtime_1.jsx)(S_Popup, __assign({ ref: popupRef, onClick: function (e) { return handlePopupClick(e); } }, { children: typeof children === 'function' ? children(normPlacement) : children }), void 0));
+    var popupComponent = ((0, jsx_runtime_1.jsx)(S_Popup, __assign({ ref: popupRef, onClick: function (e) { return handlePopupClick(e); } }, { children: typeof children === 'function' ? children(normPlacement) : children })));
     return (0, react_dom_1.createPortal)(popupComponent, popupRootRef.current);
 }
 exports.Popup = Popup;
@@ -223,7 +223,7 @@ var S_Popup = styled_components_1.default.div(templateObject_1 || (templateObjec
 function PopupProvider(_a) {
     var children = _a.children;
     var ref = (0, react_1.useRef)();
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(PopupContext.Provider, __assign({ value: ref }, { children: children }), void 0), (0, jsx_runtime_1.jsx)("div", { ref: ref }, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(PopupContext.Provider, __assign({ value: ref }, { children: children })), (0, jsx_runtime_1.jsx)("div", { ref: ref })] }));
 }
 exports.PopupProvider = PopupProvider;
 var templateObject_1;

package/dist/src/mobile/components/BasicFormGroup/BasicFormGroup.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { PDSTextType } from '../../../common';
-declare type BasicFormGroupProps = {
+type BasicFormGroupProps = {
     titleStyleTheme?: 'headingBold' | 'leadParaBold' | 'subTitleBold';
     titleText?: PDSTextType;
     descText?: PDSTextType;

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

@@ -16,6 +16,6 @@ var hybrid_1 = require("../../../hybrid");
 var TextLabel_1 = require("../TextLabel");
 function BasicFormGroup(_a) {
     var _b = _a.titleStyleTheme, titleStyleTheme = _b === void 0 ? 'subTitleBold' : _b, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, inputForm = _a.inputForm;
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ "x-pds-name": "BasicFormGroup", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, { children: [titleText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: "sysTextPrimary" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" }, void 0)] }, void 0)), descText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: descText, styleTheme: "caption1Regular", colorTheme: "sysTextSecondary" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0)] }, void 0)), inputForm, captionText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" }, void 0), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextPrimary" }, void 0)] }, void 0))] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ "x-pds-name": "BasicFormGroup", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, { children: [titleText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: "sysTextPrimary" }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" })] })), descText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: descText, styleTheme: "caption1Regular", colorTheme: "sysTextSecondary" }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" })] })), inputForm, captionText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextPrimary" })] }))] })));
 }
 exports.default = BasicFormGroup;

package/dist/src/mobile/components/BasicList/BasicList.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { PDSTextType } from '../../../common';
-declare type BasicListProps = {
+type BasicListProps = {
     children: React.ReactNode;
     titleStyleTheme?: 'headingBold' | 'leadParaBold' | 'subTitleBold';
     titleText?: PDSTextType;

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

@@ -24,24 +24,24 @@ var hybrid_1 = require("../../../hybrid");
 var TextLabel_1 = require("../TextLabel");
 function BasicList(_a) {
     var children = _a.children, _b = _a.titleStyleTheme, titleStyleTheme = _b === void 0 ? 'headingBold' : _b, titleText = _a.titleText, captionText = _a.captionText, _c = _a.columns, columns = _c === void 0 ? 1 : _c, _d = _a.columnSpacing, columnSpacing = _d === void 0 ? 16 : _d, _e = _a.rowSpacing, rowSpacing = _e === void 0 ? 0 : _e, _f = _a.spacingMode, spacingMode = _f === void 0 ? 'use' : _f;
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ "x-pds-name": "BasicList", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, { children: [(titleText || captionText) && ((0, jsx_runtime_1.jsxs)(S_TitleBox, __assign({ spacingMode: spacingMode }, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme }, void 0), titleText && captionText && (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a", spacingType: "height" }, void 0), captionText && (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: captionText, styleTheme: "body2Regular" }, void 0)] }), void 0)), (0, jsx_runtime_1.jsx)(S_BasicListWrapper, __assign({ columns: columns, columnSpacing: columnSpacing, rowSpacing: rowSpacing }, { children: children }), void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ "x-pds-name": "BasicList", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, { children: [(titleText || captionText) && ((0, jsx_runtime_1.jsxs)(S_TitleBox, __assign({ spacingMode: spacingMode }, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme }), titleText && captionText && (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a", spacingType: "height" }), captionText && (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: captionText, styleTheme: "body2Regular" })] }))), (0, jsx_runtime_1.jsx)(S_BasicListWrapper, __assign({ columns: columns, columnSpacing: columnSpacing, rowSpacing: rowSpacing }, { children: children }))] })));
 }
 var S_TitleBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-bottom: ", ";\n  padding: ", ";\n"], ["\n  margin-bottom: ", ";\n  padding: ", ";\n"])), function (_a) {
     var theme = _a.theme;
-    return "" + theme.spacing.spacingD;
+    return "".concat(theme.spacing.spacingD);
 }, function (_a) {
     var spacingMode = _a.spacingMode, theme = _a.theme;
-    return spacingMode === 'use' && "0 " + theme.spacing.spacingE;
+    return spacingMode === 'use' && "0 ".concat(theme.spacing.spacingE);
 });
 var S_BasicListWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  column-gap: ", ";\n  display: grid;\n  grid-template-columns: ", ";\n  row-gap: ", ";\n"], ["\n  column-gap: ", ";\n  display: grid;\n  grid-template-columns: ", ";\n  row-gap: ", ";\n"])), function (_a) {
     var columnSpacing = _a.columnSpacing;
-    return columnSpacing && columnSpacing + "px";
+    return columnSpacing && "".concat(columnSpacing, "px");
 }, function (_a) {
     var columns = _a.columns;
-    return columns && "repeat(" + columns + ", 1fr)";
+    return columns && "repeat(".concat(columns, ", 1fr)");
 }, function (_a) {
     var rowSpacing = _a.rowSpacing;
-    return rowSpacing && rowSpacing + "px";
+    return rowSpacing && "".concat(rowSpacing, "px");
 });
 exports.default = BasicList;
 var templateObject_1, templateObject_2;

package/dist/src/mobile/components/BasicListItem/BasicListItem.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { FillIconNameKeys, LineIconNameKeys, PDSTextType } from '../../../common';
-export declare type BasicListItemProps = {
+export type BasicListItemProps = {
     selectionMode?: 'none' | 'check' | 'radio';
     titleText: PDSTextType;
     titleTextColorTheme?: 'none' | 'logout';
@@ -36,7 +36,7 @@ export declare type BasicListItemProps = {
     onClickRadio?: (value: string) => void;
     onClickSwitch?: () => void;
 };
-export declare type StyleProps = {
+export type StyleProps = {
     isSelected?: boolean;
     dividerType?: BasicListItemProps['dividerType'];
     selectionMode?: 'none' | 'check' | 'radio';