ui-kit-ck-consultant 0.5.131 → 0.5.135

package/dist/index.css

@@ -2095,7 +2095,10 @@
 }
 
 ._2CYNt {
+  display: flex;
+  flex-direction: column;
   margin: auto;
+  text-align: center;
 }
 
 ._3ysPX {
@@ -2104,6 +2107,16 @@
   margin: 0 auto;
 }
 
+._2CYNt > p {
+  margin: 0;
+  margin-top: 1rem;
+  color: #ffffff;
+  background-color: var(--primary-color);
+  border-radius: 12px;
+  padding: 0.8rem;
+  font-size: 16px;
+}
+
 ._3ysPX span {
   display: inline-block;
   width: 6px;

package/dist/index.js

@@ -82,7 +82,7 @@ var Modal = /*#__PURE__*/function (_React$Component) {
     var modalContainerClass = classNames$1((_classNames = {}, _classNames[style.large] = !!this.props.large, _classNames), style.modal_container, this.props.className);
     return /*#__PURE__*/React__default.createElement("div", {
       className: style.modal,
-      onClick: function onClick(e) {
+      onMouseDown: function onMouseDown(e) {
         return _this.handleClickModal(e);
       }
     }, /*#__PURE__*/React__default.createElement("div", {
@@ -267,7 +267,8 @@ var FormInput = /*#__PURE__*/function (_React$Component) {
   _proto.render = function render() {
     if (this.props.children) {
       return /*#__PURE__*/React__default.createElement("div", {
-        className: classNames$1(style$2.form_input_container, this.props.className)
+        className: classNames$1(style$2.form_input_container, this.props.className),
+        style: this.props.style
       }, this.props.title ? /*#__PURE__*/React__default.createElement("span", {
         className: this.props.classNameTitle
       }, this.props.title, ' ', this.props.required ? /*#__PURE__*/React__default.createElement("span", {
@@ -291,10 +292,13 @@ var FormInput = /*#__PURE__*/function (_React$Component) {
       }, this.props.error) : '');
     } else {
       return /*#__PURE__*/React__default.createElement("div", {
-        className: classNames$1(style$2.form_input_container, this.props.className)
+        className: classNames$1(style$2.form_input_container, this.props.className),
+        style: this.props.style
       }, this.props.title ? /*#__PURE__*/React__default.createElement("span", {
         className: this.props.classNameTitle
-      }, this.props.title) : '', /*#__PURE__*/React__default.createElement("input", {
+      }, this.props.title, ' ', this.props.required ? /*#__PURE__*/React__default.createElement("span", {
+        className: "red"
+      }, "*") : '') : '', /*#__PURE__*/React__default.createElement("input", {
         className: style$2.form_input,
         type: this.props.type,
         placeholder: this.props.placeholder,
@@ -427,6 +431,14 @@ var FormRange = /*#__PURE__*/function (_React$Component) {
 
     _this = _React$Component.call(this, props) || this;
 
+    _this.handleClickOutside = function (event) {
+      if (_this.refComponent && _this.refComponent.current && !_this.refComponent.current.contains(event.target)) {
+        _this.setState({
+          isOpen: false
+        });
+      }
+    };
+
     _this.findText = function (options, value) {
       var result = options.filter(function (item) {
         return item.value.toString() === value.toString();
@@ -449,11 +461,20 @@ var FormRange = /*#__PURE__*/function (_React$Component) {
     _this.state = {
       isOpen: false
     };
+    _this.refComponent = React__default.createRef();
     return _this;
   }
 
   var _proto = FormRange.prototype;
 
+  _proto.componentDidMount = function componentDidMount() {
+    document.addEventListener('mousedown', this.handleClickOutside);
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    document.removeEventListener('mousedown', this.handleClickOutside);
+  };
+
   _proto.render = function render() {
     var _this2 = this;
 
@@ -473,8 +494,10 @@ var FormRange = /*#__PURE__*/function (_React$Component) {
     }, /*#__PURE__*/React__default.createElement("span", null, this.getLabel(this.props.value1, this.props.value2, this.props.options1, this.props.options2)), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(reactFontawesome.FontAwesomeIcon, {
       icon: this.state.isOpen ? freeSolidSvgIcons.faCaretUp : freeSolidSvgIcons.faCaretDown
     }))), this.state.isOpen ? /*#__PURE__*/React__default.createElement("div", {
+      ref: this.refComponent,
       className: style$4.form_range_modal
     }, /*#__PURE__*/React__default.createElement(FormSelect, {
+      type: this.props.type,
       name: this.props.name1,
       options: this.props.options1,
       value: this.props.value1,
@@ -484,6 +507,7 @@ var FormRange = /*#__PURE__*/function (_React$Component) {
       disabled: false,
       init: this.props.init1
     }), /*#__PURE__*/React__default.createElement(FormSelect, {
+      type: this.props.type,
       name: this.props.name2,
       options: this.props.options2,
       value: this.props.value2,
@@ -2421,7 +2445,7 @@ var Loader = /*#__PURE__*/function (_React$Component) {
       className: classNames$1(style$k.loader_element, this.props.classNameChildren)
     }, /*#__PURE__*/React__default.createElement("div", {
       className: style$k.loader
-    }, /*#__PURE__*/React__default.createElement("span", null), /*#__PURE__*/React__default.createElement("span", null), /*#__PURE__*/React__default.createElement("span", null), /*#__PURE__*/React__default.createElement("span", null))));
+    }, /*#__PURE__*/React__default.createElement("span", null), /*#__PURE__*/React__default.createElement("span", null), /*#__PURE__*/React__default.createElement("span", null), /*#__PURE__*/React__default.createElement("span", null)), this.props.message ? /*#__PURE__*/React__default.createElement("p", null, this.props.message) : null));
   };
 
   return Loader;