@morganlethuaut/react-modal-component/dist/index.mjs.map

A reusable React modal component.

{"version":3,"file":"index.mjs","sources":["../src/Modal.tsx","../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["import { useRef, useCallback, useEffect } from 'react'\r\n\r\nimport MODAL_STYLES from './@modal/modal.module.scss'\r\n\r\ntype MODAL_TT_PROPS =\r\n{\r\n    show             : boolean,\r\n    setShow          : React.Dispatch<React.SetStateAction<boolean>>,\r\n    className       ?: string,\r\n    toFocus         ?: React.RefObject<HTMLElement | null>,\r\n    ariaLabelledby  ?: string,\r\n    ariaDescribedby ?: string,\r\n    disabledCloseBtn?: boolean\r\n}\r\n\r\nexport default function Modal({show, setShow, className = '', toFocus, ariaLabelledby, ariaDescribedby, disabledCloseBtn, children}: MODAL_TT_PROPS & React.PropsWithChildren)\r\n{\r\n    const\r\n    PREVIOUS_FOCUSABLE  = document.activeElement as HTMLElement | null,\r\n    MODAL               = useRef<HTMLDialogElement>(null),\r\n    TRANSITION_DURATION = useRef(210),\r\n    TIMEOUT_ID          = useRef<number>(0),\r\n    set                 = useCallback((): void =>\r\n    {\r\n        const MODAL_ELEMENT = MODAL.current!\r\n\r\n        clearTimeout(TIMEOUT_ID.current)\r\n    \r\n        updateGlobalScrolling(true)\r\n    \r\n        MODAL_ELEMENT.showModal()\r\n\r\n        if (toFocus) requestAnimationFrame(() => toFocus.current?.focus())\r\n    },\r\n    []),\r\n    destroy = useCallback((): void =>\r\n    {\r\n        TIMEOUT_ID.current = setTimeout((): void =>\r\n        {\r\n            MODAL.current!.close()\r\n            PREVIOUS_FOCUSABLE?.focus()\r\n        },\r\n        TRANSITION_DURATION.current)\r\n\r\n        updateGlobalScrolling(false)\r\n    },\r\n    []),\r\n    updateGlobalScrolling = useCallback((frozen: boolean): void => { document.documentElement.style.setProperty('overflow', frozen ? 'hidden' : '', 'important') }, []),\r\n    close_eClick          = useCallback((): void => setShow(false), [])\r\n\r\n    useEffect(() =>\r\n    {\r\n        if (!show) return\r\n\r\n        set()\r\n\r\n        return destroy\r\n    },\r\n    [show])\r\n\r\n    return (\r\n        <dialog\r\n        className={`${className} ${MODAL_STYLES.modal}`}\r\n        style={{ transitionDuration: TRANSITION_DURATION.current + 'ms' }}\r\n        role=\"dialog\"\r\n        aria-labelledby={ariaLabelledby}\r\n        aria-describedby={ariaDescribedby}\r\n        aria-modal={show}\r\n        ref={MODAL}\r\n        >\r\n            {\r\n                !disabledCloseBtn &&\r\n    \r\n                <button\r\n                className={MODAL_STYLES.close}\r\n                type=\"button\"\r\n                onClick={close_eClick}\r\n                autoFocus\r\n                >\r\n                    <svg\r\n                    className={MODAL_STYLES.xmark}\r\n                    viewBox=\"0 0 24 24\"\r\n                    fill=\"none\"\r\n                    xmlns=\"http://www.w3.org/2000/svg\"\r\n                    >\r\n                        <path\r\n                        d=\"M5 19L19 5M5 5L19 19\"\r\n                        stroke=\"currentColor\"\r\n                        strokeWidth=\"2.7\"\r\n                        strokeLinecap=\"round\"\r\n                        strokeLinejoin=\"round\"\r\n                        />\r\n                    </svg>\r\n                </button>\r\n            }\r\n\r\n            {children}\r\n        </dialog>\r\n    )\r\n}","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n"],"names":["Modal","_a","show","setShow","_b","className","toFocus","ariaLabelledby","ariaDescribedby","disabledCloseBtn","children","PREVIOUS_FOCUSABLE","document","activeElement","MODAL","useRef","TRANSITION_DURATION","TIMEOUT_ID","set","useCallback","MODAL_ELEMENT","current","clearTimeout","updateGlobalScrolling","showModal","requestAnimationFrame","focus","destroy","setTimeout","close","frozen","documentElement","style","setProperty","close_eClick","useEffect","_jsxs","concat","MODAL_STYLES","transitionDuration","role","ref","_jsx","type","onClick","autoFocus","viewBox","fill","xmlns","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin","css","insertAt","head","getElementsByTagName","createElement","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode"],"mappings":"+MAewB,SAAAA,EAAMC,OAACC,EAAID,EAAAC,KAAEC,EAAOF,EAAAE,QAAEC,cAAAC,OAAY,IAAAD,EAAA,GAAEA,EAAEE,EAAOL,EAAAK,QAAEC,EAAcN,EAAAM,eAAEC,EAAeP,EAAAO,gBAAEC,EAAgBR,EAAAQ,iBAAEC,EAAQT,EAAAS,SAG9HC,EAAsBC,SAASC,cAC/BC,EAAsBC,EAA0B,MAChDC,EAAsBD,EAAO,KAC7BE,EAAsBF,EAAe,GACrCG,EAAsBC,GAAY,WAE9B,IAAMC,EAAgBN,EAAMO,QAE5BC,aAAaL,EAAWI,SAExBE,GAAsB,GAEtBH,EAAcI,YAEVlB,GAASmB,uBAAsB,WAAA,IAAAxB,EAAM,OAAe,QAAfA,EAAAK,EAAQe,eAAO,IAAApB,OAAA,EAAAA,EAAEyB,UAC7D,GACD,IACAC,EAAUR,GAAY,WAElBF,EAAWI,QAAUO,YAAW,WAE5Bd,EAAMO,QAASQ,QACflB,SAAAA,EAAoBe,OACxB,GACAV,EAAoBK,SAEpBE,GAAsB,EACzB,GACD,IACAA,EAAwBJ,GAAY,SAACW,GAA4BlB,SAASmB,gBAAgBC,MAAMC,YAAY,WAAYH,EAAS,SAAW,GAAI,YAAY,GAAI,IAChKI,EAAwBf,GAAY,WAAY,OAAAhB,GAAQ,EAAM,GAAE,IAYhE,OAVAgC,GAAU,WAEN,GAAKjC,EAIL,OAFAgB,IAEOS,CACX,GACA,CAACzB,IAGGkC,EACA,SAAA,CAAA/B,UAAW,GAAAgC,OAAGhC,EAAa,KAAAgC,OAAAC,GAC3BN,MAAO,CAAEO,mBAAoBvB,EAAoBK,QAAU,MAC3DmB,KAAK,2BACYjC,EAAc,mBACbC,EAAe,aACrBN,EACZuC,IAAK3B,EAAKJ,SAAA,EAGDD,GAEDiC,EAAA,SAAA,CACArC,UAAWiC,EACXK,KAAK,SACLC,QAASV,EACTW,WAAS,EAAAnC,SAELgC,EACA,MAAA,CAAArC,UAAWiC,EACXQ,QAAQ,YACRC,KAAK,OACLC,MAAM,6BAA4BtC,SAE9BgC,EACA,OAAA,CAAAO,EAAE,uBACFC,OAAO,eACPC,YAAY,MACZC,cAAc,QACdC,eAAe,cAM1B3C,IAGb,ECnGA,SAAqB4C,EAAKb,QACX,IAARA,IAAiBA,EAAM,CAAE,GAC9B,IAAIc,EAAWd,EAAIc,SAEnB,GAAgC,oBAAb3C,SAAnB,CAEA,IAAI4C,EAAO5C,SAAS4C,MAAQ5C,SAAS6C,qBAAqB,QAAQ,GAC9DzB,EAAQpB,SAAS8C,cAAc,SACnC1B,EAAMW,KAAO,WAEI,QAAbY,GACEC,EAAKG,WACPH,EAAKI,aAAa5B,EAAOwB,EAAKG,YAKhCH,EAAKK,YAAY7B,GAGfA,EAAM8B,WACR9B,EAAM8B,WAAWC,QAAUT,EAE3BtB,EAAM6B,YAAYjD,SAASoD,eAAeV,GAnBU,CAqBxD","x_google_ignoreList":[1]}