@linzjs/lui 21.34.1-0 → 21.34.1-2

package/dist/components/LuiModal/LuiModalV2.d.ts

@@ -1,4 +1,4 @@
-import { FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren, ReactNode } from 'react';
 import { LuiIconProps } from '../LuiIcon/LuiIcon';
 export declare type LuiModalV2Props = {
     key?: string;
@@ -11,7 +11,7 @@ export declare type LuiModalV2Props = {
     className?: string;
     /** If set to true, the modal will take the full screen width. Default `false` */
     maxWidth?: boolean;
-    headingText?: string;
+    headingText?: ReactNode;
     headingIcon?: LuiIconProps;
     helpLink?: string | (() => void | Promise<void>);
     isLoading?: boolean;
@@ -24,3 +24,7 @@ export declare type LuiModalV2Props = {
 };
 export declare const LuiModalV2: FC<PropsWithChildren<LuiModalV2Props>>;
 export declare const LuiModalV2Buttons: FC<PropsWithChildren<unknown>>;
+/** Allows injecting the modal header text */
+export declare const LuiModalV2HeadingText: FC<{
+    children?: ReactNode;
+}>;

package/dist/index.d.ts

@@ -37,7 +37,7 @@ export * from './components/LuiHeaderMenu/LuiHeaderMenus';
 export * from './components/LuiHeaderMenuV2/LuiHeaderMenusV2';
 export { LuiUpdatesSplashModal } from './components/LuiUpdateSplashModal/LuiUpdatesSplashModal';
 export { LuiModal, LuiAlertModal, LuiAlertModalButtons, } from './components/LuiModal/LuiModal';
-export { LuiModalV2, LuiModalV2Buttons, type LuiModalV2Props, } from './components/LuiModal/LuiModalV2';
+export { LuiModalV2, LuiModalV2Buttons, LuiModalV2HeadingText, type LuiModalV2Props, } from './components/LuiModal/LuiModalV2';
 export { LuiAlertModalV2, type LuiAlertModalLevel, type LuiAlertModalV2Props, } from './components/LuiModal/LuiAlertModalV2';
 export { type ISearchInputProps, LuiSearchInput, } from './components/LuiSearchInput/LuiSearchInput';
 export { type ISearchGroupedResult, type ISearchResult, } from './components/LuiSearchInput/ResultsDisplay';

package/dist/index.js

@@ -39926,13 +39926,10 @@ var useEscapeFunction = function (onEscape) {
 };
 var useEscapeFunction2 = function (onEscape, trigger) {
     if (trigger === void 0) { trigger = 'keydown'; }
-    var escFunction = React.useCallback(function (event) {
-        console.log(event.key, event, onEscape);
-        event.key === 'Escape' && onEscape(event);
-    }, [onEscape]);
+    var escFunction = React.useCallback(function (event) { return event.key === 'Escape' && onEscape(event); }, [onEscape]);
     React.useEffect(function () {
-        document.addEventListener(trigger, escFunction, false);
-        return function () { return document.removeEventListener(trigger, escFunction, false); };
+        document.addEventListener(trigger, escFunction);
+        return function () { return document.removeEventListener(trigger, escFunction); };
     }, [escFunction]);
 };
 /**
@@ -42348,7 +42345,6 @@ var LuiModalV2 = function (props) {
             firstFocusableElement === null || firstFocusableElement === void 0 ? void 0 : firstFocusableElement.focus();
         }
     };
-    console.log({ props: props }, props.shouldCloseOnEsc && props.shouldCloseOnEsc !== 'use-keyup');
     var showCloseButton = Boolean(props.showCloseButton && props.onClose);
     var showHelpButton = Boolean(props.helpLink);
     var showButtons = showCloseButton || showHelpButton;
@@ -42362,7 +42358,7 @@ var LuiModalV2 = function (props) {
                 modalRef.current = el;
                 handleAutoFocus(el);
             }, className: clsx('lui-modal-v2 lui-box-shadow', props.maxWidth && 'lui-max-width', props.className) },
-            React__default["default"].createElement("div", { className: "lui-modal-v2-header" },
+            React__default["default"].createElement("div", { className: "lui-modal-v2-header", id: "lui-modal-v2-header" },
                 props.isLoading && (React__default["default"].createElement(LuiMiniSpinner, { size: 20, divProps: { className: 'lui-modal-v2-header-spinner' } })),
                 showHeadingIcon && (React__default["default"].createElement("div", { className: "lui-modal-v2-header-icon" },
                     React__default["default"].createElement(LuiIcon, __assign({ size: "md", name: "", alt: "Help" }, props.headingIcon, { className: clsx('', (_a = props.headingIcon) === null || _a === void 0 ? void 0 : _a.className) })))),
@@ -42378,7 +42374,19 @@ var HelpButton = function (props) { return (React__default["default"].createElem
         : props.helpLink },
     React__default["default"].createElement(LuiIcon, { name: "ic_help_outline", alt: "Help", size: "md" }))); };
 var CloseButton = function (props) { return (React__default["default"].createElement("button", { "aria-label": "Modal Close", title: "Close", className: "lui-modal-v2-header-close-btn", onClick: props.onClose },
-    React__default["default"].createElement(LuiIcon, { name: "ic_clear", alt: "Help", size: "md" }))); };
+    React__default["default"].createElement(LuiIcon, { name: "ic_clear", alt: "Help", size: "md" }))); };
+/** Allows injecting the modal header text */
+var LuiModalV2HeadingText = function (_a) {
+    var children = _a.children;
+    var _b = React.useState(), target = _b[0], setTarget = _b[1];
+    React.useEffect(function () {
+        var modalHeader = document.querySelector('#lui-modal-v2-header');
+        modalHeader && setTarget(modalHeader);
+    }, []);
+    if (!target)
+        return null;
+    return require$$1.createPortal(React__default["default"].createElement("h2", { className: "lui-modal-v2-header-title lui-modal-v2-header-title-portal" }, children), target);
+};
 
 var LuiAlertModalV2 = function (props) {
     var level = props.level, className = props.className, children = props.children, rest = __rest(props, ["level", "className", "children"]);
@@ -59460,6 +59468,7 @@ exports.LuiMiniSpinner = LuiMiniSpinner;
 exports.LuiModal = LuiModal;
 exports.LuiModalV2 = LuiModalV2;
 exports.LuiModalV2Buttons = LuiModalV2Buttons;
+exports.LuiModalV2HeadingText = LuiModalV2HeadingText;
 exports.LuiMoneyInput = LuiMoneyInput;
 exports.LuiMultiSwitch = LuiMultiSwitch;
 exports.LuiMultiSwitchYesNo = LuiMultiSwitchYesNo;