pds-dev-kit-web-test 2.7.94 → 2.7.95

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

@@ -1,497 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    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;
-    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];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable better-styled-components/sort-declarations-alphabetically */
-/* eslint-disable react/jsx-no-bind */
-var react_1 = require("react");
-var react_hook_form_1 = require("react-hook-form");
-var components_1 = require("../../../../desktop/components");
-var components_2 = require("../../../../hybrid/components");
-var styled_components_1 = __importStar(require("styled-components"));
-var common_1 = require("../../../../common");
-var IconButton_1 = require("../../../components/IconButton");
-var constants_1 = require("./constants");
-function TextFieldBase(_a) {
-    var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, _b = _a.textAlign, textAlign = _b === void 0 ? 'left' : _b, validation = _a.validation, _c = _a.preventBlankMode, preventBlankMode = _c === void 0 ? 'none' : _c, _d = _a.enterSubmitMode, enterSubmitMode = _d === void 0 ? 'none' : _d, _e = _a.textLineType, textLineType = _e === void 0 ? 'single' : _e, multiRows = _a.multiRows, autoMinRows = _a.autoMinRows, autoMaxRows = _a.autoMaxRows, _f = _a.inputType, inputType = _f === void 0 ? 'text' : _f, inputMode = _a.inputMode, _g = _a.state, state = _g === void 0 ? 'normal' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, min = _a.min, max = _a.max, _j = _a.maxLength, maxLength = _j === void 0 ? Infinity : _j, _k = _a.textSize, textSize = _k === void 0 ? 'form2' : _k, _l = _a.textWeight, textWeight = _l === void 0 ? 'normal' : _l, fieldPaddingRight = _a.fieldPaddingRight, fieldPaddingLeft = _a.fieldPaddingLeft, textPadding = _a.textPadding, _m = _a.fieldHeight, fieldHeight = _m === void 0 ? 48 : _m, _o = _a.deleteIconMode, deleteIconMode = _o === void 0 ? 'use' : _o, _p = _a.deleteIconSize, deleteIconSize = _p === void 0 ? 20 : _p, _q = _a.deleteIconColor, deleteIconColor = _q === void 0 ? 'ui_cpnt_button_icon_disabled' : _q, suffixText = _a.suffixText, _r = _a.suffixTextRightSpacingMode, suffixTextRightSpacingMode = _r === void 0 ? 'none' : _r, isFocused = _a.isFocused, _s = _a.autoComplete, autoComplete = _s === void 0 ? 'on' : _s, _t = _a.stepperMode, stepperMode = _t === void 0 ? 'none' : _t, _u = _a.stepperRightSpacing, stepperRightSpacing = _u === void 0 ? 1 : _u, _v = _a.innerSpinButtonSize, innerSpinButtonSize = _v === void 0 ? 16 : _v, step = _a.step, onBlur = _a.onBlur, onChange = _a.onChange, onFocus = _a.onFocus, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, onTarget = _a.onTarget, rest = __rest(_a, ["name", "hintText", "defaultText", "textAlign", "validation", "preventBlankMode", "enterSubmitMode", "textLineType", "multiRows", "autoMinRows", "autoMaxRows", "inputType", "inputMode", "state", "colorTheme", "min", "max", "maxLength", "textSize", "textWeight", "fieldPaddingRight", "fieldPaddingLeft", "textPadding", "fieldHeight", "deleteIconMode", "deleteIconSize", "deleteIconColor", "suffixText", "suffixTextRightSpacingMode", "isFocused", "autoComplete", "stepperMode", "stepperRightSpacing", "innerSpinButtonSize", "step", "onBlur", "onChange", "onFocus", "onKeyDown", "onKeyUp", "onTarget"]);
-    var _w = (0, react_hook_form_1.useFormContext)(), register = _w.register, setValue = _w.setValue, getValues = _w.getValues, clearErrors = _w.clearErrors;
-    var timeout;
-    var suffixTextRef = (0, react_1.useRef)(null);
-    var _x = (0, react_1.useState)(0), suffixTextWidth = _x[0], setSuffixTextWidth = _x[1];
-    // NOTE suffixText가 변할때마다 suffixText가 차지하는 너비를 알아내어 suffixTextWidth에 담는다.
-    (0, react_1.useEffect)(function () {
-        var calculateDivWidth = function () {
-            if (suffixTextRef.current) {
-                var width = suffixTextRef.current.offsetWidth;
-                setSuffixTextWidth(width);
-            }
-        };
-        calculateDivWidth();
-    }, [suffixText]);
-    (0, react_1.useEffect)(function () {
-        return function () { return clearTimeout(timeout); };
-    }, []);
-    function handleFocus(e) {
-        if (onFocus) {
-            onFocus(e);
-        }
-        clearErrors(name);
-    }
-    function handleKeyDown(e) {
-        if (textLineType === 'single' && enterSubmitMode === 'none' && e.key === 'Enter') {
-            e.preventDefault();
-        }
-        if (inputType === 'number') {
-            preventEKeyword(e);
-        }
-        if (onKeyDown) {
-            onKeyDown(e);
-        }
-    }
-    function handleKeyUp(e) {
-        if (onKeyUp) {
-            onKeyUp(e);
-        }
-        if (inputType === 'number' && maxLength) {
-            checkMaxLength(e);
-        }
-    }
-    function handleKeyPress(e) {
-        if (textLineType === 'single' && inputType === 'number' && inputMode === 'numeric') {
-            handleNumericKeypress(e);
-        }
-    }
-    /**
-     * 제어키(31 이하) 또는 숫자(0-9)만 입력 허용하는 키보드 이벤트 핸들러
-     * 제어키 예시: Backspace(8), Tab(9), Enter(13)
-     */
-    var handleNumericKeypress = function (e) {
-        // 제어키(31 이하)는 허용
-        var CONTROL_KEY_CODE = 31;
-        var code = e.which || e.keyCode;
-        if (code <= CONTROL_KEY_CODE) {
-            return;
-        }
-        // 숫자가 아니면 이벤트 중단
-        var char = String.fromCharCode(code);
-        if (!/^\d*$/.test(char)) {
-            e.preventDefault();
-        }
-    };
-    function handleChange(e) {
-        // NOTE: preventBlankMode는 input에만 적용 가능
-        // NOTE: preventBlankMode === 'all'일 경우에는 무조건 onChange 시점에 적용
-        if (textLineType === 'single' && preventBlankMode === 'all') {
-            var value = e.target.value;
-            if (value != null) {
-                e.target.value = value.replace(/ /g, '');
-            }
-        }
-        // 숫자만 필터링
-        if (textLineType === 'single' && inputType === 'number' && inputMode === 'numeric') {
-            var value = e.target.value;
-            if (!/^\d*$/.test(value)) {
-                e.target.value = value.replace(/\D/g, '');
-            }
-        }
-        if (onChange) {
-            onChange(e);
-        }
-    }
-    function handleBlur(e) {
-        // NOTE: preventBlankMode는 input에만 적용 가능
-        // NOTE: preventBlankMode === 'trim'일 경우에는 무조건 onBlur 시점에 적용
-        if (textLineType === 'single' && preventBlankMode === 'trim') {
-            if (e.target.value != null) {
-                setValue(name, e.target.value.replace(/^\s+|\s+$/gm, ''));
-            }
-        }
-        if (onBlur && onTarget) {
-            var relatedTarget = e.relatedTarget;
-            if (relatedTarget) {
-                onTarget();
-                onBlur(e);
-                return;
-            }
-            onBlur(e);
-        }
-    }
-    var textAreaRef = (0, react_1.useRef)(null);
-    var _y = register(name, validation), ref = _y.ref, refRest = __rest(_y, ["ref"]);
-    (0, react_1.useEffect)(function () {
-        if (textAreaRef === null || textAreaRef.current === null) {
-            return;
-        }
-        if (autoMinRows === 1) {
-            textAreaRef.current.style.height = '0';
-            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
-            return;
-        }
-        textAreaRef.current.style.height = "".concat(fieldHeight - 2, "px");
-        textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
-    }, []);
-    /**
-     * 텍스트 필드 내부 value에 맞게 초기 height 값을 부여한다.
-     *
-     * @param getValues(fieldName)
-     * @when 텍스트 필드에 value가 있을 때
-     */
-    (0, react_1.useEffect)(function () {
-        if (!textAreaRef || !textAreaRef.current) {
-            return;
-        }
-        if (getValues(name)) {
-            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
-        }
-    }, [getValues(name)]);
-    var handleResizeHeight = (0, react_1.useCallback)(function () {
-        if (ref === null || textAreaRef.current === null) {
-            return;
-        }
-        if (autoMinRows === 1) {
-            textAreaRef.current.style.height = '0';
-            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
-            return;
-        }
-        textAreaRef.current.style.height = "".concat(fieldHeight - 2, "px");
-        textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
-    }, []);
-    function deleteValue() {
-        setValue(name, '', { shouldDirty: true });
-    }
-    // NOTE: input의 type이 number일때, e나 E의 경우 숫자로 취급되어 입력이 가능하지만, publ의 기획상 막아야하기 때문에 생성한 함수
-    var preventEKeyword = function (e) {
-        if (e.key === 'e' || e.key === 'E') {
-            e.preventDefault();
-        }
-    };
-    // NOTE: input의 type이 number일때, maxLength를 사용할 수 없으나 기획상 필요해서 생성한 함수
-    function checkMaxLength(e) {
-        if (e.target.value.length >= maxLength) {
-            e.target.value = e.target.value.substring(0, maxLength);
-            timeout = setTimeout(function () {
-                return setValue(name, e.target.value, {
-                    shouldValidate: true
-                });
-            }, 800);
-        }
-    }
-    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 }), (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, inputMode: inputMode, 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, onKeyPress: handleKeyPress, 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, onKeyPress: handleKeyPress, 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, onKeyPress: handleKeyPress, ref: function (e) {
-                    ref(e);
-                    textAreaRef.current = e;
-                }, onInput: handleResizeHeight })));
-        }
-    };
-    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 && "".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;
-    return deleteIconMode === 'use' && stepperMode === 'use' && !suffixText && stepper_and_delete_style;
-}, function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize, deleteIconMode = _a.deleteIconMode, stepperMode = _a.stepperMode, suffixText = _a.suffixText, isFocused = _a.isFocused, suffixTextWidth = _a.suffixTextWidth, stepperRightSpacing = _a.stepperRightSpacing;
-    if (deleteIconMode === 'use' && stepperMode === 'use' && suffixText && stepperRightSpacing) {
-        if (isFocused) {
-            if (innerSpinButtonSize) {
-                if (innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE > suffixTextWidth) {
-                    return "margin-right: ".concat(innerSpinButtonSize - suffixTextWidth + stepperRightSpacing, "px;");
-                }
-                return;
-            }
-            return;
-        }
-        return;
-    }
-    return;
-});
-var S_RightBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: ", ";\n  height: 100%;\n  display: flex;\n  align-items: center;\n  right: 0;\n"], ["\n  position: ", ";\n  height: 100%;\n  display: flex;\n  align-items: center;\n  right: 0;\n"])), function (_a) {
-    var deleteIconMode = _a.deleteIconMode, stepperMode = _a.stepperMode, suffixText = _a.suffixText;
-    if ((deleteIconMode === 'use' && stepperMode === 'use' && suffixText) ||
-        (deleteIconMode === 'use' && stepperMode === 'use') ||
-        stepperMode === 'use') {
-        return 'absolute';
-    }
-    return 'relative';
-});
-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 && "".concat(innerSpinButtonSize * 2, "px");
-}, function (_a) {
-    var stepperRightSpacing = _a.stepperRightSpacing;
-    return stepperRightSpacing && "".concat(stepperRightSpacing, "px");
-}, function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
-}, function (_a) {
-    var isFocused = _a.isFocused;
-    return isFocused && 'visibility: visible;';
-});
-var S_SuffixTextBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
-var S_InputWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  position: relative;\n  width: 100%;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  position: relative;\n  width: 100%;\n"])));
-var read_only = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
-    var theme = _a.theme, colorTheme = _a.colorTheme;
-    return colorTheme &&
-        {
-            none: theme.ui_cpnt_textfield_text_disabled,
-            dark: theme.ui_cpnt_textfield_text_darktheme_disabled,
-            transparent: theme.ui_cpnt_textfield_text_colortheme_transparent_readonly
-        }[colorTheme];
-});
-var disabled = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  color: ", ";\n  pointer-events: none;\n"], ["\n  color: ", ";\n  pointer-events: none;\n"])), function (_a) {
-    var theme = _a.theme, colorTheme = _a.colorTheme;
-    return colorTheme &&
-        {
-            none: theme.ui_cpnt_textfield_text_disabled,
-            dark: theme.ui_cpnt_textfield_text_darktheme_disabled,
-            transparent: theme.ui_cpnt_textfield_text_colortheme_transparent_disabled
-        }[colorTheme];
-});
-var basicStyle = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background-color: transparent;\n  border: none;\n  box-sizing: border-box;\n  color: ", ";\n  display: inline-flex;\n  font-size: ", ";\n  font-weight: ", ";\n  height: 100%;\n  justify-content: center;\n  line-height: ", ";\n  outline: 0;\n  overflow: hidden;\n  padding: 0;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  text-align: ", ";\n  width: 100%;\n  &::placeholder {\n    color: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n  }\n\n  ", ";\n  ", "\n  ", "\n\n  ", "\n"], ["\n  background-color: transparent;\n  border: none;\n  box-sizing: border-box;\n  color: ", ";\n  display: inline-flex;\n  font-size: ", ";\n  font-weight: ", ";\n  height: 100%;\n  justify-content: center;\n  line-height: ", ";\n  outline: 0;\n  overflow: hidden;\n  padding: 0;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  text-align: ", ";\n  width: 100%;\n  &::placeholder {\n    color: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n  }\n\n  ", ";\n  ", "\n  ", "\n\n  ", "\n"])), function (_a) {
-    var theme = _a.theme, colorTheme = _a.colorTheme;
-    return colorTheme &&
-        {
-            none: theme.ui_cpnt_textfield_text_typed,
-            dark: theme.ui_cpnt_textfield_text_darktheme_enabled,
-            transparent: theme.ui_cpnt_textfield_text_colortheme_transparent_enabled
-        }[colorTheme];
-}, function (_a) {
-    var textSize = _a.textSize;
-    return common_1.desktopFontSize[textSize];
-}, function (_a) {
-    var textWeight = _a.textWeight;
-    return common_1.fontWeight[textWeight];
-}, function (_a) {
-    var textSize = _a.textSize;
-    return common_1.desktopLineHeight[textSize];
-}, function (_a) {
-    var textAlign = _a.textAlign;
-    return textAlign;
-}, function (_a) {
-    var theme = _a.theme, colorTheme = _a.colorTheme;
-    return colorTheme &&
-        {
-            none: theme.ui_cpnt_textfield_text_hint,
-            dark: theme.ui_cpnt_textfield_text_darktheme_hint,
-            transparent: theme.ui_cpnt_textfield_text_colortheme_transparent_hint
-        }[colorTheme];
-}, function (_a) {
-    var textSize = _a.textSize;
-    return common_1.desktopFontSize[textSize];
-}, function (_a) {
-    var textWeight = _a.textWeight;
-    return common_1.fontWeight[textWeight];
-}, function (_a) {
-    var textSize = _a.textSize;
-    return common_1.desktopLineHeight[textSize];
-}, function (_a) {
-    var state = _a.state;
-    return state &&
-        {
-            normal: '',
-            read_only: read_only,
-            disabled: disabled
-        }[state];
-}, function (_a) {
-    var fieldPaddingRight = _a.fieldPaddingRight;
-    return fieldPaddingRight && "padding-right: ".concat(fieldPaddingRight, "px;");
-}, function (_a) {
-    var fieldPaddingLeft = _a.fieldPaddingLeft;
-    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) {
-        return delete_stepper_suffix;
-    }
-    if (deleteIconMode === 'use' && stepperMode === 'use' && !suffixText) {
-        return delete_stepper;
-    }
-    if (deleteIconMode === 'none' && stepperMode === 'use' && suffixText) {
-        return stepper_suffix;
-    }
-    if (deleteIconMode === 'none' && stepperMode === 'use' && !suffixText) {
-        return stepper;
-    }
-    return;
-});
-var delete_stepper_suffix = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  padding-right: ", ";\n"], ["\n  padding-right: ", ";\n"])), function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize, fieldPaddingRight = _a.fieldPaddingRight, isFocused = _a.isFocused, suffixTextWidth = _a.suffixTextWidth, stepperRightSpacing = _a.stepperRightSpacing;
-    if (innerSpinButtonSize && stepperRightSpacing) {
-        if (isFocused) {
-            if (innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing <
-                constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth) {
-                if (fieldPaddingRight) {
-                    return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + fieldPaddingRight, "px");
-                }
-                return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth, "px");
-            }
-            if (fieldPaddingRight) {
-                return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + fieldPaddingRight + stepperRightSpacing, "px");
-            }
-            return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + stepperRightSpacing, "px");
-        }
-        if (fieldPaddingRight) {
-            return "".concat(suffixTextWidth + fieldPaddingRight, "px");
-        }
-        return "".concat(suffixTextWidth, "px");
-    }
-    return;
-});
-var delete_stepper = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  padding-right: ", ";\n"], ["\n  padding-right: ", ";\n"])), function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize, fieldPaddingRight = _a.fieldPaddingRight, isFocused = _a.isFocused, stepperRightSpacing = _a.stepperRightSpacing;
-    if (innerSpinButtonSize && stepperRightSpacing) {
-        if (isFocused) {
-            if (fieldPaddingRight) {
-                return "".concat(innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + fieldPaddingRight + stepperRightSpacing, "px");
-            }
-            return "".concat(innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing, "px");
-        }
-        if (fieldPaddingRight) {
-            return "".concat(fieldPaddingRight, "px");
-        }
-        return;
-    }
-    return;
-});
-var stepper_suffix = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  padding-right: ", ";\n"], ["\n  padding-right: ", ";\n"])), function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize, fieldPaddingRight = _a.fieldPaddingRight, isFocused = _a.isFocused, suffixTextWidth = _a.suffixTextWidth, stepperRightSpacing = _a.stepperRightSpacing;
-    if (innerSpinButtonSize && stepperRightSpacing) {
-        if (isFocused) {
-            if (innerSpinButtonSize + stepperRightSpacing < suffixTextWidth) {
-                if (fieldPaddingRight) {
-                    return "".concat(suffixTextWidth + fieldPaddingRight, "px");
-                }
-                return "".concat(suffixTextWidth, "px");
-            }
-            if (fieldPaddingRight) {
-                return "".concat(innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight, "px");
-            }
-            return "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
-        }
-        if (fieldPaddingRight) {
-            return "".concat(suffixTextWidth + fieldPaddingRight, "px");
-        }
-        return "".concat(suffixTextWidth, "px");
-    }
-    return;
-});
-var stepper = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  padding-right: ", ";\n"], ["\n  padding-right: ", ";\n"])), function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize, fieldPaddingRight = _a.fieldPaddingRight, isFocused = _a.isFocused, stepperRightSpacing = _a.stepperRightSpacing;
-    if (innerSpinButtonSize && stepperRightSpacing) {
-        if (isFocused) {
-            if (fieldPaddingRight) {
-                return "".concat(innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight, "px");
-            }
-            return "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
-        }
-        if (fieldPaddingRight) {
-            return "".concat(fieldPaddingRight, "px");
-        }
-        return;
-    }
-    return;
-});
-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 && "".concat(innerSpinButtonSize * 2, "px");
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing.spacingB;
-}, function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
-}, function (_a) {
-    var stepperRightSpacing = _a.stepperRightSpacing;
-    return stepperRightSpacing && "".concat(stepperRightSpacing, "px");
-}, function (_a) {
-    var innerSpinButtonSize = _a.innerSpinButtonSize;
-    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  &:-webkit-autofill,\n  &:-webkit-autofill:hover,\n  &:-webkit-autofill:focus,\n  &:-webkit-autofill:active {\n    -webkit-text-fill-color: ", " !important;\n    transition: background-color 9999s ease-in-out 0s !important;\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\n  &:-webkit-autofill,\n  &:-webkit-autofill:hover,\n  &:-webkit-autofill:focus,\n  &:-webkit-autofill:active {\n    -webkit-text-fill-color: ", " !important;\n    transition: background-color 9999s ease-in-out 0s !important;\n  }\n"])), basicStyle, function (_a) {
-    var theme = _a.theme;
-    return theme.desktopLineHeight.singleLine;
-}, function (_a) {
-    var stepperMode = _a.stepperMode, type = _a.type, isFocused = _a.isFocused;
-    return stepperMode === 'use' && type === 'number' && isFocused
-        ? inputInnerSpinButtonStyle
-        : '-webkit-appearance: none; margin: 0;';
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.ui_cpnt_textfield_text_typed;
-});
-var S_Auto = styled_components_1.default.textarea(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  ", "\n  display: block;\n  overflow-y: auto;\n  resize: none;\n  ", "\n  ", ";\n"], ["\n  ", "\n  display: block;\n  overflow-y: auto;\n  resize: none;\n  ", "\n  ", ";\n"])), basicStyle, function (_a) {
-    var autoMaxRows = _a.autoMaxRows, textSize = _a.textSize, fieldHeight = _a.fieldHeight;
-    return autoMaxRows &&
-        fieldHeight &&
-        "max-height: ".concat(Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
-            Number(common_1.desktopLineHeight[textSize]) *
-            autoMaxRows, "px;");
-}, function (_a) {
-    var autoMinRows = _a.autoMinRows, textSize = _a.textSize, fieldHeight = _a.fieldHeight;
-    return autoMinRows &&
-        fieldHeight &&
-        "min-height: ".concat(Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
-            Number(common_1.desktopLineHeight[textSize]) *
-            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;
-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;

package/dist/src/mobile/common/components/TextFieldBase/constants.d.ts

@@ -1,2 +0,0 @@
-export declare const PIXEL_FOR_ICONS_CENTER = 1;
-export declare const DELETE_BUTTON_BASE_SIZE = 32;

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

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DELETE_BUTTON_BASE_SIZE = exports.PIXEL_FOR_ICONS_CENTER = void 0;
-exports.PIXEL_FOR_ICONS_CENTER = 1;
-exports.DELETE_BUTTON_BASE_SIZE = 32;

package/dist/src/mobile/common/components/TextFieldBase/index.d.ts

@@ -1 +0,0 @@
-export { default as TextFieldBase } from './TextFieldBase';

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

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextFieldBase = void 0;
-var TextFieldBase_1 = require("./TextFieldBase");
-Object.defineProperty(exports, "TextFieldBase", { enumerable: true, get: function () { return __importDefault(TextFieldBase_1).default; } });

package/dist/src/mobile/common/components/index.d.ts

@@ -1,2 +0,0 @@
-import { TextFieldBase } from './TextFieldBase';
-export { TextFieldBase };

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

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextFieldBase = void 0;
-var TextFieldBase_1 = require("./TextFieldBase");
-Object.defineProperty(exports, "TextFieldBase", { enumerable: true, get: function () { return TextFieldBase_1.TextFieldBase; } });

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

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import type { BasicButtonGroupValueOption } from '../../../common/types';
-export type BasicButtonGroupProps = {
-    size?: 'large' | 'medium' | 'small';
-    valueArray: BasicButtonGroupValueOption[];
-    state?: 'normal' | 'disabled';
-};
-declare function BasicButtonGroup({ size, valueArray, state }: BasicButtonGroupProps): JSX.Element;
-export default BasicButtonGroup;

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

@@ -1,86 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    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;
-    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];
-}));
-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 jsx_runtime_1 = require("react/jsx-runtime");
-var components_1 = require("../../../hybrid/components");
-var styled_components_1 = __importStar(require("styled-components"));
-function BasicButtonGroup(_a) {
-    var _b = _a.size, size = _b === void 0 ? 'medium' : _b, valueArray = _a.valueArray, _c = _a.state, state = _c === void 0 ? 'normal' : _c;
-    var getColorKey = function (buttonState, iconColorTheme) {
-        if (state === 'disabled' || buttonState === 'disabled') {
-            return 'ui_cpnt_button_icon_disabled';
-        }
-        if (iconColorTheme === 'red') {
-            return 'ui_cpnt_button_icon_error';
-        }
-        return 'ui_cpnt_button_icon_enabled';
-    };
-    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, _e = _a.backgroundColorTheme, backgroundColorTheme = _e === void 0 ? 'ui_cpnt_basicbuttongroup_base_default' : _e, 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', backgroundColorTheme: backgroundColorTheme }, { 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;
-    return theme.spacing.spacingA;
-});
-var large = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-radius: 14px;\n  height: 48px;\n  width: 48px;\n"], ["\n  border-radius: 14px;\n  height: 48px;\n  width: 48px;\n"])));
-var medium = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  border-radius: 12px;\n  height: 40px;\n  width: 40px;\n"], ["\n  border-radius: 12px;\n  height: 40px;\n  width: 40px;\n"])));
-var small = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  border-radius: 10px;\n  height: 32px;\n  width: 32px;\n"], ["\n  border-radius: 10px;\n  height: 32px;\n  width: 32px;\n"])));
-var S_BasicButton = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  align-items: center;\n  background-color: ", ";\n  border: none;\n  display: inline-flex;\n  justify-content: center;\n\n  position: relative;\n\n  ", ";\n\n  &::before {\n    background-color: transparent;\n    border-radius: inherit;\n    content: '';\n    height: 100%;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:hover:enabled:before {\n    background-color: ", ";\n  }\n\n  &:active:enabled:before {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    cursor: default;\n  }\n"], ["\n  align-items: center;\n  background-color: ", ";\n  border: none;\n  display: inline-flex;\n  justify-content: center;\n\n  position: relative;\n\n  ", ";\n\n  &::before {\n    background-color: transparent;\n    border-radius: inherit;\n    content: '';\n    height: 100%;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:hover:enabled:before {\n    background-color: ", ";\n  }\n\n  &:active:enabled:before {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    cursor: default;\n  }\n"])), function (_a) {
-    var theme = _a.theme, backgroundColorTheme = _a.backgroundColorTheme;
-    return backgroundColorTheme
-        ? theme[backgroundColorTheme]
-        : theme.ui_cpnt_basicbuttongroup_base_default;
-}, function (_a) {
-    var size = _a.size;
-    return size && { large: large, medium: medium, small: small }[size];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.ui_cpnt_button_fill_on_base_hover;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.ui_cpnt_button_fill_on_base_pressed;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.ui_cpnt_basicbuttongroup_base_disabled;
-});
-exports.default = BasicButtonGroup;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

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

@@ -1 +0,0 @@
-export { default as BasicButtonGroup } from './BasicButtonGroup';