@pega/cosmos-react-core 6.0.13 → 6.1.0

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AASnE,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,OAAO,EACL,kBAAkB,EAClB,OAAO,EACP,aAAa,EACb,MAAM,EACN,YAAY,EACZ,WAAW,EACX,eAAe,EACf,QAAQ,EACT,MAAM,aAAa,CAAC;AACrB,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,UAAU,MAAM,2BAA2B,CAAC;AACxD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAElC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,uBAAuB,EACxB,MAAM,gBAAgB,CAAC;AAExB,YAAY,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;AAEzD,MAAM,KAAK,GAAiD,UAAU,CAAC,SAAS,KAAK,CACnF,KAAkC,EAClC,GAAqB;IAErB,MAAM,EACJ,EAAE,EACF,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,GAAG,KAAK,EACf,MAAM,GAAG,KAAK,EACd,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,aAAa,EACb,YAAY,EACZ,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,aAAa,EACb,iBAAiB,EACjB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,EACJ,KAAK,EACL,WAAW,EACX,WAAW,EACX,WAAW,EACX,QAAQ,EACR,KAAK,EACL,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,GAAG,EACJ,GAAG,eAAe,EAAE,CAAC;IAEtB,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,cAAc,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACvD,MAAM,aAAa,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACzC,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC;IACpB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,gBAAgB,EAAE,EAAE,KAAK,KAAK,EAAE;YAClC,OAAO,EAAE,CAAC;SACX;IACH,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,IAAI,QAAQ;YAAE,OAAO;QAErB,MAAM,UAAU,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;QAE3C,IAAI,YAAY,EAAE,OAAO,EAAE;YACzB,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAC9B;aAAM;YACL,MAAM,SAAS,GACb,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;gBACnB,OAAO,eAAe,CAAC,OAAO,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC;YAC/C,CAAC,CAAC;gBACF,cAAc,CAAC,OAAO;gBACtB,UAAU,CAAC,CAAC,CAAC,CAAC;YAEhB,SAAS,EAAE,KAAK,EAAE,CAAC;SACpB;IACH,CAAC,CAAC;IAEF,YAAY,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAC9B,QAAQ,CAAC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC;IAEpF,aAAa,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE;QACzC,IAAI,CAAC,WAAW,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC;YAAE,OAAO;QAE9D,IAAI,WAAW,EAAE;YACf,IAAI,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,OAAO,EAAE;gBACpC,UAAU,EAAE,CAAC;aACd;SACF;aAAM;YACL,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;SAC3B;IACH,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,KAAK,WAAW;YAAE,OAAO;QAClC,IAAI,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,WAAW,IAAI,KAAK,KAAK,QAAQ;YAAE,QAAQ,EAAE,CAAC;QAEhF,4EAA4E;QAC5E,IAAI,KAAK,KAAK,QAAQ,IAAI,aAAa,KAAK,QAAQ,EAAE;YACpD,aAAa,EAAE,EAAE,CAAC;YAClB,OAAO,EAAE,CAAC;YACV,YAAY,EAAE,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,wEAAwE;QACxE,sEAAsE;QACtE,2EAA2E;QAC3E,IAAI,KAAK,KAAK,QAAQ,EAAE;YACtB,aAAa,EAAE,EAAE,CAAC;YAClB,OAAO,EAAE,CAAC;YACV,YAAY,EAAE,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,0HAA0H;IAC1H,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,CAAqB,EAAE,EAAE;QACxB,IAAI,WAAW,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,WAAW,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,GAAG,EAAE;YAC3F,UAAU,EAAE,CAAC;SACd;IACH,CAAC,EACD,CAAC,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,UAAU,CAAC,CACtC,CAAC;IAEF,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,CAAwC,EAAE,EAAE;QACrF,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC;YAAE,CAAC,CAAC,cAAc,EAAE,CAAC;IAC3E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,EAAE;YACb,QAAQ,EAAE,CAAC;SACZ;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,SAAS,GAAG,OAAO,IAAI,KAAK,KAAK,WAAW,CAAC;IAEnD,MAAM,KAAK,GAAG,CACZ,MAAC,IAAI,OACC,SAAS,EACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,GAAG,EAAE,QAAQ,EACb,EAAE,EAAE,WAAW,EACf,WAAW,EAAE,EAAE,EACf,OAAO,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAC/C,SAAS,EAAE,cAAc,EACzB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,EACtC,OAAO,EAAE,SAAS,EAClB,MAAM,EAAE,MAAM,qBACG,GAAG,EAAE,UAAU,sBACd,KAAK,CAAC,CAAC,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,gBACzC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EACjD,KAAK,EAAE,KAAK,eACD,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,aAEtC,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,iBAAiB,EACrB,SAAS,EAAE,WAAW,IAAI,WAAW,aAErC,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC3C,EAAE,EAAE,IAAI,EACR,OAAO,EAAC,IAAI,EACZ,EAAE,EAAE,GAAG,EAAE,UAAU,aAEnB,yBAAO,OAAO,GAAQ,EACrB,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAC,KAAK,cAAE,KAAK,GAAS,IAC/C,EAEP,MAAC,IAAI,IAAC,SAAS,mBACZ,WAAW,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,WAAW,IAAI,CACjD,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,UAAU,CAAC,gBACR,CAAC,CAAC,gBAAgB,CAAC,EAC/B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,iBAAiB,EAAE,EAAE,KAAK,KAAK,EAAE;wCACnC,QAAQ,EAAE,CAAC;qCACZ;gCACH,CAAC,YAED,KAAC,IAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACf,CACV,EACA,QAAQ,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,QAAQ,IAAI,CAC3C,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,gBACJ,CAAC,CAAC,YAAY,CAAC,EAC3B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,aAAa,EAAE,EAAE,KAAK,KAAK,EAAE;wCAC/B,IAAI,EAAE,CAAC;qCACR;gCACH,CAAC,YAED,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,CACV,EACA,WAAW,IAAI,CAAC,KAAK,IAAI,CACxB,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,UAAU,CAAC,gBACR,CAAC,CAAC,gBAAgB,CAAC,EAC/B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,iBAAiB,EAAE,EAAE,KAAK,KAAK,EAAE;wCACnC,QAAQ,EAAE,CAAC;qCACZ;gCACH,CAAC,YAED,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,EACA,WAAW,IAAI,CAAC,KAAK,IAAI,CACxB,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,gBACL,CAAC,CAAC,aAAa,CAAC,EAC5B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,UAAU,EACnB,GAAG,EAAE,cAAc,YAEnB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,IACI,IACF,EAEP,MAAC,IAAI,IACH,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAE,kBAAkB,EACtB,GAAG,EAAE,eAAe,EACpB,KAAK,EACH,eAAe,CAAC,OAAO;oBACrB,CAAC,CAAC,EAAE,cAAc,EAAE,GAAG,eAAe,CAAC,OAAO,CAAC,SAAS,IAAI,EAAE;oBAC9D,CAAC,CAAC,SAAS,aAGd,QAAQ,IAAI,CACX,KAAC,uBAAuB,IAAC,EAAE,EAAE,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,YAC3E,QAAQ,GACe,CAC3B,EAED,KAAC,QAAQ,IACP,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,cAAc,QACd,SAAS,EAAC,OAAO,EACjB,OAAO,EAAE,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GACvE,IACG,EAEN,OAAO,IAAI,CACV,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,kBAAkB,YACjF,OAAO,GACH,CACR,IACI,CACR,CAAC;IAEF,MAAM,WAAW,GACf,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CACnB,KAAK,CACN,CAAC,CAAC,CAAC,CACF,KAAC,QAAQ,IACP,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE;YACT,UAAU,EAAE,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;SACrD,EACD,eAAe,EAAC,MAAM,EACtB,IAAI,EAAE,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,WAAW,EAC/C,oBAAoB,EAAE,YAAY,EAClC,mBAAmB,EAAE,WAAW,EAChC,qBAAqB,EAAE,aAAa,EACpC,oBAAoB,EAAE,GAAG,EAAE;YACzB,OAAO,EAAE,CAAC;YACV,YAAY,EAAE,EAAE,CAAC;QACnB,CAAC,YAEA,KAAK,GACG,CACZ,CAAC;IAEJ,OAAO,KAAK,KAAK,WAAW,CAAC,CAAC,CAAC,KAAC,cAAc,OAAK,KAAK,KAAM,SAAS,GAAI,CAAC,CAAC,CAAC,WAAW,CAAC;AAC5F,CAAC,CAAC,CAAC;AAEH,eAAe,KAAK,CAAC","sourcesContent":["import { forwardRef, useEffect, useRef, useCallback } from 'react';\nimport type {\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  MouseEvent,\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 type { ForwardProps } from '../../types';\nimport {\n  useConsolidatedRef,\n  useI18n,\n  useOuterEvent,\n  useUID,\n  useFocusTrap,\n  usePrevious,\n  useModalContext,\n  useEvent\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 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(function Modal(\n  props: PropsWithoutRef<ModalProps>,\n  ref: Ref<HTMLElement>\n) {\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 {\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  } = useModalContext();\n\n  const modalRef = useConsolidatedRef(ref);\n  const modalContentRef = useRef<HTMLDivElement>(null);\n  const backdropRef = useRef<HTMLDivElement>(null);\n  const closeButtonRef = useRef<HTMLButtonElement>(null);\n  const previousState = usePrevious(state);\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    if (progress) return;\n\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, false);\n  useEvent('shortcut', e => e.stopPropagation(), { eventOptions: { capture: true } });\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\n    // This won't actually run until potential changes to docked modal handling.\n    if (state === 'closed' && previousState === 'docked') {\n      onBeforeClose?.();\n      unmount();\n      onAfterClose?.();\n    }\n  }, [state]);\n\n  useEffect(() => {\n    // If a modal is already in a closed state on initial mount, unmount it.\n    // This only happens when a docked modal closes since the ModalManager\n    // remounts it outside of the DockedModals container if state !== 'docked'.\n    if (state === 'closed') {\n      onBeforeClose?.();\n      unmount();\n      onAfterClose?.();\n    }\n  }, []);\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 (dismissible && (state === 'open' || state === 'maximized') && e.key === 'Escape' && top) {\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  useEffect(() => {\n    if (!progress) {\n      setFocus();\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-describedby={alert ? `${id}-content` : undefined}\n      aria-modal={state === 'docked' ? 'false' : 'true'}\n      state={state}\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              label={t('maximize')}\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              label={t('dock')}\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              label={t('minimize')}\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              label={t('close')}\n              aria-label={t('modal_close')}\n              onKeyDown={onHeaderActionKeyDown}\n              onClick={tryDismiss}\n              ref={closeButtonRef}\n            >\n              <Icon name='times' />\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n\n      <Flex\n        item={{ grow: 1 }}\n        as={StyledModalContent}\n        ref={modalContentRef}\n        style={\n          modalContentRef.current\n            ? { '--scroll-top': `${modalContentRef.current.scrollTop}px` }\n            : undefined\n        }\n      >\n        {children && (\n          <StyledModalChildrenWrap id={`${id}-content`} inert={progress ? '' : undefined}>\n            {children}\n          </StyledModalChildrenWrap>\n        )}\n\n        <Progress\n          visible={!!progress}\n          focusOnVisible\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\nexport default Modal;\n"]}
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef, useCallback } from 'react';\nimport type {\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  MouseEvent,\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 type { ForwardProps } from '../../types';\nimport {\n  useConsolidatedRef,\n  useI18n,\n  useOuterEvent,\n  useUID,\n  useFocusTrap,\n  usePrevious,\n  useModalContext,\n  useEvent,\n  useBreakpoint\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 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(function Modal(\n  props: PropsWithoutRef<ModalProps>,\n  ref: Ref<HTMLElement>\n) {\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 {\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  } = useModalContext();\n\n  const modalRef = useConsolidatedRef(ref);\n  const modalContentRef = useRef<HTMLDivElement>(null);\n  const backdropRef = useRef<HTMLDivElement>(null);\n  const closeButtonRef = useRef<HTMLButtonElement>(null);\n  const previousState = usePrevious(state);\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    if (progress) return;\n\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, false);\n  useEvent('shortcut', e => e.stopPropagation(), { eventOptions: { capture: true } });\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\n    // This won't actually run until potential changes to docked modal handling.\n    if (state === 'closed' && previousState === 'docked') {\n      onBeforeClose?.();\n      unmount();\n      onAfterClose?.();\n    }\n  }, [state]);\n\n  useEffect(() => {\n    // If a modal is already in a closed state on initial mount, unmount it.\n    // This only happens when a docked modal closes since the ModalManager\n    // remounts it outside of the DockedModals container if state !== 'docked'.\n    if (state === 'closed') {\n      onBeforeClose?.();\n      unmount();\n      onAfterClose?.();\n    }\n  }, []);\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 (dismissible && (state === 'open' || state === 'maximized') && e.key === 'Escape' && top) {\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  useEffect(() => {\n    if (!progress) {\n      setFocus();\n    }\n  }, [progress]);\n\n  const isModalSmallOrAbove = useBreakpoint('sm', { breakpointRef: modalRef });\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-describedby={alert ? `${id}-content` : undefined}\n      aria-modal={state === 'docked' ? 'false' : 'true'}\n      state={state}\n      aria-busy={progress ? 'true' : 'false'}\n    >\n      <Flex\n        container={{ justify: 'between', alignItems: 'start', 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              label={t('maximize')}\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              label={t('dock')}\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              label={t('minimize')}\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              label={t('close')}\n              aria-label={t('modal_close')}\n              onKeyDown={onHeaderActionKeyDown}\n              onClick={tryDismiss}\n              ref={closeButtonRef}\n            >\n              <Icon name='times' />\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n\n      <Flex\n        item={{ grow: 1 }}\n        as={StyledModalContent}\n        ref={modalContentRef}\n        style={\n          modalContentRef.current\n            ? { '--scroll-top': `${modalContentRef.current.scrollTop}px` }\n            : undefined\n        }\n      >\n        {children && (\n          <StyledModalChildrenWrap id={`${id}-content`} inert={progress ? '' : undefined}>\n            {children}\n          </StyledModalChildrenWrap>\n        )}\n\n        <Progress\n          visible={!!progress}\n          focusOnVisible\n          placement='local'\n          message={typeof progress === 'object' ? progress.message : t('loading')}\n        />\n      </Flex>\n\n      {actions && (\n        <Flex\n          container={{\n            pad: [2.5, 3, 3],\n            gap: 1,\n            ...(isModalSmallOrAbove\n              ? { direction: 'row', justify: 'end' }\n              : { direction: 'column' })\n          }}\n          item={{ shrink: 0 }}\n          as={StyledModalActions}\n          isSmallOrAbove={isModalSmallOrAbove}\n        >\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\nexport default Modal;\n"]}

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

@@ -4,6 +4,8 @@ export declare const StyledModalHeader: import("styled-components").StyledCompon
     hasAction?: boolean | undefined;
 }, never>;
 export declare const StyledModalContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledModalActions: import("styled-components").StyledComponent<"footer", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledModalActions: import("styled-components").StyledComponent<"footer", import("styled-components").DefaultTheme, {
+    isSmallOrAbove: boolean;
+}, never>;
 export declare const StyledModal: import("styled-components").StyledComponent<"article", import("styled-components").DefaultTheme, Partial<import("../Card").CardProps> & Pick<ModalProps, "progress" | "children" | "as" | "heading" | "className" | "actions" | "count" | "forwardedAs" | "defaultFocus" | "onBeforeOpen" | "onAfterOpen" | "onBeforeClose" | "onAfterClose" | "onRequestDismiss" | "onRequestMinimize" | "onRequestMaximize" | "onRequestDock" | "onRequestActivate"> & Required<Pick<ModalProps, "stretch" | "center" | "autoWidth">> & Pick<ModalContextValue, "alert" | "state">, never>;
 //# sourceMappingURL=Modal.styles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.styles.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAInE,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAEpD,eAAO,MAAM,iBAAiB;;SAyB7B,CAAC;AAIF,eAAO,MAAM,kBAAkB,yGAc7B,CAAC;AAIH,eAAO,MAAM,kBAAkB,4GAI7B,CAAC;AAIH,eAAO,MAAM,WAAW,8iBAoFtB,CAAC"}
+{"version":3,"file":"Modal.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.styles.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAInE,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAEpD,eAAO,MAAM,iBAAiB;;SAqB7B,CAAC;AAIF,eAAO,MAAM,kBAAkB,yGAc7B,CAAC;AAIH,eAAO,MAAM,kBAAkB;oBAAmC,OAAO;SAoBxE,CAAC;AAIF,eAAO,MAAM,WAAW,8iBAoFtB,CAAC"}

package/lib/components/Modal/Modal.styles.js

@@ -10,17 +10,13 @@ export const StyledModalHeader = styled.header(({ theme: { base }, hasAction })
     return css `
       padding: calc(${3 - padAdjust} * ${base.spacing}) calc(${3 - padAdjust} * ${base.spacing})
         calc(${2.5 - padAdjust} * ${base.spacing}) calc(3 * ${base.spacing});
-      h2 > ${StyledIcon} {
-        margin-inline-end: ${base.spacing};
+
+      h2 {
+        margin-block-start: calc(0.5 * ${base.spacing});
       }
 
-      > h2 {
-        overflow-x: hidden;
-        > :first-child {
-          overflow-x: hidden;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-        }
+      h2 > ${StyledIcon} {
+        margin-inline-end: ${base.spacing};
       }
 
       ${StyledButton} {
@@ -45,10 +41,24 @@ export const StyledModalContent = styled.div(({ theme: { base } }) => {
   `;
 });
 StyledModalContent.defaultProps = defaultThemeProp;
-export const StyledModalActions = styled.footer(({ theme: { base } }) => {
+export const StyledModalActions = styled.footer(({ isSmallOrAbove }) => {
     return css `
-    padding: calc(2.5 * ${base.spacing}) calc(3 * ${base.spacing}) calc(3 * ${base.spacing});
-  `;
+      ${StyledButton} + ${StyledButton} {
+        margin-inline-start: unset;
+      }
+
+      & > :not(button) {
+        display: contents;
+      }
+
+      ${isSmallOrAbove &&
+        css `
+        & > button:first-child:not(:last-child),
+        & > :first-child:not(:last-child) button:first-child {
+          margin-inline-end: auto;
+        }
+      `}
+    `;
 });
 StyledModalActions.defaultProps = defaultThemeProp;
 export const StyledModal = styled(StyledCard)(({ theme: { base }, alert, autoWidth, center, stretch, state }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.styles.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { StyledButton } from '../Button';\nimport type { PropsWithDefaults } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { StyledIcon } from '../Icon';\nimport { StyledCard } from '../Card';\nimport { StyledBackdrop } from '../Backdrop';\n\nimport type { ModalContextValue, ModalProps } from './Modal.types';\n\ntype ModalPropsWithDefaults = PropsWithDefaults<ModalProps, 'stretch' | 'center' | 'autoWidth'>;\n\nexport const StyledModalChildrenWrap = styled.div``;\n\nexport const StyledModalHeader = styled.header<{ hasAction?: boolean }>(\n  ({ theme: { base }, hasAction }) => {\n    const padAdjust = hasAction ? 0.75 : 0;\n\n    return css`\n      padding: calc(${3 - padAdjust} * ${base.spacing}) calc(${3 - padAdjust} * ${base.spacing})\n        calc(${2.5 - padAdjust} * ${base.spacing}) calc(3 * ${base.spacing});\n      h2 > ${StyledIcon} {\n        margin-inline-end: ${base.spacing};\n      }\n\n      > h2 {\n        overflow-x: hidden;\n        > :first-child {\n          overflow-x: hidden;\n          white-space: nowrap;\n          text-overflow: ellipsis;\n        }\n      }\n\n      ${StyledButton} {\n        color: ${base.palette['foreground-color']};\n      }\n    `;\n  }\n);\n\nStyledModalHeader.defaultProps = defaultThemeProp;\n\nexport const StyledModalContent = styled.div(({ theme: { base } }) => {\n  return css`\n    position: relative;\n    padding: calc(0.5 * ${base.spacing}) calc(3 * ${base.spacing});\n    overflow-y: auto;\n\n    &:last-child {\n      padding-bottom: calc(3 * ${base.spacing});\n    }\n\n    & > ${StyledBackdrop} {\n      top: var(--scroll-top, 0);\n    }\n  `;\n});\n\nStyledModalContent.defaultProps = defaultThemeProp;\n\nexport const StyledModalActions = styled.footer(({ theme: { base } }) => {\n  return css`\n    padding: calc(2.5 * ${base.spacing}) calc(3 * ${base.spacing}) calc(3 * ${base.spacing});\n  `;\n});\n\nStyledModalActions.defaultProps = defaultThemeProp;\n\nexport const StyledModal = styled(StyledCard)<\n  ModalPropsWithDefaults & Pick<ModalContextValue, 'alert' | 'state'>\n>(({ theme: { base }, alert, autoWidth, center, stretch, state }) => {\n  let defaultMinWidth = '80ch';\n  let defaultMaxWidth = '80ch';\n\n  if (alert) {\n    defaultMinWidth = '60ch';\n    defaultMaxWidth = '60ch';\n  } else if (autoWidth) {\n    defaultMaxWidth = '100%';\n  }\n\n  return css`\n    position: relative;\n    box-shadow: ${base.shadow.high};\n\n    ${!alert && stretch\n      ? css`\n          width: calc(100% - 1rem);\n          height: calc(100% - 1rem);\n\n          @media screen and (min-width: ${base.breakpoints.sm}) {\n            width: calc(100% - 2rem);\n            height: calc(100% - 2rem);\n          }\n\n          @media screen and (min-width: ${base.breakpoints.md}) {\n            width: calc(100% - 4rem);\n            height: calc(100% - 4rem);\n          }\n        `\n      : css`\n          min-width: min(calc(100% - 1rem), ${defaultMinWidth});\n          max-width: min(calc(100% - 1rem), ${defaultMaxWidth});\n          max-height: calc(100% - 1rem);\n          ${!center &&\n          css`\n            margin-block-start: 0.5rem;\n          `}\n\n          @media screen and (min-width: ${base.breakpoints.sm}) {\n            min-width: min(calc(100% - 2rem), ${defaultMinWidth});\n            max-width: min(calc(100% - 2rem), ${defaultMaxWidth});\n            max-height: calc(100% - 2rem);\n            ${!center &&\n            css`\n              margin-block-start: 1rem;\n            `}\n          }\n\n          @media screen and (min-width: ${base.breakpoints.md}) {\n            min-width: min(calc(100% - 4rem), ${defaultMinWidth});\n            max-width: min(calc(100% - 4rem), ${defaultMaxWidth});\n            max-height: calc(100% - 4rem);\n            ${!center &&\n            css`\n              margin-block-start: 2rem;\n            `}\n          }\n        `}\n\n    ${state === 'docked' &&\n    css`\n      /*\n       * This seems like the most optimal of the suboptimal solutions.\n       * https://styled-components.com/docs/faqs#how-can-i-override-styles-with-higher-specificity\n       */\n      &&& {\n        /* Using non logical properties due to Safari 14.x support and since the inline bottom values are the same. */\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        pointer-events: auto;\n      }\n    `}\n\n    &[aria-busy='true'] {\n      ${StyledModalContent} {\n        /* TODO: Replace with useScrollToggle hook. */\n        overflow: hidden;\n        min-height: 8rem;\n      }\n    }\n  `;\n});\n\nStyledModal.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"Modal.styles.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { StyledButton } from '../Button';\nimport type { PropsWithDefaults } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { StyledIcon } from '../Icon';\nimport { StyledCard } from '../Card';\nimport { StyledBackdrop } from '../Backdrop';\n\nimport type { ModalContextValue, ModalProps } from './Modal.types';\n\ntype ModalPropsWithDefaults = PropsWithDefaults<ModalProps, 'stretch' | 'center' | 'autoWidth'>;\n\nexport const StyledModalChildrenWrap = styled.div``;\n\nexport const StyledModalHeader = styled.header<{ hasAction?: boolean }>(\n  ({ theme: { base }, hasAction }) => {\n    const padAdjust = hasAction ? 0.75 : 0;\n\n    return css`\n      padding: calc(${3 - padAdjust} * ${base.spacing}) calc(${3 - padAdjust} * ${base.spacing})\n        calc(${2.5 - padAdjust} * ${base.spacing}) calc(3 * ${base.spacing});\n\n      h2 {\n        margin-block-start: calc(0.5 * ${base.spacing});\n      }\n\n      h2 > ${StyledIcon} {\n        margin-inline-end: ${base.spacing};\n      }\n\n      ${StyledButton} {\n        color: ${base.palette['foreground-color']};\n      }\n    `;\n  }\n);\n\nStyledModalHeader.defaultProps = defaultThemeProp;\n\nexport const StyledModalContent = styled.div(({ theme: { base } }) => {\n  return css`\n    position: relative;\n    padding: calc(0.5 * ${base.spacing}) calc(3 * ${base.spacing});\n    overflow-y: auto;\n\n    &:last-child {\n      padding-bottom: calc(3 * ${base.spacing});\n    }\n\n    & > ${StyledBackdrop} {\n      top: var(--scroll-top, 0);\n    }\n  `;\n});\n\nStyledModalContent.defaultProps = defaultThemeProp;\n\nexport const StyledModalActions = styled.footer<{ isSmallOrAbove: boolean }>(\n  ({ isSmallOrAbove }) => {\n    return css`\n      ${StyledButton} + ${StyledButton} {\n        margin-inline-start: unset;\n      }\n\n      & > :not(button) {\n        display: contents;\n      }\n\n      ${isSmallOrAbove &&\n      css`\n        & > button:first-child:not(:last-child),\n        & > :first-child:not(:last-child) button:first-child {\n          margin-inline-end: auto;\n        }\n      `}\n    `;\n  }\n);\n\nStyledModalActions.defaultProps = defaultThemeProp;\n\nexport const StyledModal = styled(StyledCard)<\n  ModalPropsWithDefaults & Pick<ModalContextValue, 'alert' | 'state'>\n>(({ theme: { base }, alert, autoWidth, center, stretch, state }) => {\n  let defaultMinWidth = '80ch';\n  let defaultMaxWidth = '80ch';\n\n  if (alert) {\n    defaultMinWidth = '60ch';\n    defaultMaxWidth = '60ch';\n  } else if (autoWidth) {\n    defaultMaxWidth = '100%';\n  }\n\n  return css`\n    position: relative;\n    box-shadow: ${base.shadow.high};\n\n    ${!alert && stretch\n      ? css`\n          width: calc(100% - 1rem);\n          height: calc(100% - 1rem);\n\n          @media screen and (min-width: ${base.breakpoints.sm}) {\n            width: calc(100% - 2rem);\n            height: calc(100% - 2rem);\n          }\n\n          @media screen and (min-width: ${base.breakpoints.md}) {\n            width: calc(100% - 4rem);\n            height: calc(100% - 4rem);\n          }\n        `\n      : css`\n          min-width: min(calc(100% - 1rem), ${defaultMinWidth});\n          max-width: min(calc(100% - 1rem), ${defaultMaxWidth});\n          max-height: calc(100% - 1rem);\n          ${!center &&\n          css`\n            margin-block-start: 0.5rem;\n          `}\n\n          @media screen and (min-width: ${base.breakpoints.sm}) {\n            min-width: min(calc(100% - 2rem), ${defaultMinWidth});\n            max-width: min(calc(100% - 2rem), ${defaultMaxWidth});\n            max-height: calc(100% - 2rem);\n            ${!center &&\n            css`\n              margin-block-start: 1rem;\n            `}\n          }\n\n          @media screen and (min-width: ${base.breakpoints.md}) {\n            min-width: min(calc(100% - 4rem), ${defaultMinWidth});\n            max-width: min(calc(100% - 4rem), ${defaultMaxWidth});\n            max-height: calc(100% - 4rem);\n            ${!center &&\n            css`\n              margin-block-start: 2rem;\n            `}\n          }\n        `}\n\n    ${state === 'docked' &&\n    css`\n      /*\n       * This seems like the most optimal of the suboptimal solutions.\n       * https://styled-components.com/docs/faqs#how-can-i-override-styles-with-higher-specificity\n       */\n      &&& {\n        /* Using non logical properties due to Safari 14.x support and since the inline bottom values are the same. */\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        pointer-events: auto;\n      }\n    `}\n\n    &[aria-busy='true'] {\n      ${StyledModalContent} {\n        /* TODO: Replace with useScrollToggle hook. */\n        overflow: hidden;\n        min-height: 8rem;\n      }\n    }\n  `;\n});\n\nStyledModal.defaultProps = defaultThemeProp;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"MultiStepForm.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,OAAO,CAAC;AAYhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAWhD,OAAO,KAAK,kBAAkB,MAAM,uBAAuB,CAAC;AAI5D,eAAO,MAAM,UAAU;;;SAkBtB,CAAC;AAIF,eAAO,MAAM,iBAAiB,yGAAe,CAAC;AAE9C,eAAO,MAAM,yBAAyB,iKAqBpC,CAAC;AAIH,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAwK9E,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"MultiStepForm.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,OAAO,CAAC;AAYhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAYhD,OAAO,KAAK,kBAAkB,MAAM,uBAAuB,CAAC;AAI5D,eAAO,MAAM,UAAU;;;SAkBtB,CAAC;AAIF,eAAO,MAAM,iBAAiB,yGAAe,CAAC;AAE9C,eAAO,MAAM,yBAAyB,iKAqBpC,CAAC;AA0BH,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAkL9E,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/MultiStepForm/MultiStepForm.js

@@ -11,6 +11,7 @@ import VisuallyHiddenText from '../VisuallyHiddenText';
 import Grid, { StyledGrid } from '../Grid';
 import { defaultThemeProp } from '../../theme';
 import Progress from '../Progress';
+import { StyledButton } from '../Button';
 import VerticalFormProgress from './VerticalFormProgress';
 import HorizontalFormProgress from './HorizontalFormProgress';
 export const StyledForm = styled.form(({ actions, heading, theme }) => {
@@ -48,6 +49,26 @@ export const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {
   `;
 });
 StyledRequiredFieldLegend.defaultProps = defaultThemeProp;
+const StyledActionsContainer = styled(Flex)(({ isSmallOrAbove }) => {
+    return css `
+    ${StyledButton} + ${StyledButton} {
+      margin-inline-start: unset;
+    }
+
+    & > :not(button) {
+      display: contents;
+    }
+
+    ${isSmallOrAbove &&
+        css `
+      & > button:first-child:not(:last-child),
+      & > :first-child:not(:last-child) button:first-child {
+        margin-inline-end: auto;
+      }
+    `}
+  `;
+});
+StyledActionsContainer.defaultProps = defaultThemeProp;
 export const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps, heading, stepIndicator: stepIndicatorProp = steps.length < 2 ? 'none' : 'horizontal', progress, ...restProps }, ref) {
     const multiStepRef = useConsolidatedRef(ref);
     const progressIndicatorRef = useRef(null);
@@ -60,6 +81,7 @@ export const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId,
     const t = useI18n();
     const { base: { 'content-width': contentWidth } } = useTheme();
     const isSmallOrAbove = useBreakpoint('sm');
+    const isFormSmallOrAbove = useBreakpoint('sm', { breakpointRef: multiStepRef });
     const stepIndicator = stepIndicatorProp === 'vertical' && !isSmallOrAbove ? 'horizontal' : stepIndicatorProp;
     const setFocus = () => {
         if (progress)
@@ -126,7 +148,12 @@ export const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId,
                     gap: 2
                 }, inert: progress ? '' : undefined, children: [steps.length > 1 && (_jsxs(Grid, { item: { area: 'stepIndicator' }, children: [stepIndicator === 'horizontal' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: HorizontalFormProgress, steps: steps, currentStepId: currentStepId })), stepIndicator === 'vertical' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: VerticalFormProgress, steps: steps, currentStepId: currentStepId })), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: previousId !== undefined && previousId !== currentStepId
                                     ? t('step_changed_to_name', [currentStep.name])
-                                    : '' })] })), currentStep.banners && _jsx(Grid, { item: { area: 'banners' }, children: currentStep.banners }), currentStep.description && (_jsx(Grid, { item: { area: 'description' }, children: _jsx(HTML, { id: descriptionId, as: 'p', content: currentStep.description }) })), _jsx(Grid, { item: { area: 'content' }, as: StyledFormContent, ref: multiStepFormContentRef, children: currentStep.content }), _jsx(Progress, { visible: !!progress, focusOnVisible: true, placement: 'local', message: typeof progress === 'string' ? progress : undefined })] }), currentStep.actions && (_jsx(Flex, { ref: multiStepActionsRef, container: { justify: 'between', alignItems: 'center' }, children: currentStep.actions }))] }));
+                                    : '' })] })), currentStep.banners && _jsx(Grid, { item: { area: 'banners' }, children: currentStep.banners }), currentStep.description && (_jsx(Grid, { item: { area: 'description' }, children: _jsx(HTML, { id: descriptionId, as: 'p', content: currentStep.description }) })), _jsx(Grid, { item: { area: 'content' }, as: StyledFormContent, ref: multiStepFormContentRef, children: currentStep.content }), _jsx(Progress, { visible: !!progress, focusOnVisible: true, placement: 'local', message: typeof progress === 'string' ? progress : undefined })] }), currentStep.actions && (_jsx(StyledActionsContainer, { ref: multiStepActionsRef, isSmallOrAbove: isFormSmallOrAbove, container: {
+                    gap: 1,
+                    ...(isFormSmallOrAbove
+                        ? { direction: 'row', justify: 'end' }
+                        : { direction: 'column' })
+                }, children: currentStep.actions }))] }));
 });
 export default MultiStepForm;
 //# sourceMappingURL=MultiStepForm.js.map

package/lib/components/MultiStepForm/MultiStepForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiStepForm.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { FunctionComponent, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  useAfterInitialEffect,\n  useUID,\n  useI18n,\n  usePrevious,\n  useBreakpoint,\n  useTheme,\n  useConsolidatedRef\n} from '../../hooks';\nimport type { ForwardProps } from '../../types';\nimport { getFocusables } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport HTML from '../HTML';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Grid, { StyledGrid } from '../Grid';\nimport { defaultThemeProp } from '../../theme';\nimport Progress from '../Progress';\n\nimport type MultiStepFormProps from './MultiStepForm.types';\nimport VerticalFormProgress from './VerticalFormProgress';\nimport HorizontalFormProgress from './HorizontalFormProgress';\n\nexport const StyledForm = styled.form<{ actions?: boolean; heading?: boolean }>(\n  ({ actions, heading, theme }) => {\n    return css`\n      & > ${StyledGrid} {\n        position: relative;\n\n        ${actions &&\n        css`\n          padding-block-end: calc(2 * ${theme.base.spacing});\n        `}\n\n        ${heading &&\n        css`\n          padding-block-start: calc(2 * ${theme.base.spacing});\n        `}\n      }\n    `;\n  }\n);\n\nStyledForm.defaultProps = defaultThemeProp;\n\nexport const StyledFormContent = styled.div``;\n\nexport const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {\n  const {\n    base: {\n      'font-size': fontSize,\n      'font-scale': fontScale,\n      palette: { urgent }\n    }\n  } = theme;\n  const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n  return css`\n    font-size: ${infoFontSize};\n    font-style: italic;\n\n    &::before {\n      display: 'inline';\n      content: '\\\\00a0*';\n      vertical-align: top;\n      color: ${urgent};\n    }\n  `;\n});\n\nStyledRequiredFieldLegend.defaultProps = defaultThemeProp;\n\nexport const MultiStepForm: FunctionComponent<MultiStepFormProps & ForwardProps> = forwardRef(\n  function MultiStepForm(\n    {\n      currentStepId,\n      steps,\n      heading,\n      stepIndicator: stepIndicatorProp = steps.length < 2 ? 'none' : 'horizontal',\n      progress,\n      ...restProps\n    }: PropsWithoutRef<MultiStepFormProps>,\n    ref: MultiStepFormProps['ref']\n  ) {\n    const multiStepRef = useConsolidatedRef<HTMLFormElement>(ref);\n    const progressIndicatorRef = useRef<HTMLDivElement>(null);\n    const multiStepFormContentRef = useRef<HTMLDivElement>(null);\n    const multiStepActionsRef = useRef<HTMLDivElement>(null);\n\n    const previousId = usePrevious(currentStepId);\n    const currentStep = steps.find(step => step.id === currentStepId)!;\n    const headingId = useUID();\n    const descriptionId = useUID();\n    const t = useI18n();\n    const {\n      base: { 'content-width': contentWidth }\n    } = useTheme();\n\n    const isSmallOrAbove = useBreakpoint('sm');\n\n    const stepIndicator =\n      stepIndicatorProp === 'vertical' && !isSmallOrAbove ? 'horizontal' : stepIndicatorProp;\n\n    const setFocus = () => {\n      if (progress) return;\n\n      let focusables: HTMLElement[] = [];\n      if (stepIndicatorProp === 'horizontal' && progressIndicatorRef.current) {\n        focusables = [\n          ...progressIndicatorRef.current.querySelectorAll(`[id=\"${currentStepId}\"]`)\n        ] as HTMLElement[];\n      } else {\n        focusables = getFocusables(multiStepFormContentRef);\n      }\n      focusables[0]?.focus();\n    };\n\n    // Set focus if the current step id updates\n    useEffect(() => {\n      if (previousId !== currentStepId) {\n        setFocus();\n      }\n    }, [currentStepId, previousId]);\n\n    // Set focus if the form content updates while focus is within the actions region of the form\n    useAfterInitialEffect(() => {\n      if (\n        multiStepActionsRef.current &&\n        multiStepActionsRef.current.contains(document.activeElement)\n      ) {\n        setFocus();\n      }\n    }, [currentStep.content]);\n\n    // Set focus if a progress state resolves\n    useAfterInitialEffect(() => {\n      if (!progress) {\n        setFocus();\n      }\n    }, [progress]);\n\n    let areaDef = '';\n    switch (stepIndicator) {\n      case 'horizontal':\n        areaDef += '\"stepIndicator\" ';\n        if (currentStep.banners) areaDef += '\"banners\" ';\n        if (currentStep.description) areaDef += '\"description\" ';\n        areaDef += '\"content\"';\n        break;\n      case 'vertical':\n        if (currentStep.banners) areaDef += '\"banners stepIndicator\" ';\n        if (currentStep.description) areaDef += '\"description stepIndicator\" ';\n        areaDef += '\"content stepIndicator\"';\n        break;\n      default:\n        if (currentStep.banners) areaDef += '\"banners\" ';\n        if (currentStep.description) areaDef += '\"description\" ';\n        areaDef += '\"content\"';\n    }\n\n    return (\n      <StyledForm\n        ref={multiStepRef}\n        {...restProps}\n        aria-labelledby={heading ? headingId : undefined}\n        aria-describedby={currentStep.description ? descriptionId : undefined}\n        heading={!!heading}\n        actions={!!currentStep.actions}\n      >\n        {heading && (\n          <Text id={headingId} variant='h3'>\n            {heading}\n          </Text>\n        )}\n\n        <Grid\n          ref={progressIndicatorRef}\n          container={{\n            cols:\n              stepIndicator === 'vertical'\n                ? `2fr minmax(${contentWidth.xs}, 1fr)`\n                : 'minmax(0, 1fr)',\n            areas: areaDef,\n            gap: 2\n          }}\n          inert={progress ? '' : undefined}\n        >\n          {steps.length > 1 && (\n            <Grid item={{ area: 'stepIndicator' }}>\n              {stepIndicator === 'horizontal' && (\n                <Grid\n                  item={{ area: 'stepIndicator' }}\n                  as={HorizontalFormProgress}\n                  steps={steps}\n                  currentStepId={currentStepId}\n                />\n              )}\n              {stepIndicator === 'vertical' && (\n                <Grid\n                  item={{ area: 'stepIndicator' }}\n                  as={VerticalFormProgress}\n                  steps={steps}\n                  currentStepId={currentStepId}\n                />\n              )}\n              <VisuallyHiddenText aria-live='polite'>\n                {previousId !== undefined && previousId !== currentStepId\n                  ? t('step_changed_to_name', [currentStep.name])\n                  : ''}\n              </VisuallyHiddenText>\n            </Grid>\n          )}\n\n          {currentStep.banners && <Grid item={{ area: 'banners' }}>{currentStep.banners}</Grid>}\n\n          {currentStep.description && (\n            <Grid item={{ area: 'description' }}>\n              <HTML id={descriptionId} as='p' content={currentStep.description} />\n            </Grid>\n          )}\n\n          <Grid item={{ area: 'content' }} as={StyledFormContent} ref={multiStepFormContentRef}>\n            {currentStep.content}\n          </Grid>\n\n          <Progress\n            visible={!!progress}\n            focusOnVisible\n            placement='local'\n            message={typeof progress === 'string' ? progress : undefined}\n          />\n        </Grid>\n        {currentStep.actions && (\n          <Flex ref={multiStepActionsRef} container={{ justify: 'between', alignItems: 'center' }}>\n            {currentStep.actions}\n          </Flex>\n        )}\n      </StyledForm>\n    );\n  }\n);\n\nexport default MultiStepForm;\n"]}
+{"version":3,"file":"MultiStepForm.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { FunctionComponent, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  useAfterInitialEffect,\n  useUID,\n  useI18n,\n  usePrevious,\n  useBreakpoint,\n  useTheme,\n  useConsolidatedRef\n} from '../../hooks';\nimport type { ForwardProps } from '../../types';\nimport { getFocusables } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport HTML from '../HTML';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Grid, { StyledGrid } from '../Grid';\nimport { defaultThemeProp } from '../../theme';\nimport Progress from '../Progress';\nimport { StyledButton } from '../Button';\n\nimport type MultiStepFormProps from './MultiStepForm.types';\nimport VerticalFormProgress from './VerticalFormProgress';\nimport HorizontalFormProgress from './HorizontalFormProgress';\n\nexport const StyledForm = styled.form<{ actions?: boolean; heading?: boolean }>(\n  ({ actions, heading, theme }) => {\n    return css`\n      & > ${StyledGrid} {\n        position: relative;\n\n        ${actions &&\n        css`\n          padding-block-end: calc(2 * ${theme.base.spacing});\n        `}\n\n        ${heading &&\n        css`\n          padding-block-start: calc(2 * ${theme.base.spacing});\n        `}\n      }\n    `;\n  }\n);\n\nStyledForm.defaultProps = defaultThemeProp;\n\nexport const StyledFormContent = styled.div``;\n\nexport const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {\n  const {\n    base: {\n      'font-size': fontSize,\n      'font-scale': fontScale,\n      palette: { urgent }\n    }\n  } = theme;\n  const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n  return css`\n    font-size: ${infoFontSize};\n    font-style: italic;\n\n    &::before {\n      display: 'inline';\n      content: '\\\\00a0*';\n      vertical-align: top;\n      color: ${urgent};\n    }\n  `;\n});\n\nStyledRequiredFieldLegend.defaultProps = defaultThemeProp;\n\nconst StyledActionsContainer = styled(Flex)<{ isSmallOrAbove: boolean }>(({ isSmallOrAbove }) => {\n  return css`\n    ${StyledButton} + ${StyledButton} {\n      margin-inline-start: unset;\n    }\n\n    & > :not(button) {\n      display: contents;\n    }\n\n    ${isSmallOrAbove &&\n    css`\n      & > button:first-child:not(:last-child),\n      & > :first-child:not(:last-child) button:first-child {\n        margin-inline-end: auto;\n      }\n    `}\n  `;\n});\n\nStyledActionsContainer.defaultProps = defaultThemeProp;\n\nexport const MultiStepForm: FunctionComponent<MultiStepFormProps & ForwardProps> = forwardRef(\n  function MultiStepForm(\n    {\n      currentStepId,\n      steps,\n      heading,\n      stepIndicator: stepIndicatorProp = steps.length < 2 ? 'none' : 'horizontal',\n      progress,\n      ...restProps\n    }: PropsWithoutRef<MultiStepFormProps>,\n    ref: MultiStepFormProps['ref']\n  ) {\n    const multiStepRef = useConsolidatedRef<HTMLFormElement>(ref);\n    const progressIndicatorRef = useRef<HTMLDivElement>(null);\n    const multiStepFormContentRef = useRef<HTMLDivElement>(null);\n    const multiStepActionsRef = useRef<HTMLDivElement>(null);\n\n    const previousId = usePrevious(currentStepId);\n    const currentStep = steps.find(step => step.id === currentStepId)!;\n    const headingId = useUID();\n    const descriptionId = useUID();\n    const t = useI18n();\n    const {\n      base: { 'content-width': contentWidth }\n    } = useTheme();\n\n    const isSmallOrAbove = useBreakpoint('sm');\n    const isFormSmallOrAbove = useBreakpoint('sm', { breakpointRef: multiStepRef });\n\n    const stepIndicator =\n      stepIndicatorProp === 'vertical' && !isSmallOrAbove ? 'horizontal' : stepIndicatorProp;\n\n    const setFocus = () => {\n      if (progress) return;\n\n      let focusables: HTMLElement[] = [];\n      if (stepIndicatorProp === 'horizontal' && progressIndicatorRef.current) {\n        focusables = [\n          ...progressIndicatorRef.current.querySelectorAll(`[id=\"${currentStepId}\"]`)\n        ] as HTMLElement[];\n      } else {\n        focusables = getFocusables(multiStepFormContentRef);\n      }\n      focusables[0]?.focus();\n    };\n\n    // Set focus if the current step id updates\n    useEffect(() => {\n      if (previousId !== currentStepId) {\n        setFocus();\n      }\n    }, [currentStepId, previousId]);\n\n    // Set focus if the form content updates while focus is within the actions region of the form\n    useAfterInitialEffect(() => {\n      if (\n        multiStepActionsRef.current &&\n        multiStepActionsRef.current.contains(document.activeElement)\n      ) {\n        setFocus();\n      }\n    }, [currentStep.content]);\n\n    // Set focus if a progress state resolves\n    useAfterInitialEffect(() => {\n      if (!progress) {\n        setFocus();\n      }\n    }, [progress]);\n\n    let areaDef = '';\n    switch (stepIndicator) {\n      case 'horizontal':\n        areaDef += '\"stepIndicator\" ';\n        if (currentStep.banners) areaDef += '\"banners\" ';\n        if (currentStep.description) areaDef += '\"description\" ';\n        areaDef += '\"content\"';\n        break;\n      case 'vertical':\n        if (currentStep.banners) areaDef += '\"banners stepIndicator\" ';\n        if (currentStep.description) areaDef += '\"description stepIndicator\" ';\n        areaDef += '\"content stepIndicator\"';\n        break;\n      default:\n        if (currentStep.banners) areaDef += '\"banners\" ';\n        if (currentStep.description) areaDef += '\"description\" ';\n        areaDef += '\"content\"';\n    }\n\n    return (\n      <StyledForm\n        ref={multiStepRef}\n        {...restProps}\n        aria-labelledby={heading ? headingId : undefined}\n        aria-describedby={currentStep.description ? descriptionId : undefined}\n        heading={!!heading}\n        actions={!!currentStep.actions}\n      >\n        {heading && (\n          <Text id={headingId} variant='h3'>\n            {heading}\n          </Text>\n        )}\n\n        <Grid\n          ref={progressIndicatorRef}\n          container={{\n            cols:\n              stepIndicator === 'vertical'\n                ? `2fr minmax(${contentWidth.xs}, 1fr)`\n                : 'minmax(0, 1fr)',\n            areas: areaDef,\n            gap: 2\n          }}\n          inert={progress ? '' : undefined}\n        >\n          {steps.length > 1 && (\n            <Grid item={{ area: 'stepIndicator' }}>\n              {stepIndicator === 'horizontal' && (\n                <Grid\n                  item={{ area: 'stepIndicator' }}\n                  as={HorizontalFormProgress}\n                  steps={steps}\n                  currentStepId={currentStepId}\n                />\n              )}\n              {stepIndicator === 'vertical' && (\n                <Grid\n                  item={{ area: 'stepIndicator' }}\n                  as={VerticalFormProgress}\n                  steps={steps}\n                  currentStepId={currentStepId}\n                />\n              )}\n              <VisuallyHiddenText aria-live='polite'>\n                {previousId !== undefined && previousId !== currentStepId\n                  ? t('step_changed_to_name', [currentStep.name])\n                  : ''}\n              </VisuallyHiddenText>\n            </Grid>\n          )}\n\n          {currentStep.banners && <Grid item={{ area: 'banners' }}>{currentStep.banners}</Grid>}\n\n          {currentStep.description && (\n            <Grid item={{ area: 'description' }}>\n              <HTML id={descriptionId} as='p' content={currentStep.description} />\n            </Grid>\n          )}\n\n          <Grid item={{ area: 'content' }} as={StyledFormContent} ref={multiStepFormContentRef}>\n            {currentStep.content}\n          </Grid>\n\n          <Progress\n            visible={!!progress}\n            focusOnVisible\n            placement='local'\n            message={typeof progress === 'string' ? progress : undefined}\n          />\n        </Grid>\n        {currentStep.actions && (\n          <StyledActionsContainer\n            ref={multiStepActionsRef}\n            isSmallOrAbove={isFormSmallOrAbove}\n            container={{\n              gap: 1,\n              ...(isFormSmallOrAbove\n                ? { direction: 'row', justify: 'end' }\n                : { direction: 'column' })\n            }}\n          >\n            {currentStep.actions}\n          </StyledActionsContainer>\n        )}\n      </StyledForm>\n    );\n  }\n);\n\nexport default MultiStepForm;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAqC,GAAG,EAAE,MAAM,OAAO,CAAC;AAGvF,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGvE,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAOtD,MAAM,WAAW,YAAa,SAAQ,SAAS,EAAE,UAAU;IACzD,oCAAoC;IACpC,QAAQ,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,gDAAgD;IAChD,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACvB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;IAChC;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IACtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,aAAa,yGAaxB,CAAC;;;;AAyIH,wBAAuD"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAqC,GAAG,EAAE,MAAM,OAAO,CAAC;AAGvF,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGvE,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAOtD,MAAM,WAAW,YAAa,SAAQ,SAAS,EAAE,UAAU;IACzD,oCAAoC;IACpC,QAAQ,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,gDAAgD;IAChD,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACvB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;IAChC;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IACtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,aAAa,yGAaxB,CAAC;;;;AA2IH,wBAAuD"}

package/lib/components/Tooltip/Tooltip.js

@@ -5,7 +5,7 @@ import { defaultThemeProp } from '../../theme';
 import Popover from '../Popover';
 import { useConsolidatedRef, useTestIds, useUID } from '../../hooks';
 import { calculateFontSize } from '../../styles';
-import { getActiveElement, withTestIds } from '../../utils';
+import { getActiveElement, mouseState, withTestIds } from '../../utils';
 import { getTooltipTestIds } from './Tooltip.test-ids';
 export const StyledTooltip = styled.div(({ theme }) => {
     const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);
@@ -52,6 +52,9 @@ const Tooltip = forwardRef(function Tooltip({ testId, children, target, showDela
             lastClickedRef.current = null;
         };
         const onMouseEnter = () => {
+            if (mouseState.primary) {
+                return;
+            }
             showTooltip();
         };
         const onMouseLeave = () => {

package/lib/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';\nimport type { FunctionComponent, MutableRefObject, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { BaseProps, ForwardProps, TestIdProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Popover from '../Popover';\nimport type { Delay, PopoverProps } from '../Popover';\nimport { useConsolidatedRef, useTestIds, useUID } from '../../hooks';\nimport { calculateFontSize } from '../../styles';\nimport { getActiveElement, withTestIds } from '../../utils';\n\nimport { getTooltipTestIds } from './Tooltip.test-ids';\n\nexport interface TooltipProps extends BaseProps, TestIdProp {\n  /** Text content for the tooltip. */\n  children: string | string[];\n  /** Element to serve as the tooltip's target. */\n  target: Element | null;\n  /**\n   * Delay showing the tooltip on mouseenter.\n   * @default 'short'\n   */\n  showDelay?: Delay;\n  /**\n   * Delay hiding the tooltip on mouseleave.\n   * @default 'long'\n   */\n  hideDelay?: Delay;\n  /**\n   * If true, the Tooltip will render outside of the current DOM hierarchy in a [portal](https://reactjs.org/docs/portals.html).\n   * @default true\n   */\n  portal?: PopoverProps['portal'];\n  /**\n   * If true, the Tooltip will automatically apply an aria-describedby attribute to its target.\n   * @default true\n   */\n  describeTarget?: boolean;\n  /**\n   * Sets the placement of the tooltip relative to the target.\n   * @default 'bottom'\n   */\n  placement?: PopoverProps['placement'];\n  /**\n   * Conditionally renders a tooltip only if the associated element's text content is truncated.\n   * To work, the associated element must be be displayed as a CSS \"block box\" i.e. block, inline-block, etc...\n   * @default false\n   */\n  smart?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledTooltip = styled.div(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    background-color: ${theme.components.tooltip['background-color']};\n    color: ${theme.components.tooltip['foreground-color']};\n    font-size: ${fontSize.xxs};\n    max-width: 40ch;\n    padding: ${theme.base.spacing};\n    white-space: pre-line;\n    word-break: break-word;\n    pointer-events: none;\n  `;\n});\n\nStyledTooltip.defaultProps = defaultThemeProp;\n\nconst Tooltip: FunctionComponent<TooltipProps & ForwardProps> = forwardRef(function Tooltip(\n  {\n    testId,\n    children,\n    target,\n    showDelay = 'short',\n    hideDelay = 'long',\n    placement = 'bottom',\n    describeTarget = true,\n    smart,\n    ...restProps\n  }: PropsWithoutRef<TooltipProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const id = useUID();\n  const [show, setShow] = useState(false);\n  const tooltipRef = useConsolidatedRef(ref);\n  const lastClickedRef: MutableRefObject<EventTarget | null> = useRef(null);\n  const testIds = useTestIds(testId, getTooltipTestIds);\n\n  const onMouseDown = useCallback(\n    ({ target: eTarget }: MouseEvent) => {\n      lastClickedRef.current = eTarget;\n      if (eTarget === tooltipRef.current || eTarget === target) return;\n      setShow(false);\n    },\n    [target]\n  );\n\n  useEffect(() => {\n    if (!target) return;\n\n    const showTooltip = () => {\n      setShow(\n        // This approach may result in a tooltip NOT appearing 1px before it should due to browser specifics. Enhance as needed.\n        // https://stackoverflow.com/a/64747288\n        smart ? target.scrollWidth > target.clientWidth : true\n      );\n    };\n\n    const onFocusIn = () => {\n      showTooltip();\n    };\n\n    const onFocusOut = () => {\n      if (!lastClickedRef.current || lastClickedRef.current !== tooltipRef.current) {\n        setShow(false);\n      }\n      lastClickedRef.current = null;\n    };\n\n    const onMouseEnter = () => {\n      showTooltip();\n    };\n\n    const onMouseLeave = () => {\n      if (getActiveElement() !== target) {\n        setShow(false);\n      }\n    };\n\n    const onKeyDown = ({ key }: KeyboardEvent) => {\n      if (key === 'Escape' && getActiveElement() === target) {\n        setShow(false);\n      }\n    };\n\n    document.addEventListener('keydown', onKeyDown);\n    document.addEventListener('mousedown', onMouseDown);\n\n    target.addEventListener('focusin', onFocusIn);\n    target.addEventListener('focusout', onFocusOut);\n\n    target.addEventListener('mouseenter', onMouseEnter);\n    target.addEventListener('mouseleave', onMouseLeave);\n\n    return () => {\n      document.removeEventListener('keydown', onKeyDown);\n      document.removeEventListener('mousedown', onMouseDown);\n\n      target.removeEventListener('focusin', onFocusIn);\n      target.removeEventListener('focusout', onFocusOut);\n\n      target.removeEventListener('mouseenter', onMouseEnter);\n      target.removeEventListener('mouseleave', onMouseLeave);\n    };\n  }, [target, onMouseDown, smart]);\n\n  useEffect(() => {\n    if (target && describeTarget && show) {\n      const describedBy = target.getAttribute('aria-describedby');\n      // Set the attribute to the old attribute plus the id\n      target.setAttribute('aria-describedby', describedBy ? `${describedBy} ${id}` : id);\n    } else if (target) {\n      // Get the old attribute\n      const describedBy = target.getAttribute('aria-describedby');\n      if (describedBy) {\n        // If the old attribute matches the id just remove it entirely\n        if (describedBy === id) {\n          target.removeAttribute('aria-describedby');\n        } else {\n          // Otherwise we want to just remove the id that was added and reset the attribute to what it was before\n          const oldDescribedBy = describedBy.replace(new RegExp(`(?:^|\\\\s+)${id}`), '');\n          target.setAttribute('aria-describedby', oldDescribedBy);\n        }\n      }\n    }\n  }, [describeTarget, target, show]);\n\n  return (\n    <Popover\n      data-testid={testIds.root}\n      id={id}\n      {...restProps}\n      show={show}\n      showDelay={showDelay}\n      hideDelay={hideDelay}\n      groupId='tooltip'\n      strategy='fixed'\n      as={StyledTooltip}\n      role='tooltip'\n      target={target}\n      arrow\n      placement={placement}\n      onMouseDown={onMouseDown}\n      hideOnTargetHidden\n      ref={tooltipRef}\n    >\n      {children}\n    </Popover>\n  );\n});\n\nexport default withTestIds(Tooltip, getTooltipTestIds);\n"]}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';\nimport type { FunctionComponent, MutableRefObject, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { BaseProps, ForwardProps, TestIdProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Popover from '../Popover';\nimport type { Delay, PopoverProps } from '../Popover';\nimport { useConsolidatedRef, useTestIds, useUID } from '../../hooks';\nimport { calculateFontSize } from '../../styles';\nimport { getActiveElement, mouseState, withTestIds } from '../../utils';\n\nimport { getTooltipTestIds } from './Tooltip.test-ids';\n\nexport interface TooltipProps extends BaseProps, TestIdProp {\n  /** Text content for the tooltip. */\n  children: string | string[];\n  /** Element to serve as the tooltip's target. */\n  target: Element | null;\n  /**\n   * Delay showing the tooltip on mouseenter.\n   * @default 'short'\n   */\n  showDelay?: Delay;\n  /**\n   * Delay hiding the tooltip on mouseleave.\n   * @default 'long'\n   */\n  hideDelay?: Delay;\n  /**\n   * If true, the Tooltip will render outside of the current DOM hierarchy in a [portal](https://reactjs.org/docs/portals.html).\n   * @default true\n   */\n  portal?: PopoverProps['portal'];\n  /**\n   * If true, the Tooltip will automatically apply an aria-describedby attribute to its target.\n   * @default true\n   */\n  describeTarget?: boolean;\n  /**\n   * Sets the placement of the tooltip relative to the target.\n   * @default 'bottom'\n   */\n  placement?: PopoverProps['placement'];\n  /**\n   * Conditionally renders a tooltip only if the associated element's text content is truncated.\n   * To work, the associated element must be be displayed as a CSS \"block box\" i.e. block, inline-block, etc...\n   * @default false\n   */\n  smart?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledTooltip = styled.div(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    background-color: ${theme.components.tooltip['background-color']};\n    color: ${theme.components.tooltip['foreground-color']};\n    font-size: ${fontSize.xxs};\n    max-width: 40ch;\n    padding: ${theme.base.spacing};\n    white-space: pre-line;\n    word-break: break-word;\n    pointer-events: none;\n  `;\n});\n\nStyledTooltip.defaultProps = defaultThemeProp;\n\nconst Tooltip: FunctionComponent<TooltipProps & ForwardProps> = forwardRef(function Tooltip(\n  {\n    testId,\n    children,\n    target,\n    showDelay = 'short',\n    hideDelay = 'long',\n    placement = 'bottom',\n    describeTarget = true,\n    smart,\n    ...restProps\n  }: PropsWithoutRef<TooltipProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const id = useUID();\n  const [show, setShow] = useState(false);\n  const tooltipRef = useConsolidatedRef(ref);\n  const lastClickedRef: MutableRefObject<EventTarget | null> = useRef(null);\n  const testIds = useTestIds(testId, getTooltipTestIds);\n\n  const onMouseDown = useCallback(\n    ({ target: eTarget }: MouseEvent) => {\n      lastClickedRef.current = eTarget;\n      if (eTarget === tooltipRef.current || eTarget === target) return;\n      setShow(false);\n    },\n    [target]\n  );\n\n  useEffect(() => {\n    if (!target) return;\n\n    const showTooltip = () => {\n      setShow(\n        // This approach may result in a tooltip NOT appearing 1px before it should due to browser specifics. Enhance as needed.\n        // https://stackoverflow.com/a/64747288\n        smart ? target.scrollWidth > target.clientWidth : true\n      );\n    };\n\n    const onFocusIn = () => {\n      showTooltip();\n    };\n\n    const onFocusOut = () => {\n      if (!lastClickedRef.current || lastClickedRef.current !== tooltipRef.current) {\n        setShow(false);\n      }\n      lastClickedRef.current = null;\n    };\n\n    const onMouseEnter = () => {\n      if (mouseState.primary) {\n        return;\n      }\n\n      showTooltip();\n    };\n\n    const onMouseLeave = () => {\n      if (getActiveElement() !== target) {\n        setShow(false);\n      }\n    };\n\n    const onKeyDown = ({ key }: KeyboardEvent) => {\n      if (key === 'Escape' && getActiveElement() === target) {\n        setShow(false);\n      }\n    };\n\n    document.addEventListener('keydown', onKeyDown);\n    document.addEventListener('mousedown', onMouseDown);\n\n    target.addEventListener('focusin', onFocusIn);\n    target.addEventListener('focusout', onFocusOut);\n    target.addEventListener('mouseenter', onMouseEnter);\n    target.addEventListener('mouseleave', onMouseLeave);\n\n    return () => {\n      document.removeEventListener('keydown', onKeyDown);\n      document.removeEventListener('mousedown', onMouseDown);\n\n      target.removeEventListener('focusin', onFocusIn);\n      target.removeEventListener('focusout', onFocusOut);\n      target.removeEventListener('mouseenter', onMouseEnter);\n      target.removeEventListener('mouseleave', onMouseLeave);\n    };\n  }, [target, onMouseDown, smart]);\n\n  useEffect(() => {\n    if (target && describeTarget && show) {\n      const describedBy = target.getAttribute('aria-describedby');\n      // Set the attribute to the old attribute plus the id\n      target.setAttribute('aria-describedby', describedBy ? `${describedBy} ${id}` : id);\n    } else if (target) {\n      // Get the old attribute\n      const describedBy = target.getAttribute('aria-describedby');\n      if (describedBy) {\n        // If the old attribute matches the id just remove it entirely\n        if (describedBy === id) {\n          target.removeAttribute('aria-describedby');\n        } else {\n          // Otherwise we want to just remove the id that was added and reset the attribute to what it was before\n          const oldDescribedBy = describedBy.replace(new RegExp(`(?:^|\\\\s+)${id}`), '');\n          target.setAttribute('aria-describedby', oldDescribedBy);\n        }\n      }\n    }\n  }, [describeTarget, target, show]);\n\n  return (\n    <Popover\n      data-testid={testIds.root}\n      id={id}\n      {...restProps}\n      show={show}\n      showDelay={showDelay}\n      hideDelay={hideDelay}\n      groupId='tooltip'\n      strategy='fixed'\n      as={StyledTooltip}\n      role='tooltip'\n      target={target}\n      arrow\n      placement={placement}\n      onMouseDown={onMouseDown}\n      hideOnTargetHidden\n      ref={tooltipRef}\n    >\n      {children}\n    </Popover>\n  );\n});\n\nexport default withTestIds(Tooltip, getTooltipTestIds);\n"]}

package/lib/hooks/index.d.ts

@@ -24,6 +24,7 @@ export { default as useModalManager } from './useModalManager';
 export { default as useOS } from './useOS';
 export { default as useOuterEvent } from './useOuterEvent';
 export { default as usePrevious } from './usePrevious';
+export { default as useRefMap } from './useRefMap';
 export { default as useSimpleStore, createSimpleStore } from './useSimpleStore';
 export type { SimpleStore } from './useSimpleStore';
 export { default as useScrollStick } from './useScrollStick';

package/lib/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1F,YAAY,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAChF,YAAY,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC"}

package/lib/hooks/index.js

@@ -23,6 +23,7 @@ export { default as useModalManager } from './useModalManager';
 export { default as useOS } from './useOS';
 export { default as useOuterEvent } from './useOuterEvent';
 export { default as usePrevious } from './usePrevious';
+export { default as useRefMap } from './useRefMap';
 export { default as useSimpleStore, createSimpleStore } from './useSimpleStore';
 export { default as useScrollStick } from './useScrollStick';
 export { default as useScrollToggle } from './useScrollToggle';

package/lib/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE1F,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAEhF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default as useActiveDescendant, useLazyDescendant } from './useActiveDescendant';\nexport type { UseActiveDescendantConfig } from './useActiveDescendant';\nexport { default as useAfterInitialEffect } from './useAfterInitialEffect';\nexport { default as useArrows } from './useArrows';\nexport { default as useAutoResize } from './useAutoResize';\nexport { default as useBreakpoint } from './useBreakpoint';\nexport { default as useChToPxConversionFactor } from './useChToPxConversionFactor';\nexport { default as useConfiguration } from './useConfiguration';\nexport { default as useConsolidatedRef } from './useConsolidatedRef';\nexport { default as useDirection } from './useDirection';\nexport { default as useDraggable } from './useDraggable';\nexport { default as useElement } from './useElement';\nexport { default as useEscape } from './useEscape';\nexport { default as useEvent } from './useEvent';\nexport { default as useFocusTrap } from './useFocusTrap';\nexport { default as useFocusWithin } from './useFocusWithin';\nexport { default as useI18n } from './useI18n';\nexport { default as useInputFormatter } from './useInputFormatter';\nexport { default as useItemIntersection } from './useItemIntersection';\nexport { default as useLiveLog } from './useLiveLog';\nexport { default as useLongPress } from './useLongPress';\nexport { default as useModalContext } from './useModalContext';\nexport { default as useModalManager } from './useModalManager';\nexport { default as useOS } from './useOS';\nexport { default as useOuterEvent } from './useOuterEvent';\nexport { default as usePrevious } from './usePrevious';\nexport { default as useSimpleStore, createSimpleStore } from './useSimpleStore';\nexport type { SimpleStore } from './useSimpleStore';\nexport { default as useScrollStick } from './useScrollStick';\nexport { default as useScrollToggle } from './useScrollToggle';\nexport { default as useShortcut } from './useShortcut';\nexport { default as useShortcutManager } from './useShortcutManager';\nexport { default as useTestIds } from './useTestIds';\nexport { default as useTheme } from './useTheme';\nexport { default as useToaster } from './useToaster';\nexport { default as useTransitionState } from './useTransitionState';\nexport { default as useTriggerableEffect } from './useTriggerableEffect';\nexport { default as useTriggerableLayoutEffect } from './useTriggerableLayoutEffect';\nexport { default as useUID } from './useUID';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE1F,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAEhF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default as useActiveDescendant, useLazyDescendant } from './useActiveDescendant';\nexport type { UseActiveDescendantConfig } from './useActiveDescendant';\nexport { default as useAfterInitialEffect } from './useAfterInitialEffect';\nexport { default as useArrows } from './useArrows';\nexport { default as useAutoResize } from './useAutoResize';\nexport { default as useBreakpoint } from './useBreakpoint';\nexport { default as useChToPxConversionFactor } from './useChToPxConversionFactor';\nexport { default as useConfiguration } from './useConfiguration';\nexport { default as useConsolidatedRef } from './useConsolidatedRef';\nexport { default as useDirection } from './useDirection';\nexport { default as useDraggable } from './useDraggable';\nexport { default as useElement } from './useElement';\nexport { default as useEscape } from './useEscape';\nexport { default as useEvent } from './useEvent';\nexport { default as useFocusTrap } from './useFocusTrap';\nexport { default as useFocusWithin } from './useFocusWithin';\nexport { default as useI18n } from './useI18n';\nexport { default as useInputFormatter } from './useInputFormatter';\nexport { default as useItemIntersection } from './useItemIntersection';\nexport { default as useLiveLog } from './useLiveLog';\nexport { default as useLongPress } from './useLongPress';\nexport { default as useModalContext } from './useModalContext';\nexport { default as useModalManager } from './useModalManager';\nexport { default as useOS } from './useOS';\nexport { default as useOuterEvent } from './useOuterEvent';\nexport { default as usePrevious } from './usePrevious';\nexport { default as useRefMap } from './useRefMap';\nexport { default as useSimpleStore, createSimpleStore } from './useSimpleStore';\nexport type { SimpleStore } from './useSimpleStore';\nexport { default as useScrollStick } from './useScrollStick';\nexport { default as useScrollToggle } from './useScrollToggle';\nexport { default as useShortcut } from './useShortcut';\nexport { default as useShortcutManager } from './useShortcutManager';\nexport { default as useTestIds } from './useTestIds';\nexport { default as useTheme } from './useTheme';\nexport { default as useToaster } from './useToaster';\nexport { default as useTransitionState } from './useTransitionState';\nexport { default as useTriggerableEffect } from './useTriggerableEffect';\nexport { default as useTriggerableLayoutEffect } from './useTriggerableLayoutEffect';\nexport { default as useUID } from './useUID';\n"]}

package/lib/hooks/useI18n.d.ts

@@ -54,6 +54,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     configure: string;
     dismiss: string;
     due: string;
+    drag: string;
     view_all: string;
     view_less: string;
     show_more: string;
@@ -82,6 +83,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     insert_noun: string;
     delete_noun: string;
     actions_for: string;
+    remove_noun: string;
     edited: string;
     done: string;
     uploading: string;
@@ -188,6 +190,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     shortcut_NextRegion: string;
     shortcut_PrevRegion: string;
     app_shell_user_account: string;
+    application_logo: string;
     combobox_open_close: string;
     combobox_search_instructions: string;
     combobox_open_list_button_a11y: string;
@@ -256,6 +259,13 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     collapse_utilities_panel: string;
     primary_summary_fields: string;
     summary_fields: string;
+    case_type_icon: string;
+    case_type: string;
+    case_tabs: string;
+    close_preview: string;
+    preview_error: string;
+    previewed_case: string;
+    case_preview_tabs: string;
     accept_suggestion_button_a11y: string;
     reject_suggestion_button_a11y: string;
     suggestion_info: string;
@@ -266,6 +276,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     tab_error_tooltip: string;
     non_previewable: string;
     content_load_error: string;
+    drag_handle_description: string;
     assignments: string;
     article_list_label_a11y: string;
     article_list_filter_label_a11y: string;
@@ -291,9 +302,10 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     dislikes: string;
     like: string;
     dislike: string;
-    close_preview: string;
     confirmation_whats_next: string;
     confirmation_open_tasks: string;
+    search_results_active_filters: string;
+    search_filter_update_message: string;
     add_stakeholders: string;
     edit_stakeholder: string;
     view_stakeholders: string;

package/lib/hooks/useI18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/hooks/useRefMap.d.ts

@@ -0,0 +1,8 @@
+import type { RefCallback } from 'react';
+/**
+ * @see [React docs for suggested pattern](https://react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback)
+ * @returns A tuple containing a map of refs and a function to get a ref callback for a given id.
+ */
+declare const useRefMap: <T>() => [Map<string, T>, (id: string) => RefCallback<T>];
+export default useRefMap;
+//# sourceMappingURL=useRefMap.d.ts.map

package/lib/hooks/useRefMap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRefMap.d.ts","sourceRoot":"","sources":["../../src/hooks/useRefMap.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEzC;;;GAGG;AACH,QAAA,MAAM,SAAS,iCAI2B,MAAM,oBAmB/C,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/hooks/useRefMap.js

@@ -0,0 +1,27 @@
+import { useCallback, useState } from 'react';
+/**
+ * @see [React docs for suggested pattern](https://react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback)
+ * @returns A tuple containing a map of refs and a function to get a ref callback for a given id.
+ */
+const useRefMap = () => {
+    const [map] = useState(() => new Map());
+    const [cbMap] = useState(() => new Map());
+    const getCallbackRef = useCallback((id) => {
+        if (cbMap.has(id)) {
+            return cbMap.get(id);
+        }
+        const cb = el => {
+            if (el !== null) {
+                map.set(id, el);
+            }
+            else {
+                map.delete(id);
+            }
+        };
+        cbMap.set(id, cb);
+        return cb;
+    }, []);
+    return [map, getCallbackRef];
+};
+export default useRefMap;
+//# sourceMappingURL=useRefMap.js.map

package/lib/hooks/useRefMap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRefMap.js","sourceRoot":"","sources":["../../src/hooks/useRefMap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG9C;;;GAGG;AACH,MAAM,SAAS,GAAG,GAAM,EAAE;IACxB,MAAM,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,GAAG,EAAa,CAAC,CAAC;IACnD,MAAM,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,GAAG,EAA0B,CAAC,CAAC;IAElE,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,EAAU,EAAkB,EAAE;QAChE,IAAI,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE;YACjB,OAAO,KAAK,CAAC,GAAG,CAAC,EAAE,CAAE,CAAC;SACvB;QAED,MAAM,EAAE,GAAmB,EAAE,CAAC,EAAE;YAC9B,IAAI,EAAE,KAAK,IAAI,EAAE;gBACf,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;aACjB;iBAAM;gBACL,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;aAChB;QACH,CAAC,CAAC;QAEF,KAAK,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;QAElB,OAAO,EAAE,CAAC;IACZ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CAAC,GAAG,EAAE,cAAc,CAA4D,CAAC;AAC1F,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { useCallback, useState } from 'react';\nimport type { RefCallback } from 'react';\n\n/**\n * @see [React docs for suggested pattern](https://react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback)\n * @returns A tuple containing a map of refs and a function to get a ref callback for a given id.\n */\nconst useRefMap = <T>() => {\n  const [map] = useState(() => new Map<string, T>());\n  const [cbMap] = useState(() => new Map<string, RefCallback<T>>());\n\n  const getCallbackRef = useCallback((id: string): RefCallback<T> => {\n    if (cbMap.has(id)) {\n      return cbMap.get(id)!;\n    }\n\n    const cb: RefCallback<T> = el => {\n      if (el !== null) {\n        map.set(id, el);\n      } else {\n        map.delete(id);\n      }\n    };\n\n    cbMap.set(id, cb);\n\n    return cb;\n  }, []);\n\n  return [map, getCallbackRef] satisfies [Map<string, T>, (id: string) => RefCallback<T>];\n};\n\nexport default useRefMap;\n"]}