@corva/ui 0.34.0-rc.3 → 0.34.0

package/components/BICOffsetPickerDialog/components/Map/Map.js

@@ -1,209 +1 @@
-import { get } from 'lodash';
-import { mapbox } from '../../../../utils/index.js';
-import { jsx } from 'react/jsx-runtime';
-import L from 'mapbox.js';
-import { memo, useRef, useMemo, useEffect, createElement } from 'react';
-import PropTypes from 'prop-types';
-import ReactDOM from 'react-dom';
-import { usePrevious } from '../../effects/index.js';
-import styles from './Map.css.js';
-
-var isValidCoordinates = mapbox.isValidCoordinates;
-var RADIUS_CIRCLE_COLOR = '#03BCD4';
-var METERS_IN_MILE = 1609.34;
-var DEFAULT_SUBJECT_WELL_MARKER_SIZE = 8;
-var DEFAULT_WELL_MARKER_SIZE = 5;
-var OFFSET_WELL_COLOR = '#FFC107';
-var DEFAULT_COORDS = [29.749907, -95.358421]; // TX coordinates
-
-var toolTip = function toolTip() {
-  return (// eslint-disable-next-line react/prop-types
-    function (_ref) {
-      var well = _ref.well;
-      return /*#__PURE__*/jsx("div", {
-        style: {
-          color: '#fff',
-          background: '##414141'
-        },
-        children: /*#__PURE__*/jsx("span", {
-          style: {
-            fontSize: '11px',
-            lineHeight: '16px'
-          },
-          children: get(well, 'name')
-        })
-      });
-    }
-  );
-}; // eslint-disable-next-line no-unused-vars
-
-
-function WellsMap(_ref2) {
-  var subjectWell = _ref2.subjectWell,
-      wells = _ref2.wells,
-      offsetWells = _ref2.offsetWells,
-      radius = _ref2.radius,
-      subjectWellMarkerSize = _ref2.subjectWellMarkerSize,
-      wellMarkerSize = _ref2.wellMarkerSize,
-      coordsDataPath = _ref2.coordsDataPath;
-  var mapContainerRef = useRef(null);
-  var radiusCircleRef = useRef(null);
-  var markersGroupRef = useRef(null);
-  var highlightMarkerRef = useRef(null);
-  var prevWells = usePrevious(wells);
-  var subjectWellCoords = useMemo(function () {
-    return subjectWell && get(subjectWell, coordsDataPath);
-  }, [subjectWell, coordsDataPath]); // NOTE: Initialize map
-
-  useEffect(function () {
-    mapContainerRef.current = L.mapbox.map(mapContainerRef.current, null, {
-      attributionControl: false,
-      scrollWheelZoom: false,
-      zoomControl: false
-    }).setView(DEFAULT_COORDS, 1);
-    L.control.zoom({
-      position: 'bottomright'
-    }).addTo(mapContainerRef.current);
-    L.mapbox.styleLayer('mapbox://styles/mapbox/dark-v9').addTo(mapContainerRef.current);
-  }, []); // NOTE: Radius circle
-
-  useEffect(function () {
-    if (!mapContainerRef.current) {
-      return;
-    } // NOTE: Clean up
-
-
-    if (radiusCircleRef.current) {
-      mapContainerRef.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(mapContainerRef.current);
-  }, [radius, subjectWellCoords]);
-
-  var handleMouseOver = function handleMouseOver(markers, coords, r) {
-    highlightMarkerRef.current = L.circleMarker(coords, {
-      radius: r * 3,
-      stroke: false,
-      fill: true,
-      fillOpacity: 0.2,
-      fillColor: OFFSET_WELL_COLOR,
-      className: 'circle_highlight'
-    });
-    highlightMarkerRef.current.addEventListener('mouseout', function () {
-      markersGroupRef.current.removeFrom(mapContainerRef.current);
-      markersGroupRef.current = L.featureGroup(markers);
-      markersGroupRef.current.addTo(mapContainerRef.current);
-      mapContainerRef.current.closePopup();
-    });
-    var newMarkers = markers.concat(highlightMarkerRef.current);
-    markersGroupRef.current = L.featureGroup(newMarkers);
-    markersGroupRef.current.addTo(mapContainerRef.current);
-  }; // NOTE: Well markers
-
-
-  useEffect(function () {
-    if (!mapContainerRef.current) {
-      return;
-    }
-
-    mapContainerRef.current.closePopup(); // NOTE: Clean up
-
-    if (markersGroupRef.current) {
-      markersGroupRef.current.removeFrom(mapContainerRef.current);
-    }
-
-    var offsetWellIds = offsetWells.map(function (well) {
-      return well.id;
-    });
-    var markers = [];
-    wells.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 ? subjectWellMarkerSize : wellMarkerSize;
-        var color = OFFSET_WELL_COLOR;
-        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 () {
-          // Tooltip
-          var tooltipContainer = document.createElement('div');
-          var tootipContent = createElement(toolTip(), {
-            well: well
-          });
-          ReactDOM.render(tootipContent, tooltipContainer);
-          L.popup().setLatLng(coords).setContent(tooltipContainer).openOn(mapContainerRef.current); // Highlight
-
-          handleMouseOver(markers, coords, r);
-        });
-        markers.push(newMarker);
-      }
-    });
-
-    if (markers.length) {
-      markersGroupRef.current = L.featureGroup(markers);
-      markersGroupRef.current.addTo(mapContainerRef.current);
-    }
-
-    setTimeout(function () {
-      if (radiusCircleRef.current) {
-        radiusCircleRef.current.bringToBack();
-      }
-
-      if (mapContainerRef.current && markersGroupRef.current && wells !== prevWells) {
-        mapContainerRef.current.fitBounds(markersGroupRef.current.getBounds());
-      }
-    }, 500);
-  }, [subjectWell, wells, offsetWells]);
-  return /*#__PURE__*/jsx("div", {
-    className: styles.map,
-    children: /*#__PURE__*/jsx("div", {
-      className: styles.mapMain,
-      ref: mapContainerRef
-    })
-  });
-}
-
-WellsMap.propTypes = {
-  subjectWell: PropTypes.shape({
-    id: PropTypes.number,
-    formation: PropTypes.string
-  }),
-  wells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  offsetWells: PropTypes.arrayOf(PropTypes.shape({})),
-  radius: PropTypes.number.isRequired,
-  subjectWellMarkerSize: PropTypes.number,
-  wellMarkerSize: PropTypes.number,
-  coordsDataPath: PropTypes.string
-};
-WellsMap.defaultProps = {
-  subjectWell: null,
-  subjectWellMarkerSize: DEFAULT_SUBJECT_WELL_MARKER_SIZE,
-  wellMarkerSize: DEFAULT_WELL_MARKER_SIZE,
-  coordsDataPath: 'settings.top_hole.coordinates',
-  offsetWells: null
-};
-var Map = memo(WellsMap);
-
-export default Map;
-//# sourceMappingURL=Map.js.map
+import{memo as r,useRef as e,useMemo as t,useEffect as o,createElement as n}from"react";import l from"react-dom";import u from"prop-types";import c from"mapbox.js";import{get as i}from"lodash";import{mapbox as a}from"../../../../utils/index.js";import{usePrevious as s}from"../../effects/index.js";import f from"./Map.css.js";import{jsx as m}from"react/jsx-runtime";var d=a.isValidCoordinates,p=[29.749907,-95.358421];function h(r){var u=r.subjectWell,a=r.wells,h=r.offsetWells,v=r.radius,b=r.subjectWellMarkerSize,k=r.wellMarkerSize,y=r.coordsDataPath,g=e(null),j=e(null),x=e(null),C=e(null),M=s(a),W=t((function(){return u&&i(u,y)}),[u,y]);o((function(){g.current=c.mapbox.map(g.current,null,{attributionControl:!1,scrollWheelZoom:!1,zoomControl:!1}).setView(p,1),c.control.zoom({position:"bottomright"}).addTo(g.current),c.mapbox.styleLayer("mapbox://styles/mapbox/dark-v9").addTo(g.current)}),[]),o((function(){g.current&&(j.current&&g.current.removeLayer(j.current),W?(j.current=c.circle(W,1609.34*v,{stroke:!1,fill:!0,fillOpacity:.2,fillColor:"#03BCD4",className:"circle_500"}),j.current.addTo(g.current)):j.current=null)}),[v,W]);return o((function(){if(g.current){g.current.closePopup(),x.current&&x.current.removeFrom(g.current);var r=h.map((function(r){return r.id})),e=[];a.forEach((function(t){var o=i(t,y);if(o&&d(o)){var a=u&&u.id===t.id,s=r.includes(t.id),f=a?b:k,p=a||s?1:.3,h=c.circleMarker(o,{radius:f,stroke:!1,fill:!0,fillOpacity:p,fillColor:"#FFC107",className:"circle_500"});h.addEventListener("mouseover",(function(){var r=document.createElement("div"),u=n((function(r){var e=r.well;return m("div",{style:{color:"#fff",background:"##414141"},children:m("span",{style:{fontSize:"11px",lineHeight:"16px"},children:i(e,"name")})})}),{well:t});l.render(u,r),c.popup().setLatLng(o).setContent(r).openOn(g.current),function(r,e,t){C.current=c.circleMarker(e,{radius:3*t,stroke:!1,fill:!0,fillOpacity:.2,fillColor:"#FFC107",className:"circle_highlight"}),C.current.addEventListener("mouseout",(function(){x.current.removeFrom(g.current),x.current=c.featureGroup(r),x.current.addTo(g.current),g.current.closePopup()}));var o=r.concat(C.current);x.current=c.featureGroup(o),x.current.addTo(g.current)}(e,o,f)})),e.push(h)}})),e.length&&(x.current=c.featureGroup(e),x.current.addTo(g.current)),setTimeout((function(){j.current&&j.current.bringToBack(),g.current&&x.current&&a!==M&&g.current.fitBounds(x.current.getBounds())}),500)}}),[u,a,h]),m("div",{className:f.map,children:m("div",{className:f.mapMain,ref:g})})}h.propTypes={subjectWell:u.shape({id:u.number,formation:u.string}),wells:u.arrayOf(u.shape({})).isRequired,offsetWells:u.arrayOf(u.shape({})),radius:u.number.isRequired,subjectWellMarkerSize:u.number,wellMarkerSize:u.number,coordsDataPath:u.string},h.defaultProps={subjectWell:null,subjectWellMarkerSize:8,wellMarkerSize:5,coordsDataPath:"settings.top_hole.coordinates",offsetWells:null};var v=r(h);export{v as default};

package/components/BICOffsetPickerDialog/components/Map/index.css.js

@@ -1,8 +1 @@
-import styleInject from '../../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".index_mapContainer__3BpOT {\n  margin-top: 8px;\n  width: 472px;\n}\n\n.index_mapContainerHidden__2ReEL {\n  margin-top: 20px;\n  display: none;\n}\n";
-var styles = {"mapContainer":"index_mapContainer__3BpOT","mapContainerHidden":"index_mapContainerHidden__2ReEL"};
-styleInject(css_248z);
-
-export default styles;
-//# sourceMappingURL=index.css.js.map
+import n from'./../../../../ext-esm/style-inject/dist/style-inject.es.js';var e={mapContainer:"index_mapContainer__MoxG7",mapContainerHidden:"index_mapContainerHidden__b-kgb"};n(".index_mapContainer__MoxG7{margin-top:8px;width:472px}.index_mapContainerHidden__b-kgb{display:none;margin-top:20px}");export{e as default};

package/components/BICOffsetPickerDialog/components/Map/index.js

@@ -1,42 +1 @@
-import { jsx } from 'react/jsx-runtime';
-import { memo } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import Map from './Map.js';
-import styles from './index.css.js';
-
-function MapContainer(_ref) {
-  var subjectWell = _ref.subjectWell,
-      wells = _ref.wells,
-      offsetWells = _ref.offsetWells,
-      radius = _ref.radius,
-      mapHidden = _ref.mapHidden;
-  var containerClass = classNames(styles.mapContainer, mapHidden && styles.mapContainerHidden);
-  return /*#__PURE__*/jsx("div", {
-    className: containerClass,
-    children: /*#__PURE__*/jsx(Map, {
-      subjectWell: subjectWell,
-      wells: wells,
-      offsetWells: offsetWells,
-      radius: radius,
-      coordsDataPath: "topHole.coordinates"
-    })
-  });
-}
-
-MapContainer.propTypes = {
-  subjectWell: PropTypes.shape({}),
-  wells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  offsetWells: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  radius: PropTypes.number,
-  mapHidden: PropTypes.bool
-};
-MapContainer.defaultProps = {
-  subjectWell: null,
-  radius: 5,
-  mapHidden: false
-};
-var WellsMap = memo(MapContainer);
-
-export default WellsMap;
-//# sourceMappingURL=index.js.map
+import{memo as e}from"react";import r from"prop-types";import s from"classnames";import a from"./Map.js";import o from"./index.css.js";import{jsx as l}from"react/jsx-runtime";function t(e){var r=e.subjectWell,t=e.wells,i=e.offsetWells,p=e.radius,d=e.mapHidden,m=s(o.mapContainer,d&&o.mapContainerHidden);return l("div",{className:m,children:l(a,{subjectWell:r,wells:t,offsetWells:i,radius:p,coordsDataPath:"topHole.coordinates"})})}t.propTypes={subjectWell:r.shape({}),wells:r.arrayOf(r.shape({})).isRequired,offsetWells:r.arrayOf(r.shape({})).isRequired,radius:r.number,mapHidden:r.bool},t.defaultProps={subjectWell:null,radius:5,mapHidden:!1};var i=e(t);export{i as default};

package/components/BICOffsetPickerDialog/components/WellSection/AssetSearch.js

@@ -1,102 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { makeStyles, TextField, InputAdornment, Popover } from '@material-ui/core';
-import { memo, useState } from 'react';
-import PropTypes from 'prop-types';
-import { Search } from '@material-ui/icons';
-import AutoCompleteAssetSearch from './AutoCompleteAssetSearch/AutoCompleteAssetSearch.js';
-
-var useStyles = makeStyles(function (theme) {
-  return {
-    searchInput: {
-      fontSize: '16px',
-      width: '270px',
-      '&:hover': {
-        '&::before': {
-          borderBottom: "2px solid ".concat(theme.palette.primary.text1, " !important")
-        }
-      },
-      '&:hover $searchIcon': {
-        fill: "".concat(theme.palette.primary.text1, " !important")
-      }
-    },
-    searchIcon: {
-      fill: "".concat(theme.palette.primary.text6, " !important"),
-      fontSize: '24px !important'
-    }
-  };
-});
-
-function AssetSearch(_ref) {
-  var company = _ref.company,
-      onClickAsset = _ref.onClickAsset;
-  var classes = useStyles();
-
-  var _useState = useState(null),
-      _useState2 = _slicedToArray(_useState, 2),
-      anchorEl = _useState2[0],
-      setAnchorEl = _useState2[1];
-
-  var handlePopupOpen = function handlePopupOpen(event) {
-    setAnchorEl(event.currentTarget);
-  };
-
-  var handlePopupClose = function handlePopupClose() {
-    setAnchorEl(null);
-  };
-
-  var handleClickAsset = function handleClickAsset(asset) {
-    var name = asset.name,
-        redirectAssetId = asset.redirectAssetId;
-
-    if (redirectAssetId) {
-      onClickAsset(redirectAssetId, name);
-      handlePopupClose();
-    }
-  };
-
-  return /*#__PURE__*/jsxs(Fragment, {
-    children: [/*#__PURE__*/jsx(TextField, {
-      id: "well-section-search-textfield",
-      placeholder: "Add to List by Well/Rig Search",
-      InputProps: {
-        startAdornment: /*#__PURE__*/jsx(InputAdornment, {
-          position: "start",
-          children: /*#__PURE__*/jsx(Search, {
-            className: classes.searchIcon
-          })
-        }),
-        className: classes.searchInput
-      },
-      onClick: handlePopupOpen
-    }), /*#__PURE__*/jsx(Popover, {
-      open: Boolean(anchorEl),
-      anchorEl: anchorEl,
-      onClose: handlePopupClose,
-      anchorOrigin: {
-        vertical: 'top',
-        horizontal: 'left'
-      },
-      transformOrigin: {
-        vertical: 'top',
-        horizontal: 'left'
-      },
-      children: /*#__PURE__*/jsx(AutoCompleteAssetSearch, {
-        company: company,
-        onClickAsset: handleClickAsset,
-        onClose: handlePopupClose
-      })
-    })]
-  });
-}
-
-AssetSearch.propTypes = {
-  company: PropTypes.number.isRequired,
-  onClickAsset: PropTypes.func.isRequired
-}; // Important: Do not change root component default export (AssetSearch.js). Use it as container
-//  for your AssetSearch. It's required to make build and zip scripts work as expected;
-
-var AssetSearch$1 = memo(AssetSearch);
-
-export default AssetSearch$1;
-//# sourceMappingURL=AssetSearch.js.map
+import t from"@babel/runtime/helpers/slicedToArray";import{memo as r,useState as e}from"react";import o from"prop-types";import{makeStyles as n,TextField as i,InputAdornment as a,Popover as c}from"@material-ui/core";import{Search as l}from"@material-ui/icons";import p from"./AutoCompleteAssetSearch/AutoCompleteAssetSearch.js";import{jsxs as s,Fragment as m,jsx as u}from"react/jsx-runtime";var f=n((function(t){return{searchInput:{fontSize:"16px",width:"270px","&:hover":{"&::before":{borderBottom:"2px solid ".concat(t.palette.primary.text1," !important")}},"&:hover $searchIcon":{fill:"".concat(t.palette.primary.text1," !important")}},searchIcon:{fill:"".concat(t.palette.primary.text6," !important"),fontSize:"24px !important"}}}));function h(r){var o=r.company,n=r.onClickAsset,h=f(),d=e(null),A=t(d,2),x=A[0],y=A[1],v=function(){y(null)};return s(m,{children:[u(i,{id:"well-section-search-textfield",placeholder:"Add to List by Well/Rig Search",InputProps:{startAdornment:u(a,{position:"start",children:u(l,{className:h.searchIcon})}),className:h.searchInput},onClick:function(t){y(t.currentTarget)}}),u(c,{open:Boolean(x),anchorEl:x,onClose:v,anchorOrigin:{vertical:"top",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},children:u(p,{company:o,onClickAsset:function(t){var r=t.name,e=t.redirectAssetId;e&&(n(e,r),v())},onClose:v})})]})}h.propTypes={company:o.number.isRequired,onClickAsset:o.func.isRequired};var d=r(h);export{d as default};

package/components/BICOffsetPickerDialog/components/WellSection/AutoCompleteAssetSearch/AssetResultSection.js

@@ -1,178 +1 @@
-import { get, isEmpty } from 'lodash';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { makeStyles, List, ListSubheader, Chip, ListItem, ListItemText, Typography } from '@material-ui/core';
-import { useRef, useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import { SEARCH_CATEGORIES } from './constants.js';
-
-var PAGE_NAME = 'AssetResultSection';
-var useStyles = makeStyles(function (theme) {
-  return {
-    assetListWrapper: {
-      margin: '8px 0',
-      flex: 1
-    },
-    assetListContainer: {
-      maxHeight: '350px',
-      backgroundColor: theme.palette.background.paper,
-      position: 'relative',
-      overflow: 'auto'
-    },
-    listSection: {
-      backgroundColor: 'inherit'
-    },
-    ul: {
-      backgroundColor: 'inherit',
-      padding: 0
-    },
-    listGutters: {
-      padding: '2px 8px'
-    },
-    assetTypeSubheaderChip: {
-      height: '24px',
-      color: theme.palette.primary.text6
-    },
-    assetItemTextRoot: {
-      minWidth: '300px'
-    },
-    assetItemTextPrimary: {
-      overflow: 'hidden',
-      whiteSpace: 'nowrap',
-      textOverflow: 'ellipsis'
-    },
-    loadingInfo: {
-      textAlign: 'center',
-      fontSize: '12px',
-      lineHeight: '17px',
-      color: theme.palette.primary.text8
-    },
-    empty: {
-      color: theme.palette.primary.text6,
-      fontSize: '12px',
-      fontStyle: 'italic',
-      marginLeft: '8px'
-    }
-  };
-});
-
-var isLastPage = function isLastPage(data) {
-  return !data.find(function (_ref) {
-    var _ref2 = _slicedToArray(_ref, 2),
-        _ = _ref2[0],
-        value = _ref2[1];
-
-    return value.length === 40;
-  });
-};
-
-var AssetResultSection = function AssetResultSection(_ref3) {
-  var page = _ref3.page,
-      loading = _ref3.loading,
-      groupedAssets = _ref3.groupedAssets,
-      onClickAsset = _ref3.onClickAsset,
-      onScrollReached = _ref3.onScrollReached;
-  var classes = useStyles();
-  var listRef = useRef(null);
-
-  var _useState = useState('top'),
-      _useState2 = _slicedToArray(_useState, 2),
-      scrollPosition = _useState2[0],
-      setScrollPosition = _useState2[1];
-
-  useEffect(function () {
-    if (loading) return;
-
-    if (scrollPosition === 'top') {
-      listRef.current.scrollTo(0, 5);
-    }
-
-    if (scrollPosition === 'bottom') {
-      listRef.current.scrollTo(0, listRef.current.scrollHeight - listRef.current.offsetHeight - 5);
-    }
-  }, [loading]);
-
-  var handleScrollList = function handleScrollList(e) {
-    if (e.target.scrollHeight === e.target.offsetHeight) return;
-    var currentScrollBottom = e.target.scrollTop + e.target.offsetHeight; // NOTE: if scroll is near 1px from the bottom, then load new data.
-
-    if (Math.abs(e.target.scrollHeight - currentScrollBottom) < 1 && !isLastPage(groupedAssets)) {
-      setScrollPosition('top');
-      onScrollReached('bottom');
-    }
-
-    if (Math.round(e.target.scrollTop) === 0 && page > 1) {
-      setScrollPosition('bottom');
-      onScrollReached('top');
-    }
-  };
-
-  return /*#__PURE__*/jsxs("div", {
-    className: classes.assetListWrapper,
-    children: [/*#__PURE__*/jsxs(List, {
-      className: classes.assetListContainer,
-      subheader: /*#__PURE__*/jsx("li", {}),
-      onScroll: handleScrollList,
-      ref: listRef,
-      children: [groupedAssets.map(function (_ref4) {
-        var _ref5 = _slicedToArray(_ref4, 2),
-            assetTypeKey = _ref5[0],
-            asstes = _ref5[1];
-
-        return /*#__PURE__*/jsx("li", {
-          className: classes.listSection,
-          children: /*#__PURE__*/jsxs("ul", {
-            className: classes.ul,
-            children: [/*#__PURE__*/jsx(ListSubheader, {
-              classes: {
-                gutters: classes.listGutters
-              },
-              children: /*#__PURE__*/jsx(Chip, {
-                className: classes.assetTypeSubheaderChip,
-                variant: "outlined",
-                label: SEARCH_CATEGORIES[assetTypeKey].labelPlural
-              }, assetTypeKey)
-            }), asstes.map(function (asset) {
-              return /*#__PURE__*/jsx(ListItem, {
-                "data-testid": "".concat(PAGE_NAME, "_item_").concat(asset.name, "MenuItem"),
-                button: true,
-                classes: {
-                  gutters: classes.listGutters
-                },
-                disabled: !asset.redirectAssetId,
-                onClick: function onClick() {
-                  return onClickAsset(asset);
-                },
-                children: /*#__PURE__*/jsx(ListItemText, {
-                  primary: asset.name,
-                  classes: {
-                    root: classes.assetItemTextRoot,
-                    primary: classes.assetItemTextPrimary
-                  }
-                })
-              }, "item-".concat(assetTypeKey, "-").concat(get(asset, 'asset_id') ? get(asset, 'asset_id') : get(asset, 'id')));
-            })]
-          })
-        }, "section-".concat(assetTypeKey));
-      }), isEmpty(groupedAssets) && /*#__PURE__*/jsx("div", {
-        className: classes.empty,
-        children: "Your search did not match any Asset Name"
-      })]
-    }), loading && /*#__PURE__*/jsx(Typography, {
-      "data-testid": "".concat(PAGE_NAME, "_loading"),
-      className: classes.loadingInfo,
-      children: "Loading..."
-    })]
-  });
-};
-
-AssetResultSection.propTypes = {
-  page: PropTypes.number.isRequired,
-  loading: PropTypes.bool.isRequired,
-  groupedAssets: PropTypes.arrayOf(PropTypes.array).isRequired,
-  onClickAsset: PropTypes.func.isRequired,
-  onScrollReached: PropTypes.func.isRequired
-};
-
-export default AssetResultSection;
-//# sourceMappingURL=AssetResultSection.js.map
+import t from"@babel/runtime/helpers/slicedToArray";import{useRef as e,useState as r,useEffect as o}from"react";import a from"prop-types";import{get as i,isEmpty as s}from"lodash";import{makeStyles as n,List as l,ListSubheader as c,Chip as p,ListItem as d,ListItemText as u,Typography as m}from"@material-ui/core";import{SEARCH_CATEGORIES as f}from"./constants.js";import{jsxs as g,jsx as h}from"react/jsx-runtime";var x=n((function(t){return{assetListWrapper:{margin:"8px 0",flex:1},assetListContainer:{maxHeight:"350px",backgroundColor:t.palette.background.paper,position:"relative",overflow:"auto"},listSection:{backgroundColor:"inherit"},ul:{backgroundColor:"inherit",padding:0},listGutters:{padding:"2px 8px"},assetTypeSubheaderChip:{height:"24px",color:t.palette.primary.text6},assetItemTextRoot:{minWidth:"300px"},assetItemTextPrimary:{overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis"},loadingInfo:{textAlign:"center",fontSize:"12px",lineHeight:"17px",color:t.palette.primary.text8},empty:{color:t.palette.primary.text6,fontSize:"12px",fontStyle:"italic",marginLeft:"8px"}}})),b=function(a){var n=a.page,b=a.loading,y=a.groupedAssets,S=a.onClickAsset,v=a.onScrollReached,T=x(),R=e(null),A=r("top"),C=t(A,2),H=C[0],I=C[1];o((function(){b||("top"===H&&R.current.scrollTo(0,5),"bottom"===H&&R.current.scrollTo(0,R.current.scrollHeight-R.current.offsetHeight-5))}),[b]);return g("div",{className:T.assetListWrapper,children:[g(l,{className:T.assetListContainer,subheader:h("li",{}),onScroll:function(e){if(e.target.scrollHeight!==e.target.offsetHeight){var r=e.target.scrollTop+e.target.offsetHeight;Math.abs(e.target.scrollHeight-r)<1&&y.find((function(e){var r=t(e,2);return r[0],40===r[1].length}))&&(I("top"),v("bottom")),0===Math.round(e.target.scrollTop)&&n>1&&(I("bottom"),v("top"))}},ref:R,children:[y.map((function(e){var r=t(e,2),o=r[0],a=r[1];return h("li",{className:T.listSection,children:g("ul",{className:T.ul,children:[h(c,{classes:{gutters:T.listGutters},children:h(p,{className:T.assetTypeSubheaderChip,variant:"outlined",label:f[o].labelPlural},o)}),a.map((function(t){return h(d,{"data-testid":"".concat("AssetResultSection","_item_").concat(t.name,"MenuItem"),button:!0,classes:{gutters:T.listGutters},disabled:!t.redirectAssetId,onClick:function(){return S(t)},children:h(u,{primary:t.name,classes:{root:T.assetItemTextRoot,primary:T.assetItemTextPrimary}})},"item-".concat(o,"-").concat(i(t,"asset_id")?i(t,"asset_id"):i(t,"id")))}))]})},"section-".concat(o))})),s(y)&&h("div",{className:T.empty,children:"Your search did not match any Asset Name"})]}),b&&h(m,{"data-testid":"".concat("AssetResultSection","_loading"),className:T.loadingInfo,children:"Loading..."})]})};b.propTypes={page:a.number.isRequired,loading:a.bool.isRequired,groupedAssets:a.arrayOf(a.array).isRequired,onClickAsset:a.func.isRequired,onScrollReached:a.func.isRequired};export{b as default};

package/components/BICOffsetPickerDialog/components/WellSection/AutoCompleteAssetSearch/AssetTypesSection.js

@@ -1,60 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { makeStyles, Typography, Chip } from '@material-ui/core';
-import PropTypes from 'prop-types';
-import { CATEGORY_KEY_VALUES } from './constants.js';
-
-var PAGE_NAME = 'AssetTypesSection';
-var useStyles = makeStyles({
-  assetSelectorWrapper: {
-    margin: 8
-  },
-  description: {
-    color: '#BDBDBD',
-    fontSize: '12px',
-    lineHeight: '17px',
-    paddingBottom: '8px'
-  },
-  assetTypeChip: {
-    marginRight: '8px',
-    color: '#BDBDBD',
-    '&:last-child': {
-      marginRight: '0px'
-    }
-  }
-});
-
-var AssetTypesSection = function AssetTypesSection(_ref) {
-  var onClickAssetType = _ref.onClickAssetType;
-  var classes = useStyles();
-  return /*#__PURE__*/jsxs("div", {
-    className: classes.assetSelectorWrapper,
-    children: [/*#__PURE__*/jsx(Typography, {
-      className: classes.description,
-      children: "I'm looking for..."
-    }), /*#__PURE__*/jsx("div", {
-      children: CATEGORY_KEY_VALUES.map(function (_ref2) {
-        var _ref3 = _slicedToArray(_ref2, 2),
-            key = _ref3[0],
-            item = _ref3[1];
-
-        return /*#__PURE__*/jsx(Chip, {
-          "data-testid": "".concat(PAGE_NAME, "_chip_").concat(item.labelPlural),
-          className: classes.assetTypeChip,
-          variant: "outlined",
-          label: item.labelPlural,
-          onClick: function onClick() {
-            return onClickAssetType(key);
-          }
-        }, key);
-      })
-    })]
-  });
-};
-
-AssetTypesSection.propTypes = {
-  onClickAssetType: PropTypes.func.isRequired
-};
-
-export default AssetTypesSection;
-//# sourceMappingURL=AssetTypesSection.js.map
+import e from"@babel/runtime/helpers/slicedToArray";import r from"prop-types";import{makeStyles as t,Typography as i,Chip as a}from"@material-ui/core";import{CATEGORY_KEY_VALUES as o}from"./constants.js";import{jsxs as s,jsx as n}from"react/jsx-runtime";var p=t({assetSelectorWrapper:{margin:8},description:{color:"#BDBDBD",fontSize:"12px",lineHeight:"17px",paddingBottom:"8px"},assetTypeChip:{marginRight:"8px",color:"#BDBDBD","&:last-child":{marginRight:"0px"}}}),l=function(r){var t=r.onClickAssetType,l=p();return s("div",{className:l.assetSelectorWrapper,children:[n(i,{className:l.description,children:"I'm looking for..."}),n("div",{children:o.map((function(r){var i=e(r,2),o=i[0],s=i[1];return n(a,{"data-testid":"".concat("AssetTypesSection","_chip_").concat(s.labelPlural),className:l.assetTypeChip,variant:"outlined",label:s.labelPlural,onClick:function(){return t(o)}},o)}))})]})};l.propTypes={onClickAssetType:r.func.isRequired};export{l as default};