@muraldevkit/ui-toolkit 4.68.0-dev-NFbt.1 → 4.68.0-dev-nPeA.1

package/dist/cjs/components/modal/MrlModal/MrlModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlModal.js","sources":["../../../../../src/components/modal/MrlModal/MrlModal.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MrlComponentProps, setAttributes, getUniqueId } from '../../../utils';\nimport { defaults, ModalSize, ModalState, TransitionDuration } from '../constants';\nimport { MrlIconButton, MrlFocusTrap, MrlSvg } from '../../';\nimport { close } from '@muraldevkit/ds-icons';\nimport classNames from 'classnames';\nimport styles from './MrlModal.module.scss';\nimport { PORTAL_LAYERS } from '../../../utils/layers';\nimport './MrlModal.global.scss';\nimport { MrlModalContext } from '../MrlModalContext';\n\ninterface ModalProps extends MrlComponentProps {\n\t/**\n\t * Aria label for the modal\n\t */\n\tariaLabel?: string;\n\n\t/**\n\t * Content of the modal\n\t */\n\tchildren: React.ReactElement | React.ReactElement[];\n\n\t/**\n\t * Modal Wrapper Class\n\t */\n\tclassName?: string;\n\n\t/**\n\t * !!!!! WARNING: do not use this prop without an explicit requirement from the design team !!!!!\n\t *\n\t * Enables/disables the ability to close the modal. This prop does the following:\n\t * - removes close button\n\t * - disables clicking on the overlay to close the modal\n\t * - disables the escape key to close the modal\n\t */\n\tclosable?: boolean;\n\n\t/**\n\t * Tells the modal whether we are in a loading state.\n\t * This is used to disabled FocusTrap until the contents of the modal are loaded\n\t */\n\tloading?: boolean;\n\n\t/**\n\t * Prevents the background from scrolling when the modal is open\n\t */\n\tpreventBackgroundScroll?: boolean;\n\n\t/** The size of the modal container */\n\tsize?: ModalSize;\n\n\t/** Current state of the modal based on user interactions or permissions */\n\tstate?: ModalState;\n\n\t/** Additional function to be run when the modal closes */\n\thookClose?: (() => void) | undefined;\n}\n\n/**\n * Modal Component.\n * @param props - Modal props\n * @returns an instance of the MrlModal\n */\nexport const MrlModal = React.forwardRef<HTMLDivElement, ModalProps>(\n\tfunction MrlModal(props, ref): JSX.Element {\n\t\tconst {\n\t\t\tariaLabel,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tclosable = true,\n\t\t\tloading = false,\n\t\t\tsize = defaults.size,\n\t\t\tstate = 'close',\n\t\t\thookClose = undefined,\n\t\t\tpreventBackgroundScroll = true,\n\t\t\tattrs = {},\n\t\t\t...rest\n\t\t} = props;\n\t\t/**\n\t\t * Reference to the modal container.\n\t\t */\n\t\tconst modalContainer = React.useRef<HTMLDivElement>(null);\n\n\t\t/**\n\t\t * Reference to the modal\n\t\t */\n\t\tconst modal = React.useRef<HTMLDivElement>(null);\n\n\t\tReact.useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(ref, () => {\n\t\t\treturn modalContainer.current;\n\t\t});\n\n\t\t/**\n\t\t * Reference to the modal close button.\n\t\t */\n\t\tconst closeButton = React.useRef<HTMLButtonElement | null>(null);\n\n\t\t/**\n\t\t * Reference to the modal heading element.\n\t\t */\n\t\tconst heading = React.useRef<HTMLHeadingElement | null>(null);\n\n\t\t/**\n\t\t * Open/Closed state of the modal\n\t\t */\n\t\tconst [modalState, setModalState] = React.useState(() => state);\n\n\t\t/**\n\t\t * Sets the state of the modal for fading in and out opacity\n\t\t */\n\t\tconst [fadeState, setFadeState] = React.useState('');\n\n\t\t/**\n\t\t * Sets state of the modal for when it is completely hidden from the DOM\n\t\t */\n\t\tconst [displayState, setDisplayState] = React.useState('hide');\n\n\t\t/**\n\t\t * Sets aria-labelledby attribute on the modal for assistive technology\n\t\t */\n\t\tconst [modalLabel, setModalLabel] = React.useState<string | null>(null);\n\n\t\t/**\n\t\t * Store the previous overflow value of the body before we set it to hidden\n\t\t */\n\t\tconst [prevOverflow, setPrevOverflow] = React.useState('');\n\n\t\t/**\n\t\t *  Indicates if the content is scrollable, calculated in the MrlModalContent component\n\t\t */\n\t\tconst [scrollableContent, setScrollableContent] = React.useState({\n\t\t\thasScrollBottom: false,\n\t\t\thasScrollTop: false,\n\t\t\tisContentScrollable: false\n\t\t});\n\n\t\t/**\n\t\t * Modal title for context\n\t\t */\n\t\tconst [title, setTitle] = React.useState('');\n\n\t\t/**\n\t\t * Handles when the user clicks on the overlay to close the modal\n\t\t * @param {React.KeyEvent} e - key event data\n\t\t */\n\t\tconst handleKeyDismiss = (e: React.KeyboardEvent): void => {\n\t\t\tif (e.key === 'Escape') setModalState('close');\n\t\t};\n\n\t\t/**\n\t\t * Handles when the user clicks on the overlay to close the modal\n\t\t * @param {MouseEvent} e - mouse event data\n\t\t */\n\t\tconst handleDismiss = (e: React.MouseEvent): void => {\n\t\t\tif (modalContainer.current !== e.target) return;\n\n\t\t\thandleClose();\n\t\t};\n\n\t\t/**\n\t\t * Handler logic for closing the modal\n\t\t */\n\t\tconst handleClose = React.useCallback(() => {\n\t\t\tsetFadeState(styles['fade-out']);\n\n\t\t\t/**\n\t\t\t * Set timeout to allow for fade out animation to complete\n\t\t\t * before we hide the modal from the DOM and call the close hook\n\t\t\t */\n\t\t\tconst timeoutId = setTimeout(() => {\n\t\t\t\tif (modal.current) {\n\t\t\t\t\tsetDisplayState(styles['hide']);\n\t\t\t\t}\n\t\t\t\thookClose && hookClose();\n\t\t\t}, TransitionDuration);\n\n\t\t\tif (preventBackgroundScroll) document.body.style.overflow = prevOverflow;\n\n\t\t\t// cleanup setTimeout\n\t\t\treturn () => {\n\t\t\t\tclearTimeout(timeoutId);\n\t\t\t};\n\t\t}, [hookClose, prevOverflow, preventBackgroundScroll]);\n\n\t\t/**\n\t\t * Handler logic for opening the modal\n\t\t */\n\t\tconst handleOpen = React.useCallback(() => {\n\t\t\tsetDisplayState(styles['display']);\n\t\t\tsetFadeState(styles['fade-in']);\n\n\t\t\tif (preventBackgroundScroll) {\n\t\t\t\tsetPrevOverflow(document.body.style.overflow);\n\t\t\t\tdocument.body.style.overflow = 'hidden';\n\t\t\t}\n\t\t}, [preventBackgroundScroll]);\n\n\t\t/**\n\t\t * Sets the open/close state of the UI\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\tif (modalState === 'open') {\n\t\t\t\thandleOpen();\n\t\t\t} else if (modalState === 'close') {\n\t\t\t\t// setup reference so we can clean up the funciton\n\t\t\t\tconst cleanup = handleClose();\n\n\t\t\t\t// cleanup handleClose\n\t\t\t\treturn cleanup;\n\t\t\t}\n\t\t}, [modalState, handleOpen, handleClose]);\n\n\t\t/**\n\t\t * Sets modal state when the state prop changes\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\tsetModalState(state);\n\t\t}, [state]);\n\n\t\t/**\n\t\t * ComponentDidLoad\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\tconst el = modalContainer.current;\n\n\t\t\tif (el) {\n\t\t\t\t/**\n\t\t\t\t * Setting up aria-labelledby association for assitive technology users\n\t\t\t\t */\n\t\t\t\tif (el.getAttribute('aria-labelledby') === null) {\n\t\t\t\t\theading.current = el.querySelector('.mrl-modal-text-heading');\n\n\t\t\t\t\tif (heading.current) {\n\t\t\t\t\t\tlet id = heading.current.getAttribute('id');\n\t\t\t\t\t\tif (!id) {\n\t\t\t\t\t\t\tid = getUniqueId('mrl-modal');\n\t\t\t\t\t\t\theading.current.setAttribute('id', id);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tsetModalLabel(id);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}, []);\n\n\t\t/**\n\t\t * Cleanup overflow hidden when component unmounts\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\treturn () => {\n\t\t\t\tdocument.body.style.overflow = '';\n\t\t\t};\n\t\t}, []);\n\t\tconst containerClasses = classNames(\n\t\t\t'mrl-modal-container',\n\t\t\t'mrl-modal-backdrop',\n\t\t\tclassName,\n\t\t\tstyles['mrl-modal-backdrop'],\n\t\t\tfadeState,\n\t\t\tdisplayState\n\t\t);\n\n\t\tconst modalClasses = classNames(\n\t\t\t'mrl-modal',\n\t\t\tstyles['mrl-modal'],\n\t\t\tattrs.class || attrs.className,\n\t\t\t{\n\t\t\t\t[`mrl-modal--${size}`]: size !== defaults.size\n\t\t\t}\n\t\t);\n\n\t\tconst closeClasses = classNames('mrl-modal-close', styles['mrl-modal-close']);\n\n\t\tconst attrConfig = {\n\t\t\t'aria-hidden': (modalState === 'close').toString(),\n\t\t\t...(ariaLabel\n\t\t\t\t? { 'aria-label': ariaLabel }\n\t\t\t\t: modalLabel !== null\n\t\t\t\t\t? { 'aria-labelledby': modalLabel }\n\t\t\t\t\t: { 'aria-label': 'Modal' }),\n\t\t\t'aria-modal': 'true',\n\t\t\trole: 'dialog'\n\t\t};\n\n\t\tdelete attrs.class;\n\t\tdelete attrs.className;\n\n\t\tconst attributes = setAttributes(attrs, attrConfig);\n\n\t\treturn (\n\t\t\t<MrlModalContext.Provider\n\t\t\t\tvalue={{\n\t\t\t\t\tscrollableContent,\n\t\t\t\t\tsetScrollableContent,\n\t\t\t\t\tsetTitle,\n\t\t\t\t\ttitle\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<MrlFocusTrap disabled={loading} containerRef={modalContainer}>\n\t\t\t\t\t{/*eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions*/}\n\t\t\t\t\t<div\n\t\t\t\t\t\t{...rest}\n\t\t\t\t\t\tid={PORTAL_LAYERS.MODAL.name}\n\t\t\t\t\t\tref={modalContainer}\n\t\t\t\t\t\t{...attributes}\n\t\t\t\t\t\tclassName={containerClasses}\n\t\t\t\t\t\t{...(closable && { onMouseDown: handleDismiss })}\n\t\t\t\t\t\t{...(closable && { onKeyDown: handleKeyDismiss })}\n\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\tstyle={{ zIndex: PORTAL_LAYERS.MODAL.zIndex }}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div ref={modal} className={modalClasses}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t{closable && (\n\t\t\t\t\t\t\t\t<MrlIconButton\n\t\t\t\t\t\t\t\t\twrapperClassName={closeClasses}\n\t\t\t\t\t\t\t\t\ticon={<MrlSvg svg={close} />}\n\t\t\t\t\t\t\t\t\tonClick={handleClose}\n\t\t\t\t\t\t\t\t\ttext=\"Close\"\n\t\t\t\t\t\t\t\t\tstate=\"default\"\n\t\t\t\t\t\t\t\t\tposition=\"bottom\"\n\t\t\t\t\t\t\t\t\ttipAnchor=\"center\"\n\t\t\t\t\t\t\t\t\tref={closeButton}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</MrlFocusTrap>\n\t\t\t</MrlModalContext.Provider>\n\t\t);\n\t}\n);\n"],"names":["MrlModal","React","forwardRef","props","ref","ariaLabel","children","className","_props$closable","closable","_props$loading","loading","_props$size","size","defaults","_props$state","state","_props$hookClose","hookClose","undefined","_props$preventBackgro","preventBackgroundScroll","_props$attrs","attrs","rest","_objectWithoutProperties","_excluded","modalContainer","useRef","modal","useImperativeHandle","current","closeButton","heading","_React$useState","useState","_React$useState2","_slicedToArray","modalState","setModalState","_React$useState3","_React$useState4","fadeState","setFadeState","_React$useState5","_React$useState6","displayState","setDisplayState","_React$useState7","_React$useState8","modalLabel","setModalLabel","_React$useState9","_React$useState0","prevOverflow","setPrevOverflow","_React$useState1","hasScrollBottom","hasScrollTop","isContentScrollable","_React$useState10","scrollableContent","setScrollableContent","_React$useState11","_React$useState12","title","setTitle","handleKeyDismiss","e","key","handleDismiss","target","handleClose","useCallback","styles","timeoutId","setTimeout","TransitionDuration","document","body","style","overflow","clearTimeout","handleOpen","useEffect","cleanup","el","getAttribute","querySelector","id","getUniqueId","setAttribute","containerClasses","classNames","modalClasses","_defineProperty","concat","closeClasses","attrConfig","_objectSpread","toString","role","attributes","setAttributes","createElement","MrlModalContext","Provider","value","MrlFocusTrap","disabled","containerRef","_extends","PORTAL_LAYERS","MODAL","name","onMouseDown","onKeyDown","zIndex","MrlIconButton","wrapperClassName","icon","MrlSvg","svg","close","onClick","text","position","tipAnchor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DA;AACA;AACA;AACA;AACA;AACO,IAAMA,QAAQ,gBAAGC,gBAAK,CAACC,UAAU,CACvC,SAASF,QAAQA,CAACG,KAAK,EAAEC,GAAG,EAAe;AAC1C,EAAA,IACCC,SAAS,GAWNF,KAAK,CAXRE,SAAS;IACTC,QAAQ,GAULH,KAAK,CAVRG,QAAQ;IACRC,SAAS,GASNJ,KAAK,CATRI,SAAS;IAAAC,eAAA,GASNL,KAAK,CARRM,QAAQ;AAARA,IAAAA,QAAQ,GAAAD,eAAA,KAAA,MAAA,GAAG,IAAI,GAAAA,eAAA;IAAAE,cAAA,GAQZP,KAAK,CAPRQ,OAAO;AAAPA,IAAAA,OAAO,GAAAD,cAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,cAAA;IAAAE,WAAA,GAOZT,KAAK,CANRU,IAAI;AAAJA,IAAAA,IAAI,GAAAD,WAAA,KAAA,MAAA,GAAGE,kBAAQ,CAACD,IAAI,GAAAD,WAAA;IAAAG,YAAA,GAMjBZ,KAAK,CALRa,KAAK;AAALA,IAAAA,KAAK,GAAAD,YAAA,KAAA,MAAA,GAAG,OAAO,GAAAA,YAAA;IAAAE,gBAAA,GAKZd,KAAK,CAJRe,SAAS;AAATA,IAAAA,SAAS,GAAAD,gBAAA,KAAA,MAAA,GAAGE,SAAS,GAAAF,gBAAA;IAAAG,qBAAA,GAIlBjB,KAAK,CAHRkB,uBAAuB;AAAvBA,IAAAA,uBAAuB,GAAAD,qBAAA,KAAA,MAAA,GAAG,IAAI,GAAAA,qBAAA;IAAAE,YAAA,GAG3BnB,KAAK,CAFRoB,KAAK;AAALA,IAAAA,KAAK,GAAAD,YAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,YAAA;AACPE,IAAAA,IAAI,GAAAC,iDAAA,CACJtB,KAAK,EAAAuB,SAAA,CAAA;AACT;AACF;AACA;AACE,EAAA,IAAMC,cAAc,GAAG1B,gBAAK,CAAC2B,MAAM,CAAiB,IAAI,CAAC;;AAEzD;AACF;AACA;AACE,EAAA,IAAMC,KAAK,GAAG5B,gBAAK,CAAC2B,MAAM,CAAiB,IAAI,CAAC;AAEhD3B,EAAAA,gBAAK,CAAC6B,mBAAmB,CAA+C1B,GAAG,EAAE,YAAM;IAClF,OAAOuB,cAAc,CAACI,OAAO;AAC9B,EAAA,CAAC,CAAC;;AAEF;AACF;AACA;AACE,EAAA,IAAMC,WAAW,GAAG/B,gBAAK,CAAC2B,MAAM,CAA2B,IAAI,CAAC;;AAEhE;AACF;AACA;AACE,EAAA,IAAMK,OAAO,GAAGhC,gBAAK,CAAC2B,MAAM,CAA4B,IAAI,CAAC;;AAE7D;AACF;AACA;AACE,EAAA,IAAAM,eAAA,GAAoCjC,gBAAK,CAACkC,QAAQ,CAAC,YAAA;AAAA,MAAA,OAAMnB,KAAK;IAAA,CAAA,CAAC;IAAAoB,gBAAA,GAAAC,uCAAA,CAAAH,eAAA,EAAA,CAAA,CAAA;AAAxDI,IAAAA,UAAU,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,aAAa,GAAAH,gBAAA,CAAA,CAAA,CAAA;;AAEhC;AACF;AACA;AACE,EAAA,IAAAI,gBAAA,GAAkCvC,gBAAK,CAACkC,QAAQ,CAAC,EAAE,CAAC;IAAAM,gBAAA,GAAAJ,uCAAA,CAAAG,gBAAA,EAAA,CAAA,CAAA;AAA7CE,IAAAA,SAAS,GAAAD,gBAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,YAAY,GAAAF,gBAAA,CAAA,CAAA,CAAA;;AAE9B;AACF;AACA;AACE,EAAA,IAAAG,gBAAA,GAAwC3C,gBAAK,CAACkC,QAAQ,CAAC,MAAM,CAAC;IAAAU,gBAAA,GAAAR,uCAAA,CAAAO,gBAAA,EAAA,CAAA,CAAA;AAAvDE,IAAAA,YAAY,GAAAD,gBAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,eAAe,GAAAF,gBAAA,CAAA,CAAA,CAAA;;AAEpC;AACF;AACA;AACE,EAAA,IAAAG,gBAAA,GAAoC/C,gBAAK,CAACkC,QAAQ,CAAgB,IAAI,CAAC;IAAAc,gBAAA,GAAAZ,uCAAA,CAAAW,gBAAA,EAAA,CAAA,CAAA;AAAhEE,IAAAA,UAAU,GAAAD,gBAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,aAAa,GAAAF,gBAAA,CAAA,CAAA,CAAA;;AAEhC;AACF;AACA;AACE,EAAA,IAAAG,gBAAA,GAAwCnD,gBAAK,CAACkC,QAAQ,CAAC,EAAE,CAAC;IAAAkB,gBAAA,GAAAhB,uCAAA,CAAAe,gBAAA,EAAA,CAAA,CAAA;AAAnDE,IAAAA,YAAY,GAAAD,gBAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,eAAe,GAAAF,gBAAA,CAAA,CAAA,CAAA;;AAEpC;AACF;AACA;AACE,EAAA,IAAAG,gBAAA,GAAkDvD,gBAAK,CAACkC,QAAQ,CAAC;AAChEsB,MAAAA,eAAe,EAAE,KAAK;AACtBC,MAAAA,YAAY,EAAE,KAAK;AACnBC,MAAAA,mBAAmB,EAAE;AACtB,KAAC,CAAC;IAAAC,iBAAA,GAAAvB,uCAAA,CAAAmB,gBAAA,EAAA,CAAA,CAAA;AAJKK,IAAAA,iBAAiB,GAAAD,iBAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,oBAAoB,GAAAF,iBAAA,CAAA,CAAA,CAAA;;AAM9C;AACF;AACA;AACE,EAAA,IAAAG,iBAAA,GAA0B9D,gBAAK,CAACkC,QAAQ,CAAC,EAAE,CAAC;IAAA6B,iBAAA,GAAA3B,uCAAA,CAAA0B,iBAAA,EAAA,CAAA,CAAA;AAArCE,IAAAA,KAAK,GAAAD,iBAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,QAAQ,GAAAF,iBAAA,CAAA,CAAA,CAAA;;AAEtB;AACF;AACA;AACA;AACE,EAAA,IAAMG,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,CAAsB,EAAW;IAC1D,IAAIA,CAAC,CAACC,GAAG,KAAK,QAAQ,EAAE9B,aAAa,CAAC,OAAO,CAAC;EAC/C,CAAC;;AAED;AACF;AACA;AACA;AACE,EAAA,IAAM+B,aAAa,GAAG,SAAhBA,aAAaA,CAAIF,CAAmB,EAAW;AACpD,IAAA,IAAIzC,cAAc,CAACI,OAAO,KAAKqC,CAAC,CAACG,MAAM,EAAE;AAEzCC,IAAAA,WAAW,EAAE;EACd,CAAC;;AAED;AACF;AACA;AACE,EAAA,IAAMA,WAAW,GAAGvE,gBAAK,CAACwE,WAAW,CAAC,YAAM;AAC3C9B,IAAAA,YAAY,CAAC+B,uBAAM,CAAC,UAAU,CAAC,CAAC;;AAEhC;AACH;AACA;AACA;AACG,IAAA,IAAMC,SAAS,GAAGC,UAAU,CAAC,YAAM;MAClC,IAAI/C,KAAK,CAACE,OAAO,EAAE;AAClBgB,QAAAA,eAAe,CAAC2B,uBAAM,CAAC,MAAM,CAAC,CAAC;AAChC,MAAA;MACAxD,SAAS,IAAIA,SAAS,EAAE;IACzB,CAAC,EAAE2D,4BAAkB,CAAC;IAEtB,IAAIxD,uBAAuB,EAAEyD,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,QAAQ,GAAG3B,YAAY;;AAExE;AACA,IAAA,OAAO,YAAM;MACZ4B,YAAY,CAACP,SAAS,CAAC;IACxB,CAAC;EACF,CAAC,EAAE,CAACzD,SAAS,EAAEoC,YAAY,EAAEjC,uBAAuB,CAAC,CAAC;;AAEtD;AACF;AACA;AACE,EAAA,IAAM8D,UAAU,GAAGlF,gBAAK,CAACwE,WAAW,CAAC,YAAM;AAC1C1B,IAAAA,eAAe,CAAC2B,uBAAM,CAAC,SAAS,CAAC,CAAC;AAClC/B,IAAAA,YAAY,CAAC+B,uBAAM,CAAC,SAAS,CAAC,CAAC;AAE/B,IAAA,IAAIrD,uBAAuB,EAAE;MAC5BkC,eAAe,CAACuB,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,QAAQ,CAAC;AAC7CH,MAAAA,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,QAAQ,GAAG,QAAQ;AACxC,IAAA;AACD,EAAA,CAAC,EAAE,CAAC5D,uBAAuB,CAAC,CAAC;;AAE7B;AACF;AACA;EACEpB,gBAAK,CAACmF,SAAS,CAAC,YAAM;IACrB,IAAI9C,UAAU,KAAK,MAAM,EAAE;AAC1B6C,MAAAA,UAAU,EAAE;AACb,IAAA,CAAC,MAAM,IAAI7C,UAAU,KAAK,OAAO,EAAE;AAClC;AACA,MAAA,IAAM+C,OAAO,GAAGb,WAAW,EAAE;;AAE7B;AACA,MAAA,OAAOa,OAAO;AACf,IAAA;EACD,CAAC,EAAE,CAAC/C,UAAU,EAAE6C,UAAU,EAAEX,WAAW,CAAC,CAAC;;AAEzC;AACF;AACA;EACEvE,gBAAK,CAACmF,SAAS,CAAC,YAAM;IACrB7C,aAAa,CAACvB,KAAK,CAAC;AACrB,EAAA,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;;AAEX;AACF;AACA;EACEf,gBAAK,CAACmF,SAAS,CAAC,YAAM;AACrB,IAAA,IAAME,EAAE,GAAG3D,cAAc,CAACI,OAAO;AAEjC,IAAA,IAAIuD,EAAE,EAAE;AACP;AACJ;AACA;MACI,IAAIA,EAAE,CAACC,YAAY,CAAC,iBAAiB,CAAC,KAAK,IAAI,EAAE;QAChDtD,OAAO,CAACF,OAAO,GAAGuD,EAAE,CAACE,aAAa,CAAC,yBAAyB,CAAC;QAE7D,IAAIvD,OAAO,CAACF,OAAO,EAAE;UACpB,IAAI0D,EAAE,GAAGxD,OAAO,CAACF,OAAO,CAACwD,YAAY,CAAC,IAAI,CAAC;UAC3C,IAAI,CAACE,EAAE,EAAE;AACRA,YAAAA,EAAE,GAAGC,yBAAW,CAAC,WAAW,CAAC;YAC7BzD,OAAO,CAACF,OAAO,CAAC4D,YAAY,CAAC,IAAI,EAAEF,EAAE,CAAC;AACvC,UAAA;UAEAtC,aAAa,CAACsC,EAAE,CAAC;AAClB,QAAA;AACD,MAAA;AACD,IAAA;EACD,CAAC,EAAE,EAAE,CAAC;;AAEN;AACF;AACA;EACExF,gBAAK,CAACmF,SAAS,CAAC,YAAM;AACrB,IAAA,OAAO,YAAM;AACZN,MAAAA,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,QAAQ,GAAG,EAAE;IAClC,CAAC;EACF,CAAC,EAAE,EAAE,CAAC;AACN,EAAA,IAAMW,gBAAgB,GAAGC,UAAU,CAClC,qBAAqB,EACrB,oBAAoB,EACpBtF,SAAS,EACTmE,uBAAM,CAAC,oBAAoB,CAAC,EAC5BhC,SAAS,EACTI,YACD,CAAC;AAED,EAAA,IAAMgD,YAAY,GAAGD,UAAU,CAC9B,WAAW,EACXnB,uBAAM,CAAC,WAAW,CAAC,EACnBnD,KAAK,SAAM,IAAIA,KAAK,CAAChB,SAAS,EAAAwF,wCAAA,CAAA,EAAA,EAAA,aAAA,CAAAC,MAAA,CAEdnF,IAAI,CAAA,EAAKA,IAAI,KAAKC,kBAAQ,CAACD,IAAI,CAEhD,CAAC;EAED,IAAMoF,YAAY,GAAGJ,UAAU,CAAC,iBAAiB,EAAEnB,uBAAM,CAAC,iBAAiB,CAAC,CAAC;AAE7E,EAAA,IAAMwB,UAAU,GAAAC,uCAAA,CAAAA,uCAAA,CAAA;AACf,IAAA,aAAa,EAAE,CAAC7D,UAAU,KAAK,OAAO,EAAE8D,QAAQ;AAAE,GAAA,EAC9C/F,SAAS,GACV;AAAE,IAAA,YAAY,EAAEA;AAAU,GAAC,GAC3B6C,UAAU,KAAK,IAAI,GAClB;AAAE,IAAA,iBAAiB,EAAEA;AAAW,GAAC,GACjC;AAAE,IAAA,YAAY,EAAE;GAAS,CAAA,EAAA,EAAA,EAAA;AAC7B,IAAA,YAAY,EAAE,MAAM;AACpBmD,IAAAA,IAAI,EAAE;GAAQ,CACd;AAED,EAAA,OAAO9E,KAAK,CAAA,OAAA,CAAM;EAClB,OAAOA,KAAK,CAAChB,SAAS;AAEtB,EAAA,IAAM+F,UAAU,GAAGC,2BAAa,CAAChF,KAAK,EAAE2E,UAAU,CAAC;AAEnD,EAAA,oBACCjG,gBAAA,CAAAuG,aAAA,CAACC,+BAAe,CAACC,QAAQ,EAAA;AACxBC,IAAAA,KAAK,EAAE;AACN9C,MAAAA,iBAAiB,EAAjBA,iBAAiB;AACjBC,MAAAA,oBAAoB,EAApBA,oBAAoB;AACpBI,MAAAA,QAAQ,EAARA,QAAQ;AACRD,MAAAA,KAAK,EAALA;AACD;AAAE,GAAA,eAEFhE,gBAAA,CAAAuG,aAAA,CAACI,yBAAY,EAAA;AAACC,IAAAA,QAAQ,EAAElG,OAAQ;AAACmG,IAAAA,YAAY,EAAEnF;AAAe,GAAA,eAE7D1B,gBAAA,CAAAuG,aAAA,CAAA,KAAA,EAAAO,iCAAA,KACKvF,IAAI,EAAA;AACRiE,IAAAA,EAAE,EAAEuB,mBAAa,CAACC,KAAK,CAACC,IAAK;AAC7B9G,IAAAA,GAAG,EAAEuB;AAAe,GAAA,EAChB2E,UAAU,EAAA;AACd/F,IAAAA,SAAS,EAAEqF;AAAiB,GAAA,EACvBnF,QAAQ,IAAI;AAAE0G,IAAAA,WAAW,EAAE7C;GAAe,EAC1C7D,QAAQ,IAAI;AAAE2G,IAAAA,SAAS,EAAEjD;GAAkB,EAAA;AAChDkC,IAAAA,IAAI,EAAC,QAAQ;AACbrB,IAAAA,KAAK,EAAE;AAAEqC,MAAAA,MAAM,EAAEL,mBAAa,CAACC,KAAK,CAACI;AAAO;GAAE,CAAA,eAE9CpH,gBAAA,CAAAuG,aAAA,CAAA,KAAA,EAAA;AAAKpG,IAAAA,GAAG,EAAEyB,KAAM;AAACtB,IAAAA,SAAS,EAAEuF;GAAa,EACvCxF,QAAQ,EACRG,QAAQ,iBACRR,gBAAA,CAAAuG,aAAA,CAACc,2BAAa,EAAA;AACbC,IAAAA,gBAAgB,EAAEtB,YAAa;AAC/BuB,IAAAA,IAAI,eAAEvH,gBAAA,CAAAuG,aAAA,CAACiB,aAAM,EAAA;AAACC,MAAAA,GAAG,EAAEC;AAAM,KAAE,CAAE;AAC7BC,IAAAA,OAAO,EAAEpD,WAAY;AACrBqD,IAAAA,IAAI,EAAC,OAAO;AACZ7G,IAAAA,KAAK,EAAC,SAAS;AACf8G,IAAAA,QAAQ,EAAC,QAAQ;AACjBC,IAAAA,SAAS,EAAC,QAAQ;AAClB3H,IAAAA,GAAG,EAAE4B;AAAY,GACjB,CAEE,CACD,CACQ,CACW,CAAC;AAE7B,CACD;;;;"}
+{"version":3,"file":"MrlModal.js","sources":["../../../../../src/components/modal/MrlModal/MrlModal.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MrlComponentProps, setAttributes, getUniqueId } from '../../../utils';\nimport { defaults, ModalSize, ModalState, TransitionDuration } from '../constants';\nimport { MrlIconButton, MrlFocusTrap, MrlSvg } from '../../';\nimport { close } from '@muraldevkit/ds-icons';\nimport classNames from 'classnames';\nimport styles from './MrlModal.module.scss';\nimport { PORTAL_LAYERS } from '../../../utils/layers';\nimport './MrlModal.global.scss';\nimport { MrlModalContext } from '../MrlModalContext';\n\ninterface ModalProps extends MrlComponentProps {\n\t/**\n\t * Aria label for the modal\n\t */\n\tariaLabel?: string;\n\n\t/**\n\t * Content of the modal\n\t */\n\tchildren: React.ReactElement | React.ReactElement[];\n\n\t/**\n\t * Modal Wrapper Class\n\t */\n\tclassName?: string;\n\n\t/**\n\t * !!!!! WARNING: do not use this prop without an explicit requirement from the design team !!!!!\n\t *\n\t * Enables/disables the ability to close the modal. This prop does the following:\n\t * - removes close button\n\t * - disables clicking on the overlay to close the modal\n\t * - disables the escape key to close the modal\n\t */\n\tclosable?: boolean;\n\n\t/**\n\t * Tells the modal whether we are in a loading state.\n\t * This is used to disabled FocusTrap until the contents of the modal are loaded\n\t */\n\tloading?: boolean;\n\n\t/**\n\t * Prevents the background from scrolling when the modal is open\n\t */\n\tpreventBackgroundScroll?: boolean;\n\n\t/** The size of the modal container */\n\tsize?: ModalSize;\n\n\t/** Current state of the modal based on user interactions or permissions */\n\tstate?: ModalState;\n\n\t/** Additional function to be run when the modal closes */\n\thookClose?: (() => void) | undefined;\n}\n\n/**\n * Modal Component.\n * @param props - Modal props\n * @returns an instance of the MrlModal\n */\nexport const MrlModal = React.forwardRef<HTMLDivElement, ModalProps>(\n\tfunction MrlModal(props, ref): JSX.Element {\n\t\tconst {\n\t\t\tariaLabel,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tclosable = true,\n\t\t\tloading = false,\n\t\t\tsize = defaults.size,\n\t\t\tstate = 'close',\n\t\t\thookClose = undefined,\n\t\t\tpreventBackgroundScroll = true,\n\t\t\tattrs = {},\n\t\t\t...rest\n\t\t} = props;\n\t\t/**\n\t\t * Reference to the modal container.\n\t\t */\n\t\tconst modalContainer = React.useRef<HTMLDivElement>(null);\n\n\t\t/**\n\t\t * Reference to the modal\n\t\t */\n\t\tconst modal = React.useRef<HTMLDivElement>(null);\n\n\t\tReact.useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(ref, () => {\n\t\t\treturn modalContainer.current;\n\t\t});\n\n\t\t/**\n\t\t * Reference to the modal close button.\n\t\t */\n\t\tconst closeButton = React.useRef<HTMLButtonElement | null>(null);\n\n\t\t/**\n\t\t * Reference to the modal heading element.\n\t\t */\n\t\tconst heading = React.useRef<HTMLHeadingElement | null>(null);\n\n\t\t/**\n\t\t * Open/Closed state of the modal\n\t\t */\n\t\tconst [modalState, setModalState] = React.useState(() => state);\n\n\t\t/**\n\t\t * Sets the state of the modal for fading in and out opacity\n\t\t */\n\t\tconst [fadeState, setFadeState] = React.useState('');\n\n\t\t/**\n\t\t * Sets state of the modal for when it is completely hidden from the DOM\n\t\t */\n\t\tconst [displayState, setDisplayState] = React.useState('hide');\n\n\t\t/**\n\t\t * Sets aria-labelledby attribute on the modal for assistive technology\n\t\t */\n\t\tconst [modalLabel, setModalLabel] = React.useState<string | null>(null);\n\n\t\t/**\n\t\t * Store the previous overflow value of the body before we set it to hidden\n\t\t */\n\t\tconst [prevOverflow, setPrevOverflow] = React.useState('');\n\n\t\t/**\n\t\t *  Indicates if the content is scrollable, calculated in the MrlModalContent component\n\t\t */\n\t\tconst [scrollableContent, setScrollableContent] = React.useState({\n\t\t\thasScrollBottom: false,\n\t\t\thasScrollTop: false,\n\t\t\tisContentScrollable: false\n\t\t});\n\n\t\t/**\n\t\t * Modal title for context\n\t\t */\n\t\tconst [title, setTitle] = React.useState('');\n\n\t\t/**\n\t\t * Handles when the user clicks on the overlay to close the modal\n\t\t * @param {React.KeyEvent} e - key event data\n\t\t */\n\t\tconst handleKeyDismiss = (e: React.KeyboardEvent): void => {\n\t\t\tif (e.key === 'Escape') setModalState('close');\n\t\t};\n\n\t\t/**\n\t\t * Handles when the user clicks on the overlay to close the modal\n\t\t * @param {MouseEvent} e - mouse event data\n\t\t */\n\t\tconst handleDismiss = (e: React.MouseEvent): void => {\n\t\t\tif (modalContainer.current !== e.target) return;\n\n\t\t\thandleClose();\n\t\t};\n\n\t\t/**\n\t\t * Handler logic for closing the modal\n\t\t */\n\t\tconst handleClose = React.useCallback(() => {\n\t\t\tsetFadeState(styles['fade-out']);\n\n\t\t\t/**\n\t\t\t * Set timeout to allow for fade out animation to complete\n\t\t\t * before we hide the modal from the DOM and call the close hook\n\t\t\t */\n\t\t\tconst timeoutId = setTimeout(() => {\n\t\t\t\tif (modal.current) {\n\t\t\t\t\tsetDisplayState(styles['hide']);\n\t\t\t\t}\n\t\t\t\thookClose && hookClose();\n\t\t\t}, TransitionDuration);\n\n\t\t\tif (preventBackgroundScroll) document.body.style.overflow = prevOverflow;\n\n\t\t\t// cleanup setTimeout\n\t\t\treturn () => {\n\t\t\t\tclearTimeout(timeoutId);\n\t\t\t};\n\t\t}, [hookClose, prevOverflow, preventBackgroundScroll]);\n\n\t\t/**\n\t\t * Handler logic for opening the modal\n\t\t */\n\t\tconst handleOpen = React.useCallback(() => {\n\t\t\tsetDisplayState(styles['display']);\n\t\t\tsetFadeState(styles['fade-in']);\n\n\t\t\tif (preventBackgroundScroll) {\n\t\t\t\tsetPrevOverflow(document.body.style.overflow);\n\t\t\t\tdocument.body.style.overflow = 'hidden';\n\t\t\t}\n\t\t}, [preventBackgroundScroll]);\n\n\t\t/**\n\t\t * Sets the open/close state of the UI\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\tif (modalState === 'open') {\n\t\t\t\thandleOpen();\n\t\t\t} else if (modalState === 'close') {\n\t\t\t\t// setup reference so we can clean up the funciton\n\t\t\t\tconst cleanup = handleClose();\n\n\t\t\t\t// cleanup handleClose\n\t\t\t\treturn cleanup;\n\t\t\t}\n\t\t}, [modalState, handleOpen, handleClose]);\n\n\t\t/**\n\t\t * Sets modal state when the state prop changes\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\tsetModalState(state);\n\t\t}, [state]);\n\n\t\t/**\n\t\t * ComponentDidLoad\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\tconst el = modalContainer.current;\n\n\t\t\tif (el) {\n\t\t\t\t/**\n\t\t\t\t * Setting up aria-labelledby association for assitive technology users\n\t\t\t\t */\n\t\t\t\tif (el.getAttribute('aria-labelledby') === null) {\n\t\t\t\t\theading.current = el.querySelector('.mrl-modal-text-heading');\n\n\t\t\t\t\tif (heading.current) {\n\t\t\t\t\t\tlet id = heading.current.getAttribute('id');\n\t\t\t\t\t\tif (!id) {\n\t\t\t\t\t\t\tid = getUniqueId('mrl-modal');\n\t\t\t\t\t\t\theading.current.setAttribute('id', id);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tsetModalLabel(id);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}, []);\n\n\t\t/**\n\t\t * Cleanup overflow hidden when component unmounts\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\treturn () => {\n\t\t\t\tdocument.body.style.overflow = '';\n\t\t\t};\n\t\t}, []);\n\t\tconst containerClasses = classNames(\n\t\t\t'mrl-modal-container',\n\t\t\t'mrl-modal-backdrop',\n\t\t\tclassName,\n\t\t\tstyles['mrl-modal-backdrop'],\n\t\t\tfadeState,\n\t\t\tdisplayState\n\t\t);\n\n\t\tconst modalClasses = classNames(\n\t\t\t'mrl-modal',\n\t\t\tstyles['mrl-modal'],\n\t\t\tattrs.class || attrs.className,\n\t\t\t{\n\t\t\t\t[`mrl-modal--${size}`]: size !== defaults.size\n\t\t\t}\n\t\t);\n\n\t\tconst closeClasses = classNames('mrl-modal-close', styles['mrl-modal-close']);\n\n\t\tconst attrConfig = {\n\t\t\t'aria-hidden': (modalState === 'close').toString(),\n\t\t\t...(ariaLabel\n\t\t\t\t? { 'aria-label': ariaLabel }\n\t\t\t\t: modalLabel !== null\n\t\t\t\t\t? { 'aria-labelledby': modalLabel }\n\t\t\t\t\t: { 'aria-label': 'Modal' }),\n\t\t\t'aria-modal': 'true',\n\t\t\trole: 'dialog'\n\t\t};\n\n\t\tdelete attrs.class;\n\t\tdelete attrs.className;\n\n\t\tconst attributes = setAttributes(attrs, attrConfig);\n\n\t\treturn (\n\t\t\t<MrlModalContext.Provider\n\t\t\t\tvalue={{\n\t\t\t\t\tscrollableContent,\n\t\t\t\t\tsetScrollableContent,\n\t\t\t\t\tsetTitle,\n\t\t\t\t\ttitle\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<MrlFocusTrap disabled={loading} containerRef={modalContainer}>\n\t\t\t\t\t{/*eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions*/}\n\t\t\t\t\t<div\n\t\t\t\t\t\t{...rest}\n\t\t\t\t\t\tid={PORTAL_LAYERS.MODAL.name}\n\t\t\t\t\t\tref={modalContainer}\n\t\t\t\t\t\t{...attributes}\n\t\t\t\t\t\tclassName={containerClasses}\n\t\t\t\t\t\t{...(closable && { onMouseDown: handleDismiss })}\n\t\t\t\t\t\t{...(closable && { onKeyDown: handleKeyDismiss })}\n\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\tstyle={{ zIndex: PORTAL_LAYERS.MODAL.zIndex }}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div ref={modal} className={modalClasses}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t{closable && (\n\t\t\t\t\t\t\t\t<MrlIconButton\n\t\t\t\t\t\t\t\t\twrapperClassName={closeClasses}\n\t\t\t\t\t\t\t\t\ticon={<MrlSvg svg={close} />}\n\t\t\t\t\t\t\t\t\tonClick={handleClose}\n\t\t\t\t\t\t\t\t\ttext=\"Close\"\n\t\t\t\t\t\t\t\t\tstate=\"default\"\n\t\t\t\t\t\t\t\t\tposition=\"bottom\"\n\t\t\t\t\t\t\t\t\ttipAnchor=\"center\"\n\t\t\t\t\t\t\t\t\tref={closeButton}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</MrlFocusTrap>\n\t\t\t</MrlModalContext.Provider>\n\t\t);\n\t}\n);\n"],"names":["MrlModal","React","forwardRef","props","ref","ariaLabel","children","className","_props$closable","closable","_props$loading","loading","_props$size","size","defaults","_props$state","state","_props$hookClose","hookClose","undefined","_props$preventBackgro","preventBackgroundScroll","_props$attrs","attrs","rest","_objectWithoutProperties","_excluded","modalContainer","useRef","modal","useImperativeHandle","current","closeButton","heading","_React$useState","useState","_React$useState2","_slicedToArray","modalState","setModalState","_React$useState3","_React$useState4","fadeState","setFadeState","_React$useState5","_React$useState6","displayState","setDisplayState","_React$useState7","_React$useState8","modalLabel","setModalLabel","_React$useState9","_React$useState0","prevOverflow","setPrevOverflow","_React$useState1","hasScrollBottom","hasScrollTop","isContentScrollable","_React$useState10","scrollableContent","setScrollableContent","_React$useState11","_React$useState12","title","setTitle","handleKeyDismiss","e","key","handleDismiss","target","handleClose","useCallback","styles","timeoutId","setTimeout","TransitionDuration","document","body","style","overflow","clearTimeout","handleOpen","useEffect","cleanup","el","getAttribute","querySelector","id","getUniqueId","setAttribute","containerClasses","classNames","modalClasses","class","concat","closeClasses","attrConfig","_objectSpread","toString","role","attributes","setAttributes","createElement","MrlModalContext","Provider","value","MrlFocusTrap","disabled","containerRef","_extends","PORTAL_LAYERS","MODAL","name","onMouseDown","onKeyDown","zIndex","MrlIconButton","wrapperClassName","icon","MrlSvg","svg","close","onClick","text","position","tipAnchor"],"mappings":"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"}

package/dist/cjs/components/modal/MrlModalContent/MrlModalContent.js

@@ -9,7 +9,10 @@ var hasScrollContent = require('../../../utils/hasScrollContent/hasScrollContent
 var index = require('../../../hooks/useHasFocusableDescendant/index.js');
 var MrlModalContext = require('../MrlModalContext/MrlModalContext.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -26,7 +29,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["children", "className"];
 /**
@@ -35,7 +39,7 @@ var _excluded = ["children", "className"];
  * @param {React.ReactElement} props.children - The children to be rendered within the component
  * @returns {React.ReactElement}} The rendered MrlModalContent component
  */
-var MrlModalContent = function MrlModalContent(_ref) {
+var MrlModalContent = _ref => {
   var children = _ref.children,
     className = _ref.className,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
@@ -45,7 +49,7 @@ var MrlModalContent = function MrlModalContent(_ref) {
     title = _useMrlModalContext.title;
   var contentAreaRef = React__namespace.useRef(null);
   var hasFocusableDescendant = index.useHasFocusableDescendant(contentAreaRef);
-  React__namespace.useEffect(function () {
+  React__namespace.useEffect(() => {
     if (!contentAreaRef.current) return;
 
     /**
@@ -59,22 +63,22 @@ var MrlModalContent = function MrlModalContent(_ref) {
      * https://www.w3.org/WAI/standards-guidelines/act/rules/0ssw9k/
      */
     var contentArea = contentAreaRef.current;
-    contentArea.addEventListener('scroll', function () {
+    contentArea.addEventListener('scroll', () => {
       setScrollableContent(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, hasScrollContent.hasScrollContent(contentArea)), {}, {
         isContentScrollable: index$1.isElementScrollable(contentArea)
       }));
     });
-    var observer = new ResizeObserver(function () {
+    var observer = new ResizeObserver(() => {
       setScrollableContent(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, hasScrollContent.hasScrollContent(contentArea)), {}, {
         isContentScrollable: index$1.isElementScrollable(contentArea)
       }));
     });
     observer.observe(contentArea);
-    return function () {
+    return () => {
       observer.disconnect();
     };
   }, [setScrollableContent]);
-  var contentClasses = classnames('mrl-modal-content', className, MrlModalContent_module.default['mrl-modal-content'], {
+  var contentClasses = classnames__default.default('mrl-modal-content', className, MrlModalContent_module.default['mrl-modal-content'], {
     'mrl-modal-content-scrollable': scrollableContent.isContentScrollable
   });
   return /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {

package/dist/cjs/components/modal/MrlModalContent/MrlModalContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlModalContent.js","sources":["../../../../../src/components/modal/MrlModalContent/MrlModalContent.tsx"],"sourcesContent":["import * as React from 'react';\nimport classNames from 'classnames';\nimport { isElementScrollable } from '../../../utils/isElementScrollable';\n\nimport styles from './MrlModalContent.module.scss';\nimport { useMrlModalContext } from '../MrlModalContext';\nimport { hasScrollContent } from '../../../utils/hasScrollContent/hasScrollContent';\nimport { useHasFocusableDescendant } from '../../../hooks/useHasFocusableDescendant';\n\ninterface MrlModalContentProps {\n\t/**\n\t * Children to be rendered within the component.\n\t */\n\tchildren: React.ReactElement | React.ReactElement[];\n\n\t/**\n\t * Wrapper Class\n\t */\n\tclassName?: string;\n}\n\n/**\n * Modal Content component for the MrlModal\n * @param {object} props - The props object\n * @param {React.ReactElement} props.children - The children to be rendered within the component\n * @returns {React.ReactElement}} The rendered MrlModalContent component\n */\nexport const MrlModalContent = ({\n\tchildren,\n\tclassName,\n\t...rest\n}: MrlModalContentProps): JSX.Element => {\n\tconst { scrollableContent, setScrollableContent, title } = useMrlModalContext();\n\tconst contentAreaRef = React.useRef<HTMLDivElement>(null);\n\tconst hasFocusableDescendant = useHasFocusableDescendant(contentAreaRef);\n\n\tReact.useEffect(() => {\n\t\tif (!contentAreaRef.current) return;\n\n\t\t/**\n\t\t * Sets up observer to toggle tabindex value on the scrollable region within the modal. When\n\t\t * the content area is overflowed and has no focusable descendants, we want to set tabindex\n\t\t * to 0 so that keyboard-only users can scroll through the content. Per ACT rule 0ssw9k a\n\t\t * scrollable region passes WCAG 2.1.1 Keyboard either by being focusable itself or by having\n\t\t * a focusable descendant, so we omit `tabindex=\"0\"` whenever a descendant control is\n\t\t * already keyboard reachable. The labeled `role=\"region\"` is preserved whenever the modal\n\t\t * content overflows so screen-reader users get a landmark in either case.\n\t\t * https://www.w3.org/WAI/standards-guidelines/act/rules/0ssw9k/\n\t\t */\n\t\tconst contentArea = contentAreaRef.current;\n\n\t\tcontentArea.addEventListener('scroll', () => {\n\t\t\tsetScrollableContent({\n\t\t\t\t...hasScrollContent(contentArea),\n\t\t\t\tisContentScrollable: isElementScrollable(contentArea)\n\t\t\t});\n\t\t});\n\n\t\tconst observer = new ResizeObserver(() => {\n\t\t\tsetScrollableContent({\n\t\t\t\t...hasScrollContent(contentArea),\n\t\t\t\tisContentScrollable: isElementScrollable(contentArea)\n\t\t\t});\n\t\t});\n\n\t\tobserver.observe(contentArea);\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [setScrollableContent]);\n\n\tconst contentClasses = classNames('mrl-modal-content', className, styles['mrl-modal-content'], {\n\t\t'mrl-modal-content-scrollable': scrollableContent.isContentScrollable\n\t});\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tref={contentAreaRef}\n\t\t\tclassName={contentClasses}\n\t\t\t{...(scrollableContent.isContentScrollable && {\n\t\t\t\t'aria-label': title ? `${title} modal scrollable content` : 'modal scrollable content',\n\t\t\t\trole: 'region',\n\t\t\t\t...(!hasFocusableDescendant && { tabIndex: 0 })\n\t\t\t})}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"],"names":["MrlModalContent","_ref","children","className","rest","_objectWithoutProperties","_excluded","_useMrlModalContext","useMrlModalContext","scrollableContent","setScrollableContent","title","contentAreaRef","React","useRef","hasFocusableDescendant","useHasFocusableDescendant","useEffect","current","contentArea","addEventListener","_objectSpread","hasScrollContent","isContentScrollable","isElementScrollable","observer","ResizeObserver","observe","disconnect","contentClasses","classNames","styles","createElement","_extends","ref","concat","role","tabIndex"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA;AACA;AACA;AACA;AACA;AACA;IACaA,eAAe,GAAG,SAAlBA,eAAeA,CAAAC,IAAA,EAIa;AAAA,EAAA,IAHxCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS;AACNC,IAAAA,IAAI,GAAAC,iDAAA,CAAAJ,IAAA,EAAAK,SAAA,CAAA;AAEP,EAAA,IAAAC,mBAAA,GAA2DC,kCAAkB,EAAE;IAAvEC,iBAAiB,GAAAF,mBAAA,CAAjBE,iBAAiB;IAAEC,oBAAoB,GAAAH,mBAAA,CAApBG,oBAAoB;IAAEC,KAAK,GAAAJ,mBAAA,CAALI,KAAK;AACtD,EAAA,IAAMC,cAAc,GAAGC,gBAAK,CAACC,MAAM,CAAiB,IAAI,CAAC;AACzD,EAAA,IAAMC,sBAAsB,GAAGC,+BAAyB,CAACJ,cAAc,CAAC;EAExEC,gBAAK,CAACI,SAAS,CAAC,YAAM;AACrB,IAAA,IAAI,CAACL,cAAc,CAACM,OAAO,EAAE;;AAE7B;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACE,IAAA,IAAMC,WAAW,GAAGP,cAAc,CAACM,OAAO;AAE1CC,IAAAA,WAAW,CAACC,gBAAgB,CAAC,QAAQ,EAAE,YAAM;MAC5CV,oBAAoB,CAAAW,uCAAA,CAAAA,uCAAA,KAChBC,iCAAgB,CAACH,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;QAChCI,mBAAmB,EAAEC,2BAAmB,CAACL,WAAW;AAAC,OAAA,CACrD,CAAC;AACH,IAAA,CAAC,CAAC;AAEF,IAAA,IAAMM,QAAQ,GAAG,IAAIC,cAAc,CAAC,YAAM;MACzChB,oBAAoB,CAAAW,uCAAA,CAAAA,uCAAA,KAChBC,iCAAgB,CAACH,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;QAChCI,mBAAmB,EAAEC,2BAAmB,CAACL,WAAW;AAAC,OAAA,CACrD,CAAC;AACH,IAAA,CAAC,CAAC;AAEFM,IAAAA,QAAQ,CAACE,OAAO,CAACR,WAAW,CAAC;AAE7B,IAAA,OAAO,YAAM;MACZM,QAAQ,CAACG,UAAU,EAAE;IACtB,CAAC;AACF,EAAA,CAAC,EAAE,CAAClB,oBAAoB,CAAC,CAAC;AAE1B,EAAA,IAAMmB,cAAc,GAAGC,UAAU,CAAC,mBAAmB,EAAE3B,SAAS,EAAE4B,8BAAM,CAAC,mBAAmB,CAAC,EAAE;IAC9F,8BAA8B,EAAEtB,iBAAiB,CAACc;AACnD,GAAC,CAAC;AAEF,EAAA,oBACCV,gBAAA,CAAAmB,aAAA,CAAA,KAAA,EAAAC,iCAAA,KACK7B,IAAI,EAAA;AACR8B,IAAAA,GAAG,EAAEtB,cAAe;AACpBT,IAAAA,SAAS,EAAE0B;AAAe,GAAA,EACrBpB,iBAAiB,CAACc,mBAAmB,IAAAF,uCAAA,CAAA;AACzC,IAAA,YAAY,EAAEV,KAAK,GAAA,EAAA,CAAAwB,MAAA,CAAMxB,KAAK,iCAA8B,0BAA0B;AACtFyB,IAAAA,IAAI,EAAE;GAAQ,EACV,CAACrB,sBAAsB,IAAI;AAAEsB,IAAAA,QAAQ,EAAE;GAAG,CAC9C,CAAA,EAEAnC,QACG,CAAC;AAER;;;;"}
+{"version":3,"file":"MrlModalContent.js","sources":["../../../../../src/components/modal/MrlModalContent/MrlModalContent.tsx"],"sourcesContent":["import * as React from 'react';\nimport classNames from 'classnames';\nimport { isElementScrollable } from '../../../utils/isElementScrollable';\n\nimport styles from './MrlModalContent.module.scss';\nimport { useMrlModalContext } from '../MrlModalContext';\nimport { hasScrollContent } from '../../../utils/hasScrollContent/hasScrollContent';\nimport { useHasFocusableDescendant } from '../../../hooks/useHasFocusableDescendant';\n\ninterface MrlModalContentProps {\n\t/**\n\t * Children to be rendered within the component.\n\t */\n\tchildren: React.ReactElement | React.ReactElement[];\n\n\t/**\n\t * Wrapper Class\n\t */\n\tclassName?: string;\n}\n\n/**\n * Modal Content component for the MrlModal\n * @param {object} props - The props object\n * @param {React.ReactElement} props.children - The children to be rendered within the component\n * @returns {React.ReactElement}} The rendered MrlModalContent component\n */\nexport const MrlModalContent = ({\n\tchildren,\n\tclassName,\n\t...rest\n}: MrlModalContentProps): JSX.Element => {\n\tconst { scrollableContent, setScrollableContent, title } = useMrlModalContext();\n\tconst contentAreaRef = React.useRef<HTMLDivElement>(null);\n\tconst hasFocusableDescendant = useHasFocusableDescendant(contentAreaRef);\n\n\tReact.useEffect(() => {\n\t\tif (!contentAreaRef.current) return;\n\n\t\t/**\n\t\t * Sets up observer to toggle tabindex value on the scrollable region within the modal. When\n\t\t * the content area is overflowed and has no focusable descendants, we want to set tabindex\n\t\t * to 0 so that keyboard-only users can scroll through the content. Per ACT rule 0ssw9k a\n\t\t * scrollable region passes WCAG 2.1.1 Keyboard either by being focusable itself or by having\n\t\t * a focusable descendant, so we omit `tabindex=\"0\"` whenever a descendant control is\n\t\t * already keyboard reachable. The labeled `role=\"region\"` is preserved whenever the modal\n\t\t * content overflows so screen-reader users get a landmark in either case.\n\t\t * https://www.w3.org/WAI/standards-guidelines/act/rules/0ssw9k/\n\t\t */\n\t\tconst contentArea = contentAreaRef.current;\n\n\t\tcontentArea.addEventListener('scroll', () => {\n\t\t\tsetScrollableContent({\n\t\t\t\t...hasScrollContent(contentArea),\n\t\t\t\tisContentScrollable: isElementScrollable(contentArea)\n\t\t\t});\n\t\t});\n\n\t\tconst observer = new ResizeObserver(() => {\n\t\t\tsetScrollableContent({\n\t\t\t\t...hasScrollContent(contentArea),\n\t\t\t\tisContentScrollable: isElementScrollable(contentArea)\n\t\t\t});\n\t\t});\n\n\t\tobserver.observe(contentArea);\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [setScrollableContent]);\n\n\tconst contentClasses = classNames('mrl-modal-content', className, styles['mrl-modal-content'], {\n\t\t'mrl-modal-content-scrollable': scrollableContent.isContentScrollable\n\t});\n\n\treturn (\n\t\t<div\n\t\t\t{...rest}\n\t\t\tref={contentAreaRef}\n\t\t\tclassName={contentClasses}\n\t\t\t{...(scrollableContent.isContentScrollable && {\n\t\t\t\t'aria-label': title ? `${title} modal scrollable content` : 'modal scrollable content',\n\t\t\t\trole: 'region',\n\t\t\t\t...(!hasFocusableDescendant && { tabIndex: 0 })\n\t\t\t})}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"],"names":["MrlModalContent","_ref","children","className","rest","_objectWithoutProperties","_excluded","_useMrlModalContext","useMrlModalContext","scrollableContent","setScrollableContent","title","contentAreaRef","React","useRef","hasFocusableDescendant","useHasFocusableDescendant","useEffect","current","contentArea","addEventListener","_objectSpread","hasScrollContent","isContentScrollable","isElementScrollable","observer","ResizeObserver","observe","disconnect","contentClasses","classNames","styles","createElement","_extends","ref","concat","role","tabIndex"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,eAAe,GAAGC,IAAA,IAIU;AAAA,EAAA,IAHxCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS;AACNC,IAAAA,IAAI,GAAAC,iDAAA,CAAAJ,IAAA,EAAAK,SAAA,CAAA;AAEP,EAAA,IAAAC,mBAAA,GAA2DC,kCAAkB,EAAE;IAAvEC,iBAAiB,GAAAF,mBAAA,CAAjBE,iBAAiB;IAAEC,oBAAoB,GAAAH,mBAAA,CAApBG,oBAAoB;IAAEC,KAAK,GAAAJ,mBAAA,CAALI,KAAK;AACtD,EAAA,IAAMC,cAAc,GAAGC,gBAAK,CAACC,MAAM,CAAiB,IAAI,CAAC;AACzD,EAAA,IAAMC,sBAAsB,GAAGC,+BAAyB,CAACJ,cAAc,CAAC;EAExEC,gBAAK,CAACI,SAAS,CAAC,MAAM;AACrB,IAAA,IAAI,CAACL,cAAc,CAACM,OAAO,EAAE;;AAE7B;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACE,IAAA,IAAMC,WAAW,GAAGP,cAAc,CAACM,OAAO;AAE1CC,IAAAA,WAAW,CAACC,gBAAgB,CAAC,QAAQ,EAAE,MAAM;MAC5CV,oBAAoB,CAAAW,uCAAA,CAAAA,uCAAA,KAChBC,iCAAgB,CAACH,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;QAChCI,mBAAmB,EAAEC,2BAAmB,CAACL,WAAW;AAAC,OAAA,CACrD,CAAC;AACH,IAAA,CAAC,CAAC;AAEF,IAAA,IAAMM,QAAQ,GAAG,IAAIC,cAAc,CAAC,MAAM;MACzChB,oBAAoB,CAAAW,uCAAA,CAAAA,uCAAA,KAChBC,iCAAgB,CAACH,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;QAChCI,mBAAmB,EAAEC,2BAAmB,CAACL,WAAW;AAAC,OAAA,CACrD,CAAC;AACH,IAAA,CAAC,CAAC;AAEFM,IAAAA,QAAQ,CAACE,OAAO,CAACR,WAAW,CAAC;AAE7B,IAAA,OAAO,MAAM;MACZM,QAAQ,CAACG,UAAU,EAAE;IACtB,CAAC;AACF,EAAA,CAAC,EAAE,CAAClB,oBAAoB,CAAC,CAAC;AAE1B,EAAA,IAAMmB,cAAc,GAAGC,2BAAU,CAAC,mBAAmB,EAAE3B,SAAS,EAAE4B,8BAAM,CAAC,mBAAmB,CAAC,EAAE;IAC9F,8BAA8B,EAAEtB,iBAAiB,CAACc;AACnD,GAAC,CAAC;AAEF,EAAA,oBACCV,gBAAA,CAAAmB,aAAA,CAAA,KAAA,EAAAC,iCAAA,KACK7B,IAAI,EAAA;AACR8B,IAAAA,GAAG,EAAEtB,cAAe;AACpBT,IAAAA,SAAS,EAAE0B;AAAe,GAAA,EACrBpB,iBAAiB,CAACc,mBAAmB,IAAAF,uCAAA,CAAA;AACzC,IAAA,YAAY,EAAEV,KAAK,GAAA,EAAA,CAAAwB,MAAA,CAAMxB,KAAK,iCAA8B,0BAA0B;AACtFyB,IAAAA,IAAI,EAAE;GAAQ,EACV,CAACrB,sBAAsB,IAAI;AAAEsB,IAAAA,QAAQ,EAAE;GAAG,CAC9C,CAAA,EAEAnC,QACG,CAAC;AAER;;;;"}

package/dist/cjs/components/modal/MrlModalContext/MrlModalContext.js

@@ -2,7 +2,8 @@
 
 var React = require('react');
 
-function _interopNamespaceDefault(e) {
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -19,7 +20,7 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 var MrlModalContext = /*#__PURE__*/React__namespace.createContext(undefined);
 
@@ -28,7 +29,7 @@ var MrlModalContext = /*#__PURE__*/React__namespace.createContext(undefined);
  *
  * @returns The MrlModalContext state.
  */
-var useMrlModalContext = function useMrlModalContext() {
+var useMrlModalContext = () => {
   var context = React__namespace.useContext(MrlModalContext);
   if (!context) {
     throw new Error('MrlModalContext must be used within a MrlModalContextProvider');

package/dist/cjs/components/modal/MrlModalContext/MrlModalContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlModalContext.js","sources":["../../../../../src/components/modal/MrlModalContext/MrlModalContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport type MrlModalScrollableContent = {\n\tisContentScrollable: boolean;\n\thasScrollTop: boolean;\n\thasScrollBottom: boolean;\n};\n\nexport type MrlModalContextState = {\n\tscrollableContent: MrlModalScrollableContent;\n\tsetScrollableContent: React.Dispatch<React.SetStateAction<MrlModalScrollableContent>>;\n\ttitle: string;\n\tsetTitle: React.Dispatch<React.SetStateAction<string>>;\n};\n\nexport const MrlModalContext = React.createContext<MrlModalContextState | undefined>(undefined);\n\n/**\n * Returns the MrlModalContext state.\n *\n * @returns The MrlModalContext state.\n */\nexport const useMrlModalContext = (): MrlModalContextState => {\n\tconst context = React.useContext(MrlModalContext);\n\tif (!context) {\n\t\tthrow new Error('MrlModalContext must be used within a MrlModalContextProvider');\n\t}\n\treturn context;\n};\n"],"names":["MrlModalContext","React","createContext","undefined","useMrlModalContext","context","useContext","Error"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAeO,IAAMA,eAAe,gBAAGC,gBAAK,CAACC,aAAa,CAAmCC,SAAS;;AAE9F;AACA;AACA;AACA;AACA;IACaC,kBAAkB,GAAG,SAArBA,kBAAkBA,GAA+B;AAC7D,EAAA,IAAMC,OAAO,GAAGJ,gBAAK,CAACK,UAAU,CAACN,eAAe,CAAC;EACjD,IAAI,CAACK,OAAO,EAAE;AACb,IAAA,MAAM,IAAIE,KAAK,CAAC,+DAA+D,CAAC;AACjF,EAAA;AACA,EAAA,OAAOF,OAAO;AACf;;;;;"}
+{"version":3,"file":"MrlModalContext.js","sources":["../../../../../src/components/modal/MrlModalContext/MrlModalContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport type MrlModalScrollableContent = {\n\tisContentScrollable: boolean;\n\thasScrollTop: boolean;\n\thasScrollBottom: boolean;\n};\n\nexport type MrlModalContextState = {\n\tscrollableContent: MrlModalScrollableContent;\n\tsetScrollableContent: React.Dispatch<React.SetStateAction<MrlModalScrollableContent>>;\n\ttitle: string;\n\tsetTitle: React.Dispatch<React.SetStateAction<string>>;\n};\n\nexport const MrlModalContext = React.createContext<MrlModalContextState | undefined>(undefined);\n\n/**\n * Returns the MrlModalContext state.\n *\n * @returns The MrlModalContext state.\n */\nexport const useMrlModalContext = (): MrlModalContextState => {\n\tconst context = React.useContext(MrlModalContext);\n\tif (!context) {\n\t\tthrow new Error('MrlModalContext must be used within a MrlModalContextProvider');\n\t}\n\treturn context;\n};\n"],"names":["MrlModalContext","React","createContext","undefined","useMrlModalContext","context","useContext","Error"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAeO,IAAMA,eAAe,gBAAGC,gBAAK,CAACC,aAAa,CAAmCC,SAAS;;AAE9F;AACA;AACA;AACA;AACA;AACO,IAAMC,kBAAkB,GAAGA,MAA4B;AAC7D,EAAA,IAAMC,OAAO,GAAGJ,gBAAK,CAACK,UAAU,CAACN,eAAe,CAAC;EACjD,IAAI,CAACK,OAAO,EAAE;AACb,IAAA,MAAM,IAAIE,KAAK,CAAC,+DAA+D,CAAC;AACjF,EAAA;AACA,EAAA,OAAOF,OAAO;AACf;;;;;"}

package/dist/cjs/components/modal/MrlModalFooter/MrlModalFooter.js

@@ -8,7 +8,10 @@ var index = require('../../../hooks/useBreakpoint/index.js');
 var MrlModalContext = require('../MrlModalContext/MrlModalContext.js');
 var setAttributes = require('../../../utils/setAttributes/setAttributes.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -25,7 +28,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["attrs", "children", "className"];
 /**
@@ -33,7 +37,7 @@ var _excluded = ["attrs", "children", "className"];
  * @param {AttrsObject} attrs - Additional HTML attributes for the `mrl-modal` element
  * @returns {React.ReactElement} The rendered MrlModalFooter component
  */
-var MrlModalFooter = function MrlModalFooter(_ref) {
+var MrlModalFooter = _ref => {
   var _ref$attrs = _ref.attrs,
     attrs = _ref$attrs === void 0 ? {} : _ref$attrs,
     children = _ref.children,
@@ -43,13 +47,16 @@ var MrlModalFooter = function MrlModalFooter(_ref) {
     scrollableContent = _useMrlModalContext.scrollableContent;
   var breakpoint = index.useBreakpoint();
   var attributes = setAttributes.setAttributes(attrs);
-  var modalFooterClasses = classnames(className, 'mrl-modal-footer', MrlModalFooter_module.default['mrl-modal-footer'], _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlModalFooter_module.default['slotted'], breakpoint === 'xs'), MrlModalFooter_module.default['mrl-modal-scroll-shadow-bottom'], scrollableContent.hasScrollBottom));
-  delete attributes["class"];
+  var modalFooterClasses = classnames__default.default(className, 'mrl-modal-footer', MrlModalFooter_module.default['mrl-modal-footer'], {
+    [MrlModalFooter_module.default['slotted']]: breakpoint === 'xs',
+    [MrlModalFooter_module.default['mrl-modal-scroll-shadow-bottom']]: scrollableContent.hasScrollBottom
+  });
+  delete attributes.class;
   delete attributes.className;
   return /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, attributes, {
     className: modalFooterClasses
   }), /*#__PURE__*/React__namespace.createElement("div", {
-    className: classnames('mrl-modal-footer-wrapper', MrlModalFooter_module.default['mrl-modal-footer-wrapper'])
+    className: classnames__default.default('mrl-modal-footer-wrapper', MrlModalFooter_module.default['mrl-modal-footer-wrapper'])
   }, children));
 };
 

package/dist/cjs/components/modal/MrlModalFooter/MrlModalFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlModalFooter.js","sources":["../../../../../src/components/modal/MrlModalFooter/MrlModalFooter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AttrsObject, MrlComponentProps, setAttributes } from '../../../utils';\nimport classNames from 'classnames';\n\nimport styles from './MrlModalFooter.module.scss';\nimport './MrlModalFooter.global.scss';\nimport { useBreakpoint } from '../../../hooks/useBreakpoint';\nimport { useMrlModalContext } from '../MrlModalContext';\n\ninterface MrlModalFooterProps extends MrlComponentProps {\n\t/**\n\t * Content of the modal footer\n\t */\n\tchildren?: React.ReactElement | React.ReactElement[];\n\n\t/**\n\t * Wrapper Class\n\t */\n\tclassName?: string;\n}\n\n/**\n * Modal Footer component for the MrlModal\n * @param {AttrsObject} attrs - Additional HTML attributes for the `mrl-modal` element\n * @returns {React.ReactElement} The rendered MrlModalFooter component\n */\nexport const MrlModalFooter = ({\n\tattrs = {},\n\tchildren,\n\tclassName,\n\t...rest\n}: MrlModalFooterProps): JSX.Element => {\n\tconst { scrollableContent } = useMrlModalContext();\n\tconst breakpoint = useBreakpoint();\n\tconst attributes = setAttributes(attrs);\n\tconst modalFooterClasses = classNames(className, 'mrl-modal-footer', styles['mrl-modal-footer'], {\n\t\t[styles['slotted']]: breakpoint === 'xs',\n\t\t[styles['mrl-modal-scroll-shadow-bottom']]: scrollableContent.hasScrollBottom\n\t});\n\n\tdelete attributes.class;\n\tdelete attributes.className;\n\n\treturn (\n\t\t<div {...rest} {...attributes} className={modalFooterClasses}>\n\t\t\t<div className={classNames('mrl-modal-footer-wrapper', styles['mrl-modal-footer-wrapper'])}>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"],"names":["MrlModalFooter","_ref","_ref$attrs","attrs","children","className","rest","_objectWithoutProperties","_excluded","_useMrlModalContext","useMrlModalContext","scrollableContent","breakpoint","useBreakpoint","attributes","setAttributes","modalFooterClasses","classNames","styles","_defineProperty","hasScrollBottom","React","createElement","_extends"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA;AACA;AACA;AACA;AACA;IACaA,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAKa;AAAA,EAAA,IAAAC,UAAA,GAAAD,IAAA,CAJvCE,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,UAAA;IACVE,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,SAAS,GAAAJ,IAAA,CAATI,SAAS;AACNC,IAAAA,IAAI,GAAAC,iDAAA,CAAAN,IAAA,EAAAO,SAAA,CAAA;AAEP,EAAA,IAAAC,mBAAA,GAA8BC,kCAAkB,EAAE;IAA1CC,iBAAiB,GAAAF,mBAAA,CAAjBE,iBAAiB;AACzB,EAAA,IAAMC,UAAU,GAAGC,mBAAa,EAAE;AAClC,EAAA,IAAMC,UAAU,GAAGC,2BAAa,CAACZ,KAAK,CAAC;AACvC,EAAA,IAAMa,kBAAkB,GAAGC,UAAU,CAACZ,SAAS,EAAE,kBAAkB,EAAEa,6BAAM,CAAC,kBAAkB,CAAC,EAAAC,wCAAA,CAAAA,wCAAA,CAAA,EAAA,EAC7FD,6BAAM,CAAC,SAAS,CAAC,EAAGN,UAAU,KAAK,IAAI,CAAA,EACvCM,6BAAM,CAAC,gCAAgC,CAAC,EAAGP,iBAAiB,CAACS,eAAe,CAC7E,CAAC;AAEF,EAAA,OAAON,UAAU,CAAA,OAAA,CAAM;EACvB,OAAOA,UAAU,CAACT,SAAS;EAE3B,oBACCgB,gBAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA,EAAA,EAASjB,IAAI,EAAMQ,UAAU,EAAA;AAAET,IAAAA,SAAS,EAAEW;GAAmB,CAAA,eAC5DK,gBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKjB,SAAS,EAAEY,UAAU,CAAC,0BAA0B,EAAEC,6BAAM,CAAC,0BAA0B,CAAC;GAAE,EACzFd,QACG,CACD,CAAC;AAER;;;;"}
+{"version":3,"file":"MrlModalFooter.js","sources":["../../../../../src/components/modal/MrlModalFooter/MrlModalFooter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AttrsObject, MrlComponentProps, setAttributes } from '../../../utils';\nimport classNames from 'classnames';\n\nimport styles from './MrlModalFooter.module.scss';\nimport './MrlModalFooter.global.scss';\nimport { useBreakpoint } from '../../../hooks/useBreakpoint';\nimport { useMrlModalContext } from '../MrlModalContext';\n\ninterface MrlModalFooterProps extends MrlComponentProps {\n\t/**\n\t * Content of the modal footer\n\t */\n\tchildren?: React.ReactElement | React.ReactElement[];\n\n\t/**\n\t * Wrapper Class\n\t */\n\tclassName?: string;\n}\n\n/**\n * Modal Footer component for the MrlModal\n * @param {AttrsObject} attrs - Additional HTML attributes for the `mrl-modal` element\n * @returns {React.ReactElement} The rendered MrlModalFooter component\n */\nexport const MrlModalFooter = ({\n\tattrs = {},\n\tchildren,\n\tclassName,\n\t...rest\n}: MrlModalFooterProps): JSX.Element => {\n\tconst { scrollableContent } = useMrlModalContext();\n\tconst breakpoint = useBreakpoint();\n\tconst attributes = setAttributes(attrs);\n\tconst modalFooterClasses = classNames(className, 'mrl-modal-footer', styles['mrl-modal-footer'], {\n\t\t[styles['slotted']]: breakpoint === 'xs',\n\t\t[styles['mrl-modal-scroll-shadow-bottom']]: scrollableContent.hasScrollBottom\n\t});\n\n\tdelete attributes.class;\n\tdelete attributes.className;\n\n\treturn (\n\t\t<div {...rest} {...attributes} className={modalFooterClasses}>\n\t\t\t<div className={classNames('mrl-modal-footer-wrapper', styles['mrl-modal-footer-wrapper'])}>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"],"names":["MrlModalFooter","_ref","_ref$attrs","attrs","children","className","rest","_objectWithoutProperties","_excluded","_useMrlModalContext","useMrlModalContext","scrollableContent","breakpoint","useBreakpoint","attributes","setAttributes","modalFooterClasses","classNames","styles","hasScrollBottom","class","React","createElement","_extends"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA;AACA;AACA;AACA;AACA;AACO,IAAMA,cAAc,GAAGC,IAAA,IAKU;AAAA,EAAA,IAAAC,UAAA,GAAAD,IAAA,CAJvCE,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,UAAA;IACVE,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,SAAS,GAAAJ,IAAA,CAATI,SAAS;AACNC,IAAAA,IAAI,GAAAC,iDAAA,CAAAN,IAAA,EAAAO,SAAA,CAAA;AAEP,EAAA,IAAAC,mBAAA,GAA8BC,kCAAkB,EAAE;IAA1CC,iBAAiB,GAAAF,mBAAA,CAAjBE,iBAAiB;AACzB,EAAA,IAAMC,UAAU,GAAGC,mBAAa,EAAE;AAClC,EAAA,IAAMC,UAAU,GAAGC,2BAAa,CAACZ,KAAK,CAAC;AACvC,EAAA,IAAMa,kBAAkB,GAAGC,2BAAU,CAACZ,SAAS,EAAE,kBAAkB,EAAEa,6BAAM,CAAC,kBAAkB,CAAC,EAAE;AAChG,IAAA,CAACA,6BAAM,CAAC,SAAS,CAAC,GAAGN,UAAU,KAAK,IAAI;AACxC,IAAA,CAACM,6BAAM,CAAC,gCAAgC,CAAC,GAAGP,iBAAiB,CAACQ;AAC/D,GAAC,CAAC;EAEF,OAAOL,UAAU,CAACM,KAAK;EACvB,OAAON,UAAU,CAACT,SAAS;EAE3B,oBACCgB,gBAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA,EAAA,EAASjB,IAAI,EAAMQ,UAAU,EAAA;AAAET,IAAAA,SAAS,EAAEW;GAAmB,CAAA,eAC5DK,gBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKjB,SAAS,EAAEY,2BAAU,CAAC,0BAA0B,EAAEC,6BAAM,CAAC,0BAA0B,CAAC;GAAE,EACzFd,QACG,CACD,CAAC;AAER;;;;"}

package/dist/cjs/components/modal/MrlModalHeader/MrlModalHeader.js

@@ -8,7 +8,10 @@ var MrlModalContext = require('../MrlModalContext/MrlModalContext.js');
 var setAttributes = require('../../../utils/setAttributes/setAttributes.js');
 var MrlTextHeading = require('../../text/MrlTextHeading/MrlTextHeading.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -25,7 +28,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["attrs", "children", "className", "text"];
 /**
@@ -34,7 +38,7 @@ var _excluded = ["attrs", "children", "className", "text"];
  * @param {AttrsObject} props.attrs - Additional HTML attributes for the `mrl-modal` element
  * @returns {React.ReactElement} The rendered MrlModalFooter component
  */
-var MrlModalHeader = function MrlModalHeader(_ref) {
+var MrlModalHeader = _ref => {
   var _ref$attrs = _ref.attrs,
     attrs = _ref$attrs === void 0 ? {} : _ref$attrs,
     children = _ref.children,
@@ -45,11 +49,13 @@ var MrlModalHeader = function MrlModalHeader(_ref) {
     scrollableContent = _useMrlModalContext.scrollableContent,
     setTitle = _useMrlModalContext.setTitle;
   var attributes = setAttributes.setAttributes(attrs);
-  var classes = classnames(className, 'mrl-modal-header', MrlModalHeader_module.default['mrl-modal-header'], _rollupPluginBabelHelpers.defineProperty({}, MrlModalHeader_module.default['mrl-modal-scroll-shadow-top'], scrollableContent.hasScrollTop));
-  React__namespace.useEffect(function () {
+  var classes = classnames__default.default(className, 'mrl-modal-header', MrlModalHeader_module.default['mrl-modal-header'], {
+    [MrlModalHeader_module.default['mrl-modal-scroll-shadow-top']]: scrollableContent.hasScrollTop
+  });
+  React__namespace.useEffect(() => {
     setTitle(text);
   }, [text, setTitle]);
-  delete attrs["class"];
+  delete attrs.class;
   delete attrs.className;
   return /*#__PURE__*/React__namespace.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, attributes, {
     className: classes

package/dist/cjs/components/modal/MrlModalHeader/MrlModalHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlModalHeader.js","sources":["../../../../../src/components/modal/MrlModalHeader/MrlModalHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AttrsObject, MrlComponentProps, setAttributes } from '../../../utils';\nimport classNames from 'classnames';\nimport { MrlTextHeading } from '../../';\n\nimport styles from './MrlModalHeader.module.scss';\nimport { useMrlModalContext } from '../MrlModalContext';\n\nexport interface MrlModalHeaderProps extends MrlComponentProps {\n\t/**\n\t * Content of the modal header\n\t */\n\tchildren?: React.ReactNode;\n\n\t/**\n\t * Wrapper Class\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Text the h1 element of modal header\n\t */\n\ttext: string;\n}\n\n/**\n * Modal Header component for the MrlModal.\n * @param {MrlModalHeaderProps} props - The props for the MrlModalFooter component\n * @param {AttrsObject} props.attrs - Additional HTML attributes for the `mrl-modal` element\n * @returns {React.ReactElement} The rendered MrlModalFooter component\n */\nexport const MrlModalHeader = ({\n\tattrs = {},\n\tchildren,\n\tclassName,\n\ttext,\n\t...rest\n}: MrlModalHeaderProps): JSX.Element => {\n\tconst { scrollableContent, setTitle } = useMrlModalContext();\n\tconst attributes = setAttributes(attrs);\n\tconst classes = classNames(className, 'mrl-modal-header', styles['mrl-modal-header'], {\n\t\t[styles['mrl-modal-scroll-shadow-top']]: scrollableContent.hasScrollTop\n\t});\n\n\tReact.useEffect(() => {\n\t\tsetTitle(text);\n\t}, [text, setTitle]);\n\n\tdelete attrs.class;\n\tdelete attrs.className;\n\treturn (\n\t\t<div {...rest} {...attributes} className={classes}>\n\t\t\t<MrlTextHeading\n\t\t\t\tattrs={{ className: 'mrl-modal-text-heading' }}\n\t\t\t\tlevel=\"2\"\n\t\t\t\ttext={text}\n\t\t\t\tsize=\"large\"\n\t\t\t/>\n\t\t\t{children}\n\t\t\t{/* Looking for the close button? The close button is intentionally part of the overall modal container, not the header */}\n\t\t</div>\n\t);\n};\n"],"names":["MrlModalHeader","_ref","_ref$attrs","attrs","children","className","text","rest","_objectWithoutProperties","_excluded","_useMrlModalContext","useMrlModalContext","scrollableContent","setTitle","attributes","setAttributes","classes","classNames","styles","_defineProperty","hasScrollTop","React","useEffect","createElement","_extends","MrlTextHeading","level","size"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA;AACA;AACA;AACA;AACA;AACA;IACaA,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAMa;AAAA,EAAA,IAAAC,UAAA,GAAAD,IAAA,CALvCE,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,UAAA;IACVE,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,SAAS,GAAAJ,IAAA,CAATI,SAAS;IACTC,IAAI,GAAAL,IAAA,CAAJK,IAAI;AACDC,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;AAEP,EAAA,IAAAC,mBAAA,GAAwCC,kCAAkB,EAAE;IAApDC,iBAAiB,GAAAF,mBAAA,CAAjBE,iBAAiB;IAAEC,QAAQ,GAAAH,mBAAA,CAARG,QAAQ;AACnC,EAAA,IAAMC,UAAU,GAAGC,2BAAa,CAACZ,KAAK,CAAC;EACvC,IAAMa,OAAO,GAAGC,UAAU,CAACZ,SAAS,EAAE,kBAAkB,EAAEa,6BAAM,CAAC,kBAAkB,CAAC,EAAAC,wCAAA,CAAA,EAAA,EAClFD,6BAAM,CAAC,6BAA6B,CAAC,EAAGN,iBAAiB,CAACQ,YAAY,CACvE,CAAC;EAEFC,gBAAK,CAACC,SAAS,CAAC,YAAM;IACrBT,QAAQ,CAACP,IAAI,CAAC;AACf,EAAA,CAAC,EAAE,CAACA,IAAI,EAAEO,QAAQ,CAAC,CAAC;AAEpB,EAAA,OAAOV,KAAK,CAAA,OAAA,CAAM;EAClB,OAAOA,KAAK,CAACE,SAAS;EACtB,oBACCgB,gBAAA,CAAAE,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA,EAAA,EAASjB,IAAI,EAAMO,UAAU,EAAA;AAAET,IAAAA,SAAS,EAAEW;AAAQ,GAAA,CAAA,eACjDK,gBAAA,CAAAE,aAAA,CAACE,6BAAc,EAAA;AACdtB,IAAAA,KAAK,EAAE;AAAEE,MAAAA,SAAS,EAAE;KAA2B;AAC/CqB,IAAAA,KAAK,EAAC,GAAG;AACTpB,IAAAA,IAAI,EAAEA,IAAK;AACXqB,IAAAA,IAAI,EAAC;GACL,CAAC,EACDvB,QAEG,CAAC;AAER;;;;"}
+{"version":3,"file":"MrlModalHeader.js","sources":["../../../../../src/components/modal/MrlModalHeader/MrlModalHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AttrsObject, MrlComponentProps, setAttributes } from '../../../utils';\nimport classNames from 'classnames';\nimport { MrlTextHeading } from '../../';\n\nimport styles from './MrlModalHeader.module.scss';\nimport { useMrlModalContext } from '../MrlModalContext';\n\nexport interface MrlModalHeaderProps extends MrlComponentProps {\n\t/**\n\t * Content of the modal header\n\t */\n\tchildren?: React.ReactNode;\n\n\t/**\n\t * Wrapper Class\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Text the h1 element of modal header\n\t */\n\ttext: string;\n}\n\n/**\n * Modal Header component for the MrlModal.\n * @param {MrlModalHeaderProps} props - The props for the MrlModalFooter component\n * @param {AttrsObject} props.attrs - Additional HTML attributes for the `mrl-modal` element\n * @returns {React.ReactElement} The rendered MrlModalFooter component\n */\nexport const MrlModalHeader = ({\n\tattrs = {},\n\tchildren,\n\tclassName,\n\ttext,\n\t...rest\n}: MrlModalHeaderProps): JSX.Element => {\n\tconst { scrollableContent, setTitle } = useMrlModalContext();\n\tconst attributes = setAttributes(attrs);\n\tconst classes = classNames(className, 'mrl-modal-header', styles['mrl-modal-header'], {\n\t\t[styles['mrl-modal-scroll-shadow-top']]: scrollableContent.hasScrollTop\n\t});\n\n\tReact.useEffect(() => {\n\t\tsetTitle(text);\n\t}, [text, setTitle]);\n\n\tdelete attrs.class;\n\tdelete attrs.className;\n\treturn (\n\t\t<div {...rest} {...attributes} className={classes}>\n\t\t\t<MrlTextHeading\n\t\t\t\tattrs={{ className: 'mrl-modal-text-heading' }}\n\t\t\t\tlevel=\"2\"\n\t\t\t\ttext={text}\n\t\t\t\tsize=\"large\"\n\t\t\t/>\n\t\t\t{children}\n\t\t\t{/* Looking for the close button? The close button is intentionally part of the overall modal container, not the header */}\n\t\t</div>\n\t);\n};\n"],"names":["MrlModalHeader","_ref","_ref$attrs","attrs","children","className","text","rest","_objectWithoutProperties","_excluded","_useMrlModalContext","useMrlModalContext","scrollableContent","setTitle","attributes","setAttributes","classes","classNames","styles","hasScrollTop","React","useEffect","class","createElement","_extends","MrlTextHeading","level","size"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,cAAc,GAAGC,IAAA,IAMU;AAAA,EAAA,IAAAC,UAAA,GAAAD,IAAA,CALvCE,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,UAAA;IACVE,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,SAAS,GAAAJ,IAAA,CAATI,SAAS;IACTC,IAAI,GAAAL,IAAA,CAAJK,IAAI;AACDC,IAAAA,IAAI,GAAAC,iDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;AAEP,EAAA,IAAAC,mBAAA,GAAwCC,kCAAkB,EAAE;IAApDC,iBAAiB,GAAAF,mBAAA,CAAjBE,iBAAiB;IAAEC,QAAQ,GAAAH,mBAAA,CAARG,QAAQ;AACnC,EAAA,IAAMC,UAAU,GAAGC,2BAAa,CAACZ,KAAK,CAAC;AACvC,EAAA,IAAMa,OAAO,GAAGC,2BAAU,CAACZ,SAAS,EAAE,kBAAkB,EAAEa,6BAAM,CAAC,kBAAkB,CAAC,EAAE;AACrF,IAAA,CAACA,6BAAM,CAAC,6BAA6B,CAAC,GAAGN,iBAAiB,CAACO;AAC5D,GAAC,CAAC;EAEFC,gBAAK,CAACC,SAAS,CAAC,MAAM;IACrBR,QAAQ,CAACP,IAAI,CAAC;AACf,EAAA,CAAC,EAAE,CAACA,IAAI,EAAEO,QAAQ,CAAC,CAAC;EAEpB,OAAOV,KAAK,CAACmB,KAAK;EAClB,OAAOnB,KAAK,CAACE,SAAS;EACtB,oBACCe,gBAAA,CAAAG,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA,EAAA,EAASjB,IAAI,EAAMO,UAAU,EAAA;AAAET,IAAAA,SAAS,EAAEW;AAAQ,GAAA,CAAA,eACjDI,gBAAA,CAAAG,aAAA,CAACE,6BAAc,EAAA;AACdtB,IAAAA,KAAK,EAAE;AAAEE,MAAAA,SAAS,EAAE;KAA2B;AAC/CqB,IAAAA,KAAK,EAAC,GAAG;AACTpB,IAAAA,IAAI,EAAEA,IAAK;AACXqB,IAAAA,IAAI,EAAC;GACL,CAAC,EACDvB,QAEG,CAAC;AAER;;;;"}

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavGroup/MrlSidebarNavGroup.js

@@ -7,7 +7,10 @@ var MrlSidebarNavGroup_module = require('./MrlSidebarNavGroup.module.scss.js');
 var setAttributes = require('../../../utils/setAttributes/setAttributes.js');
 var MrlTextHeading = require('../../text/MrlTextHeading/MrlTextHeading.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -24,7 +27,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["className", "children", "level", "headingText", "style", "hiddenHeading"];
 /**
@@ -42,7 +46,7 @@ function MrlSidebarNavGroup(_ref) {
     style = _ref.style,
     hiddenHeading = _ref.hiddenHeading,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var allClasses = classnames(MrlSidebarNavGroup_module.default['MrlSidebarNavGroup'], className);
+  var allClasses = classnames__default.default(MrlSidebarNavGroup_module.default['MrlSidebarNavGroup'], className);
   var headingIdRef = React__namespace.useRef(setAttributes.getUniqueId('mrl-sidebar-nav-group-heading'));
   var navLabelProps = hiddenHeading ? {
     'aria-label': headingText

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavGroup/MrlSidebarNavGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlSidebarNavGroup.js","sources":["../../../../../src/components/navigation-sidebar/MrlSidebarNavGroup/MrlSidebarNavGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlTextHeading } from '../../';\nimport { LevelType } from '../../text/constants';\nimport { getUniqueId } from '../../../utils';\n\nimport styles from './MrlSidebarNavGroup.module.scss';\n\ninterface MrlSidebarNavGroupProps extends React.ComponentPropsWithoutRef<'nav'> {\n\t/** Additional class to add to the nav element */\n\tclassName?: string;\n\t/** A list of navigation items */\n\tchildren: React.ReactNode;\n\t/** Set the semantic level of the heading, only applies when headingText is defined */\n\tlevel?: Exclude<LevelType, '1'>;\n\t/**\n\t *  Sets the heading's text.\n\t *  If no visual heading is required add the hiddenHeading prop\n\t */\n\theadingText: string;\n\t/** Prevents rendering the heading and uses aria-label to label the nav element */\n\thiddenHeading?: boolean;\n}\n\n/**\n * Sidebar group component\n *\n * @param {MrlSidebarNavGroupProps} props - the component props\n * @returns a sidebar nav group\n */\nexport function MrlSidebarNavGroup({\n\tclassName,\n\tchildren,\n\tlevel = '3',\n\theadingText,\n\tstyle,\n\thiddenHeading,\n\t...rest\n}: MrlSidebarNavGroupProps): JSX.Element {\n\tconst allClasses = classnames(styles['MrlSidebarNavGroup'], className);\n\tconst headingIdRef = React.useRef(getUniqueId('mrl-sidebar-nav-group-heading'));\n\n\tconst navLabelProps = hiddenHeading\n\t\t? { 'aria-label': headingText }\n\t\t: { 'aria-labelledby': headingIdRef.current };\n\n\treturn (\n\t\t<nav className={allClasses} style={style} {...navLabelProps}\n\t\t\t{...rest}>\n\t\t\t{headingText && !hiddenHeading && (\n\t\t\t\t<MrlTextHeading\n\t\t\t\t\tattrs={{\n\t\t\t\t\t\tclassName: styles['MrlSidebarNavGroup-heading'],\n\t\t\t\t\t\tid: headingIdRef.current\n\t\t\t\t\t}}\n\t\t\t\t\tlevel={level}\n\t\t\t\t\ttext={headingText}\n\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\thierarchy=\"secondary\"\n\t\t\t\t\tkind=\"title\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<ul>{children}</ul>\n\t\t</nav>\n\t);\n}\n"],"names":["MrlSidebarNavGroup","_ref","className","children","_ref$level","level","headingText","style","hiddenHeading","rest","_objectWithoutProperties","_excluded","allClasses","classnames","styles","headingIdRef","React","useRef","getUniqueId","navLabelProps","current","createElement","_extends","MrlTextHeading","attrs","id","text","size","hierarchy","kind"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,kBAAkBA,CAAAC,IAAA,EAQO;AAAA,EAAA,IAPxCC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAAC,UAAA,GAAAH,IAAA,CACRI,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,GAAG,GAAAA,UAAA;IACXE,WAAW,GAAAL,IAAA,CAAXK,WAAW;IACXC,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,aAAa,GAAAP,IAAA,CAAbO,aAAa;AACVC,IAAAA,IAAI,GAAAC,iDAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA;EAEP,IAAMC,UAAU,GAAGC,UAAU,CAACC,iCAAM,CAAC,oBAAoB,CAAC,EAAEZ,SAAS,CAAC;EACtE,IAAMa,YAAY,GAAGC,gBAAK,CAACC,MAAM,CAACC,yBAAW,CAAC,+BAA+B,CAAC,CAAC;EAE/E,IAAMC,aAAa,GAAGX,aAAa,GAChC;AAAE,IAAA,YAAY,EAAEF;AAAY,GAAC,GAC7B;IAAE,iBAAiB,EAAES,YAAY,CAACK;GAAS;AAE9C,EAAA,oBACCJ,gBAAA,CAAAK,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA;AAAKpB,IAAAA,SAAS,EAAEU,UAAW;AAACL,IAAAA,KAAK,EAAEA;AAAM,GAAA,EAAKY,aAAa,EACtDV,IAAI,CAAA,EACPH,WAAW,IAAI,CAACE,aAAa,iBAC7BQ,gBAAA,CAAAK,aAAA,CAACE,6BAAc,EAAA;AACdC,IAAAA,KAAK,EAAE;AACNtB,MAAAA,SAAS,EAAEY,iCAAM,CAAC,4BAA4B,CAAC;MAC/CW,EAAE,EAAEV,YAAY,CAACK;KAChB;AACFf,IAAAA,KAAK,EAAEA,KAAM;AACbqB,IAAAA,IAAI,EAAEpB,WAAY;AAClBqB,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,SAAS,EAAC,WAAW;AACrBC,IAAAA,IAAI,EAAC;GACL,CACD,eACDb,gBAAA,CAAAK,aAAA,CAAA,IAAA,EAAA,IAAA,EAAKlB,QAAa,CACd,CAAC;AAER;;;;"}
+{"version":3,"file":"MrlSidebarNavGroup.js","sources":["../../../../../src/components/navigation-sidebar/MrlSidebarNavGroup/MrlSidebarNavGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlTextHeading } from '../../';\nimport { LevelType } from '../../text/constants';\nimport { getUniqueId } from '../../../utils';\n\nimport styles from './MrlSidebarNavGroup.module.scss';\n\ninterface MrlSidebarNavGroupProps extends React.ComponentPropsWithoutRef<'nav'> {\n\t/** Additional class to add to the nav element */\n\tclassName?: string;\n\t/** A list of navigation items */\n\tchildren: React.ReactNode;\n\t/** Set the semantic level of the heading, only applies when headingText is defined */\n\tlevel?: Exclude<LevelType, '1'>;\n\t/**\n\t *  Sets the heading's text.\n\t *  If no visual heading is required add the hiddenHeading prop\n\t */\n\theadingText: string;\n\t/** Prevents rendering the heading and uses aria-label to label the nav element */\n\thiddenHeading?: boolean;\n}\n\n/**\n * Sidebar group component\n *\n * @param {MrlSidebarNavGroupProps} props - the component props\n * @returns a sidebar nav group\n */\nexport function MrlSidebarNavGroup({\n\tclassName,\n\tchildren,\n\tlevel = '3',\n\theadingText,\n\tstyle,\n\thiddenHeading,\n\t...rest\n}: MrlSidebarNavGroupProps): JSX.Element {\n\tconst allClasses = classnames(styles['MrlSidebarNavGroup'], className);\n\tconst headingIdRef = React.useRef(getUniqueId('mrl-sidebar-nav-group-heading'));\n\n\tconst navLabelProps = hiddenHeading\n\t\t? { 'aria-label': headingText }\n\t\t: { 'aria-labelledby': headingIdRef.current };\n\n\treturn (\n\t\t<nav className={allClasses} style={style} {...navLabelProps}\n\t\t\t{...rest}>\n\t\t\t{headingText && !hiddenHeading && (\n\t\t\t\t<MrlTextHeading\n\t\t\t\t\tattrs={{\n\t\t\t\t\t\tclassName: styles['MrlSidebarNavGroup-heading'],\n\t\t\t\t\t\tid: headingIdRef.current\n\t\t\t\t\t}}\n\t\t\t\t\tlevel={level}\n\t\t\t\t\ttext={headingText}\n\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\thierarchy=\"secondary\"\n\t\t\t\t\tkind=\"title\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<ul>{children}</ul>\n\t\t</nav>\n\t);\n}\n"],"names":["MrlSidebarNavGroup","_ref","className","children","_ref$level","level","headingText","style","hiddenHeading","rest","_objectWithoutProperties","_excluded","allClasses","classnames","styles","headingIdRef","React","useRef","getUniqueId","navLabelProps","current","createElement","_extends","MrlTextHeading","attrs","id","text","size","hierarchy","kind"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,kBAAkBA,CAAAC,IAAA,EAQO;AAAA,EAAA,IAPxCC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAAC,UAAA,GAAAH,IAAA,CACRI,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,GAAG,GAAAA,UAAA;IACXE,WAAW,GAAAL,IAAA,CAAXK,WAAW;IACXC,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,aAAa,GAAAP,IAAA,CAAbO,aAAa;AACVC,IAAAA,IAAI,GAAAC,iDAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA;EAEP,IAAMC,UAAU,GAAGC,2BAAU,CAACC,iCAAM,CAAC,oBAAoB,CAAC,EAAEZ,SAAS,CAAC;EACtE,IAAMa,YAAY,GAAGC,gBAAK,CAACC,MAAM,CAACC,yBAAW,CAAC,+BAA+B,CAAC,CAAC;EAE/E,IAAMC,aAAa,GAAGX,aAAa,GAChC;AAAE,IAAA,YAAY,EAAEF;AAAY,GAAC,GAC7B;IAAE,iBAAiB,EAAES,YAAY,CAACK;GAAS;AAE9C,EAAA,oBACCJ,gBAAA,CAAAK,aAAA,CAAA,KAAA,EAAAC,iCAAA,CAAA;AAAKpB,IAAAA,SAAS,EAAEU,UAAW;AAACL,IAAAA,KAAK,EAAEA;AAAM,GAAA,EAAKY,aAAa,EACtDV,IAAI,CAAA,EACPH,WAAW,IAAI,CAACE,aAAa,iBAC7BQ,gBAAA,CAAAK,aAAA,CAACE,6BAAc,EAAA;AACdC,IAAAA,KAAK,EAAE;AACNtB,MAAAA,SAAS,EAAEY,iCAAM,CAAC,4BAA4B,CAAC;MAC/CW,EAAE,EAAEV,YAAY,CAACK;KAChB;AACFf,IAAAA,KAAK,EAAEA,KAAM;AACbqB,IAAAA,IAAI,EAAEpB,WAAY;AAClBqB,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,SAAS,EAAC,WAAW;AACrBC,IAAAA,IAAI,EAAC;GACL,CACD,eACDb,gBAAA,CAAAK,aAAA,CAAA,IAAA,EAAA,IAAA,EAAKlB,QAAa,CACd,CAAC;AAER;;;;"}

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.js

@@ -6,7 +6,10 @@ var classnames = require('classnames');
 var MrlSidebarNavItem_module = require('./MrlSidebarNavItem.module.scss.js');
 var MrlSvg = require('../../svg/MrlSvg/MrlSvg.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -23,7 +26,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["className", "data-qa", "icon", "isSelected", "text", "renderLink"];
 /**
@@ -39,7 +43,11 @@ function MrlSidebarNavItem(_ref) {
     text = _ref.text,
     renderLink = _ref.renderLink,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var allClasses = classnames('MrlSidebarNavItem', MrlSidebarNavItem_module.default['MrlSidebarNavItem'], _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, MrlSidebarNavItem_module.default['MrlSidebarNavItem-selected'], isSelected), 'MrlSidebarNavItem-selected', isSelected), MrlSidebarNavItem_module.default['hasIcon'], typeof icon !== 'undefined'), className);
+  var allClasses = classnames__default.default('MrlSidebarNavItem', MrlSidebarNavItem_module.default['MrlSidebarNavItem'], {
+    [MrlSidebarNavItem_module.default['MrlSidebarNavItem-selected']]: isSelected,
+    'MrlSidebarNavItem-selected': isSelected,
+    [MrlSidebarNavItem_module.default['hasIcon']]: typeof icon !== 'undefined'
+  }, className);
   return /*#__PURE__*/React__namespace.createElement("li", _rollupPluginBabelHelpers.extends({}, rest, {
     "data-qa": qa,
     className: allClasses

package/dist/cjs/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlSidebarNavItem.js","sources":["../../../../../src/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { DSIconType, MrlSvg } from '../../';\n\nimport styles from './MrlSidebarNavItem.module.scss';\n\ninterface MrlSidebarNavItemProps {\n\t/** Additional class to add to the li element */\n\tclassName?: string;\n\t/** A string value used for data-qa attribute. */\n\t['data-qa']?: string;\n\t/** Leading icon of the sidebar nav item */\n\ticon?: DSIconType;\n\t/** Sets the selected state for the sidebar nav item */\n\tisSelected?: boolean;\n\t/**\n\t * Render function used to wrap the sidebar nav item with a link component.\n\t * It allows users to wrap the sidebar nav item with different link implementations, react-router's link for example.\n\t * @example\n\t * <MrlSidebarNavItem renderLink={({linkContent}) => <Link to=\"/\">{linkContent}</Link>}/>\n\t * <MrlSidebarNavItem renderLink={({linkContent}) => <a href=\"/\">{linkContent}</a>}/>\n\t */\n\trenderLink: ({ linkContent }: { linkContent: React.ReactNode }) => JSX.Element;\n\t/** The text of the sidebar item */\n\ttext?: React.ReactNode;\n}\n\n/**\n * Sidebar nav item component\n * @param {MrlSidebarNavItemProps} props - the component props\n * @returns a sidebar nav item\n */\nexport function MrlSidebarNavItem({\n\tclassName,\n\t['data-qa']: qa,\n\ticon,\n\tisSelected,\n\ttext,\n\trenderLink,\n\t...rest\n}: MrlSidebarNavItemProps): JSX.Element {\n\tconst allClasses = classnames(\n\t\t'MrlSidebarNavItem',\n\t\tstyles['MrlSidebarNavItem'],\n\t\t{\n\t\t\t[styles['MrlSidebarNavItem-selected']]: isSelected,\n\t\t\t'MrlSidebarNavItem-selected': isSelected,\n\t\t\t[styles['hasIcon']]: typeof icon !== 'undefined'\n\t\t},\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<li {...rest} data-qa={qa} className={allClasses}>\n\t\t\t{renderLink({\n\t\t\t\tlinkContent: (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{icon && (\n\t\t\t\t\t\t\t<MrlSvg\n\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\tsvg={icon}\n\t\t\t\t\t\t\t\tclassName={styles['MrlSidebarNavItem-icon']}\n\t\t\t\t\t\t\t\tsize=\"auto\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{text}\n\t\t\t\t\t</>\n\t\t\t\t)\n\t\t\t})}\n\t\t</li>\n\t);\n}\n"],"names":["MrlSidebarNavItem","_ref","className","qa","icon","isSelected","text","renderLink","rest","_objectWithoutProperties","_excluded","allClasses","classnames","styles","_defineProperty","React","createElement","_extends","linkContent","Fragment","MrlSvg","svg","size"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA;AACA;AACA;AACA;AACA;AACO,SAASA,iBAAiBA,CAAAC,IAAA,EAQO;AAAA,EAAA,IAPvCC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACIC,EAAE,GAAAF,IAAA,CAAd,SAAS,CAAA;IACVG,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,UAAU,GAAAJ,IAAA,CAAVI,UAAU;IACVC,IAAI,GAAAL,IAAA,CAAJK,IAAI;IACJC,UAAU,GAAAN,IAAA,CAAVM,UAAU;AACPC,IAAAA,IAAI,GAAAC,iDAAA,CAAAR,IAAA,EAAAS,SAAA,CAAA;AAEP,EAAA,IAAMC,UAAU,GAAGC,UAAU,CAC5B,mBAAmB,EACnBC,gCAAM,CAAC,mBAAmB,CAAC,EAAAC,wCAAA,CAAAA,wCAAA,CAAAA,wCAAA,KAEzBD,gCAAM,CAAC,4BAA4B,CAAC,EAAGR,UAAU,CAAA,EAClD,4BAA4B,EAAEA,UAAU,GACvCQ,gCAAM,CAAC,SAAS,CAAC,EAAG,OAAOT,IAAI,KAAK,WAAW,CAAA,EAEjDF,SACD,CAAC;AAED,EAAA,oBACCa,gBAAA,CAAAC,aAAA,CAAA,IAAA,EAAAC,iCAAA,KAAQT,IAAI,EAAA;AAAE,IAAA,SAAA,EAASL,EAAG;AAACD,IAAAA,SAAS,EAAES;AAAW,GAAA,CAAA,EAC/CJ,UAAU,CAAC;AACXW,IAAAA,WAAW,eACVH,gBAAA,CAAAC,aAAA,CAAAD,gBAAA,CAAAI,QAAA,EAAA,IAAA,EACEf,IAAI,iBACJW,gBAAA,CAAAC,aAAA,CAACI,aAAM,EAAA;AACN,MAAA,aAAA,EAAY,MAAM;AAClBC,MAAAA,GAAG,EAAEjB,IAAK;AACVF,MAAAA,SAAS,EAAEW,gCAAM,CAAC,wBAAwB,CAAE;AAC5CS,MAAAA,IAAI,EAAC;KACL,CACD,EACAhB,IACA;AAEJ,GAAC,CACE,CAAC;AAEP;;;;"}
+{"version":3,"file":"MrlSidebarNavItem.js","sources":["../../../../../src/components/navigation-sidebar/MrlSidebarNavItem/MrlSidebarNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { DSIconType, MrlSvg } from '../../';\n\nimport styles from './MrlSidebarNavItem.module.scss';\n\ninterface MrlSidebarNavItemProps {\n\t/** Additional class to add to the li element */\n\tclassName?: string;\n\t/** A string value used for data-qa attribute. */\n\t['data-qa']?: string;\n\t/** Leading icon of the sidebar nav item */\n\ticon?: DSIconType;\n\t/** Sets the selected state for the sidebar nav item */\n\tisSelected?: boolean;\n\t/**\n\t * Render function used to wrap the sidebar nav item with a link component.\n\t * It allows users to wrap the sidebar nav item with different link implementations, react-router's link for example.\n\t * @example\n\t * <MrlSidebarNavItem renderLink={({linkContent}) => <Link to=\"/\">{linkContent}</Link>}/>\n\t * <MrlSidebarNavItem renderLink={({linkContent}) => <a href=\"/\">{linkContent}</a>}/>\n\t */\n\trenderLink: ({ linkContent }: { linkContent: React.ReactNode }) => JSX.Element;\n\t/** The text of the sidebar item */\n\ttext?: React.ReactNode;\n}\n\n/**\n * Sidebar nav item component\n * @param {MrlSidebarNavItemProps} props - the component props\n * @returns a sidebar nav item\n */\nexport function MrlSidebarNavItem({\n\tclassName,\n\t['data-qa']: qa,\n\ticon,\n\tisSelected,\n\ttext,\n\trenderLink,\n\t...rest\n}: MrlSidebarNavItemProps): JSX.Element {\n\tconst allClasses = classnames(\n\t\t'MrlSidebarNavItem',\n\t\tstyles['MrlSidebarNavItem'],\n\t\t{\n\t\t\t[styles['MrlSidebarNavItem-selected']]: isSelected,\n\t\t\t'MrlSidebarNavItem-selected': isSelected,\n\t\t\t[styles['hasIcon']]: typeof icon !== 'undefined'\n\t\t},\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<li {...rest} data-qa={qa} className={allClasses}>\n\t\t\t{renderLink({\n\t\t\t\tlinkContent: (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{icon && (\n\t\t\t\t\t\t\t<MrlSvg\n\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\tsvg={icon}\n\t\t\t\t\t\t\t\tclassName={styles['MrlSidebarNavItem-icon']}\n\t\t\t\t\t\t\t\tsize=\"auto\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{text}\n\t\t\t\t\t</>\n\t\t\t\t)\n\t\t\t})}\n\t\t</li>\n\t);\n}\n"],"names":["MrlSidebarNavItem","_ref","className","qa","icon","isSelected","text","renderLink","rest","_objectWithoutProperties","_excluded","allClasses","classnames","styles","React","createElement","_extends","linkContent","Fragment","MrlSvg","svg","size"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA;AACA;AACA;AACA;AACA;AACO,SAASA,iBAAiBA,CAAAC,IAAA,EAQO;AAAA,EAAA,IAPvCC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACIC,EAAE,GAAAF,IAAA,CAAd,SAAS,CAAA;IACVG,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,UAAU,GAAAJ,IAAA,CAAVI,UAAU;IACVC,IAAI,GAAAL,IAAA,CAAJK,IAAI;IACJC,UAAU,GAAAN,IAAA,CAAVM,UAAU;AACPC,IAAAA,IAAI,GAAAC,iDAAA,CAAAR,IAAA,EAAAS,SAAA,CAAA;EAEP,IAAMC,UAAU,GAAGC,2BAAU,CAC5B,mBAAmB,EACnBC,gCAAM,CAAC,mBAAmB,CAAC,EAC3B;AACC,IAAA,CAACA,gCAAM,CAAC,4BAA4B,CAAC,GAAGR,UAAU;AAClD,IAAA,4BAA4B,EAAEA,UAAU;AACxC,IAAA,CAACQ,gCAAM,CAAC,SAAS,CAAC,GAAG,OAAOT,IAAI,KAAK;GACrC,EACDF,SACD,CAAC;AAED,EAAA,oBACCY,gBAAA,CAAAC,aAAA,CAAA,IAAA,EAAAC,iCAAA,KAAQR,IAAI,EAAA;AAAE,IAAA,SAAA,EAASL,EAAG;AAACD,IAAAA,SAAS,EAAES;AAAW,GAAA,CAAA,EAC/CJ,UAAU,CAAC;AACXU,IAAAA,WAAW,eACVH,gBAAA,CAAAC,aAAA,CAAAD,gBAAA,CAAAI,QAAA,EAAA,IAAA,EACEd,IAAI,iBACJU,gBAAA,CAAAC,aAAA,CAACI,aAAM,EAAA;AACN,MAAA,aAAA,EAAY,MAAM;AAClBC,MAAAA,GAAG,EAAEhB,IAAK;AACVF,MAAAA,SAAS,EAAEW,gCAAM,CAAC,wBAAwB,CAAE;AAC5CQ,MAAAA,IAAI,EAAC;KACL,CACD,EACAf,IACA;AAEJ,GAAC,CACE,CAAC;AAEP;;;;"}