fixes

Author: dmt0

dev/percy/histogram.json

@@ -0,0 +1,69 @@
+{
+  "data": [
+    {
+      "type": "histogram",
+      "mode": "markers",
+      "uid": "dcb598",
+      "x": [
+        1,
+        2,
+        3,
+        4,
+        5,
+        6
+      ],
+      "xsrc": "ints",
+      "autobinx": true,
+      "xbins": {
+        "start": -0.5,
+        "end": 7.5,
+        "size": 2
+      },
+      "y": [
+        2,
+        1,
+        3,
+        5,
+        4,
+        6
+      ],
+      "ysrc": "jagged ints",
+      "error_x": {
+        "visible": true,
+        "symmetric": true
+      },
+      "error_y": {
+        "visible": true,
+        "symmetric": false
+      },
+      "orientation": "v",
+      "autobiny": true,
+      "ybins": {
+        "start": -0.5,
+        "end": 7.5,
+        "size": 2
+      }
+    }
+  ],
+  "layout": {
+    "plot_bgcolor": "rgb(255, 0, 0)",
+    "xaxis": {
+      "range": [
+        0,
+        2.3157894736842106
+      ],
+      "autorange": true,
+      "type": "linear"
+    },
+    "yaxis": {
+      "range": [
+        -0.5,
+        7.552631578947369
+      ],
+      "autorange": true,
+      "type": "linear"
+    },
+    "autosize": true
+  },
+  "frames": []
+}

dev/percy/histogram2d.json

@@ -18,7 +18,7 @@
       "ysrc": "ints",
       "autobinx": false,
       "xbins": {
-        "start": -0.5,
+        "start": 0.5,
         "end": 9.5,
         "size": 5,
         "_dataSpan": 5
@@ -27,15 +27,15 @@
       "ybins": {
         "start": -0.5,
         "end": 9.5,
-        "size": 5,
+        "size": 10,
         "_dataSpan": 5
       },
+      "zmin": 2,
+      "zmax": 4,
+      "zauto": true,
       "cumulative": {
         "enabled": true
-      },
-      "zmin": 0,
-      "zmax": 4,
-      "zauto": false
+      }
     }
   ],
   "layout": {

dev/percy/index.js

@@ -1,4 +1,5 @@
 import panelTest from './panelTest.json';
+import histogram from './histogram.json';
 import histogram2d from './histogram2d.json';
 
-export {panelTest, histogram2d};
+export {panelTest, histogram, histogram2d};

dev/percy/panelTest.json

@@ -126,7 +126,7 @@
       }
     ],
     "xaxis": {
-      "type": "linear",
+      "type": "date",
       "range": [
         0.6919103739269605,
         6.3080896260730395
@@ -147,6 +147,19 @@
           6.3080896260730395
         ]
       },
+      "rangeselector": {
+        "visible": true,
+        "buttons": [
+          {
+            "label": "b1",
+            "step": "year"
+          },
+          {
+            "label": "b2",
+            "step": "month"
+          }
+        ]
+      },
       "showspikes": true
     },
     "yaxis": {

src/__percy__/panels.percy.js

@@ -15,6 +15,7 @@ import './percy.css';
  * To specify which panels to test with the mock, add entry to panelsToTest, else all panels will be tested
  */
 const panelsToTest = {
+  histogram: ['GraphCreatePanel'],
   histogram2d: ['GraphCreatePanel', 'StyleTracesPanel'],
 };
 

src/components/fields/derived.js

@@ -183,29 +183,20 @@ export const BinningDropdown = connectToContainer(UnconnectedDropdown, {
 export const HistogramInfoVertical = connectToContainer(Info, {
   modifyPlotProps: (props, context, plotProps) => {
     plotProps.isVisible =
-      context.container.type === 'histogram' &&
-      context.container.orientation === 'v';
+      context.fullContainer.type === 'histogram' &&
+      context.fullContainer.orientation === 'v';
     return plotProps;
   },
 });
 export const HistogramInfoHorizontal = connectToContainer(Info, {
   modifyPlotProps: (props, context, plotProps) => {
     plotProps.isVisible =
-      context.container.type === 'histogram' &&
-      context.container.orientation === 'h';
+      context.fullContainer.type === 'histogram' &&
+      context.fullContainer.orientation === 'h';
     return plotProps;
   },
 });
 
-export const ColorscaleNumeric = connectToContainer(UnconnectedNumeric, {
-  modifyPlotProps: (props, context, plotProps) => {
-    const {fullContainer} = plotProps;
-    if (plotProps.isVisible && fullContainer && fullContainer.zauto) {
-      plotProps.isVisible = false;
-    }
-  },
-});
-
 export const AxesRange = connectToContainer(UnconnectedAxisRangeValue, {
   modifyPlotProps: (props, context, plotProps) => {
     const {fullContainer} = plotProps;

src/default_panels/GraphCreatePanel.js

@@ -66,12 +66,12 @@ const GraphCreatePanel = (props, {localize: _}) => {
         />
         <HistogramInfoVertical>
           {_(
-            'Note: in vertical orientation X values are used for bins and Y values for weights.'
+            'Note: in vertical orientation, X values are used for bins and Y values for weights.'
           )}
         </HistogramInfoVertical>
         <HistogramInfoHorizontal>
           {_(
-            'Note: in horizontal orientation Y Values are used for bins and X values for weights.'
+            'Note: in horizontal orientation, Y Values are used for bins and X values for weights.'
           )}
         </HistogramInfoHorizontal>
         <DataSelector label={_('I (Optional)')} attr="i" />

src/default_panels/StyleTracesPanel.js

@@ -25,11 +25,7 @@ import {
   FontSelector,
   TextPosition,
 } from '../components';
-import {
-  BinningNumeric,
-  ColorscaleNumeric,
-  BinningDropdown,
-} from '../components/fields/derived';
+import {BinningNumeric, BinningDropdown} from '../components/fields/derived';
 
 const StyleTracesPanel = (props, {localize: _}) => (
   <TraceAccordion canGroup>
@@ -289,8 +285,8 @@ const StyleTracesPanel = (props, {localize: _}) => (
           {label: _('Custom'), value: false},
         ]}
       />
-      <ColorscaleNumeric label={_('Min')} attr="zmin" />
-      <ColorscaleNumeric label={_('Max')} attr="zmax" />
+      <Numeric label={_('Min')} attr="zmin" />
+      <Numeric label={_('Max')} attr="zmax" />
       <Radio
         label={_('Color Bar')}
         attr="showscale"

src/styles/components/containers/_fold.scss

@@ -160,6 +160,10 @@
   }
 }
 
-.fold + .fold {
-  margin-top: var(--spacing-half-unit);
+.fold {
+  margin-bottom: var(--spacing-half-unit);
+}
+
+.fold .fold:last-child {
+  margin-bottom: 0;
 }

src/styles/main.scss

@@ -33,10 +33,6 @@
   }
 }
 
-.editor_controls__wrapper > .panel > .panel__content > .fold:last-child {
-  margin-bottom: var(--spacing-half-unit);
-}
-
 .plotly_editor {
   display: flex;
   /*