diff --git a/.prettierrc b/.prettierrc
index 4d40e22c7..de41e34cb 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,6 +1,5 @@
 {
-    "singleQuote": true,
-    "bracketSpacing": false,
-    "trailingComma": "es5",
-    "printWidth": 100
+  "singleQuote": true,
+  "bracketSpacing": false,
+  "printWidth": 100
 }
diff --git a/package.json b/package.json
index d47537ade..2a78cc1c6 100644
--- a/package.json
+++ b/package.json
@@ -86,7 +86,7 @@
     "postcss-combine-duplicated-selectors": "8.1.0",
     "postcss-custom-properties": "8.0.11",
     "postcss-remove-root": "0.0.2",
-    "prettier": "1.19.1",
+    "prettier": "2.0.2",
     "react": "16.13.1",
     "react-ace": "7.0.5",
     "react-dom": "16.13.1",
diff --git a/src/DefaultEditor.js b/src/DefaultEditor.js
index 711b285f1..f3ac9be18 100644
--- a/src/DefaultEditor.js
+++ b/src/DefaultEditor.js
@@ -33,13 +33,13 @@ class DefaultEditor extends Component {
   }
 
   hasTransforms() {
-    return this.context.fullData.some(d => TRANSFORMABLE_TRACES.includes(d.type));
+    return this.context.fullData.some((d) => TRANSFORMABLE_TRACES.includes(d.type));
   }
 
   hasAxes() {
     return (
       Object.keys(this.context.fullLayout._subplots).filter(
-        type =>
+        (type) =>
           !['cartesian', 'mapbox'].includes(type) &&
           this.context.fullLayout._subplots[type].length > 0
       ).length > 0
@@ -63,15 +63,15 @@ class DefaultEditor extends Component {
   }
 
   hasColorbars() {
-    return this.context.fullData.some(d => traceHasColorbar({}, d));
+    return this.context.fullData.some((d) => traceHasColorbar({}, d));
   }
 
   hasLegend() {
-    return this.context.fullData.some(t => t.showlegend !== undefined); // eslint-disable-line no-undefined
+    return this.context.fullData.some((t) => t.showlegend !== undefined); // eslint-disable-line no-undefined
   }
 
   hasMaps() {
-    return this.context.fullData.some(d =>
+    return this.context.fullData.some((d) =>
       [...TRACE_TO_AXIS.geo, ...TRACE_TO_AXIS.mapbox].includes(d.type)
     );
   }
diff --git a/src/EditorControls.js b/src/EditorControls.js
index 8a6704569..2d01105bd 100644
--- a/src/EditorControls.js
+++ b/src/EditorControls.js
@@ -31,7 +31,7 @@ class EditorControls extends Component {
   constructor(props, context) {
     super(props, context);
 
-    this.localize = key => localizeString(this.props.dictionaries || {}, this.props.locale, key);
+    this.localize = (key) => localizeString(this.props.dictionaries || {}, this.props.locale, key);
 
     // we only need to compute this once.
     if (this.props.plotly) {
@@ -107,7 +107,7 @@ class EditorControls extends Component {
               props = shamefullyCreateSplitStyleProps(graphDiv, attr, traceIndex, splitTraceGroup);
             }
 
-            props.forEach(p => {
+            props.forEach((p) => {
               if (value !== void 0) {
                 p.set(value);
               }
@@ -429,8 +429,8 @@ EditorControls.defaultProps = {
   showFieldTooltips: false,
   locale: 'en',
   traceTypesConfig: {
-    categories: _ => categoryLayout(_),
-    traces: _ => traceTypes(_),
+    categories: (_) => categoryLayout(_),
+    traces: (_) => traceTypes(_),
     complex: true,
   },
   fontOptions: DEFAULT_FONTS,
diff --git a/src/__stories__/index.js b/src/__stories__/index.js
index 2890c9408..0790d682c 100644
--- a/src/__stories__/index.js
+++ b/src/__stories__/index.js
@@ -98,7 +98,7 @@ const panelsToTest = {
   funnelarea: ['GraphCreatePanel', 'StyleTracesPanel'],
 };
 
-window.URL.createObjectURL = function() {
+window.URL.createObjectURL = function () {
   return null;
 };
 
@@ -128,10 +128,10 @@ const panelFixture = (Panel, group, name, figure, customConfig) => {
 
 let stories = storiesOf('Panels', module);
 
-Object.keys(mocks).forEach(m => {
+Object.keys(mocks).forEach((m) => {
   const selectedPanels = panelsToTest[m] ? panelsToTest[m] : Object.keys(panels);
 
-  selectedPanels.forEach(p => {
+  selectedPanels.forEach((p) => {
     const words = p.split(/(?=[A-Z])/);
     const panelGroup = words[0];
     const panelName = words.slice(1, -1).join(' ');
diff --git a/src/__tests__/syntax-test.js b/src/__tests__/syntax-test.js
index 1397f465f..be3c23005 100644
--- a/src/__tests__/syntax-test.js
+++ b/src/__tests__/syntax-test.js
@@ -3,16 +3,16 @@ import fs from 'fs';
 import glob from 'glob';
 
 const BLACK_LIST = ['fdescribe', 'fit', 'xdescribe', 'xit', 'it\\.only', 'describe\\.only'];
-const REGEXS = BLACK_LIST.map(token => new RegExp(`^\\s*${token}\\(.*`));
+const REGEXS = BLACK_LIST.map((token) => new RegExp(`^\\s*${token}\\(.*`));
 
 describe('Syntax and test validation', () => {
   describe(`ensures ${BLACK_LIST} is not present in tests`, () => {
     const files = glob.sync('!(node_modules|examples)/**/__tests__/*.js');
-    files.forEach(file =>
+    files.forEach((file) =>
       it(`checks ${file} for test checks`, () => {
         const code = fs.readFileSync(file, {encoding: 'utf-8'});
-        code.split('\n').forEach(line => {
-          expect(REGEXS.some(re => re.test(line))).toBe(false);
+        code.split('\n').forEach((line) => {
+          expect(REGEXS.some((re) => re.test(line))).toBe(false);
         });
       })
     );
diff --git a/src/components/PanelMenuWrapper.js b/src/components/PanelMenuWrapper.js
index 536e51b5e..0841bd112 100644
--- a/src/components/PanelMenuWrapper.js
+++ b/src/components/PanelMenuWrapper.js
@@ -9,7 +9,7 @@ class PanelsWithSidebar extends Component {
     super(props);
 
     const opts = this.computeMenuOptions(props);
-    const firstSidebarGroup = opts.filter(o => o.panels)[0];
+    const firstSidebarGroup = opts.filter((o) => o.panels)[0];
 
     this.state = {
       group: firstSidebarGroup.name,
@@ -53,7 +53,7 @@ class PanelsWithSidebar extends Component {
     let groupIndex;
     const childrenArray = sortMenu(React.Children.toArray(children), menuPanelOrder);
 
-    childrenArray.forEach(child => {
+    childrenArray.forEach((child) => {
       if (!child) {
         return;
       }
diff --git a/src/components/containers/MapboxLayersAccordion.js b/src/components/containers/MapboxLayersAccordion.js
index 226edcd88..508f2086f 100644
--- a/src/components/containers/MapboxLayersAccordion.js
+++ b/src/components/containers/MapboxLayersAccordion.js
@@ -30,7 +30,7 @@ class MapboxLayersAccordion extends Component {
 
     const addAction = {
       label: _('Layer'),
-      handler: context => {
+      handler: (context) => {
         const {fullContainer, updateContainer} = context;
         if (updateContainer) {
           const mapboxLayerIndex = Array.isArray(fullContainer.layers)
diff --git a/src/components/containers/PlotlyFold.js b/src/components/containers/PlotlyFold.js
index e7a706877..a01d8fca1 100644
--- a/src/components/containers/PlotlyFold.js
+++ b/src/components/containers/PlotlyFold.js
@@ -63,7 +63,7 @@ export class Fold extends Component {
       canDelete && typeof deleteContainer === 'function' ? (
         <div
           className="fold__top__delete js-fold__delete"
-          onClick={e => {
+          onClick={(e) => {
             e.stopPropagation();
             deleteContainer(foldInfo);
           }}
@@ -76,7 +76,7 @@ export class Fold extends Component {
       <div className="fold__top__moving-controls">
         <span
           className={`fold__top__moving-controls--up${canMoveUp ? '' : '--disabled'}`}
-          onClick={e => {
+          onClick={(e) => {
             // prevents fold toggle to happen when clicking on moving arrow controls
             e.stopPropagation();
 
@@ -92,7 +92,7 @@ export class Fold extends Component {
         </span>
         <span
           className={`fold__top__moving-controls--down${canMoveDown ? '' : '--disabled'}`}
-          onClick={e => {
+          onClick={(e) => {
             // prevents fold toggle to happen when clicking on moving arrow controls
             e.stopPropagation();
             if (canMoveDown) {
@@ -184,7 +184,7 @@ class PlotlyFold extends Fold {
   determineVisibility(nextProps, nextContext) {
     this.foldVisible = false;
 
-    React.Children.forEach(nextProps.children, child => {
+    React.Children.forEach(nextProps.children, (child) => {
       if (!child || this.foldVisible) {
         return;
       }
diff --git a/src/components/containers/PlotlyPanel.js b/src/components/containers/PlotlyPanel.js
index e3c20d19e..2466ce1cd 100644
--- a/src/components/containers/PlotlyPanel.js
+++ b/src/components/containers/PlotlyPanel.js
@@ -47,7 +47,7 @@ export class Panel extends Component {
 
   toggleFolds() {
     const {individualFoldStates} = this.state;
-    const hasOpen = individualFoldStates.length > 0 && individualFoldStates.some(s => s !== true);
+    const hasOpen = individualFoldStates.length > 0 && individualFoldStates.some((s) => s !== true);
     this.setState({
       individualFoldStates: individualFoldStates.map(() => hasOpen),
     });
@@ -61,7 +61,7 @@ export class Panel extends Component {
     // to get proper number of child folds and initialize component state
     let numFolds = 0;
 
-    React.Children.forEach(this.props.children, child => {
+    React.Children.forEach(this.props.children, (child) => {
       if (((child && child.type && child.type.plotly_editor_traits) || {}).foldable) {
         numFolds++;
       }
@@ -114,7 +114,7 @@ export class Panel extends Component {
           addAction={this.props.addAction}
           allowCollapse={this.props.showExpandCollapse && individualFoldStates.length > 1}
           toggleFolds={this.toggleFolds}
-          hasOpen={individualFoldStates.some(s => s === false)}
+          hasOpen={individualFoldStates.some((s) => s === false)}
         />
         <div className={bem('panel', 'content')}>{newChildren}</div>
       </div>
diff --git a/src/components/containers/PlotlySection.js b/src/components/containers/PlotlySection.js
index 21a615897..946aa3dc7 100644
--- a/src/components/containers/PlotlySection.js
+++ b/src/components/containers/PlotlySection.js
@@ -51,7 +51,7 @@ export default class PlotlySection extends Section {
     const {isVisible} = unpackPlotProps(nextProps, nextContext);
     this.sectionVisible = isVisibleGivenCustomConfig(isVisible, nextProps, nextContext);
 
-    React.Children.forEach(nextProps.children, child => {
+    React.Children.forEach(nextProps.children, (child) => {
       if (!child || this.sectionVisible) {
         return;
       }
diff --git a/src/components/containers/RangeSelectorAccordion.js b/src/components/containers/RangeSelectorAccordion.js
index 8e2c454ab..17ef7b9a3 100644
--- a/src/components/containers/RangeSelectorAccordion.js
+++ b/src/components/containers/RangeSelectorAccordion.js
@@ -42,7 +42,7 @@ class RangeSelectorAccordion extends Component {
 
     const addAction = {
       label: _('Button'),
-      handler: context => {
+      handler: (context) => {
         const {fullContainer, updateContainer} = context;
         if (updateContainer) {
           const rangeselectorIndex = Array.isArray(fullContainer.rangeselector.buttons)
diff --git a/src/components/containers/SubplotAccordion.js b/src/components/containers/SubplotAccordion.js
index 8d746eaef..c7ae24280 100644
--- a/src/components/containers/SubplotAccordion.js
+++ b/src/components/containers/SubplotAccordion.js
@@ -22,11 +22,11 @@ class SubplotAccordion extends Component {
     const subplotFolds = [];
 
     const allCartesianAxisCombinations = data.reduce((acc, curVal, inx) => {
-      if (TRACE_TO_AXIS.cartesian.some(c => c === curVal.type)) {
+      if (TRACE_TO_AXIS.cartesian.some((c) => c === curVal.type)) {
         const xaxis = 'xaxis' + (curVal.xaxis ? curVal.xaxis.substring(1) : '');
         const yaxis = 'yaxis' + (curVal.yaxis ? curVal.yaxis.substring(1) : '');
 
-        const existingComboIndex = acc.findIndex(t => t.xaxis === xaxis && t.yaxis === yaxis);
+        const existingComboIndex = acc.findIndex((t) => t.xaxis === xaxis && t.yaxis === yaxis);
         if (existingComboIndex === -1) {
           acc.push({
             xaxis: xaxis,
@@ -43,7 +43,7 @@ class SubplotAccordion extends Component {
     }, []);
 
     allCartesianAxisCombinations.forEach(
-      d =>
+      (d) =>
         (subplotFolds[d.index[0]] = (
           <CartesianSubplotFold
             key={d.index[0]}
@@ -84,16 +84,18 @@ class SubplotAccordion extends Component {
     }
      */
 
-    Object.keys(layout).forEach(layoutKey => {
+    Object.keys(layout).forEach((layoutKey) => {
       const traceIndexes = [];
       let subplotName;
       if (
-        ['geo', 'mapbox', 'polar', 'gl3d', 'ternary'].some(subplotType => {
+        ['geo', 'mapbox', 'polar', 'gl3d', 'ternary'].some((subplotType) => {
           subplotName = getSubplotTitle(layoutKey, subplotType, _);
           const trIndex =
             SUBPLOT_TO_ATTR[subplotType].layout === layoutKey
-              ? data.findIndex(trace => TRACE_TO_AXIS[subplotType].some(tt => tt === trace.type))
-              : data.findIndex(trace => trace[SUBPLOT_TO_ATTR[subplotType].data] === layoutKey);
+              ? data.findIndex((trace) =>
+                  TRACE_TO_AXIS[subplotType].some((tt) => tt === trace.type)
+                )
+              : data.findIndex((trace) => trace[SUBPLOT_TO_ATTR[subplotType].data] === layoutKey);
           if (trIndex !== -1) {
             traceIndexes.push(trIndex);
           }
diff --git a/src/components/containers/TraceAccordion.js b/src/components/containers/TraceAccordion.js
index db64c4f3d..0da73a990 100644
--- a/src/components/containers/TraceAccordion.js
+++ b/src/components/containers/TraceAccordion.js
@@ -30,7 +30,7 @@ class TraceAccordion extends Component {
 
     if (base && base.length && context.fullData.length) {
       this.filteredTraces = base.filter((t, i) => {
-        const fullTrace = props.canGroup ? t : context.fullData.filter(tr => tr.index === i)[0];
+        const fullTrace = props.canGroup ? t : context.fullData.filter((tr) => tr.index === i)[0];
 
         if (fullTrace) {
           const trace = context.data[fullTrace.index];
@@ -54,7 +54,7 @@ class TraceAccordion extends Component {
     const dataArrayPositionsByTraceType = {};
     const fullDataArrayPositionsByTraceType = {};
 
-    this.filteredTraces.forEach(trace => {
+    this.filteredTraces.forEach((trace) => {
       const traceType = plotlyTraceToCustomTrace(trace);
       if (!dataArrayPositionsByTraceType[traceType]) {
         dataArrayPositionsByTraceType[traceType] = [];
@@ -73,7 +73,7 @@ class TraceAccordion extends Component {
       <TraceFold
         key={index}
         traceIndexes={dataArrayPositionsByTraceType[type]}
-        name={traceTypes(_).find(t => t.value === type).label}
+        name={traceTypes(_).find((t) => t.value === type).label}
         fullDataArrayPosition={fullDataArrayPositionsByTraceType[type]}
       >
         {this.props.children}
diff --git a/src/components/containers/TraceRequiredPanel.js b/src/components/containers/TraceRequiredPanel.js
index e5f538e3b..13e4efcb3 100644
--- a/src/components/containers/TraceRequiredPanel.js
+++ b/src/components/containers/TraceRequiredPanel.js
@@ -5,7 +5,7 @@ import {LayoutPanel} from './derived';
 
 class TraceRequiredPanel extends Component {
   hasTrace() {
-    return this.context.fullData.filter(trace => trace.visible).length > 0;
+    return this.context.fullData.filter((trace) => trace.visible).length > 0;
   }
 
   render() {
diff --git a/src/components/containers/TransformAccordion.js b/src/components/containers/TransformAccordion.js
index 81bd56e8e..1c19a8055 100644
--- a/src/components/containers/TransformAccordion.js
+++ b/src/components/containers/TransformAccordion.js
@@ -26,15 +26,15 @@ class TransformAccordion extends Component {
 
     const transformBy =
       container.transforms &&
-      container.transforms.map(tr => {
+      container.transforms.map((tr) => {
         let foldNameSuffix = '';
         if (tr.groupssrc) {
           const groupssrc =
-            dataSourceOptions && dataSourceOptions.find(d => d.value === tr.groupssrc);
+            dataSourceOptions && dataSourceOptions.find((d) => d.value === tr.groupssrc);
           foldNameSuffix = `: ${groupssrc && groupssrc.label ? groupssrc.label : tr.groupssrc}`;
         } else if (tr.targetsrc) {
           const targetsrc =
-            dataSourceOptions && dataSourceOptions.find(d => d.value === tr.targetsrc);
+            dataSourceOptions && dataSourceOptions.find((d) => d.value === tr.targetsrc);
           foldNameSuffix = `: ${targetsrc && targetsrc.label ? targetsrc.label : tr.targetsrc}`;
         }
         return foldNameSuffix;
@@ -47,8 +47,9 @@ class TransformAccordion extends Component {
         <TransformFold
           key={i}
           transformIndex={i}
-          name={`${transformTypes.filter(({type}) => type === tr.type)[0].label}${transformBy &&
-            transformBy[i]}`}
+          name={`${transformTypes.filter(({type}) => type === tr.type)[0].label}${
+            transformBy && transformBy[i]
+          }`}
           canDelete={true}
         >
           {children}
@@ -58,8 +59,8 @@ class TransformAccordion extends Component {
     // cannot have 2 Split transforms on one trace:
     // https://github.com/plotly/plotly.js/issues/1742
     const addActionOptions =
-      container.transforms && container.transforms.some(t => t.type === 'groupby')
-        ? transformTypes.filter(t => t.type !== 'groupby')
+      container.transforms && container.transforms.some((t) => t.type === 'groupby')
+        ? transformTypes.filter((t) => t.type !== 'groupby')
         : transformTypes;
 
     const addAction = {
@@ -67,7 +68,7 @@ class TransformAccordion extends Component {
       handler: addActionOptions.map(({label, type}) => {
         return {
           label,
-          handler: context => {
+          handler: (context) => {
             const {fullContainer, updateContainer} = context;
             if (updateContainer) {
               const transformIndex = Array.isArray(fullContainer.transforms)
diff --git a/src/components/containers/UpdateMenuAccordion.js b/src/components/containers/UpdateMenuAccordion.js
index 735c1e9fb..385ed4ea9 100644
--- a/src/components/containers/UpdateMenuAccordion.js
+++ b/src/components/containers/UpdateMenuAccordion.js
@@ -22,7 +22,7 @@ class UpdateMenuAccordion extends Component {
           buttons: _('Buttons'),
         };
         const menuType = localizedType[upd.type] || localizedType.dropdown;
-        const activeBtn = upd.buttons.filter(b => b._index === upd.active)[0];
+        const activeBtn = upd.buttons.filter((b) => b._index === upd.active)[0];
         const foldName = menuType + (activeBtn ? ': ' + activeBtn.label : '');
 
         return (
diff --git a/src/components/containers/__tests__/AnnotationAccordion-test.js b/src/components/containers/__tests__/AnnotationAccordion-test.js
index 52ae052fd..55a96bbdf 100644
--- a/src/components/containers/__tests__/AnnotationAccordion-test.js
+++ b/src/components/containers/__tests__/AnnotationAccordion-test.js
@@ -60,10 +60,7 @@ describe('<AnnotationAccordion>', () => {
         </LayoutPanel>
       </TestEditor>
     );
-    editor
-      .find('.js-fold__delete')
-      .at(0)
-      .simulate('click');
+    editor.find('.js-fold__delete').at(0).simulate('click');
 
     const update = beforeDeleteAnnotation.mock.calls[0][0];
     expect(update.annotationIndex).toBe(0);
diff --git a/src/components/containers/__tests__/Layout-test.js b/src/components/containers/__tests__/Layout-test.js
index dbb12a17e..4838cfb87 100644
--- a/src/components/containers/__tests__/Layout-test.js
+++ b/src/components/containers/__tests__/Layout-test.js
@@ -7,9 +7,9 @@ import {connectLayoutToPlot} from 'lib';
 import {mount} from 'enzyme';
 
 const Layouts = [PlotlyPanel, PlotlyFold, PlotlySection].map(connectLayoutToPlot);
-const Editor = props => <TestEditor {...{onUpdate: jest.fn(), ...props}} />;
+const Editor = (props) => <TestEditor {...{onUpdate: jest.fn(), ...props}} />;
 
-Layouts.forEach(Layout => {
+Layouts.forEach((Layout) => {
   describe(`<${Layout.displayName}>`, () => {
     it(`wraps container with fullValue pointing to gd._fullLayout`, () => {
       const wrapper = mount(
diff --git a/src/components/containers/__tests__/TraceAccordion-test.js b/src/components/containers/__tests__/TraceAccordion-test.js
index eb4d185c7..1cc360ad6 100644
--- a/src/components/containers/__tests__/TraceAccordion-test.js
+++ b/src/components/containers/__tests__/TraceAccordion-test.js
@@ -51,10 +51,7 @@ describe('<TraceAccordion>', () => {
       </TestEditor>
     );
 
-    editor
-      .find('.js-fold__delete')
-      .at(0)
-      .simulate('click');
+    editor.find('.js-fold__delete').at(0).simulate('click');
 
     expect(beforeDeleteTrace).toBeCalled();
     const update = beforeDeleteTrace.mock.calls[0][0];
diff --git a/src/components/containers/__tests__/UnconnectedContainersVisibility-test.js b/src/components/containers/__tests__/UnconnectedContainersVisibility-test.js
index fc172067d..f60b87fbf 100644
--- a/src/components/containers/__tests__/UnconnectedContainersVisibility-test.js
+++ b/src/components/containers/__tests__/UnconnectedContainersVisibility-test.js
@@ -54,18 +54,8 @@ describe('Basic Panel rules', () => {
 
     it('PANEL shows collapse functionality, FOLD is foldable', () => {
       expect(wrapper.find('.panel__header__collapse').length).toEqual(1);
-      expect(
-        wrapper
-          .find(Fold)
-          .first()
-          .props().folded
-      ).toBe(false);
-      expect(
-        typeof wrapper
-          .find(Fold)
-          .first()
-          .props().toggleFold
-      ).toBe('function');
+      expect(wrapper.find(Fold).first().props().folded).toBe(false);
+      expect(typeof wrapper.find(Fold).first().props().toggleFold).toBe('function');
     });
   });
 });
diff --git a/src/components/containers/derived.js b/src/components/containers/derived.js
index 2a2608f28..f59fb0e46 100644
--- a/src/components/containers/derived.js
+++ b/src/components/containers/derived.js
@@ -16,7 +16,7 @@ const TraceTypeSection = (props, context) => {
     mode === 'trace' && fullContainer && traceTypes.includes(fullContainer.type);
 
   const ifConnectedToLayout =
-    mode === 'layout' && fullData && fullData.some(t => traceTypes.includes(t.type));
+    mode === 'layout' && fullData && fullData.some((t) => traceTypes.includes(t.type));
 
   if (ifConnectedToTrace || ifConnectedToLayout) {
     return <PlotlySection {...props} />;
diff --git a/src/components/fields/ArrowSelector.js b/src/components/fields/ArrowSelector.js
index b599a5dd6..d22ec513c 100644
--- a/src/components/fields/ArrowSelector.js
+++ b/src/components/fields/ArrowSelector.js
@@ -29,7 +29,7 @@ const ARROW_OPTIONS = ARROW_PATHS.map(({path}, index) => {
   };
 });
 
-const ArrowSelector = props => {
+const ArrowSelector = (props) => {
   return <Dropdown {...props} options={ARROW_OPTIONS} />;
 };
 
diff --git a/src/components/fields/AxesCreator.js b/src/components/fields/AxesCreator.js
index d73d883ae..603c9588b 100644
--- a/src/components/fields/AxesCreator.js
+++ b/src/components/fields/AxesCreator.js
@@ -19,7 +19,7 @@ class UnconnectedAxisCreator extends Component {
     const currentAxisId = this.props.fullContainer[this.props.attr];
     const currentTraceIndex = this.props.fullContainer.index;
     return this.context.fullData.some(
-      d => d.index !== currentTraceIndex && d[this.props.attr] === currentAxisId
+      (d) => d.index !== currentTraceIndex && d[this.props.attr] === currentAxisId
     );
   }
 
@@ -63,7 +63,7 @@ class UnconnectedAxisCreator extends Component {
     if (
       currentAxisId !== update &&
       !this.context.fullData.some(
-        trace =>
+        (trace) =>
           trace[this.props.attr] === currentAxisId && trace.index !== this.props.fullContainer.index
       )
     ) {
@@ -94,7 +94,7 @@ class UnconnectedAxisCreator extends Component {
         attr={this.props.attr}
         clearable={false}
         options={this.props.options}
-        updatePlot={u => this.updateAxis(u)}
+        updatePlot={(u) => this.updateAxis(u)}
         extraComponent={extraComponent}
       />
     );
@@ -123,7 +123,7 @@ class UnconnectedAxesCreator extends Component {
   render() {
     const axisType = traceTypeToAxisType(this.props.container.type);
     const isFirstTraceOfAxisType =
-      this.context.data.filter(d => traceTypeToAxisType(d.type) === axisType).length === 1;
+      this.context.data.filter((d) => traceTypeToAxisType(d.type) === axisType).length === 1;
 
     if (isFirstTraceOfAxisType) {
       return null;
@@ -133,7 +133,7 @@ class UnconnectedAxesCreator extends Component {
     const controls = [];
 
     function getOptions(axisType) {
-      return fullLayout._subplots[axisType].map(axisId => ({
+      return fullLayout._subplots[axisType].map((axisId) => ({
         label: getParsedTemplateString(getAxisTitle(fullLayout[axisIdToAxisName(axisId)]), {
           meta: fullLayout.meta,
         }),
diff --git a/src/components/fields/AxesSelector.js b/src/components/fields/AxesSelector.js
index b7a4f6c0b..cf0d68b5b 100644
--- a/src/components/fields/AxesSelector.js
+++ b/src/components/fields/AxesSelector.js
@@ -24,10 +24,10 @@ class AxesSelector extends Component {
     const multipleSublots =
       fullLayout &&
       fullLayout._subplots &&
-      Object.values(fullLayout._subplots).some(s => s.length > 1);
+      Object.values(fullLayout._subplots).some((s) => s.length > 1);
 
     const options = multipleSublots
-      ? axesOptions.map(option =>
+      ? axesOptions.map((option) =>
           option.value === 'allaxes'
             ? option
             : {
@@ -40,7 +40,7 @@ class AxesSelector extends Component {
       : axesOptions;
 
     const totalCharsInOptions =
-      (options && options.map(o => o.label).reduce((acc, o) => acc + o.length, 0)) || 0;
+      (options && options.map((o) => o.label).reduce((acc, o) => acc + o.length, 0)) || 0;
 
     return maxOptions || totalCharsInOptions >= maxCharsThatFitInRadio ? (
       <Field {...this.props} label={_('Axis to Style')}>
diff --git a/src/components/fields/AxisInterval.js b/src/components/fields/AxisInterval.js
index 07040952a..0aaf2588c 100644
--- a/src/components/fields/AxisInterval.js
+++ b/src/components/fields/AxisInterval.js
@@ -26,7 +26,7 @@ function getSmallestUnit(milliseconds) {
 
   let smallestUnit = 'milliseconds';
 
-  ['seconds', 'minutes', 'days'].forEach(unit => {
+  ['seconds', 'minutes', 'days'].forEach((unit) => {
     if (
       milliseconds % units[unit] === 0 &&
       (smallestUnit === 'milliseconds' ||
@@ -167,13 +167,13 @@ export class UnconnectedAxisInterval extends Component {
             {value: 'milliseconds', label: _('Milliseconds')},
           ]}
           clearable={false}
-          onChange={value => this.onUnitChange(value)}
+          onChange={(value) => this.onUnitChange(value)}
           value={this.state.units}
         />
         <div style={{width: '100%', display: 'block'}}> </div>
         <NumericInput
           value={this.getDisplayValue(this.props.fullValue)}
-          onUpdate={value => this.update(value)}
+          onUpdate={(value) => this.update(value)}
           editableClassName="AxisInterval-milliseconds"
         />
       </Field>
@@ -181,7 +181,7 @@ export class UnconnectedAxisInterval extends Component {
       <Field {...this.props}>
         <NumericInput
           value={this.props.fullValue}
-          onUpdate={value => this.props.updatePlot(value)}
+          onUpdate={(value) => this.props.updatePlot(value)}
         />
       </Field>
     );
diff --git a/src/components/fields/ColorscalePicker.js b/src/components/fields/ColorscalePicker.js
index be05e2bca..a8421fb93 100644
--- a/src/components/fields/ColorscalePicker.js
+++ b/src/components/fields/ColorscalePicker.js
@@ -35,7 +35,7 @@ export class UnconnectedColorscalePicker extends Component {
 
   render() {
     const {fullValue} = this.props;
-    const colorscale = Array.isArray(fullValue) ? fullValue.map(v => v[1]) : null;
+    const colorscale = Array.isArray(fullValue) ? fullValue.map((v) => v[1]) : null;
 
     return (
       <Field {...this.props} fieldContainerClassName="field__colorscale">
diff --git a/src/components/fields/DataSelector.js b/src/components/fields/DataSelector.js
index d0c36aa46..fb5886de3 100644
--- a/src/components/fields/DataSelector.js
+++ b/src/components/fields/DataSelector.js
@@ -84,8 +84,8 @@ export class UnconnectedDataSelector extends Component {
 
     if (Array.isArray(adjustedValue)) {
       data = adjustedValue
-        .filter(v => Array.isArray(this.dataSources[v]))
-        .map(v => this.dataSources[v]);
+        .filter((v) => Array.isArray(this.dataSources[v]))
+        .map((v) => this.dataSources[v]);
     } else {
       data = this.dataSources[adjustedValue] || null;
     }
diff --git a/src/components/fields/DropdownCustom.js b/src/components/fields/DropdownCustom.js
index 4b1280307..73ec5f407 100644
--- a/src/components/fields/DropdownCustom.js
+++ b/src/components/fields/DropdownCustom.js
@@ -18,7 +18,7 @@ export class UnconnectedDropdownCustom extends Component {
     this.state = {
       custom:
         this.value === props.customOpt ||
-        !this.props.options.map(o => o.value).includes(this.value),
+        !this.props.options.map((o) => o.value).includes(this.value),
     };
   }
 
@@ -47,7 +47,7 @@ export class UnconnectedDropdownCustom extends Component {
   render() {
     const {options, attr, customOpt} = this.props;
     const value =
-      (this.value === '' || !options.map(o => o.value).includes(this.value)) && this.state.custom
+      (this.value === '' || !options.map((o) => o.value).includes(this.value)) && this.state.custom
         ? customOpt
         : this.value;
 
@@ -66,8 +66,8 @@ export class UnconnectedDropdownCustom extends Component {
         {this.state.custom && (
           <Text
             attr={attr}
-            updatePlot={value => this.setValue(value, true)}
-            onChange={value => {
+            updatePlot={(value) => this.setValue(value, true)}
+            onChange={(value) => {
               if (value) {
                 this.setValue(value, true);
               }
diff --git a/src/components/fields/FilterOperation.js b/src/components/fields/FilterOperation.js
index 771ffb9dc..4ec6e8bad 100644
--- a/src/components/fields/FilterOperation.js
+++ b/src/components/fields/FilterOperation.js
@@ -5,7 +5,7 @@ import DropdownWidget from '../widgets/Dropdown';
 import TextInput from '../widgets/TextInput';
 import {connectToContainer} from 'lib';
 
-const operations = _ => ({
+const operations = (_) => ({
   inequality: [
     {value: '!=', label: _('Target ≠ Reference')},
     {value: '<', label: _('Target < Reference')},
@@ -34,7 +34,7 @@ const findOperation = (operator, _) => {
   let op = 'inequality';
   const ops = operations(_);
   for (const key in ops) {
-    if (ops.hasOwnProperty(key) && ops[key].map(o => o.value).indexOf(operator) !== -1) {
+    if (ops.hasOwnProperty(key) && ops[key].map((o) => o.value).indexOf(operator) !== -1) {
       op = key;
       break;
     }
@@ -142,7 +142,7 @@ class UnconnectedFilterValue extends Component {
     val = op === 'inrange' || op === 'exrange' ? [v, this.state.valueMax] : v;
     if (op === 'inset' || op === 'exset') {
       val = val.split(',');
-      val = val.map(v => v.trim());
+      val = val.map((v) => v.trim());
     }
     this.props.updatePlot(val);
   }
diff --git a/src/components/fields/GroupCreator.js b/src/components/fields/GroupCreator.js
index c46ff0dd4..21a1b1dd7 100644
--- a/src/components/fields/GroupCreator.js
+++ b/src/components/fields/GroupCreator.js
@@ -9,7 +9,7 @@ import {MULTI_VALUED} from 'lib/constants';
 
 class UnconnectedGroupCreator extends Component {
   getAllGroups() {
-    return [...new Set(this.context.data.map(t => t[this.props.attr]))].filter(g => Boolean(g));
+    return [...new Set(this.context.data.map((t) => t[this.props.attr]))].filter((g) => Boolean(g));
   }
 
   canAddGroup() {
@@ -23,14 +23,14 @@ class UnconnectedGroupCreator extends Component {
 
     return (
       !currentGroup ||
-      this.context.fullData.some(d => d.index !== currentTraceIndex && d[attr] === currentGroup)
+      this.context.fullData.some((d) => d.index !== currentTraceIndex && d[attr] === currentGroup)
     );
   }
 
   addAndUpdateGroup() {
     const allGroups = this.context.fullData
-      .map(t => parseInt(t[this.props.attr], 10))
-      .filter(n => Number.isInteger(n));
+      .map((t) => parseInt(t[this.props.attr], 10))
+      .filter((n) => Number.isInteger(n));
     // don't want to pass empty array to max
     allGroups.push(0);
 
@@ -45,7 +45,7 @@ class UnconnectedGroupCreator extends Component {
 
     const options = [{label: _('None'), value: ''}];
     const allGroups = this.getAllGroups();
-    allGroups.forEach(g => options.push({label: `${prefix} ${g}`, value: g}));
+    allGroups.forEach((g) => options.push({label: `${prefix} ${g}`, value: g}));
     options.sort((a, b) => a.value - b.value);
 
     const icon = <PlusIcon />;
diff --git a/src/components/fields/LineSelectors.js b/src/components/fields/LineSelectors.js
index 1a684a7e7..b37426bbd 100644
--- a/src/components/fields/LineSelectors.js
+++ b/src/components/fields/LineSelectors.js
@@ -43,14 +43,14 @@ const computeOptions = (strokeData, stroke) =>
     value,
   }));
 
-export const LineShapeSelector = props => (
+export const LineShapeSelector = (props) => (
   <LineSelector {...props} computeOptions={computeOptions.bind(null, strokeShapes)} />
 );
 
-export const LineDashSelector = props => (
+export const LineDashSelector = (props) => (
   <LineSelector
     {...props}
-    computeOptions={lineColor =>
+    computeOptions={(lineColor) =>
       computeOptions(strokeDashes, lineColor).concat([
         {
           label: '',
diff --git a/src/components/fields/MarkerColor.js b/src/components/fields/MarkerColor.js
index 838bc859c..e2ea97213 100644
--- a/src/components/fields/MarkerColor.js
+++ b/src/components/fields/MarkerColor.js
@@ -147,7 +147,7 @@ class UnconnectedMarkerColor extends Component {
     // TO DO: https://github.com/plotly/react-chart-editor/issues/654
     const noSplitsPresent =
       container &&
-      (!container.transforms || !container.transforms.filter(t => t.type === 'groupby').length);
+      (!container.transforms || !container.transforms.filter((t) => t.type === 'groupby').length);
 
     if (noSplitsPresent) {
       const {type} = this.state;
diff --git a/src/components/fields/MultiColorPicker.js b/src/components/fields/MultiColorPicker.js
index 9cb16e373..7904a465d 100644
--- a/src/components/fields/MultiColorPicker.js
+++ b/src/components/fields/MultiColorPicker.js
@@ -13,16 +13,16 @@ const CustomColorscalePicker = connectToContainer(UnconnectedColorscalePicker, {
     if (
       props.attr === 'marker.color' &&
       context.fullData
-        .filter(t => context.traceIndexes.includes(t.index))
-        .every(t => t.marker && t.marker.color) &&
+        .filter((t) => context.traceIndexes.includes(t.index))
+        .every((t) => t.marker && t.marker.color) &&
       plotProps.fullValue &&
       typeof plotProps.fullValue === 'string'
     ) {
       plotProps.fullValue =
         context.fullData &&
         context.fullData
-          .filter(t => context.traceIndexes.includes(t.index))
-          .map(t => [0, t.marker.color]);
+          .filter((t) => context.traceIndexes.includes(t.index))
+          .map((t) => [0, t.marker.color]);
     }
   },
 });
@@ -34,7 +34,7 @@ class UnconnectedMultiColorPicker extends Component {
       selectedConstantColorOption:
         context.traceIndexes.length > 1 &&
         props.fullValue &&
-        props.fullValue.every(v => v[1] === props.fullValue[0][1])
+        props.fullValue.every((v) => v[1] === props.fullValue[0][1])
           ? 'single'
           : 'multiple',
     };
@@ -52,7 +52,7 @@ class UnconnectedMultiColorPicker extends Component {
 
   setColors(colorscale, colorscaleType) {
     const numberOfTraces = this.props.tracesToColor.length;
-    const colors = colorscale.map(c => c[1]);
+    const colors = colorscale.map((c) => c[1]);
 
     let adjustedColors = colors;
 
@@ -60,11 +60,11 @@ class UnconnectedMultiColorPicker extends Component {
       adjustedColors = adjustColorscale(colors, numberOfTraces, colorscaleType);
     }
 
-    if (adjustedColors.every(c => c === adjustedColors[0]) || colorscaleType === 'categorical') {
+    if (adjustedColors.every((c) => c === adjustedColors[0]) || colorscaleType === 'categorical') {
       adjustedColors = adjustColorscale(colors, numberOfTraces, colorscaleType, {repeat: true});
     }
 
-    const updates = adjustedColors.map(color => ({
+    const updates = adjustedColors.map((color) => ({
       [this.props.attr]: color,
     }));
 
@@ -98,7 +98,7 @@ class UnconnectedMultiColorPicker extends Component {
             onOptionChange={
               this.props.onConstantColorOptionChange
                 ? this.props.onConstantColorOptionChange
-                : value => this.setState({selectedConstantColorOption: value})
+                : (value) => this.setState({selectedConstantColorOption: value})
             }
           />
           <Info>{selectedConstantColorOption === 'single' ? singleMessage : multiMessage}</Info>
@@ -152,17 +152,17 @@ export default connectToContainer(UnconnectedMultiColorPicker, {
       let tracesToColor = [];
       const dedupedTraceIndexes = [];
 
-      context.traceIndexes.forEach(i => {
+      context.traceIndexes.forEach((i) => {
         if (!dedupedTraceIndexes.includes(i)) {
           dedupedTraceIndexes.push(i);
         }
       });
 
-      dedupedTraceIndexes.forEach(traceIndex => {
-        const traces = context.fullData.filter(trace => trace.index === traceIndex);
+      dedupedTraceIndexes.forEach((traceIndex) => {
+        const traces = context.fullData.filter((trace) => trace.index === traceIndex);
         tracesToColor = tracesToColor.concat(traces);
 
-        traces.forEach(t => {
+        traces.forEach((t) => {
           const value = nestedProperty(t, props.attr).get();
           if (value) {
             colors.push(value);
@@ -171,7 +171,7 @@ export default connectToContainer(UnconnectedMultiColorPicker, {
       });
 
       plotProps.tracesToColor = tracesToColor;
-      plotProps.fullValue = colors.map(c => [0, c]);
+      plotProps.fullValue = colors.map((c) => [0, c]);
     }
   },
 });
diff --git a/src/components/fields/PieColorscalePicker.js b/src/components/fields/PieColorscalePicker.js
index 8f68a1219..ff4c1626c 100644
--- a/src/components/fields/PieColorscalePicker.js
+++ b/src/components/fields/PieColorscalePicker.js
@@ -59,7 +59,7 @@ export default connectToContainer(UnconnectedPieColorscalePicker, {
         (Array.isArray(plotProps.fullValue) && !plotProps.fullValue.length)) &&
       context.graphDiv.calcdata
     ) {
-      plotProps.fullValue = context.graphDiv.calcdata[0].map(d => d.color);
+      plotProps.fullValue = context.graphDiv.calcdata[0].map((d) => d.color);
     }
 
     if (context.traceIndexes.length > 1) {
diff --git a/src/components/fields/RectanglePositioner.js b/src/components/fields/RectanglePositioner.js
index 81abae7f6..b7cea240e 100644
--- a/src/components/fields/RectanglePositioner.js
+++ b/src/components/fields/RectanglePositioner.js
@@ -28,7 +28,7 @@ class UnconnectedRectanglePositioner extends Component {
     const y0 = (fieldHeightPx - (height + y)) / fieldHeightPx;
     const y1 = (fieldHeightPx - y) / fieldHeightPx;
 
-    const snap = this.state.snap ? v => Math.round(v * gridRes) / gridRes : v => v;
+    const snap = this.state.snap ? (v) => Math.round(v * gridRes) / gridRes : (v) => v;
 
     const payload = {};
 
@@ -82,7 +82,7 @@ class UnconnectedRectanglePositioner extends Component {
           <Field label={_('Snap to Grid')}>
             <RadioBlocks
               alignment="center"
-              onOptionChange={snap => this.setState({snap: snap})}
+              onOptionChange={(snap) => this.setState({snap: snap})}
               activeOption={this.state.snap}
               options={[
                 {label: _('On'), value: true},
@@ -120,7 +120,7 @@ class UnconnectedRectanglePositioner extends Component {
               rotatable={false}
               draggable={!this.state.snap}
               zoomable={zoomable}
-              onResize={style => {
+              onResize={(style) => {
                 this.sendUpdate({
                   fieldWidthPx,
                   fieldHeightPx,
diff --git a/src/components/fields/SubplotCreator.js b/src/components/fields/SubplotCreator.js
index 953d6625d..1d4ef80fd 100644
--- a/src/components/fields/SubplotCreator.js
+++ b/src/components/fields/SubplotCreator.js
@@ -13,7 +13,7 @@ class UnconnectedSingleSubplotCreator extends Component {
     const currentAxisId = this.props.fullContainer[this.props.attr];
     const currentTraceIndex = this.props.fullContainer.index;
     return this.context.fullData.some(
-      d => d.index !== currentTraceIndex && d[this.props.attr] === currentAxisId
+      (d) => d.index !== currentTraceIndex && d[this.props.attr] === currentAxisId
     );
   }
 
@@ -42,7 +42,7 @@ class UnconnectedSingleSubplotCreator extends Component {
     if (
       currentSubplotId !== update &&
       !this.context.fullData.some(
-        trace =>
+        (trace) =>
           trace[SUBPLOT_TO_ATTR[this.props.layoutAttr].data] === currentSubplotId &&
           trace.index !== this.props.fullContainer.index
       )
@@ -74,7 +74,7 @@ class UnconnectedSingleSubplotCreator extends Component {
         attr={this.props.attr}
         clearable={false}
         options={this.props.options}
-        updatePlot={u => this.updateSubplot(u)}
+        updatePlot={(u) => this.updateSubplot(u)}
         extraComponent={extraComponent}
       />
     );
@@ -103,12 +103,12 @@ const SingleSubplotCreator = connectToContainer(UnconnectedSingleSubplotCreator)
 class UnconnectedSubplotCreator extends Component {
   render() {
     const subplotType = traceTypeToAxisType(this.props.container.type);
-    if (!['geo', 'mapbox', 'polar', 'gl3d', 'ternary'].some(t => t === subplotType)) {
+    if (!['geo', 'mapbox', 'polar', 'gl3d', 'ternary'].some((t) => t === subplotType)) {
       return null;
     }
 
     const isFirstTraceOfAxisType =
-      this.context.data.filter(d => traceTypeToAxisType(d.type) === subplotType).length === 1;
+      this.context.data.filter((d) => traceTypeToAxisType(d.type) === subplotType).length === 1;
     if (isFirstTraceOfAxisType) {
       return null;
     }
@@ -116,7 +116,7 @@ class UnconnectedSubplotCreator extends Component {
     const {fullLayout, localize: _} = this.context;
 
     function getOptions(subplotType) {
-      return fullLayout._subplots[subplotType].map(subplotId => ({
+      return fullLayout._subplots[subplotType].map((subplotId) => ({
         label: getSubplotTitle(subplotId, subplotType, _),
         value: subplotId,
       }));
@@ -162,7 +162,7 @@ export default connectToContainer(UnconnectedSubplotCreator, {
       data.length > 1 &&
       data[fullContainer.index] &&
       ['geo', 'mapbox', 'polar', 'gl3d', 'ternary'].some(
-        t => t === traceTypeToAxisType(data[fullContainer.index].type)
+        (t) => t === traceTypeToAxisType(data[fullContainer.index].type)
       );
   },
 });
diff --git a/src/components/fields/SymbolSelector.js b/src/components/fields/SymbolSelector.js
index 456d4601e..26cf366d8 100644
--- a/src/components/fields/SymbolSelector.js
+++ b/src/components/fields/SymbolSelector.js
@@ -379,7 +379,7 @@ class SymbolSelector extends Component {
 
     this.symbolOptions =
       this.props.container.type === 'scatter3d'
-        ? SYMBOLS.filter(option => option.threeD)
+        ? SYMBOLS.filter((option) => option.threeD)
         : [...SYMBOLS];
   }
 
diff --git a/src/components/fields/TextEditor.js b/src/components/fields/TextEditor.js
index 676e6e7f3..80c17d380 100644
--- a/src/components/fields/TextEditor.js
+++ b/src/components/fields/TextEditor.js
@@ -27,7 +27,7 @@ export class UnconnectedTextEditor extends Component {
     let adjustedValue = value;
 
     if (templateStrings) {
-      adjustedValue = adjustedValue.replace(TEMPLATE_STRING_REGEX, match => {
+      adjustedValue = adjustedValue.replace(TEMPLATE_STRING_REGEX, (match) => {
         const index = INDEX_IN_TEMPLATE_STRING_REGEX.exec(match);
         if (index) {
           const adjustedIndex = parseInt(index[3], 10) - 1;
@@ -45,7 +45,7 @@ export class UnconnectedTextEditor extends Component {
   getAdjustedFullValue(fullValue) {
     const templateStrings = this.hasTemplateStrings(fullValue);
     if (templateStrings) {
-      return fullValue.replace(TEMPLATE_STRING_REGEX, match => {
+      return fullValue.replace(TEMPLATE_STRING_REGEX, (match) => {
         const index = INDEX_IN_TEMPLATE_STRING_REGEX.exec(match);
         if (index) {
           const adjustedIndex = parseInt(index[3], 10) + 1;
diff --git a/src/components/fields/TextPosition.js b/src/components/fields/TextPosition.js
index f9a90b301..1e2cdaf39 100644
--- a/src/components/fields/TextPosition.js
+++ b/src/components/fields/TextPosition.js
@@ -52,7 +52,7 @@ export class UnconnectedTextPosition extends Component {
         <RadioBlocks
           options={radioOptions}
           activeOption={this.state.posType}
-          onOptionChange={value => {
+          onOptionChange={(value) => {
             this.setState({posType: value});
             if (value === 'simple') {
               this.props.updatePlot('middle center');
diff --git a/src/components/fields/UpdateMenuButtons.js b/src/components/fields/UpdateMenuButtons.js
index 3edf503b5..52d389e69 100644
--- a/src/components/fields/UpdateMenuButtons.js
+++ b/src/components/fields/UpdateMenuButtons.js
@@ -22,7 +22,7 @@ class UpdateMenuButtons extends Component {
         attr="buttons"
         label={_('Button')}
         options={options}
-        updatePlot={index => this.setState({currentButtonIndex: index})}
+        updatePlot={(index) => this.setState({currentButtonIndex: index})}
         clearable={false}
         fullValue={this.state.currentButtonIndex}
       />
diff --git a/src/components/fields/derived.js b/src/components/fields/derived.js
index 188b0536f..013319dc0 100644
--- a/src/components/fields/derived.js
+++ b/src/components/fields/derived.js
@@ -21,14 +21,14 @@ export const AxisAnchorDropdown = connectToContainer(UnconnectedDropdown, {
     let options = [];
 
     if (props.attr.startsWith('xaxis')) {
-      options = context.fullLayout._subplots.yaxis.map(axis => {
+      options = context.fullLayout._subplots.yaxis.map((axis) => {
         return {
           label: getAxisTitle(context.fullLayout[axisIdToAxisName(axis)]),
           value: axis,
         };
       });
     } else if (props.attr.startsWith('yaxis')) {
-      options = context.fullLayout._subplots.xaxis.map(axis => {
+      options = context.fullLayout._subplots.xaxis.map((axis) => {
         return {
           label: getAxisTitle(context.fullLayout[axisIdToAxisName(axis)]),
           value: axis,
@@ -46,14 +46,14 @@ export const AxisOverlayDropdown = connectToContainer(UnconnectedDropdown, {
     let options = [];
 
     if (props.attr.startsWith('xaxis')) {
-      options = context.fullLayout._subplots.xaxis.map(axis => {
+      options = context.fullLayout._subplots.xaxis.map((axis) => {
         return {
           label: getAxisTitle(context.fullLayout[axisIdToAxisName(axis)]),
           value: axis,
         };
       });
     } else if (props.attr.startsWith('yaxis')) {
-      options = context.fullLayout._subplots.yaxis.map(axis => {
+      options = context.fullLayout._subplots.yaxis.map((axis) => {
         return {
           label: getAxisTitle(context.fullLayout[axisIdToAxisName(axis)]),
           value: axis,
@@ -65,7 +65,7 @@ export const AxisOverlayDropdown = connectToContainer(UnconnectedDropdown, {
 
     // filter out the current axisID, can't overlay over itself
     plotProps.options = options.filter(
-      option =>
+      (option) =>
         context.fullContainer &&
         context.fullContainer.xaxis &&
         context.fullContainer.yaxis &&
@@ -276,7 +276,7 @@ const numericFractionModifyPlotProps = (props, context, plotProps) => {
     plotProps.fullValue = Math.round((100 * (fullValue - min)) / (max - min));
   }
 
-  plotProps.updatePlot = v => {
+  plotProps.updatePlot = (v) => {
     if (isNumeric(v)) {
       updatePlot((v / 100) * (max - min) + min);
     } else {
@@ -307,7 +307,7 @@ export const NumericFractionInverse = connectToContainer(UnconnectedNumericFract
       plotProps.fullValue = Math.round((1 - fullValue) * 100);
     }
 
-    plotProps.updatePlot = v => {
+    plotProps.updatePlot = (v) => {
       if (isNumeric(v)) {
         updatePlot(1 - v / 100);
       } else {
@@ -336,7 +336,7 @@ export const NumericReciprocal = connectToContainer(UnconnectedNumeric, {
       plotProps.fullValue = 1 / fullValue;
     }
 
-    plotProps.updatePlot = v => {
+    plotProps.updatePlot = (v) => {
       if (isNumeric(v)) {
         updatePlot(1 / v);
       } else {
@@ -374,7 +374,7 @@ export const AnnotationArrowRef = connectToContainer(UnconnectedDropdown, {
     if (currentAxisRef === 'paper') {
       // If currentAxesRef is paper provide all axes options to user.
 
-      const axes = getAllAxes(context.fullLayout).filter(a => a._id);
+      const axes = getAllAxes(context.fullLayout).filter((a) => a._id);
       if (axes.length > 0) {
         plotProps.options = [
           {label: _('in pixels'), value: 'pixel'},
@@ -419,7 +419,7 @@ export const AnnotationRef = connectToContainer(UnconnectedDropdown, {
       );
     }
 
-    const axes = getAllAxes(context.fullLayout).filter(a => a._id);
+    const axes = getAllAxes(context.fullLayout).filter((a) => a._id);
     if (axes.length > 0) {
       plotProps.options = [
         {label: _('Canvas'), value: 'paper'},
@@ -430,7 +430,7 @@ export const AnnotationRef = connectToContainer(UnconnectedDropdown, {
     }
 
     if (currentOffsetRef !== 'pixel') {
-      plotProps.updatePlot = v => {
+      plotProps.updatePlot = (v) => {
         if (!plotProps.updateContainer) {
           return;
         }
@@ -455,7 +455,7 @@ export const AnnotationRef = connectToContainer(UnconnectedDropdown, {
 
 export const PositioningRef = connectToContainer(UnconnectedDropdown, {
   modifyPlotProps: (props, context, plotProps) => {
-    const axes = getAllAxes(context.fullLayout).filter(a => a._id);
+    const axes = getAllAxes(context.fullLayout).filter((a) => a._id);
     if (axes.length > 0) {
       plotProps.options = [
         {label: 'Canvas', value: 'paper'},
@@ -486,7 +486,7 @@ export const PositioningNumeric = connectToContainer(UnconnectedNumericOrDate, {
         plotProps.fullValue = Math.round(100 * fullValue);
       }
 
-      plotProps.updatePlot = v => {
+      plotProps.updatePlot = (v) => {
         if (isNumeric(v)) {
           updatePlot(v / 100);
         } else {
@@ -698,7 +698,7 @@ export const MapboxSourceArray = connectToContainer(Text, {
       plotProps.fullValue = fullValue[0];
     }
 
-    plotProps.updatePlot = v => {
+    plotProps.updatePlot = (v) => {
       if (v.length) {
         updatePlot([v]);
       } else {
@@ -807,7 +807,7 @@ export const LevelRendered = connectToContainer(UnconnectedDropdown, {
     if (context.container.ids && context.container.ids.length) {
       plotProps.isVisible = true;
       plotProps.options = [{label: _('Root'), value: ''}].concat(
-        context.container.ids.map(i => ({label: i, value: i}))
+        context.container.ids.map((i) => ({label: i, value: i}))
       );
     }
   },
diff --git a/src/components/widgets/ColorPicker.js b/src/components/widgets/ColorPicker.js
index 45efa1bb7..384020be4 100644
--- a/src/components/widgets/ColorPicker.js
+++ b/src/components/widgets/ColorPicker.js
@@ -7,9 +7,9 @@ import {CustomPicker as customPicker} from 'react-color';
 
 // Utility functions for converting ColorPicker color objects or raw strings
 // into TinyColor objects.
-const extractRGB = c => c.rgb || c;
-const getColorSource = c => (c.source === 'hex' ? c.hex : extractRGB(c));
-const toTinyColor = c => tinycolor(getColorSource(c));
+const extractRGB = (c) => c.rgb || c;
+const getColorSource = (c) => (c.source === 'hex' ? c.hex : extractRGB(c));
+const toTinyColor = (c) => tinycolor(getColorSource(c));
 
 class Custom extends Component {
   render() {
diff --git a/src/components/widgets/ColorscalePicker.js b/src/components/widgets/ColorscalePicker.js
index fa9e7ed84..2460a204a 100644
--- a/src/components/widgets/ColorscalePicker.js
+++ b/src/components/widgets/ColorscalePicker.js
@@ -34,8 +34,8 @@ class Scale extends Component {
     const {selectedColorscaleType, showColorscalePicker} = this.state;
     const description = COLOR_PICKER_CONSTANTS.COLORSCALE_DESCRIPTIONS[selectedColorscaleType];
     const colorscaleOptions = COLOR_PICKER_CONSTANTS.COLORSCALE_TYPES.filter(
-      type => type !== 'custom'
-    ).map(type => ({
+      (type) => type !== 'custom'
+    ).map((type) => ({
       label: type + ' scales',
       value: type,
     }));
diff --git a/src/components/widgets/DateTimePicker.js b/src/components/widgets/DateTimePicker.js
index 72ce7ccd0..062548f19 100644
--- a/src/components/widgets/DateTimePicker.js
+++ b/src/components/widgets/DateTimePicker.js
@@ -136,7 +136,7 @@ export default class DateTimePicker extends Component {
     }, []);
 
     const isNoon =
-      parsedTime[0] === '12' && parsedTime.slice(1).every(part => parseInt(part, 10) === 0);
+      parsedTime[0] === '12' && parsedTime.slice(1).every((part) => parseInt(part, 10) === 0);
 
     return !isValidDateTime || time === '' || JSDate.toDateString() === 'Invalid Date'
       ? ''
@@ -271,7 +271,7 @@ export default class DateTimePicker extends Component {
                   className="datepicker-container-rce"
                   modifiers={{highlighted: isValidJSDate ? JSDate : ''}}
                   month={isValidJSDate ? JSDate : new Date()}
-                  onDayClick={value => {
+                  onDayClick={(value) => {
                     const plotlyDate = this.toPlotlyJSDate(value).split(' ')[0];
                     this.onDateChange(plotlyDate);
                     this.onDateUpdate(plotlyDate);
diff --git a/src/components/widgets/Dropdown.js b/src/components/widgets/Dropdown.js
index f49a9d20b..61cb32ada 100644
--- a/src/components/widgets/Dropdown.js
+++ b/src/components/widgets/Dropdown.js
@@ -17,7 +17,7 @@ class Dropdown extends Component {
       return onChange(null);
     }
 
-    return multi ? onChange(selection.map(s => s[valueKey])) : onChange(selection[valueKey]);
+    return multi ? onChange(selection.map((s) => s[valueKey])) : onChange(selection[valueKey]);
   }
 
   render() {
@@ -43,7 +43,7 @@ class Dropdown extends Component {
       dropdownStyle.width = width;
     }
 
-    const opts = options.map(opt =>
+    const opts = options.map((opt) =>
       typeof opt === 'string' ? {label: opt, [valueKey]: opt} : opt
     );
 
@@ -57,7 +57,7 @@ class Dropdown extends Component {
         <Select
           placeholder={placeholder || _('Select an Option')}
           isClearable={clearable}
-          value={opts.filter(o =>
+          value={opts.filter((o) =>
             Array.isArray(value) ? value.includes(o[valueKey]) : value === o[valueKey]
           )}
           options={opts}
@@ -65,8 +65,8 @@ class Dropdown extends Component {
           onChange={this.onChange}
           isMulti={multi}
           noOptionsMessage={() => noResultsText || _('No Results')}
-          getOptionValue={o => o[valueKey]}
-          getOptionLabel={o => o.label}
+          getOptionValue={(o) => o[valueKey]}
+          getOptionLabel={(o) => o.label}
           isDisabled={disabled}
           className={dropdownContainerClass}
           classNamePrefix="Select"
diff --git a/src/components/widgets/Dropzone.js b/src/components/widgets/Dropzone.js
index c11bb6dab..b93c82c4a 100644
--- a/src/components/widgets/Dropzone.js
+++ b/src/components/widgets/Dropzone.js
@@ -116,7 +116,7 @@ class Dropzone extends Component {
         return;
       }
       this.setState({content: _('Loading...')});
-      reader.onload = e => this.onLoad(e);
+      reader.onload = (e) => this.onLoad(e);
       if (this.props.fileType === 'image') {
         reader.readAsDataURL(accepted[0]);
       } else if (this.props.fileType === 'geojson') {
diff --git a/src/components/widgets/FlaglistCheckboxGroup.js b/src/components/widgets/FlaglistCheckboxGroup.js
index 6c8a76767..8c2149dbb 100644
--- a/src/components/widgets/FlaglistCheckboxGroup.js
+++ b/src/components/widgets/FlaglistCheckboxGroup.js
@@ -27,7 +27,7 @@ class FlaglistCheckboxGroup extends Component {
   parseFlags(option) {
     let activeOption;
     if (option === 'all') {
-      activeOption = this.props.options.map(o => o.value).join('+');
+      activeOption = this.props.options.map((o) => o.value).join('+');
     } else if (option === 'none') {
       activeOption = '';
     } else {
@@ -47,7 +47,7 @@ class FlaglistCheckboxGroup extends Component {
   handleChange(newOptions) {
     let newActiveOptions = '';
 
-    newOptions.map(option => {
+    newOptions.map((option) => {
       if (option.checked === true) {
         newActiveOptions += option.value + '+';
       }
@@ -73,7 +73,7 @@ class FlaglistCheckboxGroup extends Component {
     const allOptions = this.props.options;
     const newOptions = [];
 
-    allOptions.map(option => {
+    allOptions.map((option) => {
       let currentChecked;
 
       if (activeOptions.indexOf(option.value) > -1) {
diff --git a/src/components/widgets/SymbolSelector.js b/src/components/widgets/SymbolSelector.js
index 6cc947582..c78666477 100644
--- a/src/components/widgets/SymbolSelector.js
+++ b/src/components/widgets/SymbolSelector.js
@@ -30,7 +30,7 @@ export default class SymbolSelector extends Component {
 
   renderActiveOption() {
     const {markerColor, borderColor, symbolOptions, value} = this.props;
-    const currentSymbol = symbolOptions.find(symbol => symbol.value === value);
+    const currentSymbol = symbolOptions.find((symbol) => symbol.value === value);
     if (!currentSymbol) {
       return (
         <span
@@ -64,7 +64,7 @@ export default class SymbolSelector extends Component {
 
   renderOptions() {
     const {markerColor, borderColor, symbolOptions} = this.props;
-    return symbolOptions.map(option => {
+    return symbolOptions.map((option) => {
       const {fill, value, label} = option;
 
       const symbolStyle = {
diff --git a/src/components/widgets/TextInput.js b/src/components/widgets/TextInput.js
index 82cecd301..012b4d5fd 100644
--- a/src/components/widgets/TextInput.js
+++ b/src/components/widgets/TextInput.js
@@ -22,7 +22,7 @@ export default class TextInput extends Component {
         placeholder={this.props.placeholder}
         text={this.state.value}
         type="text"
-        onChange={value => {
+        onChange={(value) => {
           if (this.props.onChange) {
             this.props.onChange(value);
           }
diff --git a/src/components/widgets/TraceTypeSelector.js b/src/components/widgets/TraceTypeSelector.js
index 2ff19a2cb..2e8bf6d79 100644
--- a/src/components/widgets/TraceTypeSelector.js
+++ b/src/components/widgets/TraceTypeSelector.js
@@ -107,7 +107,7 @@ class TraceTypeSelector extends Component {
         onClick:
           chartHelp[value] &&
           chartHelp[value].feedQuery &&
-          (e =>
+          ((e) =>
             onClick(e, () =>
               window.open(
                 `https://plot.ly/feed/?q=${chartHelp[value] ? chartHelp[value].feedQuery : value}`,
@@ -121,7 +121,7 @@ class TraceTypeSelector extends Component {
         onClick:
           chartHelp[value] &&
           chartHelp[value].helpDoc &&
-          (e => onClick(e, () => window.open(chartHelp[value].helpDoc, '_blank'))),
+          ((e) => onClick(e, () => window.open(chartHelp[value].helpDoc, '_blank'))),
         icon: <ThumnailViewIcon />,
       },
       {
@@ -129,7 +129,7 @@ class TraceTypeSelector extends Component {
         onClick:
           chartHelp[value] &&
           chartHelp[value].examplePlot &&
-          (e => onClick(e, chartHelp[value].examplePlot)),
+          ((e) => onClick(e, chartHelp[value].examplePlot)),
         icon: <GraphIcon />,
       },
     ];
@@ -145,7 +145,7 @@ class TraceTypeSelector extends Component {
     return categories(_).map((category, i) => {
       const items = traces(_)
         .filter(({category: {value}}) => value === category.value)
-        .filter(i => i.value !== 'scattergl' && i.value !== 'scatterpolargl');
+        .filter((i) => i.value !== 'scattergl' && i.value !== 'scatterpolargl');
 
       const MAX_ITEMS = 4;
 
@@ -159,7 +159,7 @@ class TraceTypeSelector extends Component {
         <div className={columnClasses} key={i}>
           <div className="trace-grid__column__header">{category.label}</div>
           <div className="trace-grid__column__items">
-            {items.map(item => (
+            {items.map((item) => (
               <Item
                 complex={complex}
                 key={item.value}
@@ -189,7 +189,7 @@ class TraceTypeSelector extends Component {
 
     return (
       <div className="trace-grid-single-block">
-        {traces(_).map(item => (
+        {traces(_).map((item) => (
           <Item
             key={item.value}
             complex={complex}
@@ -244,7 +244,7 @@ export class TraceTypeSelectorButton extends Component {
     const {localize: _} = this.context;
 
     const inferredType = plotlyTraceToCustomTrace(container);
-    const {label, icon, value} = traces(_).find(type => type.value === inferredType);
+    const {label, icon, value} = traces(_).find((type) => type.value === inferredType);
 
     const Icon = renderTraceIcon(icon ? icon : value);
 
diff --git a/src/components/widgets/text_editors/MultiFormat.js b/src/components/widgets/text_editors/MultiFormat.js
index 9b02f354e..73090594a 100644
--- a/src/components/widgets/text_editors/MultiFormat.js
+++ b/src/components/widgets/text_editors/MultiFormat.js
@@ -213,9 +213,9 @@ class MultiFormatTextEditor extends Component {
     });
     const bottomTabClassNames = classnames('multi-format-editor__tab', 'bottom-tab');
 
-    const Editor = this.editors.filter(editor => editor.key === currentTab)[0].component;
+    const Editor = this.editors.filter((editor) => editor.key === currentTab)[0].component;
 
-    const ModeTabsText = this.editors.map(editor => editor.label);
+    const ModeTabsText = this.editors.map((editor) => editor.label);
 
     const showBottomTab = currentTab === 'HTML' || currentTab === 'RICH_TEXT';
     const BottomTab =
diff --git a/src/components/widgets/text_editors/RichText/LinkDecorator.js b/src/components/widgets/text_editors/RichText/LinkDecorator.js
index b1cd1ddfe..9cf7e43bb 100644
--- a/src/components/widgets/text_editors/RichText/LinkDecorator.js
+++ b/src/components/widgets/text_editors/RichText/LinkDecorator.js
@@ -9,7 +9,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-const LinkDecorator = props => {
+const LinkDecorator = (props) => {
   return (
     <a href="#" style={props.style}>
       {props.children}
diff --git a/src/components/widgets/text_editors/RichText/LinkEditor.js b/src/components/widgets/text_editors/RichText/LinkEditor.js
index 0708374b6..f40724577 100644
--- a/src/components/widgets/text_editors/RichText/LinkEditor.js
+++ b/src/components/widgets/text_editors/RichText/LinkEditor.js
@@ -96,9 +96,9 @@ class LinkEditor extends Component {
           className="rich-text-editor__link-editor__input"
           onBlur={onBlur}
           onFocus={onFocus}
-          onChange={ev => this.onInputChange(ev.target.value)}
-          onKeyDown={ev => this.onInputKeyDown(ev)}
-          ref={input => (this.input = input)}
+          onChange={(ev) => this.onInputChange(ev.target.value)}
+          onKeyDown={(ev) => this.onInputKeyDown(ev)}
+          ref={(input) => (this.input = input)}
           value={linkURL}
           placeholder={placeholderText}
         />
diff --git a/src/components/widgets/text_editors/RichText/decoratorStrategies.js b/src/components/widgets/text_editors/RichText/decoratorStrategies.js
index 26e8dff88..6455009c3 100644
--- a/src/components/widgets/text_editors/RichText/decoratorStrategies.js
+++ b/src/components/widgets/text_editors/RichText/decoratorStrategies.js
@@ -8,7 +8,7 @@
  */
 import {Entity} from 'draft-js';
 
-const characterIsLinkEntity = character => {
+const characterIsLinkEntity = (character) => {
   const entityKey = character.getEntity();
 
   if (entityKey === null) {
diff --git a/src/components/widgets/text_editors/RichText/index.js b/src/components/widgets/text_editors/RichText/index.js
index bc062db0a..cbb46d937 100644
--- a/src/components/widgets/text_editors/RichText/index.js
+++ b/src/components/widgets/text_editors/RichText/index.js
@@ -334,7 +334,7 @@ class RichText extends Component {
             onFocus={this.onFocus}
             placeholder={this.props.placeholder}
             spellCheck={false}
-            ref={input => (this.editorInput = input)}
+            ref={(input) => (this.editorInput = input)}
           />
         </div>
         {this.renderLinkEditor(selectedLinkID)}
diff --git a/src/components/widgets/text_editors/convertFormats.js b/src/components/widgets/text_editors/convertFormats.js
index 21e7872d2..978ad37b3 100644
--- a/src/components/widgets/text_editors/convertFormats.js
+++ b/src/components/widgets/text_editors/convertFormats.js
@@ -8,9 +8,9 @@ const getTextBlockRegExp = () => /\\text\{([^}]*)}/g;
  */
 const getLaTeXWrappedRegExp = () => /^\$[\s\S]*\$$/;
 
-const stripHTMLTags = html => html.replace(/<[^>]*>/g, '').trim();
+const stripHTMLTags = (html) => html.replace(/<[^>]*>/g, '').trim();
 
-const extractTextBlocks = laTeX => {
+const extractTextBlocks = (laTeX) => {
   let matchObj;
   let matchStr;
   const matches = [];
@@ -32,23 +32,23 @@ const extractTextBlocks = laTeX => {
   return matches.join('<br>');
 };
 
-const wrapLaTeX = value => (value ? `$${value}$` : '$$');
+const wrapLaTeX = (value) => (value ? `$${value}$` : '$$');
 
-const wrapText = value => (value ? `\\text{${value}}` : '\\text{}');
+const wrapText = (value) => (value ? `\\text{${value}}` : '\\text{}');
 
 // Exports
 // -------
 
-export const isLaTeXExpr = value => getLaTeXWrappedRegExp().test(value);
+export const isLaTeXExpr = (value) => getLaTeXWrappedRegExp().test(value);
 
-export const hasTextExpression = laTeX => {
+export const hasTextExpression = (laTeX) => {
   const regExp = getTextBlockRegExp();
   const stringifiedLaTeX = JSON.stringify(laTeX);
 
   return regExp.test(stringifiedLaTeX);
 };
 
-export const htmlToLaTeX = html => {
+export const htmlToLaTeX = (html) => {
   const breakTag = '<br>';
   const trimmedHTML = html.trim();
 
@@ -67,12 +67,12 @@ export const htmlToLaTeX = html => {
       .split(breakTag)
 
       // Ignore empty linebreaks
-      .map(para => (para.length ? wrapText(stripHTMLTags(para)) : ''))
+      .map((para) => (para.length ? wrapText(stripHTMLTags(para)) : ''))
       .join('\n')
   );
 };
 
-export const laTeXToHTML = laTeX => {
+export const laTeXToHTML = (laTeX) => {
   const trimmedLaTeX = laTeX.trim();
 
   return extractTextBlocks(trimmedLaTeX);
diff --git a/src/default_panels/GraphCreatePanel.js b/src/default_panels/GraphCreatePanel.js
index 96791976e..0f2c71f4b 100644
--- a/src/default_panels/GraphCreatePanel.js
+++ b/src/default_panels/GraphCreatePanel.js
@@ -25,8 +25,8 @@ const GraphCreatePanel = (props, {localize: _, setPanel}) => {
   return (
     <TraceAccordion
       canAdd
-      traceFilterCondition={t =>
-        !(t.transforms && t.transforms.some(tr => ['fit', 'moving-average'].includes(tr.type)))
+      traceFilterCondition={(t) =>
+        !(t.transforms && t.transforms.some((tr) => ['fit', 'moving-average'].includes(tr.type)))
       }
       canReorder
     >
diff --git a/src/default_panels/GraphTransformsPanel.js b/src/default_panels/GraphTransformsPanel.js
index 3458f3019..6557e97bb 100644
--- a/src/default_panels/GraphTransformsPanel.js
+++ b/src/default_panels/GraphTransformsPanel.js
@@ -28,7 +28,7 @@ export class Aggregations extends Component {
     return (
       <PlotlySection name={_('Aggregations')} attr="aggregations">
         {aggregations
-          .filter(aggr => aggr.target && aggr.target.match(/transforms\[\d*\]\./gi) === null)
+          .filter((aggr) => aggr.target && aggr.target.match(/transforms\[\d*\]\./gi) === null)
           .map(({target}, i) => (
             <AggregationSection show key={i} aggregationIndex={i}>
               <Dropdown
@@ -66,7 +66,7 @@ Aggregations.contextTypes = {
 
 const GraphTransformsPanel = (props, {localize: _}) => {
   return (
-    <TraceAccordion traceFilterCondition={t => TRANSFORMABLE_TRACES.includes(t.type)}>
+    <TraceAccordion traceFilterCondition={(t) => TRANSFORMABLE_TRACES.includes(t.type)}>
       <TransformAccordion>
         <Radio
           attr="enabled"
diff --git a/src/default_panels/StyleAxesPanel.js b/src/default_panels/StyleAxesPanel.js
index 6b419598c..4c744a1a8 100644
--- a/src/default_panels/StyleAxesPanel.js
+++ b/src/default_panels/StyleAxesPanel.js
@@ -30,7 +30,7 @@ class StyleAxesPanel extends Component {
       <LayoutPanel>
         <AxesFold
           name={_('Titles')}
-          axisFilter={axis => !(axis._name.includes('angular') || axis._subplot.includes('geo'))}
+          axisFilter={(axis) => !(axis._name.includes('angular') || axis._subplot.includes('geo'))}
         >
           <TextEditor attr="title.text" />
           <FontSelector label={_('Typeface')} attr="title.font.family" />
@@ -168,7 +168,7 @@ class StyleAxesPanel extends Component {
           </PlotlySection>
         </AxesFold>
 
-        <AxesFold name={_('Tick Labels')} axisFilter={axis => !axis._subplot.includes('geo')}>
+        <AxesFold name={_('Tick Labels')} axisFilter={(axis) => !axis._subplot.includes('geo')}>
           <PlotlySection name={_('Tick Labels')} attr="showticklabels">
             <VisibilitySelect
               attr="showticklabels"
@@ -316,7 +316,7 @@ class StyleAxesPanel extends Component {
             </VisibilitySelect>
           </PlotlySection>
         </AxesFold>
-        <AxesFold name={_('Tick Markers')} axisFilter={axis => !axis._subplot.includes('geo')}>
+        <AxesFold name={_('Tick Markers')} axisFilter={(axis) => !axis._subplot.includes('geo')}>
           <PlotlySection name={_('Tick Markers')} attr="ticks">
             <VisibilitySelect
               attr="ticks"
@@ -369,7 +369,7 @@ class StyleAxesPanel extends Component {
           </PlotlySection>
         </AxesFold>
 
-        <AxesFold name={_('Range Slider')} axisFilter={axis => axis._subplot.includes('xaxis')}>
+        <AxesFold name={_('Range Slider')} axisFilter={(axis) => axis._subplot.includes('xaxis')}>
           <RangesliderVisible
             attr="rangeslider.visible"
             options={[
@@ -385,7 +385,7 @@ class StyleAxesPanel extends Component {
 
         <AxesFold
           name={_('Timescale Buttons')}
-          axisFilter={axis => axis._subplot.includes('xaxis') && axis.type === 'date'}
+          axisFilter={(axis) => axis._subplot.includes('xaxis') && axis.type === 'date'}
         >
           <Radio
             attr="rangeselector.visible"
@@ -465,7 +465,7 @@ class StyleAxesPanel extends Component {
 
         <AxesFold
           name={_('Spike Lines')}
-          axisFilter={axis =>
+          axisFilter={(axis) =>
             !(
               axis._subplot.includes('ternary') ||
               axis._subplot.includes('polar') ||
diff --git a/src/default_panels/StyleColorbarsPanel.js b/src/default_panels/StyleColorbarsPanel.js
index 78463dd6c..0441cf17b 100644
--- a/src/default_panels/StyleColorbarsPanel.js
+++ b/src/default_panels/StyleColorbarsPanel.js
@@ -25,7 +25,7 @@ export const traceHasColorbar = (trace, fullTrace) =>
 const StyleColorBarsPanel = (props, {localize: _}) => {
   return (
     <TraceAccordion traceFilterCondition={traceHasColorbar}>
-      {['', 'marker.'].map(prefix => {
+      {['', 'marker.'].map((prefix) => {
         return (
           <VisibilitySelect
             attr={prefix + 'showscale'}
diff --git a/src/default_panels/StyleTracesPanel.js b/src/default_panels/StyleTracesPanel.js
index ded439cd1..697ce6f4c 100644
--- a/src/default_panels/StyleTracesPanel.js
+++ b/src/default_panels/StyleTracesPanel.js
@@ -645,7 +645,7 @@ const StyleTracesPanel = (props, {localize: _}) => (
     <TraceTypeSection
       name={_('Text')}
       traceTypes={allTraceTypes.filter(
-        t =>
+        (t) =>
           ![
             'histogram2d',
             'histogram2dcontour',
diff --git a/src/lib/__tests__/connectLayoutToPlot-test.js b/src/lib/__tests__/connectLayoutToPlot-test.js
index fd57fcd15..1e247bdff 100644
--- a/src/lib/__tests__/connectLayoutToPlot-test.js
+++ b/src/lib/__tests__/connectLayoutToPlot-test.js
@@ -7,9 +7,9 @@ import {TestEditor, fixtures, plotly} from '../test-utils';
 import {mount} from 'enzyme';
 
 const Layouts = [PlotlyPanel, PlotlyFold, PlotlySection].map(connectLayoutToPlot);
-const Editor = props => <TestEditor {...{plotly, onUpdate: jest.fn(), ...props}} />;
+const Editor = (props) => <TestEditor {...{plotly, onUpdate: jest.fn(), ...props}} />;
 
-Layouts.forEach(Layout => {
+Layouts.forEach((Layout) => {
   describe(`<${Layout.displayName}>`, () => {
     it(`wraps container with fullValue pointing to gd._fullLayout`, () => {
       const wrapper = mount(
diff --git a/src/lib/__tests__/connectTraceToPlot-test.js b/src/lib/__tests__/connectTraceToPlot-test.js
index df8296791..38f58f851 100644
--- a/src/lib/__tests__/connectTraceToPlot-test.js
+++ b/src/lib/__tests__/connectTraceToPlot-test.js
@@ -7,11 +7,11 @@ import {TestEditor, fixtures, plotly} from '../test-utils';
 import {mount} from 'enzyme';
 
 const Traces = [PlotlyPanel, PlotlyFold, PlotlySection].map(connectTraceToPlot);
-const Editor = props => <TestEditor {...{plotly, onUpdate: jest.fn(), ...props}} />;
+const Editor = (props) => <TestEditor {...{plotly, onUpdate: jest.fn(), ...props}} />;
 
 const defaultMarkerSize = 6;
 
-Traces.forEach(Trace => {
+Traces.forEach((Trace) => {
   describe(`<${Trace.displayName}>`, () => {
     it('wraps container with fullValue pointing to gd._fullData[i]', () => {
       const wrapper = mount(
diff --git a/src/lib/__tests__/dereference-test.js b/src/lib/__tests__/dereference-test.js
index cf05d0b9a..f9ed655aa 100644
--- a/src/lib/__tests__/dereference-test.js
+++ b/src/lib/__tests__/dereference-test.js
@@ -50,7 +50,7 @@ describe('dereference', () => {
   });
 
   it('uses custom function if provided in config', () => {
-    const customParsing = src => src.split(',');
+    const customParsing = (src) => src.split(',');
     const container = [{zsrc: 'z1,z2', type: 'heatmap'}];
     dereference(container, {z1: [1, 2, 3], z2: [2, 2, 2]}, {toSrc: customParsing});
 
diff --git a/src/lib/__tests__/maybeAdjustSrc-test.js b/src/lib/__tests__/maybeAdjustSrc-test.js
index ceab7afb4..99339ab7b 100644
--- a/src/lib/__tests__/maybeAdjustSrc-test.js
+++ b/src/lib/__tests__/maybeAdjustSrc-test.js
@@ -2,7 +2,7 @@ import {maybeAdjustSrc} from '../index';
 /* eslint-disable no-magic-numbers */
 describe('maybeAdjustSrc', () => {
   it('uses custom parsing function if one is provided', () => {
-    const custom = srcs => srcs.join('$');
+    const custom = (srcs) => srcs.join('$');
     const adjusted = maybeAdjustSrc(['z1', 'z2'], 'zsrc', 'heatmap', {
       fromSrc: custom,
     });
diff --git a/src/lib/__tests__/transpose-test.js b/src/lib/__tests__/transpose-test.js
index b1ae94014..5931309d0 100644
--- a/src/lib/__tests__/transpose-test.js
+++ b/src/lib/__tests__/transpose-test.js
@@ -7,7 +7,7 @@ describe('transpose', () => {
 
     expect(transposedArray.length).toBe(3);
 
-    transposedArray.forEach(subArray => {
+    transposedArray.forEach((subArray) => {
       expect(Array.isArray(subArray)).toBe(true);
       expect(subArray.length).toBe(1);
     });
@@ -25,7 +25,7 @@ describe('transpose', () => {
     const transposedArray = transpose(originalArray);
 
     expect(transposedArray.length).toBe(3);
-    transposedArray.forEach(subArray => {
+    transposedArray.forEach((subArray) => {
       expect(Array.isArray(subArray)).toBe(true);
       expect(subArray.length).toBe(2);
     });
@@ -46,7 +46,7 @@ describe('transpose', () => {
     const transposedArray = transpose(originalArray);
 
     expect(transposedArray.length).toBe(3);
-    transposedArray.forEach(subArray => {
+    transposedArray.forEach((subArray) => {
       expect(Array.isArray(subArray)).toBe(true);
       expect(subArray.length).toBe(2);
     });
diff --git a/src/lib/__tests__/unpackPlotProps-test.js b/src/lib/__tests__/unpackPlotProps-test.js
index fe443a93f..9e137b6d3 100644
--- a/src/lib/__tests__/unpackPlotProps-test.js
+++ b/src/lib/__tests__/unpackPlotProps-test.js
@@ -42,7 +42,7 @@ describe('computeCustomConfigVisibility', () => {
       'colorscale.tickcolor': false,
     };
 
-    Object.keys(cases).forEach(c => validate(c, cases, customConfig));
+    Object.keys(cases).forEach((c) => validate(c, cases, customConfig));
   });
 
   it('correctly whitelists attributes taking into account exceptions', () => {
@@ -58,7 +58,7 @@ describe('computeCustomConfigVisibility', () => {
       'colorscale.tickcolor': true,
     };
 
-    Object.keys(cases).forEach(c => validate(c, cases, config));
+    Object.keys(cases).forEach((c) => validate(c, cases, config));
   });
 
   it('correctly displays visibility based on controlType', () => {
@@ -82,7 +82,7 @@ describe('computeCustomConfigVisibility', () => {
 
     const case1 = {'marker.color': false};
     const case2 = {'marker.color': true};
-    Object.keys(case1).forEach(c => validate(c, case1, config, 'ColorscalePicker'));
-    Object.keys(case2).forEach(c => validate(c, case2, config, 'AnotherPicker'));
+    Object.keys(case1).forEach((c) => validate(c, case1, config, 'ColorscalePicker'));
+    Object.keys(case2).forEach((c) => validate(c, case2, config, 'AnotherPicker'));
   });
 });
diff --git a/src/lib/__tests__/walkObject-test.js b/src/lib/__tests__/walkObject-test.js
index dd2d5354e..66ef5a5e4 100644
--- a/src/lib/__tests__/walkObject-test.js
+++ b/src/lib/__tests__/walkObject-test.js
@@ -59,7 +59,7 @@ describe('objectUtils', () => {
       const actualCounts = {};
       const actualKeys = [];
 
-      callback.mock.calls.forEach(call => {
+      callback.mock.calls.forEach((call) => {
         const [key, parent, path] = call;
         const pathString = path.join('.');
         actualCounts[pathString] = (actualCounts[pathString] || 0) + 1;
@@ -74,7 +74,7 @@ describe('objectUtils', () => {
 
       // We should get each key *once*.
       expect(actualKeys.length).toEqual(expectedKeys.length);
-      expectedKeys.forEach(key => {
+      expectedKeys.forEach((key) => {
         expect(actualKeys.indexOf(key)).not.toEqual(-1);
       });
     });
@@ -143,7 +143,7 @@ describe('objectUtils', () => {
       const actualCounts = {};
       const actualKeys = [];
 
-      callback.mock.calls.forEach(call => {
+      callback.mock.calls.forEach((call) => {
         const [key, parent, path] = call;
         const pathString = path.join('.');
         actualCounts[pathString] = (actualCounts[pathString] || 0) + 1;
@@ -158,7 +158,7 @@ describe('objectUtils', () => {
 
       // We should get each key *once*.
       expect(actualKeys.length).toEqual(expectedKeys.length);
-      expectedKeys.forEach(key => {
+      expectedKeys.forEach((key) => {
         expect(actualKeys.indexOf(key)).not.toEqual(-1);
       });
     });
@@ -208,7 +208,7 @@ describe('objectUtils', () => {
       const actualCounts = {};
       const actualKeys = [];
 
-      callback.mock.calls.forEach(call => {
+      callback.mock.calls.forEach((call) => {
         const [key, parent, path] = call;
         const pathString = path.join('.');
         actualCounts[pathString] = (actualCounts[pathString] || 0) + 1;
@@ -262,7 +262,7 @@ describe('objectUtils', () => {
         pathType: 'nestedProperty',
       });
 
-      let actualPaths = callback.mock.calls.map(args => args[2]);
+      let actualPaths = callback.mock.calls.map((args) => args[2]);
       let expectedPaths = ['a', 'b', 'b[0]', 'b[0].c', 'b[1]', 'b[2]'];
 
       expect(actualPaths).toEqual(expectedPaths);
@@ -274,7 +274,7 @@ describe('objectUtils', () => {
         pathType: 'nestedProperty',
       });
 
-      actualPaths = callback.mock.calls.map(args => args[2]);
+      actualPaths = callback.mock.calls.map((args) => args[2]);
       expectedPaths = [
         'undefined',
         'b',
diff --git a/src/lib/computeTraceOptionsFromSchema.js b/src/lib/computeTraceOptionsFromSchema.js
index 8ff33db1a..926c2a219 100644
--- a/src/lib/computeTraceOptionsFromSchema.js
+++ b/src/lib/computeTraceOptionsFromSchema.js
@@ -1,7 +1,9 @@
 function computeTraceOptionsFromSchema(schema, _, context) {
   // Filter out Polar "area" type as it is fairly broken and we want to present
   // scatter with fill as an "area" chart type for convenience.
-  const traceTypes = Object.keys(schema.traces).filter(t => !['area', 'scattermapbox'].includes(t));
+  const traceTypes = Object.keys(schema.traces).filter(
+    (t) => !['area', 'scattermapbox'].includes(t)
+  );
 
   const traceOptions = [
     {
@@ -136,9 +138,9 @@ function computeTraceOptionsFromSchema(schema, _, context) {
       value: 'isosurface',
       label: _('Isosurface'),
     },
-  ].filter(obj => traceTypes.indexOf(obj.value) !== -1);
+  ].filter((obj) => traceTypes.indexOf(obj.value) !== -1);
 
-  const traceIndex = traceType => traceOptions.findIndex(opt => opt.value === traceType);
+  const traceIndex = (traceType) => traceOptions.findIndex((opt) => opt.value === traceType);
 
   traceOptions.splice(
     traceIndex('scatter') + 1,
diff --git a/src/lib/connectAggregationToTransform.js b/src/lib/connectAggregationToTransform.js
index 9a1df3de8..cf1a2fed0 100644
--- a/src/lib/connectAggregationToTransform.js
+++ b/src/lib/connectAggregationToTransform.js
@@ -27,7 +27,7 @@ export default function connectAggregationToTransform(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`aggregations[].${attr}`),
         updateContainer: this.updateAggregation,
         container: this.container,
diff --git a/src/lib/connectAnnotationToLayout.js b/src/lib/connectAnnotationToLayout.js
index 46c3aabcf..b1f79188c 100644
--- a/src/lib/connectAnnotationToLayout.js
+++ b/src/lib/connectAnnotationToLayout.js
@@ -30,7 +30,7 @@ export default function connectAnnotationToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`annotations[].${attr}`),
         updateContainer: this.updateAnnotation,
         deleteContainer: this.deleteAnnotation,
diff --git a/src/lib/connectAxesToLayout.js b/src/lib/connectAxesToLayout.js
index f60e52d1f..61c7153ad 100644
--- a/src/lib/connectAxesToLayout.js
+++ b/src/lib/connectAxesToLayout.js
@@ -72,8 +72,8 @@ export default function connectAxesToLayout(WrappedComponent) {
 
       if (axesTarget === 'allaxes') {
         const multiValuedContainer = deepCopyPublic(this.axes[0]);
-        this.axes.slice(1).forEach(ax =>
-          Object.keys(ax).forEach(key =>
+        this.axes.slice(1).forEach((ax) =>
+          Object.keys(ax).forEach((key) =>
             setMultiValuedContainer(multiValuedContainer, deepCopyPublic(ax), key, {
               searchArrays: true,
             })
@@ -90,7 +90,7 @@ export default function connectAxesToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject
             ? null
             : this.context.getValObject(`${this.state.axesTarget}.${attr}`),
diff --git a/src/lib/connectCartesianSubplotToLayout.js b/src/lib/connectCartesianSubplotToLayout.js
index eab68ddb1..2d62d378e 100644
--- a/src/lib/connectCartesianSubplotToLayout.js
+++ b/src/lib/connectCartesianSubplotToLayout.js
@@ -39,7 +39,7 @@ export default function connectCartesianSubplotToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject
             ? null
             : this.context.getValObject(
diff --git a/src/lib/connectImageToLayout.js b/src/lib/connectImageToLayout.js
index d9be20265..68adab96f 100644
--- a/src/lib/connectImageToLayout.js
+++ b/src/lib/connectImageToLayout.js
@@ -30,7 +30,7 @@ export default function connectImageToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`images[].${attr}`),
         updateContainer: this.updateImage,
         deleteContainer: this.deleteImage,
diff --git a/src/lib/connectLayersToMapbox.js b/src/lib/connectLayersToMapbox.js
index 85dece6eb..372c19451 100644
--- a/src/lib/connectLayersToMapbox.js
+++ b/src/lib/connectLayersToMapbox.js
@@ -30,7 +30,7 @@ export default function connectLayersToMapbox(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`layers[].${attr}`),
         updateContainer: this.updateMapboxLayer,
         deleteContainer: this.deleteMapboxLayer,
diff --git a/src/lib/connectLayoutToPlot.js b/src/lib/connectLayoutToPlot.js
index 276f2ddde..bbbe97884 100644
--- a/src/lib/connectLayoutToPlot.js
+++ b/src/lib/connectLayoutToPlot.js
@@ -9,7 +9,7 @@ export default function connectLayoutToPlot(WrappedComponent) {
     getChildContext() {
       const {layout, fullLayout, plotly, onUpdate} = this.context;
 
-      const updateContainer = update => {
+      const updateContainer = (update) => {
         if (!onUpdate) {
           return;
         }
@@ -22,7 +22,7 @@ export default function connectLayoutToPlot(WrappedComponent) {
       };
 
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !plotly
             ? null
             : plotly.PlotSchema.getLayoutValObject(fullLayout, nestedProperty({}, attr).parts),
diff --git a/src/lib/connectNonCartesianSubplotToLayout.js b/src/lib/connectNonCartesianSubplotToLayout.js
index db29cb198..dcbb133a1 100644
--- a/src/lib/connectNonCartesianSubplotToLayout.js
+++ b/src/lib/connectNonCartesianSubplotToLayout.js
@@ -33,7 +33,7 @@ export default function connectNonCartesianSubplotToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject
             ? null
             : this.context.getValObject(`${this.props.subplot}.${attr}`),
diff --git a/src/lib/connectRangeSelectorToAxis.js b/src/lib/connectRangeSelectorToAxis.js
index 977a84de9..11e0af74a 100644
--- a/src/lib/connectRangeSelectorToAxis.js
+++ b/src/lib/connectRangeSelectorToAxis.js
@@ -31,7 +31,7 @@ export default function connectRangeSelectorToAxis(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject
             ? null
             : this.context.getValObject(`rangeselector.buttons[].${attr}`),
diff --git a/src/lib/connectShapeToLayout.js b/src/lib/connectShapeToLayout.js
index d76789434..3bf2f2e4f 100644
--- a/src/lib/connectShapeToLayout.js
+++ b/src/lib/connectShapeToLayout.js
@@ -30,7 +30,7 @@ export default function connectShapeToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`shapes[].${attr}`),
         updateContainer: this.updateShape,
         deleteContainer: this.deleteShape,
diff --git a/src/lib/connectSliderToLayout.js b/src/lib/connectSliderToLayout.js
index d42a7bde3..82663fed5 100644
--- a/src/lib/connectSliderToLayout.js
+++ b/src/lib/connectSliderToLayout.js
@@ -26,7 +26,7 @@ export default function connectSliderToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`sliders[].${attr}`),
         updateContainer: this.updateSlider,
         container: this.container,
diff --git a/src/lib/connectTraceToPlot.js b/src/lib/connectTraceToPlot.js
index c42b7f781..f6170fcf0 100644
--- a/src/lib/connectTraceToPlot.js
+++ b/src/lib/connectTraceToPlot.js
@@ -35,7 +35,7 @@ export default function connectTraceToPlot(WrappedComponent) {
       const fullTrace = getFullTrace(props, context);
 
       this.childContext = {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !plotly
             ? null
             : plotly.PlotSchema.getTraceValObject(fullTrace, nestedProperty({}, attr).parts),
@@ -49,16 +49,16 @@ export default function connectTraceToPlot(WrappedComponent) {
 
       if (traceIndexes.length > 1) {
         const multiValuedFullContainer = deepCopyPublic(fullTrace);
-        fullData.forEach(t =>
-          Object.keys(t).forEach(key =>
+        fullData.forEach((t) =>
+          Object.keys(t).forEach((key) =>
             setMultiValuedContainer(multiValuedFullContainer, deepCopyPublic(t), key, {
               searchArrays: true,
             })
           )
         );
         const multiValuedContainer = deepCopyPublic(trace);
-        data.forEach(t =>
-          Object.keys(t).forEach(key =>
+        data.forEach((t) =>
+          Object.keys(t).forEach((key) =>
             setMultiValuedContainer(multiValuedContainer, deepCopyPublic(t), key, {
               searchArrays: true,
             })
@@ -82,10 +82,10 @@ export default function connectTraceToPlot(WrappedComponent) {
     updateTrace(update) {
       if (this.context.onUpdate) {
         const splitTraceGroup = this.props.fullDataArrayPosition
-          ? this.props.fullDataArrayPosition.map(p => this.context.fullData[p]._group)
+          ? this.props.fullDataArrayPosition.map((p) => this.context.fullData[p]._group)
           : null;
 
-        const containsAnSrc = Object.keys(update).filter(a => a.endsWith('src')).length > 0;
+        const containsAnSrc = Object.keys(update).filter((a) => a.endsWith('src')).length > 0;
 
         if (Array.isArray(update)) {
           update.forEach((u, i) => {
@@ -144,7 +144,7 @@ export default function connectTraceToPlot(WrappedComponent) {
 
         const isSubplotUsedAnywhereElse = (subplotType, subplotName) =>
           this.context.fullData.some(
-            trace =>
+            (trace) =>
               (trace[SUBPLOT_TO_ATTR[subplotType].data] === subplotName ||
                 ((subplotType === 'xaxis' || subplotType === 'yaxis') && subplotName.charAt(1)) ===
                   '' ||
diff --git a/src/lib/connectTransformToTrace.js b/src/lib/connectTransformToTrace.js
index a24b16b41..78193c595 100644
--- a/src/lib/connectTransformToTrace.js
+++ b/src/lib/connectTransformToTrace.js
@@ -29,7 +29,7 @@ export default function connectTransformToTrace(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`transforms[].${attr}`),
         updateContainer: this.updateTransform,
         deleteContainer: this.deleteTransform,
diff --git a/src/lib/connectUpdateMenuToLayout.js b/src/lib/connectUpdateMenuToLayout.js
index 9b1229dd7..6675c92f3 100644
--- a/src/lib/connectUpdateMenuToLayout.js
+++ b/src/lib/connectUpdateMenuToLayout.js
@@ -26,7 +26,7 @@ export default function connectUpdateMenuToLayout(WrappedComponent) {
 
     getChildContext() {
       return {
-        getValObject: attr =>
+        getValObject: (attr) =>
           !this.context.getValObject ? null : this.context.getValObject(`updatemenus[].${attr}`),
         updateContainer: this.updateUpdateMenu,
         container: this.container,
diff --git a/src/lib/dereference.js b/src/lib/dereference.js
index b9fac6551..e5ed54d8f 100644
--- a/src/lib/dereference.js
+++ b/src/lib/dereference.js
@@ -5,8 +5,8 @@ const SRC_ATTR_PATTERN = /src$/;
 
 export function getColumnNames(srcArray, dataSourceOptions) {
   return srcArray
-    .map(src => {
-      const columns = dataSourceOptions.filter(dso => dso.value === src);
+    .map((src) => {
+      const columns = dataSourceOptions.filter((dso) => dso.value === src);
       if (columns.length === 1) {
         return columns[0].columnName || columns[0].label;
       }
@@ -37,7 +37,7 @@ export default function dereference(
       srcRef = [srcRef];
     }
 
-    let dereferencedData = srcRef.map(ref => {
+    let dereferencedData = srcRef.map((ref) => {
       if (config.deleteKeys && !(ref in dataSources)) {
         delete parent[dataKey];
       }
diff --git a/src/lib/getAllAxes.js b/src/lib/getAllAxes.js
index 5b2a72544..b91de6d1e 100644
--- a/src/lib/getAllAxes.js
+++ b/src/lib/getAllAxes.js
@@ -8,10 +8,10 @@ export default function getAllAxes(fullLayout) {
     Object.keys(fullLayout._subplots)
       .filter(
         // xaxis and yaxis already included separately in _fullLayout._subplots
-        type => type !== 'cartesian' && fullLayout._subplots[type].length !== 0
+        (type) => type !== 'cartesian' && fullLayout._subplots[type].length !== 0
       )
-      .forEach(type => {
-        fullLayout._subplots[type].forEach(subplot => {
+      .forEach((type) => {
+        fullLayout._subplots[type].forEach((subplot) => {
           if (['xaxis', 'yaxis'].includes(type)) {
             // subplot will look like x2, x45, convert it to xaxis2, xaxis45
             subplot = // eslint-disable-line no-param-reassign
@@ -24,8 +24,8 @@ export default function getAllAxes(fullLayout) {
             axes.push(fullLayout[subplot]);
           } else {
             Object.keys(fullLayout[subplot])
-              .filter(key => key.includes('axis'))
-              .forEach(axis => {
+              .filter((key) => key.includes('axis'))
+              .forEach((axis) => {
                 fullLayout[subplot][axis]._subplot = subplot;
                 fullLayout[subplot][axis]._axisGroup = type;
 
@@ -57,7 +57,7 @@ export function traceTypeToAxisType(traceType, subplot = false) {
     delete traceToAxis.gl3d;
   }
 
-  Object.keys(traceToAxis).forEach(c => {
+  Object.keys(traceToAxis).forEach((c) => {
     if (traceToAxis[c].includes(traceType)) {
       category = c;
     }
diff --git a/src/lib/index.js b/src/lib/index.js
index 9fc53818b..413c219da 100644
--- a/src/lib/index.js
+++ b/src/lib/index.js
@@ -66,13 +66,13 @@ function renderTraceIcon(trace, prefix = 'Plot') {
 
 function transpose(originalArray) {
   // if we want to transpose a uni dimensional array
-  if (originalArray.every(a => !Array.isArray(a))) {
-    return originalArray.map(a => [a]);
+  if (originalArray.every((a) => !Array.isArray(a))) {
+    return originalArray.map((a) => [a]);
   }
 
   let longestArrayItem = Array.isArray(originalArray[0]) ? originalArray[0].length : 1;
 
-  originalArray.forEach(a => {
+  originalArray.forEach((a) => {
     // if it's not an array, it's a string
     const length = Array.isArray(a) ? a.length : 1;
     if (length > longestArrayItem) {
@@ -122,7 +122,7 @@ const specialTableCase = (traceType, srcAttributePath) => {
       'header.font.sizesrc',
       'header.fill.colorsrc',
       'columnwidthsrc',
-    ].some(a => srcAttributePath.endsWith(a))
+    ].some((a) => srcAttributePath.endsWith(a))
   );
 };
 
@@ -190,7 +190,7 @@ function getFullTrace(props, context) {
       fullTrace = context.fullData[props.fullDataArrayPosition[0]];
     } else {
       // for all other panels, we'll find fullTrace with the data index
-      fullTrace = context.fullData.filter(t => t && props.traceIndexes[0] === t.index)[0];
+      fullTrace = context.fullData.filter((t) => t && props.traceIndexes[0] === t.index)[0];
     }
 
     // For transformed traces, we actually want to read in _fullInput because
@@ -200,7 +200,7 @@ function getFullTrace(props, context) {
     if (
       fullTrace &&
       fullTrace.transforms &&
-      !fullTrace.transforms.some(t => ['moving-average', 'fits'].includes(t.type)) &&
+      !fullTrace.transforms.some((t) => ['moving-average', 'fits'].includes(t.type)) &&
       !props.fullDataArrayPosition
     ) {
       fullTrace = fullTrace._fullInput;
diff --git a/src/lib/multiValues.js b/src/lib/multiValues.js
index 3edde12c4..a247ec1e6 100644
--- a/src/lib/multiValues.js
+++ b/src/lib/multiValues.js
@@ -71,7 +71,7 @@ function setMultiValuedContainer(intoObj, fromObj, key, config = {}) {
     if (!isPlainObject(intoVal)) {
       throw new Error('tried to merge object into non-object: ' + key);
     }
-    Object.keys(fromVal).forEach(function(key2) {
+    Object.keys(fromVal).forEach(function (key2) {
       setMultiValuedContainer(intoVal, fromVal, key2, config);
     });
   } else if (isPlainObject(intoVal)) {
diff --git a/src/lib/sortMenu.js b/src/lib/sortMenu.js
index c0a6870fd..e561adf24 100644
--- a/src/lib/sortMenu.js
+++ b/src/lib/sortMenu.js
@@ -42,15 +42,15 @@ export default function sortMenu(children, order) {
   // PART 2: validate order prop, if a desired panel specified in order, matches no actual panel rendered
   // in the panels array, it is excluded from ordering considerations
   // eslint-disable-next-line
-  order = order.filter(desiredPanel =>
+  order = order.filter((desiredPanel) =>
     panels.some(
-      actualPanel =>
+      (actualPanel) =>
         actualPanel.props.name === desiredPanel.name &&
         actualPanel.props.group === desiredPanel.group
     )
   );
 
-  const desiredGroupOrder = order.map(panel => panel.group).filter(getUniqueValues);
+  const desiredGroupOrder = order.map((panel) => panel.group).filter(getUniqueValues);
 
   // PART 3: Sort panels
   panels.sort((a, b) => {
@@ -92,8 +92,8 @@ export default function sortMenu(children, order) {
         // have to because within a given group we'd assume that there will be
         // no 2 subpanels named the same.
         const desiredNameOrder = order
-          .filter(panel => panel.group === a.props.group)
-          .map(panel => panel.name)
+          .filter((panel) => panel.group === a.props.group)
+          .map((panel) => panel.name)
           .filter(getUniqueValues);
 
         const panelAHasNameCustomOrder = desiredNameOrder.includes(a.props.name);
diff --git a/src/lib/striptags.js b/src/lib/striptags.js
index 334ad82d2..4728918cf 100644
--- a/src/lib/striptags.js
+++ b/src/lib/striptags.js
@@ -26,7 +26,7 @@
 
 // minimal symbol polyfill for IE11 and others
 if (typeof Symbol !== 'function') {
-  var Symbol = function(name) {
+  var Symbol = function (name) {
     return name;
   };
 
diff --git a/src/lib/traceTypes.js b/src/lib/traceTypes.js
index 7eb3c29bb..0cc9fbe5b 100644
--- a/src/lib/traceTypes.js
+++ b/src/lib/traceTypes.js
@@ -2,7 +2,7 @@
  * Trace type constants
  */
 
-export const chartCategory = _ => {
+export const chartCategory = (_) => {
   return {
     SIMPLE: {
       value: 'SIMPLE',
@@ -40,7 +40,7 @@ export const chartCategory = _ => {
 };
 
 // Layout specification for TraceTypeSelector.js
-export const categoryLayout = _ => [
+export const categoryLayout = (_) => [
   chartCategory(_).SIMPLE,
   chartCategory(_).DISTRIBUTIONS,
   chartCategory(_).THREE_D,
@@ -49,7 +49,7 @@ export const categoryLayout = _ => [
   chartCategory(_).SPECIALIZED,
 ];
 
-export const traceTypes = _ => [
+export const traceTypes = (_) => [
   {
     value: 'scatter',
     label: _('Scatter'),
diff --git a/src/lib/unpackPlotProps.js b/src/lib/unpackPlotProps.js
index af917202f..c9546ffa9 100644
--- a/src/lib/unpackPlotProps.js
+++ b/src/lib/unpackPlotProps.js
@@ -4,7 +4,7 @@ import nestedProperty from 'plotly.js/src/lib/nested_property';
 import isNumeric from 'fast-isnumeric';
 import {MULTI_VALUED, MULTI_VALUED_PLACEHOLDER} from './constants';
 
-const hasFullValue = fullValue => fullValue !== void 0 && fullValue !== null;
+const hasFullValue = (fullValue) => fullValue !== void 0 && fullValue !== null;
 
 export function hasValidCustomConfigVisibilityRules(customConfig) {
   if (
@@ -21,7 +21,7 @@ export function hasValidCustomConfigVisibilityRules(customConfig) {
     }
 
     if (
-      !Object.keys(customConfig.visibility_rules).some(key =>
+      !Object.keys(customConfig.visibility_rules).some((key) =>
         ['blacklist', 'whitelist'].includes(key)
       )
     ) {
@@ -31,7 +31,7 @@ export function hasValidCustomConfigVisibilityRules(customConfig) {
       return false;
     }
 
-    const isValidRule = rule => {
+    const isValidRule = (rule) => {
       if (rule.exceptions) {
         return rule.exceptions.every(isValidRule);
       }
@@ -65,15 +65,15 @@ export function hasValidCustomConfigVisibilityRules(customConfig) {
 export function computeCustomConfigVisibility(props, customConfig, wrappedComponentDisplayName) {
   let isVisible;
 
-  const isRegexMatch = rule => {
+  const isRegexMatch = (rule) => {
     const stringToTest = rule.type === 'attrName' ? props.attr : wrappedComponentDisplayName;
     return RegExp(rule.regex_match).test(stringToTest);
   };
 
-  const passesTest = rule => {
-    const hasException = rule => {
+  const passesTest = (rule) => {
+    const hasException = (rule) => {
       if (rule.exceptions) {
-        return rule.exceptions.some(exception => passesTest(exception));
+        return rule.exceptions.some((exception) => passesTest(exception));
       }
       return false;
     };
@@ -144,7 +144,7 @@ export default function unpackPlotProps(props, context) {
     description = attrMeta.description;
   }
 
-  const updatePlot = v => {
+  const updatePlot = (v) => {
     if (updateContainer) {
       updateContainer({[props.attr]: v});
     }
diff --git a/src/lib/walkObject.js b/src/lib/walkObject.js
index 907a453fa..eb1481666 100644
--- a/src/lib/walkObject.js
+++ b/src/lib/walkObject.js
@@ -128,7 +128,7 @@ export function makeAttrSetterPath(parts) {
  */
 function _walkObject(object, callback, path, config) {
   const {walkArrays, walkArraysMatchingKeys} = config;
-  Object.keys(object).forEach(key => {
+  Object.keys(object).forEach((key) => {
     // Callback can force traversal to stop by returning `true`.
     if (callback(key, object, path.get(object, key))) {
       return;
diff --git a/src/shame.js b/src/shame.js
index 3f84b778d..68111a31a 100644
--- a/src/shame.js
+++ b/src/shame.js
@@ -46,14 +46,14 @@ function clearAxisTypes(gd, traces) {
 
 export const shamefullyAdjustAxisRef = (graphDiv, payload) => {
   if (payload.axesToBeGarbageCollected) {
-    payload.axesToBeGarbageCollected.forEach(a => {
+    payload.axesToBeGarbageCollected.forEach((a) => {
       const axis = a.charAt(0);
       const axisIdNumber = Number(a.slice(1));
 
       nestedProperty(graphDiv.layout, `${axis}axis${axisIdNumber || ''}`).set(null);
       Object.keys(graphDiv.layout)
-        .filter(key => key.startsWith(axis + 'axis'))
-        .forEach(key => {
+        .filter((key) => key.startsWith(axis + 'axis'))
+        .forEach((key) => {
           if (nestedProperty(graphDiv.layout, `${key}.overlaying`).get() === a) {
             nestedProperty(graphDiv.layout, `${key}.overlaying`).set(null);
           }
@@ -67,7 +67,7 @@ export const shamefullyAdjustAxisRef = (graphDiv, payload) => {
 
 const geoRegex = /^(geo\d*)\./;
 export const shamefullyAdjustGeo = ({layout}, {update}) => {
-  Object.keys(update).forEach(k => {
+  Object.keys(update).forEach((k) => {
     const geoMatch = geoRegex.exec(k);
     if (geoMatch) {
       const geo = geoMatch[1];
@@ -89,7 +89,7 @@ export const shamefullyAdjustGeo = ({layout}, {update}) => {
   });
 };
 
-export const shamefullyAdjustMapbox = gd => {
+export const shamefullyAdjustMapbox = (gd) => {
   if (gd.layout && gd.layout.mapbox && gd.layout.mapbox.style) {
     return;
   }
@@ -119,13 +119,13 @@ export const shamefullyAdjustSplitStyleTargetContainers = (graphDiv, {traceIndex
         // Create style containers for all groups
         if (!transform.styles.length && update[attr] && Array.isArray(update[attr])) {
           const dedupedGroups = [];
-          update[attr].forEach(group => {
+          update[attr].forEach((group) => {
             if (!dedupedGroups.includes(group)) {
               dedupedGroups.push(group);
             }
           });
 
-          const styles = dedupedGroups.map(groupEl => ({
+          const styles = dedupedGroups.map((groupEl) => ({
             target: groupEl,
             value: {},
           }));
@@ -168,7 +168,7 @@ export const shamefullyCreateSplitStyleProps = (graphDiv, attr, traceIndex, spli
     let path =
       graphDiv.data[traceIndex].transforms[indexOfSplitTransform].styles[indexOfStyleObject].value;
 
-    attr.split('.').forEach(p => {
+    attr.split('.').forEach((p) => {
       if (!path[p]) {
         path[p] = {};
       }
@@ -181,7 +181,7 @@ export const shamefullyCreateSplitStyleProps = (graphDiv, attr, traceIndex, spli
     );
   }
 
-  return splitTraceGroup.map(g => getProp(g));
+  return splitTraceGroup.map((g) => getProp(g));
 };
 
 export const shamefullyDeleteRelatedAnalysisTransforms = (graphDiv, payload) => {
@@ -194,7 +194,7 @@ export const shamefullyDeleteRelatedAnalysisTransforms = (graphDiv, payload) =>
       if (
         d.transforms &&
         d.transforms.some(
-          transform =>
+          (transform) =>
             ['moving-average', 'fit'].includes(transform.type) && transform.inputUid === parentUid
         )
       ) {
@@ -203,7 +203,7 @@ export const shamefullyDeleteRelatedAnalysisTransforms = (graphDiv, payload) =>
     });
 
     if (relatedAnalysisTraceIndexes.length) {
-      relatedAnalysisTraceIndexes.forEach(i => {
+      relatedAnalysisTraceIndexes.forEach((i) => {
         graphDiv.data.splice(i, 1);
       });
     }