pge-front-common 14.1.13 → 14.1.14

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

@@ -1,9 +1,9 @@
-import { HtmlHTMLAttributes } from "react";
-export interface InformativeBoxProps extends HtmlHTMLAttributes<HTMLDivElement> {
-    infoType: 'success' | 'alert' | 'warning' | 'informative';
-    widthType?: 'fitContent' | 'fullWidth';
-    title: string;
-    message: string;
+import { HtmlHTMLAttributes, ReactNode } from "react";
+export interface InformativeBoxProps extends Omit<HtmlHTMLAttributes<HTMLDivElement>, "title"> {
+    infoType: "success" | "alert" | "warning" | "informative";
+    widthType?: "fitContent" | "fullWidth";
+    title: string | ReactNode;
+    message: string | ReactNode;
     hasDismissButton?: boolean;
     onClose?: () => void;
 }

package/lib/index.d.ts

@@ -28,11 +28,11 @@ interface InputBaseProps$1 extends InputHTMLAttributes<HTMLInputElement> {
 }
 declare const InputBase: ({ customClass, restrictionMessage, label, leftIcon, rightIcon, onRightIconClick, style, required, error, helperText, disabled, readOnly, className, showCounter, value, ...props }: InputBaseProps$1) => React__default.JSX.Element;
 
-interface InformativeBoxProps extends HtmlHTMLAttributes<HTMLDivElement> {
-    infoType: 'success' | 'alert' | 'warning' | 'informative';
-    widthType?: 'fitContent' | 'fullWidth';
-    title: string;
-    message: string;
+interface InformativeBoxProps extends Omit<HtmlHTMLAttributes<HTMLDivElement>, "title"> {
+    infoType: "success" | "alert" | "warning" | "informative";
+    widthType?: "fitContent" | "fullWidth";
+    title: string | ReactNode;
+    message: string | ReactNode;
     hasDismissButton?: boolean;
     onClose?: () => void;
 }

package/lib/index.esm.js

@@ -8468,10 +8468,27 @@ var Blanket = function (props) { return (React__default.createElement("div", __a
     } }, props))); };
 var Dropdown = function (_a) {
     var children = _a.children, isOpen = _a.isOpen, target = _a.target, onClose = _a.onClose;
-    return (React__default.createElement("div", { style: { position: "relative", width: "100%" } },
+    var dropdownRef = useRef(null);
+    useEffect(function () {
+        var handleClickOutside = function (event) {
+            if (dropdownRef.current &&
+                !dropdownRef.current.contains(event.target)) {
+                onClose();
+            }
+        };
+        if (isOpen) {
+            document.addEventListener("mousedown", handleClickOutside);
+        }
+        else {
+            document.removeEventListener("mousedown", handleClickOutside);
+        }
+        return function () {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [isOpen, onClose]);
+    return (React__default.createElement("div", { ref: dropdownRef, style: { position: "relative", width: "100%" } },
         target,
-        isOpen ? React__default.createElement(Menu, null, children) : null,
-        isOpen ? React__default.createElement(Blanket, { onClick: onClose }) : null));
+        isOpen ? React__default.createElement(Menu, null, children) : null));
 };
 function isArrayContained(subset, superset) {
     return subset.every(function (subItem) {