@corva/ui 3.72.0-0 → 3.72.0-3

package/cjs-bundle/components/DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedApp.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),n=require("@babel/runtime/helpers/slicedToArray"),r=require("@babel/runtime/helpers/objectWithoutProperties"),t=require("react"),o=require("classnames"),i=require("react-router-dom"),a=require("lodash"),s=require("query-string"),u=require("prop-types"),p=require("./IsolatedPage.js"),l=require("./constants.js"),d=require("./DevCenterIsolatedApp.module.scss.js"),c=require("../AppContext.js"),f=require("../../../permissions/PermissionsContext.js");require("../../../permissions/constants/index.js"),require("../../../permissions/withPermissionsHOC.js"),require("@babel/runtime/helpers/asyncToGenerator"),require("@babel/runtime/regenerator"),require("../../../clients/jsonApi/index.js"),require("../../../permissions/ProvidePermissions.js");var v=require("../../../utils/index.js");require("../AppHeader/AppHeader.js"),require("../AppSideBar/AppSideBar.js"),require("../AppsDataProvider/AppsDataProvider.js");var C=require("../DevCenterAppContainer/DevCenterAppContainer.js");require("../NavigationBar/NavigationBar.js"),require("../SideBar/SideBar.js"),require("../AppSettingsPopover/AppSettingsPopover.js"),require("../AppFilterPanelLayout/AppFilterPanelLayout.js"),require("../DevCenterRouterContext/DevCenterRouterContext.js"),require("../DevCenterRouterContext/UniversalLink/UniversalLink.js");var b=require("react/jsx-runtime");require("./DevCenterIsolatedAppPage.js");var m=require("../DevCenterAppContainer/utils.js"),A=require("../../../utils/mobileDetect.js"),g=require("../../../utils/devcenter.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=j(e),q=j(n),I=j(r),M=j(o),x=j(s),y=j(u),P=["isIsolationFeatureEnabled","onAppFullscreenTransparentMode","onIsMaximizedChange","onInnerContainerMouseEnter","onInnerContainerMouseLeave","onAppContainerClick","setInnerContainerRefFn","trackApiRateLimiterException"];function R(e,n){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n&&(t=t.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),r.push.apply(r,t)}return r}function E(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?R(Object(r),!0).forEach((function(n){h.default(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):R(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function D(e){var n,r,o,i,a,s,u,j=e.isIsolationFeatureEnabled,h=e.onAppFullscreenTransparentMode,y=e.onIsMaximizedChange,R=e.onInnerContainerMouseEnter,D=e.onInnerContainerMouseLeave,L=e.onAppContainerClick,w=e.setInnerContainerRefFn,O=e.trackApiRateLimiterException,S=I.default(e,P),T=t.useMemo((function(){return g.createDevCenterRouter(S.history)}),[null===(n=S.history)||void 0===n?void 0:n.location]),k=g.isCorvaApp(null==S||null===(r=S.app)||void 0===r?void 0:r.app)&&!g.isIsolationEnabledInPackageManifest(null==S||null===(o=S.app)||void 0===o?void 0:o.package)||!j,F=k?C:p.IsolatedPage,_=null===(i=S.app)||void 0===i||null===(a=i.app)||void 0===a?void 0:a.app_key,z=m.getAppVersion(S.app),U="".concat(_,"-").concat(z),B=t.useRef(),N=t.useRef(),W=t.useRef(),H=t.useRef(!1),V=t.useRef(!1),G=g.isAppMaximized(x.default.parse(null===(s=S.history)||void 0===s||null===(u=s.location)||void 0===u?void 0:u.search),S.app.id),J=t.useRef(G);J.current=G;var K=t.useState(v.getUserUnits()),Q=q.default(K,2),X=Q[0],Y=Q[1];t.useEffect((function(){var e=v.subscribeForUserUnitsUpdates((function(e){return Y(e)}));return function(){return e()}}),[]);var Z=t.useContext(c),$=f.default();function ee(){h({appId:S.app.id,isModeEnabled:!1}),document.body.classList.remove("dc-isolated-app__body-overflow",d.compensateScroll)}var ne=t.useCallback((function(e){var n,r,t,o,i,a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(!j||k||J.current&&!H.current||H.current===e){var s;a&&V.current!==a&&(V.current=a,null===(s=N.current)||void 0===s||s.classList.add(d.containerMaximizedTransparentModal))}else{var u,c=e?"add":"remove";if(null===(n=N.current)||void 0===n||n.classList[c](d.containerMaximizedTransparent),a||"remove"===c)null===(u=N.current)||void 0===u||u.classList[c](d.containerMaximizedTransparentModal);B.current=null===(r=N.current)||void 0===r||null===(t=r.querySelector("[".concat(p.APP_IFRAME_ATTRIBUTE,"]")))||void 0===t||null===(o=t.contentWindow)||void 0===o?void 0:o.document;var f=null===(i=B.current)||void 0===i?void 0:i.getElementById(l.ISOLATED_PAGE_APP_CONTAINER_ID);if(f){if(e){var v=W.current.getBoundingClientRect(),C=v.top,b=v.left,m=v.width,A=v.height;f.setAttribute("style","\n        top: ".concat(C,"px;\n        left: ").concat(b,"px;\n        width: ").concat(m,"px;\n        height: ").concat(A,"px;\n        position: absolute;\n      ")),h({appId:S.app.id,isModeEnabled:!0});var g=window.innerWidth!==document.body.clientWidth;document.body.classList.add("dc-isolated-app__body-overflow",g&&d.compensateScroll)}else f.setAttribute("style",""),ee();H.current=e,V.current=a}}}),[j,k,J]);t.useEffect((function(){return ee}),[]),t.useEffect((function(){G&&H.current&&ne(!1)}),[G]);var re=t.useCallback((function(e){N.current=e,w(e)}),[]);return b.jsx("div",{className:M.default("dc-isolated-app",d.fixedSizeContainer),ref:W,children:b.jsx("div",{ref:re,onMouseEnter:R,onMouseLeave:D,"data-testid":"".concat("DevCenter_AppContainer","_").concat(S.app.app.name),className:M.default(d.container,A.isInsideNewMobileApp&&d.newMobileAppContainer,G&&d.containerMaximized),children:b.jsx(F,E(E({},S),{},{appContextValue:Z,devCenterRouter:T,globalNotificationToastsAPI:window[Symbol.for("notificationToasts")],globalMixpanelEventTracker:window[Symbol.for("logToMixpanel")],onAppContainerClick:L,onIsMaximizedChange:y,permissionsContextValue:$,setIsFullscreenModalMode:ne,userUnits:X,trackApiRateLimiterException:O}),U)})})}D.propTypes={app:y.default.shape({id:y.default.number,app:y.default.shape({name:y.default.string})}).isRequired,currentUser:y.default.shape({}).isRequired,isIsolationFeatureEnabled:y.default.bool,onAppContainerClick:y.default.func,onAppFullscreenTransparentMode:y.default.func,onAppRemove:y.default.func,onInnerContainerMouseEnter:y.default.func,onInnerContainerMouseLeave:y.default.func,onIsMaximizedChange:y.default.func,onSettingChange:y.default.func,onSettingsChange:y.default.func,setInnerContainerRefFn:y.default.func,updateCurrentDashboardAppLastAnnotation:y.default.func,apiRateLimiterConfig:y.default.object},D.defaultProps={isIsolationFeatureEnabled:!1,onAppContainerClick:a.noop,onAppFullscreenTransparentMode:a.noop,onAppRemove:void 0,onInnerContainerMouseEnter:a.noop,onInnerContainerMouseLeave:a.noop,onIsMaximizedChange:a.noop,onSettingChange:a.noop,onSettingsChange:a.noop,setInnerContainerRefFn:a.noop,updateCurrentDashboardAppLastAnnotation:a.noop,apiRateLimiterConfig:{}};var L=i.withRouter(D);exports.DevCenterIsolatedApp=L;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),n=require("@babel/runtime/helpers/slicedToArray"),r=require("@babel/runtime/helpers/objectWithoutProperties"),t=require("react"),o=require("react-dom"),i=require("classnames"),a=require("react-router-dom"),s=require("lodash"),u=require("query-string"),p=require("prop-types"),l=require("./IsolatedPage.js"),d=require("./constants.js"),c=require("./DevCenterIsolatedApp.module.scss.js"),f=require("../AppContext.js"),v=require("../../../permissions/PermissionsContext.js");require("../../../permissions/constants/index.js"),require("../../../permissions/withPermissionsHOC.js"),require("@babel/runtime/helpers/asyncToGenerator"),require("@babel/runtime/regenerator"),require("../../../clients/jsonApi/index.js"),require("../../../permissions/ProvidePermissions.js");var C=require("../../../utils/index.js");require("../AppHeader/AppHeader.js"),require("../AppSideBar/AppSideBar.js"),require("../AppsDataProvider/AppsDataProvider.js");var b=require("../DevCenterAppContainer/DevCenterAppContainer.js");require("../NavigationBar/NavigationBar.js"),require("../SideBar/SideBar.js"),require("../AppSettingsPopover/AppSettingsPopover.js"),require("../AppFilterPanelLayout/AppFilterPanelLayout.js"),require("../DevCenterRouterContext/DevCenterRouterContext.js"),require("../DevCenterRouterContext/UniversalLink/UniversalLink.js");var m=require("react/jsx-runtime");require("./DevCenterIsolatedAppPage.js");var A=require("../DevCenterAppContainer/utils.js"),g=require("../../../utils/mobileDetect.js"),j=require("../../../utils/devcenter.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var q=h(e),I=h(n),y=h(r),M=h(i),x=h(u),P=h(p),R=["isIsolationFeatureEnabled","onAppFullscreenTransparentMode","onIsMaximizedChange","onInnerContainerMouseEnter","onInnerContainerMouseLeave","onAppContainerClick","setInnerContainerRefFn","trackApiRateLimiterException"];function E(e,n){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n&&(t=t.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),r.push.apply(r,t)}return r}function L(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?E(Object(r),!0).forEach((function(n){q.default(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):E(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function S(e){var n,r,i,a,s,u,p,h=e.isIsolationFeatureEnabled,q=e.onAppFullscreenTransparentMode,P=e.onIsMaximizedChange,E=e.onInnerContainerMouseEnter,S=e.onInnerContainerMouseLeave,w=e.onAppContainerClick,D=e.setInnerContainerRefFn,O=e.trackApiRateLimiterException,T=y.default(e,R),k=t.useMemo((function(){return j.createDevCenterRouter(T.history)}),[null===(n=T.history)||void 0===n?void 0:n.location]),F=j.isCorvaApp(null==T||null===(r=T.app)||void 0===r?void 0:r.app)&&!j.isIsolationEnabledInPackageManifest(null==T||null===(i=T.app)||void 0===i?void 0:i.package)||!h,_=F?b:l.IsolatedPage,z=null===(a=T.app)||void 0===a||null===(s=a.app)||void 0===s?void 0:s.app_key,U=A.getAppVersion(T.app),B="".concat(z,"-").concat(U),N=t.useRef(),W=t.useRef(),H=t.useRef(),V=t.useRef(!1),G=t.useRef(!1),J=j.isAppMaximized(x.default.parse(null===(u=T.history)||void 0===u||null===(p=u.location)||void 0===p?void 0:p.search),T.app.id),K=t.useRef(J);K.current=J;var Q=t.useState(C.getUserUnits()),X=I.default(Q,2),Y=X[0],Z=X[1];t.useEffect((function(){var e=C.subscribeForUserUnitsUpdates((function(e){return Z(e)}));return function(){return e()}}),[]);var $=t.useContext(f),ee=v.default();function ne(){q({appId:T.app.id,isModeEnabled:!1}),document.body.classList.remove("dc-isolated-app__body-overflow",c.compensateScroll)}var re=t.useCallback((function(e){var n,r,t,i,a,s=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(!h||F||K.current&&!V.current||V.current===e){var u;s&&G.current!==s&&(G.current=s,null===(u=W.current)||void 0===u||u.classList.add(c.containerMaximizedTransparentModal))}else{var p,f=e?"add":"remove";if(null===(n=W.current)||void 0===n||n.classList[f](c.containerMaximizedTransparent),s||"remove"===f)null===(p=W.current)||void 0===p||p.classList[f](c.containerMaximizedTransparentModal);N.current=null===(r=W.current)||void 0===r||null===(t=r.querySelector("[".concat(l.APP_IFRAME_ATTRIBUTE,"]")))||void 0===t||null===(i=t.contentWindow)||void 0===i?void 0:i.document;var v=null===(a=N.current)||void 0===a?void 0:a.getElementById(d.ISOLATED_PAGE_APP_CONTAINER_ID);if(v){if(e){var C=H.current.getBoundingClientRect(),b=C.top,m=C.left,A=C.width,g=C.height,j=window.innerWidth!==document.body.clientWidth;o.flushSync((function(){q({appId:T.app.id,isModeEnabled:!0})})),v.setAttribute("style","\n        top: ".concat(b,"px;\n        left: ").concat(m,"px;\n        width: ").concat(A,"px;\n        height: ").concat(g,"px;\n        position: absolute;\n      ")),document.body.classList.add("dc-isolated-app__body-overflow",j&&c.compensateScroll)}else o.flushSync((function(){q({appId:T.app.id,isModeEnabled:!1})})),v.setAttribute("style",""),document.body.classList.remove("dc-isolated-app__body-overflow",c.compensateScroll);V.current=e,G.current=s}}}),[h,F,K]);t.useEffect((function(){return ne}),[]),t.useEffect((function(){J&&V.current&&re(!1)}),[J]);var te=t.useCallback((function(e){W.current=e,D(e)}),[]);return m.jsx("div",{className:M.default("dc-isolated-app",c.fixedSizeContainer),ref:H,children:m.jsx("div",{ref:te,onMouseEnter:E,onMouseLeave:S,"data-testid":"".concat("DevCenter_AppContainer","_").concat(T.app.app.name),className:M.default(c.container,g.isInsideNewMobileApp&&c.newMobileAppContainer,J&&c.containerMaximized),children:m.jsx(_,L(L({},T),{},{isNonIsolatedApp:F,appContextValue:$,devCenterRouter:k,globalNotificationToastsAPI:window[Symbol.for("notificationToasts")],globalMixpanelEventTracker:window[Symbol.for("logToMixpanel")],onAppContainerClick:w,onIsMaximizedChange:P,permissionsContextValue:ee,setIsFullscreenModalMode:re,userUnits:Y,trackApiRateLimiterException:O}),B)})})}S.propTypes={app:P.default.shape({id:P.default.number,app:P.default.shape({name:P.default.string})}).isRequired,currentUser:P.default.shape({}).isRequired,isIsolationFeatureEnabled:P.default.bool,onAppContainerClick:P.default.func,onAppFullscreenTransparentMode:P.default.func,onAppRemove:P.default.func,onInnerContainerMouseEnter:P.default.func,onInnerContainerMouseLeave:P.default.func,onIsMaximizedChange:P.default.func,onSettingChange:P.default.func,onSettingsChange:P.default.func,setInnerContainerRefFn:P.default.func,updateCurrentDashboardAppLastAnnotation:P.default.func,apiRateLimiterConfig:P.default.object},S.defaultProps={isIsolationFeatureEnabled:!1,onAppContainerClick:s.noop,onAppFullscreenTransparentMode:s.noop,onAppRemove:void 0,onInnerContainerMouseEnter:s.noop,onInnerContainerMouseLeave:s.noop,onIsMaximizedChange:s.noop,onSettingChange:s.noop,onSettingsChange:s.noop,setInnerContainerRefFn:s.noop,updateCurrentDashboardAppLastAnnotation:s.noop,apiRateLimiterConfig:{}};var w=a.withRouter(S);exports.DevCenterIsolatedApp=w;
 //# sourceMappingURL=DevCenterIsolatedApp.js.map

package/cjs-bundle/components/DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedApp.js.map

@@ -1 +1 @@
-{"version":3,"file":"DevCenterIsolatedApp.js","sources":["../../../../../src/components/DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedApp.js"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { withRouter } from 'react-router-dom';\nimport { noop } from 'lodash';\nimport queryString from 'query-string';\nimport PropTypes from 'prop-types';\n\nimport { APP_IFRAME_ATTRIBUTE, IsolatedPage } from './IsolatedPage';\nimport { ISOLATED_PAGE_APP_CONTAINER_ID } from './constants';\n\nimport styles from './DevCenterIsolatedApp.module.scss';\n\nimport AppContext from '~/components/DevCenter/AppContext';\nimport { usePermissionsContext } from '~/permissions';\nimport { devcenter as devCenterUtils, getUserUnits, subscribeForUserUnitsUpdates } from '~/utils';\nimport { DevCenterAppContainer } from '~/components/DevCenter';\nimport { getAppVersion } from '~/components/DevCenter/DevCenterAppContainer/utils';\nimport { isInsideNewMobileApp } from '~/utils/mobileDetect';\n\nconst PAGE_NAME = 'DevCenter_AppContainer';\n\nfunction DevCenterIsolatedAppComponent({\n  isIsolationFeatureEnabled,\n  onAppFullscreenTransparentMode,\n  onIsMaximizedChange,\n  onInnerContainerMouseEnter,\n  onInnerContainerMouseLeave,\n  onAppContainerClick,\n  setInnerContainerRefFn,\n  trackApiRateLimiterException,\n  ...props\n}) {\n  const devCenterRouter = useMemo(\n    () => devCenterUtils.createDevCenterRouter(props.history),\n    [props.history?.location]\n  );\n\n  const isNonIsolatedApp =\n    (devCenterUtils.isCorvaApp(props?.app?.app) &&\n      !devCenterUtils.isIsolationEnabledInPackageManifest(props?.app?.package)) ||\n    !isIsolationFeatureEnabled;\n\n  const DCAppComponent = isNonIsolatedApp ? DevCenterAppContainer : IsolatedPage;\n\n  // Key to force iframe recreation when app version changes.\n  // This ensures global dependencies are re-initialized for the new version.\n  const appKey = props.app?.app?.app_key;\n  const appVersion = getAppVersion(props.app);\n  const iframeKey = `${appKey}-${appVersion}`;\n\n  const appIframeDocument = useRef();\n  const containerRef = useRef();\n  const fixedSizeContainerRef = useRef();\n  const fullscreenModeRef = useRef(false);\n  const fullscreenModalModeRef = useRef(false);\n\n  const isAppMaximized = devCenterUtils.isAppMaximized(\n    queryString.parse(props.history?.location?.search),\n    props.app.id\n  );\n\n  // save to ref to not re-create setIsFullscreenModalMode callback on change and reduce the amoount of DC apps re-renders\n  const isAppMaximizedRef = useRef(isAppMaximized);\n  isAppMaximizedRef.current = isAppMaximized;\n\n  const [userUnits, setUserUnits] = useState(getUserUnits());\n\n  useEffect(() => {\n    const unsubscribeFn = subscribeForUserUnitsUpdates(newUserUnits => setUserUnits(newUserUnits));\n\n    return () => unsubscribeFn();\n  }, []);\n\n  const appContextValue = useContext(AppContext);\n  const permissionsContextValue = usePermissionsContext();\n\n  /*\n  What is fullscreen modal mode?\n\n  Our apps, are shown in isolated iFrames. Because of it, when an app has some modal\n  and opens it - it's opened inside of its iframe, instead of opening at the center of the screen.\n\n  To make app modals & other elements be opened at the center of the screen, as if they are not inside of an iframe,\n  we use some hacks.\n\n  When the app wants to open a fullscreen element, we make its iframe fullscreen, but with transparent background,\n  and we set width/height & position of that app iframe to inner app container that is located inside of the iframe.\n  So when iframe's fullscreen element is opened, it looks like it's a part of the platform, and the app which shows the element, looks like\n  usual, not in fullscreen\n\n  So the platform provides this setIsFullscreenModalMode function to DC apps.\n  When DC app wants to open a modal that should be opened at the center of the screen - it needs to\n  call setIsFullscreenModalMode(true) first. And when it closes the modal - setIsFullscreenModalMode(false)\n\n  Two things are important about this\n  - all these styles that make this invisible background work should be applied at once\n  - enter and exit from the mode, shouldn't trigger even a single re-render, as it may impact\n    some elements inside the DC app\n\n  There's a second parameter to `setIsFullscreenModalMode`: `isModal`. It should be used when a fullscreen overlay is displayed\n  (Modal, for instance) that should cover everything on screen.\n\n  What it does - it basically sets the stretched element's z-index to a very high value, so it covers every other UI element in CWF\n  */\n\n  function handleAppFullscreenTransparentModeExit() {\n    onAppFullscreenTransparentMode({ appId: props.app.id, isModeEnabled: false });\n    document.body.classList.remove('dc-isolated-app__body-overflow', styles.compensateScroll);\n  }\n\n  const setIsFullscreenModalMode = useCallback(\n    function setIsFullscreenModalMode(nextIsFullscreenModalModeValue, isModal = false) {\n      // When an app is already in fullscreen mode, no need to use this\n      // invisible fullscreen mode to make elements take the whole screen\n\n      if (\n        !isIsolationFeatureEnabled ||\n        isNonIsolatedApp ||\n        (isAppMaximizedRef.current && !fullscreenModeRef.current) ||\n        fullscreenModeRef.current === nextIsFullscreenModalModeValue\n      ) {\n        // Adding modal class if modal is opened when non-modal is already open\n        if (isModal && fullscreenModalModeRef.current !== isModal) {\n          fullscreenModalModeRef.current = isModal;\n          containerRef.current?.classList.add(styles.containerMaximizedTransparentModal);\n        }\n\n        return;\n      }\n\n      const classesEditMethod = nextIsFullscreenModalModeValue ? 'add' : 'remove';\n\n      containerRef.current?.classList[classesEditMethod](styles.containerMaximizedTransparent);\n\n      if (isModal || classesEditMethod === 'remove') {\n        containerRef.current?.classList[classesEditMethod](\n          styles.containerMaximizedTransparentModal\n        );\n      }\n\n      appIframeDocument.current = containerRef.current?.querySelector(\n        `[${APP_IFRAME_ATTRIBUTE}]`\n      )?.contentWindow?.document;\n\n      const isolatedPageAppContainer = appIframeDocument.current?.getElementById(\n        ISOLATED_PAGE_APP_CONTAINER_ID\n      );\n\n      if (!isolatedPageAppContainer) {\n        return;\n      }\n\n      if (nextIsFullscreenModalModeValue) {\n        const { top, left, width, height } = fixedSizeContainerRef.current.getBoundingClientRect();\n\n        // We need to directly set inner iFrame container sizes together with DC platform styles\n        // as passing this as props and using some effect inside of an iframe\n        // results in a slight delay, which looks like a quick layout jump\n        isolatedPageAppContainer.setAttribute(\n          'style',\n          `\n        top: ${top}px;\n        left: ${left}px;\n        width: ${width}px;\n        height: ${height}px;\n        position: absolute;\n      `\n        );\n        onAppFullscreenTransparentMode({ appId: props.app.id, isModeEnabled: true });\n        const isBodyScrollVisible = window.innerWidth !== document.body.clientWidth;\n        document.body.classList.add(\n          'dc-isolated-app__body-overflow',\n          isBodyScrollVisible && styles.compensateScroll\n        );\n      } else {\n        isolatedPageAppContainer.setAttribute('style', '');\n        handleAppFullscreenTransparentModeExit();\n      }\n      fullscreenModeRef.current = nextIsFullscreenModalModeValue;\n      fullscreenModalModeRef.current = isModal;\n    },\n    [isIsolationFeatureEnabled, isNonIsolatedApp, isAppMaximizedRef]\n  );\n\n  useEffect(() => {\n    return handleAppFullscreenTransparentModeExit;\n  }, []);\n\n  useEffect(() => {\n    if (isAppMaximized && fullscreenModeRef.current) {\n      setIsFullscreenModalMode(false);\n    }\n  }, [isAppMaximized]);\n\n  /**\n   * This should be the same function as calling react-intersection-observer's ref setter actually triggers re-render.\n   * Which in its turn causes infinite re-render loop.\n   */\n  const setContainerRefs = useCallback(node => {\n    containerRef.current = node;\n    setInnerContainerRefFn(node);\n  }, []);\n\n  return (\n    <div\n      className={classNames('dc-isolated-app', styles.fixedSizeContainer)}\n      ref={fixedSizeContainerRef}\n    >\n      <div\n        ref={setContainerRefs}\n        onMouseEnter={onInnerContainerMouseEnter}\n        onMouseLeave={onInnerContainerMouseLeave}\n        data-testid={`${PAGE_NAME}_${props.app.app.name}`}\n        className={classNames(\n          styles.container,\n          isInsideNewMobileApp && styles.newMobileAppContainer,\n          isAppMaximized && styles.containerMaximized\n        )}\n      >\n        <DCAppComponent\n          key={iframeKey}\n          {...props}\n          appContextValue={appContextValue}\n          devCenterRouter={devCenterRouter}\n          globalNotificationToastsAPI={window[Symbol.for('notificationToasts')]}\n          globalMixpanelEventTracker={window[Symbol.for('logToMixpanel')]}\n          onAppContainerClick={onAppContainerClick}\n          onIsMaximizedChange={onIsMaximizedChange}\n          permissionsContextValue={permissionsContextValue}\n          setIsFullscreenModalMode={setIsFullscreenModalMode}\n          userUnits={userUnits}\n          trackApiRateLimiterException={trackApiRateLimiterException}\n        />\n      </div>\n    </div>\n  );\n}\n\nDevCenterIsolatedAppComponent.propTypes = {\n  app: PropTypes.shape({\n    id: PropTypes.number,\n    app: PropTypes.shape({\n      name: PropTypes.string,\n    }),\n  }).isRequired,\n  currentUser: PropTypes.shape({}).isRequired,\n  isIsolationFeatureEnabled: PropTypes.bool,\n  onAppContainerClick: PropTypes.func,\n  onAppFullscreenTransparentMode: PropTypes.func,\n  onAppRemove: PropTypes.func,\n  onInnerContainerMouseEnter: PropTypes.func,\n  onInnerContainerMouseLeave: PropTypes.func,\n  onIsMaximizedChange: PropTypes.func,\n  onSettingChange: PropTypes.func,\n  onSettingsChange: PropTypes.func,\n  setInnerContainerRefFn: PropTypes.func,\n  updateCurrentDashboardAppLastAnnotation: PropTypes.func,\n  apiRateLimiterConfig: PropTypes.object,\n};\n\nDevCenterIsolatedAppComponent.defaultProps = {\n  isIsolationFeatureEnabled: false,\n  onAppContainerClick: noop,\n  onAppFullscreenTransparentMode: noop,\n  onAppRemove: undefined,\n  onInnerContainerMouseEnter: noop,\n  onInnerContainerMouseLeave: noop,\n  onIsMaximizedChange: noop,\n  onSettingChange: noop,\n  onSettingsChange: noop,\n  setInnerContainerRefFn: noop,\n  updateCurrentDashboardAppLastAnnotation: noop,\n  apiRateLimiterConfig: {},\n};\n\nexport const DevCenterIsolatedApp = withRouter(DevCenterIsolatedAppComponent);\n"],"names":["DevCenterIsolatedAppComponent","_ref","_props$history","_props$app","_props$app2","_props$app3","_props$app3$app","_props$history2","_props$history2$locat","isIsolationFeatureEnabled","onAppFullscreenTransparentMode","onIsMaximizedChange","onInnerContainerMouseEnter","onInnerContainerMouseLeave","onAppContainerClick","setInnerContainerRefFn","trackApiRateLimiterException","props","_objectWithoutProperties","_excluded","devCenterRouter","useMemo","devCenterUtils","createDevCenterRouter","history","location","isNonIsolatedApp","isCorvaApp","app","package","DCAppComponent","DevCenterAppContainer","IsolatedPage","appKey","app_key","appVersion","getAppVersion","iframeKey","concat","appIframeDocument","useRef","containerRef","fixedSizeContainerRef","fullscreenModeRef","fullscreenModalModeRef","isAppMaximized","queryString","parse","search","id","isAppMaximizedRef","current","_useState","useState","getUserUnits","_useState2","_slicedToArray","userUnits","setUserUnits","useEffect","unsubscribeFn","subscribeForUserUnitsUpdates","newUserUnits","appContextValue","useContext","AppContext","permissionsContextValue","usePermissionsContext","handleAppFullscreenTransparentModeExit","appId","isModeEnabled","document","body","classList","remove","styles","compensateScroll","setIsFullscreenModalMode","useCallback","nextIsFullscreenModalModeValue","_containerRef$current2","_containerRef$current4","_containerRef$current5","_containerRef$current6","_appIframeDocument$cu","isModal","_containerRef$current","add","containerMaximizedTransparentModal","_containerRef$current3","classesEditMethod","containerMaximizedTransparent","querySelector","APP_IFRAME_ATTRIBUTE","contentWindow","isolatedPageAppContainer","getElementById","ISOLATED_PAGE_APP_CONTAINER_ID","_fixedSizeContainerRe","getBoundingClientRect","top","left","width","height","setAttribute","isBodyScrollVisible","window","innerWidth","clientWidth","setContainerRefs","node","_jsx","className","classNames","fixedSizeContainer","ref","children","jsx","onMouseEnter","onMouseLeave","PAGE_NAME","name","container","isInsideNewMobileApp","newMobileAppContainer","containerMaximized","_objectSpread","globalNotificationToastsAPI","Symbol","for","globalMixpanelEventTracker","propTypes","PropTypes","shape","number","string","isRequired","currentUser","bool","func","onAppRemove","onSettingChange","onSettingsChange","updateCurrentDashboardAppLastAnnotation","apiRateLimiterConfig","object","defaultProps","noop","undefined","DevCenterIsolatedApp","withRouter"],"mappings":"+/EAqBA,SAASA,EAUNC,GAAA,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EATDC,IAAAA,0BACAC,IAAAA,+BACAC,IAAAA,oBACAC,IAAAA,2BACAC,IAAAA,2BACAC,IAAAA,oBACAC,IAAAA,uBACAC,IAAAA,6BACGC,EAAKC,EAAA,QAAAjB,EAAAkB,GAEFC,EAAkBC,EAAAA,SACtB,WAAA,OAAMC,EAAoCC,sBAACN,EAAMO,QACjD,GAAA,SAAAtB,EAACe,EAAMO,4BAANtB,EAAeuB,WAGZC,EACHJ,EAAyBK,WAACV,SAAA,QAAKd,EAALc,EAAOW,WAAP,IAAAzB,OAAK,EAALA,EAAYyB,OACpCN,EAAAA,oCAAmDL,iBAAAA,EAAAA,EAAOW,sBAAPX,EAAAb,EAAYyB,WACjEpB,EAEGqB,EAAiBJ,EAAmBK,EAAwBC,eAI5DC,UAAShB,EAAAA,EAAMW,kBAAN,UAAAvB,EAAWuB,WAAX,IAAAtB,SAAAA,EAAgB4B,QACzBC,EAAaC,EAAAA,cAAcnB,EAAMW,KACjCS,EAAS,GAAAC,OAAML,EAAM,KAAAK,OAAIH,GAEzBI,EAAoBC,EAAAA,SACpBC,EAAeD,EAAAA,SACfE,EAAwBF,EAAAA,SACxBG,EAAoBH,UAAO,GAC3BI,EAAyBJ,UAAO,GAEhCK,EAAiBvB,EAA6BuB,eAClDC,UAAYC,cAAM9B,EAAAA,EAAMO,sBAAN,UAAAjB,EAAekB,gBAAf,IAAAjB,SAAAA,EAAyBwC,QAC3C/B,EAAMW,IAAIqB,IAINC,EAAoBV,SAAOK,GACjCK,EAAkBC,QAAUN,EAE5B,IAAAO,EAAkCC,WAASC,EAAAA,gBAAeC,EAAAC,EAAAA,QAAAJ,EAAA,GAAnDK,EAASF,EAAA,GAAEG,EAAYH,EAAA,GAE9BI,EAAAA,WAAU,WACR,IAAMC,EAAgBC,gCAA6B,SAAAC,GAAY,OAAIJ,EAAaI,MAEhF,OAAO,WAAA,OAAMF,GAAe,CAC7B,GAAE,IAEH,IAAMG,EAAkBC,aAAWC,GAC7BC,EAA0BC,EAAAA,UA+BhC,SAASC,KACP1D,EAA+B,CAAE2D,MAAOpD,EAAMW,IAAIqB,GAAIqB,eAAe,IACrEC,SAASC,KAAKC,UAAUC,OAAO,iCAAkCC,EAAOC,iBAC1E,CAEA,IAAMC,GAA2BC,EAAAA,aAC/B,SAAkCC,GAAiD,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAjBC,0DAIhE,IACG5E,GACDiB,GACCwB,EAAkBC,UAAYR,EAAkBQ,SACjDR,EAAkBQ,UAAY4B,EAJhC,CAO6D,IAAAO,EAAvDD,GAAWzC,EAAuBO,UAAYkC,IAChDzC,EAAuBO,QAAUkC,EACb,QAApBC,EAAA7C,EAAaU,eAAO,IAAAmC,GAApBA,EAAsBb,UAAUc,IAAIZ,EAAOa,oCAI/C,KAbA,CAeA,IAI+CC,EAJzCC,EAAoBX,EAAiC,MAAQ,SAInE,GAFoB,QAApBC,EAAAvC,EAAaU,eAAO,IAAA6B,GAApBA,EAAsBP,UAAUiB,GAAmBf,EAAOgB,+BAEtDN,GAAiC,WAAtBK,EACO,QAApBD,EAAAhD,EAAaU,eAAO,IAAAsC,GAApBA,EAAsBhB,UAAUiB,GAC9Bf,EAAOa,oCAIXjD,EAAkBY,QAAU,QAAH8B,EAAGxC,EAAaU,eAAb,IAAA8B,GAE3B,QAF2BC,EAAAD,EAAsBW,cAAa,IAAAtD,OACzDuD,EAAoBA,qBACzB,aAAA,IAAAX,GAAe,QAAfC,EAF2BD,EAEzBY,qBAAa,IAAAX,OAFY,EAAAA,EAEVZ,SAElB,IAAMwB,UAA2BxD,EAAAA,EAAkBY,4BAAlBiC,EAA2BY,eAC1DC,EAA8BA,gCAGhC,GAAKF,EAAL,CAIA,GAAIhB,EAAgC,CAClC,IAAAmB,EAAqCxD,EAAsBS,QAAQgD,wBAA3DC,IAAAA,IAAKC,IAAAA,KAAMC,IAAAA,MAAOC,IAAAA,OAK1BR,EAAyBS,aACvB,QAEKJ,kBAAAA,OAAAA,EACCC,uBAAAA,OAAAA,EACCC,wBAAAA,OAAAA,EACCC,yBAAAA,OAAAA,EAGT,6CACD7F,EAA+B,CAAE2D,MAAOpD,EAAMW,IAAIqB,GAAIqB,eAAe,IACrE,IAAMmC,EAAsBC,OAAOC,aAAepC,SAASC,KAAKoC,YAChErC,SAASC,KAAKC,UAAUc,IACtB,iCACAkB,GAAuB9B,EAAOC,iBAElC,MACEmB,EAAyBS,aAAa,QAAS,IAC/CpC,KAEFzB,EAAkBQ,QAAU4B,EAC5BnC,EAAuBO,QAAUkC,CA7BjC,CAtBA,CAoDD,GACD,CAAC5E,EAA2BiB,EAAkBwB,IAGhDS,EAAAA,WAAU,WACR,OAAOS,EACR,GAAE,IAEHT,EAAAA,WAAU,WACJd,GAAkBF,EAAkBQ,SACtC0B,IAAyB,EAE7B,GAAG,CAAChC,IAMJ,IAAMgE,GAAmB/B,eAAY,SAAAgC,GACnCrE,EAAaU,QAAU2D,EACvB/F,EAAuB+F,EACxB,GAAE,IAEH,OACEC,EAAAA,IAAA,MAAA,CACEC,UAAWC,EAAU,QAAC,kBAAmBtC,EAAOuC,oBAChDC,IAAKzE,EAAsB0E,SAE3BL,EAAAM,IAAA,MAAA,CACEF,IAAKN,GACLS,aAAc1G,EACd2G,aAAc1G,EACd,cAAgB2G,GAAAA,OAjMN,qCAiMmBvG,EAAMW,IAAIA,IAAI6F,MAC3CT,UAAWC,EAAAA,QACTtC,EAAO+C,UACPC,EAAAA,sBAAwBhD,EAAOiD,sBAC/B/E,GAAkB8B,EAAOkD,oBACzBT,SAEFL,EAAAA,IAACjF,EAAcgG,EAAAA,EAAA,GAET7G,GAAK,GAAA,CACT8C,gBAAiBA,EACjB3C,gBAAiBA,EACjB2G,4BAA6BrB,OAAOsB,OAAOC,IAAI,uBAC/CC,2BAA4BxB,OAAOsB,OAAOC,IAAI,kBAC9CnH,oBAAqBA,EACrBH,oBAAqBA,EACrBuD,wBAAyBA,EACzBW,yBAA0BA,GAC1BpB,UAAWA,EACXzC,6BAA8BA,IAXzBqB,MAgBf,CAEArC,EAA8BmI,UAAY,CACxCvG,IAAKwG,EAAS,QAACC,MAAM,CACnBpF,GAAImF,EAAS,QAACE,OACd1G,IAAKwG,EAAS,QAACC,MAAM,CACnBZ,KAAMW,EAAS,QAACG,WAEjBC,WACHC,YAAaL,EAAS,QAACC,MAAM,CAAA,GAAIG,WACjC/H,0BAA2B2H,EAAS,QAACM,KACrC5H,oBAAqBsH,EAAS,QAACO,KAC/BjI,+BAAgC0H,EAAS,QAACO,KAC1CC,YAAaR,EAAS,QAACO,KACvB/H,2BAA4BwH,EAAS,QAACO,KACtC9H,2BAA4BuH,EAAS,QAACO,KACtChI,oBAAqByH,EAAS,QAACO,KAC/BE,gBAAiBT,EAAS,QAACO,KAC3BG,iBAAkBV,EAAS,QAACO,KAC5B5H,uBAAwBqH,EAAS,QAACO,KAClCI,wCAAyCX,EAAS,QAACO,KACnDK,qBAAsBZ,EAAS,QAACa,QAGlCjJ,EAA8BkJ,aAAe,CAC3CzI,2BAA2B,EAC3BK,oBAAqBqI,EAAIA,KACzBzI,+BAAgCyI,EAAIA,KACpCP,iBAAaQ,EACbxI,2BAA4BuI,EAAIA,KAChCtI,2BAA4BsI,EAAIA,KAChCxI,oBAAqBwI,EAAIA,KACzBN,gBAAiBM,EAAIA,KACrBL,iBAAkBK,EAAIA,KACtBpI,uBAAwBoI,EAAIA,KAC5BJ,wCAAyCI,EAAIA,KAC7CH,qBAAsB,CAAC,OAGZK,EAAuBC,EAAUA,WAACtJ"}
+{"version":3,"file":"DevCenterIsolatedApp.js","sources":["../../../../../src/components/DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedApp.js"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport { flushSync } from 'react-dom';\nimport classNames from 'classnames';\nimport { withRouter } from 'react-router-dom';\nimport { noop } from 'lodash';\nimport queryString from 'query-string';\nimport PropTypes from 'prop-types';\n\nimport { APP_IFRAME_ATTRIBUTE, IsolatedPage } from './IsolatedPage';\nimport { ISOLATED_PAGE_APP_CONTAINER_ID } from './constants';\n\nimport styles from './DevCenterIsolatedApp.module.scss';\n\nimport AppContext from '~/components/DevCenter/AppContext';\nimport { usePermissionsContext } from '~/permissions';\nimport { devcenter as devCenterUtils, getUserUnits, subscribeForUserUnitsUpdates } from '~/utils';\nimport { DevCenterAppContainer } from '~/components/DevCenter';\nimport { getAppVersion } from '~/components/DevCenter/DevCenterAppContainer/utils';\nimport { isInsideNewMobileApp } from '~/utils/mobileDetect';\n\nconst PAGE_NAME = 'DevCenter_AppContainer';\n\nfunction DevCenterIsolatedAppComponent({\n  isIsolationFeatureEnabled,\n  onAppFullscreenTransparentMode,\n  onIsMaximizedChange,\n  onInnerContainerMouseEnter,\n  onInnerContainerMouseLeave,\n  onAppContainerClick,\n  setInnerContainerRefFn,\n  trackApiRateLimiterException,\n  ...props\n}) {\n  const devCenterRouter = useMemo(\n    () => devCenterUtils.createDevCenterRouter(props.history),\n    [props.history?.location]\n  );\n\n  const isNonIsolatedApp =\n    (devCenterUtils.isCorvaApp(props?.app?.app) &&\n      !devCenterUtils.isIsolationEnabledInPackageManifest(props?.app?.package)) ||\n    !isIsolationFeatureEnabled;\n\n  const DCAppComponent = isNonIsolatedApp ? DevCenterAppContainer : IsolatedPage;\n\n  // Key to force iframe recreation when app version changes.\n  // This ensures global dependencies are re-initialized for the new version.\n  const appKey = props.app?.app?.app_key;\n  const appVersion = getAppVersion(props.app);\n  const iframeKey = `${appKey}-${appVersion}`;\n\n  const appIframeDocument = useRef();\n  const containerRef = useRef();\n  const fixedSizeContainerRef = useRef();\n  const fullscreenModeRef = useRef(false);\n  const fullscreenModalModeRef = useRef(false);\n\n  const isAppMaximized = devCenterUtils.isAppMaximized(\n    queryString.parse(props.history?.location?.search),\n    props.app.id\n  );\n\n  // save to ref to not re-create setIsFullscreenModalMode callback on change and reduce the amoount of DC apps re-renders\n  const isAppMaximizedRef = useRef(isAppMaximized);\n  isAppMaximizedRef.current = isAppMaximized;\n\n  const [userUnits, setUserUnits] = useState(getUserUnits());\n\n  useEffect(() => {\n    const unsubscribeFn = subscribeForUserUnitsUpdates(newUserUnits => setUserUnits(newUserUnits));\n\n    return () => unsubscribeFn();\n  }, []);\n\n  const appContextValue = useContext(AppContext);\n  const permissionsContextValue = usePermissionsContext();\n\n  /*\n  What is fullscreen modal mode?\n\n  Our apps, are shown in isolated iFrames. Because of it, when an app has some modal\n  and opens it - it's opened inside of its iframe, instead of opening at the center of the screen.\n\n  To make app modals & other elements be opened at the center of the screen, as if they are not inside of an iframe,\n  we use some hacks.\n\n  When the app wants to open a fullscreen element, we make its iframe fullscreen, but with transparent background,\n  and we set width/height & position of that app iframe to inner app container that is located inside of the iframe.\n  So when iframe's fullscreen element is opened, it looks like it's a part of the platform, and the app which shows the element, looks like\n  usual, not in fullscreen\n\n  So the platform provides this setIsFullscreenModalMode function to DC apps.\n  When DC app wants to open a modal that should be opened at the center of the screen - it needs to\n  call setIsFullscreenModalMode(true) first. And when it closes the modal - setIsFullscreenModalMode(false)\n\n  Two things are important about this\n  - all these styles that make this invisible background work should be applied at once\n  - enter and exit from the mode, shouldn't trigger even a single re-render, as it may impact\n    some elements inside the DC app\n\n  There's a second parameter to `setIsFullscreenModalMode`: `isModal`. It should be used when a fullscreen overlay is displayed\n  (Modal, for instance) that should cover everything on screen.\n\n  What it does - it basically sets the stretched element's z-index to a very high value, so it covers every other UI element in CWF\n  */\n\n  function handleAppFullscreenTransparentModeExit() {\n    onAppFullscreenTransparentMode({ appId: props.app.id, isModeEnabled: false });\n    document.body.classList.remove('dc-isolated-app__body-overflow', styles.compensateScroll);\n  }\n\n  const setIsFullscreenModalMode = useCallback(\n    function setIsFullscreenModalMode(nextIsFullscreenModalModeValue, isModal = false) {\n      // When an app is already in fullscreen mode, no need to use this\n      // invisible fullscreen mode to make elements take the whole screen\n      if (\n        !isIsolationFeatureEnabled ||\n        isNonIsolatedApp ||\n        (isAppMaximizedRef.current && !fullscreenModeRef.current) ||\n        fullscreenModeRef.current === nextIsFullscreenModalModeValue\n      ) {\n        // Adding modal class if modal is opened when non-modal is already open\n        if (isModal && fullscreenModalModeRef.current !== isModal) {\n          fullscreenModalModeRef.current = isModal;\n          containerRef.current?.classList.add(styles.containerMaximizedTransparentModal);\n        }\n\n        return;\n      }\n\n      const classesEditMethod = nextIsFullscreenModalModeValue ? 'add' : 'remove';\n\n      containerRef.current?.classList[classesEditMethod](styles.containerMaximizedTransparent);\n\n      if (isModal || classesEditMethod === 'remove') {\n        containerRef.current?.classList[classesEditMethod](\n          styles.containerMaximizedTransparentModal\n        );\n      }\n\n      appIframeDocument.current = containerRef.current?.querySelector(\n        `[${APP_IFRAME_ATTRIBUTE}]`\n      )?.contentWindow?.document;\n\n      const isolatedPageAppContainer = appIframeDocument.current?.getElementById(\n        ISOLATED_PAGE_APP_CONTAINER_ID\n      );\n\n      if (!isolatedPageAppContainer) {\n        return;\n      }\n\n      if (nextIsFullscreenModalModeValue) {\n        // 1. BATCH ALL READS FIRST - prevents layout thrashing\n        const { top, left, width, height } = fixedSizeContainerRef.current.getBoundingClientRect();\n        const isBodyScrollVisible = window.innerWidth !== document.body.clientWidth;\n\n        // 2. Flush React state updates synchronously to prevent deferred renders\n        flushSync(() => {\n          onAppFullscreenTransparentMode({ appId: props.app.id, isModeEnabled: true });\n        });\n\n        // 3. BATCH ALL DOM WRITES - after reads and React flush\n        isolatedPageAppContainer.setAttribute(\n          'style',\n          `\n        top: ${top}px;\n        left: ${left}px;\n        width: ${width}px;\n        height: ${height}px;\n        position: absolute;\n      `\n        );\n        document.body.classList.add(\n          'dc-isolated-app__body-overflow',\n          isBodyScrollVisible && styles.compensateScroll\n        );\n      } else {\n        // Flush React state updates synchronously before DOM writes\n        flushSync(() => {\n          onAppFullscreenTransparentMode({ appId: props.app.id, isModeEnabled: false });\n        });\n\n        // DOM writes after React flush\n        isolatedPageAppContainer.setAttribute('style', '');\n        document.body.classList.remove('dc-isolated-app__body-overflow', styles.compensateScroll);\n      }\n      fullscreenModeRef.current = nextIsFullscreenModalModeValue;\n      fullscreenModalModeRef.current = isModal;\n    },\n    [isIsolationFeatureEnabled, isNonIsolatedApp, isAppMaximizedRef]\n  );\n\n  useEffect(() => {\n    return handleAppFullscreenTransparentModeExit;\n  }, []);\n\n  useEffect(() => {\n    if (isAppMaximized && fullscreenModeRef.current) {\n      setIsFullscreenModalMode(false);\n    }\n  }, [isAppMaximized]);\n\n  /**\n   * This should be the same function as calling react-intersection-observer's ref setter actually triggers re-render.\n   * Which in its turn causes infinite re-render loop.\n   */\n  const setContainerRefs = useCallback(node => {\n    containerRef.current = node;\n    setInnerContainerRefFn(node);\n  }, []);\n\n  return (\n    <div\n      className={classNames('dc-isolated-app', styles.fixedSizeContainer)}\n      ref={fixedSizeContainerRef}\n    >\n      <div\n        ref={setContainerRefs}\n        onMouseEnter={onInnerContainerMouseEnter}\n        onMouseLeave={onInnerContainerMouseLeave}\n        data-testid={`${PAGE_NAME}_${props.app.app.name}`}\n        className={classNames(\n          styles.container,\n          isInsideNewMobileApp && styles.newMobileAppContainer,\n          isAppMaximized && styles.containerMaximized\n        )}\n      >\n        <DCAppComponent\n          key={iframeKey}\n          {...props}\n          isNonIsolatedApp={isNonIsolatedApp}\n          appContextValue={appContextValue}\n          devCenterRouter={devCenterRouter}\n          globalNotificationToastsAPI={window[Symbol.for('notificationToasts')]}\n          globalMixpanelEventTracker={window[Symbol.for('logToMixpanel')]}\n          onAppContainerClick={onAppContainerClick}\n          onIsMaximizedChange={onIsMaximizedChange}\n          permissionsContextValue={permissionsContextValue}\n          setIsFullscreenModalMode={setIsFullscreenModalMode}\n          userUnits={userUnits}\n          trackApiRateLimiterException={trackApiRateLimiterException}\n        />\n      </div>\n    </div>\n  );\n}\n\nDevCenterIsolatedAppComponent.propTypes = {\n  app: PropTypes.shape({\n    id: PropTypes.number,\n    app: PropTypes.shape({\n      name: PropTypes.string,\n    }),\n  }).isRequired,\n  currentUser: PropTypes.shape({}).isRequired,\n  isIsolationFeatureEnabled: PropTypes.bool,\n  onAppContainerClick: PropTypes.func,\n  onAppFullscreenTransparentMode: PropTypes.func,\n  onAppRemove: PropTypes.func,\n  onInnerContainerMouseEnter: PropTypes.func,\n  onInnerContainerMouseLeave: PropTypes.func,\n  onIsMaximizedChange: PropTypes.func,\n  onSettingChange: PropTypes.func,\n  onSettingsChange: PropTypes.func,\n  setInnerContainerRefFn: PropTypes.func,\n  updateCurrentDashboardAppLastAnnotation: PropTypes.func,\n  apiRateLimiterConfig: PropTypes.object,\n};\n\nDevCenterIsolatedAppComponent.defaultProps = {\n  isIsolationFeatureEnabled: false,\n  onAppContainerClick: noop,\n  onAppFullscreenTransparentMode: noop,\n  onAppRemove: undefined,\n  onInnerContainerMouseEnter: noop,\n  onInnerContainerMouseLeave: noop,\n  onIsMaximizedChange: noop,\n  onSettingChange: noop,\n  onSettingsChange: noop,\n  setInnerContainerRefFn: noop,\n  updateCurrentDashboardAppLastAnnotation: noop,\n  apiRateLimiterConfig: {},\n};\n\nexport const DevCenterIsolatedApp = withRouter(DevCenterIsolatedAppComponent);\n"],"names":["DevCenterIsolatedAppComponent","_ref","_props$history","_props$app","_props$app2","_props$app3","_props$app3$app","_props$history2","_props$history2$locat","isIsolationFeatureEnabled","onAppFullscreenTransparentMode","onIsMaximizedChange","onInnerContainerMouseEnter","onInnerContainerMouseLeave","onAppContainerClick","setInnerContainerRefFn","trackApiRateLimiterException","props","_objectWithoutProperties","_excluded","devCenterRouter","useMemo","devCenterUtils","createDevCenterRouter","history","location","isNonIsolatedApp","isCorvaApp","app","package","DCAppComponent","DevCenterAppContainer","IsolatedPage","appKey","app_key","appVersion","getAppVersion","iframeKey","concat","appIframeDocument","useRef","containerRef","fixedSizeContainerRef","fullscreenModeRef","fullscreenModalModeRef","isAppMaximized","queryString","parse","search","id","isAppMaximizedRef","current","_useState","useState","getUserUnits","_useState2","_slicedToArray","userUnits","setUserUnits","useEffect","unsubscribeFn","subscribeForUserUnitsUpdates","newUserUnits","appContextValue","useContext","AppContext","permissionsContextValue","usePermissionsContext","handleAppFullscreenTransparentModeExit","appId","isModeEnabled","document","body","classList","remove","styles","compensateScroll","setIsFullscreenModalMode","useCallback","nextIsFullscreenModalModeValue","_containerRef$current2","_containerRef$current4","_containerRef$current5","_containerRef$current6","_appIframeDocument$cu","isModal","_containerRef$current","add","containerMaximizedTransparentModal","_containerRef$current3","classesEditMethod","containerMaximizedTransparent","querySelector","APP_IFRAME_ATTRIBUTE","contentWindow","isolatedPageAppContainer","getElementById","ISOLATED_PAGE_APP_CONTAINER_ID","_fixedSizeContainerRe","getBoundingClientRect","top","left","width","height","isBodyScrollVisible","window","innerWidth","clientWidth","flushSync","setAttribute","setContainerRefs","node","_jsx","className","classNames","fixedSizeContainer","ref","children","jsx","onMouseEnter","onMouseLeave","PAGE_NAME","name","container","isInsideNewMobileApp","newMobileAppContainer","containerMaximized","_objectSpread","globalNotificationToastsAPI","Symbol","for","globalMixpanelEventTracker","propTypes","PropTypes","shape","number","string","isRequired","currentUser","bool","func","onAppRemove","onSettingChange","onSettingsChange","updateCurrentDashboardAppLastAnnotation","apiRateLimiterConfig","object","defaultProps","noop","undefined","DevCenterIsolatedApp","withRouter"],"mappings":"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"}

package/cjs-bundle/components/DevCenter/IsolatedDevCenterAppContainer/IsolatedPage.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/slicedToArray"),r=require("@babel/runtime/helpers/extends"),t=require("@babel/runtime/helpers/defineProperty"),n=require("react"),o=require("lodash"),a=require("immutable"),i=require("../../LoadingIndicator/LoadingIndicator.js"),c=require("./IsolatedPage.module.css.js"),u=require("react/jsx-runtime");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l,f=s(e),p=s(r),d=s(t);function b(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function y(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?b(Object(t),!0).forEach((function(r){d.default(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):b(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var v=function(e,r){if(e===r)return!0;if("function"==typeof e&&"function"==typeof r)return!0;var t=a.Iterable.isIterable(e),n=a.Iterable.isIterable(r);return t&&n?a.is(e,r):t===n&&o.isEqual(e,r)},O=(l={},d.default(l,"data-corva-app-iframe",!0),d.default(l,"data-testid","isolatedAppContainer"),l);exports.APP_IFRAME_ATTRIBUTE="data-corva-app-iframe",exports.IsolatedPage=function(e){var r=p.default({},e),t=n.useRef(null),o=n.useRef(null),a=n.useState(!0),s=f.default(a,2),l=s[0],d=s[1],b=n.useCallback((function(){d(!1)}),[]),g=function(e,r){if(e){var t=!e.xprops,n=!function(e,r){if(e===r)return!0;if(!e)return!1;var t=Object.keys(e),n=Object.keys(r);if(t.length!==n.length)return!1;for(var o=0,a=n;o<a.length;o++){var i=a[o];if(!Object.prototype.hasOwnProperty.call(e,i))return!1;if(!v(e[i],r[i]))return!1}return!0}(o.current||{},r);if(e.xprops=y({},r),o.current=r,(t||n)&&e.xpropsOnProps)try{e.xpropsOnProps(r)}catch(e){console.debug("[IsolatedPage] xpropsOnProps was not set yet:",e)}}};return n.useEffect((function(){try{var e,n=null===(e=t.current)||void 0===e?void 0:e.contentWindow;g(n,r)}catch(e){console.error("[IsolatedPage] Error accessing iframe contentWindow:",e)}})),n.useEffect((function(){return function(){try{var e,r=null===(e=t.current)||void 0===e?void 0:e.contentWindow;r&&r.xprops&&delete r.xprops}catch(e){console.error("[IsolatedPage] Error cleaning up xprops:",e)}o.current=null;var n=t.current;if(n)try{n.src="about:blank"}catch(e){console.error("[IsolatedPage] Error setting iframe src to about:blank:",e)}t.current=null}}),[]),u.jsxs("div",{className:c.container,children:[l&&u.jsx(i,{}),u.jsx("iframe",y({ref:t,src:"/DevCenterIsolatedAppPage.html",onLoad:b,className:c.iframe},O))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/slicedToArray"),r=require("@babel/runtime/helpers/extends"),t=require("@babel/runtime/helpers/defineProperty"),n=require("react"),o=require("lodash"),a=require("immutable"),i=require("../../LoadingIndicator/LoadingIndicator.js"),c=require("./IsolatedPage.module.css.js"),u=require("react/jsx-runtime");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l,p=s(e),f=s(r),d=s(t);function b(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function v(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?b(Object(t),!0).forEach((function(r){d.default(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):b(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var y=function(e,r){if(e===r)return!0;if("function"==typeof e&&"function"==typeof r)return!0;var t=a.Iterable.isIterable(e),n=a.Iterable.isIterable(r);return t&&n?a.is(e,r):t===n&&o.isEqual(e,r)},g=/(^|[\^~>=\s])18\./,O=function(e){var r,t,n=null==e?void 0:e.package;if(!n)return!0;var o=null===(r=n.package_json)||void 0===r||null===(t=r.dependencies)||void 0===t?void 0:t.react;return!("string"==typeof o&&g.test(o))},P=(l={},d.default(l,"data-corva-app-iframe",!0),d.default(l,"data-testid","isolatedAppContainer"),l);exports.APP_IFRAME_ATTRIBUTE="data-corva-app-iframe",exports.IsolatedPage=function(e){var r,t,o=f.default({},e),a=n.useRef(null),s=n.useRef(null),l=n.useState(!0),d=p.default(l,2),b=d[0],g=d[1],j=n.useCallback((function(){g(!1)}),[]),m=function(e,r){if(e){var t=!e.xprops,n=!function(e,r){if(e===r)return!0;if(!e)return!1;var t=Object.keys(e),n=Object.keys(r);if(t.length!==n.length)return!1;for(var o=0,a=n;o<a.length;o++){var i=a[o];if(!Object.prototype.hasOwnProperty.call(e,i))return!1;if(!y(e[i],r[i]))return!1}return!0}(s.current||{},r);if(e.xprops=v({},r),s.current=r,(t||n)&&e.xpropsOnProps)try{e.xpropsOnProps(r)}catch(e){console.debug("[IsolatedPage] xpropsOnProps was not set yet:",e)}}};return n.useEffect((function(){try{var e,r=null===(e=a.current)||void 0===e?void 0:e.contentWindow;m(r,o)}catch(e){console.error("[IsolatedPage] Error accessing iframe contentWindow:",e)}})),n.useEffect((function(){return function(){try{var e,r=null===(e=a.current)||void 0===e?void 0:e.contentWindow;r&&r.xprops&&delete r.xprops}catch(e){console.error("[IsolatedPage] Error cleaning up xprops:",e)}s.current=null;var t=a.current;if(t)try{t.src="about:blank"}catch(e){console.error("[IsolatedPage] Error setting iframe src to about:blank:",e)}a.current=null}}),[]),u.jsxs("div",{className:c.container,children:[b&&u.jsx(i,{}),u.jsx("iframe",v({ref:a,src:(r=o.app,t=window.__DC_REACT17_ISOLATED_PAGE_PATH__,t&&O(r)?t:"/DevCenterIsolatedAppPage.html"),onLoad:j,className:c.iframe},P))]})},exports.isReact17App=O;
 //# sourceMappingURL=IsolatedPage.js.map

package/cjs-bundle/components/DevCenter/IsolatedDevCenterAppContainer/IsolatedPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"IsolatedPage.js","sources":["../../../../../src/components/DevCenter/IsolatedDevCenterAppContainer/IsolatedPage.tsx"],"sourcesContent":["// Ultra-minimal, same-origin isolation helper. Used to isolate DC apps from the parent page.\n//\n// Usage:\n//   <IsolatedPage currentUser={user} onSettingsChange={fn} isFeatEnabled={false} />\n//\n// Inside isolated page:\n//   window.xpropsOnProps = (props) => { /* handle updates */ };\n//   window.xprops.onSettingsChange(payload);\n//\n// Notes:\n//   - Path is hardcoded to `/DevCenterIsolatedAppPage.html`.\n//   - Client sets `window.xpropsOnProps` function directly (separate from xprops data).\n//   - `IsolatedPage` calls `window.xpropsOnProps` when props change (if it exists).\n//   - On unmount: xprops deleted, iframe set to about:blank.\n//   - Uses an Immutable.js-aware deep equality check (see `areXPropsEqual` below) to avoid\n//     unnecessary `xpropsOnProps` fires.\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { isEqual } from 'lodash';\nimport { is as immutableIs, Iterable } from 'immutable';\nimport LoadingIndicator from '~/components/LoadingIndicator';\nimport styles from './IsolatedPage.module.css';\n\n// PLT-3092: top-level xprops are a mix of plain JS objects, primitives, callbacks (new ref every\n// parent render), and Immutable.js collections (e.g. `currentUser`). Plain `lodash.isEqual` returns\n// FALSE on two same-content Immutable Maps (different internal `__ownerID` / `_root` refs) and on\n// callbacks with new identity, so every parent re-render fires `xpropsOnProps` into the iframe\n// even when nothing the DC app cares about actually changed. Result: heavy DC apps (Traces, DvD)\n// repeatedly re-run their xprops-dependent useEffects on every benign asset switch.\n//\n// Compare each top-level xprop value with awareness of these two cases:\n//   - Functions: identity churns every render upstream. Treat as effectively equal — the iframe\n//     always reads the LATEST function from `window.xprops`: we update the xprops object\n//     unconditionally on each call, and `useXProps` wraps function props in delegators that\n//     dereference `window.xprops[key]` at call time, so callbacks won't go stale even when we\n//     skip the fire.\n//   - Immutable collections: compare by value via `Immutable.is`.\n//   - Everything else: fall back to lodash `isEqual`.\nconst isXPropEqual = (a: unknown, b: unknown): boolean => {\n  if (a === b) return true;\n  if (typeof a === 'function' && typeof b === 'function') return true;\n  const aIsImm = Iterable.isIterable(a);\n  const bIsImm = Iterable.isIterable(b);\n  if (aIsImm && bIsImm) return immutableIs(a, b);\n  if (aIsImm !== bIsImm) return false;\n  return isEqual(a, b);\n};\n\nconst areXPropsEqual = (\n  prev: Record<string, unknown> | null,\n  next: Record<string, unknown>\n): boolean => {\n  if (prev === next) return true;\n  if (!prev) return false;\n  const prevKeys = Object.keys(prev);\n  const nextKeys = Object.keys(next);\n  if (prevKeys.length !== nextKeys.length) return false;\n  for (const key of nextKeys) {\n    if (!Object.prototype.hasOwnProperty.call(prev, key)) return false;\n    if (!isXPropEqual(prev[key], next[key])) return false;\n  }\n  return true;\n};\n\nconst ISOLATED_PAGE_PATH = '/DevCenterIsolatedAppPage.html';\n\nexport const APP_IFRAME_ATTRIBUTE = 'data-corva-app-iframe';\n\nconst IFRAME_ATTRIBUTES = {\n  [APP_IFRAME_ATTRIBUTE]: true,\n  'data-testid': 'isolatedAppContainer',\n} as Record<string, boolean | string>;\n\nexport type IsolatedPageProps = {\n  [key: string]: any; // forwarded as xprops\n};\n\ndeclare global {\n  interface Window {\n    xprops?: Record<string, any>;\n    xpropsOnProps?: (props: any) => void;\n  }\n}\n\nexport function IsolatedPage({ ...restProps }: IsolatedPageProps) {\n  const iframeRef = useRef<HTMLIFrameElement | null>(null);\n  const lastPropsSnapshotRef = useRef<Record<string, any> | null>(null);\n  const [isLoading, setIsLoading] = useState(true);\n\n  const handleIframeLoad = useCallback(() => {\n    setIsLoading(false);\n  }, []);\n\n  /**\n   * Inject or update props into iframe window.xprops.\n   * Calls window.xpropsOnProps callback only if props changed (deep check).\n   */\n  const publishProps = (\n    targetWindow: (Window & { xprops?: any; xpropsOnProps?: (props: any) => void }) | null,\n    newProps: Record<string, any>\n  ) => {\n    if (!targetWindow) return;\n\n    const isInitialSet = !targetWindow.xprops;\n    const previousSnapshot = lastPropsSnapshotRef.current || {};\n    const propsChanged = !areXPropsEqual(previousSnapshot, newProps);\n\n    // PLT-3092: ALWAYS replace `targetWindow.xprops` with the latest object reference. The\n    // equality check below gates whether to fire `xpropsOnProps` (which triggers an iframe React\n    // re-render), but `xpropsOnProps` skipping must not leave stale callbacks behind — the DC app\n    // dereferences `window.xprops.someFn` lazily on every user action, so the object MUST hold\n    // the latest function identities even when we suppress a re-render.\n    targetWindow.xprops = { ...newProps };\n    lastPropsSnapshotRef.current = newProps;\n\n    // Call xpropsOnProps callback if it exists (on initial set or when props changed)\n    if ((isInitialSet || propsChanged) && targetWindow.xpropsOnProps) {\n      try {\n        targetWindow.xpropsOnProps(newProps);\n      } catch (error) {\n        // eslint-disable-next-line no-console\n        console.debug('[IsolatedPage] xpropsOnProps was not set yet:', error);\n      }\n    }\n  };\n\n  // Try to set/update xprops whenever props change (including initial mount)\n  useEffect(() => {\n    try {\n      const win = iframeRef.current?.contentWindow as\n        | (Window & { xprops?: any; xpropsOnProps?: (props: any) => void })\n        | null;\n      publishProps(win, restProps);\n    } catch (error) {\n      // contentWindow might not be accessible yet, will retry on next prop change\n      console.error('[IsolatedPage] Error accessing iframe contentWindow:', error);\n    }\n  });\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      try {\n        const win = iframeRef.current?.contentWindow as (Window & { xprops?: any }) | null;\n        if (win && win.xprops) delete (win as any).xprops;\n      } catch (error) {\n        console.error('[IsolatedPage] Error cleaning up xprops:', error);\n      }\n      lastPropsSnapshotRef.current = null;\n      const iframeElement = iframeRef.current;\n      if (iframeElement) {\n        try {\n          iframeElement.src = 'about:blank';\n        } catch (error) {\n          console.error('[IsolatedPage] Error setting iframe src to about:blank:', error);\n        }\n      }\n      iframeRef.current = null;\n    };\n  }, []);\n\n  return (\n    <div className={styles.container}>\n      {isLoading && <LoadingIndicator />}\n      <iframe\n        ref={iframeRef}\n        src={ISOLATED_PAGE_PATH}\n        onLoad={handleIframeLoad}\n        className={styles.iframe}\n        {...IFRAME_ATTRIBUTES}\n      />\n    </div>\n  );\n}\n"],"names":["isXPropEqual","a","b","aIsImm","Iterable","isIterable","bIsImm","immutableIs","is","isEqual","IFRAME_ATTRIBUTES","_defineProperty","_IFRAME_ATTRIBUTES","_ref","restProps","_extends","iframeRef","useRef","lastPropsSnapshotRef","useState","_useState2","_slicedToArray","_useState","isLoading","setIsLoading","handleIframeLoad","useCallback","publishProps","targetWindow","newProps","isInitialSet","xprops","propsChanged","prev","next","prevKeys","Object","keys","nextKeys","length","_i","_nextKeys","key","prototype","hasOwnProperty","call","areXPropsEqual","current","xpropsOnProps","error","console","debug","useEffect","_iframeRef$current","win","contentWindow","_iframeRef$current2","iframeElement","src","_jsxs","className","styles","container","children","_jsx","LoadingIndicator","_objectSpread","ref","onLoad","iframe"],"mappings":"kkCAsCA,IAAMA,EAAe,SAACC,EAAYC,GAChC,GAAID,IAAMC,EAAG,OAAO,EACpB,GAAiB,mBAAND,GAAiC,mBAANC,EAAkB,OAAO,EAC/D,IAAMC,EAASC,EAAAA,SAASC,WAAWJ,GAC7BK,EAASF,EAAAA,SAASC,WAAWH,GACnC,OAAIC,GAAUG,EAAeC,EAAWC,GAACP,EAAGC,GACxCC,IAAWG,GACRG,EAAOA,QAACR,EAAGC,EACpB,EAsBMQ,oBAF8B,yBAGV,GACxBC,EAAAA,QAAAC,EAAA,cAAe,wBACoBA,gCALD,6CAkB7B,SAA2DC,GAAA,IAAhCC,EAASC,EAAAA,QAAA,CAAA,EAAAF,GACnCG,EAAYC,SAAiC,MAC7CC,EAAuBD,SAAmC,MAC9BE,EAAAA,EAAQA,UAAC,GAAKC,EAAAC,EAAAA,QAAAC,EAAA,GAAzCC,EAASH,EAAA,GAAEI,EAAYJ,EAAA,GAExBK,EAAmBC,EAAAA,aAAY,WACnCF,GAAa,EACd,GAAE,IAMGG,EAAe,SACnBC,EACAC,GAEA,GAAKD,EAAL,CAEA,IAAME,GAAgBF,EAAaG,OAE7BC,GAzDa,SACrBC,EACAC,GAEA,GAAID,IAASC,EAAM,OAAO,EAC1B,IAAKD,EAAM,OAAO,EAClB,IAAME,EAAWC,OAAOC,KAAKJ,GACvBK,EAAWF,OAAOC,KAAKH,GAC7B,GAAIC,EAASI,SAAWD,EAASC,OAAQ,OAAO,EAChD,IAAA,IAAAC,EAAA,EAAAC,EAAkBH,EAAUE,EAAAC,EAAAF,OAAAC,IAAA,CAAvB,IAAME,EAAGD,EAAAD,GACZ,IAAKJ,OAAOO,UAAUC,eAAeC,KAAKZ,EAAMS,GAAM,OAAO,EAC7D,IAAK1C,EAAaiC,EAAKS,GAAMR,EAAKQ,IAAO,OAAO,CAClD,CACA,OAAO,CACT,CA2C0BI,CADG5B,EAAqB6B,SAAW,GACFlB,GAWvD,GAJAD,EAAaG,OAAcF,EAAAA,CAAAA,EAAAA,GAC3BX,EAAqB6B,QAAUlB,GAG1BC,GAAgBE,IAAiBJ,EAAaoB,cACjD,IACEpB,EAAaoB,cAAcnB,EAI7B,CAHE,MAAOoB,GAEPC,QAAQC,MAAM,gDAAiDF,EACjE,CArBiB,GA4DrB,OAlCAG,EAAAA,WAAU,WACR,IAAI,IAAAC,EACIC,EAAuB,QAAjBtC,EAAAA,EAAU+B,eAAO,IAAAM,OAAA,EAAjBA,EAAmBE,cAG/B5B,EAAa2B,EAAKxC,EAIpB,CAHE,MAAOmC,GAEPC,QAAQD,MAAM,uDAAwDA,EACxE,CACF,IAGAG,EAAAA,WAAU,WACR,OAAO,WACL,IAAI,IAAAI,EACIF,EAAuB,QAAjBtC,EAAAA,EAAU+B,eAAO,IAAAS,OAAA,EAAjBA,EAAmBD,cAC3BD,GAAOA,EAAIvB,eAAgBuB,EAAYvB,MAG7C,CAFE,MAAOkB,GACPC,QAAQD,MAAM,2CAA4CA,EAC5D,CACA/B,EAAqB6B,QAAU,KAC/B,IAAMU,EAAgBzC,EAAU+B,QAChC,GAAIU,EACF,IACEA,EAAcC,IAAM,aAGtB,CAFE,MAAOT,GACPC,QAAQD,MAAM,0DAA2DA,EAC3E,CAEFjC,EAAU+B,QAAU,KAEvB,GAAE,IAGDY,EAAAA,KAAA,MAAA,CAAKC,UAAWC,EAAOC,UAAUC,SAAA,CAC9BxC,GAAayC,MAACC,MACfD,EAAAA,IAAA,SAAAE,EAAA,CACEC,IAAKnD,EACL0C,IAtGmB,iCAuGnBU,OAAQ3C,EACRmC,UAAWC,EAAOQ,QACd3D,MAIZ"}
+{"version":3,"file":"IsolatedPage.js","sources":["../../../../../src/components/DevCenter/IsolatedDevCenterAppContainer/IsolatedPage.tsx"],"sourcesContent":["// Ultra-minimal, same-origin isolation helper. Used to isolate DC apps from the parent page.\n//\n// Usage:\n//   <IsolatedPage currentUser={user} onSettingsChange={fn} isFeatEnabled={false} />\n//\n// Inside isolated page:\n//   window.xpropsOnProps = (props) => { /* handle updates */ };\n//   window.xprops.onSettingsChange(payload);\n//\n// Notes:\n//   - Path is hardcoded to `/DevCenterIsolatedAppPage.html`.\n//   - Client sets `window.xpropsOnProps` function directly (separate from xprops data).\n//   - `IsolatedPage` calls `window.xpropsOnProps` when props change (if it exists).\n//   - On unmount: xprops deleted, iframe set to about:blank.\n//   - Uses an Immutable.js-aware deep equality check (see `areXPropsEqual` below) to avoid\n//     unnecessary `xpropsOnProps` fires.\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { isEqual } from 'lodash';\nimport { is as immutableIs, Iterable } from 'immutable';\nimport LoadingIndicator from '~/components/LoadingIndicator';\nimport styles from './IsolatedPage.module.css';\n\n// PLT-3092: top-level xprops are a mix of plain JS objects, primitives, callbacks (new ref every\n// parent render), and Immutable.js collections (e.g. `currentUser`). Plain `lodash.isEqual` returns\n// FALSE on two same-content Immutable Maps (different internal `__ownerID` / `_root` refs) and on\n// callbacks with new identity, so every parent re-render fires `xpropsOnProps` into the iframe\n// even when nothing the DC app cares about actually changed. Result: heavy DC apps (Traces, DvD)\n// repeatedly re-run their xprops-dependent useEffects on every benign asset switch.\n//\n// Compare each top-level xprop value with awareness of these two cases:\n//   - Functions: identity churns every render upstream. Treat as effectively equal — the iframe\n//     always reads the LATEST function from `window.xprops`: we update the xprops object\n//     unconditionally on each call, and `useXProps` wraps function props in delegators that\n//     dereference `window.xprops[key]` at call time, so callbacks won't go stale even when we\n//     skip the fire.\n//   - Immutable collections: compare by value via `Immutable.is`.\n//   - Everything else: fall back to lodash `isEqual`.\nconst isXPropEqual = (a: unknown, b: unknown): boolean => {\n  if (a === b) return true;\n  if (typeof a === 'function' && typeof b === 'function') return true;\n  const aIsImm = Iterable.isIterable(a);\n  const bIsImm = Iterable.isIterable(b);\n  if (aIsImm && bIsImm) return immutableIs(a, b);\n  if (aIsImm !== bIsImm) return false;\n  return isEqual(a, b);\n};\n\nconst areXPropsEqual = (\n  prev: Record<string, unknown> | null,\n  next: Record<string, unknown>\n): boolean => {\n  if (prev === next) return true;\n  if (!prev) return false;\n  const prevKeys = Object.keys(prev);\n  const nextKeys = Object.keys(next);\n  if (prevKeys.length !== nextKeys.length) return false;\n  for (const key of nextKeys) {\n    if (!Object.prototype.hasOwnProperty.call(prev, key)) return false;\n    if (!isXPropEqual(prev[key], next[key])) return false;\n  }\n  return true;\n};\n\nconst ISOLATED_PAGE_PATH = '/DevCenterIsolatedAppPage.html';\n\n// [REACT-18-MIGRATION-TAG] Per-app React version (PLT-3099): under a React-18 host an isolated app\n// must run in a React-17 iframe realm unless it is known to be React-18-ready. Legacy builds carry\n// no `package.package_json.dependencies.react` at all (the field predates the migration and is\n// absent even in the packages API), so React-17-ness cannot be positively detected — everything\n// before the migration is React 17. Therefore treat \"does not explicitly declare React 18\" as\n// React 17 and route it to `/r17/`; only an explicit React-18 declaration (present on new builds,\n// filled in by the host's package_json enrichment) keeps the app on the default React-18 iframe.\n// The host opts in by setting `window.__DC_REACT17_ISOLATED_PAGE_PATH__` to a SAME-ORIGIN path that\n// serves a React-17 build of the iframe entry (same-origin is required — the xprops bridge below\n// uses direct `contentWindow.xprops`, which the browser blocks cross-origin). Remove once all apps\n// are on React 18.\nconst REACT_18_DECLARATION_REGEX = /(^|[\\^~>=\\s])18\\./;\n\nexport const isReact17App = (app: unknown): boolean => {\n  const pkg = (app as { package?: { package_json?: { dependencies?: Record<string, string> } } })\n    ?.package;\n  // No package at all = a legacy build with no React-18 declaration → route to /r17/. A React-18\n  // app always carries a package_json declaring react 18 (host package_json enrichment), so a\n  // missing package can never be a detectable React-18 app; default unknown/legacy to React 17.\n  if (!pkg) return true;\n\n  const declared = pkg.package_json?.dependencies?.react;\n  return !(typeof declared === 'string' && REACT_18_DECLARATION_REGEX.test(declared));\n};\n\nconst getIsolatedPagePath = (app: unknown): string => {\n  const react17Path = (window as any).__DC_REACT17_ISOLATED_PAGE_PATH__;\n  if (react17Path && isReact17App(app)) return react17Path;\n  return ISOLATED_PAGE_PATH;\n};\n\nexport const APP_IFRAME_ATTRIBUTE = 'data-corva-app-iframe';\n\nconst IFRAME_ATTRIBUTES = {\n  [APP_IFRAME_ATTRIBUTE]: true,\n  'data-testid': 'isolatedAppContainer',\n} as Record<string, boolean | string>;\n\nexport type IsolatedPageProps = {\n  [key: string]: any; // forwarded as xprops\n};\n\ndeclare global {\n  interface Window {\n    xprops?: Record<string, any>;\n    xpropsOnProps?: (props: any) => void;\n  }\n}\n\nexport function IsolatedPage({ ...restProps }: IsolatedPageProps) {\n  const iframeRef = useRef<HTMLIFrameElement | null>(null);\n  const lastPropsSnapshotRef = useRef<Record<string, any> | null>(null);\n  const [isLoading, setIsLoading] = useState(true);\n\n  const handleIframeLoad = useCallback(() => {\n    setIsLoading(false);\n  }, []);\n\n  /**\n   * Inject or update props into iframe window.xprops.\n   * Calls window.xpropsOnProps callback only if props changed (deep check).\n   */\n  const publishProps = (\n    targetWindow: (Window & { xprops?: any; xpropsOnProps?: (props: any) => void }) | null,\n    newProps: Record<string, any>\n  ) => {\n    if (!targetWindow) return;\n\n    const isInitialSet = !targetWindow.xprops;\n    const previousSnapshot = lastPropsSnapshotRef.current || {};\n    const propsChanged = !areXPropsEqual(previousSnapshot, newProps);\n\n    // PLT-3092: ALWAYS replace `targetWindow.xprops` with the latest object reference. The\n    // equality check below gates whether to fire `xpropsOnProps` (which triggers an iframe React\n    // re-render), but `xpropsOnProps` skipping must not leave stale callbacks behind — the DC app\n    // dereferences `window.xprops.someFn` lazily on every user action, so the object MUST hold\n    // the latest function identities even when we suppress a re-render.\n    targetWindow.xprops = { ...newProps };\n    lastPropsSnapshotRef.current = newProps;\n\n    // Call xpropsOnProps callback if it exists (on initial set or when props changed)\n    if ((isInitialSet || propsChanged) && targetWindow.xpropsOnProps) {\n      try {\n        targetWindow.xpropsOnProps(newProps);\n      } catch (error) {\n        // eslint-disable-next-line no-console\n        console.debug('[IsolatedPage] xpropsOnProps was not set yet:', error);\n      }\n    }\n  };\n\n  // Try to set/update xprops whenever props change (including initial mount)\n  useEffect(() => {\n    try {\n      const win = iframeRef.current?.contentWindow as\n        | (Window & { xprops?: any; xpropsOnProps?: (props: any) => void })\n        | null;\n      publishProps(win, restProps);\n    } catch (error) {\n      // contentWindow might not be accessible yet, will retry on next prop change\n      console.error('[IsolatedPage] Error accessing iframe contentWindow:', error);\n    }\n  });\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      try {\n        const win = iframeRef.current?.contentWindow as (Window & { xprops?: any }) | null;\n        if (win && win.xprops) delete (win as any).xprops;\n      } catch (error) {\n        console.error('[IsolatedPage] Error cleaning up xprops:', error);\n      }\n      lastPropsSnapshotRef.current = null;\n      const iframeElement = iframeRef.current;\n      if (iframeElement) {\n        try {\n          iframeElement.src = 'about:blank';\n        } catch (error) {\n          console.error('[IsolatedPage] Error setting iframe src to about:blank:', error);\n        }\n      }\n      iframeRef.current = null;\n    };\n  }, []);\n\n  return (\n    <div className={styles.container}>\n      {isLoading && <LoadingIndicator />}\n      <iframe\n        ref={iframeRef}\n        src={getIsolatedPagePath(restProps.app)}\n        onLoad={handleIframeLoad}\n        className={styles.iframe}\n        {...IFRAME_ATTRIBUTES}\n      />\n    </div>\n  );\n}\n"],"names":["isXPropEqual","a","b","aIsImm","Iterable","isIterable","bIsImm","immutableIs","is","isEqual","REACT_18_DECLARATION_REGEX","isReact17App","app","_pkg$package_json","_pkg$package_json$dep","pkg","package","declared","package_json","dependencies","react","test","IFRAME_ATTRIBUTES","_defineProperty","_IFRAME_ATTRIBUTES","_ref","react17Path","restProps","_extends","iframeRef","useRef","lastPropsSnapshotRef","useState","_useState2","_slicedToArray","_useState","isLoading","setIsLoading","handleIframeLoad","useCallback","publishProps","targetWindow","newProps","isInitialSet","xprops","propsChanged","prev","next","prevKeys","Object","keys","nextKeys","length","_i","_nextKeys","key","prototype","hasOwnProperty","call","areXPropsEqual","current","xpropsOnProps","error","console","debug","useEffect","_iframeRef$current","win","contentWindow","_iframeRef$current2","iframeElement","src","_jsxs","className","styles","container","children","_jsx","LoadingIndicator","_objectSpread","ref","window","__DC_REACT17_ISOLATED_PAGE_PATH__","onLoad","iframe"],"mappings":"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"}

package/cjs-bundle/components/EChartsWrapper/EChartsWrapper.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("@babel/runtime/helpers/defineProperty"),t=require("@babel/runtime/helpers/slicedToArray"),n=require("react"),r=require("lodash"),o=require("@material-ui/core"),a=require("classnames"),s=require("./components/Toolbox/Toolbox.js"),i=require("react/jsx-runtime");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=u(e),d=u(t),c=u(a);function x(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function f(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?x(Object(n),!0).forEach((function(t){l.default(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):x(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var y=o.makeStyles((function(){return{container:{position:"relative",width:"100%",height:"100%"}}})),m=function(e){var t=e.containerClassName,r=e.customToolboxContainerClass,a=e.onDataZoom,u=e.toolboxProps,l=e.children,x=y(),m=n.useRef(null),h=m.current,v=o.useTheme(),p=n.useState(!1),b=d.default(p,2),M=b[0],g=b[1],O=n.useState(!1),A=d.default(O,2),Z=A[0],C=A[1],j=n.useState(!0),F=d.default(j,2),E=F[0],P=F[1],S=n.useState(!1),T=d.default(S,2),w=T[0],q=T[1],I=n.useRef(null),k=n.useState(null),D=d.default(k,2),R=D[0],W=D[1],z=function(e){var t,n;if(h&&I.current){var r=h.getOption(),o=r.series;if(!((null===(t=r.xAxis)||void 0===t?void 0:t.length)>1||(null===(n=r.yAxis)||void 0===n?void 0:n.length)>1))if(!(Array.isArray(o)?o.reduce((function(e,t){return e.concat(t.data)}),[]):o.data).some((function(t){return Array.isArray(t)?t[0]>e.x.start&&t[0]<e.x.end&&t[1]>e.y.start&&t[1]<e.y.end:t.x>e.x.start&&t.x<e.x.end&&t.y>e.y.start&&t.y<e.y.end})))return;var a=100*Math.abs(e.x.start-I.current.x.start),s=100*Math.abs(e.x.end-I.current.x.start),i=100*Math.abs(e.y.start-I.current.y.start),u=100*Math.abs(e.y.end-I.current.y.start),l=i/Math.abs(I.current.y.start-I.current.y.end),d=u/Math.abs(I.current.y.start-I.current.y.end),c=a/Math.abs(I.current.x.start-I.current.x.end),x=s/Math.abs(I.current.x.start-I.current.x.end);h.dispatchAction({type:"dataZoom",moveOnMouseMove:Z,filterMode:"none",rangeMode:["percent","percent"],batch:[{start:+c.toFixed(2),end:+x.toFixed(2),dataZoomIndex:0},{start:+l.toFixed(2),end:+d.toFixed(2),dataZoomIndex:1}]})}},B=function(){var e,t,n,r,o,a,s,i,u=null==h||null===(e=h.getModel())||void 0===e||null===(t=e.getComponent("xAxis",0))||void 0===t||null===(n=t.axis)||void 0===n||null===(r=n.scale)||void 0===r?void 0:r.getExtent(),l=null==h||null===(o=h.getModel())||void 0===o||null===(a=o.getComponent("yAxis",0))||void 0===a||null===(s=a.axis)||void 0===s||null===(i=s.scale)||void 0===i?void 0:i.getExtent();if(u&&l){var c=d.default(u,2),x=c[0],f=c[1],y=d.default(l,2),m=y[0],v=y[1];I.current={x:{start:+x.toFixed(2),end:+f.toFixed(2)},y:{start:+m.toFixed(2),end:+v.toFixed(2)}}}},N=function(){q(!1),C(!1),P(!0),null==h||h.dispatchAction({type:"dataZoom",start:0,end:100,rangeMode:["percent","percent"]})},G=function(e){var t,n,r=0===e.start&&100===e.end,o=null===(t=e.batch)||void 0===t||null===(n=t[0])||void 0===n?void 0:n.startValue;r&&B(),q(!!o||!r),function(){if(h){var e=h.getModel().getComponent("yAxis",0).axis.scale.getExtent(),t=d.default(e,2),n=t[0],r=t[1],o=h.getModel().getComponent("xAxis",0).axis.scale.getExtent(),s=d.default(o,2),i={x:{start:s[0],end:s[1]},y:{start:n,end:r}};W(i),null==a||a(i)}}()};n.useEffect((function(){h&&(w||B(),M&&(h.setOption({toolbox:{show:!0,width:0,height:0,feature:{dataZoom:{show:!0,icon:null,brushStyle:{borderWidth:0,opacity:.1,color:v.palette.primary.light}}}},dataZoom:[{type:"inside",xAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:!1},{type:"inside",yAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:!1}]},{replaceMerge:"dataZoom"}),h.on("dataZoom",G),g(!1),h.dispatchAction({type:"takeGlobalCursor",key:"dataZoomSelect",dataZoomSelectActive:!0})))}),[h,M,w]),n.useEffect((function(){var e=null==h?void 0:h.getZr();if(null!=e&&e.dom){var t=Array.from(e.dom.getElementsByTagName("canvas")).at(-1);t?t.style.cursor=Z?"grab":E?"crosshair":"default":console.error("Canvas not found")}}),[h,Z,E]),n.useEffect((function(){h&&h.setOption({dataZoom:[{type:"inside",xAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:Z},{type:"inside",yAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:Z}]})}),[Z]),n.useEffect((function(){null==h||h.dispatchAction({type:"takeGlobalCursor",key:"dataZoomSelect",dataZoomSelectActive:E})}),[E]);return i.jsxs("div",{className:c.default(x.container,t),children:[n.Children.map(l,(function(e){var t,r=e.props.onChartReady;return n.cloneElement(e,{onChartReady:(t=r,function(e){t&&t(e),g(!0),m.current=e})})})),i.jsx(s.Toolbox,f(f({},u),{},{handleTogglePane:function(e){return C(e)},handleToggleBrush:function(e){return P(e)},isPaneEnabled:Z,isBrushEnabled:E,isZoomed:w,chart:h,handleZoomReset:N,handleZoomOut:function(){if(I.current&&R){var e=.05*Math.abs(I.current.x.start-I.current.x.end),t=.05*Math.abs(I.current.y.start-I.current.y.end),n=+(R.x.start-e).toFixed(2),r=+(R.x.end+e).toFixed(2),o=+(R.y.start-t).toFixed(2),a=+(R.y.end+t).toFixed(2),s=n<=I.current.x.start||r>=I.current.x.end,i=o<=I.current.y.start||a>=I.current.y.end;if(s&&i)return N();z({x:s?I.current.x:{start:n,end:r},y:i?I.current.y:{start:o,end:a}})}},handleZoomIn:function(){w||(B(),q(!0));var e=R||I.current;if(e){var t=.05*Math.abs(e.x.start-e.x.end),n=.05*Math.abs(e.y.start-e.y.end),r=+(e.x.start+t).toFixed(2),o=+(e.x.end-t).toFixed(2),a=+(e.y.start+n).toFixed(2),s=+(e.y.end-n).toFixed(2),i=r>=o,u=a>=s;z({x:{start:i?e.x.start:r,end:i?e.x.end:o},y:{start:u?e.y.start:a,end:u?e.y.end:s}})}},customToolboxContainerClass:c.default(null==u?void 0:u.customToolboxContainerClass,r)}))]})};m.defaultProps={onDataZoom:r.noop},module.exports=m;
+"use strict";var e=require("@babel/runtime/helpers/defineProperty"),t=require("@babel/runtime/helpers/slicedToArray"),n=require("react"),r=require("lodash"),o=require("@material-ui/core"),a=require("classnames"),s=require("./components/Toolbox/Toolbox.js"),i=require("react/jsx-runtime");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=u(e),d=u(t),c=u(a);function x(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function f(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?x(Object(n),!0).forEach((function(t){l.default(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):x(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var y=o.makeStyles((function(){return{container:{position:"relative",width:"100%",height:"100%"}}})),m=function(e){var t=e.containerClassName,r=e.customToolboxContainerClass,a=e.onDataZoom,u=e.toolboxProps,l=e.children,x=y(),m=n.useRef(null),h=m.current,v=o.useTheme(),p=n.useState(!1),b=d.default(p,2),M=b[0],g=b[1],O=n.useState(!1),A=d.default(O,2),Z=A[0],C=A[1],j=n.useState(!0),F=d.default(j,2),E=F[0],P=F[1],S=n.useState(!1),T=d.default(S,2),w=T[0],q=T[1],I=n.useRef(null),k=n.useState(null),D=d.default(k,2),R=D[0],W=D[1],z=function(e){var t,n;if(h&&I.current){var r=h.getOption(),o=r.series;if(!((null===(t=r.xAxis)||void 0===t?void 0:t.length)>1||(null===(n=r.yAxis)||void 0===n?void 0:n.length)>1))if(!(Array.isArray(o)?o.reduce((function(e,t){return e.concat(t.data)}),[]):o.data).some((function(t){return Array.isArray(t)?t[0]>e.x.start&&t[0]<e.x.end&&t[1]>e.y.start&&t[1]<e.y.end:t.x>e.x.start&&t.x<e.x.end&&t.y>e.y.start&&t.y<e.y.end})))return;var a=100*Math.abs(e.x.start-I.current.x.start),s=100*Math.abs(e.x.end-I.current.x.start),i=100*Math.abs(e.y.start-I.current.y.start),u=100*Math.abs(e.y.end-I.current.y.start),l=i/Math.abs(I.current.y.start-I.current.y.end),d=u/Math.abs(I.current.y.start-I.current.y.end),c=a/Math.abs(I.current.x.start-I.current.x.end),x=s/Math.abs(I.current.x.start-I.current.x.end);h.dispatchAction({type:"dataZoom",moveOnMouseMove:Z,filterMode:"none",rangeMode:["percent","percent"],batch:[{start:+c.toFixed(2),end:+x.toFixed(2),dataZoomIndex:0},{start:+l.toFixed(2),end:+d.toFixed(2),dataZoomIndex:1}]})}},B=function(){var e,t,n,r,o,a,s,i,u=null==h||null===(e=h.getModel())||void 0===e||null===(t=e.getComponent("xAxis",0))||void 0===t||null===(n=t.axis)||void 0===n||null===(r=n.scale)||void 0===r?void 0:r.getExtent(),l=null==h||null===(o=h.getModel())||void 0===o||null===(a=o.getComponent("yAxis",0))||void 0===a||null===(s=a.axis)||void 0===s||null===(i=s.scale)||void 0===i?void 0:i.getExtent();if(u&&l){var c=d.default(u,2),x=c[0],f=c[1],y=d.default(l,2),m=y[0],v=y[1];I.current={x:{start:+x.toFixed(2),end:+f.toFixed(2)},y:{start:+m.toFixed(2),end:+v.toFixed(2)}}}},N=function(){q(!1),C(!1),P(!0),null==h||h.dispatchAction({type:"dataZoom",start:0,end:100,rangeMode:["percent","percent"]})},G=function(e){var t,n,r=0===e.start&&100===e.end,o=null===(t=e.batch)||void 0===t||null===(n=t[0])||void 0===n?void 0:n.startValue;r&&B(),q(!!o||!r),function(){if(h){var e=h.getModel().getComponent("yAxis",0).axis.scale.getExtent(),t=d.default(e,2),n=t[0],r=t[1],o=h.getModel().getComponent("xAxis",0).axis.scale.getExtent(),s=d.default(o,2),i={x:{start:s[0],end:s[1]},y:{start:n,end:r}};W(i),null==a||a(i)}}()};n.useEffect((function(){h&&(w||B(),M&&(h.setOption({toolbox:{show:!0,width:0,height:0,feature:{dataZoom:{show:!0,icon:null,brushStyle:{borderWidth:0,opacity:.1,color:v.palette.primary.light}}}},dataZoom:[{type:"inside",xAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:!1},{type:"inside",yAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:!1}]},{replaceMerge:"dataZoom"}),h.on("dataZoom",G),g(!1),h.dispatchAction({type:"takeGlobalCursor",key:"dataZoomSelect",dataZoomSelectActive:!0})))}),[h,M,w]),n.useEffect((function(){var e=null==h?void 0:h.getZr();if(null!=e&&e.dom){var t=Array.from(e.dom.getElementsByTagName("canvas")).at(-1);t?t.style.cursor=Z?"grab":E?"crosshair":"default":console.error("Canvas not found")}}),[h,Z,E]),n.useEffect((function(){h&&h.setOption({dataZoom:[{type:"inside",xAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:Z},{type:"inside",yAxisIndex:"all",filterMode:"none",zoomOnMouseWheel:!1,moveOnMouseMove:Z}]})}),[Z]),n.useEffect((function(){null==h||h.dispatchAction({type:"takeGlobalCursor",key:"dataZoomSelect",dataZoomSelectActive:E})}),[E]);return i.jsxs("div",{className:c.default(x.container,t),children:[n.Children.map(l,(function(e){if(!n.isValidElement(e))return e;var t,r=e.props.onChartReady;return n.cloneElement(e,{onChartReady:(t=r,function(e){t&&t(e),g(!0),m.current=e})})})),i.jsx(s.Toolbox,f(f({},u),{},{handleTogglePane:function(e){return C(e)},handleToggleBrush:function(e){return P(e)},isPaneEnabled:Z,isBrushEnabled:E,isZoomed:w,chart:h,handleZoomReset:N,handleZoomOut:function(){if(I.current&&R){var e=.05*Math.abs(I.current.x.start-I.current.x.end),t=.05*Math.abs(I.current.y.start-I.current.y.end),n=+(R.x.start-e).toFixed(2),r=+(R.x.end+e).toFixed(2),o=+(R.y.start-t).toFixed(2),a=+(R.y.end+t).toFixed(2),s=n<=I.current.x.start||r>=I.current.x.end,i=o<=I.current.y.start||a>=I.current.y.end;if(s&&i)return N();z({x:s?I.current.x:{start:n,end:r},y:i?I.current.y:{start:o,end:a}})}},handleZoomIn:function(){w||(B(),q(!0));var e=R||I.current;if(e){var t=.05*Math.abs(e.x.start-e.x.end),n=.05*Math.abs(e.y.start-e.y.end),r=+(e.x.start+t).toFixed(2),o=+(e.x.end-t).toFixed(2),a=+(e.y.start+n).toFixed(2),s=+(e.y.end-n).toFixed(2),i=r>=o,u=a>=s;z({x:{start:i?e.x.start:r,end:i?e.x.end:o},y:{start:u?e.y.start:a,end:u?e.y.end:s}})}},customToolboxContainerClass:c.default(null==u?void 0:u.customToolboxContainerClass,r)}))]})};m.defaultProps={onDataZoom:r.noop},module.exports=m;
 //# sourceMappingURL=EChartsWrapper.js.map

package/cjs-bundle/components/EChartsWrapper/EChartsWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"EChartsWrapper.js","sources":["../../../../src/components/EChartsWrapper/EChartsWrapper.tsx"],"sourcesContent":["import { Children, cloneElement, FC, useEffect, useRef, useState } from 'react';\nimport { noop } from 'lodash';\nimport ReactECharts from 'echarts-for-react';\nimport { EChartsType, SeriesOption } from 'echarts';\nimport { AxisRange, ChartWrapperProps, DataZoomEvent, SeriesDataItem } from './types';\nimport { XAXisOption, YAXisOption } from 'echarts/types/dist/shared';\nimport { makeStyles, useTheme } from '@material-ui/core';\nimport classnames from 'classnames';\n\nimport { Toolbox } from './components/Toolbox/Toolbox';\n\nconst AXIS_ZOOM_STEP_PERCENT = 0.05;\n\nconst useStyles = makeStyles(() => ({\n  container: {\n    position: 'relative',\n    width: '100%',\n    height: '100%',\n  },\n}));\n\nconst EChartsWrapper: FC<ChartWrapperProps> = ({\n  containerClassName,\n  customToolboxContainerClass,\n  onDataZoom: onDataZoomCustom,\n  toolboxProps,\n\n  // @ts-ignore\n  children,\n}) => {\n  const classes = useStyles();\n  const chartRef = useRef<EChartsType | null>(null);\n  const chart = chartRef.current;\n  const theme = useTheme();\n  const [isNeedInitialOptions, setIsNeedInitialOptions] = useState(false);\n  const [isPaneEnabled, setIsPaneEnabled] = useState(false);\n  const [isBrushEnabled, setIsBrushEnabled] = useState(true);\n  const [isZoomed, setIsZoomed] = useState(false);\n  const axisRange = useRef<AxisRange | null>(null);\n  const [currentZoomRange, setCurrentZoomRange] = useState<AxisRange | null>(null);\n\n  const handleZoomChart = (range: AxisRange) => {\n    if (!chart || !axisRange.current) return;\n\n    const options = chart.getOption();\n    const series = options.series as SeriesOption[] | SeriesOption;\n    const isMultipleAxis =\n      (options.xAxis as XAXisOption[])?.length > 1 || (options.yAxis as YAXisOption[])?.length > 1;\n    if (!isMultipleAxis) {\n      const data = (\n        Array.isArray(series)\n          ? series.reduce<unknown[]>((acc, serie) => acc.concat(serie.data), [])\n          : series.data\n      ) as SeriesDataItem[];\n\n      const isDataExists = data.some((dataItem: SeriesDataItem) => {\n        // case when dot structure is [x,y]\n        if (Array.isArray(dataItem)) {\n          return (\n            dataItem[0] > range.x.start &&\n            dataItem[0] < range.x.end &&\n            dataItem[1] > range.y.start &&\n            dataItem[1] < range.y.end\n          );\n        }\n        return (\n          dataItem.x > range.x.start &&\n          dataItem.x < range.x.end &&\n          dataItem.y > range.y.start &&\n          dataItem.y < range.y.end\n        );\n      });\n\n      if (!isDataExists) return;\n    }\n\n    const absoluteXStart = Math.abs(range.x.start - axisRange.current.x.start) * 100;\n    const absoluteXEnd = Math.abs(range.x.end - axisRange.current.x.start) * 100;\n\n    const absoluteYStart = Math.abs(range.y.start - axisRange.current.y.start) * 100;\n    const absoluteYEnd = Math.abs(range.y.end - axisRange.current.y.start) * 100;\n\n    const yStartPercent =\n      absoluteYStart / Math.abs(axisRange.current.y.start - axisRange.current.y.end);\n    const yEndPercent =\n      absoluteYEnd / Math.abs(axisRange.current.y.start - axisRange.current.y.end);\n\n    const xStartPercent =\n      absoluteXStart / Math.abs(axisRange.current.x.start - axisRange.current.x.end);\n    const xEndPercent =\n      absoluteXEnd / Math.abs(axisRange.current.x.start - axisRange.current.x.end);\n\n    chart.dispatchAction({\n      type: 'dataZoom',\n      moveOnMouseMove: isPaneEnabled,\n      filterMode: 'none',\n      rangeMode: ['percent', 'percent'],\n      batch: [\n        { start: +xStartPercent.toFixed(2), end: +xEndPercent.toFixed(2), dataZoomIndex: 0 },\n        {\n          start: +yStartPercent.toFixed(2),\n          end: +yEndPercent.toFixed(2),\n          dataZoomIndex: 1,\n        },\n      ],\n    });\n  };\n\n  const handleSaveAxisRanges = () => {\n    // @ts-ignore\n    const xRange = chart?.getModel()?.getComponent('xAxis', 0)?.axis?.scale?.getExtent() as [\n      xMin: number,\n      xMax: number\n    ];\n    // @ts-ignore\n    const yRange = chart?.getModel()?.getComponent('yAxis', 0)?.axis?.scale?.getExtent() as [\n      yMin: number,\n      yMax: number\n    ];\n\n    if (xRange && yRange) {\n      const [xMin, xMax] = xRange;\n      const [yMin, yMax] = yRange;\n      axisRange.current = {\n        x: {\n          start: +xMin.toFixed(2),\n          end: +xMax.toFixed(2),\n        },\n        y: {\n          start: +yMin.toFixed(2),\n          end: +yMax.toFixed(2),\n        },\n      };\n    }\n  };\n\n  const handleSaveZoomRange = () => {\n    if (!chart) return;\n\n    // getModel is not standardized and documented\n    // https://github.com/apache/echarts/issues/16479#issuecomment-1033349403\n    // @ts-ignore\n    const [yMin, yMax] = chart.getModel().getComponent('yAxis', 0).axis.scale.getExtent();\n    // @ts-ignore\n    const [xMin, xMax] = chart.getModel().getComponent('xAxis', 0).axis.scale.getExtent();\n\n    const range = {\n      x: {\n        start: xMin,\n        end: xMax,\n      },\n      y: {\n        start: yMin,\n        end: yMax,\n      },\n    };\n    setCurrentZoomRange(range);\n    onDataZoomCustom?.(range);\n  };\n\n  const handleZoomIn = (): void => {\n    if (!isZoomed) {\n      handleSaveAxisRanges();\n      setIsZoomed(true);\n    }\n    const targetRange = currentZoomRange || axisRange.current;\n    if (!targetRange) return;\n\n    const currentXStep = Math.abs(targetRange.x.start - targetRange.x.end) * AXIS_ZOOM_STEP_PERCENT;\n    const currentYStep = Math.abs(targetRange.y.start - targetRange.y.end) * AXIS_ZOOM_STEP_PERCENT;\n\n    const XStart = +(targetRange.x.start + currentXStep).toFixed(2);\n    const XEnd = +(targetRange.x.end - currentXStep).toFixed(2);\n\n    const YStart = +(targetRange.y.start + currentYStep).toFixed(2);\n    const YEnd = +(targetRange.y.end - currentYStep).toFixed(2);\n    const isXExceeds = XStart >= XEnd;\n    const isYExceeds = YStart >= YEnd;\n\n    handleZoomChart({\n      x: {\n        start: isXExceeds ? targetRange.x.start : XStart,\n        end: isXExceeds ? targetRange.x.end : XEnd,\n      },\n      y: {\n        start: isYExceeds ? targetRange.y.start : YStart,\n        end: isYExceeds ? targetRange.y.end : YEnd,\n      },\n    });\n  };\n\n  const handleZoomOut = (): void => {\n    if (!axisRange.current || !currentZoomRange) return;\n\n    const currentXStep =\n      Math.abs(axisRange.current.x.start - axisRange.current.x.end) * AXIS_ZOOM_STEP_PERCENT;\n    const currentYStep =\n      Math.abs(axisRange.current.y.start - axisRange.current.y.end) * AXIS_ZOOM_STEP_PERCENT;\n\n    const XStart = +(currentZoomRange.x.start - currentXStep).toFixed(2);\n    const XEnd = +(currentZoomRange.x.end + currentXStep).toFixed(2);\n\n    const YStart = +(currentZoomRange.y.start - currentYStep).toFixed(2);\n    const YEnd = +(currentZoomRange.y.end + currentYStep).toFixed(2);\n\n    const isXExceeds = XStart <= axisRange.current.x.start || XEnd >= axisRange.current.x.end;\n    const isYExceeds = YStart <= axisRange.current.y.start || YEnd >= axisRange.current.y.end;\n\n    if (isXExceeds && isYExceeds) {\n      return handleZoomReset();\n    }\n\n    handleZoomChart({\n      x: isXExceeds\n        ? axisRange.current.x\n        : {\n            start: XStart,\n            end: XEnd,\n          },\n      y: isYExceeds\n        ? axisRange.current.y\n        : {\n            start: YStart,\n            end: YEnd,\n          },\n    });\n  };\n\n  const handleZoomReset = () => {\n    setIsZoomed(false);\n    setIsPaneEnabled(false);\n    setIsBrushEnabled(true);\n    chart?.dispatchAction({\n      type: 'dataZoom',\n      start: 0,\n      end: 100,\n      rangeMode: ['percent', 'percent'],\n    });\n  };\n\n  const onDataZoom = (evt: DataZoomEvent) => {\n    const isResetEvent = evt.start === 0 && evt.end === 100;\n    const isNativeDataZoom = evt.batch?.[0]?.startValue;\n\n    if (isResetEvent) {\n      handleSaveAxisRanges();\n    }\n\n    setIsZoomed(isNativeDataZoom ? true : !isResetEvent);\n\n    handleSaveZoomRange();\n  };\n\n  useEffect(() => {\n    if (!chart) return;\n    if (!isZoomed) {\n      handleSaveAxisRanges();\n    }\n\n    if (isNeedInitialOptions) {\n      chart.setOption(\n        {\n          toolbox: {\n            show: true,\n            width: 0,\n            height: 0,\n            feature: {\n              dataZoom: {\n                show: true,\n                icon: null,\n                brushStyle: {\n                  borderWidth: 0,\n                  opacity: 0.1,\n                  color: theme.palette.primary.light,\n                },\n              },\n            },\n          },\n          dataZoom: [\n            {\n              type: 'inside',\n              xAxisIndex: 'all',\n              filterMode: 'none',\n              zoomOnMouseWheel: false,\n              moveOnMouseMove: false,\n            },\n            {\n              type: 'inside',\n              yAxisIndex: 'all',\n              filterMode: 'none',\n              zoomOnMouseWheel: false,\n              moveOnMouseMove: false,\n            },\n          ],\n        },\n        { replaceMerge: 'dataZoom' }\n      );\n      chart.on('dataZoom', onDataZoom as (...args: unknown[]) => void);\n      setIsNeedInitialOptions(false);\n      chart.dispatchAction({\n        type: 'takeGlobalCursor',\n        key: 'dataZoomSelect',\n        dataZoomSelectActive: true,\n      });\n    }\n  }, [chart, isNeedInitialOptions, isZoomed]);\n\n  useEffect(() => {\n    // cursor grab in pane mode works only for canvas renderer\n    const zRender = chart?.getZr();\n    if (zRender?.dom) {\n      const canvas = Array.from(zRender.dom.getElementsByTagName('canvas')).at(\n        -1\n      ) as HTMLCanvasElement;\n      if (canvas) {\n        canvas.style.cursor = isPaneEnabled ? 'grab' : isBrushEnabled ? 'crosshair' : 'default';\n      } else {\n        console.error('Canvas not found');\n      }\n    }\n  }, [chart, isPaneEnabled, isBrushEnabled]);\n\n  useEffect(() => {\n    if (!chart) return;\n    chart.setOption({\n      dataZoom: [\n        {\n          type: 'inside',\n          xAxisIndex: 'all',\n          filterMode: 'none',\n          zoomOnMouseWheel: false,\n          moveOnMouseMove: isPaneEnabled,\n        },\n        {\n          type: 'inside',\n          yAxisIndex: 'all',\n          filterMode: 'none',\n          zoomOnMouseWheel: false,\n          moveOnMouseMove: isPaneEnabled,\n        },\n      ],\n    });\n  }, [isPaneEnabled]);\n\n  useEffect(() => {\n    chart?.dispatchAction({\n      type: 'takeGlobalCursor',\n      key: 'dataZoomSelect',\n      dataZoomSelectActive: isBrushEnabled,\n    });\n  }, [isBrushEnabled]);\n\n  const onChartReadyExtended =\n    (childCallback?: (instance: EChartsType) => any) => (instance: EChartsType) => {\n      if (childCallback) {\n        childCallback(instance);\n      }\n      setIsNeedInitialOptions(true);\n      chartRef.current = instance;\n    };\n\n  return (\n    <div className={classnames(classes.container, containerClassName)}>\n      {Children.map(children, (child: ReactECharts) => {\n        const { onChartReady } = child.props;\n        // @ts-ignore\n        return cloneElement(child, {\n          onChartReady: onChartReadyExtended(onChartReady),\n        });\n      })}\n      <Toolbox\n        {...toolboxProps}\n        handleTogglePane={isEnabled => setIsPaneEnabled(isEnabled)}\n        handleToggleBrush={isEnabled => setIsBrushEnabled(isEnabled)}\n        isPaneEnabled={isPaneEnabled}\n        isBrushEnabled={isBrushEnabled}\n        isZoomed={isZoomed}\n        chart={chart}\n        handleZoomReset={handleZoomReset}\n        handleZoomOut={handleZoomOut}\n        handleZoomIn={handleZoomIn}\n        customToolboxContainerClass={classnames(\n          toolboxProps?.customToolboxContainerClass,\n          customToolboxContainerClass\n        )}\n      />\n    </div>\n  );\n};\n\nEChartsWrapper.defaultProps = {\n  onDataZoom: noop,\n};\n\nexport default EChartsWrapper;\n"],"names":["useStyles","makeStyles","container","position","width","height","EChartsWrapper","_ref","containerClassName","customToolboxContainerClass","onDataZoomCustom","onDataZoom","toolboxProps","children","classes","chartRef","useRef","chart","current","theme","useTheme","useState","_useState2","_slicedToArray","_useState","isNeedInitialOptions","setIsNeedInitialOptions","_useState4","_useState3","isPaneEnabled","setIsPaneEnabled","_useState6","_useState5","isBrushEnabled","setIsBrushEnabled","_useState8","_useState7","isZoomed","setIsZoomed","axisRange","_useState10","_useState9","currentZoomRange","setCurrentZoomRange","handleZoomChart","range","_options$xAxis","_options$yAxis","options","getOption","series","xAxis","length","yAxis","Array","isArray","reduce","acc","serie","concat","data","some","dataItem","x","start","end","y","absoluteXStart","Math","abs","absoluteXEnd","absoluteYStart","absoluteYEnd","yStartPercent","yEndPercent","xStartPercent","xEndPercent","dispatchAction","type","moveOnMouseMove","filterMode","rangeMode","batch","toFixed","dataZoomIndex","handleSaveAxisRanges","_chart$getModel","_chart$getModel$getCo","_chart$getModel$getCo2","_chart$getModel$getCo3","_chart$getModel2","_chart$getModel2$getC","_chart$getModel2$getC2","_chart$getModel2$getC3","xRange","getModel","getComponent","axis","scale","getExtent","yRange","_xRange","xMin","xMax","_yRange","yMin","yMax","handleZoomReset","evt","_evt$batch","_evt$batch$","isResetEvent","isNativeDataZoom","startValue","_chart$getModel$getCo4","_chart$getModel$getCo5","_chart$getModel$getCo6","_chart$getModel$getCo7","handleSaveZoomRange","useEffect","setOption","toolbox","show","feature","dataZoom","icon","brushStyle","borderWidth","opacity","color","palette","primary","light","xAxisIndex","zoomOnMouseWheel","yAxisIndex","replaceMerge","on","key","dataZoomSelectActive","zRender","getZr","dom","canvas","from","getElementsByTagName","at","style","cursor","console","error","_jsxs","className","classnames","Children","map","child","childCallback","onChartReady","props","cloneElement","instance","_jsx","Toolbox","handleTogglePane","isEnabled","handleToggleBrush","handleZoomOut","currentXStep","currentYStep","XStart","XEnd","YStart","YEnd","isXExceeds","isYExceeds","handleZoomIn","targetRange","defaultProps","noop"],"mappings":"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"}
+{"version":3,"file":"EChartsWrapper.js","sources":["../../../../src/components/EChartsWrapper/EChartsWrapper.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  FC,\n  isValidElement,\n  PropsWithChildren,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { noop } from 'lodash';\nimport { EChartsType, SeriesOption } from 'echarts';\nimport { AxisRange, ChartWrapperProps, DataZoomEvent, SeriesDataItem } from './types';\nimport { XAXisOption, YAXisOption } from 'echarts/types/dist/shared';\nimport { makeStyles, useTheme } from '@material-ui/core';\nimport classnames from 'classnames';\n\nimport { Toolbox } from './components/Toolbox/Toolbox';\n\nconst AXIS_ZOOM_STEP_PERCENT = 0.05;\n\nconst useStyles = makeStyles(() => ({\n  container: {\n    position: 'relative',\n    width: '100%',\n    height: '100%',\n  },\n}));\n\nconst EChartsWrapper: FC<PropsWithChildren<ChartWrapperProps>> = ({\n  containerClassName,\n  customToolboxContainerClass,\n  onDataZoom: onDataZoomCustom,\n  toolboxProps,\n  children,\n}) => {\n  const classes = useStyles();\n  const chartRef = useRef<EChartsType | null>(null);\n  const chart = chartRef.current;\n  const theme = useTheme();\n  const [isNeedInitialOptions, setIsNeedInitialOptions] = useState(false);\n  const [isPaneEnabled, setIsPaneEnabled] = useState(false);\n  const [isBrushEnabled, setIsBrushEnabled] = useState(true);\n  const [isZoomed, setIsZoomed] = useState(false);\n  const axisRange = useRef<AxisRange | null>(null);\n  const [currentZoomRange, setCurrentZoomRange] = useState<AxisRange | null>(null);\n\n  const handleZoomChart = (range: AxisRange) => {\n    if (!chart || !axisRange.current) return;\n\n    const options = chart.getOption();\n    const series = options.series as SeriesOption[] | SeriesOption;\n    const isMultipleAxis =\n      (options.xAxis as XAXisOption[])?.length > 1 || (options.yAxis as YAXisOption[])?.length > 1;\n    if (!isMultipleAxis) {\n      const data = (\n        Array.isArray(series)\n          ? series.reduce<unknown[]>((acc, serie) => acc.concat(serie.data), [])\n          : series.data\n      ) as SeriesDataItem[];\n\n      const isDataExists = data.some((dataItem: SeriesDataItem) => {\n        // case when dot structure is [x,y]\n        if (Array.isArray(dataItem)) {\n          return (\n            dataItem[0] > range.x.start &&\n            dataItem[0] < range.x.end &&\n            dataItem[1] > range.y.start &&\n            dataItem[1] < range.y.end\n          );\n        }\n        return (\n          dataItem.x > range.x.start &&\n          dataItem.x < range.x.end &&\n          dataItem.y > range.y.start &&\n          dataItem.y < range.y.end\n        );\n      });\n\n      if (!isDataExists) return;\n    }\n\n    const absoluteXStart = Math.abs(range.x.start - axisRange.current.x.start) * 100;\n    const absoluteXEnd = Math.abs(range.x.end - axisRange.current.x.start) * 100;\n\n    const absoluteYStart = Math.abs(range.y.start - axisRange.current.y.start) * 100;\n    const absoluteYEnd = Math.abs(range.y.end - axisRange.current.y.start) * 100;\n\n    const yStartPercent =\n      absoluteYStart / Math.abs(axisRange.current.y.start - axisRange.current.y.end);\n    const yEndPercent =\n      absoluteYEnd / Math.abs(axisRange.current.y.start - axisRange.current.y.end);\n\n    const xStartPercent =\n      absoluteXStart / Math.abs(axisRange.current.x.start - axisRange.current.x.end);\n    const xEndPercent =\n      absoluteXEnd / Math.abs(axisRange.current.x.start - axisRange.current.x.end);\n\n    chart.dispatchAction({\n      type: 'dataZoom',\n      moveOnMouseMove: isPaneEnabled,\n      filterMode: 'none',\n      rangeMode: ['percent', 'percent'],\n      batch: [\n        { start: +xStartPercent.toFixed(2), end: +xEndPercent.toFixed(2), dataZoomIndex: 0 },\n        {\n          start: +yStartPercent.toFixed(2),\n          end: +yEndPercent.toFixed(2),\n          dataZoomIndex: 1,\n        },\n      ],\n    });\n  };\n\n  const handleSaveAxisRanges = () => {\n    // @ts-ignore\n    const xRange = chart?.getModel()?.getComponent('xAxis', 0)?.axis?.scale?.getExtent() as [\n      xMin: number,\n      xMax: number\n    ];\n    // @ts-ignore\n    const yRange = chart?.getModel()?.getComponent('yAxis', 0)?.axis?.scale?.getExtent() as [\n      yMin: number,\n      yMax: number\n    ];\n\n    if (xRange && yRange) {\n      const [xMin, xMax] = xRange;\n      const [yMin, yMax] = yRange;\n      axisRange.current = {\n        x: {\n          start: +xMin.toFixed(2),\n          end: +xMax.toFixed(2),\n        },\n        y: {\n          start: +yMin.toFixed(2),\n          end: +yMax.toFixed(2),\n        },\n      };\n    }\n  };\n\n  const handleSaveZoomRange = () => {\n    if (!chart) return;\n\n    // getModel is not standardized and documented\n    // https://github.com/apache/echarts/issues/16479#issuecomment-1033349403\n    // @ts-ignore\n    const [yMin, yMax] = chart.getModel().getComponent('yAxis', 0).axis.scale.getExtent();\n    // @ts-ignore\n    const [xMin, xMax] = chart.getModel().getComponent('xAxis', 0).axis.scale.getExtent();\n\n    const range = {\n      x: {\n        start: xMin,\n        end: xMax,\n      },\n      y: {\n        start: yMin,\n        end: yMax,\n      },\n    };\n    setCurrentZoomRange(range);\n    onDataZoomCustom?.(range);\n  };\n\n  const handleZoomIn = (): void => {\n    if (!isZoomed) {\n      handleSaveAxisRanges();\n      setIsZoomed(true);\n    }\n    const targetRange = currentZoomRange || axisRange.current;\n    if (!targetRange) return;\n\n    const currentXStep = Math.abs(targetRange.x.start - targetRange.x.end) * AXIS_ZOOM_STEP_PERCENT;\n    const currentYStep = Math.abs(targetRange.y.start - targetRange.y.end) * AXIS_ZOOM_STEP_PERCENT;\n\n    const XStart = +(targetRange.x.start + currentXStep).toFixed(2);\n    const XEnd = +(targetRange.x.end - currentXStep).toFixed(2);\n\n    const YStart = +(targetRange.y.start + currentYStep).toFixed(2);\n    const YEnd = +(targetRange.y.end - currentYStep).toFixed(2);\n    const isXExceeds = XStart >= XEnd;\n    const isYExceeds = YStart >= YEnd;\n\n    handleZoomChart({\n      x: {\n        start: isXExceeds ? targetRange.x.start : XStart,\n        end: isXExceeds ? targetRange.x.end : XEnd,\n      },\n      y: {\n        start: isYExceeds ? targetRange.y.start : YStart,\n        end: isYExceeds ? targetRange.y.end : YEnd,\n      },\n    });\n  };\n\n  const handleZoomOut = (): void => {\n    if (!axisRange.current || !currentZoomRange) return;\n\n    const currentXStep =\n      Math.abs(axisRange.current.x.start - axisRange.current.x.end) * AXIS_ZOOM_STEP_PERCENT;\n    const currentYStep =\n      Math.abs(axisRange.current.y.start - axisRange.current.y.end) * AXIS_ZOOM_STEP_PERCENT;\n\n    const XStart = +(currentZoomRange.x.start - currentXStep).toFixed(2);\n    const XEnd = +(currentZoomRange.x.end + currentXStep).toFixed(2);\n\n    const YStart = +(currentZoomRange.y.start - currentYStep).toFixed(2);\n    const YEnd = +(currentZoomRange.y.end + currentYStep).toFixed(2);\n\n    const isXExceeds = XStart <= axisRange.current.x.start || XEnd >= axisRange.current.x.end;\n    const isYExceeds = YStart <= axisRange.current.y.start || YEnd >= axisRange.current.y.end;\n\n    if (isXExceeds && isYExceeds) {\n      return handleZoomReset();\n    }\n\n    handleZoomChart({\n      x: isXExceeds\n        ? axisRange.current.x\n        : {\n            start: XStart,\n            end: XEnd,\n          },\n      y: isYExceeds\n        ? axisRange.current.y\n        : {\n            start: YStart,\n            end: YEnd,\n          },\n    });\n  };\n\n  const handleZoomReset = () => {\n    setIsZoomed(false);\n    setIsPaneEnabled(false);\n    setIsBrushEnabled(true);\n    chart?.dispatchAction({\n      type: 'dataZoom',\n      start: 0,\n      end: 100,\n      rangeMode: ['percent', 'percent'],\n    });\n  };\n\n  const onDataZoom = (evt: DataZoomEvent) => {\n    const isResetEvent = evt.start === 0 && evt.end === 100;\n    const isNativeDataZoom = evt.batch?.[0]?.startValue;\n\n    if (isResetEvent) {\n      handleSaveAxisRanges();\n    }\n\n    setIsZoomed(isNativeDataZoom ? true : !isResetEvent);\n\n    handleSaveZoomRange();\n  };\n\n  useEffect(() => {\n    if (!chart) return;\n    if (!isZoomed) {\n      handleSaveAxisRanges();\n    }\n\n    if (isNeedInitialOptions) {\n      chart.setOption(\n        {\n          toolbox: {\n            show: true,\n            width: 0,\n            height: 0,\n            feature: {\n              dataZoom: {\n                show: true,\n                icon: null,\n                brushStyle: {\n                  borderWidth: 0,\n                  opacity: 0.1,\n                  color: theme.palette.primary.light,\n                },\n              },\n            },\n          },\n          dataZoom: [\n            {\n              type: 'inside',\n              xAxisIndex: 'all',\n              filterMode: 'none',\n              zoomOnMouseWheel: false,\n              moveOnMouseMove: false,\n            },\n            {\n              type: 'inside',\n              yAxisIndex: 'all',\n              filterMode: 'none',\n              zoomOnMouseWheel: false,\n              moveOnMouseMove: false,\n            },\n          ],\n        },\n        { replaceMerge: 'dataZoom' }\n      );\n      chart.on('dataZoom', onDataZoom as (...args: unknown[]) => void);\n      setIsNeedInitialOptions(false);\n      chart.dispatchAction({\n        type: 'takeGlobalCursor',\n        key: 'dataZoomSelect',\n        dataZoomSelectActive: true,\n      });\n    }\n  }, [chart, isNeedInitialOptions, isZoomed]);\n\n  useEffect(() => {\n    // cursor grab in pane mode works only for canvas renderer\n    const zRender = chart?.getZr();\n    if (zRender?.dom) {\n      const canvas = Array.from(zRender.dom.getElementsByTagName('canvas')).at(\n        -1\n      ) as HTMLCanvasElement;\n      if (canvas) {\n        canvas.style.cursor = isPaneEnabled ? 'grab' : isBrushEnabled ? 'crosshair' : 'default';\n      } else {\n        console.error('Canvas not found');\n      }\n    }\n  }, [chart, isPaneEnabled, isBrushEnabled]);\n\n  useEffect(() => {\n    if (!chart) return;\n    chart.setOption({\n      dataZoom: [\n        {\n          type: 'inside',\n          xAxisIndex: 'all',\n          filterMode: 'none',\n          zoomOnMouseWheel: false,\n          moveOnMouseMove: isPaneEnabled,\n        },\n        {\n          type: 'inside',\n          yAxisIndex: 'all',\n          filterMode: 'none',\n          zoomOnMouseWheel: false,\n          moveOnMouseMove: isPaneEnabled,\n        },\n      ],\n    });\n  }, [isPaneEnabled]);\n\n  useEffect(() => {\n    chart?.dispatchAction({\n      type: 'takeGlobalCursor',\n      key: 'dataZoomSelect',\n      dataZoomSelectActive: isBrushEnabled,\n    });\n  }, [isBrushEnabled]);\n\n  const onChartReadyExtended =\n    (childCallback?: (instance: EChartsType) => any) => (instance: EChartsType) => {\n      if (childCallback) {\n        childCallback(instance);\n      }\n      setIsNeedInitialOptions(true);\n      chartRef.current = instance;\n    };\n\n  return (\n    <div className={classnames(classes.container, containerClassName)}>\n      {Children.map(children, child => {\n        if (!isValidElement(child)) return child;\n\n        const { onChartReady } = child.props;\n\n        return cloneElement(child, {\n          onChartReady: onChartReadyExtended(onChartReady),\n        });\n      })}\n      <Toolbox\n        {...toolboxProps}\n        handleTogglePane={isEnabled => setIsPaneEnabled(isEnabled)}\n        handleToggleBrush={isEnabled => setIsBrushEnabled(isEnabled)}\n        isPaneEnabled={isPaneEnabled}\n        isBrushEnabled={isBrushEnabled}\n        isZoomed={isZoomed}\n        chart={chart}\n        handleZoomReset={handleZoomReset}\n        handleZoomOut={handleZoomOut}\n        handleZoomIn={handleZoomIn}\n        customToolboxContainerClass={classnames(\n          toolboxProps?.customToolboxContainerClass,\n          customToolboxContainerClass\n        )}\n      />\n    </div>\n  );\n};\n\nEChartsWrapper.defaultProps = {\n  onDataZoom: noop,\n};\n\nexport default EChartsWrapper;\n"],"names":["useStyles","makeStyles","container","position","width","height","EChartsWrapper","_ref","containerClassName","customToolboxContainerClass","onDataZoomCustom","onDataZoom","toolboxProps","children","classes","chartRef","useRef","chart","current","theme","useTheme","useState","_useState2","_slicedToArray","_useState","isNeedInitialOptions","setIsNeedInitialOptions","_useState4","_useState3","isPaneEnabled","setIsPaneEnabled","_useState6","_useState5","isBrushEnabled","setIsBrushEnabled","_useState8","_useState7","isZoomed","setIsZoomed","axisRange","_useState10","_useState9","currentZoomRange","setCurrentZoomRange","handleZoomChart","range","_options$xAxis","_options$yAxis","options","getOption","series","xAxis","length","yAxis","Array","isArray","reduce","acc","serie","concat","data","some","dataItem","x","start","end","y","absoluteXStart","Math","abs","absoluteXEnd","absoluteYStart","absoluteYEnd","yStartPercent","yEndPercent","xStartPercent","xEndPercent","dispatchAction","type","moveOnMouseMove","filterMode","rangeMode","batch","toFixed","dataZoomIndex","handleSaveAxisRanges","_chart$getModel","_chart$getModel$getCo","_chart$getModel$getCo2","_chart$getModel$getCo3","_chart$getModel2","_chart$getModel2$getC","_chart$getModel2$getC2","_chart$getModel2$getC3","xRange","getModel","getComponent","axis","scale","getExtent","yRange","_xRange","xMin","xMax","_yRange","yMin","yMax","handleZoomReset","evt","_evt$batch","_evt$batch$","isResetEvent","isNativeDataZoom","startValue","_chart$getModel$getCo4","_chart$getModel$getCo5","_chart$getModel$getCo6","_chart$getModel$getCo7","handleSaveZoomRange","useEffect","setOption","toolbox","show","feature","dataZoom","icon","brushStyle","borderWidth","opacity","color","palette","primary","light","xAxisIndex","zoomOnMouseWheel","yAxisIndex","replaceMerge","on","key","dataZoomSelectActive","zRender","getZr","dom","canvas","from","getElementsByTagName","at","style","cursor","console","error","_jsxs","className","classnames","Children","map","child","isValidElement","childCallback","onChartReady","props","cloneElement","instance","_jsx","Toolbox","handleTogglePane","isEnabled","handleToggleBrush","handleZoomOut","currentXStep","currentYStep","XStart","XEnd","YStart","YEnd","isXExceeds","isYExceeds","handleZoomIn","targetRange","defaultProps","noop"],"mappings":"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"}

package/cjs-bundle/components/FeedItem/feedItemTypes/SurveyStationFeedItem/index.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("@babel/runtime/helpers/asyncToGenerator"),t=require("@babel/runtime/helpers/slicedToArray"),r=require("@babel/runtime/regenerator"),a=require("react"),i=require("prop-types"),u=require("@material-ui/core"),s=require("./components/AccuracyPlan.js"),n=require("./components/ActualPointInfo.js"),l=require("./components/Warning.js"),d=require("./api.js"),o=require("../../../LoadingIndicator/LoadingIndicator.js"),c=require("react/jsx-runtime");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=p(e),v=p(t),f=p(r),q=u.makeStyles({wrapper:{display:"flex",flexWrap:"wrap"}}),h=function(e){var t,r,i,u=e.feedItem,p=q(),h=a.useState(!1),x=v.default(h,2),y=x[0],j=x[1],b=a.useState(!1),R=v.default(b,2),w=R[0],S=R[1],_=a.useState(null),g=v.default(_,2),I=g[0],A=g[1],T=a.useState(""),P=v.default(T,2),W=P[0],k=P[1],D=a.useState(""),L=v.default(D,2),N=L[0],z=L[1],C=a.useState(null),E=v.default(C,2),G=E[0],B=E[1],F="active"===(null===(t=u.context)||void 0===t||null===(r=t.survey_station)||void 0===r||null===(i=r.well)||void 0===i?void 0:i.status);return a.useEffect(m.default(f.default.mark((function e(){var t,r,a,i,s,n,l,o,c,p,m,v,q,h;return f.default.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return n=null===(t=u.well)||void 0===t?void 0:t.id,l=null===(r=u.context)||void 0===r||null===(a=r.survey_station)||void 0===a||null===(i=a.data)||void 0===i?void 0:i.measured_depth,e.next=4,d.fetchDirectionalAccuracyRecords({wellId:n,md:l});case 4:o=e.sent,c=null==o||null===(s=o[0])||void 0===s?void 0:s.data,j(!0),c&&(m=c.accuracy,v=c.cumulative_tvd_change||"",q=c.plan_name||"",h=null===(p=o[0])||void 0===p?void 0:p.timestamp,S(!0),A(m),k(v),z(q),B(h));case 8:case"end":return e.stop()}}),e)}))),[]),y?c.jsxs("div",{className:p.wrapper,children:[w?c.jsx(s,{accuracyData:I,cumulativeTvdChange:W,initialPlanName:N,timestamp:G}):c.jsx(l,{isWellStatusActive:F}),c.jsx(n,{feedItem:u})]}):c.jsx(o,{})};h.propTypes={feedItem:i.shape({context:i.shape({survey_station:i.shape({data:i.shape({azimuth:i.number.isRequired,inclination:i.number.isRequired,measured_depth:i.number.isRequired}).isRequired,well:i.shape({status:i.string.isRequired}).isRequired}).isRequired}).isRequired}).isRequired},module.exports=h;
+"use strict";var e=require("@babel/runtime/helpers/asyncToGenerator"),t=require("@babel/runtime/helpers/slicedToArray"),r=require("@babel/runtime/regenerator"),a=require("react"),u=require("prop-types"),i=require("@material-ui/core"),n=require("./components/AccuracyPlan.js"),s=require("./components/ActualPointInfo.js"),l=require("./components/Warning.js"),d=require("./api.js"),o=require("../../../LoadingIndicator/LoadingIndicator.js"),c=require("react/jsx-runtime");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=p(e),m=p(t),v=p(r),q=i.makeStyles({wrapper:{display:"flex",flexWrap:"wrap"}}),h=function(e){var t,r,u,i=e.feedItem,p=q(),h=a.useState(!1),x=m.default(h,2),y=x[0],b=x[1],j=a.useState(!1),R=m.default(j,2),w=R[0],S=R[1],_=a.useState(null),g=m.default(_,2),I=g[0],A=g[1],T=a.useState(""),k=m.default(T,2),P=k[0],W=k[1],D=a.useState(""),L=m.default(D,2),N=L[0],z=L[1],C=a.useState(null),E=m.default(C,2),G=E[0],B=E[1],F="active"===(null===(t=i.context)||void 0===t||null===(r=t.survey_station)||void 0===r||null===(u=r.well)||void 0===u?void 0:u.status);return a.useEffect((function(){var e,t=!1,r=(e=f.default(v.default.mark((function e(){var r,a,u,n,s,l,o,c,p,f,m,q,h,x;return v.default.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return l=null===(r=i.well)||void 0===r?void 0:r.id,o=null===(a=i.context)||void 0===a||null===(u=a.survey_station)||void 0===u||null===(n=u.data)||void 0===n?void 0:n.measured_depth,e.next=4,d.fetchDirectionalAccuracyRecords({wellId:l,md:o});case 4:if(c=e.sent,!t){e.next=7;break}return e.abrupt("return");case 7:p=null==c||null===(s=c[0])||void 0===s?void 0:s.data,b(!0),p&&(m=p.accuracy,q=p.cumulative_tvd_change||"",h=p.plan_name||"",x=null===(f=c[0])||void 0===f?void 0:f.timestamp,S(!0),A(m),W(q),z(h),B(x));case 10:case"end":return e.stop()}}),e)}))),function(){return e.apply(this,arguments)});return r(),function(){t=!0}}),[]),y?c.jsxs("div",{className:p.wrapper,children:[w?c.jsx(n,{accuracyData:I,cumulativeTvdChange:P,initialPlanName:N,timestamp:G}):c.jsx(l,{isWellStatusActive:F}),c.jsx(s,{feedItem:i})]}):c.jsx(o,{})};h.propTypes={feedItem:u.shape({context:u.shape({survey_station:u.shape({data:u.shape({azimuth:u.number.isRequired,inclination:u.number.isRequired,measured_depth:u.number.isRequired}).isRequired,well:u.shape({status:u.string.isRequired}).isRequired}).isRequired}).isRequired}).isRequired},module.exports=h;
 //# sourceMappingURL=index.js.map

package/cjs-bundle/components/FeedItem/feedItemTypes/SurveyStationFeedItem/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../src/components/FeedItem/feedItemTypes/SurveyStationFeedItem/index.js"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { shape, number, string } from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\n\nimport AccuracyPlan from './components/AccuracyPlan';\nimport ActualPointInfo from './components/ActualPointInfo';\nimport Warning from './components/Warning';\nimport { fetchDirectionalAccuracyRecords } from './api';\n\nimport LoadingIndicator from '~/components/LoadingIndicator';\n\nconst useStyles = makeStyles({\n  wrapper: {\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n});\n\nconst SurveyStationFeedItem = ({ feedItem }) => {\n  const classes = useStyles();\n\n  const [isAccuracyRecordLoaded, setIsAccuracyRecordLoaded] = useState(false);\n  const [isAccuracyRecordPresent, setIsAccuracyRecordPresent] = useState(false);\n  const [accuracyData, setAccuracyData] = useState(null);\n  const [cumulativeTvdChange, setCumulativeTvdChange] = useState('');\n  const [initialPlanName, setInitialPlanName] = useState('');\n  const [timestamp, setTimestamp] = useState(null);\n\n  const isWellStatusActive = feedItem.context?.survey_station?.well?.status === 'active';\n\n  useEffect(async () => {\n    const wellId = feedItem.well?.id;\n    const md = feedItem.context?.survey_station?.data?.measured_depth;\n\n    const records = await fetchDirectionalAccuracyRecords({ wellId, md });\n\n    const directionalAccuracyData = records?.[0]?.data;\n\n    setIsAccuracyRecordLoaded(true);\n\n    if (directionalAccuracyData) {\n      const accuracyData = directionalAccuracyData.accuracy;\n      const cumulativeTvdChange = directionalAccuracyData.cumulative_tvd_change || '';\n      const initialPlanName = directionalAccuracyData.plan_name || '';\n      const recordTimestamp = records[0]?.timestamp;\n\n      setIsAccuracyRecordPresent(true);\n      setAccuracyData(accuracyData);\n      setCumulativeTvdChange(cumulativeTvdChange);\n      setInitialPlanName(initialPlanName);\n      setTimestamp(recordTimestamp);\n    }\n  }, []);\n\n  if (!isAccuracyRecordLoaded) return <LoadingIndicator />;\n\n  return (\n    <div className={classes.wrapper}>\n      {isAccuracyRecordPresent ? (\n        <AccuracyPlan\n          accuracyData={accuracyData}\n          cumulativeTvdChange={cumulativeTvdChange}\n          initialPlanName={initialPlanName}\n          timestamp={timestamp}\n        />\n      ) : (\n        <Warning isWellStatusActive={isWellStatusActive} />\n      )}\n      <ActualPointInfo feedItem={feedItem} />\n    </div>\n  );\n};\n\nSurveyStationFeedItem.propTypes = {\n  feedItem: shape({\n    context: shape({\n      survey_station: shape({\n        data: shape({\n          azimuth: number.isRequired,\n          inclination: number.isRequired,\n          measured_depth: number.isRequired,\n        }).isRequired,\n        well: shape({\n          status: string.isRequired,\n        }).isRequired,\n      }).isRequired,\n    }).isRequired,\n  }).isRequired,\n};\n\nexport default SurveyStationFeedItem;\n"],"names":["useStyles","makeStyles","wrapper","display","flexWrap","SurveyStationFeedItem","_ref","_feedItem$context","_feedItem$context$sur","_feedItem$context$sur2","feedItem","classes","useState","_useState2","_slicedToArray","_useState","isAccuracyRecordLoaded","setIsAccuracyRecordLoaded","_useState4","_useState3","isAccuracyRecordPresent","setIsAccuracyRecordPresent","_useState6","_useState5","accuracyData","setAccuracyData","_useState8","_useState7","cumulativeTvdChange","setCumulativeTvdChange","_useState10","_useState9","initialPlanName","setInitialPlanName","_useState12","_useState11","timestamp","setTimestamp","isWellStatusActive","context","survey_station","well","status","useEffect","_asyncToGenerator","_regeneratorRuntime","mark","_callee","_feedItem$well","_feedItem$context2","_feedItem$context2$su","_feedItem$context2$su2","_records$","wellId","md","records","directionalAccuracyData","_records$2","_accuracyData","_cumulativeTvdChange","_initialPlanName","recordTimestamp","wrap","_context","prev","next","id","data","measured_depth","fetchDirectionalAccuracyRecords","sent","accuracy","cumulative_tvd_change","plan_name","stop","_jsxs","className","children","_jsx","jsx","AccuracyPlan","Warning","ActualPointInfo","LoadingIndicator","propTypes","shape","azimuth","number","isRequired","inclination","string"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/FeedItem/feedItemTypes/SurveyStationFeedItem/index.js"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { shape, number, string } from 'prop-types';\nimport { makeStyles } from '@material-ui/core';\n\nimport AccuracyPlan from './components/AccuracyPlan';\nimport ActualPointInfo from './components/ActualPointInfo';\nimport Warning from './components/Warning';\nimport { fetchDirectionalAccuracyRecords } from './api';\n\nimport LoadingIndicator from '~/components/LoadingIndicator';\n\nconst useStyles = makeStyles({\n  wrapper: {\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n});\n\nconst SurveyStationFeedItem = ({ feedItem }) => {\n  const classes = useStyles();\n\n  const [isAccuracyRecordLoaded, setIsAccuracyRecordLoaded] = useState(false);\n  const [isAccuracyRecordPresent, setIsAccuracyRecordPresent] = useState(false);\n  const [accuracyData, setAccuracyData] = useState(null);\n  const [cumulativeTvdChange, setCumulativeTvdChange] = useState('');\n  const [initialPlanName, setInitialPlanName] = useState('');\n  const [timestamp, setTimestamp] = useState(null);\n\n  const isWellStatusActive = feedItem.context?.survey_station?.well?.status === 'active';\n\n  useEffect(() => {\n    let ignore = false;\n\n    const loadAccuracyRecords = async () => {\n      const wellId = feedItem.well?.id;\n      const md = feedItem.context?.survey_station?.data?.measured_depth;\n\n      const records = await fetchDirectionalAccuracyRecords({ wellId, md });\n\n      if (ignore) return;\n\n      const directionalAccuracyData = records?.[0]?.data;\n\n      setIsAccuracyRecordLoaded(true);\n\n      if (directionalAccuracyData) {\n        const accuracyData = directionalAccuracyData.accuracy;\n        const cumulativeTvdChange = directionalAccuracyData.cumulative_tvd_change || '';\n        const initialPlanName = directionalAccuracyData.plan_name || '';\n        const recordTimestamp = records[0]?.timestamp;\n\n        setIsAccuracyRecordPresent(true);\n        setAccuracyData(accuracyData);\n        setCumulativeTvdChange(cumulativeTvdChange);\n        setInitialPlanName(initialPlanName);\n        setTimestamp(recordTimestamp);\n      }\n    };\n\n    loadAccuracyRecords();\n\n    return () => {\n      ignore = true;\n    };\n  }, []);\n\n  if (!isAccuracyRecordLoaded) return <LoadingIndicator />;\n\n  return (\n    <div className={classes.wrapper}>\n      {isAccuracyRecordPresent ? (\n        <AccuracyPlan\n          accuracyData={accuracyData}\n          cumulativeTvdChange={cumulativeTvdChange}\n          initialPlanName={initialPlanName}\n          timestamp={timestamp}\n        />\n      ) : (\n        <Warning isWellStatusActive={isWellStatusActive} />\n      )}\n      <ActualPointInfo feedItem={feedItem} />\n    </div>\n  );\n};\n\nSurveyStationFeedItem.propTypes = {\n  feedItem: shape({\n    context: shape({\n      survey_station: shape({\n        data: shape({\n          azimuth: number.isRequired,\n          inclination: number.isRequired,\n          measured_depth: number.isRequired,\n        }).isRequired,\n        well: shape({\n          status: string.isRequired,\n        }).isRequired,\n      }).isRequired,\n    }).isRequired,\n  }).isRequired,\n};\n\nexport default SurveyStationFeedItem;\n"],"names":["useStyles","makeStyles","wrapper","display","flexWrap","SurveyStationFeedItem","_ref","_feedItem$context","_feedItem$context$sur","_feedItem$context$sur2","feedItem","classes","useState","_useState2","_slicedToArray","_useState","isAccuracyRecordLoaded","setIsAccuracyRecordLoaded","_useState4","_useState3","isAccuracyRecordPresent","setIsAccuracyRecordPresent","_useState6","_useState5","accuracyData","setAccuracyData","_useState8","_useState7","cumulativeTvdChange","setCumulativeTvdChange","_useState10","_useState9","initialPlanName","setInitialPlanName","_useState12","_useState11","timestamp","setTimestamp","isWellStatusActive","context","survey_station","well","status","useEffect","_ref2","ignore","loadAccuracyRecords","_asyncToGenerator","_regeneratorRuntime","mark","_callee","_feedItem$well","_feedItem$context2","_feedItem$context2$su","_feedItem$context2$su2","_records$","wellId","md","records","directionalAccuracyData","_records$2","_accuracyData","_cumulativeTvdChange","_initialPlanName","recordTimestamp","wrap","_context","prev","next","id","data","measured_depth","fetchDirectionalAccuracyRecords","sent","abrupt","accuracy","cumulative_tvd_change","plan_name","stop","apply","this","arguments","_jsxs","className","children","_jsx","jsx","AccuracyPlan","Warning","ActualPointInfo","LoadingIndicator","propTypes","shape","azimuth","number","isRequired","inclination","string"],"mappings":"ujBAWMA,EAAYC,EAAAA,WAAW,CAC3BC,QAAS,CACPC,QAAS,OACTC,SAAU,UAIRC,EAAwB,SAAkBC,GAAA,IAAAC,EAAAC,EAAAC,EAAfC,IAAAA,SACzBC,EAAUX,IAE4CY,EAAAA,EAAQA,UAAC,GAAMC,EAAAC,EAAAA,QAAAC,EAAA,GAApEC,EAAsBH,EAAA,GAAEI,EAAyBJ,EAAA,GACMD,EAAAA,EAAQA,UAAC,GAAMM,EAAAJ,EAAAA,QAAAK,EAAA,GAAtEC,EAAuBF,EAAA,GAAEG,EAA0BH,EAAA,GAClBN,EAAAA,EAAQA,SAAC,MAAKU,EAAAR,EAAAA,QAAAS,EAAA,GAA/CC,EAAYF,EAAA,GAAEG,EAAeH,EAAA,GACkBV,EAAAA,EAAQA,SAAC,IAAGc,EAAAZ,EAAAA,QAAAa,EAAA,GAA3DC,EAAmBF,EAAA,GAAEG,EAAsBH,EAAA,GACJd,EAAAA,EAAQA,SAAC,IAAGkB,EAAAhB,EAAAA,QAAAiB,EAAA,GAAnDC,EAAeF,EAAA,GAAEG,EAAkBH,EAAA,GACRlB,EAAAA,EAAQA,SAAC,MAAKsB,EAAApB,EAAAA,QAAAqB,EAAA,GAAzCC,EAASF,EAAA,GAAEG,EAAYH,EAAA,GAExBI,EAAwE,YAAnD,QAAA/B,EAAAG,EAAS6B,eAAT,IAAAhC,GAAgC,QAAhCC,EAAAD,EAAkBiC,sBAAc,IAAAhC,GAAM,QAANC,EAAhCD,EAAkCiC,YAAI,IAAAhC,OAAtC,EAAAA,EAAwCiC,QAsCnE,OApCAC,EAAAA,WAAU,WACR,IAE4BC,EAFxBC,GAAS,EAEPC,GAAsBF,EAAAG,EAAA,QAAAC,EAAA,QAAAC,MAAA,SAAAC,IAAA,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAA,OAAAhB,UAAAiB,MAAA,SAAAC,GAAA,OAAA,OAAAA,EAAAC,KAAAD,EAAAE,MAAA,KAAA,EAEuC,OAD3DZ,EAAsB,UAAb9C,EAAS+B,YAAI,IAAAU,OAAA,EAAbA,EAAekB,GACxBZ,EAAK,QAAA/C,EAAAA,EAAS6B,eAAT,IAAAa,GAAgC,QAAhCC,EAAAD,EAAkBZ,sBAAc,IAAAa,GAAhC,QAAgCC,EAAhCD,EAAkCiB,YAAlC,IAAAhB,OAAA,EAAAA,EAAwCiB,eAAcL,EAAAE,KAAA,EAE3CI,kCAAgC,CAAEhB,OAAAA,EAAQC,GAAAA,IAAK,KAAA,EAAxD,GAAPC,EAAOQ,EAAAO,MAET5B,EAAM,CAAAqB,EAAAE,KAAA,EAAA,KAAA,CAAA,OAAAF,EAAAQ,OAAA,UAAA,KAAA,EAEJf,EAA0BD,SAAA,QAAOH,EAAPG,EAAU,UAAV,IAAAH,OAAO,EAAPA,EAAce,KAE9CrD,GAA0B,GAEtB0C,IACInC,EAAemC,EAAwBgB,SACvC/C,EAAsB+B,EAAwBiB,uBAAyB,GACvE5C,EAAkB2B,EAAwBkB,WAAa,GACvDb,EAA4B,UAAVN,EAAQ,UAAE,IAAAE,OAAA,EAAVA,EAAYxB,UAEpCf,GAA2B,GAC3BI,EAAgBD,GAChBK,EAAuBD,GACvBK,EAAmBD,GACnBK,EAAa2B,IACd,KAAA,GAAA,IAAA,MAAA,OAAAE,EAAAY,OAAA,GAAA5B,EACF,KAAA,WAxBwB,OAAAN,EAAAmC,MAAAC,KAAAC,UAAA,GA4BzB,OAFAnC,IAEO,WACLD,GAAS,EAEZ,GAAE,IAEE7B,EAGHkE,EAAAA,KAAA,MAAA,CAAKC,UAAWxE,EAAQT,QAAQkF,SAC7BhE,CAAAA,EACCiE,EAAAC,IAACC,EAAY,CACX/D,aAAcA,EACdI,oBAAqBA,EACrBI,gBAAiBA,EACjBI,UAAWA,IAGbiD,MAACG,EAAO,CAAClD,mBAAoBA,IAE/B+C,MAACI,EAAe,CAAC/E,SAAUA,OAdK2E,EAAAC,IAACI,EAAmB,CAAA,EAiB1D,EAEArF,EAAsBsF,UAAY,CAChCjF,SAAUkF,EAAAA,MAAM,CACdrD,QAASqD,EAAAA,MAAM,CACbpD,eAAgBoD,EAAAA,MAAM,CACpBtB,KAAMsB,EAAAA,MAAM,CACVC,QAASC,EAAMA,OAACC,WAChBC,YAAaF,EAAMA,OAACC,WACpBxB,eAAgBuB,EAAMA,OAACC,aACtBA,WACHtD,KAAMmD,EAAAA,MAAM,CACVlD,OAAQuD,EAAMA,OAACF,aACdA,aACFA,aACFA,aACFA"}

package/cjs-bundle/components/OffsetWellMap/OffsetWellMap.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("@babel/runtime/helpers/defineProperty"),r=require("@babel/runtime/helpers/slicedToArray"),t=require("react"),l=require("react-dom"),i=require("lodash"),o=require("classnames"),c=require("@material-ui/core"),u=require("@material-ui/icons");require("mapbox-gl/dist/mapbox-gl.css");var n=require("./effects/usePreviousWells.js"),s=require("./WellTooltip.js"),a=require("./utils.js"),d=require("./OffsetWellMap.module.css.js");require("../../config/mapboxGl/index.js");var f=require("../../config/mapbox/index.js"),v=require("../../utils/index.js"),h=require("react/jsx-runtime"),m=require("mapbox-gl");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=g(e),y=g(r),w=g(l),b=g(o),j=g(m),x=v.mapbox.isValidCoordinates,W=[29.749907,-95.358421],q={type:"FeatureCollection",features:[]},F=["==",["id"],-1],B=function(e){var r=y.default(e,2),t=r[0];return[r[1],t]},C=function(e,r){for(var t=y.default(e,2),l=t[0],i=t[1],o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:64,c=r/(111320*Math.cos(l*Math.PI/180)),u=r/110574,n=[],s=0;s<=o;s+=1){var a=s/o*2*Math.PI;n.push([i+c*Math.cos(a),l+u*Math.sin(a)])}return{type:"Polygon",coordinates:[n]}};module.exports=function(e){var r=e.isViewOnly,l=e.subjectWell,o=void 0===l?null:l,v=e.wells,m=e.offsetWellIds,g=e.radius,E=e.handleChanageOffsetWell,M=e.handleChangeOffsetWell,L=void 0===M?E:M,S=e.activeWellId,D=e.isClickable,O=void 0===D||D,P=e.classes,k=void 0===P?{}:P,R=t.useMemo((function(){return o&&i.get(o,"topHole.coordinates")}),[o]),I=t.useMemo((function(){return a.getAllFormations(v)}),[v]),T=t.useRef(),z=t.useRef(),Z=t.useRef(),N=t.useRef(null),A=t.useRef(null),V=t.useRef(),G=t.useRef(new Map),H=t.useRef(null),_=t.useRef(null),X=t.useState(!1),J=y.default(X,2),K=J[0],Q=J[1],U=(null==o?void 0:o.id)===S,Y=n.usePreviousWells(v),$=t.useState(!1),ee=y.default($,2),re=ee[0],te=ee[1],le=t.useState(3),ie=y.default(le,2),oe=ie[0],ce=ie[1];t.useEffect((function(){if(f.IS_MAPBOX_ENABLED){var e=new j.default.Map({container:T.current,style:"mapbox://styles/mapbox/dark-v9",center:B(W),zoom:3,maxZoom:18,attributionControl:!1,scrollZoom:!1,doubleClickZoom:!1});return z.current=e,e.on("zoomend",(function(){return ce(Math.round(e.getZoom()))})),e.on("load",(function(){e.addSource("radius-circle",{type:"geojson",data:q}),e.addLayer({id:"radius-circle-fill",type:"fill",source:"radius-circle",paint:{"fill-color":"#03BCD4","fill-opacity":.2}}),e.addSource("wells",{type:"geojson",data:q}),e.addLayer({id:"wells-halo",type:"circle",source:"wells",filter:["==",["get","isOffsetWell"],!0],paint:{"circle-radius":12,"circle-color":["get","color"],"circle-opacity":.08}}),e.addLayer({id:"wells-circle",type:"circle",source:"wells",layout:{"circle-sort-key":["get","order"]},paint:{"circle-radius":5,"circle-color":["get","color"],"circle-opacity":["get","opacity"]}}),e.addLayer({id:"wells-active-highlight",type:"circle",source:"wells",filter:["==",["get","isActive"],!0],paint:{"circle-radius":12,"circle-color":["get","color"],"circle-opacity":.24}}),e.addLayer({id:"wells-hover-highlight",type:"circle",source:"wells",filter:F,paint:{"circle-radius":["case",["get","isSubjectWell"],5,12],"circle-color":["case",["get","isSubjectWell"],"#63EFFF",["get","color"]],"circle-opacity":.24}}),te(!0)})),function(){e.remove(),z.current=null,Z.current=null,V.current=null,N.current=null,A.current=null}}}),[]),t.useEffect((function(){var e,r,t,l,i,o,c;N.current=R&&g?(e=R,r=1609.34*g,t=y.default(e,2),l=t[0],i=t[1],o=r/(111320*Math.cos(l*Math.PI/180)),[[i-o,l-(c=r/110574)],[i+o,l+c]]):null;var u=z.current;u&&re&&u.getSource("radius-circle").setData(R&&g?{type:"Feature",properties:{},geometry:C(R,1609.34*g)}:q)}),[g,R,re]);var ue=function(e,l,o,c){var u=document.createElement("div"),n=t.createElement(s.WellTooltip(),{isViewOnly:r,well:e,color:i.get(I,e.formation,"#BDBDBD"),isOffsetWell:l,isSubjectWell:o,isClickable:O});w.default.render(h.jsx(h.Fragment,{children:n}),u),Z.current||(Z.current=new j.default.Popup({closeButton:!1,offset:12})),Z.current.setLngLat(B(c)).setDOMContent(u).addTo(z.current)};t.useEffect((function(){var e=z.current;e&&re&&e.setPaintProperty("wells-circle","circle-color",K?["case",["get","isSubjectWell"],"#63EFFF",["get","color"]]:["get","color"])}),[K,re]),t.useEffect((function(){var e;if(v&&m){null===(e=Z.current)||void 0===e||e.remove();var t=[],l=[];v.forEach((function(e){e.id!==(null==o?void 0:o.id)&&(m.includes(e.id)?t.push(e):l.push(e))}));var c=[].concat(l,t,[o]),u=[],n=new j.default.LngLatBounds;G.current.clear(),H.current=null,c.forEach((function(e,r){var t,l=null==e||null===(t=e.topHole)||void 0===t?void 0:t.coordinates;if(l&&x(l)){var c=(null==o?void 0:o.id)===e.id,s=m.includes(e.id)&&!c,a=c?"#03BCD4":i.get(I,e.formation,"#BDBDBD"),d=s?.7:.3;u.push({type:"Feature",id:r,geometry:{type:"Point",coordinates:B(l)},properties:{color:a,opacity:c?1:d,isSubjectWell:c,isOffsetWell:s,isActive:e.id===S&&!U,order:r}}),G.current.set(r,{well:e,coords:l,isOffsetWell:s,isSubjectWell:c}),c&&(H.current=r),n.extend(B(l))}})),A.current=u.length?n:null;var s=z.current;if(s&&re){s.getSource("wells").setData({type:"FeatureCollection",features:u}),s.setFilter("wells-hover-highlight",F),_.current=null;var a=function(e){var r,t=null===(r=e.features)||void 0===r?void 0:r[0];if(t&&_.current!==t.id){var l=G.current.get(t.id);l&&(_.current=t.id,s.getCanvas().style.cursor="pointer",s.setFilter("wells-hover-highlight",["==",["id"],t.id]),ue(l.well,l.isOffsetWell,l.isSubjectWell,l.coords),l.isSubjectWell&&Q(!0))}},d=function(e){var r;if(null==e||!e.point||!s.queryRenderedFeatures(e.point,{layers:["wells-circle","wells-hover-highlight"]}).length){var t=null!==_.current&&_.current===H.current;_.current=null,s.getCanvas().style.cursor="",s.setFilter("wells-hover-highlight",F),null===(r=Z.current)||void 0===r||r.remove(),t&&Q(!1)}},f=function(e){var t,l;if(!r){var i=G.current.get(null===(t=e.features)||void 0===t||null===(l=t[0])||void 0===l?void 0:l.id);i&&L(i.well,!i.isOffsetWell)}};return s.on("mousemove","wells-circle",a),s.on("mouseleave","wells-circle",d),s.on("mouseleave","wells-hover-highlight",d),s.on("click","wells-circle",f),setTimeout((function(){g<3e3&&z.current&&N.current&&v!==Y&&z.current.fitBounds(N.current,{padding:5})}),500),function(){s.off("mousemove","wells-circle",a),s.off("mouseleave","wells-circle",d),s.off("mouseleave","wells-hover-highlight",d),s.off("click","wells-circle",f)}}}}),[o,v,m,S,re]),t.useEffect((function(){var e=z.current;if(V.current&&(V.current.remove(),V.current=null),e&&R){var r=K||U,t=document.createElement("img");t.src=r?"/static/media/5e9c4959259cb12c11b2c5eaf27eb3ad.svg":"/static/media/9efe5882f31d2f22bd57af92069d0a3e.svg";var l=r?[70,20]:[62,12],i=y.default(l,2),c=i[0],u=i[1],n=r?[35,29]:[31,25],s=y.default(n,2),a=s[0],d=s[1];t.width=c,t.height=u,t.addEventListener("mouseover",(function(){Q(!0),null!==H.current&&e.getLayer("wells-hover-highlight")&&(_.current=H.current,e.setFilter("wells-hover-highlight",["==",["id"],H.current])),ue(o,!1,!0,R)})),t.addEventListener("mouseout",(function(){var r;_.current=null,e.getLayer("wells-hover-highlight")&&e.setFilter("wells-hover-highlight",F),null===(r=Z.current)||void 0===r||r.remove(),Q(!1)})),V.current=new j.default.Marker({element:t,anchor:"center",offset:[c/2-a,u/2-d]}).setLngLat(B(R)).addTo(e)}}),[K,R,g,o,U]),t.useEffect((function(){var e;g>3e3?null===(e=z.current)||void 0===e||e.setZoom(1):setTimeout((function(){o?z.current&&N.current&&g&&z.current.fitBounds(N.current,{padding:5}):z.current&&A.current&&z.current.fitBounds(A.current),R&&z.current&&z.current.easeTo({center:B(R),duration:700})}),500)}),[g,o,R]);var ne=function(){var e;null===(e=z.current)||void 0===e||e.setZoom(oe+1)};return h.jsx("div",{className:b.default(d.mapView,k.root),children:h.jsx("div",{className:b.default(d.mapMain,k.map),ref:T,onDoubleClick:ne,children:h.jsxs("div",{className:d.zoomGroup,children:[h.jsx(c.Tooltip,{title:oe<18?"Zoom in":"",placement:"left",children:h.jsx("div",{className:b.default(d.zoomButton,p.default({},d.zoomDisabled,18===oe)),onClick:ne,children:h.jsx(u.Add,{className:d.zoomInOutIcon})})}),h.jsx(c.Tooltip,{title:oe>1?"Zoom out":"",placement:"left",children:h.jsx("div",{className:b.default(d.zoomButton,p.default({},d.zoomDisabled,1===oe)),onClick:function(){var e;oe>1&&(null===(e=z.current)||void 0===e||e.setZoom(oe-1))},children:h.jsx(u.Remove,{className:d.zoomInOutIcon})})})]})})})};
+"use strict";var e=require("@babel/runtime/helpers/defineProperty"),r=require("@babel/runtime/helpers/slicedToArray"),t=require("react"),l=require("lodash"),i=require("classnames"),o=require("@material-ui/core"),u=require("@material-ui/icons");require("mapbox-gl/dist/mapbox-gl.css");var c=require("./effects/usePreviousWells.js"),n=require("./WellTooltip.js"),s=require("./utils.js"),a=require("./OffsetWellMap.module.css.js");require("../../config/mapboxGl/index.js");var d=require("../../config/mapbox/index.js"),f=require("../../utils/index.js"),v=require("../../utils/createAdaptiveRoot.js"),h=require("react/jsx-runtime"),m=require("mapbox-gl");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=g(e),y=g(r),w=g(i),b=g(m),j=f.mapbox.isValidCoordinates,x=[29.749907,-95.358421],W={type:"FeatureCollection",features:[]},q=["==",["id"],-1],F=function(e){var r=y.default(e,2),t=r[0];return[r[1],t]},B=function(e,r){for(var t=y.default(e,2),l=t[0],i=t[1],o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:64,u=r/(111320*Math.cos(l*Math.PI/180)),c=r/110574,n=[],s=0;s<=o;s+=1){var a=s/o*2*Math.PI;n.push([i+u*Math.cos(a),l+c*Math.sin(a)])}return{type:"Polygon",coordinates:[n]}};module.exports=function(e){var r=e.isViewOnly,i=e.subjectWell,f=void 0===i?null:i,m=e.wells,g=e.offsetWellIds,C=e.radius,E=e.handleChanageOffsetWell,M=e.handleChangeOffsetWell,L=void 0===M?E:M,S=e.activeWellId,D=e.isClickable,O=void 0===D||D,R=e.classes,P=void 0===R?{}:R,k=t.useMemo((function(){return f&&l.get(f,"topHole.coordinates")}),[f]),I=t.useMemo((function(){return s.getAllFormations(m)}),[m]),T=t.useRef(),z=t.useRef(),A=t.useRef(),Z=t.useRef(null),N=t.useRef(null),V=t.useRef(),G=t.useRef(new Map),H=t.useRef(null),_=t.useRef(null),X=t.useRef(null),J=t.useState(!1),K=y.default(J,2),Q=K[0],U=K[1],Y=(null==f?void 0:f.id)===S,$=c.usePreviousWells(m),ee=t.useState(!1),re=y.default(ee,2),te=re[0],le=re[1],ie=t.useState(3),oe=y.default(ie,2),ue=oe[0],ce=oe[1];t.useEffect((function(){if(d.IS_MAPBOX_ENABLED){var e=new b.default.Map({container:T.current,style:"mapbox://styles/mapbox/dark-v9",center:F(x),zoom:3,maxZoom:18,attributionControl:!1,scrollZoom:!1,doubleClickZoom:!1});return z.current=e,e.on("zoomend",(function(){return ce(Math.round(e.getZoom()))})),e.on("load",(function(){e.addSource("radius-circle",{type:"geojson",data:W}),e.addLayer({id:"radius-circle-fill",type:"fill",source:"radius-circle",paint:{"fill-color":"#03BCD4","fill-opacity":.2}}),e.addSource("wells",{type:"geojson",data:W}),e.addLayer({id:"wells-halo",type:"circle",source:"wells",filter:["==",["get","isOffsetWell"],!0],paint:{"circle-radius":12,"circle-color":["get","color"],"circle-opacity":.08}}),e.addLayer({id:"wells-circle",type:"circle",source:"wells",layout:{"circle-sort-key":["get","order"]},paint:{"circle-radius":5,"circle-color":["get","color"],"circle-opacity":["get","opacity"]}}),e.addLayer({id:"wells-active-highlight",type:"circle",source:"wells",filter:["==",["get","isActive"],!0],paint:{"circle-radius":12,"circle-color":["get","color"],"circle-opacity":.24}}),e.addLayer({id:"wells-hover-highlight",type:"circle",source:"wells",filter:q,paint:{"circle-radius":["case",["get","isSubjectWell"],5,12],"circle-color":["case",["get","isSubjectWell"],"#63EFFF",["get","color"]],"circle-opacity":.24}}),le(!0)})),function(){var r;null===(r=X.current)||void 0===r||r.unmount(),X.current=null,e.remove(),z.current=null,A.current=null,V.current=null,Z.current=null,N.current=null}}}),[]),t.useEffect((function(){var e,r,t,l,i,o,u;Z.current=k&&C?(e=k,r=1609.34*C,t=y.default(e,2),l=t[0],i=t[1],o=r/(111320*Math.cos(l*Math.PI/180)),[[i-o,l-(u=r/110574)],[i+o,l+u]]):null;var c=z.current;c&&te&&c.getSource("radius-circle").setData(k&&C?{type:"Feature",properties:{},geometry:B(k,1609.34*C)}:W)}),[C,k,te]);var ne=function(e,i,o,u){var c;null===(c=X.current)||void 0===c||c.unmount();var s=document.createElement("div"),a=t.createElement(n.WellTooltip(),{isViewOnly:r,well:e,color:l.get(I,e.formation,"#BDBDBD"),isOffsetWell:i,isSubjectWell:o,isClickable:O});X.current=v.createAdaptiveRoot(s),X.current.render(h.jsx(h.Fragment,{children:a})),A.current||(A.current=new b.default.Popup({closeButton:!1,offset:12})),A.current.setLngLat(F(u)).setDOMContent(s).addTo(z.current)};t.useEffect((function(){var e=z.current;e&&te&&e.setPaintProperty("wells-circle","circle-color",Q?["case",["get","isSubjectWell"],"#63EFFF",["get","color"]]:["get","color"])}),[Q,te]),t.useEffect((function(){var e;if(m&&g){null===(e=A.current)||void 0===e||e.remove();var t=[],i=[];m.forEach((function(e){e.id!==(null==f?void 0:f.id)&&(g.includes(e.id)?t.push(e):i.push(e))}));var o=[].concat(i,t,[f]),u=[],c=new b.default.LngLatBounds;G.current.clear(),H.current=null,o.forEach((function(e,r){var t,i=null==e||null===(t=e.topHole)||void 0===t?void 0:t.coordinates;if(i&&j(i)){var o=(null==f?void 0:f.id)===e.id,n=g.includes(e.id)&&!o,s=o?"#03BCD4":l.get(I,e.formation,"#BDBDBD"),a=n?.7:.3;u.push({type:"Feature",id:r,geometry:{type:"Point",coordinates:F(i)},properties:{color:s,opacity:o?1:a,isSubjectWell:o,isOffsetWell:n,isActive:e.id===S&&!Y,order:r}}),G.current.set(r,{well:e,coords:i,isOffsetWell:n,isSubjectWell:o}),o&&(H.current=r),c.extend(F(i))}})),N.current=u.length?c:null;var n=z.current;if(n&&te){n.getSource("wells").setData({type:"FeatureCollection",features:u}),n.setFilter("wells-hover-highlight",q),_.current=null;var s=function(e){var r,t=null===(r=e.features)||void 0===r?void 0:r[0];if(t&&_.current!==t.id){var l=G.current.get(t.id);l&&(_.current=t.id,n.getCanvas().style.cursor="pointer",n.setFilter("wells-hover-highlight",["==",["id"],t.id]),ne(l.well,l.isOffsetWell,l.isSubjectWell,l.coords),l.isSubjectWell&&U(!0))}},a=function(e){var r;if(null==e||!e.point||!n.queryRenderedFeatures(e.point,{layers:["wells-circle","wells-hover-highlight"]}).length){var t=null!==_.current&&_.current===H.current;_.current=null,n.getCanvas().style.cursor="",n.setFilter("wells-hover-highlight",q),null===(r=A.current)||void 0===r||r.remove(),t&&U(!1)}},d=function(e){var t,l;if(!r){var i=G.current.get(null===(t=e.features)||void 0===t||null===(l=t[0])||void 0===l?void 0:l.id);i&&L(i.well,!i.isOffsetWell)}};return n.on("mousemove","wells-circle",s),n.on("mouseleave","wells-circle",a),n.on("mouseleave","wells-hover-highlight",a),n.on("click","wells-circle",d),setTimeout((function(){C<3e3&&z.current&&Z.current&&m!==$&&z.current.fitBounds(Z.current,{padding:5})}),500),function(){n.off("mousemove","wells-circle",s),n.off("mouseleave","wells-circle",a),n.off("mouseleave","wells-hover-highlight",a),n.off("click","wells-circle",d)}}}}),[f,m,g,S,te]),t.useEffect((function(){var e=z.current;if(V.current&&(V.current.remove(),V.current=null),e&&k){var r=Q||Y,t=document.createElement("img");t.src=r?"/static/media/5e9c4959259cb12c11b2c5eaf27eb3ad.svg":"/static/media/9efe5882f31d2f22bd57af92069d0a3e.svg";var l=r?[70,20]:[62,12],i=y.default(l,2),o=i[0],u=i[1],c=r?[35,29]:[31,25],n=y.default(c,2),s=n[0],a=n[1];t.width=o,t.height=u,t.addEventListener("mouseover",(function(){U(!0),null!==H.current&&e.getLayer("wells-hover-highlight")&&(_.current=H.current,e.setFilter("wells-hover-highlight",["==",["id"],H.current])),ne(f,!1,!0,k)})),t.addEventListener("mouseout",(function(){var r;_.current=null,e.getLayer("wells-hover-highlight")&&e.setFilter("wells-hover-highlight",q),null===(r=A.current)||void 0===r||r.remove(),U(!1)})),V.current=new b.default.Marker({element:t,anchor:"center",offset:[o/2-s,u/2-a]}).setLngLat(F(k)).addTo(e)}}),[Q,k,C,f,Y]),t.useEffect((function(){var e;C>3e3?null===(e=z.current)||void 0===e||e.setZoom(1):setTimeout((function(){f?z.current&&Z.current&&C&&z.current.fitBounds(Z.current,{padding:5}):z.current&&N.current&&z.current.fitBounds(N.current),k&&z.current&&z.current.easeTo({center:F(k),duration:700})}),500)}),[C,f,k]);var se=function(){var e;null===(e=z.current)||void 0===e||e.setZoom(ue+1)};return h.jsx("div",{className:w.default(a.mapView,P.root),children:h.jsx("div",{className:w.default(a.mapMain,P.map),ref:T,onDoubleClick:se,children:h.jsxs("div",{className:a.zoomGroup,children:[h.jsx(o.Tooltip,{title:ue<18?"Zoom in":"",placement:"left",children:h.jsx("div",{className:w.default(a.zoomButton,p.default({},a.zoomDisabled,18===ue)),onClick:se,children:h.jsx(u.Add,{className:a.zoomInOutIcon})})}),h.jsx(o.Tooltip,{title:ue>1?"Zoom out":"",placement:"left",children:h.jsx("div",{className:w.default(a.zoomButton,p.default({},a.zoomDisabled,1===ue)),onClick:function(){var e;ue>1&&(null===(e=z.current)||void 0===e||e.setZoom(ue-1))},children:h.jsx(u.Remove,{className:a.zoomInOutIcon})})})]})})})};
 //# sourceMappingURL=OffsetWellMap.js.map