@corva/ui 0.65.0-1-test → 0.65.0-2

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Filter/index.js

@@ -1,204 +1 @@
-import { memo } from 'react';
-import PropTypes from 'prop-types';
-import { get } from 'lodash';
-import { makeStyles, Dialog, DialogTitle, Typography, DialogContent } from '@material-ui/core';
-import { Close } from '@material-ui/icons';
-import RadiusInput from './RadiusInput.js';
-import SidetrackSwitch from './SidetrackSwitch.js';
-import MultiSelect from './MultiSelect.js';
-import ClearFiltersButton from './ClearFiltersButton.js';
-import { FILTERS_LIST } from '../../constants.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var useStyles = makeStyles(function (theme) {
-  return {
-    container: {
-      display: 'flex',
-      marginBottom: '24px'
-    },
-    filters: {
-      display: 'flex',
-      flexWrap: 'wrap'
-    },
-    fileterSection: {
-      display: 'flex',
-      width: '100%',
-      alignItems: 'center',
-      flexWrap: 'wrap'
-    },
-    filterRow: {
-      display: 'flex',
-      width: '100%',
-      flexFlow: 'row wrap',
-      alignContent: 'flex-start',
-      gap: '24px'
-    },
-    paper: {
-      background: theme.palette.background.b4,
-      overflow: 'hidden'
-    },
-    dialogTitle: {
-      padding: '14px 0',
-      height: '60px',
-      borderBottom: "1px solid ".concat(theme.palette.background.b7)
-    },
-    titleWrapper: {
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'space-between',
-      padding: '0 16px',
-      fontSize: '18px'
-    },
-    title: {
-      fontSize: '20px'
-    },
-    dialogContent: {
-      display: 'flex',
-      width: '100%',
-      flexFlow: 'row wrap',
-      alignContent: 'flex-start',
-      height: '100%',
-      paddingRight: '16px',
-      justifyContent: 'space-between'
-    }
-  };
-});
-function Filter(_ref) {
-  var radius = _ref.radius,
-    excludeSideTrack = _ref.excludeSideTrack,
-    filters = _ref.filters,
-    filtersOptions = _ref.filtersOptions,
-    isRadiusEditable = _ref.isRadiusEditable,
-    filtersHidden = _ref.filtersHidden,
-    onChangeFilters = _ref.onChangeFilters,
-    onChangeRadius = _ref.onChangeRadius,
-    onChangeSidetrack = _ref.onChangeSidetrack,
-    onClearFilters = _ref.onClearFilters,
-    isTablet = _ref.isTablet,
-    isMobile = _ref.isMobile,
-    onToggleFilters = _ref.onToggleFilters;
-  var classes = useStyles({
-    isMobile: isMobile
-  });
-  var multiSelectSize = isTablet ? 200 : 150;
-  var onClose = function onClose() {
-    onToggleFilters(false);
-  };
-  if (filtersHidden && isMobile && !isTablet) {
-    return /*#__PURE__*/jsxs(Dialog, {
-      onBackdropClick: onClose,
-      onEscapeKeyDown: onClose,
-      fullScreen: true,
-      maxWidth: "xs",
-      fullWidth: true,
-      open: true,
-      classes: {
-        paper: classes.paper
-      },
-      children: [/*#__PURE__*/jsx(DialogTitle, {
-        className: classes.dialogTitle,
-        children: /*#__PURE__*/jsxs("div", {
-          className: classes.titleWrapper,
-          children: [/*#__PURE__*/jsx(Typography, {
-            className: classes.title,
-            children: "Filter"
-          }), /*#__PURE__*/jsx(Close, {
-            className: classes.closeIcon,
-            onClick: onClose
-          })]
-        })
-      }), /*#__PURE__*/jsxs(DialogContent, {
-        className: classes.dialogContent,
-        children: [FILTERS_LIST.map(function (_ref2) {
-          var key = _ref2.key,
-            title = _ref2.title,
-            renderValue = _ref2.renderValue;
-          return /*#__PURE__*/jsx(MultiSelect, {
-            title: title,
-            size: multiSelectSize,
-            options: get(filtersOptions, key, []),
-            currentValues: get(filters, key, []),
-            renderValue: renderValue,
-            onChange: function onChange(newValues) {
-              return onChangeFilters(key, newValues);
-            }
-          }, key);
-        }), /*#__PURE__*/jsx(RadiusInput, {
-          radius: radius,
-          editable: isRadiusEditable,
-          onChange: onChangeRadius,
-          isMobile: isMobile
-        }), /*#__PURE__*/jsx(SidetrackSwitch, {
-          checked: excludeSideTrack,
-          onChange: onChangeSidetrack,
-          isMobile: isMobile
-        })]
-      })]
-    });
-  }
-  if (!filtersHidden && (!isMobile || isTablet)) {
-    return /*#__PURE__*/jsx("div", {
-      className: classes.container,
-      children: /*#__PURE__*/jsx("div", {
-        className: classes.filters,
-        children: /*#__PURE__*/jsx("div", {
-          className: classes.fileterSection,
-          children: /*#__PURE__*/jsxs("div", {
-            className: classes.filterRow,
-            children: [FILTERS_LIST.map(function (_ref3) {
-              var key = _ref3.key,
-                title = _ref3.title,
-                renderValue = _ref3.renderValue;
-              return /*#__PURE__*/jsx(MultiSelect, {
-                title: title,
-                size: multiSelectSize,
-                options: get(filtersOptions, key, []),
-                currentValues: get(filters, key, []),
-                renderValue: renderValue,
-                onChange: function onChange(newValues) {
-                  return onChangeFilters(key, newValues);
-                }
-              }, key);
-            }), /*#__PURE__*/jsx(RadiusInput, {
-              radius: radius,
-              editable: isRadiusEditable,
-              onChange: onChangeRadius,
-              isTablet: isTablet
-            }), /*#__PURE__*/jsx(SidetrackSwitch, {
-              checked: excludeSideTrack,
-              onChange: onChangeSidetrack,
-              isMobile: isMobile
-            }), /*#__PURE__*/jsx(ClearFiltersButton, {
-              onClick: onClearFilters
-            })]
-          })
-        })
-      })
-    });
-  } else {
-    return null;
-  }
-}
-Filter.propTypes = {
-  subjectWell: PropTypes.shape({}),
-  radius: PropTypes.number.isRequired,
-  isRadiusEditable: PropTypes.bool.isRequired,
-  excludeSideTrack: PropTypes.bool.isRequired,
-  filters: PropTypes.shape({}).isRequired,
-  filtersOptions: PropTypes.shape({}).isRequired,
-  filtersHidden: PropTypes.bool.isRequired,
-  onChangeFilters: PropTypes.func.isRequired,
-  onChangeRadius: PropTypes.func.isRequired,
-  onChangeSidetrack: PropTypes.func.isRequired,
-  onClearFilters: PropTypes.func.isRequired,
-  isTablet: PropTypes.bool.isRequired,
-  isMobile: PropTypes.bool.isRequired,
-  onToggleFilters: PropTypes.func.isRequired
-};
-Filter.defaultProps = {
-  subjectWell: null
-};
-var Filter$1 = memo(Filter);
-
-export { Filter$1 as default };
-//# sourceMappingURL=index.js.map
+import{memo as e}from"react";import i from"prop-types";import{get as r}from"lodash";import{makeStyles as t,Dialog as l,DialogTitle as n,Typography as a,DialogContent as o}from"@material-ui/core";import{Close as s}from"@material-ui/icons";import d from"./RadiusInput.js";import c from"./SidetrackSwitch.js";import p from"./MultiSelect.js";import u from"./ClearFiltersButton.js";import{FILTERS_LIST as f}from"../../constants.js";import{jsxs as m,jsx as h}from"react/jsx-runtime";var g=t((function(e){return{container:{display:"flex",marginBottom:"24px"},filters:{display:"flex",flexWrap:"wrap"},fileterSection:{display:"flex",width:"100%",alignItems:"center",flexWrap:"wrap"},filterRow:{display:"flex",width:"100%",flexFlow:"row wrap",alignContent:"flex-start",gap:"24px"},paper:{background:e.palette.background.b4,overflow:"hidden"},dialogTitle:{padding:"14px 0",height:"60px",borderBottom:"1px solid ".concat(e.palette.background.b7)},titleWrapper:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"0 16px",fontSize:"18px"},title:{fontSize:"20px"},dialogContent:{display:"flex",width:"100%",flexFlow:"row wrap",alignContent:"flex-start",height:"100%",paddingRight:"16px",justifyContent:"space-between"}}}));function b(e){var i=e.radius,t=e.excludeSideTrack,b=e.filters,x=e.filtersOptions,C=e.isRadiusEditable,R=e.filtersHidden,w=e.onChangeFilters,k=e.onChangeRadius,q=e.onChangeSidetrack,y=e.onClearFilters,S=e.isTablet,v=e.isMobile,j=e.onToggleFilters,F=g({isMobile:v}),T=S?200:150,N=function(){j(!1)};return R&&v&&!S?m(l,{onBackdropClick:N,onEscapeKeyDown:N,fullScreen:!0,maxWidth:"xs",fullWidth:!0,open:!0,classes:{paper:F.paper},children:[h(n,{className:F.dialogTitle,children:m("div",{className:F.titleWrapper,children:[h(a,{className:F.title,children:"Filter"}),h(s,{className:F.closeIcon,onClick:N})]})}),m(o,{className:F.dialogContent,children:[f.map((function(e){var i=e.key,t=e.title,l=e.renderValue;return h(p,{title:t,size:T,options:r(x,i,[]),currentValues:r(b,i,[]),renderValue:l,onChange:function(e){return w(i,e)}},i)})),h(d,{radius:i,editable:C,onChange:k,isMobile:v}),h(c,{checked:t,onChange:q,isMobile:v})]})]}):R||v&&!S?null:h("div",{className:F.container,children:h("div",{className:F.filters,children:h("div",{className:F.fileterSection,children:m("div",{className:F.filterRow,children:[f.map((function(e){var i=e.key,t=e.title,l=e.renderValue;return h(p,{title:t,size:T,options:r(x,i,[]),currentValues:r(b,i,[]),renderValue:l,onChange:function(e){return w(i,e)}},i)})),h(d,{radius:i,editable:C,onChange:k,isTablet:S}),h(c,{checked:t,onChange:q,isMobile:v}),h(u,{onClick:y})]})})})})}b.propTypes={subjectWell:i.shape({}),radius:i.number.isRequired,isRadiusEditable:i.bool.isRequired,excludeSideTrack:i.bool.isRequired,filters:i.shape({}).isRequired,filtersOptions:i.shape({}).isRequired,filtersHidden:i.bool.isRequired,onChangeFilters:i.func.isRequired,onChangeRadius:i.func.isRequired,onChangeSidetrack:i.func.isRequired,onClearFilters:i.func.isRequired,isTablet:i.bool.isRequired,isMobile:i.bool.isRequired,onToggleFilters:i.func.isRequired},b.defaultProps={subjectWell:null};var x=e(b);export{x as default};

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/FormationsLegend.js

@@ -1,58 +1 @@
-import PropTypes from 'prop-types';
-import { makeStyles, Typography } from '@material-ui/core';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var useStyles = makeStyles(function (theme) {
-  return {
-    root: {
-      display: 'flex',
-      flexWrap: 'wrap',
-      alignItems: 'center',
-      marginTop: theme.spacing(1) / 2
-    },
-    formationItem: {
-      display: 'flex',
-      alignItems: 'center',
-      marginRight: theme.spacing(1)
-    },
-    marker: {
-      width: 8,
-      height: 8,
-      borderRadius: '50%'
-    },
-    label: {
-      color: theme.palette.primary.text6,
-      fontSize: '10px',
-      marginLeft: theme.spacing(1)
-    }
-  };
-});
-function FormationsLegend(_ref) {
-  var formations = _ref.formations,
-    formationColors = _ref.formationColors;
-  var classes = useStyles();
-  return /*#__PURE__*/jsx("div", {
-    className: classes.root,
-    children: formations.map(function (formation) {
-      return /*#__PURE__*/jsxs("div", {
-        className: classes.formationItem,
-        children: [/*#__PURE__*/jsx("div", {
-          className: classes.marker,
-          style: {
-            backgroundColor: formationColors[formation]
-          }
-        }), /*#__PURE__*/jsx(Typography, {
-          className: classes.label,
-          children: formation
-        })]
-      }, formation);
-    })
-  });
-}
-FormationsLegend.propTypes = {
-  formations: PropTypes.arrayOf(PropTypes.string).isRequired,
-  formationColors: PropTypes.shape({}).isRequired
-};
-
-export { FormationsLegend as default };
-//# sourceMappingURL=FormationsLegend.js.map
+import r from"prop-types";import{makeStyles as e,Typography as a}from"@material-ui/core";import{jsx as i,jsxs as o}from"react/jsx-runtime";var t=e((function(r){return{root:{display:"flex",flexWrap:"wrap",alignItems:"center",marginTop:r.spacing(1)/2},formationItem:{display:"flex",alignItems:"center",marginRight:r.spacing(1)},marker:{width:8,height:8,borderRadius:"50%"},label:{color:r.palette.primary.text6,fontSize:"10px",marginLeft:r.spacing(1)}}}));function n(r){var e=r.formations,n=r.formationColors,m=t();return i("div",{className:m.root,children:e.map((function(r){return o("div",{className:m.formationItem,children:[i("div",{className:m.marker,style:{backgroundColor:n[r]}}),i(a,{className:m.label,children:r})]},r)}))})}n.propTypes={formations:r.arrayOf(r.string).isRequired,formationColors:r.shape({}).isRequired};export{n as default};

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/Map.css.js

@@ -1,8 +1 @@
-import styleInject from './../../../../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".Map_map__pdvR2 {\n  width: 100%;\n}\n\n.Map_mapMain__em8S8 {\n  width: 100%;\n  flex: 100;\n  height: 200px;\n  border-radius: 4px;\n  background-color: #414141;\n}\n\n.Map_map__pdvR2 .leaflet-popup-content-wrapper {\n  background-color: #414141;\n  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2), 0px 3px 14px rgba(0, 0, 0, 0.12),\n    0px 8px 10px rgba(0, 0, 0, 0.14);\n  border-radius: 4px;\n}\n\n.Map_map__pdvR2 .leaflet-popup-content {\n  padding: 10px 16px;\n}\n\n.Map_map__pdvR2 .leaflet-popup-tip {\n  display: none;\n}\n\n.Map_map__pdvR2 .leaflet-popup-close-button {\n  display: none;\n}\n\n.Map_map__pdvR2 .leaflet-control-zoom {\n  background: none;\n  box-shadow: none;\n  border: none;\n}\n\n.Map_map__pdvR2 .leaflet-control-zoom a {\n  background-image: none;\n  text-indent: unset;\n  content: unset;\n  color: #bdbdbd;\n  font-size: 22px;\n  text-align: center;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  background: #272727;\n  border-radius: 4px;\n  margin-top: 4px;\n  opacity: 1;\n}\n\n.Map_map__pdvR2 .leaflet-control-zoom a:hover {\n  color: #fff;\n  background: #303030;\n  background-image: none;\n  text-indent: unset;\n  content: unset;\n  font-size: 22px;\n  text-align: center;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  border-radius: 4px;\n  margin-top: 4px;\n  opacity: 1;\n}\n\n.Map_map__pdvR2 .leaflet-touch .leaflet-bar {\n  border: 0px solid transparent;\n  background-clip: padding-box;\n}\n\n.Map_map__pdvR2 .leaflet-touch .leaflet-control-layers {\n  border: 0px solid transparent;\n  background-clip: padding-box;\n}\n";
-var styles = {"map":"Map_map__pdvR2","mapMain":"Map_mapMain__em8S8"};
-styleInject(css_248z);
-
-export { styles as default };
-//# sourceMappingURL=Map.css.js.map
+import a from'./../../../../../../ext-esm/style-inject/dist/style-inject.es.js';var p={map:"Map_map__pdvR2",mapMain:"Map_mapMain__em8S8"};a(".Map_map__pdvR2{width:100%}.Map_mapMain__em8S8{background-color:#414141;border-radius:4px;flex:100;height:200px;width:100%}.Map_map__pdvR2 .leaflet-popup-content-wrapper{background-color:#414141;border-radius:4px;box-shadow:0 5px 5px rgba(0,0,0,.2),0 3px 14px rgba(0,0,0,.12),0 8px 10px rgba(0,0,0,.14)}.Map_map__pdvR2 .leaflet-popup-content{padding:10px 16px}.Map_map__pdvR2 .leaflet-popup-close-button,.Map_map__pdvR2 .leaflet-popup-tip{display:none}.Map_map__pdvR2 .leaflet-control-zoom{background:none;border:none;box-shadow:none}.Map_map__pdvR2 .leaflet-control-zoom a{background-image:none;background:#272727;color:#bdbdbd}.Map_map__pdvR2 .leaflet-control-zoom a,.Map_map__pdvR2 .leaflet-control-zoom a:hover{align-items:center;border-radius:4px;content:unset;display:flex;font-size:22px;height:32px;justify-content:center;margin-top:4px;opacity:1;text-align:center;text-indent:unset;width:32px}.Map_map__pdvR2 .leaflet-control-zoom a:hover{background:#303030;background-image:none;color:#fff}.Map_map__pdvR2 .leaflet-touch .leaflet-bar,.Map_map__pdvR2 .leaflet-touch .leaflet-control-layers{background-clip:padding-box;border:0 solid transparent}");export{p as default};

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/Map.js

@@ -1,203 +1 @@
-import { memo, useRef, useMemo, useEffect, createElement } from 'react';
-import ReactDOM from 'react-dom';
-import PropTypes from 'prop-types';
-import L from 'mapbox.js';
-import { get, sortBy } from 'lodash';
-import { mapbox } from '../../../../../../utils/index.js';
-import { usePrevious } from '../../effects/index.js';
-import styles from './Map.css.js';
-import { jsx, Fragment } from 'react/jsx-runtime';
-
-var isValidCoordinates = mapbox.isValidCoordinates;
-var DEFAULT_COORDS = [29.749907, -95.358421]; // TX coordinates
-var RADIUS_CIRCLE_COLOR = '#03BCD4';
-var METERS_IN_MILE = 1609.34;
-var DEFAULT_SUBJECT_WELL_MARKER_SIZE = 10;
-var DEFAULT_WELL_MARKER_SIZE = 5;
-var OFFSET_WELL_COLOR = '#00FFFF';
-
-// eslint-disable-next-line no-unused-vars
-function WellsMap(_ref) {
-  var open = _ref.open,
-    subjectWell = _ref.subjectWell,
-    wells = _ref.wells,
-    offsetWells = _ref.offsetWells,
-    radius = _ref.radius,
-    formationColors = _ref.formationColors,
-    popUpFormatter = _ref.popUpFormatter,
-    coordsDataPath = _ref.coordsDataPath,
-    onAddOffsetWell = _ref.onAddOffsetWell,
-    onDeleteOffsetWell = _ref.onDeleteOffsetWell;
-  var mapContainerRef = useRef(null);
-  var mapRef = useRef();
-  var radiusCircleRef = useRef(null);
-  var markersGroupRef = useRef(null);
-  var prevWells = usePrevious(wells);
-  var subjectWellCoords = useMemo(function () {
-    return subjectWell && get(subjectWell, coordsDataPath);
-  }, [subjectWell, coordsDataPath]);
-
-  // NOTE: Initialize map
-  useEffect(function () {
-    if (!open || mapRef.current) return;
-    mapRef.current = L.mapbox.map(mapContainerRef.current, null, {
-      attributionControl: false,
-      scrollWheelZoom: false,
-      zoomControl: false
-    }).setView(DEFAULT_COORDS, 1);
-    L.control.zoom({
-      position: 'bottomright'
-    }).addTo(mapRef.current);
-    L.mapbox.styleLayer('mapbox://styles/mapbox/dark-v9').addTo(mapRef.current);
-  }, [open]);
-
-  // NOTE: Radius circle
-  useEffect(function () {
-    if (!mapRef.current || !open) {
-      return;
-    }
-
-    // NOTE: Clean up
-    if (radiusCircleRef.current) {
-      mapRef.current.removeLayer(radiusCircleRef.current);
-    }
-    if (!subjectWellCoords) {
-      radiusCircleRef.current = null;
-      return;
-    }
-    radiusCircleRef.current = L.circle(subjectWellCoords, radius * METERS_IN_MILE, {
-      stroke: false,
-      fill: true,
-      fillOpacity: 0.2,
-      fillColor: RADIUS_CIRCLE_COLOR,
-      className: 'circle_500'
-    });
-    radiusCircleRef.current.addTo(mapRef.current);
-  }, [radius, subjectWellCoords, open]);
-
-  // NOTE: Well markers
-  useEffect(function () {
-    if (!mapRef.current || !open) {
-      return;
-    }
-
-    // NOTE: Clean up
-    if (markersGroupRef.current) {
-      markersGroupRef.current.removeFrom(mapRef.current);
-    }
-    var offsetWellIds = offsetWells.map(function (well) {
-      return well.id;
-    });
-    var sortedWells = sortBy(wells, function (well) {
-      return offsetWellIds.includes(well.id);
-    });
-    var markers = [];
-    sortedWells.forEach(function (well) {
-      var coords = get(well, coordsDataPath);
-      if (coords && isValidCoordinates(coords)) {
-        var isWellSubject = subjectWell && subjectWell.id === well.id;
-        var isWellOffset = offsetWellIds.includes(well.id);
-        var r = isWellSubject ? DEFAULT_SUBJECT_WELL_MARKER_SIZE : DEFAULT_WELL_MARKER_SIZE;
-        var color = isWellSubject || isWellOffset ? OFFSET_WELL_COLOR : get(formationColors, well.formation, '#BDBDBD');
-        var opacity = isWellSubject || isWellOffset ? 1 : 0.3;
-        var newMarker = L.circleMarker(coords, {
-          radius: r,
-          stroke: false,
-          fill: true,
-          fillOpacity: opacity,
-          fillColor: color,
-          className: 'circle_500'
-        });
-        newMarker.addEventListener('mouseover', function () {
-          if (popUpFormatter) {
-            // Container to put React generated content in.
-            var popUpContainer = document.createElement('div');
-            var popUpContent = createElement(popUpFormatter, {
-              well: well,
-              color: get(formationColors, well.formation, '#BDBDBD')
-            });
-            // NOTE: Custom popup may have buttons
-            ReactDOM.render( /*#__PURE__*/jsx(Fragment, {
-              children: popUpContent
-            }), popUpContainer);
-            L.popup().setLatLng(coords).setContent(popUpContainer).openOn(mapRef.current);
-          }
-        });
-        newMarker.addEventListener('mouseout', function () {
-          mapRef.current.closePopup();
-        });
-        newMarker.addEventListener('click', function () {
-          if (isWellOffset && !isWellSubject) {
-            onDeleteOffsetWell(well.id);
-          } else {
-            onAddOffsetWell(well.id);
-          }
-        });
-        markers.push(newMarker);
-      }
-    });
-    if (markers.length) {
-      markersGroupRef.current = L.featureGroup(markers);
-      markersGroupRef.current.addTo(mapRef.current);
-    }
-    setTimeout(function () {
-      if (radiusCircleRef.current) {
-        radiusCircleRef.current.bringToBack();
-      }
-      if (mapRef.current && radiusCircleRef.current && wells !== prevWells) {
-        mapRef.current.fitBounds(radiusCircleRef.current.getBounds(), {
-          padding: [5, 5]
-        });
-      }
-    }, 500);
-  }, [subjectWell, wells, offsetWells, open]);
-  useEffect(function () {
-    if (!open) return;
-    setTimeout(function () {
-      if (radiusCircleRef.current) {
-        radiusCircleRef.current.bringToBack();
-      }
-      if (subjectWell) {
-        if (mapRef.current && radiusCircleRef.current) {
-          mapRef.current.fitBounds(radiusCircleRef.current.getBounds(), {
-            padding: [5, 5]
-          });
-        }
-      } else if (mapRef.current && markersGroupRef.current) {
-        mapRef.current.fitBounds(markersGroupRef.current.getBounds());
-      }
-    }, 500);
-  }, [radius, subjectWell, open]);
-  return /*#__PURE__*/jsx("div", {
-    className: styles.map,
-    children: /*#__PURE__*/jsx("div", {
-      className: styles.mapMain,
-      ref: mapContainerRef
-    })
-  });
-}
-WellsMap.propTypes = {
-  open: PropTypes.bool.isRequired,
-  subjectWell: PropTypes.shape({
-    id: PropTypes.number,
-    formation: PropTypes.string
-  }),
-  wells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  offsetWells: PropTypes.arrayOf(PropTypes.shape({})),
-  radius: PropTypes.number.isRequired,
-  formationColors: PropTypes.shape({}).isRequired,
-  popUpFormatter: PropTypes.func,
-  coordsDataPath: PropTypes.string,
-  onAddOffsetWell: PropTypes.func.isRequired,
-  onDeleteOffsetWell: PropTypes.func.isRequired
-};
-WellsMap.defaultProps = {
-  subjectWell: null,
-  popUpFormatter: null,
-  coordsDataPath: 'settings.top_hole.coordinates',
-  offsetWells: null
-};
-var Map = memo(WellsMap);
-
-export { Map as default };
-//# sourceMappingURL=Map.js.map
+import{memo as r,useRef as e,useMemo as t,useEffect as o,createElement as n}from"react";import u from"react-dom";import i from"prop-types";import c from"mapbox.js";import{get as l,sortBy as s}from"lodash";import{mapbox as a}from"../../../../../../utils/index.js";import{usePrevious as d}from"../../effects/index.js";import f from"./Map.css.js";import{jsx as m,Fragment as p}from"react/jsx-runtime";var v=a.isValidCoordinates,h=[29.749907,-95.358421];function b(r){var i=r.open,a=r.subjectWell,b=r.wells,B=r.offsetWells,g=r.radius,D=r.formationColors,W=r.popUpFormatter,y=r.coordsDataPath,x=r.onAddOffsetWell,C=r.onDeleteOffsetWell,O=e(null),T=e(),j=e(null),F=e(null),k=d(b),L=t((function(){return a&&l(a,y)}),[a,y]);return o((function(){i&&!T.current&&(T.current=c.mapbox.map(O.current,null,{attributionControl:!1,scrollWheelZoom:!1,zoomControl:!1}).setView(h,1),c.control.zoom({position:"bottomright"}).addTo(T.current),c.mapbox.styleLayer("mapbox://styles/mapbox/dark-v9").addTo(T.current))}),[i]),o((function(){T.current&&i&&(j.current&&T.current.removeLayer(j.current),L?(j.current=c.circle(L,1609.34*g,{stroke:!1,fill:!0,fillOpacity:.2,fillColor:"#03BCD4",className:"circle_500"}),j.current.addTo(T.current)):j.current=null)}),[g,L,i]),o((function(){if(T.current&&i){F.current&&F.current.removeFrom(T.current);var r=B.map((function(r){return r.id})),e=s(b,(function(e){return r.includes(e.id)})),t=[];e.forEach((function(e){var o=l(e,y);if(o&&v(o)){var i=a&&a.id===e.id,s=r.includes(e.id),d=i?10:5,f=i||s?"#00FFFF":l(D,e.formation,"#BDBDBD"),h=i||s?1:.3,b=c.circleMarker(o,{radius:d,stroke:!1,fill:!0,fillOpacity:h,fillColor:f,className:"circle_500"});b.addEventListener("mouseover",(function(){if(W){var r=document.createElement("div"),t=n(W,{well:e,color:l(D,e.formation,"#BDBDBD")});u.render(m(p,{children:t}),r),c.popup().setLatLng(o).setContent(r).openOn(T.current)}})),b.addEventListener("mouseout",(function(){T.current.closePopup()})),b.addEventListener("click",(function(){s&&!i?C(e.id):x(e.id)})),t.push(b)}})),t.length&&(F.current=c.featureGroup(t),F.current.addTo(T.current)),setTimeout((function(){j.current&&j.current.bringToBack(),T.current&&j.current&&b!==k&&T.current.fitBounds(j.current.getBounds(),{padding:[5,5]})}),500)}}),[a,b,B,i]),o((function(){i&&setTimeout((function(){j.current&&j.current.bringToBack(),a?T.current&&j.current&&T.current.fitBounds(j.current.getBounds(),{padding:[5,5]}):T.current&&F.current&&T.current.fitBounds(F.current.getBounds())}),500)}),[g,a,i]),m("div",{className:f.map,children:m("div",{className:f.mapMain,ref:O})})}b.propTypes={open:i.bool.isRequired,subjectWell:i.shape({id:i.number,formation:i.string}),wells:i.arrayOf(i.shape({})).isRequired,offsetWells:i.arrayOf(i.shape({})),radius:i.number.isRequired,formationColors:i.shape({}).isRequired,popUpFormatter:i.func,coordsDataPath:i.string,onAddOffsetWell:i.func.isRequired,onDeleteOffsetWell:i.func.isRequired},b.defaultProps={subjectWell:null,popUpFormatter:null,coordsDataPath:"settings.top_hole.coordinates",offsetWells:null};var B=r(b);export{B as default};

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/index.js

@@ -1,71 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { memo, useMemo } from 'react';
-import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core';
-import FormationsLegend from './FormationsLegend.js';
-import popupGenerator from './popupGenerator.js';
-import { getAllFormations } from './utils.js';
-import Map from './Map.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var useStyles = makeStyles({
-  mapContainerHidden: {
-    marginTop: '20px',
-    display: 'none'
-  }
-});
-function MapContainer(_ref) {
-  var open = _ref.open,
-    subjectWell = _ref.subjectWell,
-    wells = _ref.wells,
-    offsetWells = _ref.offsetWells,
-    radius = _ref.radius,
-    mapHidden = _ref.mapHidden,
-    isMobile = _ref.isMobile,
-    onAddOffsetWell = _ref.onAddOffsetWell,
-    onDeleteOffsetWell = _ref.onDeleteOffsetWell;
-  var classes = useStyles();
-  var _useMemo = useMemo(function () {
-      return getAllFormations(wells);
-    }, [wells]),
-    _useMemo2 = _slicedToArray(_useMemo, 2),
-    formations = _useMemo2[0],
-    formationColors = _useMemo2[1];
-  return /*#__PURE__*/jsxs("div", {
-    className: mapHidden && classes.mapContainerHidden,
-    children: [/*#__PURE__*/jsx(Map, {
-      open: open,
-      subjectWell: subjectWell,
-      wells: wells,
-      offsetWells: offsetWells,
-      radius: radius,
-      formationColors: formationColors,
-      popUpFormatter: popupGenerator(),
-      coordsDataPath: "topHole.coordinates",
-      onAddOffsetWell: onAddOffsetWell,
-      onDeleteOffsetWell: onDeleteOffsetWell
-    }), !isMobile && /*#__PURE__*/jsx(FormationsLegend, {
-      formations: formations,
-      formationColors: formationColors
-    })]
-  });
-}
-MapContainer.propTypes = {
-  open: PropTypes.bool.isRequired,
-  subjectWell: PropTypes.shape({}),
-  wells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  offsetWells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  radius: PropTypes.number,
-  mapHidden: PropTypes.bool.isRequired,
-  isMobile: PropTypes.bool.isRequired,
-  onAddOffsetWell: PropTypes.func.isRequired,
-  onDeleteOffsetWell: PropTypes.func.isRequired
-};
-MapContainer.defaultProps = {
-  subjectWell: null,
-  radius: null
-};
-var WellsMap = memo(MapContainer);
-
-export { WellsMap as default };
-//# sourceMappingURL=index.js.map
+import e from"@babel/runtime/helpers/slicedToArray";import{memo as o,useMemo as r}from"react";import l from"prop-types";import{makeStyles as s}from"@material-ui/core";import i from"./FormationsLegend.js";import t from"./popupGenerator.js";import{getAllFormations as a}from"./utils.js";import n from"./Map.js";import{jsxs as p,jsx as f}from"react/jsx-runtime";var d=s({mapContainerHidden:{marginTop:"20px",display:"none"}});function m(o){var l=o.open,s=o.subjectWell,m=o.wells,u=o.offsetWells,c=o.radius,W=o.mapHidden,b=o.isMobile,j=o.onAddOffsetWell,O=o.onDeleteOffsetWell,q=d(),R=r((function(){return a(m)}),[m]),h=e(R,2),y=h[0],H=h[1];return p("div",{className:W&&q.mapContainerHidden,children:[f(n,{open:l,subjectWell:s,wells:m,offsetWells:u,radius:c,formationColors:H,popUpFormatter:t(),coordsDataPath:"topHole.coordinates",onAddOffsetWell:j,onDeleteOffsetWell:O}),!b&&f(i,{formations:y,formationColors:H})]})}m.propTypes={open:l.bool.isRequired,subjectWell:l.shape({}),wells:l.arrayOf(l.shape({})).isRequired,offsetWells:l.arrayOf(l.shape({})).isRequired,radius:l.number,mapHidden:l.bool.isRequired,isMobile:l.bool.isRequired,onAddOffsetWell:l.func.isRequired,onDeleteOffsetWell:l.func.isRequired},m.defaultProps={subjectWell:null,radius:null};var u=o(m);export{u as default};

package/components/OffsetWellPickerV3/components/CustomSelectionView/components/Map/popupGenerator.js

@@ -1,82 +1 @@
-import moment from 'moment';
-import { makeStyles } from '@material-ui/core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-/* eslint-disable react/prop-types */
-var useStyles = makeStyles({
-  popup: {
-    color: '#fff',
-    fontFamily: 'Roboto'
-  },
-  wellColor: {
-    width: '9px',
-    height: '9px',
-    borderRadius: '50%',
-    display: 'inline-block',
-    marginRight: '8px'
-  },
-  wellNameWrapper: {
-    marginBottom: '8px'
-  },
-  wellName: {
-    fontFamily: 'Roboto',
-    fontStyle: 'normal',
-    fontWeight: 'normal',
-    fontSize: '11px',
-    lineHeight: '16px',
-    letterSpacing: '0.4px',
-    color: '#FFFFFF'
-  },
-  popupInfo: {
-    fontFamily: 'Roboto',
-    fontStyle: 'normal',
-    fontWeight: 'normal',
-    fontSize: '11px',
-    lineHeight: '16px',
-    letterSpacing: '0.4px',
-    color: '#BDBDBD'
-  },
-  popupFormation: {
-    fontFamily: 'Roboto',
-    fontStyle: 'normal',
-    fontWeight: 'normal',
-    fontSize: '12px',
-    lineHeight: '17px',
-    letterSpacing: '0.4px',
-    color: '#BDBDBD'
-  }
-});
-var popupGenerator = function popupGenerator() {
-  return function (_ref) {
-    var well = _ref.well,
-      color = _ref.color;
-    var styles = useStyles();
-    return /*#__PURE__*/jsxs("div", {
-      className: styles.popup,
-      children: [/*#__PURE__*/jsx("div", {
-        className: styles.wellNameWrapper,
-        children: /*#__PURE__*/jsx("span", {
-          className: styles.wellName,
-          children: well.name
-        })
-      }), /*#__PURE__*/jsxs("div", {
-        className: styles.popupInfo,
-        children: ["Well Depth:", Number.isFinite(well.rigReleaseDate) ? "".concat(Math.floor(well.totalDepth), " ft") : 'N/A']
-      }), /*#__PURE__*/jsxs("div", {
-        className: styles.popupInfo,
-        children: ["Release Date:", Number.isFinite(well.rigReleaseDate) ? moment.unix(well.rigReleaseDate).format('MM/DD/YYYY') : 'N/A']
-      }), /*#__PURE__*/jsxs("div", {
-        className: styles.popupFormation,
-        children: [/*#__PURE__*/jsx("div", {
-          className: styles.wellColor,
-          style: {
-            backgroundColor: color
-          }
-        }), well.formation]
-      })]
-    });
-  };
-};
-
-export { popupGenerator as default };
-//# sourceMappingURL=popupGenerator.js.map
+import e from"moment";import{makeStyles as o}from"@material-ui/core";import{jsxs as l,jsx as t}from"react/jsx-runtime";var a=o({popup:{color:"#fff",fontFamily:"Roboto"},wellColor:{width:"9px",height:"9px",borderRadius:"50%",display:"inline-block",marginRight:"8px"},wellNameWrapper:{marginBottom:"8px"},wellName:{fontFamily:"Roboto",fontStyle:"normal",fontWeight:"normal",fontSize:"11px",lineHeight:"16px",letterSpacing:"0.4px",color:"#FFFFFF"},popupInfo:{fontFamily:"Roboto",fontStyle:"normal",fontWeight:"normal",fontSize:"11px",lineHeight:"16px",letterSpacing:"0.4px",color:"#BDBDBD"},popupFormation:{fontFamily:"Roboto",fontStyle:"normal",fontWeight:"normal",fontSize:"12px",lineHeight:"17px",letterSpacing:"0.4px",color:"#BDBDBD"}}),i=function(){return function(o){var i=o.well,r=o.color,n=a();return l("div",{className:n.popup,children:[t("div",{className:n.wellNameWrapper,children:t("span",{className:n.wellName,children:i.name})}),l("div",{className:n.popupInfo,children:["Well Depth:",Number.isFinite(i.rigReleaseDate)?"".concat(Math.floor(i.totalDepth)," ft"):"N/A"]}),l("div",{className:n.popupInfo,children:["Release Date:",Number.isFinite(i.rigReleaseDate)?e.unix(i.rigReleaseDate).format("MM/DD/YYYY"):"N/A"]}),l("div",{className:n.popupFormation,children:[t("div",{className:n.wellColor,style:{backgroundColor:r}}),i.formation]})]})}};export{i as default};