pge-front-common 14.1.28 → 14.1.29

package/lib/components/modal/Modal.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
 import { ModalProps } from "./index.type";
-export default function Modal({ isOpen, onClose, children, className, }: ModalProps): React.JSX.Element | null;
+export default function Modal({ isOpen, onClose, children, className, closeOnClickOutside, }: ModalProps): React.JSX.Element | null;

package/lib/components/modal/index.type.d.ts

@@ -4,6 +4,7 @@ export type ModalProps = HTMLAttributes<HTMLDivElement> & {
     onClose: () => void;
     children: ReactNode;
     className?: string;
+    closeOnClickOutside?: boolean;
 };
 export type ModalHeaderProps = HTMLAttributes<HTMLDivElement> & {
     children: ReactNode;

package/lib/components/modal/modal.stories.d.ts

@@ -8,3 +8,4 @@ export declare const LargeContent: Story;
 export declare const WithoutFooter: Story;
 export declare const WithoutHeader: Story;
 export declare const WithoutHeaderAndFooter: Story;
+export declare const DontCloseOnClickOutsideModal: Story;

package/lib/index.d.ts

@@ -714,6 +714,7 @@ type ModalProps = HTMLAttributes<HTMLDivElement> & {
     onClose: () => void;
     children: ReactNode;
     className?: string;
+    closeOnClickOutside?: boolean;
 };
 type ModalHeaderProps = HTMLAttributes<HTMLDivElement> & {
     children: ReactNode;
@@ -729,7 +730,7 @@ type ModalFooterProps = HTMLAttributes<HTMLDivElement> & {
     className?: string;
 };
 
-declare function Modal({ isOpen, onClose, children, className, }: ModalProps): React__default.JSX.Element | null;
+declare function Modal({ isOpen, onClose, children, className, closeOnClickOutside, }: ModalProps): React__default.JSX.Element | null;
 
 declare const ModalFooter: ({ children, className }: ModalFooterProps) => React__default.JSX.Element;
 

package/lib/index.esm.js

@@ -23850,7 +23850,7 @@ styleInject(css_248z$7);
 
 var ELEMENTOS_COM_FOCO = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex="0"]';
 function Modal(_a) {
-    var isOpen = _a.isOpen, onClose = _a.onClose, children = _a.children, _b = _a.className, className = _b === void 0 ? "" : _b;
+    var isOpen = _a.isOpen, onClose = _a.onClose, children = _a.children, _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.closeOnClickOutside, closeOnClickOutside = _c === void 0 ? true : _c;
     var contentRef = useRef(null);
     var openerRef = useRef(null);
     useEffect(function () {
@@ -23873,11 +23873,13 @@ function Modal(_a) {
         var els = contentRef.current.querySelectorAll(ELEMENTOS_COM_FOCO);
         els.length && els[els.length - 1].focus();
     };
-    return (React__default.createElement("div", { className: style.modalOverlay, onClick: onClose, role: "presentation" },
+    return (React__default.createElement("div", { className: style.modalOverlay, onClick: closeOnClickOutside ? onClose : undefined, role: "presentation" },
         React__default.createElement("div", { tabIndex: 0, onFocus: moveToLast, "aria-hidden": "true" }),
         React__default.createElement("div", { ref: contentRef, className: "".concat(style.modal, " ").concat(className), role: "dialog", "aria-modal": "true", tabIndex: -1, onClick: function (e) { return e.stopPropagation(); }, onKeyDown: function (e) {
-                if (e.key === "Escape")
+                if (e.key === "Escape" && closeOnClickOutside)
                     onClose();
+                if (e.key === "Escape" && !closeOnClickOutside)
+                    e.preventDefault();
             } }, children),
         React__default.createElement("div", { tabIndex: 0, onFocus: moveToFirst, "aria-hidden": "true" })));
 }