ui-kit-ck-consultant 0.5.222 → 0.5.225

package/dist/index.css

@@ -713,6 +713,7 @@
   -moz-user-select: none;
   user-select: none;
   cursor: pointer;
+  overflow: hidden;
 }
 ._3BzwZ::-moz-placeholder {
   color: var(--gray);
@@ -751,10 +752,9 @@
 }
 
 ._oq5Pn {
-  position: absolute;
+  position: fixed;
   display: flex;
   flex-direction: column;
-  overflow-y: auto;
   width: 100%;
   height: 280px;
   max-height: 450px;
@@ -763,7 +763,6 @@
   border-radius: 15px;
   z-index: 100;
   top: 90px;
-  padding-top: 8px;
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -771,12 +770,16 @@
 }
 
 ._oq5Pn > div:not(._HjP3u) {
+  overflow-y: auto;
+}
+
+._oq5Pn > div:not(._HjP3u) > div {
   padding: 8px 16px;
   transition: 0.3s;
   cursor: pointer;
 }
 
-._oq5Pn > div:hover:not(._HjP3u) {
+._oq5Pn > div:not(._HjP3u) > div:hover {
   background-color: #eeeeee;
 }
 

package/dist/index.js

@@ -602,6 +602,7 @@ var FormSelectMutiples = /*#__PURE__*/function (_React$Component) {
     _this.state = {
       isDisplay: false
     };
+    _this.inputRef = React__default.createRef();
     return _this;
   }
 
@@ -617,6 +618,7 @@ var FormSelectMutiples = /*#__PURE__*/function (_React$Component) {
     }, this.props.title, ' ', this.props.required ? /*#__PURE__*/React__default.createElement("span", {
       className: "red"
     }, "*") : '') : '', /*#__PURE__*/React__default.createElement("div", {
+      ref: this.inputRef,
       className: style$6.form_select_multiples,
       onClick: function onClick() {
         return _this2.setState({
@@ -626,8 +628,13 @@ var FormSelectMutiples = /*#__PURE__*/function (_React$Component) {
     }, /*#__PURE__*/React__default.createElement("span", null, this.props.value.join(";")), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(reactFontawesome.FontAwesomeIcon, {
       icon: freeSolidSvgIcons.faCaretDown
     }))), this.state.isDisplay ? /*#__PURE__*/React__default.createElement("div", {
+      style: {
+        top: this.inputRef.current.getBoundingClientRect().y + 60,
+        left: this.inputRef.current.getBoundingClientRect().x,
+        width: this.inputRef.current.offsetWidth
+      },
       className: style$6.form_select_values
-    }, this.props.options.map(function (element, idx) {
+    }, /*#__PURE__*/React__default.createElement("div", null, this.props.options.map(function (element, idx) {
       return /*#__PURE__*/React__default.createElement("div", {
         key: idx,
         onClick: function onClick() {
@@ -640,7 +647,7 @@ var FormSelectMutiples = /*#__PURE__*/function (_React$Component) {
         checked: _this2.props.value.includes(element.value),
         text: element.text
       }));
-    }), /*#__PURE__*/React__default.createElement("div", {
+    })), /*#__PURE__*/React__default.createElement("div", {
       className: classNames$1('mt-auto d-flex', style$6.form_select_multiples_bottom)
     }, /*#__PURE__*/React__default.createElement("span", {
       onClick: function onClick() {