@pedidopago/ui 1.7.25 → 1.8.0

package/dist/components/NewSelect/multiple/index.js

@@ -1,247 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.NewMultipleSelect = NewMultipleSelect;
-var _react = require("react");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _Flex = _interopRequireDefault(require("../../Flex"));
-var _Icon = _interopRequireDefault(require("../../Icon"));
-var _ReactPortal = require("../../ReactPortal");
-var _styles = require("../components/OptionsSelect/styles");
-var _useReposition = require("../../../shared/hooks/useReposition");
-var _useOnClickOutside = require("../../../shared/hooks/useOnClickOutside");
-var _styles2 = require("../styles");
-var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["label", "placeholder", "alert", "helperText", "variant", "children", "value", "onClose", "onOpen", "renderOptions", "onChange"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function NewMultipleSelect(_ref) {
-  var _containerRef$current;
-  var _ref$label = _ref.label,
-    label = _ref$label === void 0 ? '' : _ref$label,
-    _ref$placeholder = _ref.placeholder,
-    placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
-    alert = _ref.alert,
-    helperText = _ref.helperText,
-    variant = _ref.variant,
-    children = _ref.children,
-    value = _ref.value,
-    onClose = _ref.onClose,
-    onOpen = _ref.onOpen,
-    renderOptions = _ref.renderOptions,
-    onChange = _ref.onChange,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var containerRef = (0, _react.useRef)(null);
-  var selectRef = (0, _react.useRef)(null);
-  var _useState = (0, _react.useState)(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isOpenOptions = _useState2[0],
-    setIsOpenOptions = _useState2[1];
-  var _useState3 = (0, _react.useState)([]),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedOptions = _useState4[0],
-    setSelectedOptions = _useState4[1];
-  var multipleSelectValues = selectedOptions.map(function (option) {
-    return option.value;
-  });
-  var optionsModalRef = (0, _react.useRef)(null);
-  var _useState5 = (0, _react.useState)([]),
-    _useState6 = _slicedToArray(_useState5, 2),
-    options = _useState6[0],
-    setOptions = _useState6[1];
-  (0, _react.useEffect)(function () {
-    var _optionsModalRef$curr;
-    var childs = (_optionsModalRef$curr = optionsModalRef.current) === null || _optionsModalRef$curr === void 0 ? void 0 : _optionsModalRef$curr.childNodes;
-    var newOptions = [];
-    _react.Children.forEach(children, function (child, index) {
-      var _childs$index, _childs$index$classLi;
-      if (childs !== null && childs !== void 0 && (_childs$index = childs[index]) !== null && _childs$index !== void 0 && (_childs$index$classLi = _childs$index.classList) !== null && _childs$index$classLi !== void 0 && _childs$index$classLi.contains('select-item')) {
-        var _child$props, _childs$index2;
-        newOptions.push({
-          value: child === null || child === void 0 ? void 0 : (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.value,
-          label: childs === null || childs === void 0 ? void 0 : (_childs$index2 = childs[index]) === null || _childs$index2 === void 0 ? void 0 : _childs$index2.innerText
-        });
-      }
-    });
-    setOptions(newOptions);
-  }, [children, optionsModalRef.current]);
-  function changeMultipleOption(valueOption) {
-    if (valueOption === undefined) {
-      setSelectedOptions([]);
-      setIsOpenOptions(false);
-      return;
-    }
-    var findOption = selectedOptions.find(function (option) {
-      return option.value === valueOption;
-    });
-    if (findOption) {
-      removeOption(valueOption);
-    } else {
-      var newOption = options.find(function (option) {
-        return option.value === valueOption;
-      });
-      if (newOption) {
-        setSelectedOptions([].concat(_toConsumableArray(selectedOptions), [newOption]));
-      }
-      onChange === null || onChange === void 0 ? void 0 : onChange([].concat(_toConsumableArray(multipleSelectValues), [valueOption]));
-    }
-  }
-  (0, _react.useEffect)(function () {
-    function handler() {
-      setIsOpenOptions(false);
-    }
-    if (isOpenOptions) {
-      var _document;
-      onOpen === null || onOpen === void 0 ? void 0 : onOpen();
-      (_document = document) === null || _document === void 0 ? void 0 : _document.addEventListener('scroll', handler);
-    } else {
-      var _document2;
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-      (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.removeEventListener('scroll', handler);
-    }
-    return function () {
-      var _document3;
-      return (_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.removeEventListener('scroll', handler);
-    };
-  }, [isOpenOptions]);
-  (0, _useOnClickOutside.useOnClickOutside)([containerRef, optionsModalRef], function () {
-    if (isOpenOptions) {
-      setIsOpenOptions(false);
-    }
-  });
-  var positionsSelect = (0, _useReposition.useReposition)({
-    containerRef: optionsModalRef,
-    triggerRef: selectRef
-  }, [children]);
-  function removeOption(optionToRemove) {
-    var newSelectedOptions = selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.filter(function (option) {
-      return option.value !== optionToRemove;
-    });
-    var newSelectedValues = newSelectedOptions.map(function (option) {
-      return option.value;
-    });
-    setSelectedOptions(newSelectedOptions);
-    onChange === null || onChange === void 0 ? void 0 : onChange(newSelectedValues);
-  }
-  var SelectedOptionsWithCustomComponent = function SelectedOptionsWithCustomComponent(_ref2) {
-    var option = _ref2.option;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: renderOptions === null || renderOptions === void 0 ? void 0 : renderOptions(option, function () {
-        return removeOption(option.value);
-      })
-    });
-  };
-  (0, _react.useEffect)(function () {
-    var newOptions = options.filter(function (option) {
-      return value === null || value === void 0 ? void 0 : value.includes(option.value);
-    });
-    var newSelectedOptions = selectedOptions.filter(function (selectedOption) {
-      return newOptions.every(function (newOption) {
-        return newOption.value !== selectedOption.value;
-      });
-    });
-    setSelectedOptions([].concat(_toConsumableArray(newSelectedOptions), _toConsumableArray(newOptions)));
-  }, [value, options]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    ref: selectRef,
-    style: {
-      width: '100%'
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Flex.default, {
-      direction: "column",
-      style: {
-        width: '100%'
-      },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles2.SelectContainer, {
-        "data-disabled": rest.disabled,
-        "data-variant": variant,
-        "data-label-in-top": !!(selectedOptions !== null && selectedOptions !== void 0 && selectedOptions[0]) || !!placeholder,
-        alert: alert,
-        tabIndex: rest.disabled ? -1 : 0,
-        onClick: function onClick() {
-          return setIsOpenOptions(!isOpenOptions);
-        },
-        className: rest.className,
-        style: rest.style,
-        ref: containerRef,
-        children: [label && variant !== 'unstyled' && /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
-          title: label,
-          children: label
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Flex.default, {
-          spacing: "0.5rem",
-          wrap: "wrap",
-          style: {
-            paddingBlock: '0.5rem'
-          },
-          children: selectedOptions !== null && selectedOptions !== void 0 && selectedOptions[0] ? selectedOptions.map(function (option, index) {
-            return typeof renderOptions === 'function' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectedOptionsWithCustomComponent, {
-              option: option
-            }, "custom-option-selected-".concat(index)) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles2.SelectedOptionSpan, {
-              hasSelectedOption: true,
-              children: [option.label, selectedOptions.length > 1 && index < selectedOptions.length - 1 && ',']
-            }, index);
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.SelectedOptionSpan, {
-            title: "placeholder",
-            children: placeholder
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Flex.default, {
-          className: "select_container_icon",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
-            name: "chevron-down"
-          })
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactPortal.ReactPortal, {
-        wrapperId: "portal-root",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.OptionsContainer, {
-          ref: optionsModalRef,
-          open: isOpenOptions,
-          style: {
-            maxWidth: "".concat((_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.getBoundingClientRect().width, "px"),
-            left: positionsSelect.left,
-            top: positionsSelect.top
-          },
-          children: _react.Children.map(children, function (child) {
-            var _child$type, _child$type2;
-            var childTypeName = (child === null || child === void 0 ? void 0 : (_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.name) || (child === null || child === void 0 ? void 0 : (_child$type2 = child.type) === null || _child$type2 === void 0 ? void 0 : _child$type2.displayName);
-            var isSelectItemElement = childTypeName === 'SelectItem';
-            if (! /*#__PURE__*/(0, _react.isValidElement)(child) || !isSelectItemElement) return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-              children: child
-            });
-            var childElement = child;
-            var isSelectedOption = selectedOptions.find(function (option) {
-              var _childElement$props;
-              return option.value === ((_childElement$props = childElement.props) === null || _childElement$props === void 0 ? void 0 : _childElement$props.value);
-            });
-            var className = (0, _classnames.default)('select-item', {
-              selected: isSelectedOption
-            });
-            return /*#__PURE__*/(0, _react.cloneElement)(childElement, {
-              onClick: function onClick(event) {
-                if (event.currentTarget.classList.contains('select-item')) {
-                  changeMultipleOption(childElement.props.value);
-                }
-              },
-              className: className
-            });
-          })
-        })
-      }), !!helperText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.HelperText, {
-        alert: alert,
-        children: helperText
-      })]
-    })
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.NewMultipleSelect=NewMultipleSelect;var _react=require("react"),_classnames=_interopRequireDefault(require("classnames")),_Flex=_interopRequireDefault(require("../../Flex")),_Icon=_interopRequireDefault(require("../../Icon")),_ReactPortal=require("../../ReactPortal"),_styles=require("../components/OptionsSelect/styles"),_useReposition=require("../../../shared/hooks/useReposition"),_useOnClickOutside=require("../../../shared/hooks/useOnClickOutside"),_styles2=require("../styles"),_SelectItem=require("../components/SelectItem"),_jsxRuntime=require("react/jsx-runtime"),_excluded=["label","placeholder","alert","helperText","variant","children","value","onClose","onOpen","renderOptions","onChange"];function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _toConsumableArray(arr){return _arrayWithoutHoles(arr)||_iterableToArray(arr)||_unsupportedIterableToArray(arr)||_nonIterableSpread()}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _iterableToArray(iter){if("undefined"!=typeof Symbol&&null!=iter[Symbol.iterator]||null!=iter["@@iterator"])return Array.from(iter)}function _arrayWithoutHoles(arr){if(Array.isArray(arr))return _arrayLikeToArray(arr)}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);return"Object"===n&&o.constructor&&(n=o.constructor.name),"Map"===n||"Set"===n?Array.from(o):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?_arrayLikeToArray(o,minLen):void 0}}function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}function _objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=_objectWithoutPropertiesLoose(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],0<=excluded.indexOf(key)||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}function _objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],0<=excluded.indexOf(key)||(target[key]=source[key]);return target}function NewMultipleSelect(_ref){function changeMultipleOption(valueOption){if(void 0===valueOption)return setSelectedOptions([]),void setIsOpenOptions(!1);var findOption=selectedOptions.find(function(option){return option.value===valueOption});if(findOption)removeOption(valueOption);else{var newOption=options.find(function(option){return option.value===valueOption});newOption&&setSelectedOptions([].concat(_toConsumableArray(selectedOptions),[newOption])),null===onChange||void 0===onChange?void 0:onChange([].concat(_toConsumableArray(multipleSelectValues),[valueOption]))}}function removeOption(optionToRemove){var newSelectedOptions=null===selectedOptions||void 0===selectedOptions?void 0:selectedOptions.filter(function(option){return option.value!==optionToRemove}),newSelectedValues=newSelectedOptions.map(function(option){return option.value});setSelectedOptions(newSelectedOptions),null===onChange||void 0===onChange?void 0:onChange(newSelectedValues)}var _containerRef$current,_ref$label=_ref.label,label=void 0===_ref$label?"":_ref$label,_ref$placeholder=_ref.placeholder,placeholder=void 0===_ref$placeholder?"":_ref$placeholder,alert=_ref.alert,helperText=_ref.helperText,variant=_ref.variant,children=_ref.children,value=_ref.value,onClose=_ref.onClose,onOpen=_ref.onOpen,renderOptions=_ref.renderOptions,onChange=_ref.onChange,rest=_objectWithoutProperties(_ref,_excluded),containerRef=(0,_react.useRef)(null),selectRef=(0,_react.useRef)(null),_useState=(0,_react.useState)(!1),_useState2=_slicedToArray(_useState,2),isOpenOptions=_useState2[0],setIsOpenOptions=_useState2[1],_useState3=(0,_react.useState)([]),_useState4=_slicedToArray(_useState3,2),selectedOptions=_useState4[0],setSelectedOptions=_useState4[1],multipleSelectValues=selectedOptions.map(function(option){return option.value}),optionsModalRef=(0,_react.useRef)(null),_useState5=(0,_react.useState)([]),_useState6=_slicedToArray(_useState5,2),options=_useState6[0],setOptions=_useState6[1];(0,_react.useEffect)(function(){var _optionsModalRef$curr,childs=null===(_optionsModalRef$curr=optionsModalRef.current)||void 0===_optionsModalRef$curr?void 0:_optionsModalRef$curr.childNodes,newOptions=[];_react.Children.forEach(children,function(child,index){var _childs$index,_childs$index$classLi;if(null!==childs&&void 0!==childs&&null!==(_childs$index=childs[index])&&void 0!==_childs$index&&null!==(_childs$index$classLi=_childs$index.classList)&&void 0!==_childs$index$classLi&&_childs$index$classLi.contains("select-item")){var _child$props,_childs$index2;newOptions.push({value:null===child||void 0===child||null===(_child$props=child.props)||void 0===_child$props?void 0:_child$props.value,label:null===childs||void 0===childs||null===(_childs$index2=childs[index])||void 0===_childs$index2?void 0:_childs$index2.innerText})}}),setOptions(newOptions)},[children,optionsModalRef.current]),(0,_react.useEffect)(function(){function handler(){setIsOpenOptions(!1)}if(isOpenOptions){var _document;null===onOpen||void 0===onOpen?void 0:onOpen(),null===(_document=document)||void 0===_document?void 0:_document.addEventListener("scroll",handler)}else{var _document2;null===onClose||void 0===onClose?void 0:onClose(),null===(_document2=document)||void 0===_document2?void 0:_document2.removeEventListener("scroll",handler)}return function(){var _document3;return null===(_document3=document)||void 0===_document3?void 0:_document3.removeEventListener("scroll",handler)}},[isOpenOptions]),(0,_useOnClickOutside.useOnClickOutside)([containerRef,optionsModalRef],function(){isOpenOptions&&setIsOpenOptions(!1)});var positionsSelect=(0,_useReposition.useReposition)({containerRef:optionsModalRef,triggerRef:selectRef},[children]),SelectedOptionsWithCustomComponent=function(_ref2){var option=_ref2.option;return/*#__PURE__*/(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:null===renderOptions||void 0===renderOptions?void 0:renderOptions(option,function(){return removeOption(option.value)})})};return(0,_react.useEffect)(function(){var newOptions=options.filter(function(option){return null===value||void 0===value?void 0:value.includes(option.value)}),newSelectedOptions=selectedOptions.filter(function(selectedOption){return newOptions.every(function(newOption){return newOption.value!==selectedOption.value})});setSelectedOptions([].concat(_toConsumableArray(newSelectedOptions),_toConsumableArray(newOptions)))},[value,options]),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{ref:selectRef,style:{width:"100%"},children:/*#__PURE__*/(0,_jsxRuntime.jsxs)(_Flex.default,{direction:"column",style:{width:"100%"},children:[/*#__PURE__*/(0,_jsxRuntime.jsxs)(_styles2.SelectContainer,{"data-disabled":rest.disabled,"data-variant":variant,"data-label-in-top":!!(null!==selectedOptions&&void 0!==selectedOptions&&selectedOptions[0])||!!placeholder,alert:alert,tabIndex:rest.disabled?-1:0,onClick:function onClick(){return setIsOpenOptions(!isOpenOptions)},className:rest.className,style:rest.style,ref:containerRef,children:[label&&"unstyled"!==variant&&/*#__PURE__*/(0,_jsxRuntime.jsx)("label",{title:label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsx)(_Flex.default,{spacing:"0.5rem",wrap:"wrap",style:{paddingBlock:"0.5rem"},children:null!==selectedOptions&&void 0!==selectedOptions&&selectedOptions[0]?selectedOptions.map(function(option,index){return"function"==typeof renderOptions?/*#__PURE__*/(0,_jsxRuntime.jsx)(SelectedOptionsWithCustomComponent,{option:option},"custom-option-selected-".concat(index)):/*#__PURE__*/(0,_jsxRuntime.jsxs)(_styles2.SelectedOptionSpan,{hasSelectedOption:!0,children:[option.label,1<selectedOptions.length&&index<selectedOptions.length-1&&","]},index)}):/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles2.SelectedOptionSpan,{title:"placeholder",children:placeholder})}),/*#__PURE__*/(0,_jsxRuntime.jsx)(_Flex.default,{className:"select_container_icon",children:/*#__PURE__*/(0,_jsxRuntime.jsx)(_Icon.default,{name:"chevron-down"})})]}),/*#__PURE__*/(0,_jsxRuntime.jsx)(_ReactPortal.ReactPortal,{wrapperId:"portal-root",children:/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles.OptionsContainer,{ref:optionsModalRef,open:isOpenOptions,style:{maxWidth:"".concat(null===(_containerRef$current=containerRef.current)||void 0===_containerRef$current?void 0:_containerRef$current.getBoundingClientRect().width,"px"),left:positionsSelect.left,top:positionsSelect.top},children:_react.Children.map(children,function(child){var isSelectItemElement=(null===child||void 0===child?void 0:child.type)===_SelectItem.SelectItem;if(!/*#__PURE__*/(0,_react.isValidElement)(child)||!isSelectItemElement)return/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{children:child});var childElement=child,isSelectedOption=selectedOptions.find(function(option){var _childElement$props;return option.value===(null===(_childElement$props=childElement.props)||void 0===_childElement$props?void 0:_childElement$props.value)}),className=(0,_classnames.default)("select-item",{selected:isSelectedOption});return/*#__PURE__*/(0,_react.cloneElement)(childElement,{onClick:function onClick(event){event.currentTarget.classList.contains("select-item")&&changeMultipleOption(childElement.props.value)},className:className})})})}),!!helperText&&/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles2.HelperText,{alert:alert,children:helperText})]})})}

package/dist/components/NewSelect/newSelect.test.js

@@ -1,108 +1 @@
-"use strict";
-
-var _react = require("@testing-library/react");
-var _ = require(".");
-var _SelectItem = require("./components/SelectItem");
-var _testUtils = require("../../shared/tests/test-utils");
-var _jsxRuntime = require("react/jsx-runtime");
-var optionsSelect = [{
-  label: 'Opção 1',
-  value: 'option1'
-}, {
-  label: 'Opção 2',
-  value: 'option2'
-}];
-describe('Select', function () {
-  test('Change option', function () {
-    var handleClick = jest.fn();
-    var _render = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.NewSelect, {
-        value: "option1",
-        onChange: handleClick,
-        children: optionsSelect.map(function (option) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectItem.SelectItem, {
-            value: option.value,
-            children: option.label
-          }, option.value);
-        })
-      })),
-      getByRole = _render.getByRole,
-      getByTestId = _render.getByTestId;
-    var button = getByRole('button', {
-      name: /opção 1/i
-    });
-    _react.fireEvent.click(button);
-    var spanOfSelectedOption = getByTestId('span-selected-option');
-    var textOfSpan = spanOfSelectedOption.textContent;
-    expect(textOfSpan).toEqual('Opção 1');
-    expect(handleClick).toHaveBeenCalledTimes(1);
-  });
-  test('Default value', function () {
-    var handleClick = jest.fn();
-    var _render2 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.NewSelect, {
-        value: "option1",
-        onChange: handleClick,
-        children: optionsSelect.map(function (option) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectItem.SelectItem, {
-            value: option.value,
-            children: option.label
-          }, option.value);
-        })
-      })),
-      getByTestId = _render2.getByTestId;
-    var spanOfSelectedOption = getByTestId('span-selected-option');
-    var textOfSpan = spanOfSelectedOption.textContent;
-    expect(textOfSpan).toEqual('Opção 1');
-  });
-});
-describe('MultipleSelect', function () {
-  test('Change option ', function () {
-    var _containerOfMultipleO;
-    var handleClick = jest.fn();
-    var _render3 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.NewSelect, {
-        value: ['option1'],
-        multiple: true,
-        onChange: handleClick,
-        children: optionsSelect.map(function (option) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectItem.SelectItem, {
-            value: option.value,
-            children: option.label
-          }, option.value);
-        })
-      })),
-      getByTestId = _render3.getByTestId,
-      getByRole = _render3.getByRole;
-    var buttonFirstOption = getByRole('button', {
-      name: /opção 1/i
-    });
-    var buttonSecondOption = getByRole('button', {
-      name: /opção 2/i
-    });
-    _react.fireEvent.click(buttonSecondOption);
-    expect(handleClick).toBeCalled();
-    _react.fireEvent.click(buttonFirstOption);
-    expect(handleClick).toBeCalled();
-    var containerOfMultipleOptions = getByTestId('container-multiple-options');
-    var firstOptionText = (_containerOfMultipleO = containerOfMultipleOptions.children[0]) === null || _containerOfMultipleO === void 0 ? void 0 : _containerOfMultipleO.textContent;
-    expect(firstOptionText).toEqual('Opção 1');
-  });
-  test('default value', function () {
-    var handleClick = jest.fn();
-    var _render4 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.NewSelect, {
-        value: ['option1', 'option2'],
-        multiple: true,
-        onChange: handleClick,
-        children: optionsSelect.map(function (option) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectItem.SelectItem, {
-            value: option.value,
-            children: option.label
-          }, option.value);
-        })
-      })),
-      getByTestId = _render4.getByTestId;
-    var containerOfMultipleOptions = getByTestId('container-multiple-options');
-    var firstOptionText = containerOfMultipleOptions.children[0].textContent;
-    var secondOptionText = containerOfMultipleOptions.children[1].textContent;
-    expect(firstOptionText).toEqual('Opção 1,');
-    expect(secondOptionText).toEqual('Opção 2');
-  });
-});
+"use strict";var _react=require("@testing-library/react"),_=require("."),_SelectItem=require("./components/SelectItem"),_testUtils=require("../../shared/tests/test-utils"),_jsxRuntime=require("react/jsx-runtime"),optionsSelect=[{label:"Op\xE7\xE3o 1",value:"option1"},{label:"Op\xE7\xE3o 2",value:"option2"}];describe("Select",function(){test("Change option",function(){var handleClick=jest.fn(),_render=(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.NewSelect,{value:"option1",onChange:handleClick,children:optionsSelect.map(function(option){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_SelectItem.SelectItem,{value:option.value,children:option.label},option.value)})})),getByRole=_render.getByRole,getByTestId=_render.getByTestId,button=getByRole("button",{name:/opção 1/i});_react.fireEvent.click(button);var spanOfSelectedOption=getByTestId("span-selected-option"),textOfSpan=spanOfSelectedOption.textContent;expect(textOfSpan).toEqual("Op\xE7\xE3o 1"),expect(handleClick).toHaveBeenCalledTimes(1)}),test("Default value",function(){var handleClick=jest.fn(),_render2=(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.NewSelect,{value:"option1",onChange:handleClick,children:optionsSelect.map(function(option){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_SelectItem.SelectItem,{value:option.value,children:option.label},option.value)})})),getByTestId=_render2.getByTestId,spanOfSelectedOption=getByTestId("span-selected-option"),textOfSpan=spanOfSelectedOption.textContent;expect(textOfSpan).toEqual("Op\xE7\xE3o 1")})}),describe("MultipleSelect",function(){test("Change option ",function(){var _containerOfMultipleO,handleClick=jest.fn(),_render3=(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.NewSelect,{value:["option1"],multiple:!0,onChange:handleClick,children:optionsSelect.map(function(option){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_SelectItem.SelectItem,{value:option.value,children:option.label},option.value)})})),getByTestId=_render3.getByTestId,getByRole=_render3.getByRole,buttonFirstOption=getByRole("button",{name:/opção 1/i}),buttonSecondOption=getByRole("button",{name:/opção 2/i});_react.fireEvent.click(buttonSecondOption),expect(handleClick).toBeCalled(),_react.fireEvent.click(buttonFirstOption),expect(handleClick).toBeCalled();var containerOfMultipleOptions=getByTestId("container-multiple-options"),firstOptionText=null===(_containerOfMultipleO=containerOfMultipleOptions.children[0])||void 0===_containerOfMultipleO?void 0:_containerOfMultipleO.textContent;expect(firstOptionText).toEqual("Op\xE7\xE3o 1")}),test("default value",function(){var handleClick=jest.fn(),_render4=(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.NewSelect,{value:["option1","option2"],multiple:!0,onChange:handleClick,children:optionsSelect.map(function(option){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_SelectItem.SelectItem,{value:option.value,children:option.label},option.value)})})),getByTestId=_render4.getByTestId,containerOfMultipleOptions=getByTestId("container-multiple-options"),firstOptionText=containerOfMultipleOptions.children[0].textContent,secondOptionText=containerOfMultipleOptions.children[1].textContent;expect(firstOptionText).toEqual("Op\xE7\xE3o 1,"),expect(secondOptionText).toEqual("Op\xE7\xE3o 2")})});

package/dist/components/NewSelect/single/index.js

@@ -1,183 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.NewSingleSelect = NewSingleSelect;
-var _react = require("react");
-var _Flex = _interopRequireDefault(require("../../Flex"));
-var _Icon = _interopRequireDefault(require("../../Icon"));
-var _ReactPortal = require("../../ReactPortal");
-var _SelectItem = require("../components/SelectItem");
-var _useReposition = require("../../../shared/hooks/useReposition");
-var _useOnClickOutside = require("../../../shared/hooks/useOnClickOutside");
-var _styles = require("../components/OptionsSelect/styles");
-var _styles2 = require("../styles");
-var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["label", "placeholder", "alert", "helperText", "variant", "children", "value", "onClose", "onOpen", "onChange", "renderOptions"];
-/* eslint-disable no-console */
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function NewSingleSelect(_ref) {
-  var _containerRef$current;
-  var _ref$label = _ref.label,
-    label = _ref$label === void 0 ? '' : _ref$label,
-    _ref$placeholder = _ref.placeholder,
-    placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
-    alert = _ref.alert,
-    helperText = _ref.helperText,
-    variant = _ref.variant,
-    children = _ref.children,
-    value = _ref.value,
-    onClose = _ref.onClose,
-    onOpen = _ref.onOpen,
-    onChange = _ref.onChange,
-    renderOptions = _ref.renderOptions,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var containerRef = (0, _react.useRef)(null);
-  var selectRef = (0, _react.useRef)(null);
-  var _useState = (0, _react.useState)(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isOpenOptions = _useState2[0],
-    setIsOpenOptions = _useState2[1];
-  var _useState3 = (0, _react.useState)(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedOption = _useState4[0],
-    setSelectedOption = _useState4[1];
-  var optionsModalRef = (0, _react.useRef)(null);
-  var _useState5 = (0, _react.useState)([]),
-    _useState6 = _slicedToArray(_useState5, 2),
-    options = _useState6[0],
-    setOptions = _useState6[1];
-  var findOption = options.find(function (option) {
-    return option.value === selectedOption;
-  });
-  var isFalseOptions = (findOption === null || findOption === void 0 ? void 0 : findOption.value) === false;
-  var textPlaceholder = findOption !== null && findOption !== void 0 && findOption.value || isFalseOptions ? findOption === null || findOption === void 0 ? void 0 : findOption.label : placeholder;
-  (0, _react.useEffect)(function () {
-    var _options$, _optionsModalRef$curr;
-    if (options !== null && options !== void 0 && (_options$ = options[0]) !== null && _options$ !== void 0 && _options$.value) return;
-    var childs = (_optionsModalRef$curr = optionsModalRef.current) === null || _optionsModalRef$curr === void 0 ? void 0 : _optionsModalRef$curr.childNodes;
-    var newOptions = [];
-    _react.Children.forEach(children, function (child, index) {
-      var _childs$index, _childs$index$classLi;
-      if (childs !== null && childs !== void 0 && (_childs$index = childs[index]) !== null && _childs$index !== void 0 && (_childs$index$classLi = _childs$index.classList) !== null && _childs$index$classLi !== void 0 && _childs$index$classLi.contains('select-item')) {
-        var _child$props, _childs$index2;
-        newOptions.push({
-          value: child === null || child === void 0 ? void 0 : (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.value,
-          label: childs === null || childs === void 0 ? void 0 : (_childs$index2 = childs[index]) === null || _childs$index2 === void 0 ? void 0 : _childs$index2.innerText
-        });
-      }
-    });
-    setOptions(newOptions);
-  }, [children, optionsModalRef.current, containerRef.current]);
-  (0, _react.useEffect)(function () {
-    function handler() {
-      setIsOpenOptions(false);
-    }
-    if (isOpenOptions) {
-      var _document;
-      onOpen === null || onOpen === void 0 ? void 0 : onOpen();
-      (_document = document) === null || _document === void 0 ? void 0 : _document.addEventListener('scroll', handler);
-    } else {
-      var _document2;
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-      (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.removeEventListener('scroll', handler);
-    }
-    return function () {
-      var _document3;
-      return (_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.removeEventListener('scroll', handler);
-    };
-  }, [isOpenOptions]);
-  (0, _useOnClickOutside.useOnClickOutside)([containerRef, optionsModalRef], function () {
-    if (isOpenOptions) {
-      setIsOpenOptions(false);
-    }
-  });
-  var positionsSelect = (0, _useReposition.useReposition)({
-    containerRef: optionsModalRef,
-    triggerRef: selectRef
-  }, [children]);
-  var SelectedOptionsWithCustomComponent = function SelectedOptionsWithCustomComponent() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: renderOptions === null || renderOptions === void 0 ? void 0 : renderOptions(selectedOption)
-    });
-  };
-  (0, _react.useEffect)(function () {
-    setSelectedOption(value);
-  }, [value]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    ref: selectRef,
-    style: {
-      width: '100%'
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Flex.default, {
-      direction: "column",
-      style: {
-        width: '100%'
-      },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles2.SelectContainer, {
-        "data-disabled": rest.disabled,
-        "data-variant": variant,
-        "data-label-in-top": !!textPlaceholder || !!placeholder,
-        alert: alert,
-        tabIndex: rest.disabled ? -1 : 0,
-        onClick: function onClick() {
-          return setIsOpenOptions(!isOpenOptions);
-        },
-        className: rest.className,
-        style: rest.style,
-        ref: containerRef,
-        children: [label && variant !== 'unstyled' && /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
-          children: label
-        }), typeof renderOptions === 'function' && selectedOption ? /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectedOptionsWithCustomComponent, {}, "custom-option-selected-".concat(textPlaceholder)) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.SelectedOptionSpan, {
-          hasSelectedOption: !!selectedOption || isFalseOptions,
-          children: textPlaceholder
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Flex.default, {
-          className: "select_container_icon",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
-            name: "chevron-down",
-            color: "neutral.neutral5"
-          })
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactPortal.ReactPortal, {
-        wrapperId: "portal-root",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.OptionsContainer, {
-          ref: optionsModalRef,
-          open: isOpenOptions,
-          style: {
-            maxWidth: "".concat((_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.getBoundingClientRect().width, "px"),
-            left: positionsSelect.left,
-            top: positionsSelect.top
-          },
-          children: _react.Children.map(children, function (child) {
-            var isSelectItemElement = child.type === _SelectItem.SelectItem;
-            if (! /*#__PURE__*/(0, _react.isValidElement)(child) || !isSelectItemElement) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-              children: child
-            });
-            var childElement = child;
-            return /*#__PURE__*/(0, _react.cloneElement)(childElement, {
-              onClick: function onClick(event) {
-                if (event.currentTarget.classList.contains('select-item')) {
-                  setIsOpenOptions(false);
-                  setSelectedOption(childElement.props.value);
-                  onChange === null || onChange === void 0 ? void 0 : onChange(childElement.props.value);
-                }
-              }
-            });
-          })
-        })
-      }), !!helperText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.HelperText, {
-        alert: alert,
-        children: helperText
-      })]
-    })
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.NewSingleSelect=NewSingleSelect;var _react=require("react"),_Flex=_interopRequireDefault(require("../../Flex")),_Icon=_interopRequireDefault(require("../../Icon")),_ReactPortal=require("../../ReactPortal"),_SelectItem=require("../components/SelectItem"),_useReposition=require("../../../shared/hooks/useReposition"),_useOnClickOutside=require("../../../shared/hooks/useOnClickOutside"),_styles=require("../components/OptionsSelect/styles"),_styles2=require("../styles"),_jsxRuntime=require("react/jsx-runtime"),_excluded=["label","placeholder","alert","helperText","variant","children","value","onClose","onOpen","onChange","renderOptions"];/* eslint-disable no-console */function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);return"Object"===n&&o.constructor&&(n=o.constructor.name),"Map"===n||"Set"===n?Array.from(o):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?_arrayLikeToArray(o,minLen):void 0}}function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}function _objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=_objectWithoutPropertiesLoose(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],0<=excluded.indexOf(key)||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}function _objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],0<=excluded.indexOf(key)||(target[key]=source[key]);return target}function NewSingleSelect(_ref){var _containerRef$current,_ref$label=_ref.label,label=void 0===_ref$label?"":_ref$label,_ref$placeholder=_ref.placeholder,placeholder=void 0===_ref$placeholder?"":_ref$placeholder,alert=_ref.alert,helperText=_ref.helperText,variant=_ref.variant,children=_ref.children,value=_ref.value,onClose=_ref.onClose,onOpen=_ref.onOpen,onChange=_ref.onChange,renderOptions=_ref.renderOptions,rest=_objectWithoutProperties(_ref,_excluded),containerRef=(0,_react.useRef)(null),selectRef=(0,_react.useRef)(null),_useState=(0,_react.useState)(!1),_useState2=_slicedToArray(_useState,2),isOpenOptions=_useState2[0],setIsOpenOptions=_useState2[1],_useState3=(0,_react.useState)(),_useState4=_slicedToArray(_useState3,2),selectedOption=_useState4[0],setSelectedOption=_useState4[1],optionsModalRef=(0,_react.useRef)(null),_useState5=(0,_react.useState)([]),_useState6=_slicedToArray(_useState5,2),options=_useState6[0],setOptions=_useState6[1],findOption=options.find(function(option){return option.value===selectedOption}),isFalseOptions=!1===(null===findOption||void 0===findOption?void 0:findOption.value),textPlaceholder=null!==findOption&&void 0!==findOption&&findOption.value||isFalseOptions?null===findOption||void 0===findOption?void 0:findOption.label:placeholder;(0,_react.useEffect)(function(){var _options$,_optionsModalRef$curr;if(!(null!==options&&void 0!==options&&null!==(_options$=options[0])&&void 0!==_options$&&_options$.value)){var childs=null===(_optionsModalRef$curr=optionsModalRef.current)||void 0===_optionsModalRef$curr?void 0:_optionsModalRef$curr.childNodes,newOptions=[];_react.Children.forEach(children,function(child,index){var _childs$index,_childs$index$classLi;if(null!==childs&&void 0!==childs&&null!==(_childs$index=childs[index])&&void 0!==_childs$index&&null!==(_childs$index$classLi=_childs$index.classList)&&void 0!==_childs$index$classLi&&_childs$index$classLi.contains("select-item")){var _child$props,_childs$index2;newOptions.push({value:null===child||void 0===child||null===(_child$props=child.props)||void 0===_child$props?void 0:_child$props.value,label:null===childs||void 0===childs||null===(_childs$index2=childs[index])||void 0===_childs$index2?void 0:_childs$index2.innerText})}}),setOptions(newOptions)}},[children,optionsModalRef.current,containerRef.current]),(0,_react.useEffect)(function(){function handler(){setIsOpenOptions(!1)}if(isOpenOptions){var _document;null===onOpen||void 0===onOpen?void 0:onOpen(),null===(_document=document)||void 0===_document?void 0:_document.addEventListener("scroll",handler)}else{var _document2;null===onClose||void 0===onClose?void 0:onClose(),null===(_document2=document)||void 0===_document2?void 0:_document2.removeEventListener("scroll",handler)}return function(){var _document3;return null===(_document3=document)||void 0===_document3?void 0:_document3.removeEventListener("scroll",handler)}},[isOpenOptions]),(0,_useOnClickOutside.useOnClickOutside)([containerRef,optionsModalRef],function(){isOpenOptions&&setIsOpenOptions(!1)});var positionsSelect=(0,_useReposition.useReposition)({containerRef:optionsModalRef,triggerRef:selectRef},[children]);return(0,_react.useEffect)(function(){setSelectedOption(value)},[value]),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{ref:selectRef,style:{width:"100%"},children:/*#__PURE__*/(0,_jsxRuntime.jsxs)(_Flex.default,{direction:"column",style:{width:"100%"},children:[/*#__PURE__*/(0,_jsxRuntime.jsxs)(_styles2.SelectContainer,{"data-disabled":rest.disabled,"data-variant":variant,"data-label-in-top":!!textPlaceholder||!!placeholder,alert:alert,tabIndex:rest.disabled?-1:0,onClick:function onClick(){return setIsOpenOptions(!isOpenOptions)},className:rest.className,style:rest.style,ref:containerRef,children:[label&&"unstyled"!==variant&&/*#__PURE__*/(0,_jsxRuntime.jsx)("label",{children:label}),"function"==typeof renderOptions&&selectedOption?/*#__PURE__*/(0,_jsxRuntime.jsx)(function SelectedOptionsWithCustomComponent(){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:null===renderOptions||void 0===renderOptions?void 0:renderOptions(selectedOption)})},{},"custom-option-selected-".concat(textPlaceholder)):/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles2.SelectedOptionSpan,{hasSelectedOption:!!selectedOption||isFalseOptions,children:textPlaceholder}),/*#__PURE__*/(0,_jsxRuntime.jsx)(_Flex.default,{className:"select_container_icon",children:/*#__PURE__*/(0,_jsxRuntime.jsx)(_Icon.default,{name:"chevron-down",color:"neutral.neutral5"})})]}),/*#__PURE__*/(0,_jsxRuntime.jsx)(_ReactPortal.ReactPortal,{wrapperId:"portal-root",children:/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles.OptionsContainer,{ref:optionsModalRef,open:isOpenOptions,style:{maxWidth:"".concat(null===(_containerRef$current=containerRef.current)||void 0===_containerRef$current?void 0:_containerRef$current.getBoundingClientRect().width,"px"),left:positionsSelect.left,top:positionsSelect.top},children:_react.Children.map(children,function(child){var isSelectItemElement=(null===child||void 0===child?void 0:child.type)===_SelectItem.SelectItem;if(!/*#__PURE__*/(0,_react.isValidElement)(child)||!isSelectItemElement)return/*#__PURE__*/(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:child});var childElement=child;return/*#__PURE__*/(0,_react.cloneElement)(childElement,{onClick:function onClick(event){event.currentTarget.classList.contains("select-item")&&(setIsOpenOptions(!1),setSelectedOption(childElement.props.value),null===onChange||void 0===onChange?void 0:onChange(childElement.props.value))}})})})}),!!helperText&&/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles2.HelperText,{alert:alert,children:helperText})]})})}