@popsure/dirty-swan 0.28.9 → 0.28.10

package/dist/cjs/lib/components/modal/hooks/useOnClose.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
-declare const useOnClose: (onClose: () => void, isOpen: boolean, dismissable: boolean) => {
+interface OnCloseReturn {
     isClosing: boolean;
-    handleContainerClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    handleContainerClick: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     handleOnClose: () => void;
-};
+    handleOnOverlayClick: () => void;
+}
+declare const useOnClose: (onClose: () => void, isOpen: boolean, dismissable: boolean) => OnCloseReturn;
 export default useOnClose;

package/dist/esm/components/modal/bottomModal/index.js

@@ -2,7 +2,7 @@ import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useState, useCallback } from 'react';
 import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
-import { u as useOnClose } from '../../../useOnClose-54f9e6b9.js';
+import { u as useOnClose } from '../../../useOnClose-d818a54f.js';
 
 var css_248z = "@keyframes style-module_fade-in__1GZgs {\n  0% {\n    background-color: rgba(0, 0, 0, 0);\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.3);\n  }\n}\n@keyframes style-module_fade-out__30Bns {\n  from {\n    background-color: rgba(0, 0, 0, 0.3);\n  }\n  to {\n    background-color: rgba(0, 0, 0, 0);\n  }\n}\n@keyframes style-module_appear-in__3U2lu {\n  0% {\n    transform: translateY(100%);\n  }\n  80% {\n    transform: translateY(-2%);\n  }\n  100% {\n    transform: translateY(0);\n  }\n}\n@keyframes style-module_disappear-out__6pOVr {\n  0% {\n    transform: translateY(0);\n  }\n  100% {\n    transform: translateY(100%);\n  }\n}\n.style-module_close__1GERU {\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n}\n\n.style-module_overlay__AlX2J, .style-module_overlay--close__3E9GY {\n  position: fixed;\n  z-index: 100;\n  overflow: auto;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  animation: style-module_fade-in__1GZgs 0.3s both;\n}\n.style-module_overlay--close__3E9GY {\n  animation-delay: 0.1s;\n  animation: style-module_fade-out__30Bns 0.3s both;\n}\n\n.style-module_container__aOENo, .style-module_container--close__K506c {\n  position: relative;\n  background-color: white;\n  border-top-left-radius: 8px;\n  border-top-right-radius: 8px;\n  width: 100%;\n  animation-name: style-module_appear-in__3U2lu;\n  animation-duration: 0.4s;\n  animation-fill-mode: both;\n  animation-timing-function: ease-out;\n  top: 0;\n}\n.style-module_container--close__K506c {\n  animation-name: style-module_disappear-out__6pOVr;\n  animation-duration: 0.4s;\n  animation-delay: 0s;\n  animation-fill-mode: both;\n  animation-timing-function: ease-out;\n}\n\n.style-module_header__10iiH {\n  height: 60px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0 16px;\n}";
 var styles = {"close":"style-module_close__1GERU","overlay":"style-module_overlay__AlX2J","overlay--close":"style-module_overlay--close__3E9GY","fade-in":"style-module_fade-in__1GZgs","fade-out":"style-module_fade-out__30Bns","container":"style-module_container__aOENo","container--close":"style-module_container--close__K506c","appear-in":"style-module_appear-in__3U2lu","disappear-out":"style-module_disappear-out__6pOVr","header":"style-module_header__10iiH"};
@@ -13,7 +13,7 @@ var imageClose = "data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%
 var BottomModal = (function (_a) {
     var title = _a.title, isOpen = _a.isOpen, children = _a.children, onClose = _a.onClose, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.dismissible, dismissible = _c === void 0 ? true : _c;
     var _d = useState(0), containerXOffset = _d[0], setContainerXOffset = _d[1];
-    var _e = useOnClose(onClose, isOpen, dismissible), isClosing = _e.isClosing, handleContainerClick = _e.handleContainerClick, handleOnClose = _e.handleOnClose;
+    var _e = useOnClose(onClose, isOpen, dismissible), isClosing = _e.isClosing, handleContainerClick = _e.handleContainerClick, handleOnClose = _e.handleOnClose, handleOnOverlayClick = _e.handleOnOverlayClick;
     var containerRef = useCallback(function (node) {
         if (node !== null) {
             setContainerXOffset(Math.max(window.innerHeight * 0.1, window.innerHeight - node.getBoundingClientRect().height));
@@ -22,7 +22,7 @@ var BottomModal = (function (_a) {
     if (!isOpen) {
         return jsx(Fragment, {}, void 0);
     }
-    return (jsx("div", __assign({ className: isClosing ? styles['overlay--close'] : styles.overlay, onClick: handleOnClose }, { children: jsxs("div", __assign({ className: (isClosing ? styles['container--close'] : styles.container) + " " + className, ref: containerRef, style: { top: containerXOffset + "px" }, onClick: handleContainerClick }, { children: [jsxs("div", __assign({ className: styles.header }, { children: [jsx("div", __assign({ className: "p-h4 " + styles.title }, { children: title }), void 0),
+    return (jsx("div", __assign({ className: isClosing ? styles['overlay--close'] : styles.overlay, onClick: handleOnOverlayClick }, { children: jsxs("div", __assign({ className: (isClosing ? styles['container--close'] : styles.container) + " " + className, ref: containerRef, style: { top: containerXOffset + "px" }, onClick: handleContainerClick }, { children: [jsxs("div", __assign({ className: styles.header }, { children: [jsx("div", __assign({ className: "p-h4 " + styles.title }, { children: title }), void 0),
                         dismissible && (jsx("button", __assign({ type: "button", className: styles.close, onClick: handleOnClose }, { children: jsx("img", { src: imageClose, alt: "Close" }, void 0) }), void 0))] }), void 0),
                 jsx("div", __assign({ className: styles.content }, { children: children }), void 0)] }), void 0) }), void 0));
 });

package/dist/esm/components/modal/bottomModal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/modal/bottomModal/img/close.svg","../../../../../../src/lib/components/modal/bottomModal/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","import React, { useState, useCallback } from 'react';\n\nimport { Props } from '..';\nimport styles from './style.module.scss';\n\nimport imageClose from './img/close.svg';\nimport useOnClose from '../hooks/useOnClose';\n\nexport default ({\n  title,\n  isOpen,\n  children,\n  onClose,\n  className = '',\n  dismissible = true,\n}: Props) => {\n  const [containerXOffset, setContainerXOffset] = useState(0);\n  const { isClosing, handleContainerClick, handleOnClose } = useOnClose(\n    onClose,\n    isOpen,\n    dismissible\n  );\n\n  const containerRef = useCallback((node: HTMLDivElement) => {\n    if (node !== null) {\n      setContainerXOffset(\n        Math.max(\n          window.innerHeight * 0.1,\n          window.innerHeight - node.getBoundingClientRect().height\n        )\n      );\n    }\n  }, []);\n\n  if (!isOpen) {\n    return <></>;\n  }\n\n  return (\n    <div\n      className={isClosing ? styles['overlay--close'] : styles.overlay}\n      onClick={handleOnClose}\n    >\n      <div\n        className={`${\n          isClosing ? styles['container--close'] : styles.container\n        } ${className}`}\n        ref={containerRef}\n        style={{ top: `${containerXOffset}px` }}\n        onClick={handleContainerClick}\n      >\n        <div className={styles.header}>\n          <div className={`p-h4 ${styles.title}`}>{title}</div>\n          {dismissible && (\n            <button\n              type=\"button\"\n              className={styles.close}\n              onClick={handleOnClose}\n            >\n              <img src={imageClose} alt=\"Close\" />\n            </button>\n          )}\n        </div>\n        <div className={styles.content}>{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;AAAA,iBAAe;;ACQf,mBAAe,UAAC,EAOR;QANN,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAA0C,QAAQ,CAAC,CAAC,CAAC,EAApD,gBAAgB,QAAA,EAAE,mBAAmB,QAAe,CAAC;IACtD,IAAA,KAAqD,UAAU,CACnE,OAAO,EACP,MAAM,EACN,WAAW,CACZ,EAJO,SAAS,eAAA,EAAE,oBAAoB,0BAAA,EAAE,aAAa,mBAIrD,CAAC;IAEF,IAAM,YAAY,GAAG,WAAW,CAAC,UAAC,IAAoB;QACpD,IAAI,IAAI,KAAK,IAAI,EAAE;YACjB,mBAAmB,CACjB,IAAI,CAAC,GAAG,CACN,MAAM,CAAC,WAAW,GAAG,GAAG,EACxB,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC,MAAM,CACzD,CACF,CAAC;SACH;KACF,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,MAAM,EAAE;QACX,OAAOA,yBAAK,CAAC;KACd;IAED,QACEA,sBACE,SAAS,EAAE,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,EAChE,OAAO,EAAE,aAAa,gBAEtBC,uBACE,SAAS,EAAE,CACT,SAAS,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAC,SAAS,UACvD,SAAW,EACf,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,EAAE,GAAG,EAAK,gBAAgB,OAAI,EAAE,EACvC,OAAO,EAAE,oBAAoB,iBAE7BA,uBAAK,SAAS,EAAE,MAAM,CAAC,MAAM,iBAC3BD,sBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,KAAO,gBAAG,KAAK,YAAO;wBACpD,WAAW,KACVA,yBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,gBAEtBA,aAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,OAAO,WAAG,YAC7B,CACV,aACG;gBACNA,sBAAK,SAAS,EAAE,MAAM,CAAC,OAAO,gBAAG,QAAQ,YAAO,aAC5C,YACF,EACN;AACJ,CAAC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/modal/bottomModal/img/close.svg","../../../../../../src/lib/components/modal/bottomModal/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","import React, { useState, useCallback } from 'react';\n\nimport { Props } from '..';\nimport styles from './style.module.scss';\n\nimport imageClose from './img/close.svg';\nimport useOnClose from '../hooks/useOnClose';\n\nexport default ({\n  title,\n  isOpen,\n  children,\n  onClose,\n  className = '',\n  dismissible = true,\n}: Props) => {\n  const [containerXOffset, setContainerXOffset] = useState(0);\n  const {\n    isClosing,\n    handleContainerClick,\n    handleOnClose,\n    handleOnOverlayClick\n   } = useOnClose(\n    onClose,\n    isOpen,\n    dismissible\n  );\n\n  const containerRef = useCallback((node: HTMLDivElement) => {\n    if (node !== null) {\n      setContainerXOffset(\n        Math.max(\n          window.innerHeight * 0.1,\n          window.innerHeight - node.getBoundingClientRect().height\n        )\n      );\n    }\n  }, []);\n\n  if (!isOpen) {\n    return <></>;\n  }\n\n  return (\n    <div\n      className={isClosing ? styles['overlay--close'] : styles.overlay}\n      onClick={handleOnOverlayClick}\n    >\n      <div\n        className={`${\n          isClosing ? styles['container--close'] : styles.container\n        } ${className}`}\n        ref={containerRef}\n        style={{ top: `${containerXOffset}px` }}\n        onClick={handleContainerClick}\n      >\n        <div className={styles.header}>\n          <div className={`p-h4 ${styles.title}`}>{title}</div>\n          {dismissible && (\n            <button\n              type=\"button\"\n              className={styles.close}\n              onClick={handleOnClose}\n            >\n              <img src={imageClose} alt=\"Close\" />\n            </button>\n          )}\n        </div>\n        <div className={styles.content}>{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;AAAA,iBAAe;;ACQf,mBAAe,UAAC,EAOR;QANN,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAA0C,QAAQ,CAAC,CAAC,CAAC,EAApD,gBAAgB,QAAA,EAAE,mBAAmB,QAAe,CAAC;IACtD,IAAA,KAKD,UAAU,CACb,OAAO,EACP,MAAM,EACN,WAAW,CACZ,EARC,SAAS,eAAA,EACT,oBAAoB,0BAAA,EACpB,aAAa,mBAAA,EACb,oBAAoB,0BAKrB,CAAC;IAEF,IAAM,YAAY,GAAG,WAAW,CAAC,UAAC,IAAoB;QACpD,IAAI,IAAI,KAAK,IAAI,EAAE;YACjB,mBAAmB,CACjB,IAAI,CAAC,GAAG,CACN,MAAM,CAAC,WAAW,GAAG,GAAG,EACxB,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC,MAAM,CACzD,CACF,CAAC;SACH;KACF,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,MAAM,EAAE;QACX,OAAOA,yBAAK,CAAC;KACd;IAED,QACEA,sBACE,SAAS,EAAE,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,EAChE,OAAO,EAAE,oBAAoB,gBAE7BC,uBACE,SAAS,EAAE,CACT,SAAS,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAC,SAAS,UACvD,SAAW,EACf,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,EAAE,GAAG,EAAK,gBAAgB,OAAI,EAAE,EACvC,OAAO,EAAE,oBAAoB,iBAE7BA,uBAAK,SAAS,EAAE,MAAM,CAAC,MAAM,iBAC3BD,sBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,KAAO,gBAAG,KAAK,YAAO;wBACpD,WAAW,KACVA,yBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,gBAEtBA,aAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,OAAO,WAAG,YAC7B,CACV,aACG;gBACNA,sBAAK,SAAS,EAAE,MAAM,CAAC,OAAO,gBAAG,QAAQ,YAAO,aAC5C,YACF,EACN;AACJ,CAAC;;;;"}

package/dist/esm/components/modal/bottomOrRegularModal/index.js

@@ -4,7 +4,7 @@ import { useRef, useState, useEffect } from 'react';
 import BottomModal from '../bottomModal/index.js';
 import RegularModal from '../regularModal/index.js';
 import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
-import '../../../useOnClose-54f9e6b9.js';
+import '../../../useOnClose-d818a54f.js';
 
 var css_248z = "@media (min-width: 34rem) {\n  .style-module_mobile__3k175 {\n    display: none;\n  }\n}\n@media (max-width: 34rem) {\n  .style-module_mobile__3k175 {\n    display: block !important;\n  }\n}\n\n@media (max-width: 34rem) {\n  .style-module_desktop__2lclr {\n    display: none;\n  }\n}";
 var styles = {"mobile":"style-module_mobile__3k175","desktop":"style-module_desktop__2lclr"};

package/dist/esm/components/modal/regularModal/index.js

@@ -1,10 +1,10 @@
 import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import { u as useOnClose } from '../../../useOnClose-54f9e6b9.js';
+import { u as useOnClose } from '../../../useOnClose-d818a54f.js';
 import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
 import 'react';
 
-var css_248z = "@keyframes style-module_fade-in__nLzzO {\n  0% {\n    background-color: rgba(0, 0, 0, 0);\n    visibility: hidden;\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.3);\n    visibility: visible;\n  }\n}\n@keyframes style-module_fade-out__IuSV7 {\n  from {\n    background-color: rgba(0, 0, 0, 0.3);\n    visibility: visible;\n  }\n  to {\n    background-color: rgba(0, 0, 0, 0);\n    visibility: hidden;\n  }\n}\n@keyframes style-module_appear-in__2ZMqz {\n  0% {\n    transform: translateY(24px);\n    opacity: 0;\n    visibility: hidden;\n  }\n  100% {\n    transform: translateY(0);\n    opacity: 1;\n    visibility: visible;\n  }\n}\n@keyframes style-module_disappear-out__38TSV {\n  0% {\n    transform: translateY(0);\n    opacity: 1;\n    visibility: visible;\n  }\n  100% {\n    transform: translateY(24px);\n    opacity: 0;\n    visibility: hidden;\n  }\n}\n.style-module_overlay__1Zbce, .style-module_overlay--close__2dytn {\n  position: fixed;\n  z-index: 100;\n  overflow: auto;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  animation: style-module_fade-in__nLzzO 0.3s both;\n}\n.style-module_overlay--close__2dytn {\n  animation-delay: 0.1s;\n  animation: style-module_fade-out__IuSV7 0.3s both;\n}\n\n.style-module_container__1XZj_, .style-module_container--close__3UYsJ {\n  position: relative;\n  display: flex;\n  align-items: center;\n  max-width: 592px;\n  width: 100%;\n  min-height: 100%;\n  margin: 0 auto;\n  animation-name: style-module_appear-in__2ZMqz;\n  animation-duration: 0.4s;\n  animation-fill-mode: both;\n  animation-timing-function: ease-out;\n}\n.style-module_container--close__3UYsJ {\n  animation-name: style-module_disappear-out__38TSV;\n  animation-duration: 0.4s;\n  animation-delay: 0s;\n  animation-fill-mode: both;\n  animation-timing-function: ease-out;\n}\n\n.style-module_body__lbUih {\n  background-color: white;\n  border-radius: 8px;\n  margin: 32px auto;\n}\n\n.style-module_header__2oEKp {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 24px 24px 0 24px;\n}\n\n.style-module_close__p3Axi {\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n}";
+var css_248z = "@keyframes style-module_fade-in__nLzzO {\n  0% {\n    background-color: rgba(0, 0, 0, 0);\n    visibility: hidden;\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.3);\n    visibility: visible;\n  }\n}\n@keyframes style-module_fade-out__IuSV7 {\n  from {\n    background-color: rgba(0, 0, 0, 0.3);\n    visibility: visible;\n  }\n  to {\n    background-color: rgba(0, 0, 0, 0);\n    visibility: hidden;\n  }\n}\n@keyframes style-module_appear-in__2ZMqz {\n  0% {\n    transform: translateY(24px);\n    opacity: 0;\n    visibility: hidden;\n  }\n  100% {\n    transform: translateY(0);\n    opacity: 1;\n    visibility: visible;\n  }\n}\n@keyframes style-module_disappear-out__38TSV {\n  0% {\n    transform: translateY(0);\n    opacity: 1;\n    visibility: visible;\n  }\n  100% {\n    transform: translateY(24px);\n    opacity: 0;\n    visibility: hidden;\n  }\n}\n.style-module_overlay__1Zbce, .style-module_overlay--close__2dytn {\n  position: fixed;\n  z-index: 100;\n  overflow: auto;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  animation: style-module_fade-in__nLzzO 0.3s both;\n}\n.style-module_overlay--close__2dytn {\n  animation-delay: 0.1s;\n  animation: style-module_fade-out__IuSV7 0.3s both;\n}\n\n.style-module_container__1XZj_, .style-module_container--close__3UYsJ {\n  position: relative;\n  display: flex;\n  align-items: center;\n  max-width: 592px;\n  width: 100%;\n  min-height: 100%;\n  margin: 0 auto;\n  animation-name: style-module_appear-in__2ZMqz;\n  animation-duration: 0.4s;\n  animation-fill-mode: both;\n  animation-timing-function: ease-out;\n}\n.style-module_container--close__3UYsJ {\n  animation-name: style-module_disappear-out__38TSV;\n  animation-duration: 0.4s;\n  animation-delay: 0s;\n  animation-fill-mode: both;\n  animation-timing-function: ease-out;\n}\n\n.style-module_body__lbUih {\n  background-color: white;\n  border-radius: 8px;\n  margin: 80px auto;\n}\n\n.style-module_header__2oEKp {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 24px 24px 0 24px;\n}\n\n.style-module_close__p3Axi {\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n}";
 var styles = {"overlay":"style-module_overlay__1Zbce","overlay--close":"style-module_overlay--close__2dytn","fade-in":"style-module_fade-in__nLzzO","fade-out":"style-module_fade-out__IuSV7","container":"style-module_container__1XZj_","container--close":"style-module_container--close__3UYsJ","appear-in":"style-module_appear-in__2ZMqz","disappear-out":"style-module_disappear-out__38TSV","body":"style-module_body__lbUih","header":"style-module_header__2oEKp","close":"style-module_close__p3Axi"};
 styleInject(css_248z);
 
@@ -12,11 +12,11 @@ var imageClose = "data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%
 
 var RegularModal = (function (_a) {
     var title = _a.title, isOpen = _a.isOpen, children = _a.children, onClose = _a.onClose, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.dismissible, dismissible = _c === void 0 ? true : _c;
-    var _d = useOnClose(onClose, isOpen, dismissible), isClosing = _d.isClosing, handleContainerClick = _d.handleContainerClick, handleOnClose = _d.handleOnClose;
+    var _d = useOnClose(onClose, isOpen, dismissible), isClosing = _d.isClosing, handleContainerClick = _d.handleContainerClick, handleOnClose = _d.handleOnClose, handleOnOverlayClick = _d.handleOnOverlayClick;
     if (!isOpen) {
         return jsx(Fragment, {}, void 0);
     }
-    return (jsx("div", __assign({ className: isClosing ? styles['overlay--close'] : styles.overlay, onClick: handleOnClose }, { children: jsx("div", __assign({ className: (isClosing ? styles['container--close'] : styles.container) + " " + className, onClick: handleContainerClick }, { children: jsxs("div", __assign({ className: styles.body }, { children: [jsxs("div", __assign({ className: styles.header }, { children: [jsx("div", __assign({ className: "p-h2 " + styles.title }, { children: title }), void 0),
+    return (jsx("div", __assign({ className: isClosing ? styles['overlay--close'] : styles.overlay, onClick: handleOnOverlayClick }, { children: jsx("div", __assign({ className: (isClosing ? styles['container--close'] : styles.container) + " " + className }, { children: jsxs("div", __assign({ className: styles.body, onClick: handleContainerClick }, { children: [jsxs("div", __assign({ className: styles.header }, { children: [jsx("div", __assign({ className: "p-h2 " + styles.title }, { children: title }), void 0),
                             dismissible && (jsx("button", __assign({ type: "button", className: styles.close, onClick: handleOnClose }, { children: jsx("img", { src: imageClose, alt: "Close" }, void 0) }), void 0))] }), void 0), children] }), void 0) }), void 0) }), void 0));
 });
 

package/dist/esm/components/modal/regularModal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/modal/regularModal/img/close.svg","../../../../../../src/lib/components/modal/regularModal/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","import React from 'react';\n\nimport { Props } from '..';\nimport useOnClose from '../hooks/useOnClose';\n\nimport styles from './style.module.scss';\n\nimport imageClose from './img/close.svg';\n\nexport default ({\n  title,\n  isOpen,\n  children,\n  onClose,\n  className = '',\n  dismissible = true,\n}: Props) => {\n  const { isClosing, handleContainerClick, handleOnClose } = useOnClose(\n    onClose,\n    isOpen,\n    dismissible\n  );\n\n  if (!isOpen) {\n    return <></>;\n  }\n\n  return (\n    <div\n      className={isClosing ? styles['overlay--close'] : styles.overlay}\n      onClick={handleOnClose}\n    >\n      <div\n        className={`${\n          isClosing ? styles['container--close'] : styles.container\n        } ${className}`}\n        onClick={handleContainerClick}\n      >\n        <div className={styles.body}>\n          <div className={styles.header}>\n            <div className={`p-h2 ${styles.title}`}>{title}</div>\n            {dismissible && (\n              <button\n                type=\"button\"\n                className={styles.close}\n                onClick={handleOnClose}\n              >\n                <img src={imageClose} alt=\"Close\" />\n              </button>\n            )}\n          </div>\n          {children}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;AAAA,iBAAe;;ACSf,oBAAe,UAAC,EAOR;QANN,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAAqD,UAAU,CACnE,OAAO,EACP,MAAM,EACN,WAAW,CACZ,EAJO,SAAS,eAAA,EAAE,oBAAoB,0BAAA,EAAE,aAAa,mBAIrD,CAAC;IAEF,IAAI,CAAC,MAAM,EAAE;QACX,OAAOA,yBAAK,CAAC;KACd;IAED,QACEA,sBACE,SAAS,EAAE,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,EAChE,OAAO,EAAE,aAAa,gBAEtBA,sBACE,SAAS,EAAE,CACT,SAAS,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAC,SAAS,UACvD,SAAW,EACf,OAAO,EAAE,oBAAoB,gBAE7BC,uBAAK,SAAS,EAAE,MAAM,CAAC,IAAI,iBACzBA,uBAAK,SAAS,EAAE,MAAM,CAAC,MAAM,iBAC3BD,sBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,KAAO,gBAAG,KAAK,YAAO;4BACpD,WAAW,KACVA,yBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,gBAEtBA,aAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,OAAO,WAAG,YAC7B,CACV,aACG,EACL,QAAQ,aACL,YACF,YACF,EACN;AACJ,CAAC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/modal/regularModal/img/close.svg","../../../../../../src/lib/components/modal/regularModal/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","import React from 'react';\n\nimport { Props } from '..';\nimport useOnClose from '../hooks/useOnClose';\n\nimport styles from './style.module.scss';\n\nimport imageClose from './img/close.svg';\n\nexport default ({\n  title,\n  isOpen,\n  children,\n  onClose,\n  className = '',\n  dismissible = true,\n}: Props) => {\n  const {\n    isClosing,\n    handleContainerClick,\n    handleOnClose,\n    handleOnOverlayClick\n  } = useOnClose(\n    onClose,\n    isOpen,\n    dismissible\n  );\n\n  if (!isOpen) {\n    return <></>;\n  }\n\n  return (\n    <div\n      className={isClosing ? styles['overlay--close'] : styles.overlay}\n      onClick={handleOnOverlayClick}\n    >\n      <div\n        className={`${\n          isClosing ? styles['container--close'] : styles.container\n        } ${className}`}\n      >\n        <div\n          className={styles.body}\n          onClick={handleContainerClick}\n        >\n          <div className={styles.header}>\n            <div className={`p-h2 ${styles.title}`}>{title}</div>\n            {dismissible && (\n              <button\n                type=\"button\"\n                className={styles.close}\n                onClick={handleOnClose}\n              >\n                <img src={imageClose} alt=\"Close\" />\n              </button>\n            )}\n          </div>\n          {children}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;AAAA,iBAAe;;ACSf,oBAAe,UAAC,EAOR;QANN,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAKF,UAAU,CACZ,OAAO,EACP,MAAM,EACN,WAAW,CACZ,EARC,SAAS,eAAA,EACT,oBAAoB,0BAAA,EACpB,aAAa,mBAAA,EACb,oBAAoB,0BAKrB,CAAC;IAEF,IAAI,CAAC,MAAM,EAAE;QACX,OAAOA,yBAAK,CAAC;KACd;IAED,QACEA,sBACE,SAAS,EAAE,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,EAChE,OAAO,EAAE,oBAAoB,gBAE7BA,sBACE,SAAS,EAAE,CACT,SAAS,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAC,SAAS,UACvD,SAAW,gBAEfC,uBACE,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,OAAO,EAAE,oBAAoB,iBAE7BA,uBAAK,SAAS,EAAE,MAAM,CAAC,MAAM,iBAC3BD,sBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,KAAO,gBAAG,KAAK,YAAO;4BACpD,WAAW,KACVA,yBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,gBAEtBA,aAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,OAAO,WAAG,YAC7B,CACV,aACG,EACL,QAAQ,aACL,YACF,YACF,EACN;AACJ,CAAC;;;;"}

package/dist/esm/index.js

@@ -34,7 +34,7 @@ import './index-fb46adf9.js';
 import './index-dd80248b.js';
 import './index-21239ab0.js';
 import './index-be398f1d.js';
-import './useOnClose-54f9e6b9.js';
+import './useOnClose-d818a54f.js';
 import './index-171a0108.js';
 import 'react-dom';
 import './components/comparisonTable/components/Chevron.js';

package/dist/esm/lib/components/modal/hooks/useOnClose.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
-declare const useOnClose: (onClose: () => void, isOpen: boolean, dismissable: boolean) => {
+interface OnCloseReturn {
     isClosing: boolean;
-    handleContainerClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    handleContainerClick: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     handleOnClose: () => void;
-};
+    handleOnOverlayClick: () => void;
+}
+declare const useOnClose: (onClose: () => void, isOpen: boolean, dismissable: boolean) => OnCloseReturn;
 export default useOnClose;

package/dist/esm/{useOnClose-54f9e6b9.js → useOnClose-d818a54f.js}

@@ -9,6 +9,12 @@ var useOnClose = function (onClose, isOpen, dismissable) {
             setIsClosing(false);
         }, 300);
     }, [setIsClosing, onClose]);
+    var handleOnOverlayClick = useCallback(function () {
+        if (!dismissable) {
+            return;
+        }
+        handleOnClose();
+    }, [dismissable, handleOnClose]);
     var handleEscKey = useCallback(function (e) {
         if (e.code !== 'Escape')
             return;
@@ -33,8 +39,8 @@ var useOnClose = function (onClose, isOpen, dismissable) {
     var handleContainerClick = function (e) {
         e.stopPropagation();
     };
-    return { isClosing: isClosing, handleContainerClick: handleContainerClick, handleOnClose: handleOnClose };
+    return { isClosing: isClosing, handleContainerClick: handleContainerClick, handleOnClose: handleOnClose, handleOnOverlayClick: handleOnOverlayClick };
 };
 
 export { useOnClose as u };
-//# sourceMappingURL=useOnClose-54f9e6b9.js.map
+//# sourceMappingURL=useOnClose-d818a54f.js.map

package/dist/esm/useOnClose-d818a54f.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnClose-d818a54f.js","sources":["../../../src/lib/components/modal/hooks/useOnClose.ts"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\n\ninterface OnCloseReturn {\n  isClosing: boolean;\n  handleContainerClick: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n  handleOnClose: () => void;\n  handleOnOverlayClick: () => void;\n}\n\nconst useOnClose = (\n  onClose: () => void,\n  isOpen: boolean,\n  dismissable: boolean\n): OnCloseReturn => {\n  const [isClosing, setIsClosing] = useState(false);\n\n  const handleOnClose = useCallback(() => {\n    setIsClosing(true);\n    setTimeout(() => {\n      onClose();\n      setIsClosing(false);\n    }, 300);\n  }, [setIsClosing, onClose]);\n\n  const handleOnOverlayClick = useCallback(() => {\n    if (!dismissable) {\n      return;\n    }\n\n    handleOnClose();\n  }, [dismissable, handleOnClose]);\n\n  const handleEscKey = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.code !== 'Escape') return;\n      if (!dismissable) return null;\n      if (!isOpen) return null;\n\n      handleOnClose();\n    },\n    [isOpen, dismissable, handleOnClose]\n  );\n\n  useEffect(() => {\n    window.addEventListener('keydown', handleEscKey);\n\n    return () => {\n      window.removeEventListener('keydown', handleEscKey);\n    };\n  }, [handleEscKey]);\n\n  useEffect(() => {\n    document.body.style.overflow = isOpen ? 'hidden' : 'auto';\n\n    return () => {\n      document.body.style.overflow = 'auto';\n    };\n  }, [isOpen]);\n\n  const handleContainerClick = (\n    e: React.MouseEvent<HTMLDivElement, MouseEvent>\n  ) => {\n    e.stopPropagation();\n  };\n\n  return { isClosing, handleContainerClick, handleOnClose, handleOnOverlayClick };\n};\n\nexport default useOnClose;\n"],"names":[],"mappings":";;IASM,UAAU,GAAG,UACjB,OAAmB,EACnB,MAAe,EACf,WAAoB;IAEd,IAAA,KAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAC;IAElD,IAAM,aAAa,GAAG,WAAW,CAAC;QAChC,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,UAAU,CAAC;YACT,OAAO,EAAE,CAAC;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;SACrB,EAAE,GAAG,CAAC,CAAC;KACT,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC;IAE5B,IAAM,oBAAoB,GAAG,WAAW,CAAC;QACvC,IAAI,CAAC,WAAW,EAAE;YAChB,OAAO;SACR;QAED,aAAa,EAAE,CAAC;KACjB,EAAE,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC,CAAC;IAEjC,IAAM,YAAY,GAAG,WAAW,CAC9B,UAAC,CAAgB;QACf,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ;YAAE,OAAO;QAChC,IAAI,CAAC,WAAW;YAAE,OAAO,IAAI,CAAC;QAC9B,IAAI,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QAEzB,aAAa,EAAE,CAAC;KACjB,EACD,CAAC,MAAM,EAAE,WAAW,EAAE,aAAa,CAAC,CACrC,CAAC;IAEF,SAAS,CAAC;QACR,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC;QAEjD,OAAO;YACL,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC;SACrD,CAAC;KACH,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,SAAS,CAAC;QACR,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;QAE1D,OAAO;YACL,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,CAAC;SACvC,CAAC;KACH,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,IAAM,oBAAoB,GAAG,UAC3B,CAA+C;QAE/C,CAAC,CAAC,eAAe,EAAE,CAAC;KACrB,CAAC;IAEF,OAAO,EAAE,SAAS,WAAA,EAAE,oBAAoB,sBAAA,EAAE,aAAa,eAAA,EAAE,oBAAoB,sBAAA,EAAE,CAAC;AAClF;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.28.9",
+  "version": "0.28.10",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,

package/src/lib/components/modal/bottomModal/index.tsx

@@ -15,7 +15,12 @@ export default ({
   dismissible = true,
 }: Props) => {
   const [containerXOffset, setContainerXOffset] = useState(0);
-  const { isClosing, handleContainerClick, handleOnClose } = useOnClose(
+  const {
+    isClosing,
+    handleContainerClick,
+    handleOnClose,
+    handleOnOverlayClick
+   } = useOnClose(
     onClose,
     isOpen,
     dismissible
@@ -39,7 +44,7 @@ export default ({
   return (
     <div
       className={isClosing ? styles['overlay--close'] : styles.overlay}
-      onClick={handleOnClose}
+      onClick={handleOnOverlayClick}
     >
       <div
         className={`${

package/src/lib/components/modal/hooks/useOnClose.ts

@@ -1,10 +1,17 @@
 import React, { useCallback, useEffect, useState } from 'react';
 
+interface OnCloseReturn {
+  isClosing: boolean;
+  handleContainerClick: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+  handleOnClose: () => void;
+  handleOnOverlayClick: () => void;
+}
+
 const useOnClose = (
   onClose: () => void,
   isOpen: boolean,
   dismissable: boolean
-) => {
+): OnCloseReturn => {
   const [isClosing, setIsClosing] = useState(false);
 
   const handleOnClose = useCallback(() => {
@@ -15,6 +22,14 @@ const useOnClose = (
     }, 300);
   }, [setIsClosing, onClose]);
 
+  const handleOnOverlayClick = useCallback(() => {
+    if (!dismissable) {
+      return;
+    }
+
+    handleOnClose();
+  }, [dismissable, handleOnClose]);
+
   const handleEscKey = useCallback(
     (e: KeyboardEvent) => {
       if (e.code !== 'Escape') return;
@@ -48,7 +63,7 @@ const useOnClose = (
     e.stopPropagation();
   };
 
-  return { isClosing, handleContainerClick, handleOnClose };
+  return { isClosing, handleContainerClick, handleOnClose, handleOnOverlayClick };
 };
 
 export default useOnClose;

package/src/lib/components/modal/regularModal/index.tsx

@@ -15,7 +15,12 @@ export default ({
   className = '',
   dismissible = true,
 }: Props) => {
-  const { isClosing, handleContainerClick, handleOnClose } = useOnClose(
+  const {
+    isClosing,
+    handleContainerClick,
+    handleOnClose,
+    handleOnOverlayClick
+  } = useOnClose(
     onClose,
     isOpen,
     dismissible
@@ -28,15 +33,17 @@ export default ({
   return (
     <div
       className={isClosing ? styles['overlay--close'] : styles.overlay}
-      onClick={handleOnClose}
+      onClick={handleOnOverlayClick}
     >
       <div
         className={`${
           isClosing ? styles['container--close'] : styles.container
         } ${className}`}
-        onClick={handleContainerClick}
       >
-        <div className={styles.body}>
+        <div
+          className={styles.body}
+          onClick={handleContainerClick}
+        >
           <div className={styles.header}>
             <div className={`p-h2 ${styles.title}`}>{title}</div>
             {dismissible && (

package/src/lib/components/modal/regularModal/style.module.scss

@@ -97,7 +97,7 @@
 .body {
   background-color: white;
   border-radius: 8px;
-  margin: 32px auto;
+  margin: 80px auto;
 }
 
 .header {

package/dist/esm/useOnClose-54f9e6b9.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useOnClose-54f9e6b9.js","sources":["../../../src/lib/components/modal/hooks/useOnClose.ts"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\n\nconst useOnClose = (\n  onClose: () => void,\n  isOpen: boolean,\n  dismissable: boolean\n) => {\n  const [isClosing, setIsClosing] = useState(false);\n\n  const handleOnClose = useCallback(() => {\n    setIsClosing(true);\n    setTimeout(() => {\n      onClose();\n      setIsClosing(false);\n    }, 300);\n  }, [setIsClosing, onClose]);\n\n  const handleEscKey = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.code !== 'Escape') return;\n      if (!dismissable) return null;\n      if (!isOpen) return null;\n\n      handleOnClose();\n    },\n    [isOpen, dismissable, handleOnClose]\n  );\n\n  useEffect(() => {\n    window.addEventListener('keydown', handleEscKey);\n\n    return () => {\n      window.removeEventListener('keydown', handleEscKey);\n    };\n  }, [handleEscKey]);\n\n  useEffect(() => {\n    document.body.style.overflow = isOpen ? 'hidden' : 'auto';\n\n    return () => {\n      document.body.style.overflow = 'auto';\n    };\n  }, [isOpen]);\n\n  const handleContainerClick = (\n    e: React.MouseEvent<HTMLDivElement, MouseEvent>\n  ) => {\n    e.stopPropagation();\n  };\n\n  return { isClosing, handleContainerClick, handleOnClose };\n};\n\nexport default useOnClose;\n"],"names":[],"mappings":";;IAEM,UAAU,GAAG,UACjB,OAAmB,EACnB,MAAe,EACf,WAAoB;IAEd,IAAA,KAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAC;IAElD,IAAM,aAAa,GAAG,WAAW,CAAC;QAChC,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,UAAU,CAAC;YACT,OAAO,EAAE,CAAC;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;SACrB,EAAE,GAAG,CAAC,CAAC;KACT,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC;IAE5B,IAAM,YAAY,GAAG,WAAW,CAC9B,UAAC,CAAgB;QACf,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ;YAAE,OAAO;QAChC,IAAI,CAAC,WAAW;YAAE,OAAO,IAAI,CAAC;QAC9B,IAAI,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QAEzB,aAAa,EAAE,CAAC;KACjB,EACD,CAAC,MAAM,EAAE,WAAW,EAAE,aAAa,CAAC,CACrC,CAAC;IAEF,SAAS,CAAC;QACR,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC;QAEjD,OAAO;YACL,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC;SACrD,CAAC;KACH,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,SAAS,CAAC;QACR,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;QAE1D,OAAO;YACL,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,CAAC;SACvC,CAAC;KACH,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,IAAM,oBAAoB,GAAG,UAC3B,CAA+C;QAE/C,CAAC,CAAC,eAAe,EAAE,CAAC;KACrB,CAAC;IAEF,OAAO,EAAE,SAAS,WAAA,EAAE,oBAAoB,sBAAA,EAAE,aAAa,eAAA,EAAE,CAAC;AAC5D;;;;"}