@linzjs/windows 10.3.1 → 11.0.0

package/dist/LuiModalAsync/LuiModalAsync.d.ts

@@ -0,0 +1,14 @@
+import '../index.scss';
+import { CSSProperties, PropsWithChildren, ReactElement } from 'react';
+export interface LuiModalAsyncProps {
+    className?: string;
+    style?: CSSProperties;
+    /**
+     * Close on clicking overlay
+     */
+    closeOnOverlayClick?: boolean;
+}
+/**
+ * This creates the dialog element.
+ */
+export declare const LuiModalAsync: ({ style, className, closeOnOverlayClick, children, }: PropsWithChildren<LuiModalAsyncProps>) => ReactElement;

package/dist/LuiModalAsync/LuiModalAsync.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import '../index.scss';
+import clsx from 'clsx';
+import { delay } from 'lodash-es';
+import { useContext, useEffect, useRef } from 'react';
+import { LuiModalAsyncInstanceContext } from './LuiModalAsyncInstanceContext';
+/**
+ * This creates the dialog element.
+ */
+export const LuiModalAsync = ({ style, className, closeOnOverlayClick, children, }) => {
+    const dialogRef = useRef(null);
+    const { close } = useContext(LuiModalAsyncInstanceContext);
+    // The only way to create a modal dialog is to call showModal, open attribute will not work
+    useEffect(() => {
+        // Check if it's open already to support .vite hot deploys
+        if (!dialogRef.current?.open) {
+            dialogRef.current?.showModal?.();
+        }
+    }, []);
+    useEffect(() => {
+        // Dialogs auto select the first focusable element, this is in case you don't want that
+        // For example we don't want to select the help button by default, so we add data-noautofocus
+        delay(() => {
+            const d = dialogRef.current;
+            if (!d) {
+                return;
+            }
+            const input = (d.querySelectorAll('[data-autofocus]')[0] ??
+                d.querySelectorAll('[type=file]')[0] ??
+                d.querySelectorAll('button:not([data-noautofocus]),input:not([data-noautofocus])')[0]);
+            if (input) {
+                input.focus?.();
+                if ('select' in input) {
+                    input.select?.();
+                }
+            }
+        }, 100);
+    }, []);
+    // You cannot override dialogs position from absolute.
+    return className?.includes('storybook') ? (_jsx("div", { className: clsx('LuiModalAsync', className), style: style, children: children })) : (_jsx("dialog", { role: 'dialog', className: clsx('LuiModalAsync', className), style: style, ref: dialogRef, onCancel: (e) => {
+            e.preventDefault();
+            close();
+        }, onClick: (e) => closeOnOverlayClick && e.target === e.currentTarget && close(), children: children }));
+};
+//# sourceMappingURL=LuiModalAsync.js.map

package/dist/LuiModalAsync/LuiModalAsync.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsync.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsync.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AAEvB,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAClC,OAAO,EAAkD,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEtG,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAW9E;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,KAAK,EACL,SAAS,EACT,mBAAmB,EACnB,QAAQ,GAC8B,EAAgB,EAAE;IACxD,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAElD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC,4BAA4B,CAAC,CAAC;IAE3D,2FAA2F;IAC3F,SAAS,CAAC,GAAG,EAAE;QACb,0DAA0D;QAC1D,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,IAAI,EAAE,CAAC;YAC7B,SAAS,CAAC,OAAO,EAAE,SAAS,EAAE,EAAE,CAAC;QACnC,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,uFAAuF;QACvF,6FAA6F;QAC7F,KAAK,CAAC,GAAG,EAAE;YACT,MAAM,CAAC,GAAG,SAAS,CAAC,OAAO,CAAC;YAC5B,IAAI,CAAC,CAAC,EAAE,CAAC;gBACP,OAAO;YACT,CAAC;YACD,MAAM,KAAK,GAAG,CAAC,CAAC,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;gBACtD,CAAC,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;gBACpC,CAAC,CAAC,gBAAgB,CAAC,8DAA8D,CAAC,CAAC,CAAC,CAAC,CAE1E,CAAC;YAEd,IAAI,KAAK,EAAE,CAAC;gBACV,KAAK,CAAC,KAAK,EAAE,EAAE,CAAC;gBAChB,IAAI,QAAQ,IAAI,KAAK,EAAE,CAAC;oBACrB,KAA0B,CAAC,MAAM,EAAE,EAAE,CAAC;gBACzC,CAAC;YACH,CAAC;QACH,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,sDAAsD;IACtD,OAAO,SAAS,EAAE,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CACxC,cAAK,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,YAC3D,QAAQ,GACL,CACP,CAAC,CAAC,CAAC,CACF,iBACE,IAAI,EAAE,QAAQ,EACd,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,EAC3C,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,SAAS,EACd,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;YACd,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,KAAK,EAAE,CAAC;QACV,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,mBAAmB,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,aAAa,IAAI,KAAK,EAAE,YAE7E,QAAQ,GACF,CACV,CAAC;AACJ,CAAC,CAAC"}

package/dist/LuiModalAsync/LuiModalAsync.scss

@@ -136,8 +136,7 @@ dialog.LuiModalAsync, div.LuiModalAsync {
     font-weight: 400;
   }
 
-  .lui-button:focus-visible {
-    // Button focus not showing unless window content has focus
+  .lui-button:focus {
     outline: form.$input-border-width-thick solid colors.$input-focus;
   }
 }

package/dist/LuiModalAsync/LuiModalAsyncButtonGroup.d.ts

@@ -0,0 +1,19 @@
+import { LuiButtonProps } from '@linzjs/lui/dist/components/LuiButton/LuiButton';
+import { PropsWithChildren } from 'react';
+/**
+ * Wrapper for buttons at the bottom of model.
+ */
+export declare const LuiModalAsyncButtonGroup: ({ children }: PropsWithChildren<unknown>) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Calls model close on click.
+ */
+export declare const LuiModalAsyncButtonDismiss: import("react").ForwardRefExoticComponent<Omit<LuiButtonProps & {
+    autofocus?: boolean;
+}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+/**
+ * Resolves to value on click, or if onClick is specified calls onClick.
+ */
+export declare const LuiModalAsyncButtonContinue: import("react").ForwardRefExoticComponent<Omit<LuiButtonProps & {
+    value?: unknown;
+    autofocus?: boolean;
+}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/LuiModalAsync/LuiModalAsyncButtonGroup.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LuiButton } from '@linzjs/lui';
+import { forwardRef, useContext } from 'react';
+import { LuiModalAsyncInstanceContext } from './LuiModalAsyncInstanceContext';
+/**
+ * Wrapper for buttons at the bottom of model.
+ */
+export const LuiModalAsyncButtonGroup = ({ children }) => (_jsx("div", { className: 'LuiModalAsync-ButtonGroup', children: children }));
+/**
+ * Calls model close on click.
+ */
+export const LuiModalAsyncButtonDismiss = forwardRef(function LuiModalAsyncButtonDismiss(props, ref) {
+    return (_jsx(LuiButton, { ...props, ...(props.level ? {} : { level: 'tertiary' }), ...(props.autofocus ? { buttonProps: { 'data-autofocus': true } } : {}), ref: ref, onClick: useContext(LuiModalAsyncInstanceContext).close, children: props.children }));
+});
+/**
+ * Resolves to value on click, or if onClick is specified calls onClick.
+ */
+export const LuiModalAsyncButtonContinue = forwardRef(function LuiModalAsyncButtonContinue(props, ref) {
+    const { resolve } = useContext(LuiModalAsyncInstanceContext);
+    return (_jsx(LuiButton, { ...props, ...(props.level ? {} : { level: 'primary' }), ...(props.autofocus ? { buttonProps: { 'data-autofocus': true } } : {}), ref: ref, onClick: (e) => {
+            if (props.onClick)
+                props.onClick(e);
+            else
+                resolve(props.value ?? 'continue');
+        }, children: props.children }));
+});
+//# sourceMappingURL=LuiModalAsyncButtonGroup.js.map

package/dist/LuiModalAsync/LuiModalAsyncButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncButtonGroup.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncButtonGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,OAAO,EAAE,UAAU,EAAqB,UAAU,EAAE,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAE9E;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,EAAE,QAAQ,EAA8B,EAAE,EAAE,CAAC,CACpF,cAAK,SAAS,EAAE,2BAA2B,YAAG,QAAQ,GAAO,CAC9D,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,UAAU,CAClD,SAAS,0BAA0B,CAAC,KAAK,EAAE,GAAG;IAC5C,OAAO,CACL,KAAC,SAAS,OACJ,KAAK,KACL,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,KAC1C,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,EAAE,gBAAgB,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACxE,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,CAAC,4BAA4B,CAAC,CAAC,KAAK,YAEtD,KAAK,CAAC,QAAQ,GACL,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,UAAU,CAGnD,SAAS,2BAA2B,CAAC,KAAK,EAAE,GAAG;IAC/C,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,4BAA4B,CAAC,CAAC;IAC7D,OAAO,CACL,KAAC,SAAS,OACJ,KAAK,KACL,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,KACzC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,EAAE,gBAAgB,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACxE,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,IAAI,KAAK,CAAC,OAAO;gBAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;;gBAC/B,OAAO,CAAC,KAAK,CAAC,KAAK,IAAI,UAAU,CAAC,CAAC;QAC1C,CAAC,YAEA,KAAK,CAAC,QAAQ,GACL,CACb,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/LuiModalAsync/LuiModalAsyncContent.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+/**
+ * Wrapper for modal content.
+ * Content is the scrollable area.
+ */
+export declare const LuiModalAsyncContent: ({ children }: PropsWithChildren<unknown>) => import("react/jsx-runtime").JSX.Element;

package/dist/LuiModalAsync/LuiModalAsyncContent.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Wrapper for modal content.
+ * Content is the scrollable area.
+ */
+export const LuiModalAsyncContent = ({ children }) => (_jsx("div", { className: 'LuiModalAsync-content', children: children }));
+//# sourceMappingURL=LuiModalAsyncContent.js.map

package/dist/LuiModalAsync/LuiModalAsyncContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncContent.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncContent.tsx"],"names":[],"mappings":";AAEA;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,QAAQ,EAA8B,EAAE,EAAE,CAAC,CAChF,cAAK,SAAS,EAAE,uBAAuB,YAAG,QAAQ,GAAO,CAC1D,CAAC"}

package/dist/LuiModalAsync/LuiModalAsyncContext.d.ts

@@ -0,0 +1,28 @@
+import { ComponentProps, MutableRefObject, ReactElement } from 'react';
+export declare const openModalOnAllWindows: import("react").RefObject<HTMLDivElement>;
+/**
+ * @param showOnAllWindows If true this modal will show on all windows opened from main window including main window.
+ * @param
+ */
+export interface ShowModalProps {
+    showOnAllWindows?: boolean;
+    polledCloseCondition?: () => boolean;
+}
+export type ComponentType = (props: any) => ReactElement;
+/**
+ * Promise extended to add the ability to externally resolve dialog.
+ */
+export interface PromiseWithResolve<RT> extends Promise<RT> {
+    resolve: (value: RT) => void;
+}
+/**
+ * Properties passed to the modal component to allow resolving.
+ */
+export interface LuiModalAsyncCallback<R> {
+    resolve: (result: R | undefined) => void;
+    close: () => void;
+}
+export interface LuiModalAsyncContextType {
+    showModal: <OR extends HTMLElement | null, PROPS extends LuiModalAsyncCallback<any>, CT extends (props: PROPS) => ReactElement, RT = Parameters<ComponentProps<CT>['resolve']>[0]>(ownerRef: MutableRefObject<OR>, component: CT, args: Omit<ComponentProps<CT>, 'resolve' | 'close'>, showModalProps?: ShowModalProps) => PromiseWithResolve<RT>;
+}
+export declare const LuiModalAsyncContext: import("react").Context<LuiModalAsyncContextType>;

package/dist/LuiModalAsync/LuiModalAsyncContext.js

@@ -0,0 +1,9 @@
+import { createContext, createRef } from 'react';
+export const openModalOnAllWindows = createRef();
+export const LuiModalAsyncContext = createContext({
+    // eslint-disable-next-line @typescript-eslint/require-await
+    showModal: (async () => {
+        console.error('Missing LuiModalAsyncContext Provider');
+    }),
+});
+//# sourceMappingURL=LuiModalAsyncContext.js.map

package/dist/LuiModalAsync/LuiModalAsyncContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncContext.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,aAAa,EAAE,SAAS,EAAkC,MAAM,OAAO,CAAC;AAEjG,MAAM,CAAC,MAAM,qBAAqB,GAAG,SAAS,EAAkB,CAAC;AA4CjE,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAA2B;IAC1E,4DAA4D;IAC5D,SAAS,EAAE,CAAC,KAAK,IAAI,EAAE;QACrB,OAAO,CAAC,KAAK,CAAC,uCAAuC,CAAC,CAAC;IACzD,CAAC,CAAqD;CACvD,CAAC,CAAC"}

package/dist/LuiModalAsync/LuiModalAsyncContextProvider.d.ts

@@ -0,0 +1,54 @@
+import { MutableRefObject, PropsWithChildren, ReactElement } from 'react';
+import { ShowModalProps } from './LuiModalAsyncContext';
+export interface LuiModalAsyncInstance {
+    uuid: string;
+    ownerRef: MutableRefObject<HTMLElement | null>;
+    componentInstance: ReactElement;
+    resolve: (result: any) => void;
+    showModalProps?: ShowModalProps;
+}
+/**
+ * Provides the ability to show modals using react components without needing useState boilerplate and inline dialogs.
+ *
+ * To use:
+ * <ol>
+ * <li>Add this Provider somewhere in your standard providers
+ * <pre>
+ * <LuiModalAsyncContextProvider>
+ *    ...children
+ * </LuiModalAsyncContextProvider>
+ * </pre>
+ * </li>
+ * <li>Add the modal return type to the element as below, and use the props resolve/close from ModalProps for results.
+ * <pre>
+ * export interface SomeModalProps extends ModalProps<number> {
+ *   someProp?: number; // user props
+ * }
+ *
+ * export const SomeModal = ({initialState, resolve, close}: SomeModalProps): ReactElement => {
+ *    return Modal(
+ *       <div>
+ *           Itsa me, I'm a modal
+ *          <button onClick={close}>Cancel</button>
+ *          <button onClick={()=>resolve(someProp)}>Save</button>
+ *       </div>
+ *    )}
+ * }
+ * </pre>
+ * </li>
+ * <li> To show the dialog and get the result...
+ * <pre>
+ *   // Note: modalOwnerRef is only required if you need to support popout windows
+ *   const { showModal, modalOwnerRef  } = useShowAsyncModal();
+ *   ...
+ *   const showModal = () => {
+ *     const result = await showModal(SomeModal, { someProp: 1 });
+ *     if (!result) return; // modal cancelled
+ *   }
+ *
+ *   return <button onClick={showModal} ref={modalOwnerRef}>Show Modal!</button>
+ * </pre>
+ * </li>
+ * </ol>
+ */
+export declare const LuiModalAsyncContextProvider: ({ children }: PropsWithChildren<unknown>) => ReactElement;

package/dist/LuiModalAsync/LuiModalAsyncContextProvider.js

@@ -0,0 +1,160 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { debugLog } from '../common/debug';
+import { LuiModalAsyncContext, openModalOnAllWindows, } from './LuiModalAsyncContext';
+import { LuiModalAsyncInstanceContext } from './LuiModalAsyncInstanceContext';
+import { useInterval } from '../common/useInterval';
+import { v4 } from '../common/uuid';
+/**
+ * Provides the ability to show modals using react components without needing useState boilerplate and inline dialogs.
+ *
+ * To use:
+ * <ol>
+ * <li>Add this Provider somewhere in your standard providers
+ * <pre>
+ * <LuiModalAsyncContextProvider>
+ *    ...children
+ * </LuiModalAsyncContextProvider>
+ * </pre>
+ * </li>
+ * <li>Add the modal return type to the element as below, and use the props resolve/close from ModalProps for results.
+ * <pre>
+ * export interface SomeModalProps extends ModalProps<number> {
+ *   someProp?: number; // user props
+ * }
+ *
+ * export const SomeModal = ({initialState, resolve, close}: SomeModalProps): ReactElement => {
+ *    return Modal(
+ *       <div>
+ *           Itsa me, I'm a modal
+ *          <button onClick={close}>Cancel</button>
+ *          <button onClick={()=>resolve(someProp)}>Save</button>
+ *       </div>
+ *    )}
+ * }
+ * </pre>
+ * </li>
+ * <li> To show the dialog and get the result...
+ * <pre>
+ *   // Note: modalOwnerRef is only required if you need to support popout windows
+ *   const { showModal, modalOwnerRef  } = useShowAsyncModal();
+ *   ...
+ *   const showModal = () => {
+ *     const result = await showModal(SomeModal, { someProp: 1 });
+ *     if (!result) return; // modal cancelled
+ *   }
+ *
+ *   return <button onClick={showModal} ref={modalOwnerRef}>Show Modal!</button>
+ * </pre>
+ * </li>
+ * </ol>
+ */
+export const LuiModalAsyncContextProvider = ({ children }) => {
+    const [modals, setModals] = useState([]);
+    const openWindowsRef = useRef([window]);
+    // hook window open for opening dialogs across multiple windows
+    useEffect(() => {
+        const oldWindowOpen = window.open;
+        window.open = (...props) => {
+            const r = oldWindowOpen(...props);
+            // We don't want to track non app-windows, e.g. help screens
+            if (!props[0]) {
+                if (r) {
+                    openWindowsRef.current.push(r);
+                }
+            }
+            return r;
+        };
+        return () => {
+            window.open = oldWindowOpen;
+        };
+    }, []);
+    /**
+     * Inserts the modal into the page, and removes once modal has a result.
+     * Note: full generic types are provided by the interface.  Function def has been simplified here.
+     *
+     * @param ownerRef Reference to element that opened this dialog such that it works for popout windows.
+     * @param Component React component.
+     * @param args Arguments for react component.
+     */
+    const showModal = useCallback((ownerRef, Component, 
+    // eslint-disable-next-line
+    args, showModalProps) => {
+        if (!('level' in args)) {
+            debugLog(`Show generic modal`, args);
+        }
+        const uuid = v4();
+        // eslint-disable-next-line
+        let extResolve;
+        // @ts-expect-error promise resolve cast
+        // eslint-disable-next-line
+        const promise = new Promise((resolve) => {
+            extResolve = resolve;
+            try {
+                // If there are any exceptions the modal won't show
+                setModals((modals) => [
+                    ...modals,
+                    {
+                        uuid,
+                        ownerRef,
+                        // eslint-disable-next-line
+                        componentInstance: _jsx(Component, { ...args, resolve: resolve, close: () => resolve(undefined) }),
+                        resolve,
+                        showModalProps,
+                    },
+                ]);
+            }
+            catch (e) {
+                console.error(e);
+                return;
+            }
+        }).then((result) => {
+            debugLog('Modal resolved result =', JSON.stringify(result));
+            return new Promise((resolve) => {
+                // Close modal
+                setModals((modals) => {
+                    // Defer resolving to give react a chance to update the view allowing the async event model to run.
+                    // Just in case the task following this is long-running with non IO code, which will block the event queue.
+                    setTimeout(() => resolve(result), 10);
+                    return modals.filter((e) => e.uuid !== uuid);
+                });
+            });
+        });
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        promise.resolve = extResolve;
+        return promise;
+    }, []);
+    /**
+     * Check modal is still attached to a window.
+     */
+    const modalHasView = useCallback((modalInstance) => modalInstance.ownerRef === openModalOnAllWindows || !!modalInstance.ownerRef.current?.ownerDocument.defaultView, []);
+    const windowIsOpen = useCallback((w) => !w.closed, []);
+    /**
+     * Tidy up modals that have closed because of an external window closing
+     */
+    useInterval(() => {
+        const newModals = modals.filter(modalHasView);
+        if (newModals.length !== modals.length) {
+            setModals(newModals);
+        }
+        // We could do this with window close listeners, but they are unreliable
+        openWindowsRef.current = openWindowsRef.current.filter((w) => !w.closed);
+        newModals.forEach((modalInstance) => {
+            if (modalInstance.showModalProps?.polledCloseCondition?.()) {
+                modalInstance.resolve(undefined);
+            }
+        });
+    }, 500);
+    const portalOwners = (modalInstance) => modalInstance.ownerRef == openModalOnAllWindows
+        ? openWindowsRef.current.filter(windowIsOpen).map((frame) => frame.document.body)
+        : [(modalInstance.ownerRef.current?.ownerDocument ?? document).body];
+    return (_jsxs(LuiModalAsyncContext.Provider, { value: {
+            showModal,
+        }, children: [_jsx(_Fragment, { children: modals.filter(modalHasView).map((modalInstance) => (_jsx(LuiModalAsyncInstanceContext.Provider, { value: {
+                        ownerRef: modalInstance.ownerRef,
+                        close: () => modalInstance.resolve(undefined),
+                        resolve: modalInstance.resolve,
+                    }, children: portalOwners(modalInstance).map((element) => createPortal(_jsx(_Fragment, { children: modalInstance.componentInstance }), element)) }, modalInstance.uuid))) }), _jsx(_Fragment, { children: children })] }));
+};
+//# sourceMappingURL=LuiModalAsyncContextProvider.js.map

package/dist/LuiModalAsync/LuiModalAsyncContextProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncContextProvider.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncContextProvider.tsx"],"names":[],"mappings":"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"}

package/dist/LuiModalAsync/LuiModalAsyncHeader.d.ts

@@ -0,0 +1,15 @@
+import '../index.scss';
+import { LuiIconName } from '@linzjs/lui/dist/assets/svg-content';
+import { PropsWithChildren, ReactElement } from 'react';
+export interface LuiModalAsyncHeaderProps {
+    icon?: LuiIconName | ReactElement | null;
+    title: string;
+    closeButton?: true;
+    helpLink?: string;
+    onHelpClick?: () => void;
+    helpButtonLevel?: 'text' | 'plain-text' | 'primary' | 'secondary' | 'tertiary' | 'success' | 'error';
+}
+/**
+ * Generic modal header.
+ */
+export declare const LuiModalAsyncHeader: ({ icon, title, closeButton, helpLink, onHelpClick, helpButtonLevel, }: PropsWithChildren<LuiModalAsyncHeaderProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/LuiModalAsync/LuiModalAsyncHeader.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '../index.scss';
+import { LuiButton, LuiIcon } from '@linzjs/lui';
+import { useContext, useLayoutEffect, useState } from 'react';
+import { PanelHeaderButton } from '../panel';
+import { LuiModalAsyncInstanceContext } from './LuiModalAsyncInstanceContext';
+/**
+ * Generic modal header.
+ */
+export const LuiModalAsyncHeader = ({ icon, title, closeButton, helpLink, onHelpClick, helpButtonLevel, }) => {
+    const { ownerRef, close } = useContext(LuiModalAsyncInstanceContext);
+    const [disabled, setDisabled] = useState(true);
+    // Dialogs auto focus buttons even when flagged not to
+    // On initial display the header buttons are disable to prevent this
+    useLayoutEffect(() => {
+        void setDisabled(false);
+    }, []);
+    return (_jsxs("div", { className: 'LuiModalAsync-header', children: [icon &&
+                (typeof icon === 'string' ? (_jsx(LuiIcon, { name: icon, alt: 'icon', size: 'md', className: `LuiModalAsync-header-icon LuiModalAsync-header-icon-${icon}` })) : (icon)), _jsx("h4", { children: title }), (helpLink || onHelpClick) && (_jsx(LuiButton, { type: 'button', level: helpButtonLevel || 'plain-text', "aria-label": 'Help', title: 'Help', className: 'lui-button-icon-only', disabled: disabled, buttonProps: { 'data-noautofocus': true, tabIndex: -1 }, onClick: helpLink
+                    ? () => (ownerRef.current?.ownerDocument?.defaultView ?? window).open(helpLink, '_blank')
+                    : onHelpClick, children: _jsx(LuiIcon, { name: "ic_help_outline", alt: "Help", size: "md", className: 'LuiModalAsync-help-icon' }) })), closeButton && _jsx(PanelHeaderButton, { "aria-label": 'Close', onClick: close, icon: 'ic_clear' })] }));
+};
+//# sourceMappingURL=LuiModalAsyncHeader.js.map

package/dist/LuiModalAsync/LuiModalAsyncHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncHeader.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AAEvB,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAAmC,UAAU,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE/F,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAY9E;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAClC,IAAI,EACJ,KAAK,EACL,WAAW,EACX,QAAQ,EACR,WAAW,EACX,eAAe,GAC6B,EAAE,EAAE;IAChD,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC,4BAA4B,CAAC,CAAC;IACrE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAE/C,sDAAsD;IACtD,oEAAoE;IACpE,eAAe,CAAC,GAAG,EAAE;QACnB,KAAK,WAAW,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,eAAK,SAAS,EAAE,sBAAsB,aACnC,IAAI;gBACH,CAAC,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC1B,KAAC,OAAO,IACN,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,MAAM,EACX,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,uDAAuD,IAAI,EAAE,GACxE,CACH,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC,EACJ,uBAAK,KAAK,GAAM,EACf,CAAC,QAAQ,IAAI,WAAW,CAAC,IAAI,CAC5B,KAAC,SAAS,IACR,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,eAAe,IAAI,YAAY,gBAC1B,MAAM,EAClB,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,sBAAsB,EACjC,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,EAAE,kBAAkB,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,EACvD,OAAO,EACL,QAAQ;oBACN,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,WAAW,IAAI,MAAM,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC;oBACzF,CAAC,CAAC,WAAW,YAGjB,KAAC,OAAO,IAAC,IAAI,EAAC,iBAAiB,EAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAE,yBAAyB,GAAI,GACnF,CACb,EACA,WAAW,IAAI,KAAC,iBAAiB,kBAAa,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,GAAI,IACxF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/LuiModalAsync/LuiModalAsyncInstanceContext.d.ts

@@ -0,0 +1,13 @@
+import { MutableRefObject } from 'react';
+/**
+ * Actions that can be taken from within the modal via instance context
+ */
+export interface LuiModalAsyncInstanceContextType {
+    ownerRef: MutableRefObject<HTMLElement | null>;
+    close: () => void;
+    resolve: (value: any) => void;
+}
+/**
+ * Provides access to resolving/closing to modal elements.
+ */
+export declare const LuiModalAsyncInstanceContext: import("react").Context<LuiModalAsyncInstanceContextType>;

package/dist/LuiModalAsync/LuiModalAsyncInstanceContext.js

@@ -0,0 +1,13 @@
+import { createContext } from 'react';
+const NoContextError = () => {
+    console.error('Missing LuiModalAsyncInstanceContext Provider');
+};
+/**
+ * Provides access to resolving/closing to modal elements.
+ */
+export const LuiModalAsyncInstanceContext = createContext({
+    ownerRef: { current: null },
+    close: NoContextError,
+    resolve: NoContextError,
+});
+//# sourceMappingURL=LuiModalAsyncInstanceContext.js.map

package/dist/LuiModalAsync/LuiModalAsyncInstanceContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncInstanceContext.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncInstanceContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAoB,MAAM,OAAO,CAAC;AAYxD,MAAM,cAAc,GAAG,GAAG,EAAE;IAC1B,OAAO,CAAC,KAAK,CAAC,+CAA+C,CAAC,CAAC;AACjE,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,aAAa,CAAmC;IAC1F,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;IAC3B,KAAK,EAAE,cAAc;IACrB,OAAO,EAAE,cAAc;CACxB,CAAC,CAAC"}

package/dist/LuiModalAsync/LuiModalAsyncMain.d.ts

@@ -0,0 +1,5 @@
+import { PropsWithChildren } from 'react';
+/**
+ * Wraps the content and header.  This is just to match the way figma is arranged.
+ */
+export declare const LuiModalAsyncMain: ({ children }: PropsWithChildren<unknown>) => import("react/jsx-runtime").JSX.Element;

package/dist/LuiModalAsync/LuiModalAsyncMain.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Wraps the content and header.  This is just to match the way figma is arranged.
+ */
+export const LuiModalAsyncMain = ({ children }) => (_jsx("div", { className: 'LuiModalAsync-main', children: children }));
+//# sourceMappingURL=LuiModalAsyncMain.js.map

package/dist/LuiModalAsync/LuiModalAsyncMain.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LuiModalAsyncMain.js","sourceRoot":"","sources":["../../src/LuiModalAsync/LuiModalAsyncMain.tsx"],"names":[],"mappings":";AAEA;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,EAAE,QAAQ,EAA8B,EAAE,EAAE,CAAC,CAC7E,cAAK,SAAS,EAAE,oBAAoB,YAAG,QAAQ,GAAO,CACvD,CAAC"}

package/dist/LuiModalAsync/index.js

@@ -0,0 +1,12 @@
+export * from './LuiModalAsync';
+export * from './LuiModalAsyncButtonGroup';
+export * from './LuiModalAsyncContent';
+export * from './LuiModalAsyncContext';
+export * from './LuiModalAsyncContextProvider';
+export * from './LuiModalAsyncHeader';
+export * from './LuiModalAsyncInstanceContext';
+export * from './LuiModalAsyncMain';
+export * from './useLuiModalPrefab';
+export * from './useLuiModalUpload';
+export * from './useShowAsyncModal';
+//# sourceMappingURL=index.js.map

package/dist/LuiModalAsync/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/LuiModalAsync/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uBAAuB,CAAC;AACtC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC"}

package/dist/LuiModalAsync/useLuiModalPrefab.d.ts

@@ -0,0 +1,56 @@
+import { LuiButtonProps } from '@linzjs/lui/dist/components/LuiButton/LuiButton';
+import { IconName } from '@linzjs/lui/dist/components/LuiIcon/LuiIcon';
+import { PropsWithChildren, ReactElement } from 'react';
+import { LuiModalAsyncProps } from './LuiModalAsync';
+import { LuiModalAsyncCallback, PromiseWithResolve } from './LuiModalAsyncContext';
+export type PrefabType = 'outline' | 'success' | 'info' | 'warning' | 'error' | 'progress' | 'blocked';
+export interface LuiModalAsyncPrefabButton<RT> {
+    default?: boolean;
+    level?: LuiButtonProps['level'] | 'secondary-error';
+    title: string;
+    icon?: IconName;
+    value?: RT;
+}
+export interface useLuiModalPrefabProps<RT = string> extends LuiModalAsyncProps {
+    showOnAllWindows?: boolean;
+    level: PrefabType;
+    title: string;
+    helpLink?: string;
+    onHelpClick?: () => void;
+    buttons?: LuiModalAsyncPrefabButton<RT>[];
+    dontShowAgainSessionKey?: string;
+    polledCloseCondition?: () => boolean;
+}
+export interface LuiModalAsyncPrefabProps<RT> extends useLuiModalPrefabProps<RT>, LuiModalAsyncCallback<RT> {
+}
+export declare const getIconForLevel: (level: PrefabType) => IconName | "custom_progress" | null;
+export declare const LuiModalDontShowSessionSet: (userKey: string) => void;
+export declare const LuiModalDontShowSessionRemove: (userKey: string) => void;
+export declare const LuiModalDontShowSessionCheck: (userKey: string) => boolean;
+/**
+ * A generic template for common types of modals.
+ */
+export declare const LuiModalPrefab: (props: PropsWithChildren<LuiModalAsyncPrefabProps<unknown>>) => ReactElement;
+/**
+ * Instantiate a generic template for common types of modals.
+ *
+ * Usage:
+ * const { modalOwnerRef, showPrefabModal } = useLuiModalPrefab();
+ *
+ * return (
+ *   <button
+ *     ref={modalOwnerRef}
+ *       onClick={() =>
+ *         showPrefabModal({
+ *           level: 'info',
+ *           title: 'You are a fantastic person',
+ *           children: 'Keep it up!',
+ *         })
+ *   }>
+ *   Open Modal
+ *   </button>
+ */
+export declare const useLuiModalPrefab: () => {
+    modalOwnerRef: import("react").MutableRefObject<any>;
+    showPrefabModal: <RT = string>(props: PropsWithChildren<useLuiModalPrefabProps<RT>>) => PromiseWithResolve<RT>;
+};