ecomlab-components-next 0.1.92 → 0.1.94

package/dist/components/ConstructorComponents/ModalBitrixForm/ModalBitrixForm.js

@@ -145,7 +145,7 @@ var ModalBitrixForm = function ModalBitrixForm(_ref) {
       }
     } else if (inputType === 'tel') {
       var regex = /^\+7 \(\d{3}\) \d{3}-\d{2}-\d{2}$/;
-      if (!regex.test(value)) {
+      if (value.length < 1) {
         error[id] = 'Неверный телефон';
         isValid = false;
       }
@@ -230,7 +230,7 @@ var ModalBitrixForm = function ModalBitrixForm(_ref) {
       }
     } else if (inputType === 'tel') {
       var regex = /^\+7 \(\d{3}\) \d{3}-\d{2}-\d{2}$/;
-      if (!regex.test(value)) {
+      if (value.length < 1) {
         isValid = false;
       }
     } else if (inputType === 'dropdown') {
@@ -337,6 +337,8 @@ var ModalBitrixForm = function ModalBitrixForm(_ref) {
           autoComplete: false,
           err: err === null || err === void 0 ? void 0 : err[id],
           required: required,
+          countrySelect: inputType === 'tel',
+          countryDefault: 'TH',
           textErr: err === null || err === void 0 ? void 0 : err[id],
           onBlur: function onBlur(value) {
             return handleBlur(id, inputType, value);

package/dist/components/ConstructorComponents/ModalBitrixForm/ModalBitrixForm.scss

@@ -49,8 +49,6 @@
         gap: 28px;
         width: 100%;
         height: auto;
-        overflow-y: auto;
-        overflow-x: hidden;
         padding-top: 10px;
 
         &::-webkit-scrollbar {

package/dist/components/Inputs/InputDinamycPlaceholder/InputDinamycPlaceholder.js

@@ -9,6 +9,8 @@ exports["default"] = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _imask = _interopRequireDefault(require("imask"));
 var _libphonenumberJs = require("libphonenumber-js");
+var _DownSelector = _interopRequireDefault(require("../../Inputs/DropDownSelector/DownSelector"));
+var _examples = _interopRequireDefault(require("libphonenumber-js/mobile/examples"));
 require("./InputDinamycPlaceholder.scss");
 var _excluded = ["tooltip", "tooltipStatic", "rows", "changeValue", "setChangeValue", "classname", "placeholder", "type", "onChange", "passwordTooltip", "err", "textErr", "infoHeader", "info", "autoComplete", "disabled", "showClearIndicator", "multiline", "maxLength", "autoFocus", "variant", "size", "maxlength", "required", "onBlur", "mask", "readOnly", "countrySelect", "countryDefault"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
@@ -89,6 +91,15 @@ var InputDinamycPlaceholder = function InputDinamycPlaceholder(_ref) {
     _useState10 = _slicedToArray(_useState9, 2),
     country = _useState10[0],
     setCountry = _useState10[1]; // По умолчанию Россия
+  var _useState11 = (0, _react.useState)({
+      label: countryDefault,
+      value: countryDefault
+    }),
+    _useState12 = _slicedToArray(_useState11, 2),
+    selectedCountry = _useState12[0],
+    setSelectedCountry = _useState12[1];
+
+  // По умолчанию Россия
   var inputRef = (0, _react.useRef)(null);
   var maskRef = (0, _react.useRef)(null);
 
@@ -97,14 +108,14 @@ var InputDinamycPlaceholder = function InputDinamycPlaceholder(_ref) {
 
   // Обработчик изменения страны
   var handleCountryChange = function handleCountryChange(e) {
-    var newCountry = e.target.value;
+    var newCountry = e === null || e === void 0 ? void 0 : e.value;
     setCountry(newCountry);
 
     // Обновляем маску для IMask
     if (type === 'tel' && inputRef.current) {
       var code = (0, _libphonenumberJs.getCountryCallingCode)(newCountry);
       var newMask = {
-        mask: "+".concat(code, " (000) 000-00-00")
+        mask: countryDefault == 'RU' ? "+".concat(code, " (000) 000-00-00") : "+".concat(code, " 000000000000")
       }; // Пример маски для России
 
       if (maskRef.current) {
@@ -133,49 +144,48 @@ var InputDinamycPlaceholder = function InputDinamycPlaceholder(_ref) {
   (0, _react.useEffect)(function () {
     setValueInside(changeValue || '');
   }, [changeValue]);
-  (0, _react.useEffect)(function () {
-    if (type === 'tel' && inputRef.current) {
-      var code = (0, _libphonenumberJs.getCountryCallingCode)(country);
-      var maskOptions = {
-        mask: "+".concat(code, " (000) 000-00-00")
-      };
-      maskRef.current = (0, _imask["default"])(inputRef.current, maskOptions);
-      maskRef.current.on('accept', function () {
-        setValueInside(maskRef.current.value);
-      });
-      return function () {
-        var _maskRef$current;
-        return (_maskRef$current = maskRef.current) === null || _maskRef$current === void 0 ? void 0 : _maskRef$current.destroy();
-      };
-    }
-  }, [type, country]);
+
+  // useEffect(() => {
+  //   if (type === 'tel' && inputRef.current) {
+  //     const code = getCountryCallingCode(country);
+  //     const maskOptions = { mask: `+${code} 000000000000` };
+  //     maskRef.current = IMask(inputRef.current, maskOptions);
+  //     maskRef.current.on('accept', () => {
+  //       setValueInside(maskRef.current.value);
+  //     });
+  //     return () => maskRef.current?.destroy();
+  //   }
+  // }, [type, country]);
 
   // Обновление значения из props
   (0, _react.useEffect)(function () {
     setValueInside(changeValue || '');
   }, [changeValue]);
+  var options_country = countries.map(function (countryCode) {
+    return {
+      label: "".concat(getCountryName(countryCode), " +").concat((0, _libphonenumberJs.getCountryCallingCode)(countryCode)),
+      value: "".concat(getCountryName(countryCode))
+    };
+  });
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "input-dinamyc-placeholder",
     style: {
       width: '100%',
       marginBottom: tooltip ? '24px' : ''
     }
-  }, countrySelect && /*#__PURE__*/_react["default"].createElement("select", {
-    value: country,
-    onChange: handleCountryChange,
+  }, countrySelect && /*#__PURE__*/_react["default"].createElement(_DownSelector["default"], {
+    options_prop: options_country,
+    state: selectedCountry,
+    setState: function setState(e) {
+      setSelectedCountry(e);
+      handleCountryChange(e);
+    },
+    width: "100%",
+    isClearable: false,
     style: {
-      marginRight: '10px',
-      padding: '8px',
-      borderRadius: '4px',
-      border: '1px solid #ccc',
       marginBottom: '12px'
     }
-  }, countries.map(function (countryCode) {
-    return /*#__PURE__*/_react["default"].createElement("option", {
-      key: countryCode,
-      value: countryCode
-    }, getCountryName(countryCode), " (+", (0, _libphonenumberJs.getCountryCallingCode)(countryCode), ")");
-  })), /*#__PURE__*/_react["default"].createElement("div", {
+  }), /*#__PURE__*/_react["default"].createElement("div", {
     className: "".concat(err ? 'input-box__err' : 'input-box', " ").concat(size === 's' ? 'size-s' : 'size-l', " ").concat(disabled ? 'input-box_disabled' : '')
   }, /*#__PURE__*/_react["default"].createElement("input", {
     ref: inputRef,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ecomlab-components-next",
-  "version": "0.1.92",
+  "version": "0.1.94",
   "description": "A set of common and reusable React components",
   "main": "dist/index.js",
   "files": [