Merge pull request #974 from plotly/updatemenus-type

Add button type to updatemenus

Author: rreusser

src/components/updatemenus/attributes.js

@@ -57,6 +57,30 @@ module.exports = {
         ].join(' ')
     },
 
+    type: {
+        valType: 'enumerated',
+        values: ['dropdown', 'buttons'],
+        dflt: 'dropdown',
+        role: 'info',
+        description: [
+            'Determines whether the buttons are accessible via a dropdown menu',
+            'or whether the buttons are stacked horizontally or vertically'
+        ].join(' ')
+    },
+
+    direction: {
+        valType: 'enumerated',
+        values: ['left', 'right', 'up', 'down'],
+        dflt: 'down',
+        role: 'info',
+        description: [
+            'Determines the direction in which the buttons are laid out, whether',
+            'in a dropdown menu or a row/column of buttons. For `left` and `up`,',
+            'the buttons will still appear in left-to-right or top-to-bottom order',
+            'respectively.'
+        ].join(' ')
+    },
+
     active: {
         valType: 'integer',
         role: 'info',
@@ -68,6 +92,13 @@ module.exports = {
         ].join(' ')
     },
 
+    showactive: {
+        valType: 'boolean',
+        role: 'info',
+        dflt: true,
+        description: 'Highlights active dropdown item or active button if true.'
+    },
+
     buttons: buttonsAttrs,
 
     x: {

src/components/updatemenus/constants.js

@@ -21,7 +21,8 @@ module.exports = {
     headerGroupClassName: 'updatemenu-header-group',
     headerClassName: 'updatemenu-header',
     headerArrowClassName: 'updatemenu-header-arrow',
-    buttonGroupClassName: 'updatemenu-button-group',
+    dropdownButtonGroupClassName: 'updatemenu-dropdown-button-group',
+    dropdownButtonClassName: 'updatemenu-dropdown-button',
     buttonClassName: 'updatemenu-button',
     itemRectClassName: 'updatemenu-item-rect',
     itemTextClassName: 'updatemenu-item-text',
@@ -41,7 +42,8 @@ module.exports = {
     minHeight: 30,
 
     // padding around item text
-    textPadX: 40,
+    textPadX: 24,
+    arrowPadX: 16,
 
     // font size to height scale
     fontSizeToHeight: 1.3,

src/components/updatemenus/defaults.js

@@ -49,6 +49,9 @@ function menuDefaults(menuIn, menuOut, layoutOut) {
     if(!visible) return;
 
     coerce('active');
+    coerce('direction');
+    coerce('type');
+    coerce('showactive');
 
     coerce('x');
     coerce('y');