UNPKG

react-responsive-modal

Version:

A simple responsive and accessible react modal

1 lines 25.8 kB
{"version":3,"file":"index.cjs","names":["classes","node: any","nodes: any","form: any","parentElem: any","event: any","event: KeyboardEvent","modals: Ref<Element>[]","newModal: Ref<Element>","oldModal: Ref<Element>","modal: Ref<Element>","ref: Ref<Element>","open: boolean","refModal: React.RefObject<Element | null>","open: boolean","showPortal: boolean","blockScroll: boolean","reserveScrollBarGap?: boolean","ref: React.ForwardedRef<HTMLDivElement>","event: KeyboardEvent","event: React.MouseEvent<HTMLDivElement, MouseEvent>","CloseIcon"],"sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/useScrollLock.ts","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]',\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement | null>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>(null);\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector),\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element | null>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean,\n reserveScrollBarGap?: boolean,\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current, { reserveScrollBarGap });\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport cx from 'classnames';\nimport { useForwardedRef } from '@bedrock-layout/use-forwarded-ref';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement | null>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * Avoid unpleasant flickering effect when body overflow is hidden. For more information see https://www.npmjs.com/package/body-scroll-lock\n */\n reserveScrollBarGap?: boolean;\n /**\n * id attribute for modal container\n */\n containerId?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>,\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n containerId,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n reserveScrollBarGap,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>,\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>,\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? (classNames?.overlayAnimationIn ?? classes.overlayAnimationIn)\n : (classNames?.overlayAnimationOut ?? classes.overlayAnimationOut);\n\n const modalAnimation = open\n ? (classNames?.modalAnimationIn ?? classes.modalAnimationIn)\n : (classNames?.modalAnimationOut ?? classes.modalAnimationOut);\n\n return showPortal && containerModal\n ? createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n id={containerId}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer,\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal,\n )\n : null;\n },\n);\n\nexport default Modal;\n"],"mappings":"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"}