@laerdal/life-react-components 1.7.0-dev.4 → 1.7.0-dev.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -194,11 +194,10 @@ var ModalContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
194
194
|
this.setState({
|
|
195
195
|
scroll: offset
|
|
196
196
|
});
|
|
197
|
-
var scrollWidth = window.innerWidth - document.documentElement.offsetWidth;
|
|
198
197
|
document.body.style.position = 'fixed';
|
|
199
198
|
document.body.style.left = "0px";
|
|
199
|
+
document.body.style.right = "0px";
|
|
200
200
|
document.body.style.top = "-".concat(offset, "px");
|
|
201
|
-
document.body.style.right = "".concat(scrollWidth, "px");
|
|
202
201
|
}
|
|
203
202
|
|
|
204
203
|
ModalContainer.openInstances++;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOWS","BOXSHADOW_L3","modalTransitions","Z_INDEXES","backdrop","modal","ModalContainer","modalHeight","modalWidth","modalOverflow","ReactModal","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","sizes","GetSize","GetOverflow","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","scrollWidth","innerWidth","documentElement","offsetWidth","body","position","state","scrollTo","React","Component"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;;;;;;;AAGA,IAAMA,oBAAoB,GAAG;AAC3BC,EAAAA,OAAO,EAAE;AACPC,IAAAA,GAAG,EAAE,KADE;AAEPC,IAAAA,IAAI,EAAE,KAFC;AAGPC,IAAAA,KAAK,EAAE,MAHA;AAIPC,IAAAA,MAAM,EAAE,MAJD;AAKPC,IAAAA,WAAW,EAAE,MALN;AAMPC,IAAAA,KAAK,EAAE,OANA;AAOPC,IAAAA,MAAM,EAAE,OAPD;AAQPC,IAAAA,YAAY,EAAE,KARP;AASPC,IAAAA,SAAS,EAAE,YATJ;AAUPC,IAAAA,MAAM,EAAE,CAVD;AAWPC,IAAAA,QAAQ,EAAE,MAXH;AAYPC,IAAAA,SAAS,EAAEC,mBAAWC;AAZf;AADkB,CAA7B,C,CAiBA;;AACA,IAAMC,gBAAgB,iEAGTC,kBAAUC,QAHD,+KAYTD,kBAAUE,KAZD,okBAAtB;;IAsDMC,c;;;;;;;;;;;;;;;0FAyCM;AAAA,UAACC,WAAD,uEAAuB,MAAvB;AAAA,UAA+BC,UAA/B,uEAAoD,MAApD;AAAA,aAAgE;AAACd,QAAAA,MAAM,EAAEa,WAAT;AAAsBd,QAAAA,KAAK,EAAEe;AAA7B,OAAhE;AAAA,K;8FACI;AAAA,UAACC,aAAD,uEAAyB,SAAzB;AAAA,aAAuCA,aAAvC;AAAA,K;;;;;;WAvCd,6BAAoB;AAClB,UAAIC,oBAAWC,aAAX,CAAyBC,OAA7B,EAAsC;AACpCF,4BAAWC,aAAX,CAAyBC,OAAzB,CAAiCC,eAAjC,GAAmD,iBAAnD;AACD,OAHiB,CAKlB;;;AACA,UAAI,CAACC,QAAQ,CAACC,aAAT,CAAuB,iCAAvB,CAAL,EAAgE;AAC9D,YAAMC,IAAI,GAAGF,QAAQ,CAACE,IAAT,IAAiBF,QAAQ,CAACG,oBAAT,CAA8B,MAA9B,EAAsC,CAAtC,CAA9B;AACA,YAAMC,KAAK,GAAGJ,QAAQ,CAACK,aAAT,CAAuB,OAAvB,CAAd;AACAD,QAAAA,KAAK,CAACE,YAAN,CAAmB,sBAAnB,EAA2C,QAA3C;AACAJ,QAAAA,IAAI,CAACK,WAAL,CAAiBH,KAAjB;AACAA,QAAAA,KAAK,CAACG,WAAN,CAAkBP,QAAQ,CAACQ,cAAT,CAAwBpB,gBAAxB,CAAlB;AACD;;AAED,UAAI,KAAKqB,KAAL,CAAWC,SAAf,EAA0B;AACxB,aAAKC,aAAL,CAAmBC,MAAM,CAACC,OAA1B;AACD;AACF;;;WAED,iCAAwBC,SAAxB,EAAkEC,SAAlE,EAAgI;AAC9H,aAAO;AAACC,QAAAA,MAAM,EAAEJ,MAAM,CAACC;AAAhB,OAAP;AACD;;;WAED,4BAAmBC,SAAnB,EAA6DC,SAA7D,EAAuGE,QAAvG,EAAsI;AACpI,UAAI,KAAKR,KAAL,CAAWC,SAAX,IAAwB,CAACI,SAAS,CAACJ,SAAvC,EAAkD;AAChD,aAAKC,aAAL,CAAmBM,QAAQ,CAAED,MAA7B;AACD;;AACD,UAAI,CAAC,KAAKP,KAAL,CAAWC,SAAZ,IAAyBI,SAAS,CAACJ,SAAvC,EAAkD;AAChD,aAAKQ,WAAL;AACD;AACF;;;WAED,gCAAuB;AACrB,UAAI,KAAKT,KAAL,CAAWC,SAAf,EAA0B;AACxB,aAAKQ,WAAL;AACD;AACF;;;WAKD,kBAAS;AACP,wBAYI,KAAKT,KAZT;AAAA,UACEU,EADF,eACEA,EADF;AAAA,UAEET,SAFF,eAEEA,SAFF;AAAA,UAGEU,UAHF,eAGEA,UAHF;AAAA,UAIEC,QAJF,eAIEA,QAJF;AAAA,UAKE5B,WALF,eAKEA,WALF;AAAA,UAMEC,UANF,eAMEA,UANF;AAAA,UAOEC,aAPF,eAOEA,aAPF;AAAA,UAQE2B,OARF,eAQEA,OARF;AAAA,6CASEC,QATF;AAAA,UASEA,QATF,qCASa,EATb;AAAA,6CAUEC,QAVF;AAAA,UAUEA,QAVF,qCAUa,EAVb;AAAA,2CAWEC,MAXF;AAAA,UAWEA,MAXF,mCAWWC,QAAQ,CAACrC,kBAAUE,KAAX,CAXnB;AAaA,UAAMoC,KAAK,GAAG,KAAKC,OAAL,CAAanC,WAAb,EAA0BC,UAA1B,CAAd;AACA,UAAOd,MAAP,GAAwB+C,KAAxB,CAAO/C,MAAP;AAAA,UAAeD,KAAf,GAAwBgD,KAAxB,CAAehD,KAAf;AACA,UAAMK,QAAQ,GAAG,KAAK6C,WAAL,CAAiBlC,aAAjB,CAAjB,CAhBO,CAiBP;;AACA,UAAMmC,WAAW,GAAGC,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAASR,MAAT,EAAiB,CAACpC,kBAAUE,KAA5B,CAAT,EAA6C,CAACF,kBAAU6C,KAAX,GAAmB,CAAhE,CAApB;AACA,UAAMC,mBAAmB,GAAGC,MAAM,CAACC,MAAP,mBAAkBjE,oBAAoB,CAACC,OAAvC,GAAiD;AAC3EO,QAAAA,MAAM,EAANA,MAD2E;AAE3ED,QAAAA,KAAK,EAALA,KAF2E;AAG3E2C,QAAAA,OAAO,EAAPA,OAH2E;AAI3EtC,QAAAA,QAAQ,EAARA,QAJ2E;AAK3EuC,QAAAA,QAAQ,EAARA,QAL2E;AAM3EC,QAAAA,QAAQ,EAARA,QAN2E;AAO3EC,QAAAA,MAAM,EAAEK;AAPmE,OAAjD,CAA5B;AASA,UAAMQ,MAAM,GAAG;AAACjE,QAAAA,OAAO,EAAE8D;AAAV,OAAf;AAEA,0BACE,qBAAC,mBAAD;AAAY,QAAA,EAAE,EAAEhB,EAAhB;AAAoB,QAAA,MAAM,EAAET,SAA5B;AAAuC,QAAA,cAAc,EAAE,GAAvD;AAA4D,QAAA,cAAc,EAAE;AAAA,iBAAMU,UAAU,EAAhB;AAAA,SAA5E;AAAgG,QAAA,KAAK,EAAEkB,MAAvG;AACY,QAAA,UAAU,EAAEtC,QAAQ,CAACuC,cAAT,CAAwB,MAAxB,KAAmC,EAD3D;AAAA,kBAEGlB;AAFH,QADF;AAMD;;;WAED,uBAAsBmB,MAAtB,EAAsC;AACpC,UAAI,CAAChD,cAAc,CAACiD,aAApB,EAAmC;AACjC,aAAKC,QAAL,CAAc;AAAC1B,UAAAA,MAAM,EAAEwB;AAAT,SAAd;AACA,YAAMG,WAAW,GAAG/B,MAAM,CAACgC,UAAP,GAAoB5C,QAAQ,CAAC6C,eAAT,CAAyBC,WAAjE;AACA9C,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB4C,QAApB,GAA+B,OAA/B;AACAhD,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB7B,IAApB;AACAyB,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB9B,GAApB,cAA8BkE,MAA9B;AACAxC,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB5B,KAApB,aAA+BmE,WAA/B;AACD;;AACDnD,MAAAA,cAAc,CAACiD,aAAf;AACD;;;WAED,uBAAsB;AACpBjD,MAAAA,cAAc,CAACiD,aAAf;;AACA,UAAI,CAACjD,cAAc,CAACiD,aAApB,EAAmC;AACjC;AACAzC,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB4C,QAApB,GAA+B,IAA/B,CAFiC,CAGjC;;AACAhD,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB7B,IAApB,GAA2B,IAA3B,CAJiC,CAKjC;;AACAyB,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB9B,GAApB,GAA0B,IAA1B,CANiC,CAOjC;;AACA0B,QAAAA,QAAQ,CAAC+C,IAAT,CAAc3C,KAAd,CAAoB5B,KAApB,GAA4B,IAA5B;AACA,aAAKyE,KAAL,CAAWjC,MAAX,IAAqBJ,MAAM,CAACsC,QAAP,CAAgB,CAAhB,EAAmB,KAAKD,KAAL,CAAWjC,MAA9B,CAArB;AACA,aAAK0B,QAAL,CAAc;AAAC1B,UAAAA,MAAM,EAAE;AAAT,SAAd;AACD;AACF;;;EA5G0BmC,KAAK,CAACC,S;;8BAA7B5D,c;AAjBJ2B,EAAAA,E;AACAT,EAAAA,S;AACAU,EAAAA,U;AACAC,EAAAA,Q;AACA5B,EAAAA,W;AACAC,EAAAA,U;AACAC,EAAAA,a;AACA2B,EAAAA,O;AACAC,EAAAA,Q;AACAC,EAAAA,Q;AACAC,EAAAA,M;;8BAOIjC,c,mBAC2B,C;eA8GlBA,c","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\n\nconst ModalContainerStyles = {\n content: {\n top: '50%',\n left: '50%',\n right: 'auto',\n bottom: 'auto',\n marginRight: '-50%',\n width: '640px',\n height: '320px',\n borderRadius: '8px',\n boxSizing: 'border-box' as any,\n margin: 0,\n overflow: 'auto',\n boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n opacity: 0;\n z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n opacity: 1;\n transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n z-index: ${Z_INDEXES.modal};\n opacity:0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n opacity: 1;\n transform: translate(-50%, -50%) scale(1.0, 1.0);\n transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n opacity: 0;\n transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n opacity: 0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n id?: string;\n showModal: boolean;\n closeModal: () => void;\n children: any;\n modalHeight?: any;\n modalWidth?: any;\n modalOverflow?: string;\n padding?: string;\n minWidth?: string;\n maxWidth?: string;\n zIndex?: number;\n};\n\ntype ModalContainerState = {\n scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n private static openInstances = 0;\n\n componentDidMount() {\n if (ReactModal.defaultStyles.overlay) {\n ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n }\n\n //append style node to override modal transition classes\n if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n style.setAttribute('modal-custom-styling', 'active');\n head.appendChild(style);\n style.appendChild(document.createTextNode(modalTransitions));\n }\n\n if (this.props.showModal) {\n this.preventScroll(window.scrollY);\n }\n }\n\n getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n return {scroll: window.scrollY};\n }\n\n componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n if (this.props.showModal && !prevProps.showModal) {\n this.preventScroll(snapshot!.scroll);\n }\n if (!this.props.showModal && prevProps.showModal) {\n this.resetScroll();\n }\n }\n\n componentWillUnmount() {\n if (this.props.showModal) {\n this.resetScroll();\n }\n }\n\n GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({height: modalHeight, width: modalWidth});\n GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n\n render() {\n const {\n id,\n showModal,\n closeModal,\n children,\n modalHeight,\n modalWidth,\n modalOverflow,\n padding,\n minWidth = '',\n maxWidth = '',\n zIndex = parseInt(Z_INDEXES.modal)\n } = this.props;\n const sizes = this.GetSize(modalHeight, modalWidth);\n const {height, width} = sizes;\n const overflow = this.GetOverflow(modalOverflow);\n // should be at least z-index of modal and below z-index of toast\n const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n height,\n width,\n padding,\n overflow,\n minWidth,\n maxWidth,\n zIndex: zIndexValue\n });\n const styles = {content: stylesConfiguration};\n\n return (\n <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles}\n appElement={document.getElementById('root') || ''}>\n {children}\n </ReactModal>\n );\n }\n\n private preventScroll(offset: number) {\n if (!ModalContainer.openInstances) {\n this.setState({scroll: offset});\n const scrollWidth = window.innerWidth - document.documentElement.offsetWidth;\n document.body.style.position = 'fixed';\n document.body.style.left = `0px`;\n document.body.style.top = `-${offset}px`;\n document.body.style.right = `${scrollWidth}px`;\n }\n ModalContainer.openInstances++\n }\n\n private resetScroll() {\n ModalContainer.openInstances--;\n if (!ModalContainer.openInstances) {\n //@ts-ignore\n document.body.style.position = null;\n //@ts-ignore\n document.body.style.left = null;\n //@ts-ignore\n document.body.style.top = null;\n //@ts-ignore\n document.body.style.right = null;\n this.state.scroll && window.scrollTo(0, this.state.scroll);\n this.setState({scroll: 0});\n }\n }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOWS","BOXSHADOW_L3","modalTransitions","Z_INDEXES","backdrop","modal","ModalContainer","modalHeight","modalWidth","modalOverflow","ReactModal","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","sizes","GetSize","GetOverflow","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","body","position","state","scrollTo","React","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\n\nconst ModalContainerStyles = {\n content: {\n top: '50%',\n left: '50%',\n right: 'auto',\n bottom: 'auto',\n marginRight: '-50%',\n width: '640px',\n height: '320px',\n borderRadius: '8px',\n boxSizing: 'border-box' as any,\n margin: 0,\n overflow: 'auto',\n boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n opacity: 0;\n z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n opacity: 1;\n transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n z-index: ${Z_INDEXES.modal};\n opacity:0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n opacity: 1;\n transform: translate(-50%, -50%) scale(1.0, 1.0);\n transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n opacity: 0;\n transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n opacity: 0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n id?: string;\n showModal: boolean;\n closeModal: () => void;\n children: any;\n modalHeight?: any;\n modalWidth?: any;\n modalOverflow?: string;\n padding?: string;\n minWidth?: string;\n maxWidth?: string;\n zIndex?: number;\n};\n\ntype ModalContainerState = {\n scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n private static openInstances = 0;\n\n componentDidMount() {\n if (ReactModal.defaultStyles.overlay) {\n ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n }\n\n //append style node to override modal transition classes\n if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n style.setAttribute('modal-custom-styling', 'active');\n head.appendChild(style);\n style.appendChild(document.createTextNode(modalTransitions));\n }\n\n if (this.props.showModal) {\n this.preventScroll(window.scrollY);\n }\n }\n\n getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n return {scroll: window.scrollY};\n }\n\n componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n if (this.props.showModal && !prevProps.showModal) {\n this.preventScroll(snapshot!.scroll);\n }\n if (!this.props.showModal && prevProps.showModal) {\n this.resetScroll();\n }\n }\n\n componentWillUnmount() {\n if (this.props.showModal) {\n this.resetScroll();\n }\n }\n\n GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({height: modalHeight, width: modalWidth});\n GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n\n render() {\n const {\n id,\n showModal,\n closeModal,\n children,\n modalHeight,\n modalWidth,\n modalOverflow,\n padding,\n minWidth = '',\n maxWidth = '',\n zIndex = parseInt(Z_INDEXES.modal)\n } = this.props;\n const sizes = this.GetSize(modalHeight, modalWidth);\n const {height, width} = sizes;\n const overflow = this.GetOverflow(modalOverflow);\n // should be at least z-index of modal and below z-index of toast\n const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n height,\n width,\n padding,\n overflow,\n minWidth,\n maxWidth,\n zIndex: zIndexValue\n });\n const styles = {content: stylesConfiguration};\n\n return (\n <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles}\n appElement={document.getElementById('root') || ''}>\n {children}\n </ReactModal>\n );\n }\n\n private preventScroll(offset: number) {\n if (!ModalContainer.openInstances) {\n this.setState({scroll: offset});\n document.body.style.position = 'fixed';\n document.body.style.left = `0px`;\n document.body.style.right = `0px`;\n document.body.style.top = `-${offset}px`;\n }\n ModalContainer.openInstances++\n }\n\n private resetScroll() {\n ModalContainer.openInstances--;\n if (!ModalContainer.openInstances) {\n //@ts-ignore\n document.body.style.position = null;\n //@ts-ignore\n document.body.style.left = null;\n //@ts-ignore\n document.body.style.top = null;\n //@ts-ignore\n document.body.style.right = null;\n this.state.scroll && window.scrollTo(0, this.state.scroll);\n this.setState({scroll: 0});\n }\n }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.cjs"}
|
|
@@ -172,11 +172,10 @@ var ModalContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
172
172
|
this.setState({
|
|
173
173
|
scroll: offset
|
|
174
174
|
});
|
|
175
|
-
var scrollWidth = window.innerWidth - document.documentElement.offsetWidth;
|
|
176
175
|
document.body.style.position = 'fixed';
|
|
177
176
|
document.body.style.left = "0px";
|
|
177
|
+
document.body.style.right = "0px";
|
|
178
178
|
document.body.style.top = "-".concat(offset, "px");
|
|
179
|
-
document.body.style.right = "".concat(scrollWidth, "px");
|
|
180
179
|
}
|
|
181
180
|
|
|
182
181
|
ModalContainer.openInstances++;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["React","ReactModal","BOXSHADOWS","Z_INDEXES","ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOW_L3","modalTransitions","backdrop","modal","ModalContainer","modalHeight","modalWidth","modalOverflow","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","sizes","GetSize","GetOverflow","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","scrollWidth","innerWidth","documentElement","offsetWidth","body","position","state","scrollTo","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\n\nconst ModalContainerStyles = {\n content: {\n top: '50%',\n left: '50%',\n right: 'auto',\n bottom: 'auto',\n marginRight: '-50%',\n width: '640px',\n height: '320px',\n borderRadius: '8px',\n boxSizing: 'border-box' as any,\n margin: 0,\n overflow: 'auto',\n boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n opacity: 0;\n z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n opacity: 1;\n transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n z-index: ${Z_INDEXES.modal};\n opacity:0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n opacity: 1;\n transform: translate(-50%, -50%) scale(1.0, 1.0);\n transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n opacity: 0;\n transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n opacity: 0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n id?: string;\n showModal: boolean;\n closeModal: () => void;\n children: any;\n modalHeight?: any;\n modalWidth?: any;\n modalOverflow?: string;\n padding?: string;\n minWidth?: string;\n maxWidth?: string;\n zIndex?: number;\n};\n\ntype ModalContainerState = {\n scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n private static openInstances = 0;\n\n componentDidMount() {\n if (ReactModal.defaultStyles.overlay) {\n ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n }\n\n //append style node to override modal transition classes\n if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n style.setAttribute('modal-custom-styling', 'active');\n head.appendChild(style);\n style.appendChild(document.createTextNode(modalTransitions));\n }\n\n if (this.props.showModal) {\n this.preventScroll(window.scrollY);\n }\n }\n\n getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n return {scroll: window.scrollY};\n }\n\n componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n if (this.props.showModal && !prevProps.showModal) {\n this.preventScroll(snapshot!.scroll);\n }\n if (!this.props.showModal && prevProps.showModal) {\n this.resetScroll();\n }\n }\n\n componentWillUnmount() {\n if (this.props.showModal) {\n this.resetScroll();\n }\n }\n\n GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({height: modalHeight, width: modalWidth});\n GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n\n render() {\n const {\n id,\n showModal,\n closeModal,\n children,\n modalHeight,\n modalWidth,\n modalOverflow,\n padding,\n minWidth = '',\n maxWidth = '',\n zIndex = parseInt(Z_INDEXES.modal)\n } = this.props;\n const sizes = this.GetSize(modalHeight, modalWidth);\n const {height, width} = sizes;\n const overflow = this.GetOverflow(modalOverflow);\n // should be at least z-index of modal and below z-index of toast\n const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n height,\n width,\n padding,\n overflow,\n minWidth,\n maxWidth,\n zIndex: zIndexValue\n });\n const styles = {content: stylesConfiguration};\n\n return (\n <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles}\n appElement={document.getElementById('root') || ''}>\n {children}\n </ReactModal>\n );\n }\n\n private preventScroll(offset: number) {\n if (!ModalContainer.openInstances) {\n this.setState({scroll: offset});\n const scrollWidth = window.innerWidth - document.documentElement.offsetWidth;\n document.body.style.position = 'fixed';\n document.body.style.left = `0px`;\n document.body.style.top = `-${offset}px`;\n document.body.style.right = `${scrollWidth}px`;\n }\n ModalContainer.openInstances++\n }\n\n private resetScroll() {\n ModalContainer.openInstances--;\n if (!ModalContainer.openInstances) {\n //@ts-ignore\n document.body.style.position = null;\n //@ts-ignore\n document.body.style.left = null;\n //@ts-ignore\n document.body.style.top = null;\n //@ts-ignore\n document.body.style.right = null;\n this.state.scroll && window.scrollTo(0, this.state.scroll);\n this.setState({scroll: 0});\n }\n }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Modals/ModalContainer.tsx"],"names":["React","ReactModal","BOXSHADOWS","Z_INDEXES","ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOW_L3","modalTransitions","backdrop","modal","ModalContainer","modalHeight","modalWidth","modalOverflow","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","props","showModal","preventScroll","window","scrollY","prevProps","prevState","scroll","snapshot","resetScroll","id","closeModal","children","padding","minWidth","maxWidth","zIndex","parseInt","sizes","GetSize","GetOverflow","zIndexValue","Math","min","max","toast","stylesConfiguration","Object","assign","styles","getElementById","offset","openInstances","setState","body","position","state","scrollTo","Component"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport {BOXSHADOWS} from '../styles';\nimport {Z_INDEXES} from '../styles';\n\nconst ModalContainerStyles = {\n content: {\n top: '50%',\n left: '50%',\n right: 'auto',\n bottom: 'auto',\n marginRight: '-50%',\n width: '640px',\n height: '320px',\n borderRadius: '8px',\n boxSizing: 'border-box' as any,\n margin: 0,\n overflow: 'auto',\n boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n opacity: 0;\n z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n opacity: 1;\n transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n z-index: ${Z_INDEXES.modal};\n opacity:0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n opacity: 1;\n transform: translate(-50%, -50%) scale(1.0, 1.0);\n transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n opacity: 0;\n transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n opacity: 0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\n\ntype ModalContainerProps = {\n id?: string;\n showModal: boolean;\n closeModal: () => void;\n children: any;\n modalHeight?: any;\n modalWidth?: any;\n modalOverflow?: string;\n padding?: string;\n minWidth?: string;\n maxWidth?: string;\n zIndex?: number;\n};\n\ntype ModalContainerState = {\n scroll: number;\n};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n private static openInstances = 0;\n\n componentDidMount() {\n if (ReactModal.defaultStyles.overlay) {\n ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n }\n\n //append style node to override modal transition classes\n if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n style.setAttribute('modal-custom-styling', 'active');\n head.appendChild(style);\n style.appendChild(document.createTextNode(modalTransitions));\n }\n\n if (this.props.showModal) {\n this.preventScroll(window.scrollY);\n }\n }\n\n getSnapshotBeforeUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>): { scroll: number } {\n return {scroll: window.scrollY};\n }\n\n componentDidUpdate(prevProps: Readonly<ModalContainerProps>, prevState: Readonly<ModalContainerState>, snapshot?: { scroll: number }) {\n if (this.props.showModal && !prevProps.showModal) {\n this.preventScroll(snapshot!.scroll);\n }\n if (!this.props.showModal && prevProps.showModal) {\n this.resetScroll();\n }\n }\n\n componentWillUnmount() {\n if (this.props.showModal) {\n this.resetScroll();\n }\n }\n\n GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({height: modalHeight, width: modalWidth});\n GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n\n render() {\n const {\n id,\n showModal,\n closeModal,\n children,\n modalHeight,\n modalWidth,\n modalOverflow,\n padding,\n minWidth = '',\n maxWidth = '',\n zIndex = parseInt(Z_INDEXES.modal)\n } = this.props;\n const sizes = this.GetSize(modalHeight, modalWidth);\n const {height, width} = sizes;\n const overflow = this.GetOverflow(modalOverflow);\n // should be at least z-index of modal and below z-index of toast\n const zIndexValue = Math.min(Math.max(zIndex, +Z_INDEXES.modal), +Z_INDEXES.toast - 1);\n const stylesConfiguration = Object.assign({...ModalContainerStyles.content}, {\n height,\n width,\n padding,\n overflow,\n minWidth,\n maxWidth,\n zIndex: zIndexValue\n });\n const styles = {content: stylesConfiguration};\n\n return (\n <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles}\n appElement={document.getElementById('root') || ''}>\n {children}\n </ReactModal>\n );\n }\n\n private preventScroll(offset: number) {\n if (!ModalContainer.openInstances) {\n this.setState({scroll: offset});\n document.body.style.position = 'fixed';\n document.body.style.left = `0px`;\n document.body.style.right = `0px`;\n document.body.style.top = `-${offset}px`;\n }\n ModalContainer.openInstances++\n }\n\n private resetScroll() {\n ModalContainer.openInstances--;\n if (!ModalContainer.openInstances) {\n //@ts-ignore\n document.body.style.position = null;\n //@ts-ignore\n document.body.style.left = null;\n //@ts-ignore\n document.body.style.top = null;\n //@ts-ignore\n document.body.style.right = null;\n this.state.scroll && window.scrollTo(0, this.state.scroll);\n this.setState({scroll: 0});\n }\n }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}
|