@pega/cosmos-react-core 3.0.0-dev.4.2 → 3.0.0-dev.5.0

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

@@ -1 +1 @@
-{"version":3,"file":"MinimizedModal.js","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useContext, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport BareRoleButton from '../Button/BareRoleButton';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport { useI18n } from '../../hooks';\n\nimport { ModalProps } from './Modal.types';\nimport { ModalManagerContext } from './Contexts';\n\nregisterIcon(timesIcon, minusIcon, undockIcon);\n\nconst StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {\n  return css`\n    height: 3rem;\n    width: 30ch;\n    border-radius: calc(0.5 * ${base['border-radius']}) calc(0.5 * ${base['border-radius']}) 0 0;\n    color: ${base.palette['foreground-color']};\n    background-color: ${base.palette['primary-background']};\n    box-shadow: ${base.shadow.low};\n    cursor: pointer;\n    user-select: none;\n    transition: box-shadow ${base.animation.speed} ${base.animation.timing.ease};\n\n    &:hover {\n      box-shadow: ${base.shadow.high};\n    }\n\n    &:focus {\n      outline: none;\n      box-shadow: ${base.shadow.focus};\n    }\n\n    > div:first-child {\n      margin-inline-end: auto;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  `;\n});\n\nStyledMinimizedModal.defaultProps = defaultThemeProp;\n\nconst MinimizedModal: FunctionComponent<ModalProps & ForwardProps> = ({\n  heading,\n  onBeforeClose,\n  onAfterClose,\n  onRequestDismiss,\n  onRequestActivate,\n  onRequestMinimize,\n  onRequestMaximize,\n  onRequestDock,\n  ...restProps\n}) => {\n  const { ModalContext } = useContext(ModalManagerContext);\n  const { dismissible, dockable, maximizable, dock, maximize, activate, unmount } =\n    useContext(ModalContext);\n\n  const t = useI18n();\n\n  return (\n    <Flex\n      {...restProps}\n      container={{ alignItems: 'center', justify: 'between', pad: [0, 2], gap: 2 }}\n      item={{ shrink: 0 }}\n      as={StyledMinimizedModal}\n      aria-label={`${t('activate')} ${heading}`}\n      onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n        // Prevent issues when auto focusing on close button.\n        if ((e.key === 'Space' || e.key === 'Enter') && e.target === e.currentTarget)\n          e.preventDefault();\n      }}\n      onClick={() => {\n        if (onRequestActivate?.() !== false && !dockable) activate();\n        if (onRequestDock?.() !== false && dockable) dock();\n      }}\n    >\n      <div>{heading}</div>\n\n      {(maximizable || dockable || dismissible) && (\n        <Flex container>\n          {maximizable && (\n            <Button\n              icon\n              variant='simple'\n              aria-label={t('modal_maximize')}\n              onClick={() => {\n                if (onRequestMaximize?.() !== false) {\n                  maximize();\n                }\n              }}\n            >\n              <Icon name='undock' />\n            </Button>\n          )}\n\n          {dockable && (\n            <Button\n              aria-label={t('modal_dock')}\n              variant='simple'\n              onClick={() => {\n                if (onRequestDock?.() !== false) {\n                  dock();\n                }\n              }}\n              icon\n            >\n              <Icon name='minus' />\n            </Button>\n          )}\n\n          {dismissible && (\n            <Button\n              aria-label={`${t('close')} ${heading}`}\n              variant='simple'\n              onClick={() => {\n                if (onRequestDismiss?.() !== false) {\n                  onBeforeClose?.();\n                  unmount();\n                  onAfterClose?.();\n                }\n              }}\n              icon\n            >\n              <Icon name='times' />\n            </Button>\n          )}\n        </Flex>\n      )}\n    </Flex>\n  );\n};\n\nexport default MinimizedModal;\n"]}
+{"version":3,"file":"MinimizedModal.js","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useContext, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport BareRoleButton from '../Button/BareRoleButton';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport { useI18n } from '../../hooks';\n\nimport { ModalProps } from './Modal.types';\nimport { ModalManagerContext } from './Contexts';\n\nregisterIcon(timesIcon, minusIcon, undockIcon);\n\nconst StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {\n  return css`\n    height: 3rem;\n    width: 30ch;\n    border-radius: calc(0.5 * ${base['border-radius']}) calc(0.5 * ${base['border-radius']}) 0 0;\n    color: ${base.palette['foreground-color']};\n    background-color: ${base.palette['primary-background']};\n    box-shadow: ${base.shadow.low};\n    cursor: pointer;\n    user-select: none;\n    transition: box-shadow ${base.animation.speed} ${base.animation.timing.ease};\n\n    &:hover {\n      box-shadow: ${base.shadow.high};\n    }\n\n    &:focus {\n      outline: none;\n      box-shadow: ${base.shadow.focus};\n    }\n\n    > div:first-child {\n      margin-inline-end: auto;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  `;\n});\n\nStyledMinimizedModal.defaultProps = defaultThemeProp;\n\nconst MinimizedModal: FunctionComponent<ModalProps & ForwardProps> = ({\n  heading,\n  onBeforeClose,\n  onAfterClose,\n  onRequestDismiss,\n  onRequestActivate,\n  onRequestMinimize,\n  onRequestMaximize,\n  onRequestDock,\n  ...restProps\n}) => {\n  const { ModalContext } = useContext(ModalManagerContext);\n  const { dismissible, dockable, maximizable, dock, maximize, activate, unmount } =\n    useContext(ModalContext);\n\n  const t = useI18n();\n\n  return (\n    <Flex\n      {...restProps}\n      container={{ alignItems: 'center', justify: 'between', pad: [0, 2], gap: 2 }}\n      item={{ shrink: 0 }}\n      as={StyledMinimizedModal}\n      aria-label={`${t('activate')} ${heading}`}\n      onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n        // Prevent issues when auto focusing on close button.\n        if ((e.key === 'Space' || e.key === 'Enter') && e.target === e.currentTarget)\n          e.preventDefault();\n      }}\n      onClick={() => {\n        if (onRequestActivate?.() !== false && !dockable) activate();\n        if (onRequestDock?.() !== false && dockable) dock();\n      }}\n    >\n      <div>{heading}</div>\n\n      {(maximizable || dockable || dismissible) && (\n        <Flex container>\n          {maximizable && (\n            <Button\n              icon\n              variant='simple'\n              aria-label={t('modal_maximize')}\n              onClick={() => {\n                if (onRequestMaximize?.() !== false) {\n                  maximize();\n                }\n              }}\n            >\n              <Icon name='undock' />\n            </Button>\n          )}\n\n          {dockable && (\n            <Button\n              aria-label={t('modal_dock')}\n              variant='simple'\n              onClick={() => {\n                if (onRequestDock?.() !== false) {\n                  dock();\n                }\n              }}\n              icon\n            >\n              <Icon name='minus' />\n            </Button>\n          )}\n\n          {dismissible && (\n            <Button\n              aria-label={`${t('close')} ${heading}`}\n              variant='simple'\n              onClick={() => {\n                if (onRequestDismiss?.() !== false) {\n                  onBeforeClose?.();\n                  unmount();\n                  onAfterClose?.();\n                }\n              }}\n              icon\n            >\n              <Icon name='times' />\n            </Button>\n          )}\n        </Flex>\n      )}\n    </Flex>\n  );\n};\n\nexport default MinimizedModal;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAkB3C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAWhD,QAAA,MAAM,KAAK,EAAE,iBAAiB,CAAC,UAAU,GAAG,YAAY,CAsSvD,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAmB3C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAWhD,QAAA,MAAM,KAAK,EAAE,iBAAiB,CAAC,UAAU,GAAG,YAAY,CA2QvD,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/components/Modal/Modal.js

@@ -5,7 +5,7 @@ import { getFocusables } from '../../utils';
 import Backdrop from '../Backdrop';
 import Flex from '../Flex';
 import Button from '../Button';
-import { useAfterInitialEffect, useConsolidatedRef, useI18n, useOuterEvent, useUID } from '../../hooks';
+import { useAfterInitialEffect, useConsolidatedRef, useI18n, useOuterEvent, useUID, useFocusTrap } from '../../hooks';
 import Icon, { registerIcon } from '../Icon';
 import * as timesIcon from '../Icon/icons/times.icon';
 import * as minusIcon from '../Icon/icons/minus.icon';
@@ -46,31 +46,7 @@ const Modal = forwardRef((props, refArg) => {
             focusable?.focus();
         }
     };
-    const onKeyDown = useCallback((e) => {
-        if (e.key === 'Tab') {
-            const focusables = getFocusables(modalRef);
-            if (!focusables)
-                return;
-            const firstFocusable = focusables[0];
-            const lastFocusable = focusables[focusables.length - 1];
-            if (document.activeElement === modalRef.current ||
-                (document.activeElement === firstFocusable && e.shiftKey)) {
-                lastFocusable?.focus();
-                e.preventDefault();
-            }
-            else if ((document.activeElement === lastFocusable && !e.shiftKey) ||
-                focusables.length < 2) {
-                firstFocusable?.focus();
-                e.preventDefault();
-            }
-        }
-    }, []);
-    useEffect(() => {
-        document.addEventListener('keydown', onKeyDown);
-        return () => {
-            document.removeEventListener('keydown', onKeyDown);
-        };
-    }, [onKeyDown]);
+    useFocusTrap(modalRef);
     useOuterEvent('mousedown', [modalRef], e => {
         if (['minimized', 'docked', 'closed'].includes(state))
             return;
@@ -112,33 +88,33 @@ const Modal = forwardRef((props, refArg) => {
         }
     }, [progress]);
     const maximized = stretch || state === 'maximized';
-    const modal = (_jsxs(Flex, { ...restProps, container: { direction: 'column' }, ref: modalRef, as: StyledModal, forwardedAs: as, onClick: (e) => e.stopPropagation(), onKeyDown: onModalKeyDown, alert: alert, role: alert ? 'alertdialog' : 'dialog', stretch: maximized, center: center, "aria-labelledby": `${id}-heading`, "aria-modal": state === 'docked' ? 'false' : 'true', state: state, "aria-live": 'polite', "aria-busy": progress ? 'true' : 'false', children: [_jsxs(Flex, { container: { justify: 'between', alignItems: 'center', gap: 1 }, item: { shrink: 0 }, as: StyledModalHeader, hasAction: minimizable || dismissible, children: [_jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, as: Text, variant: 'h2', id: `${id}-heading`, children: [_jsx("span", { children: heading }, void 0), typeof count === 'number' && _jsx(Count, { children: count }, void 0)] }, void 0), _jsxs(Flex, { container: true, children: [maximizable && !alert && state !== 'maximized' && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_maximize'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
+    const modal = (_jsxs(Flex, { ...restProps, container: { direction: 'column' }, ref: modalRef, as: StyledModal, forwardedAs: as, onClick: (e) => e.stopPropagation(), onKeyDown: onModalKeyDown, alert: alert, role: alert ? 'alertdialog' : 'dialog', stretch: maximized, center: center, "aria-labelledby": `${id}-heading`, "aria-modal": state === 'docked' ? 'false' : 'true', state: state, "aria-live": 'polite', "aria-busy": progress ? 'true' : 'false', children: [_jsxs(Flex, { container: { justify: 'between', alignItems: 'center', gap: 1 }, item: { shrink: 0 }, as: StyledModalHeader, hasAction: minimizable || dismissible, children: [_jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, as: Text, variant: 'h2', id: `${id}-heading`, children: [_jsx("span", { children: heading }), typeof count === 'number' && _jsx(Count, { children: count })] }), _jsxs(Flex, { container: true, children: [maximizable && !alert && state !== 'maximized' && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_maximize'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
                                     if (onRequestMaximize?.() !== false) {
                                         maximize();
                                     }
-                                }, children: _jsx(Icon, { name: 'undock' }, void 0) }, void 0)), dockable && !alert && state !== 'docked' && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_dock'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
+                                }, children: _jsx(Icon, { name: 'undock' }) })), dockable && !alert && state !== 'docked' && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_dock'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
                                     if (onRequestDock?.() !== false) {
                                         dock();
                                     }
-                                }, children: _jsx(Icon, { name: 'dock' }, void 0) }, void 0)), minimizable && !alert && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_minimize'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
+                                }, children: _jsx(Icon, { name: 'dock' }) })), minimizable && !alert && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_minimize'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
                                     if (onRequestMinimize?.() !== false) {
                                         minimize();
                                     }
-                                }, children: _jsx(Icon, { name: 'minus' }, void 0) }, void 0)), dismissible && !alert && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_close'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
+                                }, children: _jsx(Icon, { name: 'minus' }) })), dismissible && !alert && (_jsx(Button, { icon: true, variant: 'simple', "aria-label": t('modal_close'), onKeyDown: onHeaderActionKeyDown, onClick: () => {
                                     tryDismiss();
                                     if (dockable) {
                                         onBeforeClose?.();
                                         unmount();
                                         onAfterClose?.();
                                     }
-                                }, ref: closeButtonRef, children: _jsx(Icon, { name: 'times' }, void 0) }, void 0))] }, void 0)] }, void 0), _jsxs(Flex, { item: { grow: 1 }, as: StyledModalContent, ref: modalContentRef, children: [children && _jsx(StyledModalChildrenWrap, { children: children }, void 0), _jsx(Progress, { visible: !!progress, placement: 'local', message: typeof progress === 'object' ? progress.message : t('loading') }, void 0)] }, void 0), actions && (_jsx(Flex, { container: { justify: 'between' }, item: { shrink: 0 }, as: StyledModalActions, children: actions }, void 0))] }, void 0));
+                                }, ref: closeButtonRef, children: _jsx(Icon, { name: 'times' }) }))] })] }), _jsxs(Flex, { item: { grow: 1 }, as: StyledModalContent, ref: modalContentRef, children: [children && _jsx(StyledModalChildrenWrap, { children: children }), _jsx(Progress, { visible: !!progress, placement: 'local', message: typeof progress === 'object' ? progress.message : t('loading') })] }), actions && (_jsx(Flex, { container: { justify: 'between' }, item: { shrink: 0 }, as: StyledModalActions, children: actions }))] }));
     const renderModal = state === 'docked' ? (modal) : (_jsx(Backdrop, { ref: backdropRef, container: {
             alignItems: center || maximized ? 'center' : 'start'
         }, transitionSpeed: 'slow', open: state === 'open' || state === 'maximized', onBeforeTransitionIn: onBeforeOpen, onAfterTransitionIn: onAfterOpen, onBeforeTransitionOut: onBeforeClose, onAfterTransitionOut: () => {
             unmount();
             onAfterClose?.();
-        }, children: modal }, void 0));
-    return state === 'minimized' ? _jsx(MinimizedModal, { ...props, ...restProps }, void 0) : renderModal;
+        }, children: modal }));
+    return state === 'minimized' ? _jsx(MinimizedModal, { ...props, ...restProps }) : renderModal;
 });
 export default Modal;
 //# sourceMappingURL=Modal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useContext,\n  useEffect,\n  MouseEvent,\n  useRef,\n  useCallback,\n  KeyboardEvent as ReactKeyboardEvent\n} from 'react';\n\nimport Progress from '../Progress';\nimport { getFocusables } from '../../utils';\nimport Backdrop from '../Backdrop';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport { ForwardProps } from '../../types';\nimport {\n  useAfterInitialEffect,\n  useConsolidatedRef,\n  useI18n,\n  useOuterEvent,\n  useUID\n} from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as dockIcon from '../Icon/icons/dock.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport Text from '../Text';\nimport { Count } from '../Badges';\n\nimport { ModalManagerContext } from './Contexts';\nimport MinimizedModal from './MinimizedModal';\nimport type { ModalProps } from './Modal.types';\nimport {\n  StyledModal,\n  StyledModalHeader,\n  StyledModalContent,\n  StyledModalActions,\n  StyledModalChildrenWrap\n} from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, dockIcon, undockIcon);\n\nconst Modal: FunctionComponent<ModalProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<ModalProps>, refArg: Ref<HTMLElement>) => {\n    const {\n      as,\n      progress = false,\n      heading,\n      count,\n      children,\n      actions,\n      stretch = false,\n      center = false,\n      defaultFocus,\n      onBeforeOpen,\n      onAfterOpen,\n      onBeforeClose,\n      onAfterClose,\n      onRequestDismiss,\n      onRequestMinimize,\n      onRequestMaximize,\n      onRequestDock,\n      onRequestActivate,\n      ...restProps\n    } = props;\n\n    const { ModalContext } = useContext(ModalManagerContext);\n    const {\n      alert,\n      dismissible,\n      minimizable,\n      maximizable,\n      dockable,\n      state,\n      dismiss,\n      minimize,\n      maximize,\n      dock,\n      unmount,\n      top\n    } = useContext(ModalContext);\n\n    const modalRef = useConsolidatedRef(refArg);\n    const modalContentRef = useRef<HTMLDivElement>(null);\n    const backdropRef = useRef<HTMLDivElement>(null);\n    const closeButtonRef = useRef<HTMLButtonElement>(null);\n    const id = useUID();\n    const t = useI18n();\n\n    const tryDismiss = () => {\n      if (onRequestDismiss?.() !== false) {\n        dismiss();\n      }\n    };\n\n    const setFocus = () => {\n      const focusables = getFocusables(modalRef);\n\n      if (defaultFocus?.current) {\n        defaultFocus.current.focus();\n      } else {\n        const focusable =\n          focusables.find(el => {\n            return modalContentRef.current?.contains(el);\n          }) ??\n          closeButtonRef.current ??\n          focusables[0];\n\n        focusable?.focus();\n      }\n    };\n\n    const onKeyDown = useCallback((e: KeyboardEvent) => {\n      if (e.key === 'Tab') {\n        const focusables = getFocusables(modalRef);\n        if (!focusables) return;\n        const firstFocusable = focusables[0];\n        const lastFocusable = focusables[focusables.length - 1];\n        if (\n          document.activeElement === modalRef.current ||\n          (document.activeElement === firstFocusable && e.shiftKey)\n        ) {\n          lastFocusable?.focus();\n          e.preventDefault();\n        } else if (\n          (document.activeElement === lastFocusable && !e.shiftKey) ||\n          focusables.length < 2\n        ) {\n          firstFocusable?.focus();\n          e.preventDefault();\n        }\n      }\n    }, []);\n\n    useEffect(() => {\n      document.addEventListener('keydown', onKeyDown);\n      return () => {\n        document.removeEventListener('keydown', onKeyDown);\n      };\n    }, [onKeyDown]);\n\n    useOuterEvent('mousedown', [modalRef], e => {\n      if (['minimized', 'docked', 'closed'].includes(state)) return;\n\n      if (dismissible) {\n        if (e.target === backdropRef.current) {\n          tryDismiss();\n        }\n      } else {\n        modalRef.current?.focus();\n      }\n    });\n\n    useEffect(() => {\n      if (state === 'minimized') return;\n      if (state === 'open' || state === 'maximized' || state === 'docked') setFocus();\n    }, [state]);\n\n    // Dismiss on Escape needs to be handled using React event handling to be cancelable using SyntheticEvent.stopPropagation.\n    const onModalKeyDown = useCallback(\n      (e: ReactKeyboardEvent) => {\n        if (\n          dismissible &&\n          (state === 'open' || state === 'maximized') &&\n          e.key === 'Escape' &&\n          top\n        ) {\n          tryDismiss();\n        }\n      },\n      [dismissible, state, top, tryDismiss]\n    );\n\n    const onHeaderActionKeyDown = useCallback((e: ReactKeyboardEvent<HTMLButtonElement>) => {\n      if (e.repeat && (e.key === 'Enter' || e.key === ' ')) e.preventDefault();\n    }, []);\n\n    // Set a ref based on the initial progress state to be used later to check for setting focus.\n    const focusOnProgressChange = useRef(!!progress);\n    useAfterInitialEffect(() => {\n      // If the progress prop changed and we have already set focus we are done.\n      if (!progress && focusOnProgressChange.current) {\n        setFocus();\n        focusOnProgressChange.current = false;\n      }\n    }, [progress]);\n\n    const maximized = stretch || state === 'maximized';\n\n    const modal = (\n      <Flex\n        {...restProps}\n        container={{ direction: 'column' }}\n        ref={modalRef}\n        as={StyledModal}\n        forwardedAs={as}\n        onClick={(e: MouseEvent) => e.stopPropagation()}\n        onKeyDown={onModalKeyDown}\n        alert={alert}\n        role={alert ? 'alertdialog' : 'dialog'}\n        stretch={maximized}\n        center={center}\n        aria-labelledby={`${id}-heading`}\n        aria-modal={state === 'docked' ? 'false' : 'true'}\n        state={state}\n        // FOR PR REVIEW: This may be too much, this may be fine...\n        aria-live='polite'\n        aria-busy={progress ? 'true' : 'false'}\n      >\n        <Flex\n          container={{ justify: 'between', alignItems: 'center', gap: 1 }}\n          item={{ shrink: 0 }}\n          as={StyledModalHeader}\n          hasAction={minimizable || dismissible}\n        >\n          <Flex\n            container={{ alignItems: 'center', gap: 1 }}\n            as={Text}\n            variant='h2'\n            id={`${id}-heading`}\n          >\n            <span>{heading}</span>\n            {typeof count === 'number' && <Count>{count}</Count>}\n          </Flex>\n\n          <Flex container>\n            {maximizable && !alert && state !== 'maximized' && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_maximize')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  if (onRequestMaximize?.() !== false) {\n                    maximize();\n                  }\n                }}\n              >\n                <Icon name='undock' />\n              </Button>\n            )}\n            {dockable && !alert && state !== 'docked' && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_dock')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  if (onRequestDock?.() !== false) {\n                    dock();\n                  }\n                }}\n              >\n                <Icon name='dock' />\n              </Button>\n            )}\n            {minimizable && !alert && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_minimize')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  if (onRequestMinimize?.() !== false) {\n                    minimize();\n                  }\n                }}\n              >\n                <Icon name='minus' />\n              </Button>\n            )}\n            {dismissible && !alert && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_close')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  tryDismiss();\n                  if (dockable) {\n                    onBeforeClose?.();\n                    unmount();\n                    onAfterClose?.();\n                  }\n                }}\n                ref={closeButtonRef}\n              >\n                <Icon name='times' />\n              </Button>\n            )}\n          </Flex>\n        </Flex>\n\n        <Flex item={{ grow: 1 }} as={StyledModalContent} ref={modalContentRef}>\n          {children && <StyledModalChildrenWrap>{children}</StyledModalChildrenWrap>}\n\n          <Progress\n            visible={!!progress}\n            placement='local'\n            message={typeof progress === 'object' ? progress.message : t('loading')}\n          />\n        </Flex>\n\n        {actions && (\n          <Flex container={{ justify: 'between' }} item={{ shrink: 0 }} as={StyledModalActions}>\n            {actions}\n          </Flex>\n        )}\n      </Flex>\n    );\n\n    const renderModal =\n      state === 'docked' ? (\n        modal\n      ) : (\n        <Backdrop\n          ref={backdropRef}\n          container={{\n            alignItems: center || maximized ? 'center' : 'start'\n          }}\n          transitionSpeed='slow'\n          open={state === 'open' || state === 'maximized'}\n          onBeforeTransitionIn={onBeforeOpen}\n          onAfterTransitionIn={onAfterOpen}\n          onBeforeTransitionOut={onBeforeClose}\n          onAfterTransitionOut={() => {\n            unmount();\n            onAfterClose?.();\n          }}\n        >\n          {modal}\n        </Backdrop>\n      );\n\n    return state === 'minimized' ? <MinimizedModal {...props} {...restProps} /> : renderModal;\n  }\n);\n\nexport default Modal;\n"]}
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useContext,\n  useEffect,\n  MouseEvent,\n  useRef,\n  useCallback,\n  KeyboardEvent as ReactKeyboardEvent\n} from 'react';\n\nimport Progress from '../Progress';\nimport { getFocusables } from '../../utils';\nimport Backdrop from '../Backdrop';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport { ForwardProps } from '../../types';\nimport {\n  useAfterInitialEffect,\n  useConsolidatedRef,\n  useI18n,\n  useOuterEvent,\n  useUID,\n  useFocusTrap\n} from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as dockIcon from '../Icon/icons/dock.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport Text from '../Text';\nimport { Count } from '../Badges';\n\nimport { ModalManagerContext } from './Contexts';\nimport MinimizedModal from './MinimizedModal';\nimport type { ModalProps } from './Modal.types';\nimport {\n  StyledModal,\n  StyledModalHeader,\n  StyledModalContent,\n  StyledModalActions,\n  StyledModalChildrenWrap\n} from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, dockIcon, undockIcon);\n\nconst Modal: FunctionComponent<ModalProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<ModalProps>, refArg: Ref<HTMLElement>) => {\n    const {\n      as,\n      progress = false,\n      heading,\n      count,\n      children,\n      actions,\n      stretch = false,\n      center = false,\n      defaultFocus,\n      onBeforeOpen,\n      onAfterOpen,\n      onBeforeClose,\n      onAfterClose,\n      onRequestDismiss,\n      onRequestMinimize,\n      onRequestMaximize,\n      onRequestDock,\n      onRequestActivate,\n      ...restProps\n    } = props;\n\n    const { ModalContext } = useContext(ModalManagerContext);\n    const {\n      alert,\n      dismissible,\n      minimizable,\n      maximizable,\n      dockable,\n      state,\n      dismiss,\n      minimize,\n      maximize,\n      dock,\n      unmount,\n      top\n    } = useContext(ModalContext);\n\n    const modalRef = useConsolidatedRef(refArg);\n    const modalContentRef = useRef<HTMLDivElement>(null);\n    const backdropRef = useRef<HTMLDivElement>(null);\n    const closeButtonRef = useRef<HTMLButtonElement>(null);\n    const id = useUID();\n    const t = useI18n();\n\n    const tryDismiss = () => {\n      if (onRequestDismiss?.() !== false) {\n        dismiss();\n      }\n    };\n\n    const setFocus = () => {\n      const focusables = getFocusables(modalRef);\n\n      if (defaultFocus?.current) {\n        defaultFocus.current.focus();\n      } else {\n        const focusable =\n          focusables.find(el => {\n            return modalContentRef.current?.contains(el);\n          }) ??\n          closeButtonRef.current ??\n          focusables[0];\n\n        focusable?.focus();\n      }\n    };\n\n    useFocusTrap(modalRef);\n\n    useOuterEvent('mousedown', [modalRef], e => {\n      if (['minimized', 'docked', 'closed'].includes(state)) return;\n\n      if (dismissible) {\n        if (e.target === backdropRef.current) {\n          tryDismiss();\n        }\n      } else {\n        modalRef.current?.focus();\n      }\n    });\n\n    useEffect(() => {\n      if (state === 'minimized') return;\n      if (state === 'open' || state === 'maximized' || state === 'docked') setFocus();\n    }, [state]);\n\n    // Dismiss on Escape needs to be handled using React event handling to be cancelable using SyntheticEvent.stopPropagation.\n    const onModalKeyDown = useCallback(\n      (e: ReactKeyboardEvent) => {\n        if (\n          dismissible &&\n          (state === 'open' || state === 'maximized') &&\n          e.key === 'Escape' &&\n          top\n        ) {\n          tryDismiss();\n        }\n      },\n      [dismissible, state, top, tryDismiss]\n    );\n\n    const onHeaderActionKeyDown = useCallback((e: ReactKeyboardEvent<HTMLButtonElement>) => {\n      if (e.repeat && (e.key === 'Enter' || e.key === ' ')) e.preventDefault();\n    }, []);\n\n    // Set a ref based on the initial progress state to be used later to check for setting focus.\n    const focusOnProgressChange = useRef(!!progress);\n    useAfterInitialEffect(() => {\n      // If the progress prop changed and we have already set focus we are done.\n      if (!progress && focusOnProgressChange.current) {\n        setFocus();\n        focusOnProgressChange.current = false;\n      }\n    }, [progress]);\n\n    const maximized = stretch || state === 'maximized';\n\n    const modal = (\n      <Flex\n        {...restProps}\n        container={{ direction: 'column' }}\n        ref={modalRef}\n        as={StyledModal}\n        forwardedAs={as}\n        onClick={(e: MouseEvent) => e.stopPropagation()}\n        onKeyDown={onModalKeyDown}\n        alert={alert}\n        role={alert ? 'alertdialog' : 'dialog'}\n        stretch={maximized}\n        center={center}\n        aria-labelledby={`${id}-heading`}\n        aria-modal={state === 'docked' ? 'false' : 'true'}\n        state={state}\n        // FOR PR REVIEW: This may be too much, this may be fine...\n        aria-live='polite'\n        aria-busy={progress ? 'true' : 'false'}\n      >\n        <Flex\n          container={{ justify: 'between', alignItems: 'center', gap: 1 }}\n          item={{ shrink: 0 }}\n          as={StyledModalHeader}\n          hasAction={minimizable || dismissible}\n        >\n          <Flex\n            container={{ alignItems: 'center', gap: 1 }}\n            as={Text}\n            variant='h2'\n            id={`${id}-heading`}\n          >\n            <span>{heading}</span>\n            {typeof count === 'number' && <Count>{count}</Count>}\n          </Flex>\n\n          <Flex container>\n            {maximizable && !alert && state !== 'maximized' && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_maximize')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  if (onRequestMaximize?.() !== false) {\n                    maximize();\n                  }\n                }}\n              >\n                <Icon name='undock' />\n              </Button>\n            )}\n            {dockable && !alert && state !== 'docked' && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_dock')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  if (onRequestDock?.() !== false) {\n                    dock();\n                  }\n                }}\n              >\n                <Icon name='dock' />\n              </Button>\n            )}\n            {minimizable && !alert && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_minimize')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  if (onRequestMinimize?.() !== false) {\n                    minimize();\n                  }\n                }}\n              >\n                <Icon name='minus' />\n              </Button>\n            )}\n            {dismissible && !alert && (\n              <Button\n                icon\n                variant='simple'\n                aria-label={t('modal_close')}\n                onKeyDown={onHeaderActionKeyDown}\n                onClick={() => {\n                  tryDismiss();\n                  if (dockable) {\n                    onBeforeClose?.();\n                    unmount();\n                    onAfterClose?.();\n                  }\n                }}\n                ref={closeButtonRef}\n              >\n                <Icon name='times' />\n              </Button>\n            )}\n          </Flex>\n        </Flex>\n\n        <Flex item={{ grow: 1 }} as={StyledModalContent} ref={modalContentRef}>\n          {children && <StyledModalChildrenWrap>{children}</StyledModalChildrenWrap>}\n\n          <Progress\n            visible={!!progress}\n            placement='local'\n            message={typeof progress === 'object' ? progress.message : t('loading')}\n          />\n        </Flex>\n\n        {actions && (\n          <Flex container={{ justify: 'between' }} item={{ shrink: 0 }} as={StyledModalActions}>\n            {actions}\n          </Flex>\n        )}\n      </Flex>\n    );\n\n    const renderModal =\n      state === 'docked' ? (\n        modal\n      ) : (\n        <Backdrop\n          ref={backdropRef}\n          container={{\n            alignItems: center || maximized ? 'center' : 'start'\n          }}\n          transitionSpeed='slow'\n          open={state === 'open' || state === 'maximized'}\n          onBeforeTransitionIn={onBeforeOpen}\n          onAfterTransitionIn={onAfterOpen}\n          onBeforeTransitionOut={onBeforeClose}\n          onAfterTransitionOut={() => {\n            unmount();\n            onAfterClose?.();\n          }}\n        >\n          {modal}\n        </Backdrop>\n      );\n\n    return state === 'minimized' ? <MinimizedModal {...props} {...restProps} /> : renderModal;\n  }\n);\n\nexport default Modal;\n"]}

package/lib/components/Modal/ModalManager.js

@@ -83,7 +83,7 @@ const WrappedModal = ({ Component, id, options: { alert, dismissible, dockable,
         top,
         [modalInitializedKey]: true,
         ...methods
-    }, children: _jsx(Component, { ...props }, void 0) }, void 0));
+    }, children: _jsx(Component, { ...props }) }));
 const RenderModals = ({ modals }) => {
     const { open, minimized, alerts } = modals.reduce((obj, modal) => {
         if (modal.options.alert)
@@ -95,7 +95,7 @@ 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 }))) }, void 0)), alerts.map((modal, i) => (_createElement(WrappedModal, { ...modal, top: i === open.length - 1, key: modal.id })))] }, void 0));
+    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 ModalManager = ({ children, context = ModalManagerContext }) => {
     const [modals, dispatch] = useReducer(reducer, []);
@@ -184,16 +184,16 @@ const ModalManager = ({ children, context = ModalManagerContext }) => {
         : {
             ...priorCtx,
             create: (Comp, props, opts) => {
-                const WrappedComp = compProps => (_jsx(ModalManager, { context: context, children: _jsx(Comp, { ...compProps }, void 0) }, void 0));
+                const WrappedComp = compProps => (_jsx(ModalManager, { context: context, children: _jsx(Comp, { ...compProps }) }));
                 return priorCtx.create(WrappedComp, props, opts);
             }
         }, [priorCtx, context]);
     // Don't create additional Modal portals.
     if (priorCtx[managerInitializedKey])
-        return (_jsx(ModalManagerContext.Provider, { value: priorCtxValue, children: children }, void 0));
+        return (_jsx(ModalManagerContext.Provider, { value: priorCtxValue, children: children }));
     return (_jsxs(ModalManagerContext.Provider, { value: providerValue, children: [children, modals.length > 0 &&
                 portalTarget &&
-                createPortal(_jsx(RenderModals, { modals: modals }, void 0), portalTarget)] }, void 0));
+                createPortal(_jsx(RenderModals, { modals: modals }), portalTarget)] }));
 };
 export default ModalManager;
 //# sourceMappingURL=ModalManager.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":";;AAAA,OAAO,EACL,UAAU,EACV,OAAO,EACP,SAAS,EACT,UAAU,EAIX,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAGhE,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAML,mBAAmB,EACnB,qBAAqB,EACtB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAwB/D,MAAM,OAAO,GAAG,CACd,MAAqB,EACrB,OAA+B,EACX,EAAE;IACtB,QAAQ,OAAO,CAAC,MAAM,EAAE;QACtB,KAAK,QAAQ;YACX,OAAO;gBACL,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;oBACpB,IACE,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK;wBAC3B,OAAO,CAAC,KAAK,CAAC,KAAK,KAAK,MAAM;wBAC9B,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK;wBACpB,KAAK,CAAC,KAAK,KAAK,MAAM;wBACtB,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC;wBAC5B,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EAC9B;wBACA,KAAK,CAAC,KAAK,GAAG,WAAW,CAAC;qBAC3B;oBAED,OAAO,KAAK,CAAC;gBACf,CAAC,CAAC;gBACF,OAAO,CAAC,KAAK;aACd,CAAC;QAEJ,KAAK,SAAS;YACZ,OAAO,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAE/D,KAAK,SAAS;YACZ,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBACrE,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,QAAQ;YACX,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBAC3F,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,UAAU;YACb,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,IAAI,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE;oBAC5D,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;iBACtB;qBAAM,IAAI,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE;oBAClE,KAAK,CAAC,KAAK,GAAG,QAAQ,CAAC;iBACxB;qBAAM,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE;oBACtF,KAAK,CAAC,KAAK,GAAG,WAAW,CAAC;iBAC3B;gBAED,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,UAAU;YACb,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBACzF,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,UAAU;YACb,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBACzF,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,MAAM;YACT,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC;gBACnF,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL;YACE,OAAO,MAAM,CAAC;KACjB;AACH,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,EAAE,EACF,OAAO,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,EACnE,KAAK,EACL,OAAO,EACP,KAAK,EACL,GAAG,EAC4B,EAAE,EAAE,CAAC,CACpC,KAAC,YAAY,CAAC,QAAQ,IACpB,KAAK,EAAE;QACL,EAAE;QACF,KAAK;QACL,WAAW;QACX,WAAW;QACX,WAAW;QACX,QAAQ;QACR,KAAK;QACL,GAAG;QACH,CAAC,mBAAmB,CAAC,EAAE,IAAI;QAC3B,GAAG,OAAO;KACX,YAED,KAAC,SAAS,OAAK,KAAK,WAAI,WACF,CACzB,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EAAE,MAAM,EAA6B,EAAE,EAAE;IAC7D,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,CAK/C,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;QACb,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK;YAAE,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAC3C,IAAI,KAAK,CAAC,KAAK,KAAK,WAAW,IAAI,KAAK,CAAC,KAAK,KAAK,QAAQ,EAAE;YAChE,GAAG,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAC3B;;YAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAE5B,OAAO,GAAG,CAAC;IACb,CAAC,EACD,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CACxC,CAAC;IAEF,OAAO,CACL,8BACG,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,eAAC,YAAY,OACP,KAAK,EACT,GAAG,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,EACjD,GAAG,EAAE,KAAK,CAAC,EAAE,GACb,CACH,CAAC,EACD,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,CACvB,KAAC,YAAY,cACV,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CACtB,eAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,GAAI,CACvD,CAAC,WACW,CAChB,EACA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACxB,eAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,GAAI,CACvE,CAAC,YACD,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAyC,CAAC,EAC1D,QAAQ,EACR,OAAO,GAAG,mBAAmB,EAC9B,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IACnD,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,eAAe,EAAE,CAAC;IAE1D,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CAAC,CAAC;QACL,MAAM,EAAE,CACN,SAA2B,EAC3B,KAAS,EACT,OAAsB,EACtB,EAAE;YACF,MAAM,EAAE,GAAG,OAAO,EAAE,EAAE,IAAI,SAAS,EAAE,CAAC;YAEtC,MAAM,OAAO,GAAoB;gBAC/B,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAC/C,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC3B,CAAC;gBACD,MAAM,EAAE,WAAW,CAAC,EAAE;oBACnB,QAA6C,CAAC;wBAC7C,MAAM,EAAE,QAAQ;wBAChB,KAAK,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE;qBAClC,CAAC,CAAC;gBACL,CAAC;gBACD,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAChD,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC5B,CAAC;gBACD,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAChD,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC5B,CAAC;gBACD,IAAI,EAAE,GAAG,EAAE;oBACT,QAAQ,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAC5C,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;gBACxB,CAAC;gBACD,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAChD,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC5B,CAAC;gBACD,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;gBACjD,CAAC;aACF,CAAC;YAEF,IAAI,YAAwB,CAAC;YAC7B,IAAI,OAAO,EAAE,gBAAgB,EAAE;gBAC7B,YAAY,GAAG,WAAW,CAAC;aAC5B;iBAAM,IAAI,OAAO,EAAE,QAAQ,EAAE;gBAC5B,YAAY,GAAG,QAAQ,CAAC;aACzB;iBAAM;gBACL,YAAY,GAAG,MAAM,CAAC;aACvB;YAEA,QAA6C,CAAC;gBAC7C,MAAM,EAAE,QAAQ;gBAChB,KAAK,EAAE;oBACL,EAAE;oBACF,OAAO;oBACP,SAAS;oBACT,KAAK;oBACL,KAAK,EAAE,YAAY;oBACnB,OAAO,EAAE;wBACP,KAAK,EAAE,KAAK;wBACZ,WAAW,EAAE,KAAK;wBAClB,WAAW,EAAE,KAAK;wBAClB,QAAQ,EAAE,KAAK;wBACf,gBAAgB,EAAE,KAAK;wBACvB,oBAAoB,EAAE,IAAI;wBAC1B,GAAG,OAAO;wBACV,WAAW,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,EAAE,WAAW,IAAI,IAAI,CAAC;qBACvE;iBACF;aACF,CAAC,CAAC;YAEH,OAAO,OAAO,CAAC;QACjB,CAAC;QACD,YAAY;QACZ,CAAC,qBAAqB,CAAC,EAAE,IAAI;KAC9B,CAAC,EACF,EAAE,CACH,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YAC3E,aAAa,EAAE,CAAC;SACjB;aAAM;YACL,YAAY,EAAE,CAAC;SAChB;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,MAAM,EAAE,YAAY,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAE5C,MAAM,QAAQ,GAAG,UAAU,CAAC,OAAO,CAAC,CAAC;IAErC,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CACH,OAAO,KAAK,mBAAmB;QAC7B,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC;YACE,GAAG,QAAQ;YACX,MAAM,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;gBAC5B,MAAM,WAAW,GAAgB,SAAS,CAAC,EAAE,CAAC,CAC5C,KAAC,YAAY,IAAC,OAAO,EAAE,OAAO,YAC5B,KAAC,IAAI,OAAK,SAAS,WAAI,WACV,CAChB,CAAC;gBACF,OAAO,QAAQ,CAAC,MAAM,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;YACnD,CAAC;SACF,EACP,CAAC,QAAQ,EAAE,OAAO,CAAC,CACpB,CAAC;IAEF,yCAAyC;IACzC,IAAI,QAAQ,CAAC,qBAAqB,CAAC;QACjC,OAAO,CACL,KAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAAG,QAAQ,WAAgC,CAC9F,CAAC;IAEJ,OAAO,CACL,MAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,aAC/C,QAAQ,EACR,MAAM,CAAC,MAAM,GAAG,CAAC;gBAChB,YAAY;gBACZ,YAAY,CAAC,KAAC,YAAY,IAAC,MAAM,EAAE,MAAM,WAAI,EAAE,YAAY,CAAC,YACjC,CAChC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import {\n  useReducer,\n  useMemo,\n  useEffect,\n  useContext,\n  FunctionComponent,\n  ComponentType,\n  Dispatch\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport { OmitStrict } from '../../types';\n\nimport DockedModals from './DockedModals';\nimport {\n  ModalMethods,\n  ModalOptions,\n  ModalObject,\n  ModalManagerProps,\n  ModalState,\n  modalInitializedKey,\n  managerInitializedKey\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\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: Exclude<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 [\n        ...modals.map(modal => {\n          if (\n            (!payload.modal.options.alert &&\n              payload.modal.state === 'open' &&\n              !modal.options.alert &&\n              modal.state === 'open' &&\n              modal.options.minimizable) ||\n            payload.modal.options.dockable\n          ) {\n            modal.state = 'minimized';\n          }\n\n          return modal;\n        }),\n        payload.modal\n      ];\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      return modals.map(modal => {\n        if (modal.id === payload.modal.id && !modal.options.dockable) {\n          modal.state = 'open';\n        } else if (modal.id === payload.modal.id && modal.options.dockable) {\n          modal.state = 'docked';\n        } else if (!modal.options.alert && modal.state === 'open' && modal.options.minimizable) {\n          modal.state = 'minimized';\n        }\n\n        return modal;\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 = ({\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    value={{\n      id,\n      alert,\n      dismissible,\n      minimizable,\n      maximizable,\n      dockable,\n      state,\n      top,\n      [modalInitializedKey]: true,\n      ...methods\n    }}\n  >\n    <Component {...props} />\n  </ModalContext.Provider>\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> = ({\n  children,\n  context = ModalManagerContext\n}) => {\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\n        const methods: ModalMethods<P> = {\n          dismiss: () => {\n            dispatch({ action: 'dismiss', modal: { id } });\n            options?.onDismiss?.(id);\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      [managerInitializedKey]: true\n    }),\n    []\n  );\n\n  useEffect(() => {\n    if (modals.some(modal => modal.state === 'open' && !modal.options.dockable)) {\n      disableScroll();\n    } else {\n      enableScroll();\n    }\n  }, [modals]);\n\n  const { portalTarget } = useConfiguration();\n\n  const priorCtx = useContext(context);\n\n  const priorCtxValue = useMemo(\n    () =>\n      context === ModalManagerContext\n        ? priorCtx\n        : {\n            ...priorCtx,\n            create: (Comp, props, opts) => {\n              const WrappedComp: typeof Comp = compProps => (\n                <ModalManager context={context}>\n                  <Comp {...compProps} />\n                </ModalManager>\n              );\n              return priorCtx.create(WrappedComp, props, opts);\n            }\n          },\n    [priorCtx, context]\n  );\n\n  // Don't create additional Modal portals.\n  if (priorCtx[managerInitializedKey])\n    return (\n      <ModalManagerContext.Provider value={priorCtxValue}>{children}</ModalManagerContext.Provider>\n    );\n\n  return (\n    <ModalManagerContext.Provider value={providerValue}>\n      {children}\n      {modals.length > 0 &&\n        portalTarget &&\n        createPortal(<RenderModals modals={modals} />, portalTarget)}\n    </ModalManagerContext.Provider>\n  );\n};\n\nexport default ModalManager;\n"]}
+{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":";;AAAA,OAAO,EACL,UAAU,EACV,OAAO,EACP,SAAS,EACT,UAAU,EAIX,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAGhE,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAML,mBAAmB,EACnB,qBAAqB,EACtB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAwB/D,MAAM,OAAO,GAAG,CACd,MAAqB,EACrB,OAA+B,EACX,EAAE;IACtB,QAAQ,OAAO,CAAC,MAAM,EAAE;QACtB,KAAK,QAAQ;YACX,OAAO;gBACL,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;oBACpB,IACE,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK;wBAC3B,OAAO,CAAC,KAAK,CAAC,KAAK,KAAK,MAAM;wBAC9B,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK;wBACpB,KAAK,CAAC,KAAK,KAAK,MAAM;wBACtB,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC;wBAC5B,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EAC9B;wBACA,KAAK,CAAC,KAAK,GAAG,WAAW,CAAC;qBAC3B;oBAED,OAAO,KAAK,CAAC;gBACf,CAAC,CAAC;gBACF,OAAO,CAAC,KAAK;aACd,CAAC;QAEJ,KAAK,SAAS;YACZ,OAAO,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAE/D,KAAK,SAAS;YACZ,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBACrE,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,QAAQ;YACX,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBAC3F,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,UAAU;YACb,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,IAAI,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE;oBAC5D,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;iBACtB;qBAAM,IAAI,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE;oBAClE,KAAK,CAAC,KAAK,GAAG,QAAQ,CAAC;iBACxB;qBAAM,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE;oBACtF,KAAK,CAAC,KAAK,GAAG,WAAW,CAAC;iBAC3B;gBAED,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,UAAU;YACb,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBACzF,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,UAAU;YACb,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;gBACzF,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL,KAAK,MAAM;YACT,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,CAAC,KAAK;oBACT,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC;gBACnF,OAAO,KAAK,CAAC;YACf,CAAC,CAAC,CAAC;QAEL;YACE,OAAO,MAAM,CAAC;KACjB;AACH,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,EAAE,EACF,OAAO,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,EACnE,KAAK,EACL,OAAO,EACP,KAAK,EACL,GAAG,EAC4B,EAAE,EAAE,CAAC,CACpC,KAAC,YAAY,CAAC,QAAQ,IACpB,KAAK,EAAE;QACL,EAAE;QACF,KAAK;QACL,WAAW;QACX,WAAW;QACX,WAAW;QACX,QAAQ;QACR,KAAK;QACL,GAAG;QACH,CAAC,mBAAmB,CAAC,EAAE,IAAI;QAC3B,GAAG,OAAO;KACX,YAED,KAAC,SAAS,OAAK,KAAK,GAAI,GACF,CACzB,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EAAE,MAAM,EAA6B,EAAE,EAAE;IAC7D,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,CAK/C,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;QACb,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK;YAAE,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAC3C,IAAI,KAAK,CAAC,KAAK,KAAK,WAAW,IAAI,KAAK,CAAC,KAAK,KAAK,QAAQ,EAAE;YAChE,GAAG,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAC3B;;YAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAE5B,OAAO,GAAG,CAAC;IACb,CAAC,EACD,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CACxC,CAAC;IAEF,OAAO,CACL,8BACG,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,eAAC,YAAY,OACP,KAAK,EACT,GAAG,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,EACjD,GAAG,EAAE,KAAK,CAAC,EAAE,GACb,CACH,CAAC,EACD,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,CACvB,KAAC,YAAY,cACV,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CACtB,eAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,GAAI,CACvD,CAAC,GACW,CAChB,EACA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACxB,eAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,GAAI,CACvE,CAAC,IACD,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAyC,CAAC,EAC1D,QAAQ,EACR,OAAO,GAAG,mBAAmB,EAC9B,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IACnD,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,eAAe,EAAE,CAAC;IAE1D,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CAAC,CAAC;QACL,MAAM,EAAE,CACN,SAA2B,EAC3B,KAAS,EACT,OAAsB,EACtB,EAAE;YACF,MAAM,EAAE,GAAG,OAAO,EAAE,EAAE,IAAI,SAAS,EAAE,CAAC;YAEtC,MAAM,OAAO,GAAoB;gBAC/B,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAC/C,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC3B,CAAC;gBACD,MAAM,EAAE,WAAW,CAAC,EAAE;oBACnB,QAA6C,CAAC;wBAC7C,MAAM,EAAE,QAAQ;wBAChB,KAAK,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE;qBAClC,CAAC,CAAC;gBACL,CAAC;gBACD,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAChD,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC5B,CAAC;gBACD,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAChD,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC5B,CAAC;gBACD,IAAI,EAAE,GAAG,EAAE;oBACT,QAAQ,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAC5C,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;gBACxB,CAAC;gBACD,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;oBAChD,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBAC5B,CAAC;gBACD,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;gBACjD,CAAC;aACF,CAAC;YAEF,IAAI,YAAwB,CAAC;YAC7B,IAAI,OAAO,EAAE,gBAAgB,EAAE;gBAC7B,YAAY,GAAG,WAAW,CAAC;aAC5B;iBAAM,IAAI,OAAO,EAAE,QAAQ,EAAE;gBAC5B,YAAY,GAAG,QAAQ,CAAC;aACzB;iBAAM;gBACL,YAAY,GAAG,MAAM,CAAC;aACvB;YAEA,QAA6C,CAAC;gBAC7C,MAAM,EAAE,QAAQ;gBAChB,KAAK,EAAE;oBACL,EAAE;oBACF,OAAO;oBACP,SAAS;oBACT,KAAK;oBACL,KAAK,EAAE,YAAY;oBACnB,OAAO,EAAE;wBACP,KAAK,EAAE,KAAK;wBACZ,WAAW,EAAE,KAAK;wBAClB,WAAW,EAAE,KAAK;wBAClB,QAAQ,EAAE,KAAK;wBACf,gBAAgB,EAAE,KAAK;wBACvB,oBAAoB,EAAE,IAAI;wBAC1B,GAAG,OAAO;wBACV,WAAW,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,EAAE,WAAW,IAAI,IAAI,CAAC;qBACvE;iBACF;aACF,CAAC,CAAC;YAEH,OAAO,OAAO,CAAC;QACjB,CAAC;QACD,YAAY;QACZ,CAAC,qBAAqB,CAAC,EAAE,IAAI;KAC9B,CAAC,EACF,EAAE,CACH,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YAC3E,aAAa,EAAE,CAAC;SACjB;aAAM;YACL,YAAY,EAAE,CAAC;SAChB;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,MAAM,EAAE,YAAY,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAE5C,MAAM,QAAQ,GAAG,UAAU,CAAC,OAAO,CAAC,CAAC;IAErC,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CACH,OAAO,KAAK,mBAAmB;QAC7B,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC;YACE,GAAG,QAAQ;YACX,MAAM,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;gBAC5B,MAAM,WAAW,GAAgB,SAAS,CAAC,EAAE,CAAC,CAC5C,KAAC,YAAY,IAAC,OAAO,EAAE,OAAO,YAC5B,KAAC,IAAI,OAAK,SAAS,GAAI,GACV,CAChB,CAAC;gBACF,OAAO,QAAQ,CAAC,MAAM,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;YACnD,CAAC;SACF,EACP,CAAC,QAAQ,EAAE,OAAO,CAAC,CACpB,CAAC;IAEF,yCAAyC;IACzC,IAAI,QAAQ,CAAC,qBAAqB,CAAC;QACjC,OAAO,CACL,KAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAAG,QAAQ,GAAgC,CAC9F,CAAC;IAEJ,OAAO,CACL,MAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,aAC/C,QAAQ,EACR,MAAM,CAAC,MAAM,GAAG,CAAC;gBAChB,YAAY;gBACZ,YAAY,CAAC,KAAC,YAAY,IAAC,MAAM,EAAE,MAAM,GAAI,EAAE,YAAY,CAAC,IACjC,CAChC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import {\n  useReducer,\n  useMemo,\n  useEffect,\n  useContext,\n  FunctionComponent,\n  ComponentType,\n  Dispatch\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport { OmitStrict } from '../../types';\n\nimport DockedModals from './DockedModals';\nimport {\n  ModalMethods,\n  ModalOptions,\n  ModalObject,\n  ModalManagerProps,\n  ModalState,\n  modalInitializedKey,\n  managerInitializedKey\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\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: Exclude<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 [\n        ...modals.map(modal => {\n          if (\n            (!payload.modal.options.alert &&\n              payload.modal.state === 'open' &&\n              !modal.options.alert &&\n              modal.state === 'open' &&\n              modal.options.minimizable) ||\n            payload.modal.options.dockable\n          ) {\n            modal.state = 'minimized';\n          }\n\n          return modal;\n        }),\n        payload.modal\n      ];\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      return modals.map(modal => {\n        if (modal.id === payload.modal.id && !modal.options.dockable) {\n          modal.state = 'open';\n        } else if (modal.id === payload.modal.id && modal.options.dockable) {\n          modal.state = 'docked';\n        } else if (!modal.options.alert && modal.state === 'open' && modal.options.minimizable) {\n          modal.state = 'minimized';\n        }\n\n        return modal;\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 = ({\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    value={{\n      id,\n      alert,\n      dismissible,\n      minimizable,\n      maximizable,\n      dockable,\n      state,\n      top,\n      [modalInitializedKey]: true,\n      ...methods\n    }}\n  >\n    <Component {...props} />\n  </ModalContext.Provider>\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> = ({\n  children,\n  context = ModalManagerContext\n}) => {\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\n        const methods: ModalMethods<P> = {\n          dismiss: () => {\n            dispatch({ action: 'dismiss', modal: { id } });\n            options?.onDismiss?.(id);\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      [managerInitializedKey]: true\n    }),\n    []\n  );\n\n  useEffect(() => {\n    if (modals.some(modal => modal.state === 'open' && !modal.options.dockable)) {\n      disableScroll();\n    } else {\n      enableScroll();\n    }\n  }, [modals]);\n\n  const { portalTarget } = useConfiguration();\n\n  const priorCtx = useContext(context);\n\n  const priorCtxValue = useMemo(\n    () =>\n      context === ModalManagerContext\n        ? priorCtx\n        : {\n            ...priorCtx,\n            create: (Comp, props, opts) => {\n              const WrappedComp: typeof Comp = compProps => (\n                <ModalManager context={context}>\n                  <Comp {...compProps} />\n                </ModalManager>\n              );\n              return priorCtx.create(WrappedComp, props, opts);\n            }\n          },\n    [priorCtx, context]\n  );\n\n  // Don't create additional Modal portals.\n  if (priorCtx[managerInitializedKey])\n    return (\n      <ModalManagerContext.Provider value={priorCtxValue}>{children}</ModalManagerContext.Provider>\n    );\n\n  return (\n    <ModalManagerContext.Provider value={providerValue}>\n      {children}\n      {modals.length > 0 &&\n        portalTarget &&\n        createPortal(<RenderModals modals={modals} />, portalTarget)}\n    </ModalManagerContext.Provider>\n  );\n};\n\nexport default ModalManager;\n"]}

package/lib/components/MultiStep/MultiStep.js

@@ -33,11 +33,11 @@ const FormProgress = ({ steps, currentId, ...restProps }) => {
                             ]
                         }
                     }
-                ], children: _jsx(Text, { variant: 'h4', children: curStep.name }, void 0) }, void 0), _jsx(Flex, { container: { justify: 'between', alignItems: 'center' }, item: { grow: 1 }, children: steps.map((step, index) => {
+                ], children: _jsx(Text, { variant: 'h4', children: curStep.name }) }), _jsx(Flex, { container: { justify: 'between', alignItems: 'center' }, item: { grow: 1 }, children: steps.map((step, index) => {
                     return (_jsx(StepMarker, { ref: (el) => {
                             stepRefs.current[index] = el;
-                        }, "aria-label": step.name, "aria-describedby": step.id, current: index === curIdx, depth: step.depth, prior: index < curIdx, onClick: step.onClick, children: index !== curIdx && (_jsx(Tooltip, { id: step.id, target: stepRefs.current[index], showDelay: 'none', hideDelay: 'short', portal: false, children: step.name }, void 0)) }, step.id));
-                }) }, void 0), _jsx(StyledBar, { children: _jsx(StyledFill, { style: { '--fillScale': fillScale } }, void 0) }, void 0)] }, void 0));
+                        }, "aria-label": step.name, "aria-describedby": step.id, current: index === curIdx, depth: step.depth, prior: index < curIdx, onClick: step.onClick, children: index !== curIdx && (_jsx(Tooltip, { id: step.id, target: stepRefs.current[index], showDelay: 'none', hideDelay: 'short', portal: false, children: step.name })) }, step.id));
+                }) }), _jsx(StyledBar, { children: _jsx(StyledFill, { style: { '--fillScale': fillScale } }) })] }));
 };
 const MultiStep = forwardRef(({ currentId, steps, ...restProps }, ref) => {
     const multiStepContentRef = useRef(null);
@@ -50,7 +50,7 @@ const MultiStep = forwardRef(({ currentId, steps, ...restProps }, ref) => {
     return (_jsxs(Flex, { as: StyledMultiStep, ref: ref, container: {
             direction: 'column',
             gap: 3
-        }, ...restProps, children: [_jsx(FormProgress, { steps: steps, currentId: currentId }, void 0), _jsx(Form, { ref: multiStepContentRef, actions: currentStep.actions, banners: currentStep.banners, children: currentStep.content }, void 0)] }, void 0));
+        }, ...restProps, children: [_jsx(FormProgress, { steps: steps, currentId: currentId }), _jsx(Form, { ref: multiStepContentRef, actions: currentStep.actions, banners: currentStep.banners, children: currentStep.content })] }));
 });
 export default MultiStep;
 //# sourceMappingURL=MultiStep.js.map

package/lib/components/MultiStep/MultiStep.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiStep.js","sourceRoot":"","sources":["../../../src/components/MultiStep/MultiStep.tsx"],"names":[],"mappings":"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","sourcesContent":["import { remToPx, stripUnit } from 'polished';\nimport {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  CSSProperties,\n  useRef,\n  useEffect\n} from 'react';\n\nimport { useElement, useTheme } from '../../hooks';\nimport { ForwardProps } from '../../types';\nimport { getFocusables, tryCatch } from '../../utils';\nimport Flex from '../Flex';\nimport Form from '../Form';\nimport Text from '../Text';\nimport Tooltip from '../Tooltip';\n\nimport StyledMultiStep, {\n  CurrentStepPopover,\n  StepMarker,\n  StyledBar,\n  StyledFill,\n  StyledFormProgress\n} from './MultiStep.styles';\nimport MultiStepProps from './MultiStep.types';\n\nconst FormProgress: FunctionComponent<MultiStepProps & ForwardProps> = ({\n  steps,\n  currentId,\n  ...restProps\n}: MultiStepProps) => {\n  const curIdx = steps.findIndex(step => step.id === currentId);\n  const curStep = steps[curIdx];\n  const fillScale = curIdx / (steps.length - 1);\n\n  const [currentStepEl, setCurrentStepEl] = useElement();\n  const stepRefs = useRef<HTMLElement[]>([]);\n  const theme = useTheme();\n\n  let popoverPlacement: 'top' | 'top-start' | 'top-end' = 'top';\n  if (curIdx === 0) popoverPlacement = 'top-start';\n  else if (curIdx === steps.length - 1) popoverPlacement = 'top-end';\n\n  useEffect(() => {\n    setCurrentStepEl(stepRefs.current[curIdx]);\n  }, [stepRefs.current, curIdx]);\n\n  return (\n    <StyledFormProgress\n      {...restProps}\n      container={{ alignItems: 'center' }}\n      role='progressbar'\n      aria-valuenow={curIdx}\n      aria-valuemin={0}\n      aria-valuetext={curStep.name}\n      aria-valuemax={steps.length}\n    >\n      <CurrentStepPopover\n        show\n        target={currentStepEl}\n        placement={popoverPlacement}\n        strategy='absolute'\n        hideOnTargetHidden\n        modifiers={[\n          {\n            name: 'offset',\n            options: {\n              offset: [\n                0,\n                tryCatch(\n                  () => stripUnit(remToPx(theme.base.spacing)),\n                  () => 8\n                )\n              ]\n            }\n          }\n        ]}\n      >\n        <Text variant='h4'>{curStep.name}</Text>\n      </CurrentStepPopover>\n      <Flex container={{ justify: 'between', alignItems: 'center' }} item={{ grow: 1 }}>\n        {steps.map((step, index) => {\n          return (\n            <StepMarker\n              key={step.id}\n              ref={(el: HTMLElement) => {\n                stepRefs.current[index] = el;\n              }}\n              aria-label={step.name}\n              aria-describedby={step.id}\n              current={index === curIdx}\n              depth={step.depth}\n              prior={index < curIdx}\n              onClick={step.onClick}\n            >\n              {index !== curIdx && (\n                <Tooltip\n                  id={step.id}\n                  target={stepRefs.current[index]}\n                  showDelay='none'\n                  hideDelay='short'\n                  portal={false}\n                >\n                  {step.name}\n                </Tooltip>\n              )}\n            </StepMarker>\n          );\n        })}\n      </Flex>\n\n      <StyledBar>\n        <StyledFill style={{ '--fillScale': fillScale } as CSSProperties} />\n      </StyledBar>\n    </StyledFormProgress>\n  );\n};\n\nconst MultiStep: FunctionComponent<MultiStepProps & ForwardProps> = forwardRef(\n  (\n    { currentId, steps, ...restProps }: PropsWithoutRef<MultiStepProps>,\n    ref: MultiStepProps['ref']\n  ) => {\n    const multiStepContentRef = useRef(null);\n    const currentStep = steps.find(step => step.id === currentId)!;\n\n    useEffect(() => {\n      const focusableElements = getFocusables(multiStepContentRef);\n\n      if (focusableElements.length) focusableElements[0].focus();\n    }, [currentId]);\n\n    return (\n      <Flex\n        as={StyledMultiStep}\n        ref={ref}\n        container={{\n          direction: 'column',\n          gap: 3\n        }}\n        {...restProps}\n      >\n        <FormProgress steps={steps} currentId={currentId} />\n        <Form ref={multiStepContentRef} actions={currentStep.actions} banners={currentStep.banners}>\n          {currentStep.content}\n        </Form>\n      </Flex>\n    );\n  }\n);\n\nexport default MultiStep;\n"]}
+{"version":3,"file":"MultiStep.js","sourceRoot":"","sources":["../../../src/components/MultiStep/MultiStep.tsx"],"names":[],"mappings":"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","sourcesContent":["import { remToPx, stripUnit } from 'polished';\nimport {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  CSSProperties,\n  useRef,\n  useEffect\n} from 'react';\n\nimport { useElement, useTheme } from '../../hooks';\nimport { ForwardProps } from '../../types';\nimport { getFocusables, tryCatch } from '../../utils';\nimport Flex from '../Flex';\nimport Form from '../Form';\nimport Text from '../Text';\nimport Tooltip from '../Tooltip';\n\nimport StyledMultiStep, {\n  CurrentStepPopover,\n  StepMarker,\n  StyledBar,\n  StyledFill,\n  StyledFormProgress\n} from './MultiStep.styles';\nimport MultiStepProps from './MultiStep.types';\n\nconst FormProgress: FunctionComponent<MultiStepProps & ForwardProps> = ({\n  steps,\n  currentId,\n  ...restProps\n}: MultiStepProps) => {\n  const curIdx = steps.findIndex(step => step.id === currentId);\n  const curStep = steps[curIdx];\n  const fillScale = curIdx / (steps.length - 1);\n\n  const [currentStepEl, setCurrentStepEl] = useElement();\n  const stepRefs = useRef<HTMLElement[]>([]);\n  const theme = useTheme();\n\n  let popoverPlacement: 'top' | 'top-start' | 'top-end' = 'top';\n  if (curIdx === 0) popoverPlacement = 'top-start';\n  else if (curIdx === steps.length - 1) popoverPlacement = 'top-end';\n\n  useEffect(() => {\n    setCurrentStepEl(stepRefs.current[curIdx]);\n  }, [stepRefs.current, curIdx]);\n\n  return (\n    <StyledFormProgress\n      {...restProps}\n      container={{ alignItems: 'center' }}\n      role='progressbar'\n      aria-valuenow={curIdx}\n      aria-valuemin={0}\n      aria-valuetext={curStep.name}\n      aria-valuemax={steps.length}\n    >\n      <CurrentStepPopover\n        show\n        target={currentStepEl}\n        placement={popoverPlacement}\n        strategy='absolute'\n        hideOnTargetHidden\n        modifiers={[\n          {\n            name: 'offset',\n            options: {\n              offset: [\n                0,\n                tryCatch(\n                  () => stripUnit(remToPx(theme.base.spacing)),\n                  () => 8\n                )\n              ]\n            }\n          }\n        ]}\n      >\n        <Text variant='h4'>{curStep.name}</Text>\n      </CurrentStepPopover>\n      <Flex container={{ justify: 'between', alignItems: 'center' }} item={{ grow: 1 }}>\n        {steps.map((step, index) => {\n          return (\n            <StepMarker\n              key={step.id}\n              ref={(el: HTMLElement) => {\n                stepRefs.current[index] = el;\n              }}\n              aria-label={step.name}\n              aria-describedby={step.id}\n              current={index === curIdx}\n              depth={step.depth}\n              prior={index < curIdx}\n              onClick={step.onClick}\n            >\n              {index !== curIdx && (\n                <Tooltip\n                  id={step.id}\n                  target={stepRefs.current[index]}\n                  showDelay='none'\n                  hideDelay='short'\n                  portal={false}\n                >\n                  {step.name}\n                </Tooltip>\n              )}\n            </StepMarker>\n          );\n        })}\n      </Flex>\n\n      <StyledBar>\n        <StyledFill style={{ '--fillScale': fillScale } as CSSProperties} />\n      </StyledBar>\n    </StyledFormProgress>\n  );\n};\n\nconst MultiStep: FunctionComponent<MultiStepProps & ForwardProps> = forwardRef(\n  (\n    { currentId, steps, ...restProps }: PropsWithoutRef<MultiStepProps>,\n    ref: MultiStepProps['ref']\n  ) => {\n    const multiStepContentRef = useRef(null);\n    const currentStep = steps.find(step => step.id === currentId)!;\n\n    useEffect(() => {\n      const focusableElements = getFocusables(multiStepContentRef);\n\n      if (focusableElements.length) focusableElements[0].focus();\n    }, [currentId]);\n\n    return (\n      <Flex\n        as={StyledMultiStep}\n        ref={ref}\n        container={{\n          direction: 'column',\n          gap: 3\n        }}\n        {...restProps}\n      >\n        <FormProgress steps={steps} currentId={currentId} />\n        <Form ref={multiStepContentRef} actions={currentStep.actions} banners={currentStep.banners}>\n          {currentStep.content}\n        </Form>\n      </Flex>\n    );\n  }\n);\n\nexport default MultiStep;\n"]}

package/lib/components/Number/NumberDisplay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NumberDisplay.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberDisplay.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5E,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAK3E,MAAM,WAAW,kBAAmB,SAAQ,SAAS,EAAE,cAAc;IACnE,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IACnC,iBAAiB,CAAC,EAAE;QAClB;;;WAGG;QACH,QAAQ,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;QAClC;;;;WAIG;QACH,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB;;;WAGG;QACH,eAAe,CAAC,EAAE,OAAO,CAAC;KAC3B,CAAC;IACF,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAsCvE,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"NumberDisplay.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberDisplay.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5E,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAK3E,MAAM,WAAW,kBAAmB,SAAQ,SAAS,EAAE,cAAc;IACnE,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IACnC,iBAAiB,CAAC,EAAE;QAClB;;;WAGG;QACH,QAAQ,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;QAClC;;;;WAIG;QACH,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB;;;WAGG;QACH,eAAe,CAAC,EAAE,OAAO,CAAC;KAC3B,CAAC;IACF,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAqCvE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/Number/NumberDisplay.js

@@ -1,17 +1,19 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { useConfiguration } from '../../hooks';
-import { getFraction } from './utils';
+import { getFraction, formatNumber } from './utils';
 const NumberDisplay = forwardRef(({ value, unit = '', unitPlacement = 'after', formattingOptions: { fractionDigits = getFraction(String(value)).substring(1).length, notation, groupSeparators = true } = {}, ...restProps }, ref) => {
     const { locale } = useConfiguration();
-    const numberFormatterOptions = {
+    const options = {
         minimumFractionDigits: fractionDigits,
         maximumFractionDigits: fractionDigits,
         useGrouping: groupSeparators,
         notation
     };
-    const formatter = new Intl.NumberFormat(locale, numberFormatterOptions);
-    return (_jsx("span", { ref: ref, ...restProps, children: value || value === 0 ? (`${unit && unitPlacement === 'before' ? `${unit}\u00a0` : ''}${formatter.format(value)}${unit && unitPlacement === 'after' ? `\u00a0${unit}` : ''}`) : (_jsx("span", { "aria-hidden": 'true', children: "\u2013\u2013" }, void 0)) }, void 0));
+    return (_jsx("span", { ref: ref, ...restProps, children: value || value === 0 ? (`${unit && unitPlacement === 'before' ? `${unit}\u00a0` : ''}${formatNumber(value, {
+            locale,
+            options
+        })}${unit && unitPlacement === 'after' ? `\u00a0${unit}` : ''}`) : (_jsx("span", { "aria-hidden": 'true', children: "\u2013\u2013" })) }));
 });
 export default NumberDisplay;
 //# sourceMappingURL=NumberDisplay.js.map

package/lib/components/Number/NumberDisplay.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberDisplay.js","sourceRoot":"","sources":["../../../src/components/Number/NumberDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAG5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAkCtC,MAAM,aAAa,GAAyD,UAAU,CACpF,CACE,EACE,KAAK,EACL,IAAI,GAAG,EAAE,EACT,aAAa,GAAG,OAAO,EACvB,iBAAiB,EAAE,EACjB,cAAc,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,EAC/D,QAAQ,EACR,eAAe,GAAG,IAAI,EACvB,GAAG,EAAE,EACN,GAAG,SAAS,EACwB,EACtC,GAA8B,EAC9B,EAAE;IACF,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEtC,MAAM,sBAAsB,GAAG;QAC7B,qBAAqB,EAAE,cAAc;QACrC,qBAAqB,EAAE,cAAc;QACrC,WAAW,EAAE,eAAe;QAC5B,QAAQ;KACmB,CAAC;IAE9B,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,sBAAsB,CAAC,CAAC;IAExE,OAAO,CACL,eAAM,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1B,KAAK,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,GAAG,IAAI,IAAI,aAAa,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,GACpF,IAAI,IAAI,aAAa,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,CAAC,EACxD,EAAE,CACH,CAAC,CAAC,CAAC,CACF,8BAAkB,MAAM,qCAAsB,CAC/C,WACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { useConfiguration } from '../../hooks';\n\nimport { getFraction } from './utils';\n\nexport interface NumberDisplayProps extends BaseProps, NoChildrenProp {\n  /** Number value */\n  value?: number | bigint;\n  /** Unit to be included in the text, for example '%' */\n  unit?: string;\n  /**\n   * Determines the placement of the unit.\n   * @default \"after\"\n   */\n  unitPlacement?: 'before' | 'after';\n  formattingOptions?: {\n    /**\n     * Value display notation.\n     * @default 'standard'\n     */\n    notation?: 'standard' | 'compact';\n    /**\n     * Determines the fixed number of fraction digits. The value is rounded to the given precision.\n     * Maximum is 20, default is value precision.\n     * @default variable\n     */\n    fractionDigits?: number;\n    /**\n     * Determines whether group separators should be shown.\n     * @default true\n     */\n    groupSeparators?: boolean;\n  };\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLSpanElement>;\n}\n\nconst NumberDisplay: FunctionComponent<NumberDisplayProps & ForwardProps> = forwardRef(\n  (\n    {\n      value,\n      unit = '',\n      unitPlacement = 'after',\n      formattingOptions: {\n        fractionDigits = getFraction(String(value)).substring(1).length,\n        notation,\n        groupSeparators = true\n      } = {},\n      ...restProps\n    }: PropsWithoutRef<NumberDisplayProps>,\n    ref: NumberDisplayProps['ref']\n  ) => {\n    const { locale } = useConfiguration();\n\n    const numberFormatterOptions = {\n      minimumFractionDigits: fractionDigits,\n      maximumFractionDigits: fractionDigits,\n      useGrouping: groupSeparators,\n      notation\n    } as Intl.NumberFormatOptions;\n\n    const formatter = new Intl.NumberFormat(locale, numberFormatterOptions);\n\n    return (\n      <span ref={ref} {...restProps}>\n        {value || value === 0 ? (\n          `${unit && unitPlacement === 'before' ? `${unit}\\u00a0` : ''}${formatter.format(value)}${\n            unit && unitPlacement === 'after' ? `\\u00a0${unit}` : ''\n          }`\n        ) : (\n          <span aria-hidden='true'>&ndash;&ndash;</span>\n        )}\n      </span>\n    );\n  }\n);\n\nexport default NumberDisplay;\n"]}
+{"version":3,"file":"NumberDisplay.js","sourceRoot":"","sources":["../../../src/components/Number/NumberDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAG5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAkCpD,MAAM,aAAa,GAAyD,UAAU,CACpF,CACE,EACE,KAAK,EACL,IAAI,GAAG,EAAE,EACT,aAAa,GAAG,OAAO,EACvB,iBAAiB,EAAE,EACjB,cAAc,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,EAC/D,QAAQ,EACR,eAAe,GAAG,IAAI,EACvB,GAAG,EAAE,EACN,GAAG,SAAS,EACwB,EACtC,GAA8B,EAC9B,EAAE;IACF,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEtC,MAAM,OAAO,GAAG;QACd,qBAAqB,EAAE,cAAc;QACrC,qBAAqB,EAAE,cAAc;QACrC,WAAW,EAAE,eAAe;QAC5B,QAAQ;KACmB,CAAC;IAE9B,OAAO,CACL,eAAM,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1B,KAAK,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,GAAG,IAAI,IAAI,aAAa,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,YAAY,CAAC,KAAK,EAAE;YACjF,MAAM;YACN,OAAO;SACR,CAAC,GAAG,IAAI,IAAI,aAAa,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CAChE,CAAC,CAAC,CAAC,CACF,8BAAkB,MAAM,6BAAsB,CAC/C,GACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { useConfiguration } from '../../hooks';\n\nimport { getFraction, formatNumber } from './utils';\n\nexport interface NumberDisplayProps extends BaseProps, NoChildrenProp {\n  /** Number value */\n  value?: number | bigint;\n  /** Unit to be included in the text, for example '%' */\n  unit?: string;\n  /**\n   * Determines the placement of the unit.\n   * @default \"after\"\n   */\n  unitPlacement?: 'before' | 'after';\n  formattingOptions?: {\n    /**\n     * Value display notation.\n     * @default 'standard'\n     */\n    notation?: 'standard' | 'compact';\n    /**\n     * Determines the fixed number of fraction digits. The value is rounded to the given precision.\n     * Maximum is 20, default is value precision.\n     * @default variable\n     */\n    fractionDigits?: number;\n    /**\n     * Determines whether group separators should be shown.\n     * @default true\n     */\n    groupSeparators?: boolean;\n  };\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLSpanElement>;\n}\n\nconst NumberDisplay: FunctionComponent<NumberDisplayProps & ForwardProps> = forwardRef(\n  (\n    {\n      value,\n      unit = '',\n      unitPlacement = 'after',\n      formattingOptions: {\n        fractionDigits = getFraction(String(value)).substring(1).length,\n        notation,\n        groupSeparators = true\n      } = {},\n      ...restProps\n    }: PropsWithoutRef<NumberDisplayProps>,\n    ref: NumberDisplayProps['ref']\n  ) => {\n    const { locale } = useConfiguration();\n\n    const options = {\n      minimumFractionDigits: fractionDigits,\n      maximumFractionDigits: fractionDigits,\n      useGrouping: groupSeparators,\n      notation\n    } as Intl.NumberFormatOptions;\n\n    return (\n      <span ref={ref} {...restProps}>\n        {value || value === 0 ? (\n          `${unit && unitPlacement === 'before' ? `${unit}\\u00a0` : ''}${formatNumber(value, {\n            locale,\n            options\n          })}${unit && unitPlacement === 'after' ? `\\u00a0${unit}` : ''}`\n        ) : (\n          <span aria-hidden='true'>&ndash;&ndash;</span>\n        )}\n      </span>\n    );\n  }\n);\n\nexport default NumberDisplay;\n"]}

package/lib/components/Number/NumberInput.js

@@ -65,20 +65,20 @@ const NumberInput = forwardRef((props, ref) => {
         onBlur?.(parsableValue);
     }, [value]);
     const t = useI18n();
-    const NumberInputComp = (_jsxs(_Fragment, { children: [unit && unitPlacement === 'before' && _jsx(Text, { children: unit }, void 0), _jsx(Input, { inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onBlur: onInputBlur, "aria-label": `${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`, ...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps } }, void 0), unit && unitPlacement === 'after' && _jsx(Text, { children: unit }, void 0)] }, void 0));
+    const NumberInputComp = (_jsxs(_Fragment, { children: [unit && unitPlacement === 'before' && _jsx(Text, { children: unit }), _jsx(Input, { inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onBlur: onInputBlur, "aria-label": `${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`, ...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps } }), unit && unitPlacement === 'after' && _jsx(Text, { children: unit })] }));
     const onMinusClick = () => {
         onChange?.(getDecrementedValue(value, min, max, step));
     };
     const onPlusClick = () => {
         onChange?.(getIncrementedValue(value, min, max, step));
     };
-    const StepperComp = (_jsxs(Flex, { as: StyledStepperInput, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, size: formattedValue?.length, unitPlacement: unitPlacement, children: [_jsx(Button, { variant: 'simple', icon: true, onClick: onMinusClick, "aria-label": t('number_decrement_value_by', [step]), readOnly: readOnly, disabled: disabled, tabIndex: -1, children: _jsx(Icon, { name: 'minus' }, void 0) }, void 0), _jsx(Flex, { container: { alignItems: 'center', wrap: 'nowrap', justify: 'center' }, item: { grow: 1 }, ref: containerRef, onClick: (e) => {
+    const StepperComp = (_jsxs(Flex, { as: StyledStepperInput, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, size: formattedValue?.length, unitPlacement: unitPlacement, children: [_jsx(Button, { variant: 'simple', icon: true, onClick: onMinusClick, "aria-label": t('number_decrement_value_by', [step]), readOnly: readOnly, disabled: disabled, tabIndex: -1, children: _jsx(Icon, { name: 'minus' }) }), _jsx(Flex, { container: { alignItems: 'center', wrap: 'nowrap', justify: 'center' }, item: { grow: 1 }, ref: containerRef, onClick: (e) => {
                     if (e.target === containerRef.current)
                         inputRef?.current?.focus();
-                }, children: NumberInputComp }, void 0), _jsx(Button, { variant: 'simple', icon: true, onClick: onPlusClick, "aria-label": t('number_increment_value_by', [step]), readOnly: readOnly, disabled: disabled, tabIndex: -1, children: _jsx(Icon, { name: 'plus' }, void 0) }, void 0)] }, void 0));
-    const NumberComp = (_jsx(Flex, { as: StyledNumberInput, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, children: NumberInputComp }, void 0));
+                }, children: NumberInputComp }), _jsx(Button, { variant: 'simple', icon: true, onClick: onPlusClick, "aria-label": t('number_increment_value_by', [step]), readOnly: readOnly, disabled: disabled, tabIndex: -1, children: _jsx(Icon, { name: 'plus' }) })] }));
+    const NumberComp = (_jsx(Flex, { as: StyledNumberInput, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, children: NumberInputComp }));
     const Comp = variant === 'stepper' && !readOnly ? StepperComp : NumberComp;
-    return label ? (_jsx(FormField, { ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp }, void 0)) : (Comp);
+    return label ? (_jsx(FormField, { ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp })) : (Comp);
 });
 export default NumberInput;
 //# sourceMappingURL=NumberInput.js.map

package/lib/components/Number/NumberInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeEvent,\n  forwardRef,\n  FunctionComponent,\n  KeyboardEvent,\n  PropsWithoutRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from 'react';\n\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport Text from '../Text';\nimport Flex from '../Flex';\nimport FormField from '../FormField';\nimport { ForwardProps } from '../../types';\nimport Input from '../Input';\nimport { useConfiguration, useConsolidatedRef, useI18n, useUID } from '../../hooks';\n\nimport StyledNumberInput, { StyledStepperInput } from './NumberInput.styles';\nimport NumberInputProps, { NUMBER_MAX_DECIMAL_PLACES } from './NumberInput.types';\nimport {\n  getCleanedValue,\n  getDecimal,\n  getDecrementedValue,\n  getFormattedValue,\n  getIncrementedValue,\n  getInteger\n} from './utils';\n\nregisterIcon(minusIcon, plusIcon);\n\nconst NumberInput: FunctionComponent<NumberInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<NumberInputProps>, ref: NumberInputProps['ref']) => {\n    const uid = useUID();\n    const {\n      id = uid,\n      status,\n      label,\n      labelHidden,\n      info,\n      required,\n      disabled,\n      readOnly,\n      value = '',\n      onChange,\n      onBlur,\n      unit,\n      unitPlacement = 'after',\n      showDecimal = true,\n      numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES,\n      showGroupSeparators = true,\n      min = Number.MIN_SAFE_INTEGER,\n      max = Number.MAX_SAFE_INTEGER,\n      step = 1,\n      variant,\n      'aria-label': ariaLabel,\n      ...restProps\n    } = props;\n\n    const { locale } = useConfiguration();\n    const [cursor, setCursor] = useState(0);\n    const inputRef = useConsolidatedRef(ref);\n    const containerRef = useRef<HTMLElement>(null);\n    const numberOfDecimals = useMemo(\n      () => (showDecimal ? numberOfDecimalsProp : 0),\n      [showDecimal, numberOfDecimalsProp]\n    );\n\n    useEffect(() => {\n      inputRef.current?.setSelectionRange(cursor, cursor);\n    }, [cursor]);\n\n    const formattedValue = useMemo(\n      () =>\n        getFormattedValue(\n          !showDecimal ? getInteger(value) : value,\n          locale,\n          showGroupSeparators,\n          numberOfDecimals\n        ),\n      [showDecimal, value, numberOfDecimals, showGroupSeparators, locale]\n    );\n\n    const onInputChange = useCallback(\n      (e: ChangeEvent<HTMLInputElement>) => {\n        const inputValue = e.target.value;\n        const selectionStart = e.target.selectionStart;\n        const decimal = getDecimal(locale);\n        const cleanedInputValue = getCleanedValue(inputValue, decimal, numberOfDecimals);\n        if (cleanedInputValue === value) return;\n        onChange?.(cleanedInputValue);\n        if (selectionStart !== undefined && selectionStart !== null) {\n          const formattedVal = getFormattedValue(\n            cleanedInputValue,\n            locale,\n            showGroupSeparators,\n            numberOfDecimals\n          );\n          const cursorPosition =\n            selectionStart + (formattedVal.length - e.target.value.length) || 1;\n          setCursor(cursorPosition);\n        }\n      },\n      [onChange, locale, value, numberOfDecimals, showDecimal, cursor, showGroupSeparators]\n    );\n\n    const onKeyDown = useCallback(\n      (ev: KeyboardEvent<HTMLInputElement>) => {\n        if (readOnly) return;\n        switch (ev.key) {\n          case 'ArrowUp':\n            ev.preventDefault();\n            onChange?.(getIncrementedValue(value, min, max, step));\n            break;\n          case 'ArrowDown':\n            ev.preventDefault();\n            onChange?.(getDecrementedValue(value, min, max, step));\n            break;\n          default:\n        }\n      },\n      [value, min, max, step, onChange]\n    );\n\n    const onInputBlur = useCallback(() => {\n      let parsableValue = value;\n      if (Number.isNaN(parseFloat(value))) {\n        parsableValue = '';\n      } else if (value?.endsWith('.')) {\n        parsableValue = value.slice(0, -1);\n      }\n      onBlur?.(parsableValue);\n    }, [value]);\n\n    const t = useI18n();\n\n    const NumberInputComp = (\n      <>\n        {unit && unitPlacement === 'before' && <Text>{unit}</Text>}\n        <Input\n          inputMode='numeric'\n          ref={inputRef}\n          value={formattedValue}\n          onKeyDown={onKeyDown}\n          onBlur={onInputBlur}\n          aria-label={`${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`}\n          {...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps }}\n        />\n        {unit && unitPlacement === 'after' && <Text>{unit}</Text>}\n      </>\n    );\n\n    const onMinusClick = () => {\n      onChange?.(getDecrementedValue(value, min, max, step));\n    };\n\n    const onPlusClick = () => {\n      onChange?.(getIncrementedValue(value, min, max, step));\n    };\n\n    const StepperComp = (\n      <Flex\n        as={StyledStepperInput}\n        container={{ alignItems: 'center', wrap: 'nowrap' }}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n        size={formattedValue?.length}\n        unitPlacement={unitPlacement}\n      >\n        <Button\n          variant='simple'\n          icon\n          onClick={onMinusClick}\n          aria-label={t('number_decrement_value_by', [step])}\n          readOnly={readOnly}\n          disabled={disabled}\n          tabIndex={-1}\n        >\n          <Icon name='minus' />\n        </Button>\n        <Flex\n          container={{ alignItems: 'center', wrap: 'nowrap', justify: 'center' }}\n          item={{ grow: 1 }}\n          ref={containerRef}\n          onClick={(e: MouseEvent) => {\n            if (e.target === containerRef.current) inputRef?.current?.focus();\n          }}\n        >\n          {NumberInputComp}\n        </Flex>\n        <Button\n          variant='simple'\n          icon\n          onClick={onPlusClick}\n          aria-label={t('number_increment_value_by', [step])}\n          readOnly={readOnly}\n          disabled={disabled}\n          tabIndex={-1}\n        >\n          <Icon name='plus' />\n        </Button>\n      </Flex>\n    );\n\n    const NumberComp = (\n      <Flex\n        as={StyledNumberInput}\n        container={{ alignItems: 'center', wrap: 'nowrap' }}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n      >\n        {NumberInputComp}\n      </Flex>\n    );\n\n    const Comp = variant === 'stepper' && !readOnly ? StepperComp : NumberComp;\n\n    return label ? (\n      <FormField {...{ label, labelHidden, id, info, status, required, disabled }}>\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default NumberInput;\n"]}
+{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeEvent,\n  forwardRef,\n  FunctionComponent,\n  KeyboardEvent,\n  PropsWithoutRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from 'react';\n\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport Text from '../Text';\nimport Flex from '../Flex';\nimport FormField from '../FormField';\nimport { ForwardProps } from '../../types';\nimport Input from '../Input';\nimport { useConfiguration, useConsolidatedRef, useI18n, useUID } from '../../hooks';\n\nimport StyledNumberInput, { StyledStepperInput } from './NumberInput.styles';\nimport NumberInputProps, { NUMBER_MAX_DECIMAL_PLACES } from './NumberInput.types';\nimport {\n  getCleanedValue,\n  getDecimal,\n  getDecrementedValue,\n  getFormattedValue,\n  getIncrementedValue,\n  getInteger\n} from './utils';\n\nregisterIcon(minusIcon, plusIcon);\n\nconst NumberInput: FunctionComponent<NumberInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<NumberInputProps>, ref: NumberInputProps['ref']) => {\n    const uid = useUID();\n    const {\n      id = uid,\n      status,\n      label,\n      labelHidden,\n      info,\n      required,\n      disabled,\n      readOnly,\n      value = '',\n      onChange,\n      onBlur,\n      unit,\n      unitPlacement = 'after',\n      showDecimal = true,\n      numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES,\n      showGroupSeparators = true,\n      min = Number.MIN_SAFE_INTEGER,\n      max = Number.MAX_SAFE_INTEGER,\n      step = 1,\n      variant,\n      'aria-label': ariaLabel,\n      ...restProps\n    } = props;\n\n    const { locale } = useConfiguration();\n    const [cursor, setCursor] = useState(0);\n    const inputRef = useConsolidatedRef(ref);\n    const containerRef = useRef<HTMLElement>(null);\n    const numberOfDecimals = useMemo(\n      () => (showDecimal ? numberOfDecimalsProp : 0),\n      [showDecimal, numberOfDecimalsProp]\n    );\n\n    useEffect(() => {\n      inputRef.current?.setSelectionRange(cursor, cursor);\n    }, [cursor]);\n\n    const formattedValue = useMemo(\n      () =>\n        getFormattedValue(\n          !showDecimal ? getInteger(value) : value,\n          locale,\n          showGroupSeparators,\n          numberOfDecimals\n        ),\n      [showDecimal, value, numberOfDecimals, showGroupSeparators, locale]\n    );\n\n    const onInputChange = useCallback(\n      (e: ChangeEvent<HTMLInputElement>) => {\n        const inputValue = e.target.value;\n        const selectionStart = e.target.selectionStart;\n        const decimal = getDecimal(locale);\n        const cleanedInputValue = getCleanedValue(inputValue, decimal, numberOfDecimals);\n        if (cleanedInputValue === value) return;\n        onChange?.(cleanedInputValue);\n        if (selectionStart !== undefined && selectionStart !== null) {\n          const formattedVal = getFormattedValue(\n            cleanedInputValue,\n            locale,\n            showGroupSeparators,\n            numberOfDecimals\n          );\n          const cursorPosition =\n            selectionStart + (formattedVal.length - e.target.value.length) || 1;\n          setCursor(cursorPosition);\n        }\n      },\n      [onChange, locale, value, numberOfDecimals, showDecimal, cursor, showGroupSeparators]\n    );\n\n    const onKeyDown = useCallback(\n      (ev: KeyboardEvent<HTMLInputElement>) => {\n        if (readOnly) return;\n        switch (ev.key) {\n          case 'ArrowUp':\n            ev.preventDefault();\n            onChange?.(getIncrementedValue(value, min, max, step));\n            break;\n          case 'ArrowDown':\n            ev.preventDefault();\n            onChange?.(getDecrementedValue(value, min, max, step));\n            break;\n          default:\n        }\n      },\n      [value, min, max, step, onChange]\n    );\n\n    const onInputBlur = useCallback(() => {\n      let parsableValue = value;\n      if (Number.isNaN(parseFloat(value))) {\n        parsableValue = '';\n      } else if (value?.endsWith('.')) {\n        parsableValue = value.slice(0, -1);\n      }\n      onBlur?.(parsableValue);\n    }, [value]);\n\n    const t = useI18n();\n\n    const NumberInputComp = (\n      <>\n        {unit && unitPlacement === 'before' && <Text>{unit}</Text>}\n        <Input\n          inputMode='numeric'\n          ref={inputRef}\n          value={formattedValue}\n          onKeyDown={onKeyDown}\n          onBlur={onInputBlur}\n          aria-label={`${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`}\n          {...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps }}\n        />\n        {unit && unitPlacement === 'after' && <Text>{unit}</Text>}\n      </>\n    );\n\n    const onMinusClick = () => {\n      onChange?.(getDecrementedValue(value, min, max, step));\n    };\n\n    const onPlusClick = () => {\n      onChange?.(getIncrementedValue(value, min, max, step));\n    };\n\n    const StepperComp = (\n      <Flex\n        as={StyledStepperInput}\n        container={{ alignItems: 'center', wrap: 'nowrap' }}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n        size={formattedValue?.length}\n        unitPlacement={unitPlacement}\n      >\n        <Button\n          variant='simple'\n          icon\n          onClick={onMinusClick}\n          aria-label={t('number_decrement_value_by', [step])}\n          readOnly={readOnly}\n          disabled={disabled}\n          tabIndex={-1}\n        >\n          <Icon name='minus' />\n        </Button>\n        <Flex\n          container={{ alignItems: 'center', wrap: 'nowrap', justify: 'center' }}\n          item={{ grow: 1 }}\n          ref={containerRef}\n          onClick={(e: MouseEvent) => {\n            if (e.target === containerRef.current) inputRef?.current?.focus();\n          }}\n        >\n          {NumberInputComp}\n        </Flex>\n        <Button\n          variant='simple'\n          icon\n          onClick={onPlusClick}\n          aria-label={t('number_increment_value_by', [step])}\n          readOnly={readOnly}\n          disabled={disabled}\n          tabIndex={-1}\n        >\n          <Icon name='plus' />\n        </Button>\n      </Flex>\n    );\n\n    const NumberComp = (\n      <Flex\n        as={StyledNumberInput}\n        container={{ alignItems: 'center', wrap: 'nowrap' }}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n      >\n        {NumberInputComp}\n      </Flex>\n    );\n\n    const Comp = variant === 'stepper' && !readOnly ? StepperComp : NumberComp;\n\n    return label ? (\n      <FormField {...{ label, labelHidden, id, info, status, required, disabled }}>\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default NumberInput;\n"]}

package/lib/components/Number/index.d.ts

@@ -2,4 +2,5 @@ export { default as NumberInput } from './NumberInput';
 export { default as NumberInputProps } from './NumberInput.types';
 export { default as NumberDisplay } from './NumberDisplay';
 export { NumberDisplayProps } from './NumberDisplay';
+export { formatNumber } from './utils';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Number/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Number/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Number/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC"}