@grafana/ui/dist/cjs/components/Modal/ModalBase.cjs.map

Grafana Components Library

{"version":3,"file":"ModalBase.cjs","sources":["../../../../src/components/Modal/ModalBase.tsx"],"sourcesContent":["import { cx } from '@emotion/css';\nimport { FloatingFocusManager, useDismiss, useFloating, useInteractions, useRole } from '@floating-ui/react';\nimport { OverlayContainer } from '@react-aria/overlays';\nimport { type PropsWithChildren, useRef } from 'react';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { getPortalContainer } from '../Portal/Portal';\n\nimport { getModalStyles } from './getModalStyles';\n\nexport interface ModalBaseProps {\n  className?: string;\n  closeOnEscape?: boolean;\n  closeOnBackdropClick?: boolean;\n  trapFocus?: boolean;\n  isOpen?: boolean;\n  onDismiss?: () => void;\n  onClickBackdrop?: () => void;\n  'aria-label'?: string;\n  'aria-labelledby'?: string;\n}\n\nexport function ModalBase({\n  children,\n  className,\n  isOpen = false,\n  closeOnEscape = true,\n  closeOnBackdropClick = false,\n  trapFocus = true,\n  onDismiss,\n  onClickBackdrop,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n}: PropsWithChildren<ModalBaseProps>) {\n  const styles = useStyles2(getModalStyles);\n\n  const { context, refs } = useFloating({\n    open: isOpen,\n    onOpenChange: (open) => {\n      if (!open) {\n        onDismiss?.();\n      }\n    },\n  });\n\n  const backdropRef = useRef<HTMLDivElement>(null);\n\n  const dismiss = useDismiss(context, {\n    escapeKey: closeOnEscape,\n    outsidePress: (event) => {\n      // The portal container is \"inside\" the modal (see getInsideElements below), so presses\n      // there must not dismiss it — except on the backdrop, which also renders there.\n      const target = event.target instanceof Node ? event.target : null;\n      const portalContainer = getPortalContainer();\n      if (\n        target &&\n        portalContainer !== document.body &&\n        portalContainer.contains(target) &&\n        !backdropRef.current?.contains(target)\n      ) {\n        return false;\n      }\n      if (onClickBackdrop) {\n        onClickBackdrop();\n        return false;\n      }\n      return closeOnBackdropClick;\n    },\n  });\n\n  const role = useRole(context, {\n    role: 'dialog',\n  });\n\n  const { getFloatingProps } = useInteractions([dismiss, role]);\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <OverlayContainer>\n      <div role=\"presentation\" ref={backdropRef} className={styles.modalBackdrop} />\n      <FloatingFocusManager context={context} modal={trapFocus} getInsideElements={() => [getPortalContainer()]}>\n        <div\n          className={cx(styles.modal, className)}\n          ref={refs.setFloating}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          {...getFloatingProps()}\n        >\n          {children}\n        </div>\n      </FloatingFocusManager>\n    </OverlayContainer>\n  );\n}\n"],"names":["useStyles2","getModalStyles","useFloating","useRef","useDismiss","getPortalContainer","useRole","useInteractions","OverlayContainer","jsx","FloatingFocusManager","cx"],"mappings":";;;;;;;;;;;;;;AAsBO,SAAS,SAAA,CAAU;AAAA,EACxB,QAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA,GAAS,KAAA;AAAA,EACT,aAAA,GAAgB,IAAA;AAAA,EAChB,oBAAA,GAAuB,KAAA;AAAA,EACvB,SAAA,GAAY,IAAA;AAAA,EACZ,SAAA;AAAA,EACA,eAAA;AAAA,EACA,YAAA,EAAc,SAAA;AAAA,EACd,iBAAA,EAAmB;AACrB,CAAA,EAAsC;AACpC,EAAA,MAAM,MAAA,GAASA,wBAAWC,6BAAc,CAAA;AAExC,EAAA,MAAM,EAAE,OAAA,EAAS,IAAA,EAAK,GAAIC,iBAAA,CAAY;AAAA,IACpC,IAAA,EAAM,MAAA;AAAA,IACN,YAAA,EAAc,CAAC,IAAA,KAAS;AACtB,MAAA,IAAI,CAAC,IAAA,EAAM;AACT,QAAA,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,EAAA;AAAA,MACF;AAAA,IACF;AAAA,GACD,CAAA;AAED,EAAA,MAAM,WAAA,GAAcC,aAAuB,IAAI,CAAA;AAE/C,EAAA,MAAM,OAAA,GAAUC,iBAAW,OAAA,EAAS;AAAA,IAClC,SAAA,EAAW,aAAA;AAAA,IACX,YAAA,EAAc,CAAC,KAAA,KAAU;AAjD7B,MAAA,IAAA,EAAA;AAoDM,MAAA,MAAM,MAAA,GAAS,KAAA,CAAM,MAAA,YAAkB,IAAA,GAAO,MAAM,MAAA,GAAS,IAAA;AAC7D,MAAA,MAAM,kBAAkBC,yBAAA,EAAmB;AAC3C,MAAA,IACE,MAAA,IACA,eAAA,KAAoB,QAAA,CAAS,IAAA,IAC7B,eAAA,CAAgB,QAAA,CAAS,MAAM,CAAA,IAC/B,EAAA,CAAC,EAAA,GAAA,WAAA,CAAY,OAAA,KAAZ,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAqB,SAAS,MAAA,CAAA,CAAA,EAC/B;AACA,QAAA,OAAO,KAAA;AAAA,MACT;AACA,MAAA,IAAI,eAAA,EAAiB;AACnB,QAAA,eAAA,EAAgB;AAChB,QAAA,OAAO,KAAA;AAAA,MACT;AACA,MAAA,OAAO,oBAAA;AAAA,IACT;AAAA,GACD,CAAA;AAED,EAAA,MAAM,IAAA,GAAOC,cAAQ,OAAA,EAAS;AAAA,IAC5B,IAAA,EAAM;AAAA,GACP,CAAA;AAED,EAAA,MAAM,EAAE,gBAAA,EAAiB,GAAIC,sBAAgB,CAAC,OAAA,EAAS,IAAI,CAAC,CAAA;AAE5D,EAAA,IAAI,CAAC,MAAA,EAAQ;AACX,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uCACGC,yBAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,SAAI,IAAA,EAAK,cAAA,EAAe,KAAK,WAAA,EAAa,SAAA,EAAW,OAAO,aAAA,EAAe,CAAA;AAAA,oBAC5EA,cAAA,CAACC,0BAAA,EAAA,EAAqB,OAAA,EAAkB,KAAA,EAAO,SAAA,EAAW,mBAAmB,MAAM,CAACL,yBAAA,EAAoB,CAAA,EACtG,QAAA,kBAAAI,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWE,MAAA,CAAG,MAAA,CAAO,KAAA,EAAO,SAAS,CAAA;AAAA,QACrC,KAAK,IAAA,CAAK,WAAA;AAAA,QACV,YAAA,EAAY,SAAA;AAAA,QACZ,iBAAA,EAAiB,cAAA;AAAA,QAChB,GAAG,gBAAA,EAAiB;AAAA,QAEpB;AAAA;AAAA,KACH,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}