@devexpress/dx-react-chart-bootstrap4 - npm Package Compare versions

Comparing version 1.11.0-alpha.1 to 1.11.0-beta.1

dist/dx-react-chart-bootstrap4.d.ts

@@ -457,3 +457,8 @@ import * as React from 'react';
 /** The `Tooltip` plugin implements a tooltip that shows information about a point. The tooltip appears when a user hovers the mouse pointer over a series point. */
-export declare const Tooltip: React.ComponentType<TooltipProps>;
+export declare const Tooltip: React.ComponentType<TooltipProps> & {
+  /** A component that renders the tooltip. */
+  Overlay: React.ComponentType<TooltipBase.OverlayProps & { className?: string; style?: React.CSSProperties; [x: string]: any }>;
+  /** A component that renders the tooltip's content. */
+  Content: React.ComponentType<TooltipBase.ContentProps & { className?: string; style?: React.CSSProperties; [x: string]: any }>;
+};
 
@@ -460,0 +465,0 @@ // -------------------------------------------------------------------------------------------------

dist/dx-react-chart-bootstrap4.es.js

 /**
  * Bundle of @devexpress/dx-react-chart-bootstrap4
- * Generated: 2019-03-13
- * Version: 1.11.0-alpha.1
+ * Generated: 2019-04-24
+ * Version: 1.11.0-beta.1
  * License: https://js.devexpress.com/Licensing
@@ -9,5 +9,5 @@ */
 import { createElement, createRef, PureComponent } from 'react';
-import { node, string, bool, oneOfType, instanceOf, object, func, any, shape, number } from 'prop-types';
+import { node, bool, string, oneOfType, instanceOf, object, func, any, shape, number } from 'prop-types';
 import { withComponents } from '@devexpress/dx-react-core';
-import { withPatchedProps, Chart as Chart$1, Palette, Legend as Legend$1, Title as Title$1, ScatterSeries as ScatterSeries$1, Axis, ValueAxis as ValueAxis$1, ArgumentAxis as ArgumentAxis$1, Tooltip as Tooltip$1 } from '@devexpress/dx-react-chart';
+import { withPatchedProps, Chart as Chart$1, Palette, Legend as Legend$1, Title as Title$1, ScatterSeries as ScatterSeries$1, Axis, ValueAxis as ValueAxis$1, ArgumentAxis as ArgumentAxis$1, Tooltip as Tooltip$1, ZoomAndPan as ZoomAndPan$1 } from '@devexpress/dx-react-chart';
 export { AreaSeries, BarSeries, LineSeries, PieSeries, SplineSeries } from '@devexpress/dx-react-chart';
@@ -306,3 +306,7 @@ import classNames from 'classnames';
 
-    _this = _possibleConstructorReturn(this, _getPrototypeOf(Popover).call(this, props));
+    _this = _possibleConstructorReturn(this, _getPrototypeOf(Popover).call(this, props)); // These two fields should be created only if `isOpen && toggle` condition is true
+    // and destroyed when condition turns false.
+    // But it would require usage of `this.state` and other code complications.
+    // So let's not change it for now. Maybe a better solution would be found.
+
     _this.contentRef = createRef();
@@ -316,3 +320,9 @@ _this.handleClick = _this.handleClick.bind(_assertThisInitialized(_this));
     value: function componentDidMount() {
-      this.toggleSubscribtions();
+      var _this$props = this.props,
+          isOpen = _this$props.isOpen,
+          toggle = _this$props.toggle;
+
+      if (isOpen && toggle) {
+        this.attachDocumentEvents();
+      }
     }
@@ -322,3 +332,11 @@ }, {
     value: function componentDidUpdate() {
-      this.toggleSubscribtions();
+      var _this$props2 = this.props,
+          isOpen = _this$props2.isOpen,
+          toggle = _this$props2.toggle;
+
+      if (isOpen && toggle) {
+        this.attachDocumentEvents();
+      } else {
+        this.detachDocumentEvents();
+      }
     }
@@ -335,5 +353,5 @@ }, {
       var contentNode = this.contentRef.current;
-      var _this$props = this.props,
-          toggle = _this$props.toggle,
-          target = _this$props.target;
+      var _this$props3 = this.props,
+          toggle = _this$props3.toggle,
+          target = _this$props3.target;
 
@@ -345,16 +363,8 @@ if (contentNode && !contentNode.contains(eventTarget) && !target.contains(eventTarget)) {
   }, {
-    key: "toggleSubscribtions",
-    value: function toggleSubscribtions() {
-      var isOpen = this.props.isOpen;
-
-      if (isOpen) {
-        this.attachDocumentEvents();
-      } else {
-        this.detachDocumentEvents();
-      }
-    }
-  }, {
     key: "attachDocumentEvents",
     value: function attachDocumentEvents() {
-      this.toggleDocumentEvents('addEventListener');
+      if (!this.listenersAttached) {
+        this.toggleDocumentEvents('addEventListener');
+        this.listenersAttached = true;
+      }
     }
@@ -364,3 +374,6 @@ }, {
     value: function detachDocumentEvents() {
-      this.toggleDocumentEvents('removeEventListener');
+      if (this.listenersAttached) {
+        this.toggleDocumentEvents('removeEventListener');
+        this.listenersAttached = false;
+      }
     }
@@ -381,7 +394,7 @@ }, {
 
-      var _this$props2 = this.props,
-          children = _this$props2.children,
-          target = _this$props2.target,
-          container = _this$props2.container,
-          restProps = _objectWithoutProperties(_this$props2, ["children", "target", "container"]);
+      var _this$props4 = this.props,
+          children = _this$props4.children,
+          target = _this$props4.target,
+          renderInBody = _this$props4.renderInBody,
+          restProps = _objectWithoutProperties(_this$props4, ["children", "target", "renderInBody"]);
 
@@ -412,7 +425,7 @@ return createElement(Popper, _extends({
     value: function render() {
-      var _this$props3 = this.props,
-          isOpen = _this$props3.isOpen,
-          container = _this$props3.container;
+      var _this$props5 = this.props,
+          isOpen = _this$props5.isOpen,
+          renderInBody = _this$props5.renderInBody;
       if (!isOpen) return null;
-      return container === 'body' ? createPortal(this.renderPopper(), document.body) : this.renderPopper();
+      return renderInBody ? createPortal(this.renderPopper(), document.body) : this.renderPopper();
     }
@@ -424,3 +437,3 @@ }]);
 process.env.NODE_ENV !== "production" ? Popover.propTypes = {
-  container: string,
+  renderInBody: bool,
   placement: string,
@@ -434,6 +447,6 @@ isOpen: bool,
   target: null,
-  container: 'body',
+  renderInBody: true,
   isOpen: false,
   placement: 'auto',
-  toggle: function toggle() {}
+  toggle: undefined
 };
@@ -506,3 +519,9 @@
 
-export { Chart, Legend, Title, ScatterSeries, ValueAxis, ArgumentAxis, Tooltip };
+var DragBox = withClassName('bg-secondary', 'dx-c-bs4-rect-opacity')(ZoomAndPan$1.DragBox);
+
+var ZoomAndPan = withComponents({
+  DragBox: DragBox
+})(ZoomAndPan$1);
+
+export { Chart, Legend, Title, ScatterSeries, ValueAxis, ArgumentAxis, Tooltip, ZoomAndPan };
 //# sourceMappingURL=dx-react-chart-bootstrap4.es.js.map

dist/dx-react-chart-bootstrap4.umd.js

 /**
  * Bundle of @devexpress/dx-react-chart-bootstrap4
- * Generated: 2019-03-13
- * Version: 1.11.0-alpha.1
+ * Generated: 2019-04-24
+ * Version: 1.11.0-beta.1
  * License: https://js.devexpress.com/Licensing
@@ -306,3 +306,7 @@ */
 
-      _this = _possibleConstructorReturn(this, _getPrototypeOf(Popover).call(this, props));
+      _this = _possibleConstructorReturn(this, _getPrototypeOf(Popover).call(this, props)); // These two fields should be created only if `isOpen && toggle` condition is true
+      // and destroyed when condition turns false.
+      // But it would require usage of `this.state` and other code complications.
+      // So let's not change it for now. Maybe a better solution would be found.
+
       _this.contentRef = React.createRef();
@@ -316,3 +320,9 @@ _this.handleClick = _this.handleClick.bind(_assertThisInitialized(_this));
       value: function componentDidMount() {
-        this.toggleSubscribtions();
+        var _this$props = this.props,
+            isOpen = _this$props.isOpen,
+            toggle = _this$props.toggle;
+
+        if (isOpen && toggle) {
+          this.attachDocumentEvents();
+        }
       }
@@ -322,3 +332,11 @@ }, {
       value: function componentDidUpdate() {
-        this.toggleSubscribtions();
+        var _this$props2 = this.props,
+            isOpen = _this$props2.isOpen,
+            toggle = _this$props2.toggle;
+
+        if (isOpen && toggle) {
+          this.attachDocumentEvents();
+        } else {
+          this.detachDocumentEvents();
+        }
       }
@@ -335,5 +353,5 @@ }, {
         var contentNode = this.contentRef.current;
-        var _this$props = this.props,
-            toggle = _this$props.toggle,
-            target = _this$props.target;
+        var _this$props3 = this.props,
+            toggle = _this$props3.toggle,
+            target = _this$props3.target;
 
@@ -345,16 +363,8 @@ if (contentNode && !contentNode.contains(eventTarget) && !target.contains(eventTarget)) {
     }, {
-      key: "toggleSubscribtions",
-      value: function toggleSubscribtions() {
-        var isOpen = this.props.isOpen;
-
-        if (isOpen) {
-          this.attachDocumentEvents();
-        } else {
-          this.detachDocumentEvents();
-        }
-      }
-    }, {
       key: "attachDocumentEvents",
       value: function attachDocumentEvents() {
-        this.toggleDocumentEvents('addEventListener');
+        if (!this.listenersAttached) {
+          this.toggleDocumentEvents('addEventListener');
+          this.listenersAttached = true;
+        }
       }
@@ -364,3 +374,6 @@ }, {
       value: function detachDocumentEvents() {
-        this.toggleDocumentEvents('removeEventListener');
+        if (this.listenersAttached) {
+          this.toggleDocumentEvents('removeEventListener');
+          this.listenersAttached = false;
+        }
       }
@@ -381,7 +394,7 @@ }, {
 
-        var _this$props2 = this.props,
-            children = _this$props2.children,
-            target = _this$props2.target,
-            container = _this$props2.container,
-            restProps = _objectWithoutProperties(_this$props2, ["children", "target", "container"]);
+        var _this$props4 = this.props,
+            children = _this$props4.children,
+            target = _this$props4.target,
+            renderInBody = _this$props4.renderInBody,
+            restProps = _objectWithoutProperties(_this$props4, ["children", "target", "renderInBody"]);
 
@@ -412,7 +425,7 @@ return React.createElement(reactPopper.Popper, _extends({
       value: function render() {
-        var _this$props3 = this.props,
-            isOpen = _this$props3.isOpen,
-            container = _this$props3.container;
+        var _this$props5 = this.props,
+            isOpen = _this$props5.isOpen,
+            renderInBody = _this$props5.renderInBody;
         if (!isOpen) return null;
-        return container === 'body' ? ReactDOM.createPortal(this.renderPopper(), document.body) : this.renderPopper();
+        return renderInBody ? ReactDOM.createPortal(this.renderPopper(), document.body) : this.renderPopper();
       }
@@ -424,3 +437,3 @@ }]);
   process.env.NODE_ENV !== "production" ? Popover.propTypes = {
-    container: PropTypes.string,
+    renderInBody: PropTypes.bool,
     placement: PropTypes.string,
@@ -434,6 +447,6 @@ isOpen: PropTypes.bool,
     target: null,
-    container: 'body',
+    renderInBody: true,
     isOpen: false,
     placement: 'auto',
-    toggle: function toggle() {}
+    toggle: undefined
   };
@@ -506,2 +519,8 @@
 
+  var DragBox = withClassName('bg-secondary', 'dx-c-bs4-rect-opacity')(dxReactChart.ZoomAndPan.DragBox);
+
+  var ZoomAndPan = dxReactCore.withComponents({
+    DragBox: DragBox
+  })(dxReactChart.ZoomAndPan);
+
   exports.AreaSeries = dxReactChart.AreaSeries;
@@ -519,2 +538,3 @@ exports.BarSeries = dxReactChart.BarSeries;
   exports.Tooltip = Tooltip;
+  exports.ZoomAndPan = ZoomAndPan;
 
@@ -521,0 +541,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

package.json

 {
   "name": "@devexpress/dx-react-chart-bootstrap4",
-  "version": "1.11.0-alpha.1",
+  "version": "1.11.0-beta.1",
   "description": "Bootstrap 4 templates for DevExtreme React Chart component",
@@ -46,3 +46,3 @@ "author": {
     "lint": "eslint \"src/**\"",
-    "lint:fix": "yarn run lint -- --fix"
+    "lint:fix": "yarn lint -- --fix"
   },
@@ -54,6 +54,6 @@ "devDependencies": {
     "@babel/preset-react": "^7.0.0",
-    "@devexpress/dx-chart-core": "1.11.0-alpha.1",
-    "@devexpress/dx-react-chart": "1.11.0-alpha.1",
-    "@devexpress/dx-react-core": "1.11.0-alpha.1",
-    "@devexpress/dx-testing": "1.11.0-alpha.1",
+    "@devexpress/dx-chart-core": "1.11.0-beta.1",
+    "@devexpress/dx-react-chart": "1.11.0-beta.1",
+    "@devexpress/dx-react-core": "1.11.0-beta.1",
+    "@devexpress/dx-testing": "1.11.0-beta.1",
     "babel-core": "^7.0.0-bridge.0",
@@ -79,5 +79,5 @@ "babel-jest": "^24.1.0",
     "rollup-plugin-babel": "^4.3.2",
-    "rollup-plugin-css-only": "^1.0.0",
     "rollup-plugin-license": "^0.8.1",
-    "rollup-plugin-node-resolve": "^4.0.1"
+    "rollup-plugin-node-resolve": "^4.0.1",
+    "rollup-plugin-sass": "^1.2.2"
   },
@@ -90,8 +90,8 @@ "dependencies": {
   "peerDependencies": {
-    "@devexpress/dx-chart-core": "1.11.0-alpha.1",
-    "@devexpress/dx-react-chart": "1.11.0-alpha.1",
-    "@devexpress/dx-react-core": "1.11.0-alpha.1",
+    "@devexpress/dx-chart-core": "1.11.0-beta.1",
+    "@devexpress/dx-react-chart": "1.11.0-beta.1",
+    "@devexpress/dx-react-core": "1.11.0-beta.1",
     "react": ">=16.8.3"
   },
-  "gitHead": "04937befc4fe9c5e329039533983c956deb78390"
+  "gitHead": "972b9b88a1e51db0c0c8c30a009407b2d35a7a4f"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

106052

increased by5.01%

Lines of code

1340

increased by2.92%

No dependency changes