@vx/legend - npm Package Compare versions

Comparing version 0.0.136 to 0.0.139

build/legends/Legend.js

@@ -6,2 +6,5 @@ 'use strict';
 });
+
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
 exports.default = Legend;
@@ -39,4 +42,2 @@
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
@@ -61,5 +62,10 @@
 
+var defaultStyle = {
+  display: 'flex'
+};
+
 function Legend(_ref) {
   var className = _ref.className,
-      style = _ref.style,
+      _ref$style = _ref.style,
+      style = _ref$style === undefined ? defaultStyle : _ref$style,
       shapeStyle = _ref.shapeStyle,
@@ -99,9 +105,8 @@ scale = _ref.scale,
     'div',
-    _defineProperty({
+    {
       className: (0, _classnames2.default)('vx-legend', className),
-      style: style
-    }, 'style', {
-      display: 'flex',
-      flexDirection: direction
-    }),
+      style: _extends({}, style, {
+        flexDirection: direction
+      })
+    },
     labels.map(function (label, i) {
@@ -108,0 +113,0 @@ var text = label.text;

package.json

 {
   "name": "@vx/legend",
-  "version": "0.0.136",
+  "version": "0.0.139",
   "description": "vx legend",
@@ -32,7 +32,7 @@ "main": "build/index.js",
     "jest": "^20.0.3",
+    "react": "^15.0.0 || 15.x",
     "react-addons-test-utils": "^15.5.1",
     "react-fatigue-dev": "github:tj/react-fatigue-dev",
     "react-tools": "^0.10.0",
-    "regenerator-runtime": "^0.10.5",
-    "react": "^15.0.0 || 15.x"
+    "regenerator-runtime": "^0.10.5"
   },
@@ -39,0 +39,0 @@ "peerDependencies": {

src/legends/Legend.js

@@ -33,5 +33,9 @@ import React from 'react';
 
+const defaultStyle = {
+  display: 'flex',
+};
+
 export default function Legend({
   className,
-  style,
+  style = defaultStyle,
   shapeStyle,
@@ -60,5 +64,4 @@ scale,
       className={cx('vx-legend', className)}
-      style={style}
       style={{
-        display: 'flex',
+        ...style,
         flexDirection: direction,
@@ -65,0 +68,0 @@ }}

test/Legend.test.js

@@ -0,7 +1,45 @@
+import React from 'react';
+import { shallow } from 'enzyme';
 import { Legend } from '../src';
+import { scaleLinear } from '../../vx-scale';
 
+const defaultProps = {
+  scale: scaleLinear({
+    rangeRound: [10, 0],
+    domain: [0, 10],
+  }),
+};
+
 describe('<Legend />', () => {
   test('it should be defined', () => {
     expect(Legend).toBeDefined();
-  })
-})
+  });
+
+  test('it should default style to display: flex, flex-direction: column ', () => {
+    const wrapper = shallow(<Legend {...defaultProps} />);
+    expect(wrapper.prop('style')).toEqual({
+      display: 'flex',
+      flexDirection: 'column',
+    });
+  });
+
+  test('it should extend style prop', () => {
+    const wrapper = shallow(
+      <Legend {...defaultProps} style={{ display: 'block' }} />,
+    );
+    expect(wrapper.prop('style')).toEqual({
+      display: 'block',
+      flexDirection: 'column',
+    });
+  });
+
+  test('it should pass through direction prop to style prop', () => {
+    const wrapper = shallow(
+      <Legend {...defaultProps} direction="row" />,
+    );
+    expect(wrapper.prop('style')).toEqual({
+      display: 'flex',
+      flexDirection: 'row',
+    });
+  });
+});

No alert changes

Improved metrics

Total package byte prevSize

51917

increased by2.3%

Lines of code

1430

increased by2.88%

No dependency changes