@bigbinary/neetoui 5.1.9 → 5.1.11

package/formik.cjs.js

@@ -9900,10 +9900,10 @@ visualElement({
     },
 });
 
-var _excluded$s = ["children"];
+var _excluded$t = ["children"];
 var Portal$1 = function Portal(_ref, ref) {
   var children = _ref.children,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$s);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$t);
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$2({
     "data-testid": "neeto-backdrop",
     ref: ref
@@ -13911,7 +13911,7 @@ var index$1 = /*#__PURE__*/forwardRef( /*#__PURE__*/TippyGenerator(tippy));
 
 var ARROW = "<svg width='12' height='6' viewBox='0 0 10 5' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M10 5H0.926697L3.95208 1.63847C4.74227 0.760478 6.11722 0.754951 6.91445 1.62656L10 5Z' /></svg>";
 
-var _excluded$r = ["content", "children", "theme", "disabled", "position", "interactive", "hideAfter", "hideOnTargetExit"];
+var _excluded$s = ["content", "children", "theme", "disabled", "position", "interactive", "hideAfter", "hideOnTargetExit"];
 var Tooltip = function Tooltip(_ref) {
   var content = _ref.content,
     children = _ref.children,
@@ -13927,7 +13927,7 @@ var Tooltip = function Tooltip(_ref) {
     hideAfter = _ref$hideAfter === void 0 ? -1 : _ref$hideAfter,
     _ref$hideOnTargetExit = _ref.hideOnTargetExit,
     hideOnTargetExit = _ref$hideOnTargetExit === void 0 ? false : _ref$hideOnTargetExit,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$r);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$s);
   var _useState = React.useState(null),
     _useState2 = _slicedToArray$1(_useState, 2),
     instance = _useState2[0],
@@ -13970,7 +13970,7 @@ var Tooltip = function Tooltip(_ref) {
   }, localProps, otherProps), /*#__PURE__*/React__default["default"].isValidElement(children) ? children : /*#__PURE__*/React__default["default"].createElement("span", null, children));
 };
 
-var _excluded$q = ["icon", "iconPosition", "iconSize", "label", "loading", "onClick", "to", "type", "style", "fullWidth", "className", "disabled", "size", "href", "tooltipProps", "children"];
+var _excluded$r = ["icon", "iconPosition", "iconSize", "label", "loading", "onClick", "to", "type", "style", "fullWidth", "className", "disabled", "size", "href", "tooltipProps", "children"];
 var BUTTON_STYLES = {
   primary: "primary",
   secondary: "secondary",
@@ -13979,7 +13979,7 @@ var BUTTON_STYLES = {
   text: "text",
   link: "link"
 };
-var SIZES$5 = {
+var SIZES$6 = {
   small: "small",
   medium: "medium",
   large: "large"
@@ -14019,13 +14019,13 @@ var Button = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, r
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? SIZES$5.medium : _ref$size,
+    size = _ref$size === void 0 ? SIZES$6.medium : _ref$size,
     _ref$href = _ref.href,
     href = _ref$href === void 0 ? "" : _ref$href,
     _ref$tooltipProps = _ref.tooltipProps,
     tooltipProps = _ref$tooltipProps === void 0 ? null : _ref$tooltipProps,
     children = _ref.children,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$q);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$r);
   var Parent, elementSpecificProps;
   var renderLabel = label || children;
   if (to) {
@@ -14067,8 +14067,8 @@ var Button = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, r
       "neeto-ui-btn--style-danger-text": style === BUTTON_STYLES.danger_text,
       "neeto-ui-btn--style-text": style === BUTTON_STYLES.text,
       "neeto-ui-btn--style-link": style === BUTTON_STYLES.link,
-      "neeto-ui-btn--size-medium": size === SIZES$5.medium,
-      "neeto-ui-btn--size-large": size === SIZES$5.large,
+      "neeto-ui-btn--size-medium": size === SIZES$6.medium,
+      "neeto-ui-btn--size-large": size === SIZES$6.large,
       "neeto-ui-btn--width-full": fullWidth,
       "neeto-ui-btn--icon-left": iconPosition === ICON_POSITIONS.left,
       "neeto-ui-btn--icon-only": !renderLabel,
@@ -14115,10 +14115,10 @@ var Button = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, r
 });
 Button.displayName = "Button";
 
-var _excluded$p = ["disabled"];
+var _excluded$q = ["disabled"];
 var FormikButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var disabled = _ref.disabled,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$p);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$q);
   var _useFormikContext = formik.useFormikContext(),
     handleSubmit = _useFormikContext.handleSubmit,
     isSubmitting = _useFormikContext.isSubmitting,
@@ -16734,7 +16734,7 @@ var Footer = function Footer(_ref) {
   }, children);
 };
 
-var _excluded$o = ["style", "weight", "lineHeight", "component", "children", "textTransform", "className"];
+var _excluded$p = ["style", "weight", "lineHeight", "component", "children", "textTransform", "className"];
 var FONT_WEIGHTS = {
   thin: "thin",
   extralight: "extralight",
@@ -16746,7 +16746,7 @@ var FONT_WEIGHTS = {
   extrabold: "extrabold",
   black: "black"
 };
-var STYLES$1 = {
+var STYLES$2 = {
   h1: "h1",
   h2: "h2",
   h3: "h3",
@@ -16822,22 +16822,22 @@ var Typography = /*#__PURE__*/React__default["default"].forwardRef(function (_re
     textTransform = _ref.textTransform,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$o);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$p);
   var Component = component ? COMPONENTS[component] : style ? DEFAULT_COMPONENTS[style] : "p";
   return /*#__PURE__*/React__default["default"].createElement(Component, _extends$2({
     ref: ref,
     className: classnames$1(_defineProperty$1({
       "neeto-ui-typography": true,
-      "neeto-ui-text-h1": style === STYLES$1.h1,
-      "neeto-ui-text-h2": style === STYLES$1.h2,
-      "neeto-ui-text-h3": style === STYLES$1.h3,
-      "neeto-ui-text-h4": style === STYLES$1.h4,
-      "neeto-ui-text-h5": style === STYLES$1.h5,
-      "neeto-ui-text-h6": style === STYLES$1.h6,
-      "neeto-ui-text-body1": style === STYLES$1.body1,
-      "neeto-ui-text-body2": style === STYLES$1.body2,
-      "neeto-ui-text-body3": style === STYLES$1.body3,
-      "neeto-ui-text-nano": style === STYLES$1.nano,
+      "neeto-ui-text-h1": style === STYLES$2.h1,
+      "neeto-ui-text-h2": style === STYLES$2.h2,
+      "neeto-ui-text-h3": style === STYLES$2.h3,
+      "neeto-ui-text-h4": style === STYLES$2.h4,
+      "neeto-ui-text-h5": style === STYLES$2.h5,
+      "neeto-ui-text-h6": style === STYLES$2.h6,
+      "neeto-ui-text-body1": style === STYLES$2.body1,
+      "neeto-ui-text-body2": style === STYLES$2.body2,
+      "neeto-ui-text-body3": style === STYLES$2.body3,
+      "neeto-ui-text-nano": style === STYLES$2.nano,
       "neeto-ui-text-transform-none": textTransform === TEXT_TRANSFORM.none,
       "neeto-ui-text-transform-capitalize": textTransform === TEXT_TRANSFORM.capitalize,
       "neeto-ui-text-transform-uppercase": textTransform === TEXT_TRANSFORM.uppercase,
@@ -16882,8 +16882,8 @@ var Header = function Header(_ref) {
   }, description)));
 };
 
-var _excluded$n = ["size", "isOpen", "onClose", "children", "finalFocusRef", "initialFocusRef", "className", "closeOnEsc", "closeButton", "backdropClassName", "blockScrollOnMount", "closeOnOutsideClick"];
-var SIZES$4 = {
+var _excluded$o = ["size", "isOpen", "onClose", "children", "finalFocusRef", "initialFocusRef", "className", "closeOnEsc", "closeButton", "backdropClassName", "blockScrollOnMount", "closeOnOutsideClick"];
+var SIZES$5 = {
   small: "small",
   medium: "medium",
   large: "large",
@@ -16891,7 +16891,7 @@ var SIZES$4 = {
 };
 var Modal = function Modal(_ref) {
   var _ref$size = _ref.size,
-    size = _ref$size === void 0 ? SIZES$4.medium : _ref$size,
+    size = _ref$size === void 0 ? SIZES$5.medium : _ref$size,
     _ref$isOpen = _ref.isOpen,
     isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
     _ref$onClose = _ref.onClose,
@@ -16911,7 +16911,7 @@ var Modal = function Modal(_ref) {
     blockScrollOnMount = _ref$blockScrollOnMou === void 0 ? true : _ref$blockScrollOnMou,
     _ref$closeOnOutsideCl = _ref.closeOnOutsideClick,
     closeOnOutsideClick = _ref$closeOnOutsideCl === void 0 ? true : _ref$closeOnOutsideCl,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$n);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$o);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray$1(_useState, 2),
     hasTransitionCompleted = _useState2[0],
@@ -16952,7 +16952,7 @@ var Modal = function Modal(_ref) {
     key: "modal-backdrop",
     ref: backdropRef,
     className: classnames$1("neeto-ui-modal__backdrop", {
-      "neeto-ui-modal__backdrop--fullscreen": size === SIZES$4.fullScreen
+      "neeto-ui-modal__backdrop--fullscreen": size === SIZES$5.fullScreen
     }, backdropClassName)
   }, /*#__PURE__*/React__default["default"].createElement("div", _extends$2({
     "aria-modal": true,
@@ -16960,10 +16960,10 @@ var Modal = function Modal(_ref) {
     ref: modalWrapper,
     role: "dialog",
     className: classnames$1("neeto-ui-modal__wrapper", _defineProperty$1({
-      "neeto-ui-modal__wrapper--small": size === SIZES$4.small,
-      "neeto-ui-modal__wrapper--medium": size === SIZES$4.medium,
-      "neeto-ui-modal__wrapper--large": size === SIZES$4.large,
-      "neeto-ui-modal__wrapper--fullscreen": size === SIZES$4.fullScreen
+      "neeto-ui-modal__wrapper--small": size === SIZES$5.small,
+      "neeto-ui-modal__wrapper--medium": size === SIZES$5.medium,
+      "neeto-ui-modal__wrapper--large": size === SIZES$5.large,
+      "neeto-ui-modal__wrapper--fullscreen": size === SIZES$5.fullScreen
     }, className, className))
   }, otherProps), closeButton && /*#__PURE__*/React__default["default"].createElement(Button, {
     "aria-label": "Close",
@@ -16981,7 +16981,7 @@ Modal.Header = Header;
 Modal.Body = Body;
 Modal.Footer = Footer;
 
-var SIZES$3 = {
+var SIZES$4 = {
   small: "small",
   medium: "medium",
   large: "large"
@@ -16992,7 +16992,7 @@ var FOCUSABLE_ELEMENTS = {
 };
 var Alert = function Alert(_ref) {
   var _ref$size = _ref.size,
-    size = _ref$size === void 0 ? SIZES$3.medium : _ref$size,
+    size = _ref$size === void 0 ? SIZES$4.medium : _ref$size,
     _ref$isOpen = _ref.isOpen,
     isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
     _ref$isSubmitting = _ref.isSubmitting,
@@ -17228,8 +17228,8 @@ function useId(idFromProps) {
   return id != null ? String(id) : undefined;
 }
 
-var _excluded$m = ["children", "className", "required", "helpIconProps"],
-  _excluded2 = ["onClick", "icon", "tooltipProps", "className"];
+var _excluded$n = ["children", "className", "required", "helpIconProps"],
+  _excluded2$1 = ["onClick", "icon", "tooltipProps", "className"];
 var Label = function Label(_ref) {
   var children = _ref.children,
     _ref$className = _ref.className,
@@ -17238,13 +17238,13 @@ var Label = function Label(_ref) {
     required = _ref$required === void 0 ? false : _ref$required,
     _ref$helpIconProps = _ref.helpIconProps,
     helpIconProps = _ref$helpIconProps === void 0 ? null : _ref$helpIconProps,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$m);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$n);
   var _ref2 = helpIconProps || {},
     onClick = _ref2.onClick,
     icon = _ref2.icon,
     tooltipProps = _ref2.tooltipProps,
     helpIconClassName = _ref2.className,
-    otherHelpIconProps = _objectWithoutProperties$1(_ref2, _excluded2);
+    otherHelpIconProps = _objectWithoutProperties$1(_ref2, _excluded2$1);
   var HelpIcon = icon || neetoIcons.Info;
   return /*#__PURE__*/React__default["default"].createElement("label", _extends$2({
     className: classnames$1("neeto-ui-label neeto-ui-flex neeto-ui-items-center", className)
@@ -17260,7 +17260,7 @@ var Label = function Label(_ref) {
   }, otherHelpIconProps)))));
 };
 
-var _excluded$l = ["label", "error", "className", "required", "labelProps", "children"];
+var _excluded$m = ["label", "error", "className", "required", "labelProps", "children"];
 var Checkbox$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$label = _ref.label,
     label = _ref$label === void 0 ? "" : _ref$label,
@@ -17272,7 +17272,7 @@ var Checkbox$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     required = _ref$required === void 0 ? false : _ref$required,
     labelProps = _ref.labelProps,
     children = _ref.children,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$l);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$m);
   var id = useId(otherProps.id);
   var errorId = "error_".concat(id);
   var renderLabel = label || children;
@@ -17300,10 +17300,10 @@ var Checkbox$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 });
 Checkbox$1.displayName = "Checkbox";
 
-var _excluded$k = ["name"];
+var _excluded$l = ["name"];
 var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var name = _ref.name,
-    rest = _objectWithoutProperties$1(_ref, _excluded$k);
+    rest = _objectWithoutProperties$1(_ref, _excluded$l);
   return /*#__PURE__*/React__default["default"].createElement(formik.Field, {
     name: name
   }, function (_ref2) {
@@ -17756,7 +17756,7 @@ var ScrollToErrorField = function ScrollToErrorField(_ref) {
   return null;
 };
 
-var _excluded$j = ["values", "validateForm", "setErrors", "setTouched"];
+var _excluded$k = ["values", "validateForm", "setErrors", "setTouched"];
 var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     formProps = _ref.formProps,
@@ -17768,7 +17768,7 @@ var FormWrapper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     validateForm = _useFormikContext.validateForm,
     setErrors = _useFormikContext.setErrors,
     setTouched = _useFormikContext.setTouched,
-    formikBag = _objectWithoutProperties$1(_useFormikContext, _excluded$j);
+    formikBag = _objectWithoutProperties$1(_useFormikContext, _excluded$k);
   var isFormDirty = formikBag.dirty,
     isSubmitting = formikBag.isSubmitting;
   var formRefForScrollToErrorField = React.useRef();
@@ -17891,8 +17891,8 @@ Form.propTypes = {
   scrollToErrorField: propTypes.exports.bool
 };
 
-var _excluded$i = ["size", "type", "label", "error", "suffix", "prefix", "disabled", "helpText", "className", "nakedInput", "contentSize", "required", "maxLength", "unlimitedChars", "labelProps", "rejectCharsRegex"];
-var SIZES$2 = {
+var _excluded$j = ["size", "type", "label", "error", "suffix", "prefix", "disabled", "helpText", "className", "nakedInput", "contentSize", "required", "maxLength", "unlimitedChars", "labelProps", "rejectCharsRegex"];
+var SIZES$3 = {
   small: "small",
   medium: "medium",
   large: "large"
@@ -17900,7 +17900,7 @@ var SIZES$2 = {
 var Input$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref2, _otherProps$value, _classnames;
   var _ref$size = _ref.size,
-    size = _ref$size === void 0 ? SIZES$2.medium : _ref$size,
+    size = _ref$size === void 0 ? SIZES$3.medium : _ref$size,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? "text" : _ref$type,
     _ref$label = _ref.label,
@@ -17928,7 +17928,7 @@ var Input$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     unlimitedChars = _ref$unlimitedChars === void 0 ? false : _ref$unlimitedChars,
     labelProps = _ref.labelProps,
     rejectCharsRegex = _ref.rejectCharsRegex,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded$i);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$j);
   var _useState = React.useState(otherProps.value),
     _useState2 = _slicedToArray$1(_useState, 2),
     valueInternal = _useState2[0],
@@ -18006,10 +18006,10 @@ var Input$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 });
 Input$1.displayName = "Input";
 
-var _excluded$h = ["name"];
+var _excluded$i = ["name"];
 var FormikInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var name = _ref.name,
-    rest = _objectWithoutProperties$1(_ref, _excluded$h);
+    rest = _objectWithoutProperties$1(_ref, _excluded$i);
   return /*#__PURE__*/React__default["default"].createElement(formik.Field, {
     name: name
   }, function (_ref2) {
@@ -21626,7 +21626,7 @@ var GroupHeading = function GroupHeading(props) {
   }, innerProps));
 };
 
-var _excluded$g = ["innerRef", "isDisabled", "isHidden", "inputClassName"];
+var _excluded$h = ["innerRef", "isDisabled", "isHidden", "inputClassName"];
 var inputCSS = function inputCSS(_ref) {
   var isDisabled = _ref.isDisabled,
     value = _ref.value,
@@ -21683,7 +21683,7 @@ var Input = function Input(props) {
     isDisabled = _cleanCommonProps.isDisabled,
     isHidden = _cleanCommonProps.isHidden,
     inputClassName = _cleanCommonProps.inputClassName,
-    innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded$g);
+    innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded$h);
   return jsx("div", {
     className: cx({
       'input-container': true
@@ -22506,10 +22506,10 @@ var createFilter = function createFilter(config) {
   };
 };
 
-var _excluded$f = ["innerRef"];
+var _excluded$g = ["innerRef"];
 function DummyInput(_ref) {
   var innerRef = _ref.innerRef,
-    props = _objectWithoutProperties(_ref, _excluded$f);
+    props = _objectWithoutProperties(_ref, _excluded$g);
   // Remove animation props not meant for HTML elements
   var filteredProps = removeProps(props, 'onExited', 'in', 'enter', 'exit', 'appear');
   return jsx("input", _extends({
@@ -24505,7 +24505,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
 }(React.Component);
 Select$1.defaultProps = defaultProps;
 
-var _excluded$e = ["defaultInputValue", "defaultMenuIsOpen", "defaultValue", "inputValue", "menuIsOpen", "onChange", "onInputChange", "onMenuClose", "onMenuOpen", "value"];
+var _excluded$f = ["defaultInputValue", "defaultMenuIsOpen", "defaultValue", "inputValue", "menuIsOpen", "onChange", "onInputChange", "onMenuClose", "onMenuOpen", "value"];
 function useStateManager(_ref) {
   var _ref$defaultInputValu = _ref.defaultInputValue,
     defaultInputValue = _ref$defaultInputValu === void 0 ? '' : _ref$defaultInputValu,
@@ -24520,7 +24520,7 @@ function useStateManager(_ref) {
     propsOnMenuClose = _ref.onMenuClose,
     propsOnMenuOpen = _ref.onMenuOpen,
     propsValue = _ref.value,
-    restSelectProps = _objectWithoutProperties(_ref, _excluded$e);
+    restSelectProps = _objectWithoutProperties(_ref, _excluded$f);
   var _useState = React.useState(propsInputValue !== undefined ? propsInputValue : defaultInputValue),
     _useState2 = _slicedToArray(_useState, 2),
     stateInputValue = _useState2[0],
@@ -24572,7 +24572,7 @@ function useStateManager(_ref) {
   });
 }
 
-var _excluded$d = ["allowCreateWhileLoading", "createOptionPosition", "formatCreateLabel", "isValidNewOption", "getNewOptionData", "onCreateOption", "options", "onChange"];
+var _excluded$e = ["allowCreateWhileLoading", "createOptionPosition", "formatCreateLabel", "isValidNewOption", "getNewOptionData", "onCreateOption", "options", "onChange"];
 var compareOption = function compareOption() {
   var inputValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
   var option = arguments.length > 1 ? arguments[1] : undefined;
@@ -24616,7 +24616,7 @@ function useCreatable(_ref) {
     _ref$options = _ref.options,
     propsOptions = _ref$options === void 0 ? [] : _ref$options,
     propsOnChange = _ref.onChange,
-    restSelectProps = _objectWithoutProperties(_ref, _excluded$d);
+    restSelectProps = _objectWithoutProperties(_ref, _excluded$e);
   var _restSelectProps$getO = restSelectProps.getOptionValue,
     getOptionValue$1$1 = _restSelectProps$getO === void 0 ? getOptionValue$1 : _restSelectProps$getO,
     _restSelectProps$getO2 = restSelectProps.getOptionLabel,
@@ -24668,6 +24668,10 @@ var CreatableSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, selectProps));
 });
 
+function _toArray(arr) {
+  return _arrayWithHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableRest$1();
+}
+
 var StateManagedSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var baseSelectProps = useStateManager(props);
   return /*#__PURE__*/React__namespace.createElement(Select$1, _extends({
@@ -24675,7 +24679,85 @@ var StateManagedSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, baseSelectProps));
 });
 
-var _excluded$c = ["children"];
+var _excluded$d = ["style", "indicatorStyle", "label", "icon", "className", "onClose", "disabled", "size", "type", "children"];
+var SIZES$2 = {
+  small: "small",
+  large: "large"
+};
+var TYPES = {
+  outline: "outline",
+  solid: "solid"
+};
+var STYLES$1 = {
+  primary: "primary",
+  secondary: "secondary",
+  info: "info",
+  success: "success",
+  warning: "warning",
+  danger: "danger"
+};
+var Tag = function Tag(_ref) {
+  var _ref$style = _ref.style,
+    style = _ref$style === void 0 ? STYLES$1.primary : _ref$style,
+    indicatorStyle = _ref.indicatorStyle,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? "" : _ref$label,
+    _ref$icon = _ref.icon,
+    icon = _ref$icon === void 0 ? null : _ref$icon,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    _ref$onClose = _ref.onClose,
+    onClose = _ref$onClose === void 0 ? null : _ref$onClose,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? SIZES$2.small : _ref$size,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? TYPES.outline : _ref$type,
+    children = _ref.children,
+    otherProps = _objectWithoutProperties$1(_ref, _excluded$d);
+  var Icon = typeof icon === "string" ? function () {
+    return /*#__PURE__*/React__default["default"].createElement("i", {
+      className: icon
+    });
+  } : icon || React.Fragment;
+  var renderLabel = label || children;
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends$2({
+    "data-testid": "tag-container",
+    className: classnames$1("neeto-ui-tag", {
+      "neeto-ui-tag--size-large": size === SIZES$2.large,
+      "neeto-ui-tag--size-small": size === SIZES$2.small,
+      "neeto-ui-tag--type-outline": type === TYPES.outline,
+      "neeto-ui-tag--type-solid": type === TYPES.solid,
+      "neeto-ui-tag--style-primary": style === STYLES$1.primary,
+      "neeto-ui-tag--style-secondary": style === STYLES$1.secondary,
+      "neeto-ui-tag--style-success": style === STYLES$1.success,
+      "neeto-ui-tag--style-info": style === STYLES$1.info,
+      "neeto-ui-tag--style-warning": style === STYLES$1.warning,
+      "neeto-ui-tag--style-danger": style === STYLES$1.danger
+    }, className)
+  }, otherProps), indicatorStyle && /*#__PURE__*/React__default["default"].createElement("span", {
+    "data-testid": "tag-indicator",
+    className: classnames$1("neeto-ui-tag__indicator", {
+      "neeto-ui-bg-error-500": indicatorStyle === STYLES$1.danger,
+      "neeto-ui-bg-info-500": indicatorStyle === STYLES$1.info,
+      "neeto-ui-bg-warning-500": indicatorStyle === STYLES$1.warning,
+      "neeto-ui-bg-success-500": indicatorStyle === STYLES$1.success,
+      "neeto-ui-bg-primary-500": indicatorStyle === STYLES$1.primary,
+      "neeto-ui-bg-gray-500": indicatorStyle === STYLES$1.secondary
+    })
+  }), icon && /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "neeto-ui-tag__icon",
+    "data-testid": "class-icon"
+  }, /*#__PURE__*/React__default["default"].createElement(Icon, null)), renderLabel, onClose && /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "neeto-ui-tag__close",
+    "data-testid": "tag-close-button",
+    onClick: !disabled ? onClose : null
+  }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Close, null)));
+};
+
+var _excluded$c = ["children"],
+  _excluded2 = ["children"];
 function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var STYLES = {
@@ -24707,13 +24789,30 @@ var MultiValueRemove = function MultiValueRemove(props) {
     size: 16
   }));
 };
+var CustomValueContainer = function CustomValueContainer(_ref2) {
+  var children = _ref2.children,
+    props = _objectWithoutProperties$1(_ref2, _excluded2);
+  var getValue = props.getValue,
+    _props$selectProps = props.selectProps,
+    isFocused = _props$selectProps.isFocused,
+    visibleEmailsCount = _props$selectProps.visibleEmailsCount;
+  var value = getValue();
+  var _children = _toArray(children),
+    firstChild = _children[0],
+    rest = _children.slice(1);
+  var shouldCollapse = !isFocused && value.length > visibleEmailsCount;
+  return /*#__PURE__*/React__default["default"].createElement(components.ValueContainer, props, shouldCollapse ? firstChild.slice(0, visibleEmailsCount) : firstChild, shouldCollapse && /*#__PURE__*/React__default["default"].createElement(Tag, {
+    label: "".concat(value.length - visibleEmailsCount, " more"),
+    style: "secondary"
+  }), rest);
+};
 var EMAIL_REGEX = new RegExp("^[A-Z0-9._%+-]+@[A-Z0-9.-]+\\.[A-Z]{2,}$", "i");
 var UNSTRICT_EMAIL_REGEX = /(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))/g;
 var EMAIL_SEPARATION_REGEX = /[^\s,]+/g;
 var CUSTOM_STYLES = {
   input: assoc("overflow", "hidden"),
-  multiValue: function multiValue(styles, _ref2) {
-    var valid = _ref2.data.valid;
+  multiValue: function multiValue(styles, _ref3) {
+    var valid = _ref3.data.valid;
     return _objectSpread$3(_objectSpread$3({}, styles), {}, {
       border: valid ? STYLES.border["default"] : STYLES.border.error,
       color: valid ? STYLES.color["default"] : STYLES.color.error
@@ -24724,7 +24823,8 @@ var CUSTOM_COMPONENTS = {
   DropdownIndicator: CustomDropdownIndicator,
   ClearIndicator: null,
   Control: CustomControl,
-  MultiValueRemove: MultiValueRemove
+  MultiValueRemove: MultiValueRemove,
+  ValueContainer: CustomValueContainer
 };
 
 var formatEmailInputOptions = function formatEmailInputOptions(label) {
@@ -24753,7 +24853,7 @@ var renderDefaultText = function renderDefaultText(count) {
   return count === 1 ? "email" : "emails";
 };
 
-var _excluded$b = ["label", "placeholder", "helpText", "value", "onChange", "error", "onBlur", "filterInvalidEmails", "counter", "disabled", "maxHeight", "required", "labelProps"];
+var _excluded$b = ["label", "placeholder", "helpText", "value", "onChange", "error", "onBlur", "filterInvalidEmails", "counter", "disabled", "maxHeight", "required", "labelProps", "visibleEmailsCount"];
 function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
@@ -24780,11 +24880,17 @@ var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _ref$required = _ref.required,
     required = _ref$required === void 0 ? false : _ref$required,
     labelProps = _ref.labelProps,
+    _ref$visibleEmailsCou = _ref.visibleEmailsCount,
+    visibleEmailsCount = _ref$visibleEmailsCou === void 0 ? 3 : _ref$visibleEmailsCou,
     otherProps = _objectWithoutProperties$1(_ref, _excluded$b);
   var _useState = React.useState(""),
     _useState2 = _slicedToArray$1(_useState, 2),
     inputValue = _useState2[0],
     setInputValue = _useState2[1];
+  var _useState3 = React.useState(false),
+    _useState4 = _slicedToArray$1(_useState3, 2),
+    isFocused = _useState4[0],
+    setIsFocused = _useState4[1];
   var isCounterVisible = !!counter && (!counter.startsFrom || getValidEmailsCount(value) >= counter.startsFrom);
   var isOptionsPresent = !!otherProps.options;
   var handleFilterEmails = function handleFilterEmails() {
@@ -24826,7 +24932,8 @@ var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     otherProps === null || otherProps === void 0 ? void 0 : (_otherProps$onCreateO = otherProps.onCreateOption) === null || _otherProps$onCreateO === void 0 ? void 0 : _otherProps$onCreateO.call(otherProps, input);
   };
   var handleBlur = function handleBlur(event) {
-    return inputValue ? handleEmailChange() : onBlur(event);
+    inputValue ? handleEmailChange() : onBlur(event);
+    setIsFocused(false);
   };
   var overrideProps = {};
   if (isOptionsPresent) {
@@ -24863,9 +24970,11 @@ var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     components: CUSTOM_COMPONENTS,
     inputValue: inputValue,
     isDisabled: disabled,
+    isFocused: isFocused,
     placeholder: placeholder,
     ref: ref,
     value: value,
+    visibleEmailsCount: visibleEmailsCount,
     className: classnames$1("neeto-ui-react-select__container neeto-ui-email-input__select", {
       "neeto-ui-react-select__container--error": !!error
     }),
@@ -24877,6 +24986,9 @@ var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }),
     onBlur: handleBlur,
     onChange: onChange,
+    onFocus: function onFocus() {
+      return setIsFocused(true);
+    },
     onInputChange: function onInputChange(inputValue) {
       return setInputValue(inputValue);
     },