Convert lodah-es and d3 to named imports for ui/panels

modules/ui/panels/background.js

@@ -1,5 +1,11 @@
-import * as d3 from 'd3';
-import _ from 'lodash';
+import _debounce from 'lodash-es/debounce';
+import _without from 'lodash-es/without';
+
+import {
+    event as d3_event,
+    select as d3_select
+} from 'd3-selection';
+
 import { t } from '../../util/locale';
 
 
@@ -11,7 +17,7 @@ export function uiPanelBackground(context) {
         'zoom', 'vintage', 'source', 'description', 'resolution', 'accuracy'
     ];
 
-    var debouncedRedraw = _.debounce(redraw, 250);
+    var debouncedRedraw = _debounce(redraw, 250);
 
     function redraw(selection) {
         if (currSourceName !== background.baseLayerSource().name()) {
@@ -50,17 +56,17 @@ export function uiPanelBackground(context) {
             .attr('href', '#')
             .attr('class', 'button button-toggle-tiles')
             .on('click', function() {
-                d3.event.preventDefault();
+                d3_event.preventDefault();
                 context.setDebug('tile', !context.getDebug('tile'));
                 selection.call(redraw);
             });
     }
 
 
-    var debouncedGetMetadata = _.debounce(getMetadata, 250);
+    var debouncedGetMetadata = _debounce(getMetadata, 250);
 
     function getMetadata(selection) {
-        var tile = d3.select('.layer-background img.tile-center');   // tile near viewport center
+        var tile = d3_select('.layer-background img.tile-center');   // tile near viewport center
         if (tile.empty()) return;
 
         var sourceName = currSourceName,
@@ -89,7 +95,7 @@ export function uiPanelBackground(context) {
                 .text(metadata.vintage);
 
             // update other metdata
-            _.without(metadataKeys, 'zoom', 'vintage')
+            _without(metadataKeys, 'zoom', 'vintage')
                 .forEach(function(k) {
                     var val = result[k];
                     metadata[k] = val;

modules/ui/panels/history.js

@@ -1,4 +1,5 @@
-import _ from 'lodash';
+import _filter from 'lodash-es/filter';
+
 import { t } from '../../util/locale';
 import { svgIcon } from '../../svg';
 
@@ -91,7 +92,7 @@ export function uiPanelHistory(context) {
 
 
     function redraw(selection) {
-        var selected = _.filter(context.selectedIDs(), function(e) { return context.hasEntity(e); }),
+        var selected = _filter(context.selectedIDs(), function(e) { return context.hasEntity(e); }),
             singular = selected.length === 1 ? selected[0] : null;
 
         osm = context.connection();

modules/ui/panels/location.js

@@ -1,4 +1,5 @@
-import _ from 'lodash';
+import _debounce from 'lodash-es/debounce';
+
 import { t } from '../../util/locale';
 import { services } from '../../services';
 
@@ -49,7 +50,7 @@ export function uiPanelLocation(context) {
     }
 
 
-    var debouncedGetLocation = _.debounce(getLocation, 250);
+    var debouncedGetLocation = _debounce(getLocation, 250);
     function getLocation(selection, coord) {
         if (!services.geocoder) {
             currLocation = t('info_panels.location.unknown_location');

modules/ui/panels/measurement.js

@@ -1,13 +1,16 @@
-import * as d3 from 'd3';
-import _ from 'lodash';
+import _filter from 'lodash-es/filter';
+
+import { event as d3_event } from 'd3-selection';
+
+import {
+    geoLength as d3_geoLength,
+    geoCentroid as d3_geoCentroid
+} from 'd3-geo';
+
 import { t } from '../../util/locale';
 import { geoExtent } from '../../geo';
 import { utilDetect } from '../../util/detect';
 
-import {
-    geoLength as d3GeoLength,
-    geoCentroid as d3GeoCentroid
-} from 'd3';
 
 
 export function uiPanelMeasurement(context) {
@@ -111,7 +114,7 @@ export function uiPanelMeasurement(context) {
 
     function redraw(selection) {
         var resolver = context.graph(),
-            selected = _.filter(context.selectedIDs(), function(e) { return context.hasEntity(e); }),
+            selected = _filter(context.selectedIDs(), function(e) { return context.hasEntity(e); }),
             singular = selected.length === 1 ? selected[0] : null,
             extent = geoExtent(),
             entity;
@@ -153,9 +156,9 @@ export function uiPanelMeasurement(context) {
         if (geometry === 'line' || geometry === 'area') {
             var closed = (entity.type === 'relation') || (entity.isClosed() && !entity.isDegenerate()),
                 feature = entity.asGeoJSON(resolver),
-                length = radiansToMeters(d3GeoLength(toLineString(feature))),
+                length = radiansToMeters(d3_geoLength(toLineString(feature))),
                 lengthLabel = t('info_panels.measurement.' + (closed ? 'perimeter' : 'length')),
-                centroid = d3GeoCentroid(feature);
+                centroid = d3_geoCentroid(feature);
 
             list
                 .append('li')
@@ -188,7 +191,7 @@ export function uiPanelMeasurement(context) {
                 .attr('href', '#')
                 .attr('class', 'button button-toggle-units')
                 .on('click', function() {
-                    d3.event.preventDefault();
+                    d3_event.preventDefault();
                     isImperial = !isImperial;
                     selection.call(redraw);
                 });