@pega/cosmos-react-core 9.0.0-build.9.8 → 9.0.0

package/lib/components/Modal/ModalManager.js

@@ -1,6 +1,6 @@
 import { createElement as _createElement } from "react";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useReducer, useMemo, useEffect, useContext, memo } from 'react';
+import { useReducer, useMemo, useEffect, useContext, useRef, memo } from 'react';
 import { createPortal } from 'react-dom';
 import { createUID, getActiveElement, windowIsAvailable } from '../../utils';
 import { useConfiguration, useScrollToggle } from '../../hooks';
@@ -56,7 +56,7 @@ const reducer = (modals, payload) => {
             return modals;
     }
 };
-const WrappedModal = memo(({ Component, id, options: { alert, dismissible, dockable, minimizable, maximizable }, state, methods, props, top }) => (_jsx(ModalContext.Provider
+const WrappedModal = memo(({ Component, id, options: { alert, dismissible, dockable, moveable, minimizable, maximizable }, state, methods, props, top }) => (_jsx(ModalContext.Provider
 // eslint-disable-next-line react/jsx-no-constructed-context-values
 , { 
     // eslint-disable-next-line react/jsx-no-constructed-context-values
@@ -67,6 +67,7 @@ const WrappedModal = memo(({ Component, id, options: { alert, dismissible, docka
         minimizable,
         maximizable,
         dockable,
+        moveable,
         state,
         top,
         initialized: true,
@@ -83,15 +84,19 @@ const RenderModals = ({ modals }) => {
             obj.open.push(modal);
         return obj;
     }, { open: [], minimized: [], alerts: [] });
-    return (_jsxs(_Fragment, { children: [open.map((modal, i) => (_createElement(WrappedModal, { ...modal, top: alerts.length === 0 && i === open.length - 1, key: modal.id }))), minimized.length > 0 && (_jsx(DockedModals, { children: minimized.map(modal => (_createElement(WrappedModal, { ...modal, top: false, key: modal.id }))) })), alerts.map((modal, i) => (_createElement(WrappedModal, { ...modal, top: i === open.length - 1, key: modal.id })))] }));
+    const activeAlerts = alerts.filter(a => a.state !== 'closed');
+    const activeOpen = open.filter(m => m.state !== 'closed');
+    return (_jsxs(_Fragment, { children: [open.map((modal, i) => (_createElement(WrappedModal, { ...modal, top: activeAlerts.length === 0 && i === activeOpen.length - 1, key: modal.id }))), minimized.length > 0 && (_jsx(DockedModals, { children: minimized.map(modal => (_createElement(WrappedModal, { ...modal, top: false, key: modal.id }))) })), alerts.map((modal, i) => (_createElement(WrappedModal, { ...modal, top: i === alerts.length - 1, key: modal.id })))] }));
 };
 const ModalManager = ({ children }) => {
     const [modals, dispatch] = useReducer(reducer, []);
     const { disableScroll, enableScroll } = useScrollToggle();
+    const lastFocusedBeforeProgress = useRef(null);
     const providerValue = useMemo(() => ({
         create: (Component, props, options) => {
             const id = options?.id || createUID();
-            const activeElement = getActiveElement();
+            const activeElement = lastFocusedBeforeProgress.current ?? getActiveElement();
+            lastFocusedBeforeProgress.current = null;
             const initiatorRef = activeElement ? new WeakRef(activeElement) : null;
             const methods = {
                 dismiss: () => {
@@ -104,7 +109,18 @@ const ModalManager = ({ children }) => {
                         currentActiveElement !== null &&
                         (currentActiveElement.closest('[aria-modal="true"]') !== null ||
                             currentActiveElement === document.body)) {
-                        initiator.focus();
+                        // Initiators may be momentarily disbaled, inert, hidden, etc...
+                        // Try to return focus as quickly as possible.
+                        const start = Date.now();
+                        const poll = () => {
+                            initiator.focus();
+                            if (getActiveElement() === initiator)
+                                return;
+                            if (Date.now() - start < 100) {
+                                requestAnimationFrame(poll);
+                            }
+                        };
+                        poll();
                     }
                 },
                 update: updateProps => {
@@ -156,6 +172,7 @@ const ModalManager = ({ children }) => {
                         minimizable: false,
                         maximizable: false,
                         dockable: false,
+                        moveable: false,
                         defaultMinimized: false,
                         unmountWhenMinimized: true,
                         ...options,
@@ -166,16 +183,18 @@ const ModalManager = ({ children }) => {
             return methods;
         },
         ModalContext,
-        initialized: true
+        initialized: true,
+        lastFocusedBeforeProgress
     }), []);
+    const hasActiveModal = modals.some(modal => ['open', 'maximized'].includes(modal.state));
     useEffect(() => {
-        if (modals.some(modal => ['open', 'closed', 'maximized'].includes(modal.state))) {
+        if (hasActiveModal) {
             disableScroll();
         }
         else {
             enableScroll();
         }
-    }, [modals]);
+    }, [hasActiveModal]);
     const { portalTarget } = useConfiguration();
     const context = windowIsAvailable
         ? window.cosmos.modalManagerContext ?? ModalManagerContext
@@ -184,7 +203,7 @@ const ModalManager = ({ children }) => {
     // Don't create additional Modal portals.
     if (priorCtx.initialized)
         return _jsx(context.Provider, { value: priorCtx, children: children });
-    return (_jsxs(context.Provider, { value: providerValue, children: [children, modals.length > 0 &&
+    return (_jsxs(context.Provider, { value: providerValue, children: [_jsx("div", { inert: hasActiveModal ? '' : undefined, style: { display: 'contents' }, children: children }), modals.length > 0 &&
                 portalTarget &&
                 createPortal(_jsx(RenderModals, { modals: modals }), portalTarget)] }));
 };

package/lib/components/Modal/ModalManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useReducer, useMemo, useEffect, useContext, memo } from 'react';\nimport type { FunctionComponent, ComponentType, Dispatch, Context } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, getActiveElement, windowIsAvailable } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport type { ExcludeStrict, OmitStrict } from '../../types';\nimport '../../init';\n\nimport DockedModals from './DockedModals';\nimport type {\n  ModalMethods,\n  ModalOptions,\n  ModalObject,\n  ModalManagerProps,\n  ModalState,\n  ModalManagerContextValue\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n  export interface CosmosGlobals {\n    modalManagerContext?: Context<ModalManagerContextValue>;\n  }\n}\n\ntype ModalAction =\n  | 'create'\n  | 'update'\n  | 'minimize'\n  | 'maximize'\n  | 'dock'\n  | 'activate'\n  | 'dismiss'\n  | 'unmount';\n\ntype ModalReducerPayload<P extends object> =\n  | { action: 'create'; modal: ModalObject<P> }\n  | {\n      action: 'update';\n      modal: Partial<OmitStrict<ModalObject<P>, 'props'>> &\n        Pick<ModalObject, 'id'> & { props: Partial<ModalObject<P>['props']> };\n    }\n  | {\n      action: ExcludeStrict<ModalAction, 'create' | 'update'>;\n      modal: Pick<ModalObject, 'id'>;\n    };\n\nconst reducer = <P extends object>(\n  modals: ModalObject[],\n  payload: ModalReducerPayload<P>\n): ModalObject<any>[] => {\n  switch (payload.action) {\n    case 'create':\n      return [...modals, payload.modal];\n\n    case 'unmount':\n      return modals.filter(modal => modal.id !== payload.modal.id);\n\n    case 'dismiss':\n      return modals.map(modal => {\n        modal.state = modal.id === payload.modal.id ? 'closed' : modal.state;\n        return modal;\n      });\n\n    case 'update':\n      return modals.map(modal => {\n        modal.props =\n          modal.id === payload.modal.id ? { ...modal.props, ...payload.modal.props } : modal.props;\n        return modal;\n      });\n\n    case 'activate': {\n      const newModals = modals.map(modal => {\n        modal.state = modal.id === payload.modal.id ? 'open' : modal.state;\n        return modal;\n      });\n\n      // Move the newly activated modal to the end of the list\n      // to ensure it is shown on top of other active modals.\n      const activatedModal = newModals.splice(\n        newModals.findIndex(modal => modal.id === payload.modal.id),\n        1\n      );\n\n      return [...newModals, ...activatedModal];\n    }\n\n    case 'minimize':\n      return modals.map(modal => {\n        modal.state =\n          modal.id === payload.modal.id && modal.options.minimizable ? 'minimized' : modal.state;\n        return modal;\n      });\n\n    case 'maximize':\n      return modals.map(modal => {\n        modal.state =\n          modal.id === payload.modal.id && modal.options.maximizable ? 'maximized' : modal.state;\n        return modal;\n      });\n\n    case 'dock':\n      return modals.map(modal => {\n        modal.state =\n          modal.id === payload.modal.id && modal.options.dockable ? 'docked' : 'minimized';\n        return modal;\n      });\n\n    default:\n      return modals;\n  }\n};\n\nconst WrappedModal = memo(\n  ({\n    Component,\n    id,\n    options: { alert, dismissible, dockable, minimizable, maximizable },\n    state,\n    methods,\n    props,\n    top\n  }: ModalObject & { top: boolean }) => (\n    <ModalContext.Provider\n      // eslint-disable-next-line react/jsx-no-constructed-context-values\n      value={{\n        id,\n        alert,\n        dismissible,\n        minimizable,\n        maximizable,\n        dockable,\n        state,\n        top,\n        initialized: true,\n        ...methods\n      }}\n    >\n      <Component {...props} />\n    </ModalContext.Provider>\n  )\n);\n\nconst RenderModals = ({ modals }: { modals: ModalObject[] }) => {\n  const { open, minimized, alerts } = modals.reduce<{\n    open: ModalObject[];\n    minimized: ModalObject[];\n    alerts: ModalObject[];\n  }>(\n    (obj, modal) => {\n      if (modal.options.alert) obj.alerts.push(modal);\n      else if (modal.state === 'minimized' || modal.state === 'docked') {\n        obj.minimized.push(modal);\n      } else obj.open.push(modal);\n\n      return obj;\n    },\n    { open: [], minimized: [], alerts: [] }\n  );\n\n  return (\n    <>\n      {open.map((modal, i) => (\n        <WrappedModal\n          {...modal}\n          top={alerts.length === 0 && i === open.length - 1}\n          key={modal.id}\n        />\n      ))}\n      {minimized.length > 0 && (\n        <DockedModals>\n          {minimized.map(modal => (\n            <WrappedModal {...modal} top={false} key={modal.id} />\n          ))}\n        </DockedModals>\n      )}\n      {alerts.map((modal, i) => (\n        <WrappedModal {...modal} top={i === open.length - 1} key={modal.id} />\n      ))}\n    </>\n  );\n};\n\nconst ModalManager: FunctionComponent<ModalManagerProps> = ({ children }) => {\n  const [modals, dispatch] = useReducer(reducer, []);\n  const { disableScroll, enableScroll } = useScrollToggle();\n\n  const providerValue = useMemo(\n    () => ({\n      create: <P extends object>(\n        Component: ComponentType<P>,\n        props?: P,\n        options?: ModalOptions\n      ) => {\n        const id = options?.id || createUID();\n        const activeElement = getActiveElement();\n        const initiatorRef = activeElement ? new WeakRef(activeElement) : null;\n\n        const methods: ModalMethods<P> = {\n          dismiss: () => {\n            dispatch({ action: 'dismiss', modal: { id } });\n            options?.onDismiss?.(id);\n            const initiator = initiatorRef?.deref();\n            const currentActiveElement = getActiveElement();\n            if (\n              initiator?.isConnected &&\n              (initiator instanceof HTMLElement || initiator instanceof SVGElement) &&\n              currentActiveElement !== null &&\n              (currentActiveElement.closest('[aria-modal=\"true\"]') !== null ||\n                currentActiveElement === document.body)\n            ) {\n              initiator.focus();\n            }\n          },\n          update: updateProps => {\n            (dispatch as Dispatch<ModalReducerPayload<P>>)({\n              action: 'update',\n              modal: { id, props: updateProps }\n            });\n          },\n          minimize: () => {\n            dispatch({ action: 'minimize', modal: { id } });\n            options?.onMinimize?.(id);\n          },\n          maximize: () => {\n            dispatch({ action: 'maximize', modal: { id } });\n            options?.onMaximize?.(id);\n          },\n          dock: () => {\n            dispatch({ action: 'dock', modal: { id } });\n            options?.onDock?.(id);\n          },\n          activate: () => {\n            dispatch({ action: 'activate', modal: { id } });\n            options?.onActivate?.(id);\n          },\n          unmount: () => {\n            dispatch({ action: 'unmount', modal: { id } });\n          }\n        };\n\n        let defaultState: ModalState;\n        if (options?.defaultMinimized) {\n          defaultState = 'minimized';\n        } else if (options?.dockable) {\n          defaultState = 'docked';\n        } else {\n          defaultState = 'open';\n        }\n\n        (dispatch as Dispatch<ModalReducerPayload<P>>)({\n          action: 'create',\n          modal: {\n            id,\n            methods,\n            Component,\n            props,\n            state: defaultState,\n            options: {\n              alert: false,\n              minimizable: false,\n              maximizable: false,\n              dockable: false,\n              defaultMinimized: false,\n              unmountWhenMinimized: true,\n              ...options,\n              dismissible: !!(options?.alert ? false : options?.dismissible ?? true)\n            }\n          }\n        });\n\n        return methods;\n      },\n      ModalContext,\n      initialized: true\n    }),\n    []\n  );\n\n  useEffect(() => {\n    if (modals.some(modal => ['open', 'closed', 'maximized'].includes(modal.state))) {\n      disableScroll();\n    } else {\n      enableScroll();\n    }\n  }, [modals]);\n\n  const { portalTarget } = useConfiguration();\n\n  const context = windowIsAvailable\n    ? window.cosmos.modalManagerContext ?? ModalManagerContext\n    : ModalManagerContext;\n  const priorCtx = useContext(context);\n\n  // Don't create additional Modal portals.\n  if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n  return (\n    <context.Provider value={providerValue}>\n      {children}\n      {modals.length > 0 &&\n        portalTarget &&\n        createPortal(<RenderModals modals={modals} />, portalTarget)}\n    </context.Provider>\n  );\n};\n\nexport default ModalManager;\n"]}
+{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useReducer, useMemo, useEffect, useContext, useRef, memo } from 'react';\nimport type { FunctionComponent, ComponentType, Dispatch, Context } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, getActiveElement, windowIsAvailable } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport type { ExcludeStrict, OmitStrict } from '../../types';\nimport '../../init';\n\nimport DockedModals from './DockedModals';\nimport type {\n  ModalMethods,\n  ModalOptions,\n  ModalObject,\n  ModalManagerProps,\n  ModalState,\n  ModalManagerContextValue\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n  export interface CosmosGlobals {\n    modalManagerContext?: Context<ModalManagerContextValue>;\n  }\n}\n\ntype ModalAction =\n  | 'create'\n  | 'update'\n  | 'minimize'\n  | 'maximize'\n  | 'dock'\n  | 'activate'\n  | 'dismiss'\n  | 'unmount';\n\ntype ModalReducerPayload<P extends object> =\n  | { action: 'create'; modal: ModalObject<P> }\n  | {\n      action: 'update';\n      modal: Partial<OmitStrict<ModalObject<P>, 'props'>> &\n        Pick<ModalObject, 'id'> & { props: Partial<ModalObject<P>['props']> };\n    }\n  | {\n      action: ExcludeStrict<ModalAction, 'create' | 'update'>;\n      modal: Pick<ModalObject, 'id'>;\n    };\n\nconst reducer = <P extends object>(\n  modals: ModalObject[],\n  payload: ModalReducerPayload<P>\n): ModalObject<any>[] => {\n  switch (payload.action) {\n    case 'create':\n      return [...modals, payload.modal];\n\n    case 'unmount':\n      return modals.filter(modal => modal.id !== payload.modal.id);\n\n    case 'dismiss':\n      return modals.map(modal => {\n        modal.state = modal.id === payload.modal.id ? 'closed' : modal.state;\n        return modal;\n      });\n\n    case 'update':\n      return modals.map(modal => {\n        modal.props =\n          modal.id === payload.modal.id ? { ...modal.props, ...payload.modal.props } : modal.props;\n        return modal;\n      });\n\n    case 'activate': {\n      const newModals = modals.map(modal => {\n        modal.state = modal.id === payload.modal.id ? 'open' : modal.state;\n        return modal;\n      });\n\n      // Move the newly activated modal to the end of the list\n      // to ensure it is shown on top of other active modals.\n      const activatedModal = newModals.splice(\n        newModals.findIndex(modal => modal.id === payload.modal.id),\n        1\n      );\n\n      return [...newModals, ...activatedModal];\n    }\n\n    case 'minimize':\n      return modals.map(modal => {\n        modal.state =\n          modal.id === payload.modal.id && modal.options.minimizable ? 'minimized' : modal.state;\n        return modal;\n      });\n\n    case 'maximize':\n      return modals.map(modal => {\n        modal.state =\n          modal.id === payload.modal.id && modal.options.maximizable ? 'maximized' : modal.state;\n        return modal;\n      });\n\n    case 'dock':\n      return modals.map(modal => {\n        modal.state =\n          modal.id === payload.modal.id && modal.options.dockable ? 'docked' : 'minimized';\n        return modal;\n      });\n\n    default:\n      return modals;\n  }\n};\n\nconst WrappedModal = memo(\n  ({\n    Component,\n    id,\n    options: { alert, dismissible, dockable, moveable, minimizable, maximizable },\n    state,\n    methods,\n    props,\n    top\n  }: ModalObject & { top: boolean }) => (\n    <ModalContext.Provider\n      // eslint-disable-next-line react/jsx-no-constructed-context-values\n      value={{\n        id,\n        alert,\n        dismissible,\n        minimizable,\n        maximizable,\n        dockable,\n        moveable,\n        state,\n        top,\n        initialized: true,\n        ...methods\n      }}\n    >\n      <Component {...props} />\n    </ModalContext.Provider>\n  )\n);\n\nconst RenderModals = ({ modals }: { modals: ModalObject[] }) => {\n  const { open, minimized, alerts } = modals.reduce<{\n    open: ModalObject[];\n    minimized: ModalObject[];\n    alerts: ModalObject[];\n  }>(\n    (obj, modal) => {\n      if (modal.options.alert) obj.alerts.push(modal);\n      else if (modal.state === 'minimized' || modal.state === 'docked') {\n        obj.minimized.push(modal);\n      } else obj.open.push(modal);\n\n      return obj;\n    },\n    { open: [], minimized: [], alerts: [] }\n  );\n\n  const activeAlerts = alerts.filter(a => a.state !== 'closed');\n  const activeOpen = open.filter(m => m.state !== 'closed');\n\n  return (\n    <>\n      {open.map((modal, i) => (\n        <WrappedModal\n          {...modal}\n          top={activeAlerts.length === 0 && i === activeOpen.length - 1}\n          key={modal.id}\n        />\n      ))}\n      {minimized.length > 0 && (\n        <DockedModals>\n          {minimized.map(modal => (\n            <WrappedModal {...modal} top={false} key={modal.id} />\n          ))}\n        </DockedModals>\n      )}\n      {alerts.map((modal, i) => (\n        <WrappedModal {...modal} top={i === alerts.length - 1} key={modal.id} />\n      ))}\n    </>\n  );\n};\n\nconst ModalManager: FunctionComponent<ModalManagerProps> = ({ children }) => {\n  const [modals, dispatch] = useReducer(reducer, []);\n  const { disableScroll, enableScroll } = useScrollToggle();\n  const lastFocusedBeforeProgress = useRef<Element | null>(null);\n\n  const providerValue = useMemo(\n    () => ({\n      create: <P extends object>(\n        Component: ComponentType<P>,\n        props?: P,\n        options?: ModalOptions\n      ) => {\n        const id = options?.id || createUID();\n        const activeElement = lastFocusedBeforeProgress.current ?? getActiveElement();\n        lastFocusedBeforeProgress.current = null;\n        const initiatorRef = activeElement ? new WeakRef(activeElement) : null;\n\n        const methods: ModalMethods<P> = {\n          dismiss: () => {\n            dispatch({ action: 'dismiss', modal: { id } });\n            options?.onDismiss?.(id);\n            const initiator = initiatorRef?.deref();\n            const currentActiveElement = getActiveElement();\n            if (\n              initiator?.isConnected &&\n              (initiator instanceof HTMLElement || initiator instanceof SVGElement) &&\n              currentActiveElement !== null &&\n              (currentActiveElement.closest('[aria-modal=\"true\"]') !== null ||\n                currentActiveElement === document.body)\n            ) {\n              // Initiators may be momentarily disbaled, inert, hidden, etc...\n              // Try to return focus as quickly as possible.\n              const start = Date.now();\n              const poll = () => {\n                initiator.focus();\n                if (getActiveElement() === initiator) return;\n                if (Date.now() - start < 100) {\n                  requestAnimationFrame(poll);\n                }\n              };\n              poll();\n            }\n          },\n          update: updateProps => {\n            (dispatch as Dispatch<ModalReducerPayload<P>>)({\n              action: 'update',\n              modal: { id, props: updateProps }\n            });\n          },\n          minimize: () => {\n            dispatch({ action: 'minimize', modal: { id } });\n            options?.onMinimize?.(id);\n          },\n          maximize: () => {\n            dispatch({ action: 'maximize', modal: { id } });\n            options?.onMaximize?.(id);\n          },\n          dock: () => {\n            dispatch({ action: 'dock', modal: { id } });\n            options?.onDock?.(id);\n          },\n          activate: () => {\n            dispatch({ action: 'activate', modal: { id } });\n            options?.onActivate?.(id);\n          },\n          unmount: () => {\n            dispatch({ action: 'unmount', modal: { id } });\n          }\n        };\n\n        let defaultState: ModalState;\n        if (options?.defaultMinimized) {\n          defaultState = 'minimized';\n        } else if (options?.dockable) {\n          defaultState = 'docked';\n        } else {\n          defaultState = 'open';\n        }\n\n        (dispatch as Dispatch<ModalReducerPayload<P>>)({\n          action: 'create',\n          modal: {\n            id,\n            methods,\n            Component,\n            props,\n            state: defaultState,\n            options: {\n              alert: false,\n              minimizable: false,\n              maximizable: false,\n              dockable: false,\n              moveable: false,\n              defaultMinimized: false,\n              unmountWhenMinimized: true,\n              ...options,\n              dismissible: !!(options?.alert ? false : options?.dismissible ?? true)\n            }\n          }\n        });\n\n        return methods;\n      },\n      ModalContext,\n      initialized: true,\n      lastFocusedBeforeProgress\n    }),\n    []\n  );\n\n  const hasActiveModal = modals.some(modal => ['open', 'maximized'].includes(modal.state));\n\n  useEffect(() => {\n    if (hasActiveModal) {\n      disableScroll();\n    } else {\n      enableScroll();\n    }\n  }, [hasActiveModal]);\n\n  const { portalTarget } = useConfiguration();\n\n  const context = windowIsAvailable\n    ? window.cosmos.modalManagerContext ?? ModalManagerContext\n    : ModalManagerContext;\n  const priorCtx = useContext(context);\n\n  // Don't create additional Modal portals.\n  if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n  return (\n    <context.Provider value={providerValue}>\n      <div inert={hasActiveModal ? '' : undefined} style={{ display: 'contents' }}>\n        {children}\n      </div>\n      {modals.length > 0 &&\n        portalTarget &&\n        createPortal(<RenderModals modals={modals} />, portalTarget)}\n    </context.Provider>\n  );\n};\n\nexport default ModalManager;\n"]}

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

@@ -0,0 +1,30 @@
+import type { MutableRefObject, RefObject } from 'react';
+interface UseModalMoveProps {
+    enabled: boolean;
+    moveRef: RefObject<HTMLElement>;
+    grabRef?: RefObject<HTMLElement>;
+}
+interface UseModalMovePropsReturn {
+    mouseMoved: boolean;
+}
+/**
+ * A custom hook that enables dragging and keyboard-based movement for docked modals.
+ *
+ * @param props - The hook configuration options
+ * @param props.enabled - Whether the move functionality is enabled
+ * @param props.moveRef - Reference to the element that will be moved
+ * @param props.grabRef - Optional reference to the element used as the drag handle (defaults to moveRef)
+ *
+ * @returns A ref object containing information about move interactions
+ *
+ * @remarks
+ * - Supports mouse drag (left mouse button) to horizontally reposition the modal
+ * - Supports keyboard arrow keys for incremental movement when focused
+ * - Holding Alt key prevents dragging and changes cursor to 'auto'
+ * - Movement is constrained within viewport boundaries
+ * - Uses requestAnimationFrame for smooth drag performance
+ * - Keyboard movements are 5% of viewport width per key press
+ */
+declare const useModalMove: ({ enabled, moveRef, grabRef }: UseModalMoveProps) => MutableRefObject<UseModalMovePropsReturn>;
+export default useModalMove;
+//# sourceMappingURL=useModalMove.d.ts.map

package/lib/components/Modal/useModalMove.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useModalMove.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/useModalMove.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzD,UAAU,iBAAiB;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;CAClC;AAED,UAAU,uBAAuB;IAC/B,UAAU,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,YAAY,GAAI,+BAInB,iBAAiB,KAAG,gBAAgB,CAAC,uBAAuB,CA+J9D,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/Modal/useModalMove.js

@@ -0,0 +1,148 @@
+import { useEffect, useRef } from 'react';
+/**
+ * A custom hook that enables dragging and keyboard-based movement for docked modals.
+ *
+ * @param props - The hook configuration options
+ * @param props.enabled - Whether the move functionality is enabled
+ * @param props.moveRef - Reference to the element that will be moved
+ * @param props.grabRef - Optional reference to the element used as the drag handle (defaults to moveRef)
+ *
+ * @returns A ref object containing information about move interactions
+ *
+ * @remarks
+ * - Supports mouse drag (left mouse button) to horizontally reposition the modal
+ * - Supports keyboard arrow keys for incremental movement when focused
+ * - Holding Alt key prevents dragging and changes cursor to 'auto'
+ * - Movement is constrained within viewport boundaries
+ * - Uses requestAnimationFrame for smooth drag performance
+ * - Keyboard movements are 5% of viewport width per key press
+ */
+const useModalMove = ({ enabled, moveRef, grabRef = moveRef }) => {
+    const initialMouseDownX = useRef();
+    const initialRect = useRef();
+    const viewportWidth = useRef();
+    const rafRef = useRef(-1);
+    const left = useRef();
+    const returnRef = useRef({
+        mouseMoved: false
+    });
+    useEffect(() => {
+        if (!enabled || !moveRef.current || !grabRef.current)
+            return;
+        // Handles applying the inline style for movement
+        const applyMove = (amount) => {
+            if (!moveRef.current || !viewportWidth.current || !initialRect.current) {
+                return;
+            }
+            // Keep a ref to left position changes. Re-applied to docked modals after re-open.
+            left.current = amount;
+            // Clamp within viewport boundaries
+            moveRef.current.style.left = `clamp(0px, ${amount}px, ${viewportWidth.current - initialRect.current.width}px)`;
+        };
+        // Apply any prior movement
+        if (left.current !== undefined) {
+            // Capture so applyMove has fresh measurements on each key move
+            initialRect.current = moveRef.current.getBoundingClientRect();
+            viewportWidth.current = document.documentElement.clientWidth;
+            applyMove(left.current);
+        }
+        const onMouseMove = (e) => {
+            if (!initialMouseDownX.current || !moveRef.current || !initialRect.current) {
+                return;
+            }
+            // The delta of change on the X axis since the user grabbed the modal
+            const movedSinceMouseDown = e.clientX - initialMouseDownX.current;
+            // The new left position of the modal
+            const newLeft = movedSinceMouseDown + initialRect.current.left;
+            // Set flag to indicate upcoming mouseup is from user drag, not click
+            returnRef.current.mouseMoved = true;
+            // Avoids excessive and unnecessary update calls
+            cancelAnimationFrame(rafRef.current);
+            rafRef.current = requestAnimationFrame(() => {
+                applyMove(newLeft);
+            });
+        };
+        const onMouseUp = () => {
+            if (!grabRef.current)
+                return;
+            // Remove to allow component CSS to take effect
+            grabRef.current.style.userSelect = '';
+            document.removeEventListener('mousemove', onMouseMove);
+        };
+        const onMouseDown = (e) => {
+            // When Alt key is press disable grab move functionality to allow for user select
+            const altPressed = e.getModifierState('Alt');
+            // Only handle primary/left mouse button
+            const mousePrimaryPressed = e.button === 0;
+            if (!moveRef.current || !grabRef.current || !mousePrimaryPressed || altPressed) {
+                return;
+            }
+            // Need to listen for mouseup on Document since pointer may move out of modal header at time of release.
+            document.addEventListener('mouseup', onMouseUp, { once: true });
+            // Where the user starts grabbing
+            initialMouseDownX.current = e.clientX;
+            // The rect of the modal el
+            initialRect.current = moveRef.current.getBoundingClientRect();
+            // Viewport width not including scrollbars
+            viewportWidth.current = document.documentElement.clientWidth;
+            // Disable user select while dragging to avoid awkward text selection
+            grabRef.current.style.userSelect = 'none';
+            // Listen to mouse movement
+            document.addEventListener('mousemove', onMouseMove);
+            // Reset the return ref flag
+            returnRef.current.mouseMoved = false;
+        };
+        const onKeyUp = (e) => {
+            if (grabRef.current && e.key === 'Alt') {
+                // Remove to allow component CSS to take effect
+                grabRef.current.style.cursor = '';
+            }
+        };
+        const onKeyDown = (e) => {
+            if (!moveRef.current)
+                return;
+            // If the user is presssing Alt allow for standard cursor behavior
+            if (grabRef.current && e.key === 'Alt') {
+                grabRef.current.style.cursor = 'auto';
+            }
+            if (
+            // Only move on arrow keys if the modal is focus visible i.e. user keyboard tabbed to it
+            !grabRef.current?.matches(':focus-visible') ||
+                (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight')) {
+                return;
+            }
+            // Capture so applyMove has fresh measurements on each key move
+            initialRect.current = moveRef.current.getBoundingClientRect();
+            viewportWidth.current = document.documentElement.clientWidth;
+            // Move in steps proportionally to viewport width
+            const keyMoveAmount = viewportWidth.current * 0.05;
+            const direction = e.key === 'ArrowLeft' ? -1 : 1;
+            const currentLeft = initialRect.current.left;
+            const newLeft = currentLeft + keyMoveAmount * direction;
+            applyMove(newLeft);
+        };
+        const onResize = () => {
+            if (!moveRef.current || left.current === undefined)
+                return;
+            // Update measurements for new viewport size
+            initialRect.current = moveRef.current.getBoundingClientRect();
+            viewportWidth.current = document.documentElement.clientWidth;
+            // Re-apply move to clamp within new viewport bounds
+            applyMove(left.current);
+        };
+        grabRef.current.addEventListener('mousedown', onMouseDown);
+        document.addEventListener('keydown', onKeyDown);
+        document.addEventListener('keyup', onKeyUp);
+        window.addEventListener('resize', onResize);
+        return () => {
+            grabRef.current?.removeEventListener('mousedown', onMouseDown);
+            document.removeEventListener('mousemove', onMouseMove);
+            document.removeEventListener('keydown', onKeyDown);
+            document.removeEventListener('keyup', onKeyUp);
+            window.removeEventListener('resize', onResize);
+        };
+    }, [enabled]);
+    return returnRef;
+};
+export default useModalMove;
+//# sourceMappingURL=useModalMove.js.map

package/lib/components/Modal/useModalMove.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useModalMove.js","sourceRoot":"","sources":["../../../src/components/Modal/useModalMove.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { MutableRefObject, RefObject } from 'react';\n\ninterface UseModalMoveProps {\n  enabled: boolean;\n  moveRef: RefObject<HTMLElement>;\n  grabRef?: RefObject<HTMLElement>;\n}\n\ninterface UseModalMovePropsReturn {\n  mouseMoved: boolean;\n}\n\n/**\n * A custom hook that enables dragging and keyboard-based movement for docked modals.\n *\n * @param props - The hook configuration options\n * @param props.enabled - Whether the move functionality is enabled\n * @param props.moveRef - Reference to the element that will be moved\n * @param props.grabRef - Optional reference to the element used as the drag handle (defaults to moveRef)\n *\n * @returns A ref object containing information about move interactions\n *\n * @remarks\n * - Supports mouse drag (left mouse button) to horizontally reposition the modal\n * - Supports keyboard arrow keys for incremental movement when focused\n * - Holding Alt key prevents dragging and changes cursor to 'auto'\n * - Movement is constrained within viewport boundaries\n * - Uses requestAnimationFrame for smooth drag performance\n * - Keyboard movements are 5% of viewport width per key press\n */\nconst useModalMove = ({\n  enabled,\n  moveRef,\n  grabRef = moveRef\n}: UseModalMoveProps): MutableRefObject<UseModalMovePropsReturn> => {\n  const initialMouseDownX = useRef<number | undefined>();\n  const initialRect = useRef<DOMRect>();\n  const viewportWidth = useRef<number>();\n  const rafRef = useRef<number>(-1);\n  const left = useRef<number>();\n\n  const returnRef = useRef<UseModalMovePropsReturn>({\n    mouseMoved: false\n  });\n\n  useEffect(() => {\n    if (!enabled || !moveRef.current || !grabRef.current) return;\n\n    // Handles applying the inline style for movement\n    const applyMove = (amount: number) => {\n      if (!moveRef.current || !viewportWidth.current || !initialRect.current) {\n        return;\n      }\n\n      // Keep a ref to left position changes. Re-applied to docked modals after re-open.\n      left.current = amount;\n\n      // Clamp within viewport boundaries\n      moveRef.current.style.left = `clamp(0px, ${amount}px, ${viewportWidth.current - initialRect.current.width}px)`;\n    };\n\n    // Apply any prior movement\n    if (left.current !== undefined) {\n      // Capture so applyMove has fresh measurements on each key move\n      initialRect.current = moveRef.current.getBoundingClientRect();\n      viewportWidth.current = document.documentElement.clientWidth;\n\n      applyMove(left.current);\n    }\n\n    const onMouseMove = (e: MouseEvent) => {\n      if (!initialMouseDownX.current || !moveRef.current || !initialRect.current) {\n        return;\n      }\n\n      // The delta of change on the X axis since the user grabbed the modal\n      const movedSinceMouseDown = e.clientX - initialMouseDownX.current;\n\n      // The new left position of the modal\n      const newLeft = movedSinceMouseDown + initialRect.current.left;\n\n      // Set flag to indicate upcoming mouseup is from user drag, not click\n      returnRef.current.mouseMoved = true;\n\n      // Avoids excessive and unnecessary update calls\n      cancelAnimationFrame(rafRef.current);\n      rafRef.current = requestAnimationFrame(() => {\n        applyMove(newLeft);\n      });\n    };\n\n    const onMouseUp = () => {\n      if (!grabRef.current) return;\n\n      // Remove to allow component CSS to take effect\n      grabRef.current.style.userSelect = '';\n      document.removeEventListener('mousemove', onMouseMove);\n    };\n\n    const onMouseDown = (e: MouseEvent) => {\n      // When Alt key is press disable grab move functionality to allow for user select\n      const altPressed = e.getModifierState('Alt');\n\n      // Only handle primary/left mouse button\n      const mousePrimaryPressed = e.button === 0;\n\n      if (!moveRef.current || !grabRef.current || !mousePrimaryPressed || altPressed) {\n        return;\n      }\n\n      // Need to listen for mouseup on Document since pointer may move out of modal header at time of release.\n      document.addEventListener('mouseup', onMouseUp, { once: true });\n\n      // Where the user starts grabbing\n      initialMouseDownX.current = e.clientX;\n\n      // The rect of the modal el\n      initialRect.current = moveRef.current.getBoundingClientRect();\n\n      // Viewport width not including scrollbars\n      viewportWidth.current = document.documentElement.clientWidth;\n\n      // Disable user select while dragging to avoid awkward text selection\n      grabRef.current.style.userSelect = 'none';\n\n      // Listen to mouse movement\n      document.addEventListener('mousemove', onMouseMove);\n\n      // Reset the return ref flag\n      returnRef.current.mouseMoved = false;\n    };\n\n    const onKeyUp = (e: KeyboardEvent) => {\n      if (grabRef.current && e.key === 'Alt') {\n        // Remove to allow component CSS to take effect\n        grabRef.current.style.cursor = '';\n      }\n    };\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (!moveRef.current) return;\n\n      // If the user is presssing Alt allow for standard cursor behavior\n      if (grabRef.current && e.key === 'Alt') {\n        grabRef.current.style.cursor = 'auto';\n      }\n\n      if (\n        // Only move on arrow keys if the modal is focus visible i.e. user keyboard tabbed to it\n        !grabRef.current?.matches(':focus-visible') ||\n        (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight')\n      ) {\n        return;\n      }\n\n      // Capture so applyMove has fresh measurements on each key move\n      initialRect.current = moveRef.current.getBoundingClientRect();\n      viewportWidth.current = document.documentElement.clientWidth;\n\n      // Move in steps proportionally to viewport width\n      const keyMoveAmount = viewportWidth.current * 0.05;\n      const direction = e.key === 'ArrowLeft' ? -1 : 1;\n      const currentLeft = initialRect.current.left;\n      const newLeft = currentLeft + keyMoveAmount * direction;\n      applyMove(newLeft);\n    };\n\n    const onResize = () => {\n      if (!moveRef.current || left.current === undefined) return;\n\n      // Update measurements for new viewport size\n      initialRect.current = moveRef.current.getBoundingClientRect();\n      viewportWidth.current = document.documentElement.clientWidth;\n\n      // Re-apply move to clamp within new viewport bounds\n      applyMove(left.current);\n    };\n\n    grabRef.current.addEventListener('mousedown', onMouseDown);\n    document.addEventListener('keydown', onKeyDown);\n    document.addEventListener('keyup', onKeyUp);\n    window.addEventListener('resize', onResize);\n\n    return () => {\n      grabRef.current?.removeEventListener('mousedown', onMouseDown);\n      document.removeEventListener('mousemove', onMouseMove);\n      document.removeEventListener('keydown', onKeyDown);\n      document.removeEventListener('keyup', onKeyUp);\n      window.removeEventListener('resize', onResize);\n    };\n  }, [enabled]);\n\n  return returnRef;\n};\n\nexport default useModalMove;\n"]}