@bigbinary/neetoui 8.3.29 → 8.3.31

package/dist/cjs/Modal.js

@@ -1,16 +1,16 @@
 'use strict';
 
-var _extends = require('@babel/runtime/helpers/extends');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
 var classnames = require('classnames');
-var neetoIcons = require('@bigbinary/neeto-icons');
-var useOverlayManager = require('./useOverlayManager-CxBh9gVG.js');
+var Close = require('@bigbinary/neeto-icons/Close');
+var useOverlayManager = require('./useOverlayManager-Bj58uLfc.js');
 var Button = require('./Button.js');
 require('react-router-dom');
 require('qs');
+var jsxRuntime = require('react/jsx-runtime');
 var Typography = require('./Typography.js');
 require('@babel/runtime/helpers/esm/extends');
 require('@babel/runtime/helpers/esm/objectWithoutPropertiesLoose');
@@ -21,7 +21,7 @@ require('@bigbinary/neeto-hotkeys');
 require('./overlayManager.js');
 require('@babel/runtime/helpers/classCallCheck');
 require('@babel/runtime/helpers/createClass');
-require('./index--BeRLo6L.js');
+require('./index-h3QcOeWw.js');
 require('@bigbinary/neeto-cist');
 require('./en-K2ZIAV2F.js');
 require('@babel/runtime/helpers/toConsumableArray');
@@ -39,20 +39,22 @@ var Body = function Body(_ref) {
   var children = _ref.children,
     className = _ref.className,
     dataCy = _ref.dataCy;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: classnames("neeto-ui-modal__body", className),
-    "data-cy": dataCy !== null && dataCy !== void 0 ? dataCy : "modal-body"
-  }, children);
+    "data-cy": dataCy !== null && dataCy !== void 0 ? dataCy : "modal-body",
+    children: children
+  });
 };
 
 var Footer = function Footer(_ref) {
   var children = _ref.children,
     className = _ref.className,
     dataCy = _ref.dataCy;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: classnames("neeto-ui-modal__footer", className),
-    "data-cy": dataCy !== null && dataCy !== void 0 ? dataCy : "modal-footer"
-  }, children);
+    "data-cy": dataCy !== null && dataCy !== void 0 ? dataCy : "modal-footer",
+    children: children
+  });
 };
 
 var Header = function Header(_ref) {
@@ -61,16 +63,19 @@ var Header = function Header(_ref) {
     children = _ref.children,
     className = _ref.className,
     dataCy = _ref.dataCy;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: classnames("neeto-ui-modal__header", className),
-    "data-cy": dataCy !== null && dataCy !== void 0 ? dataCy : "modal-header"
-  }, children, description && /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-modal__header-desc",
-    "data-cy": "modal-header-desc"
-  }, /*#__PURE__*/React.createElement(Typography, {
-    lineHeight: "normal",
-    style: "body2"
-  }, description)));
+    "data-cy": dataCy !== null && dataCy !== void 0 ? dataCy : "modal-header",
+    children: [children, description && /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-ui-modal__header-desc",
+      "data-cy": "modal-header-desc",
+      children: /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        lineHeight: "normal",
+        style: "body2",
+        children: description
+      })
+    })]
+  });
 };
 
 var MemoizedChildren = /*#__PURE__*/React.memo(function (_ref) {
@@ -83,6 +88,8 @@ var MemoizedChildren = /*#__PURE__*/React.memo(function (_ref) {
 MemoizedChildren.displayName = "MemoizedChildren";
 
 var _excluded = ["size", "isOpen", "onClose", "children", "finalFocusRef", "initialFocusRef", "className", "closeOnEsc", "closeButton", "backdropClassName", "blockScrollOnMount", "closeOnOutsideClick", "forceRender"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SIZES = {
   small: "small",
   medium: "medium",
@@ -136,52 +143,56 @@ var Modal = function Modal(_ref) {
     handleOverlayClose = _useOverlay.handleOverlayClose,
     setFocusField = _useOverlay.setFocusField;
   var isFullScreenModal = size === SIZES.fullScreen;
-  return /*#__PURE__*/React.createElement(useOverlayManager.Portal, {
-    rootId: "neeto-ui-portal"
-  }, /*#__PURE__*/React.createElement(useOverlayManager.CSSTransition, {
-    unmountOnExit: true,
-    appear: isOpen,
-    classNames: "neeto-ui-modal",
-    "in": isOpen,
-    timeout: 300,
-    onEntered: function onEntered() {
-      return setHasTransitionCompleted(true);
-    },
-    onExited: function onExited() {
-      return setHasTransitionCompleted(false);
-    }
-  }, /*#__PURE__*/React.createElement(useOverlayManager.Backdrop, {
-    "data-testid": "backdrop",
-    key: "modal-backdrop",
-    ref: backdropRef,
-    className: classnames("neeto-ui-modal__backdrop", {
-      "neeto-ui-modal__backdrop--fullscreen": isFullScreenModal
-    }, backdropClassName)
-  }, /*#__PURE__*/React.createElement("div", _extends({
-    "aria-modal": true,
-    key: "modal-wrapper",
-    ref: modalWrapper,
-    role: "dialog",
-    className: classnames("neeto-ui-modal__wrapper", _defineProperty({
-      "neeto-ui-modal__wrapper--small": size === SIZES.small,
-      "neeto-ui-modal__wrapper--medium": size === SIZES.medium,
-      "neeto-ui-modal__wrapper--large": size === SIZES.large,
-      "neeto-ui-modal__wrapper--fullscreen": isFullScreenModal
-    }, className, className))
-  }, otherProps), closeButton && /*#__PURE__*/React.createElement(Button, {
-    "aria-label": "Close",
-    className: "neeto-ui-modal__close",
-    "data-cy": "modal-close-button",
-    "data-testid": "close-button",
-    icon: neetoIcons.Close,
-    size: isFullScreenModal ? "large" : "small",
-    style: isFullScreenModal ? "secondary" : "text",
-    onClick: handleOverlayClose
-  }), /*#__PURE__*/React.createElement(MemoizedChildren, {
-    shouldUpdate: isOpen || forceRender
-  }, typeof children === "function" ? children({
-    setFocusField: setFocusField
-  }) : children)))));
+  return /*#__PURE__*/jsxRuntime.jsx(useOverlayManager.Portal, {
+    rootId: "neeto-ui-portal",
+    children: /*#__PURE__*/jsxRuntime.jsx(useOverlayManager.CSSTransition, {
+      unmountOnExit: true,
+      appear: isOpen,
+      classNames: "neeto-ui-modal",
+      "in": isOpen,
+      timeout: 300,
+      onEntered: function onEntered() {
+        return setHasTransitionCompleted(true);
+      },
+      onExited: function onExited() {
+        return setHasTransitionCompleted(false);
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(useOverlayManager.Backdrop, {
+        "data-testid": "backdrop",
+        ref: backdropRef,
+        className: classnames("neeto-ui-modal__backdrop", {
+          "neeto-ui-modal__backdrop--fullscreen": isFullScreenModal
+        }, backdropClassName),
+        children: /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread(_objectSpread({
+          "aria-modal": true,
+          ref: modalWrapper,
+          role: "dialog",
+          className: classnames("neeto-ui-modal__wrapper", _defineProperty({
+            "neeto-ui-modal__wrapper--small": size === SIZES.small,
+            "neeto-ui-modal__wrapper--medium": size === SIZES.medium,
+            "neeto-ui-modal__wrapper--large": size === SIZES.large,
+            "neeto-ui-modal__wrapper--fullscreen": isFullScreenModal
+          }, className, className))
+        }, otherProps), {}, {
+          children: [closeButton && /*#__PURE__*/jsxRuntime.jsx(Button, {
+            "aria-label": "Close",
+            className: "neeto-ui-modal__close",
+            "data-cy": "modal-close-button",
+            "data-testid": "close-button",
+            icon: Close,
+            size: isFullScreenModal ? "large" : "small",
+            style: isFullScreenModal ? "secondary" : "text",
+            onClick: handleOverlayClose
+          }), /*#__PURE__*/jsxRuntime.jsx(MemoizedChildren, {
+            shouldUpdate: isOpen || forceRender,
+            children: typeof children === "function" ? children({
+              setFocusField: setFocusField
+            }) : children
+          })]
+        }), "modal-wrapper")
+      }, "modal-backdrop")
+    })
+  });
 };
 Modal.Header = Header;
 Modal.Body = Body;

package/dist/cjs/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../src/components/Modal/Body.jsx","../../src/components/Modal/Footer.jsx","../../src/components/Modal/Header.jsx","../../src/components/Modal/MemoizedChildren.js","../../src/components/Modal/index.jsx"],"sourcesContent":["import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nconst Body = ({ children, className, dataCy }) => (\n  <div\n    className={classnames(\"neeto-ui-modal__body\", className)}\n    data-cy={dataCy ?? \"modal-body\"}\n  >\n    {children}\n  </div>\n);\n\nBody.propTypes = {\n  /**\n   * To specify className to be applied to the Modal Body.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the content to be rendered inside the Modal Body.\n   */\n  children: PropTypes.node,\n};\n\nexport default Body;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nconst Footer = ({ children, className, dataCy }) => (\n  <div\n    className={classnames(\"neeto-ui-modal__footer\", className)}\n    data-cy={dataCy ?? \"modal-footer\"}\n  >\n    {children}\n  </div>\n);\n\nFooter.propTypes = {\n  /**\n   * To specify className to be applied to the Modal Footer.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the content to be rendered inside the Modal Footer.\n   */\n  children: PropTypes.node,\n};\n\nexport default Footer;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport Typography from \"../Typography\";\n\nconst Header = ({ description = \"\", children, className, dataCy }) => (\n  <div\n    className={classnames(\"neeto-ui-modal__header\", className)}\n    data-cy={dataCy ?? \"modal-header\"}\n  >\n    {children}\n    {description && (\n      <div className=\"neeto-ui-modal__header-desc\" data-cy=\"modal-header-desc\">\n        <Typography lineHeight=\"normal\" style=\"body2\">\n          {description}\n        </Typography>\n      </div>\n    )}\n  </div>\n);\n\nHeader.propTypes = {\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To specify the short description of the Modal.\n   */\n  description: PropTypes.string,\n  /**\n   * To specify className to be applied to the Modal Header container.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the content to be rendered inside the Modal Header.\n   */\n  children: PropTypes.node,\n};\n\nexport default Header;\n","import React from \"react\";\n\nconst MemoizedChildren = React.memo(\n  ({ children }) => children,\n  (_, { shouldUpdate }) => !shouldUpdate\n);\n\nMemoizedChildren.displayName = \"MemoizedChildren\";\n\nexport default MemoizedChildren;\n","import React, { useRef, useState } from \"react\";\n\nimport classnames from \"classnames\";\nimport { Close } from \"neetoicons\";\nimport PropTypes from \"prop-types\";\nimport { CSSTransition } from \"react-transition-group\";\n\nimport Backdrop from \"atoms/Backdrop\";\nimport Portal from \"atoms/Portal\";\nimport Button from \"components/Button\";\nimport { useOverlayManager, useOverlay } from \"hooks\";\n\nimport Body from \"./Body\";\nimport Footer from \"./Footer\";\nimport Header from \"./Header\";\nimport MemoizedChildren from \"./MemoizedChildren\";\n\nconst SIZES = {\n  small: \"small\",\n  medium: \"medium\",\n  large: \"large\",\n  fullScreen: \"fullScreen\",\n};\n\nconst Modal = ({\n  size = SIZES.medium,\n  isOpen = false,\n  onClose = () => {},\n  children,\n  finalFocusRef,\n  initialFocusRef,\n  className = \"\",\n  closeOnEsc = true,\n  closeButton = true,\n  backdropClassName = \"\",\n  blockScrollOnMount = true,\n  closeOnOutsideClick = true,\n  forceRender = false,\n  ...otherProps\n}) => {\n  const [hasTransitionCompleted, setHasTransitionCompleted] = useState(false);\n\n  const modalWrapper = useRef(null);\n  const backdropRef = useRef(null);\n\n  useOverlayManager(modalWrapper, isOpen);\n\n  const { handleOverlayClose, setFocusField } = useOverlay({\n    isOpen,\n    initialFocusRef,\n    finalFocusRef,\n    overlayWrapper: modalWrapper,\n    onClose,\n    backdropRef,\n    closeOnOutsideClick,\n    closeOnEsc,\n    blockScrollOnMount,\n    hasTransitionCompleted,\n  });\n\n  const isFullScreenModal = size === SIZES.fullScreen;\n\n  return (\n    <Portal rootId=\"neeto-ui-portal\">\n      <CSSTransition\n        unmountOnExit\n        appear={isOpen}\n        classNames=\"neeto-ui-modal\"\n        in={isOpen}\n        timeout={300}\n        onEntered={() => setHasTransitionCompleted(true)}\n        onExited={() => setHasTransitionCompleted(false)}\n      >\n        <Backdrop\n          data-testid=\"backdrop\"\n          key=\"modal-backdrop\"\n          ref={backdropRef}\n          className={classnames(\n            \"neeto-ui-modal__backdrop\",\n            {\n              \"neeto-ui-modal__backdrop--fullscreen\": isFullScreenModal,\n            },\n            backdropClassName\n          )}\n        >\n          <div\n            aria-modal\n            key=\"modal-wrapper\"\n            ref={modalWrapper}\n            role=\"dialog\"\n            className={classnames(\"neeto-ui-modal__wrapper\", {\n              \"neeto-ui-modal__wrapper--small\": size === SIZES.small,\n              \"neeto-ui-modal__wrapper--medium\": size === SIZES.medium,\n              \"neeto-ui-modal__wrapper--large\": size === SIZES.large,\n              \"neeto-ui-modal__wrapper--fullscreen\": isFullScreenModal,\n              [className]: className,\n            })}\n            {...otherProps}\n          >\n            {closeButton && (\n              <Button\n                aria-label=\"Close\"\n                className=\"neeto-ui-modal__close\"\n                data-cy=\"modal-close-button\"\n                data-testid=\"close-button\"\n                icon={Close}\n                size={isFullScreenModal ? \"large\" : \"small\"}\n                style={isFullScreenModal ? \"secondary\" : \"text\"}\n                onClick={handleOverlayClose}\n              />\n            )}\n            <MemoizedChildren shouldUpdate={isOpen || forceRender}>\n              {typeof children === \"function\"\n                ? children({ setFocusField })\n                : children}\n            </MemoizedChildren>\n          </div>\n        </Backdrop>\n      </CSSTransition>\n    </Portal>\n  );\n};\n\nModal.propTypes = {\n  /**\n   * To specify the size of the Modal.\n   */\n  size: PropTypes.oneOf(Object.values(SIZES)),\n  /**\n   * To specify whether the Modal is open or not.\n   */\n  isOpen: PropTypes.bool,\n  /**\n   * To specify the callback which will be invoked when the Modal is closed.\n   */\n  onClose: PropTypes.func,\n  /**\n   * To specify the content to be rendered inside the Modal component.\n   */\n  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n  /**\n   * To provide external classNames to the Modal.\n   */\n  className: PropTypes.string,\n  /**\n   * To close the Modal on pressing the Esc key.\n   */\n  closeOnEsc: PropTypes.bool,\n  /**\n   * To specify whether the close button of the Modal should be displayed or not.\n   */\n  closeButton: PropTypes.bool,\n  /**\n   * To add custom classes to backdrop component.\n   */\n  backdropClassName: PropTypes.string,\n  /**\n   * To close on clicking outside the Modal content.\n   */\n  closeOnOutsideClick: PropTypes.bool,\n  /*\n   * To specify the ref of the element which will receive focus when the Modal is closed.\n   * If not specified, the focus will be set to the element which was focused when the Modal was opened.\n   * If the Modal was opened by clicking on a button, then the focus will be set to the button.\n   * */\n  finalFocusRef: PropTypes.object,\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To specify the ref of the element which will receive focus when the Modal is opened.\n   * If not specified, the focus will be set to the first focusable element inside the Modal.\n   * */\n  initialFocusRef: PropTypes.object,\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To specify whether the scroll should be blocked when the Modal is opened.\n   * */\n  blockScrollOnMount: PropTypes.bool,\n  /**\n   * The modal children will be force re-rendered if the boolean is set to `true`. Ideally the modal won't update\n   * if the `isOpen` is `false`. You can use this prop to override that nature.\n   */\n  forceRender: PropTypes.bool,\n};\n\nModal.Header = Header;\nModal.Body = Body;\nModal.Footer = Footer;\n\nexport default Modal;\n"],"names":["Body","_ref","children","className","dataCy","React","createElement","classnames","Footer","Header","_ref$description","description","Typography","lineHeight","style","MemoizedChildren","memo","_","_ref2","shouldUpdate","displayName","SIZES","small","medium","large","fullScreen","Modal","_ref$size","size","_ref$isOpen","isOpen","_ref$onClose","onClose","finalFocusRef","initialFocusRef","_ref$className","_ref$closeOnEsc","closeOnEsc","_ref$closeButton","closeButton","_ref$backdropClassNam","backdropClassName","_ref$blockScrollOnMou","blockScrollOnMount","_ref$closeOnOutsideCl","closeOnOutsideClick","_ref$forceRender","forceRender","otherProps","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","hasTransitionCompleted","setHasTransitionCompleted","modalWrapper","useRef","backdropRef","useOverlayManager","_useOverlay","useOverlay","overlayWrapper","handleOverlayClose","setFocusField","isFullScreenModal","Portal","rootId","CSSTransition","unmountOnExit","appear","classNames","timeout","onEntered","onExited","Backdrop","key","ref","_extends","role","_defineProperty","Button","icon","Close","onClick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,IAAMA,IAAI,GAAG,SAAPA,IAAIA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,MAAM,GAAAH,IAAA,CAANG,MAAM,CAAA;EAAA,oBACzCC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,UAAU,CAAC,sBAAsB,EAAEJ,SAAS,CAAE;AACzD,IAAA,SAAA,EAASC,MAAM,KAAA,IAAA,IAANA,MAAM,KAAA,KAAA,CAAA,GAANA,MAAM,GAAI,YAAA;AAAa,GAAA,EAE/BF,QAAQ,CACL,CAAA;AAAA,CACP;;ACPD,IAAMM,MAAM,GAAG,SAATA,MAAMA,CAAAP,IAAA,EAAA;AAAA,EAAA,IAAMC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,MAAM,GAAAH,IAAA,CAANG,MAAM,CAAA;EAAA,oBAC3CC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,UAAU,CAAC,wBAAwB,EAAEJ,SAAS,CAAE;AAC3D,IAAA,SAAA,EAASC,MAAM,KAAA,IAAA,IAANA,MAAM,KAAA,KAAA,CAAA,GAANA,MAAM,GAAI,cAAA;AAAe,GAAA,EAEjCF,QAAQ,CACL,CAAA;AAAA,CACP;;ACLD,IAAMO,MAAM,GAAG,SAATA,MAAMA,CAAAR,IAAA,EAAA;AAAA,EAAA,IAAAS,gBAAA,GAAAT,IAAA,CAAMU,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,gBAAA;IAAER,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,MAAM,GAAAH,IAAA,CAANG,MAAM,CAAA;EAAA,oBAC7DC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,UAAU,CAAC,wBAAwB,EAAEJ,SAAS,CAAE;AAC3D,IAAA,SAAA,EAASC,MAAM,KAAA,IAAA,IAANA,MAAM,KAAA,KAAA,CAAA,GAANA,MAAM,GAAI,cAAA;AAAe,GAAA,EAEjCF,QAAQ,EACRS,WAAW,iBACVN,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKH,IAAAA,SAAS,EAAC,6BAA6B;IAAC,SAAQ,EAAA,mBAAA;AAAmB,GAAA,eACtEE,KAAA,CAAAC,aAAA,CAACM,UAAU,EAAA;AAACC,IAAAA,UAAU,EAAC,QAAQ;AAACC,IAAAA,KAAK,EAAC,OAAA;GACnCH,EAAAA,WAAW,CACD,CAEhB,CACG,CAAA;AAAA,CACP;;ACnBD,IAAMI,gBAAgB,gBAAGV,KAAK,CAACW,IAAI,CACjC,UAAAf,IAAA,EAAA;AAAA,EAAA,IAAGC,QAAQ,GAAAD,IAAA,CAARC,QAAQ,CAAA;AAAA,EAAA,OAAOA,QAAQ,CAAA;AAAA,CAC1B,EAAA,UAACe,CAAC,EAAAC,KAAA,EAAA;AAAA,EAAA,IAAIC,YAAY,GAAAD,KAAA,CAAZC,YAAY,CAAA;AAAA,EAAA,OAAO,CAACA,YAAY,CAAA;AAAA,CACvC,CAAA,CAAA;AAEDJ,gBAAgB,CAACK,WAAW,GAAG,kBAAkB;;;ACUjD,IAAMC,KAAK,GAAG;AACZC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,UAAU,EAAE,YAAA;AACd,CAAC,CAAA;AAED,IAAMC,KAAK,GAAG,SAARA,KAAKA,CAAAzB,IAAA,EAeL;AAAA,EAAA,IAAA0B,SAAA,GAAA1B,IAAA,CAdJ2B,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAA,KAAA,CAAA,GAAGN,KAAK,CAACE,MAAM,GAAAI,SAAA;IAAAE,WAAA,GAAA5B,IAAA,CACnB6B,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,WAAA;IAAAE,YAAA,GAAA9B,IAAA,CACd+B,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAA,KAAA,CAAA,GAAG,YAAM,EAAE,GAAAA,YAAA;IAClB7B,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACR+B,aAAa,GAAAhC,IAAA,CAAbgC,aAAa;IACbC,eAAe,GAAAjC,IAAA,CAAfiC,eAAe;IAAAC,cAAA,GAAAlC,IAAA,CACfE,SAAS;AAATA,IAAAA,SAAS,GAAAgC,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAC,eAAA,GAAAnC,IAAA,CACdoC,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,eAAA;IAAAE,gBAAA,GAAArC,IAAA,CACjBsC,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,gBAAA;IAAAE,qBAAA,GAAAvC,IAAA,CAClBwC,iBAAiB;AAAjBA,IAAAA,iBAAiB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,qBAAA;IAAAE,qBAAA,GAAAzC,IAAA,CACtB0C,kBAAkB;AAAlBA,IAAAA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,qBAAA;IAAAE,qBAAA,GAAA3C,IAAA,CACzB4C,mBAAmB;AAAnBA,IAAAA,mBAAmB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,qBAAA;IAAAE,gBAAA,GAAA7C,IAAA,CAC1B8C,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,gBAAA;AAChBE,IAAAA,UAAU,GAAAC,wBAAA,CAAAhD,IAAA,EAAAiD,SAAA,CAAA,CAAA;AAEb,EAAA,IAAAC,SAAA,GAA4DC,cAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAApEI,IAAAA,sBAAsB,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,yBAAyB,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAExD,EAAA,IAAMI,YAAY,GAAGC,YAAM,CAAC,IAAI,CAAC,CAAA;AACjC,EAAA,IAAMC,WAAW,GAAGD,YAAM,CAAC,IAAI,CAAC,CAAA;AAEhCE,EAAAA,mCAAiB,CAACH,YAAY,EAAE3B,MAAM,CAAC,CAAA;EAEvC,IAAA+B,WAAA,GAA8CC,4BAAU,CAAC;AACvDhC,MAAAA,MAAM,EAANA,MAAM;AACNI,MAAAA,eAAe,EAAfA,eAAe;AACfD,MAAAA,aAAa,EAAbA,aAAa;AACb8B,MAAAA,cAAc,EAAEN,YAAY;AAC5BzB,MAAAA,OAAO,EAAPA,OAAO;AACP2B,MAAAA,WAAW,EAAXA,WAAW;AACXd,MAAAA,mBAAmB,EAAnBA,mBAAmB;AACnBR,MAAAA,UAAU,EAAVA,UAAU;AACVM,MAAAA,kBAAkB,EAAlBA,kBAAkB;AAClBY,MAAAA,sBAAsB,EAAtBA,sBAAAA;AACF,KAAC,CAAC;IAXMS,kBAAkB,GAAAH,WAAA,CAAlBG,kBAAkB;IAAEC,aAAa,GAAAJ,WAAA,CAAbI,aAAa,CAAA;AAazC,EAAA,IAAMC,iBAAiB,GAAGtC,IAAI,KAAKP,KAAK,CAACI,UAAU,CAAA;AAEnD,EAAA,oBACEpB,KAAA,CAAAC,aAAA,CAAC6D,wBAAM,EAAA;AAACC,IAAAA,MAAM,EAAC,iBAAA;AAAiB,GAAA,eAC9B/D,KAAA,CAAAC,aAAA,CAAC+D,+BAAa,EAAA;IACZC,aAAa,EAAA,IAAA;AACbC,IAAAA,MAAM,EAAEzC,MAAO;AACf0C,IAAAA,UAAU,EAAC,gBAAgB;AAC3B,IAAA,IAAA,EAAI1C,MAAO;AACX2C,IAAAA,OAAO,EAAE,GAAI;IACbC,SAAS,EAAE,SAAAA,SAAA,GAAA;MAAA,OAAMlB,yBAAyB,CAAC,IAAI,CAAC,CAAA;KAAC;IACjDmB,QAAQ,EAAE,SAAAA,QAAA,GAAA;MAAA,OAAMnB,yBAAyB,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AAAC,GAAA,eAEjDnD,KAAA,CAAAC,aAAA,CAACsE,0BAAQ,EAAA;AACP,IAAA,aAAA,EAAY,UAAU;AACtBC,IAAAA,GAAG,EAAC,gBAAgB;AACpBC,IAAAA,GAAG,EAAEnB,WAAY;AACjBxD,IAAAA,SAAS,EAAEI,UAAU,CACnB,0BAA0B,EAC1B;AACE,MAAA,sCAAsC,EAAE2D,iBAAAA;AAC1C,KAAC,EACDzB,iBAAiB,CAAA;AACjB,GAAA,eAEFpC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAAyE,QAAA,CAAA;IACE,YAAU,EAAA,IAAA;AACVF,IAAAA,GAAG,EAAC,eAAe;AACnBC,IAAAA,GAAG,EAAErB,YAAa;AAClBuB,IAAAA,IAAI,EAAC,QAAQ;AACb7E,IAAAA,SAAS,EAAEI,UAAU,CAAC,yBAAyB,EAAA0E,eAAA,CAAA;AAC7C,MAAA,gCAAgC,EAAErD,IAAI,KAAKP,KAAK,CAACC,KAAK;AACtD,MAAA,iCAAiC,EAAEM,IAAI,KAAKP,KAAK,CAACE,MAAM;AACxD,MAAA,gCAAgC,EAAEK,IAAI,KAAKP,KAAK,CAACG,KAAK;AACtD,MAAA,qCAAqC,EAAE0C,iBAAAA;KACtC/D,EAAAA,SAAS,EAAGA,SAAS,CAAA,CAAA;GAEpB6C,EAAAA,UAAU,GAEbT,WAAW,iBACVlC,KAAA,CAAAC,aAAA,CAAC4E,MAAM,EAAA;AACL,IAAA,YAAA,EAAW,OAAO;AAClB/E,IAAAA,SAAS,EAAC,uBAAuB;AACjC,IAAA,SAAA,EAAQ,oBAAoB;AAC5B,IAAA,aAAA,EAAY,cAAc;AAC1BgF,IAAAA,IAAI,EAAEC,gBAAM;AACZxD,IAAAA,IAAI,EAAEsC,iBAAiB,GAAG,OAAO,GAAG,OAAQ;AAC5CpD,IAAAA,KAAK,EAAEoD,iBAAiB,GAAG,WAAW,GAAG,MAAO;AAChDmB,IAAAA,OAAO,EAAErB,kBAAAA;AAAmB,GAAA,CAE/B,eACD3D,KAAA,CAAAC,aAAA,CAACS,gBAAgB,EAAA;IAACI,YAAY,EAAEW,MAAM,IAAIiB,WAAAA;AAAY,GAAA,EACnD,OAAO7C,QAAQ,KAAK,UAAU,GAC3BA,QAAQ,CAAC;AAAE+D,IAAAA,aAAa,EAAbA,aAAAA;AAAc,GAAC,CAAC,GAC3B/D,QAAQ,CACK,CACf,CACG,CACG,CACT,CAAA;AAEb,EAAC;AAmEDwB,KAAK,CAACjB,MAAM,GAAGA,MAAM,CAAA;AACrBiB,KAAK,CAAC1B,IAAI,GAAGA,IAAI,CAAA;AACjB0B,KAAK,CAAClB,MAAM,GAAGA,MAAM;;;;"}
+{"version":3,"file":"Modal.js","sources":["../../src/components/Modal/Body.jsx","../../src/components/Modal/Footer.jsx","../../src/components/Modal/Header.jsx","../../src/components/Modal/MemoizedChildren.js","../../src/components/Modal/index.jsx"],"sourcesContent":["import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nconst Body = ({ children, className, dataCy }) => (\n  <div\n    className={classnames(\"neeto-ui-modal__body\", className)}\n    data-cy={dataCy ?? \"modal-body\"}\n  >\n    {children}\n  </div>\n);\n\nBody.propTypes = {\n  /**\n   * To specify className to be applied to the Modal Body.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the content to be rendered inside the Modal Body.\n   */\n  children: PropTypes.node,\n};\n\nexport default Body;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nconst Footer = ({ children, className, dataCy }) => (\n  <div\n    className={classnames(\"neeto-ui-modal__footer\", className)}\n    data-cy={dataCy ?? \"modal-footer\"}\n  >\n    {children}\n  </div>\n);\n\nFooter.propTypes = {\n  /**\n   * To specify className to be applied to the Modal Footer.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the content to be rendered inside the Modal Footer.\n   */\n  children: PropTypes.node,\n};\n\nexport default Footer;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport Typography from \"../Typography\";\n\nconst Header = ({ description = \"\", children, className, dataCy }) => (\n  <div\n    className={classnames(\"neeto-ui-modal__header\", className)}\n    data-cy={dataCy ?? \"modal-header\"}\n  >\n    {children}\n    {description && (\n      <div className=\"neeto-ui-modal__header-desc\" data-cy=\"modal-header-desc\">\n        <Typography lineHeight=\"normal\" style=\"body2\">\n          {description}\n        </Typography>\n      </div>\n    )}\n  </div>\n);\n\nHeader.propTypes = {\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To specify the short description of the Modal.\n   */\n  description: PropTypes.string,\n  /**\n   * To specify className to be applied to the Modal Header container.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the content to be rendered inside the Modal Header.\n   */\n  children: PropTypes.node,\n};\n\nexport default Header;\n","import React from \"react\";\n\nconst MemoizedChildren = React.memo(\n  ({ children }) => children,\n  (_, { shouldUpdate }) => !shouldUpdate\n);\n\nMemoizedChildren.displayName = \"MemoizedChildren\";\n\nexport default MemoizedChildren;\n","import React, { useRef, useState } from \"react\";\n\nimport classnames from \"classnames\";\nimport { Close } from \"neetoicons\";\nimport PropTypes from \"prop-types\";\nimport { CSSTransition } from \"react-transition-group\";\n\nimport Backdrop from \"atoms/Backdrop\";\nimport Portal from \"atoms/Portal\";\nimport Button from \"components/Button\";\nimport { useOverlayManager, useOverlay } from \"hooks\";\n\nimport Body from \"./Body\";\nimport Footer from \"./Footer\";\nimport Header from \"./Header\";\nimport MemoizedChildren from \"./MemoizedChildren\";\n\nconst SIZES = {\n  small: \"small\",\n  medium: \"medium\",\n  large: \"large\",\n  fullScreen: \"fullScreen\",\n};\n\nconst Modal = ({\n  size = SIZES.medium,\n  isOpen = false,\n  onClose = () => {},\n  children,\n  finalFocusRef,\n  initialFocusRef,\n  className = \"\",\n  closeOnEsc = true,\n  closeButton = true,\n  backdropClassName = \"\",\n  blockScrollOnMount = true,\n  closeOnOutsideClick = true,\n  forceRender = false,\n  ...otherProps\n}) => {\n  const [hasTransitionCompleted, setHasTransitionCompleted] = useState(false);\n\n  const modalWrapper = useRef(null);\n  const backdropRef = useRef(null);\n\n  useOverlayManager(modalWrapper, isOpen);\n\n  const { handleOverlayClose, setFocusField } = useOverlay({\n    isOpen,\n    initialFocusRef,\n    finalFocusRef,\n    overlayWrapper: modalWrapper,\n    onClose,\n    backdropRef,\n    closeOnOutsideClick,\n    closeOnEsc,\n    blockScrollOnMount,\n    hasTransitionCompleted,\n  });\n\n  const isFullScreenModal = size === SIZES.fullScreen;\n\n  return (\n    <Portal rootId=\"neeto-ui-portal\">\n      <CSSTransition\n        unmountOnExit\n        appear={isOpen}\n        classNames=\"neeto-ui-modal\"\n        in={isOpen}\n        timeout={300}\n        onEntered={() => setHasTransitionCompleted(true)}\n        onExited={() => setHasTransitionCompleted(false)}\n      >\n        <Backdrop\n          data-testid=\"backdrop\"\n          key=\"modal-backdrop\"\n          ref={backdropRef}\n          className={classnames(\n            \"neeto-ui-modal__backdrop\",\n            {\n              \"neeto-ui-modal__backdrop--fullscreen\": isFullScreenModal,\n            },\n            backdropClassName\n          )}\n        >\n          <div\n            aria-modal\n            key=\"modal-wrapper\"\n            ref={modalWrapper}\n            role=\"dialog\"\n            className={classnames(\"neeto-ui-modal__wrapper\", {\n              \"neeto-ui-modal__wrapper--small\": size === SIZES.small,\n              \"neeto-ui-modal__wrapper--medium\": size === SIZES.medium,\n              \"neeto-ui-modal__wrapper--large\": size === SIZES.large,\n              \"neeto-ui-modal__wrapper--fullscreen\": isFullScreenModal,\n              [className]: className,\n            })}\n            {...otherProps}\n          >\n            {closeButton && (\n              <Button\n                aria-label=\"Close\"\n                className=\"neeto-ui-modal__close\"\n                data-cy=\"modal-close-button\"\n                data-testid=\"close-button\"\n                icon={Close}\n                size={isFullScreenModal ? \"large\" : \"small\"}\n                style={isFullScreenModal ? \"secondary\" : \"text\"}\n                onClick={handleOverlayClose}\n              />\n            )}\n            <MemoizedChildren shouldUpdate={isOpen || forceRender}>\n              {typeof children === \"function\"\n                ? children({ setFocusField })\n                : children}\n            </MemoizedChildren>\n          </div>\n        </Backdrop>\n      </CSSTransition>\n    </Portal>\n  );\n};\n\nModal.propTypes = {\n  /**\n   * To specify the size of the Modal.\n   */\n  size: PropTypes.oneOf(Object.values(SIZES)),\n  /**\n   * To specify whether the Modal is open or not.\n   */\n  isOpen: PropTypes.bool,\n  /**\n   * To specify the callback which will be invoked when the Modal is closed.\n   */\n  onClose: PropTypes.func,\n  /**\n   * To specify the content to be rendered inside the Modal component.\n   */\n  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n  /**\n   * To provide external classNames to the Modal.\n   */\n  className: PropTypes.string,\n  /**\n   * To close the Modal on pressing the Esc key.\n   */\n  closeOnEsc: PropTypes.bool,\n  /**\n   * To specify whether the close button of the Modal should be displayed or not.\n   */\n  closeButton: PropTypes.bool,\n  /**\n   * To add custom classes to backdrop component.\n   */\n  backdropClassName: PropTypes.string,\n  /**\n   * To close on clicking outside the Modal content.\n   */\n  closeOnOutsideClick: PropTypes.bool,\n  /*\n   * To specify the ref of the element which will receive focus when the Modal is closed.\n   * If not specified, the focus will be set to the element which was focused when the Modal was opened.\n   * If the Modal was opened by clicking on a button, then the focus will be set to the button.\n   * */\n  finalFocusRef: PropTypes.object,\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To specify the ref of the element which will receive focus when the Modal is opened.\n   * If not specified, the focus will be set to the first focusable element inside the Modal.\n   * */\n  initialFocusRef: PropTypes.object,\n  /**\n   * <div class=\"neeto-ui-tag neeto-ui-tag--size-small neeto-ui-tag--style-outline neeto-ui-tag--style-success mb-2\">\n   * New\n   * </div>\n   * To specify whether the scroll should be blocked when the Modal is opened.\n   * */\n  blockScrollOnMount: PropTypes.bool,\n  /**\n   * The modal children will be force re-rendered if the boolean is set to `true`. Ideally the modal won't update\n   * if the `isOpen` is `false`. You can use this prop to override that nature.\n   */\n  forceRender: PropTypes.bool,\n};\n\nModal.Header = Header;\nModal.Body = Body;\nModal.Footer = Footer;\n\nexport default Modal;\n"],"names":["Body","_ref","children","className","dataCy","_jsx","classnames","Footer","Header","_ref$description","description","_jsxs","Typography","lineHeight","style","MemoizedChildren","React","memo","_","_ref2","shouldUpdate","displayName","SIZES","small","medium","large","fullScreen","Modal","_ref$size","size","_ref$isOpen","isOpen","_ref$onClose","onClose","finalFocusRef","initialFocusRef","_ref$className","_ref$closeOnEsc","closeOnEsc","_ref$closeButton","closeButton","_ref$backdropClassNam","backdropClassName","_ref$blockScrollOnMou","blockScrollOnMount","_ref$closeOnOutsideCl","closeOnOutsideClick","_ref$forceRender","forceRender","otherProps","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","hasTransitionCompleted","setHasTransitionCompleted","modalWrapper","useRef","backdropRef","useOverlayManager","_useOverlay","useOverlay","overlayWrapper","handleOverlayClose","setFocusField","isFullScreenModal","Portal","rootId","CSSTransition","unmountOnExit","appear","classNames","timeout","onEntered","onExited","Backdrop","ref","_objectSpread","role","_defineProperty","Button","icon","Close","onClick"],"mappings":"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"}

package/dist/cjs/MultiEmailInput.js

@@ -1,18 +1,18 @@
 'use strict';
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _extends = require('@babel/runtime/helpers/extends');
 var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
 var classnames = require('classnames');
 var ramda = require('ramda');
-var reactSelectCreatable_esm = require('./react-select-creatable.esm-Bdv9YAMt.js');
-var index = require('./index--BeRLo6L.js');
+var reactSelectCreatable_esm = require('./react-select-creatable.esm-lcdODVBz.js');
+var index = require('./index-h3QcOeWw.js');
 var _toArray = require('@babel/runtime/helpers/toArray');
-var neetoIcons = require('@bigbinary/neeto-icons');
+var Close = require('@bigbinary/neeto-icons/Close');
 var Tag = require('./Tag.js');
+var jsxRuntime = require('react/jsx-runtime');
 var neetoCist = require('@bigbinary/neeto-cist');
 var Label = require('./Label.js');
 require('@babel/runtime/helpers/esm/extends');
@@ -22,6 +22,7 @@ require('@babel/runtime/helpers/esm/createClass');
 require('@babel/runtime/helpers/esm/inherits');
 require('@babel/runtime/helpers/esm/createSuper');
 require('@babel/runtime/helpers/esm/toConsumableArray');
+require('@babel/runtime/helpers/extends');
 require('@babel/runtime/helpers/esm/taggedTemplateLiteral');
 require('@babel/runtime/helpers/esm/objectWithoutProperties');
 require('@babel/runtime/helpers/esm/slicedToArray');
@@ -42,6 +43,7 @@ require('dayjs/plugin/localeData');
 require('dayjs/plugin/utc');
 require('dayjs/plugin/weekday');
 require('dayjs/plugin/weekOfYear');
+require('@bigbinary/neeto-icons/Help');
 require('./Button.js');
 require('react-router-dom');
 require('./Spinner.js');
@@ -53,8 +55,8 @@ require('./Typography.js');
 
 var _excluded$2 = ["children"],
   _excluded2 = ["children"];
-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(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; }
+function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var STYLES = {
   border: {
     "default": "1px solid rgb(var(--neeto-ui-gray-400))",
@@ -90,25 +92,31 @@ var CustomControl = function CustomControl(_ref) {
     if (isFocused && !isItemDeleted || isItemAdded) scrollToBottom();
     prevValue.current = value;
   }, [isFocused, value]);
-  return /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.Control, _extends({}, props, {
+  return /*#__PURE__*/jsxRuntime.jsxs(reactSelectCreatable_esm.components.Control, _objectSpread$2(_objectSpread$2({}, props), {}, {
     innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, {
       ref: controlRef
-    })
-  }), prefix && /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-email-input__prefix"
-  }, prefix), children);
+    }),
+    children: [prefix && /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-ui-email-input__prefix",
+      children: prefix
+    }), children]
+  }));
 };
 var CustomDropdownIndicator = function CustomDropdownIndicator(props) {
   var suffix = props.selectProps.suffix;
-  return suffix ? /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.DropdownIndicator, props, /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-email-input__suffix"
-  }, suffix)) : null;
+  return suffix ? /*#__PURE__*/jsxRuntime.jsx(reactSelectCreatable_esm.components.DropdownIndicator, _objectSpread$2(_objectSpread$2({}, props), {}, {
+    children: /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-ui-email-input__suffix",
+      children: suffix
+    })
+  })) : null;
 };
 var MultiValueRemove = function MultiValueRemove(props) {
-  return /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.MultiValueRemove, _extends({}, props, {
-    innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "".concat(index.hyphenize(props.data.label), "-remove-icon")))
-  }), /*#__PURE__*/React.createElement(neetoIcons.Close, {
-    size: 16
+  return /*#__PURE__*/jsxRuntime.jsx(reactSelectCreatable_esm.components.MultiValueRemove, _objectSpread$2(_objectSpread$2({}, props), {}, {
+    innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "".concat(index.hyphenize(props.data.label), "-remove-icon"))),
+    children: /*#__PURE__*/jsxRuntime.jsx(Close, {
+      size: 16
+    })
   }));
 };
 var CustomValueContainer = function CustomValueContainer(_ref2) {
@@ -124,23 +132,25 @@ var CustomValueContainer = function CustomValueContainer(_ref2) {
     firstChild = _children[0],
     rest = _children.slice(1);
   var shouldCollapse = !isAlwaysExpanded && !isFocused && value.length > visibleEmailsCount;
-  return /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.ValueContainer, _extends({}, props, {
-    innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "multi-email-input-container"))
-  }), shouldCollapse ? firstChild.slice(0, visibleEmailsCount) : firstChild, shouldCollapse && /*#__PURE__*/React.createElement(Tag, {
-    label: "".concat(value.length - visibleEmailsCount, " more"),
-    style: "secondary"
-  }), rest);
+  return /*#__PURE__*/jsxRuntime.jsxs(reactSelectCreatable_esm.components.ValueContainer, _objectSpread$2(_objectSpread$2({}, props), {}, {
+    innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "multi-email-input-container")),
+    children: [shouldCollapse ? firstChild.slice(0, visibleEmailsCount) : firstChild, shouldCollapse && /*#__PURE__*/jsxRuntime.jsx(Tag, {
+      label: "".concat(value.length - visibleEmailsCount, " more"),
+      style: "secondary"
+    }), rest]
+  }));
 };
 var CustomClearIndicator = function CustomClearIndicator(props) {
-  return /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.ClearIndicator, _extends({}, props, {
-    innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "clear-all-button"))
-  }), /*#__PURE__*/React.createElement(neetoIcons.Close, {
-    className: "cursor-pointer",
-    size: 16
+  return /*#__PURE__*/jsxRuntime.jsx(reactSelectCreatable_esm.components.ClearIndicator, _objectSpread$2(_objectSpread$2({}, props), {}, {
+    innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "clear-all-button")),
+    children: /*#__PURE__*/jsxRuntime.jsx(Close, {
+      className: "cursor-pointer",
+      size: 16
+    })
   }));
 };
 var SelectContainer = function SelectContainer(props) {
-  return /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.SelectContainer, _extends({}, props, {
+  return /*#__PURE__*/jsxRuntime.jsx(reactSelectCreatable_esm.components.SelectContainer, _objectSpread$2(_objectSpread$2({}, props), {}, {
     innerProps: _objectSpread$2(_objectSpread$2({}, props.innerProps), {}, _defineProperty({}, "data-cy", "multi-email-select-container"))
   }));
 };
@@ -149,12 +159,12 @@ var Input = function Input(props) {
     var handleEmailChange = props.selectProps.handleEmailChange;
     var text = event.clipboardData.getData("Text");
     if (!EMAIL_REGEX.test(text)) return;
-    event === null || event === void 0 || event.preventDefault();
+    event === null || event === void 0 ? void 0 : event.preventDefault();
     setTimeout(function () {
       return handleEmailChange(text);
     });
   };
-  return /*#__PURE__*/React.createElement(reactSelectCreatable_esm.components.Input, _extends({}, props, {
+  return /*#__PURE__*/jsxRuntime.jsx(reactSelectCreatable_esm.components.Input, _objectSpread$2(_objectSpread$2({}, props), {}, {
     "data-cy": "email-select-input-field",
     onPaste: handlePaste
   }));
@@ -183,8 +193,8 @@ var CUSTOM_COMPONENTS = {
 };
 
 var _excluded$1 = ["label", "value"];
-function ownKeys$1(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$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var getEmailsMap = function getEmailsMap() {
   var inputEmails = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
@@ -253,8 +263,8 @@ var renderDuplicateEmailsWarningMessage = function renderDuplicateEmailsWarningM
 };
 
 var _excluded = ["label", "placeholder", "helpText", "value", "onChange", "error", "onBlur", "filterInvalidEmails", "counter", "disabled", "maxHeight", "required", "labelProps", "visibleEmailsCount", "isCreateable", "isAlwaysExpanded"];
-function ownKeys(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(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$label = _ref.label,
     label = _ref$label === void 0 ? "Email(s)" : _ref$label,
@@ -353,7 +363,7 @@ var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       duplicates = _pruneDuplicates2.duplicates;
     onChange(uniqueEmails);
     setDuplicateEmails(duplicates);
-    otherProps === null || otherProps === void 0 || (_otherProps$onCreateO = otherProps.onCreateOption) === null || _otherProps$onCreateO === void 0 || _otherProps$onCreateO.call(otherProps, input);
+    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) {
     inputValue ? handleEmailChange(inputValue) : onBlur(event);
@@ -377,68 +387,77 @@ var MultiEmailInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     };
   }
   var isFilterEmailsLinkVisible = !!filterInvalidEmails && value.length > getValidEmailsCount(value);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: "neeto-ui-input__wrapper neeto-ui-email-input__wrapper",
-    "data-cy": "email-input-wrapper"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-email-input__label-wrapper"
-  }, label && /*#__PURE__*/React.createElement(Label, _extends({
-    required: required,
-    className: "neeto-ui-email-input__label",
-    "data-cy": "".concat(index.hyphenize(label), "-input-label")
-  }, labelProps), label), isCounterVisible && /*#__PURE__*/React.createElement("p", {
-    className: "neeto-ui-email-input__counter",
-    "data-cy": "".concat(index.hyphenize(label), "-email-counter")
-  }, getValidEmailsCount(value), " ", counter.label ? counter.label : renderDefaultText(getValidEmailsCount(value)))), /*#__PURE__*/React.createElement(reactSelectCreatable_esm.CreatableSelect, _extends({
-    isMulti: true,
-    required: true,
-    classNamePrefix: "neeto-ui-react-select",
-    components: CUSTOM_COMPONENTS,
-    isDisabled: disabled,
-    menuIsOpen: isMenuOpen,
-    className: classnames("neeto-ui-react-select__container neeto-ui-react-select__container--medium neeto-ui-email-input__select", {
-      "neeto-ui-react-select__container--error": !!error
-    }),
-    styles: _objectSpread(_objectSpread({}, CUSTOM_STYLES), {}, {
-      control: ramda.mergeLeft({
-        maxHeight: "".concat(maxHeight, "px"),
-        overflowY: "auto"
-      })
-    }),
-    onBlur: handleBlur,
-    onFocus: function onFocus() {
-      return setIsFocused(true);
-    },
-    onKeyDown: handleKeyDown,
-    onInputChange: function onInputChange(inputValue) {
-      setIsMenuOpen(Boolean(inputValue));
-      setInputValue(inputValue);
-    }
-  }, _objectSpread(_objectSpread(_objectSpread({
-    handleEmailChange: handleEmailChange,
-    inputValue: inputValue,
-    isAlwaysExpanded: isAlwaysExpanded,
-    isFocused: isFocused,
-    onChange: onChange,
-    placeholder: placeholder,
-    ref: ref,
-    value: value,
-    visibleEmailsCount: visibleEmailsCount
-  }, !isOptionsPresent && {
-    menuIsOpen: false
-  }), otherProps), overrideProps))), !!error && /*#__PURE__*/React.createElement("p", {
-    className: "neeto-ui-input__error",
-    "data-cy": "".concat(index.hyphenize(label), "-input-error")
-  }, error, isFilterEmailsLinkVisible && /*#__PURE__*/React.createElement("span", {
-    className: "neeto-ui-font-semibold cursor-pointer",
-    onClick: handleFilterEmails
-  }, "\xA0", filterInvalidEmails.label ? filterInvalidEmails.label : "Click here to remove invalid emails.")), !!helpText && /*#__PURE__*/React.createElement("p", {
-    className: "neeto-ui-input__help-text",
-    "data-cy": "".concat(index.hyphenize(label), "-input-help")
-  }, helpText), !!duplicateEmails.length && /*#__PURE__*/React.createElement("p", {
-    className: "neeto-ui-input__error",
-    "data-cy": "".concat(index.hyphenize(label), "-duplicate-emails-warning")
-  }, renderDuplicateEmailsWarningMessage(duplicateEmails)));
+    "data-cy": "email-input-wrapper",
+    children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "neeto-ui-email-input__label-wrapper",
+      children: [label && /*#__PURE__*/jsxRuntime.jsx(Label, _objectSpread(_objectSpread({
+        required: required,
+        className: "neeto-ui-email-input__label",
+        "data-cy": "".concat(index.hyphenize(label), "-input-label")
+      }, labelProps), {}, {
+        children: label
+      })), isCounterVisible && /*#__PURE__*/jsxRuntime.jsxs("p", {
+        className: "neeto-ui-email-input__counter",
+        "data-cy": "".concat(index.hyphenize(label), "-email-counter"),
+        children: [getValidEmailsCount(value), " ", counter.label ? counter.label : renderDefaultText(getValidEmailsCount(value))]
+      })]
+    }), /*#__PURE__*/jsxRuntime.jsx(reactSelectCreatable_esm.CreatableSelect, _objectSpread({
+      isMulti: true,
+      required: true,
+      classNamePrefix: "neeto-ui-react-select",
+      components: CUSTOM_COMPONENTS,
+      isDisabled: disabled,
+      menuIsOpen: isMenuOpen,
+      className: classnames("neeto-ui-react-select__container neeto-ui-react-select__container--medium neeto-ui-email-input__select", {
+        "neeto-ui-react-select__container--error": !!error
+      }),
+      styles: _objectSpread(_objectSpread({}, CUSTOM_STYLES), {}, {
+        control: ramda.mergeLeft({
+          maxHeight: "".concat(maxHeight, "px"),
+          overflowY: "auto"
+        })
+      }),
+      onBlur: handleBlur,
+      onFocus: function onFocus() {
+        return setIsFocused(true);
+      },
+      onKeyDown: handleKeyDown,
+      onInputChange: function onInputChange(inputValue) {
+        setIsMenuOpen(Boolean(inputValue));
+        setInputValue(inputValue);
+      }
+    }, _objectSpread(_objectSpread(_objectSpread({
+      handleEmailChange: handleEmailChange,
+      inputValue: inputValue,
+      isAlwaysExpanded: isAlwaysExpanded,
+      isFocused: isFocused,
+      onChange: onChange,
+      placeholder: placeholder,
+      ref: ref,
+      value: value,
+      visibleEmailsCount: visibleEmailsCount
+    }, !isOptionsPresent && {
+      menuIsOpen: false
+    }), otherProps), overrideProps))), !!error && /*#__PURE__*/jsxRuntime.jsxs("p", {
+      className: "neeto-ui-input__error",
+      "data-cy": "".concat(index.hyphenize(label), "-input-error"),
+      children: [error, isFilterEmailsLinkVisible && /*#__PURE__*/jsxRuntime.jsxs("span", {
+        className: "neeto-ui-font-semibold cursor-pointer",
+        onClick: handleFilterEmails,
+        children: ["\xA0", filterInvalidEmails.label ? filterInvalidEmails.label : "Click here to remove invalid emails."]
+      })]
+    }), !!helpText && /*#__PURE__*/jsxRuntime.jsx("p", {
+      className: "neeto-ui-input__help-text",
+      "data-cy": "".concat(index.hyphenize(label), "-input-help"),
+      children: helpText
+    }), !!duplicateEmails.length && /*#__PURE__*/jsxRuntime.jsx("p", {
+      className: "neeto-ui-input__error",
+      "data-cy": "".concat(index.hyphenize(label), "-duplicate-emails-warning"),
+      children: renderDuplicateEmailsWarningMessage(duplicateEmails)
+    })]
+  });
 });
 MultiEmailInput.displayName = "MultiEmailInput";