@pie-lib/graphing 2.4.3-next.350 → 2.4.3-next.406

package/lib/graph.js

@@ -1,12 +1,32 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.removeBuildingToolIfCurrentToolDiffers = exports.graphPropTypes = exports["default"] = exports.Graph = void 0;
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -33,53 +53,21 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _extends() { _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; }; return _extends.apply(this, arguments); }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
-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; }
-
 var log = (0, _debug["default"])('pie-lib:graphing:graph');
 var graphPropTypes = {
   axesSettings: _propTypes["default"].shape(_axis.AxisPropTypes),
   backgroundMarks: _propTypes["default"].array,
   className: _propTypes["default"].string,
+  collapsibleToolbar: _propTypes["default"].bool,
+  collapsibleToolbarTitle: _propTypes["default"].string,
   domain: _plot.types.DomainType,
   labels: _propTypes["default"].shape(_labels.LabelType),
   labelModeEnabled: _propTypes["default"].bool,
@@ -129,30 +117,27 @@ var removeBuildingToolIfCurrentToolDiffers = function removeBuildingToolIfCurren
 exports.removeBuildingToolIfCurrentToolDiffers = removeBuildingToolIfCurrentToolDiffers;
 
 var Graph = /*#__PURE__*/function (_React$Component) {
-  _inherits(Graph, _React$Component);
+  (0, _inherits2["default"])(Graph, _React$Component);
 
   var _super = _createSuper(Graph);
 
   function Graph() {
     var _this;
 
-    _classCallCheck(this, Graph);
+    (0, _classCallCheck2["default"])(this, Graph);
 
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
 
     _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "state", {});
-
-    _defineProperty(_assertThisInitialized(_this), "componentDidMount", function () {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {});
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "componentDidMount", function () {
       return _this.setState({
         labelNode: _this.labelNode
       });
     });
-
-    _defineProperty(_assertThisInitialized(_this), "changeMark", function (oldMark, newMark) {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeMark", function (oldMark, newMark) {
       var _this$props = _this.props,
           onChangeMarks = _this$props.onChangeMarks,
           marks = _this$props.marks;
@@ -166,8 +151,7 @@ var Graph = /*#__PURE__*/function (_React$Component) {
         onChangeMarks(newMarks);
       }
     });
-
-    _defineProperty(_assertThisInitialized(_this), "completeMark", function (markData) {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "completeMark", function (markData) {
       var _this$props2 = _this.props,
           currentTool = _this$props2.currentTool,
           marks = _this$props2.marks;
@@ -179,8 +163,7 @@ var Graph = /*#__PURE__*/function (_React$Component) {
 
       _this.updateMarks(buildingMark, updatedMark);
     });
-
-    _defineProperty(_assertThisInitialized(_this), "updateMarks", function (existing, update) {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "updateMarks", function (existing, update) {
       var addIfMissing = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
       var _this$props3 = _this.props,
           onChangeMarks = _this$props3.onChangeMarks,
@@ -199,19 +182,17 @@ var Graph = /*#__PURE__*/function (_React$Component) {
         newMarks.splice(index, 1, update);
         onChangeMarks(newMarks);
       } else if (addIfMissing) {
-        onChangeMarks([].concat(_toConsumableArray(newMarks), [update]));
+        onChangeMarks([].concat((0, _toConsumableArray2["default"])(newMarks), [update]));
       }
     });
-
-    _defineProperty(_assertThisInitialized(_this), "getComponent", function (mark) {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getComponent", function (mark) {
       if (!mark) return null;
       var tool = (_this.props.tools || []).find(function (t) {
         return t.type === mark.type;
       });
       return tool && tool.Component || null;
     });
-
-    _defineProperty(_assertThisInitialized(_this), "onBgClick", function (point) {
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onBgClick", function (point) {
       var x = point.x,
           y = point.y;
       var _this$props4 = _this.props,
@@ -243,11 +224,10 @@ var Graph = /*#__PURE__*/function (_React$Component) {
 
       _this.updateMarks(buildingMark, updatedMark, true);
     });
-
     return _this;
   }
 
-  _createClass(Graph, [{
+  (0, _createClass2["default"])(Graph, [{
     key: "render",
     value: function render() {
       var _this2 = this;
@@ -276,20 +256,20 @@ var Graph = /*#__PURE__*/function (_React$Component) {
         marks: marks || [],
         currentTool: currentTool
       });
-      return /*#__PURE__*/_react["default"].createElement(_plot.Root, _extends({
+      return /*#__PURE__*/_react["default"].createElement(_plot.Root, (0, _extends2["default"])({
         rootRef: function rootRef(r) {
           return _this2.rootNode = r;
         },
         title: title
-      }, common), /*#__PURE__*/_react["default"].createElement(_labels["default"], _extends({
+      }, common), /*#__PURE__*/_react["default"].createElement(_labels["default"], (0, _extends2["default"])({
         value: labels
       }, common)), /*#__PURE__*/_react["default"].createElement("g", {
         transform: "translate(".concat(domain.padding, ", ").concat(range.padding, ")")
-      }, /*#__PURE__*/_react["default"].createElement(_grid["default"], common), /*#__PURE__*/_react["default"].createElement(_axis.Axes, _extends({}, axesSettings, common)), /*#__PURE__*/_react["default"].createElement(_bg["default"], _extends({}, size, {
+      }, /*#__PURE__*/_react["default"].createElement(_grid["default"], common), /*#__PURE__*/_react["default"].createElement(_axis.Axes, (0, _extends2["default"])({}, axesSettings, common)), /*#__PURE__*/_react["default"].createElement(_bg["default"], (0, _extends2["default"])({}, size, {
         onClick: this.onBgClick
       }, common)), /*#__PURE__*/_react["default"].createElement("mask", {
         id: "myMask"
-      }, /*#__PURE__*/_react["default"].createElement("rect", _extends({}, maskSize, {
+      }, /*#__PURE__*/_react["default"].createElement("rect", (0, _extends2["default"])({}, maskSize, {
         fill: "white"
       })), " "), /*#__PURE__*/_react["default"].createElement("g", {
         id: "marks",
@@ -298,7 +278,7 @@ var Graph = /*#__PURE__*/function (_React$Component) {
         var Component = _this2.getComponent(m);
 
         var markType = m.type;
-        return /*#__PURE__*/_react["default"].createElement(Component, _extends({
+        return /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
           key: "".concat(markType, "-").concat(index, "-bg"),
           mark: _objectSpread(_objectSpread({}, m), {}, {
             disabled: true,
@@ -310,7 +290,7 @@ var Graph = /*#__PURE__*/function (_React$Component) {
         var Component = _this2.getComponent(m);
 
         var markType = m.type;
-        return /*#__PURE__*/_react["default"].createElement(Component, _extends({
+        return /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
           key: "".concat(markType, "-").concat(index),
           mark: m,
           coordinatesOnHover: coordinatesOnHover,
@@ -322,7 +302,7 @@ var Graph = /*#__PURE__*/function (_React$Component) {
           labelNode: _this2.state.labelNode,
           isToolActive: currentTool && markType === currentTool.type
         }, common));
-      }), /*#__PURE__*/_react["default"].createElement("foreignObject", _extends({
+      }), /*#__PURE__*/_react["default"].createElement("foreignObject", (0, _extends2["default"])({
         ref: function ref(labelNode) {
           return _this2.labelNode = labelNode;
         },
@@ -335,20 +315,16 @@ var Graph = /*#__PURE__*/function (_React$Component) {
       })))));
     }
   }]);
-
   return Graph;
 }(_react["default"].Component);
 
 exports.Graph = Graph;
-
-_defineProperty(Graph, "propTypes", _objectSpread(_objectSpread({}, graphPropTypes), {}, {
+(0, _defineProperty2["default"])(Graph, "propTypes", _objectSpread(_objectSpread({}, graphPropTypes), {}, {
   currentTool: _propTypes["default"].object
 }));
-
-_defineProperty(Graph, "defaultProps", {
+(0, _defineProperty2["default"])(Graph, "defaultProps", {
   onChangeMarks: function onChangeMarks() {}
 });
-
 var _default = Graph;
 exports["default"] = _default;
 //# sourceMappingURL=graph.js.map

package/lib/graph.js.map

@@ -1 +1 @@
-{"version":3,"file":"graph.js","names":["log","debug","graphPropTypes","axesSettings","PropTypes","shape","AxisPropTypes","backgroundMarks","array","className","string","domain","types","DomainType","labels","LabelType","labelModeEnabled","bool","coordinatesOnHover","marks","onChangeMarks","func","range","size","width","number","isRequired","height","title","tools","getMaskSize","x","y","removeBuildingToolIfCurrentToolDiffers","currentTool","buildingMark","filter","m","building","newMarks","cloneDeep","type","index","findIndex","isEqual","splice","Graph","setState","labelNode","oldMark","newMark","props","isDuplicatedMark","markData","updatedMark","complete","updateMarks","existing","update","addIfMissing","mark","tool","find","t","Component","point","addPoint","undefined","graphProps","createGraphProps","rootNode","maskSize","common","r","padding","onBgClick","map","getComponent","markType","disabled","isBackground","state","changeMark","completeMark","startDrag","stopDrag","pointerEvents","React","object"],"sources":["../src/graph.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport isEqual from 'lodash/isEqual';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { Root, types, createGraphProps } from '@pie-lib/plot';\nimport debug from 'debug';\n\nimport Labels from './labels';\nimport { Axes, AxisPropTypes } from './axis';\nimport Grid from './grid';\nimport { LabelType } from './labels';\nimport Bg from './bg';\nimport { isDuplicatedMark } from './utils';\n\nconst log = debug('pie-lib:graphing:graph');\n\nexport const graphPropTypes = {\n  axesSettings: PropTypes.shape(AxisPropTypes),\n  backgroundMarks: PropTypes.array,\n  className: PropTypes.string,\n  domain: types.DomainType,\n  labels: PropTypes.shape(LabelType),\n  labelModeEnabled: PropTypes.bool,\n  coordinatesOnHover: PropTypes.bool,\n  marks: PropTypes.array,\n  onChangeMarks: PropTypes.func,\n  range: types.DomainType,\n  size: PropTypes.shape({\n    width: PropTypes.number.isRequired,\n    height: PropTypes.number.isRequired\n  }),\n  title: PropTypes.string,\n  tools: PropTypes.array\n};\n\nconst getMaskSize = size => ({\n  x: -23,\n  y: -23,\n  width: size.width + 46,\n  height: size.height + 46\n});\n\nexport const removeBuildingToolIfCurrentToolDiffers = ({ marks, currentTool }) => {\n  const buildingMark = marks.filter(m => m.building)[0];\n  let newMarks = cloneDeep(marks);\n\n  if (buildingMark && currentTool && buildingMark.type !== currentTool.type) {\n    const index = newMarks.findIndex(m => isEqual(m, buildingMark));\n\n    if (index >= 0) {\n      newMarks.splice(index, 1);\n    }\n  }\n\n  return newMarks;\n};\n\nexport class Graph extends React.Component {\n  static propTypes = {\n    ...graphPropTypes,\n    currentTool: PropTypes.object\n  };\n\n  static defaultProps = {\n    onChangeMarks: () => {}\n  };\n\n  state = {};\n\n  componentDidMount = () => this.setState({ labelNode: this.labelNode });\n\n  changeMark = (oldMark, newMark) => {\n    const { onChangeMarks, marks } = this.props;\n    let newMarks = cloneDeep(marks);\n\n    const index = newMarks.findIndex(m => isEqual(m, oldMark));\n\n    if (index >= 0 && !isDuplicatedMark(newMark, marks, oldMark)) {\n      newMarks.splice(index, 1, newMark);\n\n      onChangeMarks(newMarks);\n    }\n  };\n\n  completeMark = markData => {\n    const { currentTool, marks } = this.props;\n    const buildingMark = marks.filter(m => m.building)[0];\n\n    if (!buildingMark || !currentTool) return;\n\n    const updatedMark = currentTool.complete(buildingMark, markData);\n\n    this.updateMarks(buildingMark, updatedMark);\n  };\n\n  updateMarks = (existing, update, addIfMissing = false) => {\n    const { onChangeMarks, marks } = this.props;\n    let newMarks = cloneDeep(marks);\n\n    if (!update.building && isDuplicatedMark(update, marks)) {\n      return;\n    }\n\n    const index = newMarks.findIndex(m => isEqual(m, existing));\n\n    if (index >= 0) {\n      newMarks.splice(index, 1, update);\n\n      onChangeMarks(newMarks);\n    } else if (addIfMissing) {\n      onChangeMarks([...newMarks, update]);\n    }\n  };\n\n  getComponent = mark => {\n    if (!mark) return null;\n\n    const tool = (this.props.tools || []).find(t => t.type === mark.type);\n\n    return (tool && tool.Component) || null;\n  };\n\n  onBgClick = point => {\n    const { x, y } = point;\n    const { labelModeEnabled, currentTool, marks } = this.props;\n\n    log('[onBgClick] x,y: ', x, y);\n\n    if (labelModeEnabled || !currentTool) {\n      return;\n    }\n\n    const buildingMark = marks.filter(m => m.building)[0];\n    let updatedMark;\n\n    // if the building mark has a different type, we just replace it\n    if (buildingMark && currentTool && buildingMark.type === currentTool.type) {\n      updatedMark = currentTool.addPoint({ x, y }, { ...buildingMark });\n    } else {\n      updatedMark = currentTool.addPoint({ x, y }, undefined);\n    }\n\n    this.updateMarks(buildingMark, updatedMark, true);\n  };\n\n  render() {\n    const {\n      axesSettings,\n      currentTool,\n      coordinatesOnHover,\n      size,\n      domain,\n      backgroundMarks,\n      range,\n      title,\n      labels,\n      labelModeEnabled\n    } = this.props;\n    let { marks } = this.props;\n\n    const graphProps = createGraphProps(domain, range, size, () => this.rootNode);\n    const maskSize = getMaskSize(size);\n    const common = { graphProps, labelModeEnabled };\n\n    marks = removeBuildingToolIfCurrentToolDiffers({ marks: marks || [], currentTool });\n\n    return (\n      <Root rootRef={r => (this.rootNode = r)} title={title} {...common}>\n        <Labels value={labels} {...common} />\n        <g transform={`translate(${domain.padding}, ${range.padding})`}>\n          <Grid {...common} />\n          <Axes {...axesSettings} {...common} />\n          <Bg {...size} onClick={this.onBgClick} {...common} />\n          <mask id=\"myMask\">\n            <rect {...maskSize} fill=\"white\" /> {/* TODO hardcoded color */}\n          </mask>\n\n          <g id=\"marks\" mask=\"url('#myMask')\">\n            {(backgroundMarks || []).map((m, index) => {\n              const Component = this.getComponent(m);\n              const markType = m.type;\n\n              return (\n                <Component\n                  key={`${markType}-${index}-bg`}\n                  mark={{ ...m, disabled: true, isBackground: true }}\n                  labelNode={this.state.labelNode}\n                  {...common}\n                />\n              );\n            })}\n\n            {marks.map((m, index) => {\n              const Component = this.getComponent(m);\n              const markType = m.type;\n\n              return (\n                <Component\n                  key={`${markType}-${index}`}\n                  mark={m}\n                  coordinatesOnHover={coordinatesOnHover}\n                  onChange={this.changeMark}\n                  onComplete={this.completeMark}\n                  onClick={this.onBgClick}\n                  onDragStart={this.startDrag}\n                  onDragStop={this.stopDrag}\n                  labelNode={this.state.labelNode}\n                  isToolActive={currentTool && markType === currentTool.type}\n                  {...common}\n                />\n              );\n            })}\n\n            <foreignObject\n              ref={labelNode => (this.labelNode = labelNode)}\n              x=\"0\"\n              y=\"0\"\n              {...size}\n              style={{ pointerEvents: 'none' }}\n            />\n          </g>\n        </g>\n      </Root>\n    );\n  }\n}\n\nexport default Graph;\n"],"mappings":"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"}
+{"version":3,"file":"graph.js","names":["log","debug","graphPropTypes","axesSettings","PropTypes","shape","AxisPropTypes","backgroundMarks","array","className","string","collapsibleToolbar","bool","collapsibleToolbarTitle","domain","types","DomainType","labels","LabelType","labelModeEnabled","coordinatesOnHover","marks","onChangeMarks","func","range","size","width","number","isRequired","height","title","tools","getMaskSize","x","y","removeBuildingToolIfCurrentToolDiffers","currentTool","buildingMark","filter","m","building","newMarks","cloneDeep","type","index","findIndex","isEqual","splice","Graph","setState","labelNode","oldMark","newMark","props","isDuplicatedMark","markData","updatedMark","complete","updateMarks","existing","update","addIfMissing","mark","tool","find","t","Component","point","addPoint","undefined","graphProps","createGraphProps","rootNode","maskSize","common","r","padding","onBgClick","map","getComponent","markType","disabled","isBackground","state","changeMark","completeMark","startDrag","stopDrag","pointerEvents","React","object"],"sources":["../src/graph.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport isEqual from 'lodash/isEqual';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { Root, types, createGraphProps } from '@pie-lib/plot';\nimport debug from 'debug';\n\nimport Labels from './labels';\nimport { Axes, AxisPropTypes } from './axis';\nimport Grid from './grid';\nimport { LabelType } from './labels';\nimport Bg from './bg';\nimport { isDuplicatedMark } from './utils';\n\nconst log = debug('pie-lib:graphing:graph');\n\nexport const graphPropTypes = {\n  axesSettings: PropTypes.shape(AxisPropTypes),\n  backgroundMarks: PropTypes.array,\n  className: PropTypes.string,\n  collapsibleToolbar: PropTypes.bool,\n  collapsibleToolbarTitle: PropTypes.string,\n  domain: types.DomainType,\n  labels: PropTypes.shape(LabelType),\n  labelModeEnabled: PropTypes.bool,\n  coordinatesOnHover: PropTypes.bool,\n  marks: PropTypes.array,\n  onChangeMarks: PropTypes.func,\n  range: types.DomainType,\n  size: PropTypes.shape({\n    width: PropTypes.number.isRequired,\n    height: PropTypes.number.isRequired\n  }),\n  title: PropTypes.string,\n  tools: PropTypes.array\n};\n\nconst getMaskSize = size => ({\n  x: -23,\n  y: -23,\n  width: size.width + 46,\n  height: size.height + 46\n});\n\nexport const removeBuildingToolIfCurrentToolDiffers = ({ marks, currentTool }) => {\n  const buildingMark = marks.filter(m => m.building)[0];\n  let newMarks = cloneDeep(marks);\n\n  if (buildingMark && currentTool && buildingMark.type !== currentTool.type) {\n    const index = newMarks.findIndex(m => isEqual(m, buildingMark));\n\n    if (index >= 0) {\n      newMarks.splice(index, 1);\n    }\n  }\n\n  return newMarks;\n};\n\nexport class Graph extends React.Component {\n  static propTypes = {\n    ...graphPropTypes,\n    currentTool: PropTypes.object\n  };\n\n  static defaultProps = {\n    onChangeMarks: () => {}\n  };\n\n  state = {};\n\n  componentDidMount = () => this.setState({ labelNode: this.labelNode });\n\n  changeMark = (oldMark, newMark) => {\n    const { onChangeMarks, marks } = this.props;\n    let newMarks = cloneDeep(marks);\n\n    const index = newMarks.findIndex(m => isEqual(m, oldMark));\n\n    if (index >= 0 && !isDuplicatedMark(newMark, marks, oldMark)) {\n      newMarks.splice(index, 1, newMark);\n\n      onChangeMarks(newMarks);\n    }\n  };\n\n  completeMark = markData => {\n    const { currentTool, marks } = this.props;\n    const buildingMark = marks.filter(m => m.building)[0];\n\n    if (!buildingMark || !currentTool) return;\n\n    const updatedMark = currentTool.complete(buildingMark, markData);\n\n    this.updateMarks(buildingMark, updatedMark);\n  };\n\n  updateMarks = (existing, update, addIfMissing = false) => {\n    const { onChangeMarks, marks } = this.props;\n    let newMarks = cloneDeep(marks);\n\n    if (!update.building && isDuplicatedMark(update, marks)) {\n      return;\n    }\n\n    const index = newMarks.findIndex(m => isEqual(m, existing));\n\n    if (index >= 0) {\n      newMarks.splice(index, 1, update);\n\n      onChangeMarks(newMarks);\n    } else if (addIfMissing) {\n      onChangeMarks([...newMarks, update]);\n    }\n  };\n\n  getComponent = mark => {\n    if (!mark) return null;\n\n    const tool = (this.props.tools || []).find(t => t.type === mark.type);\n\n    return (tool && tool.Component) || null;\n  };\n\n  onBgClick = point => {\n    const { x, y } = point;\n    const { labelModeEnabled, currentTool, marks } = this.props;\n\n    log('[onBgClick] x,y: ', x, y);\n\n    if (labelModeEnabled || !currentTool) {\n      return;\n    }\n\n    const buildingMark = marks.filter(m => m.building)[0];\n    let updatedMark;\n\n    // if the building mark has a different type, we just replace it\n    if (buildingMark && currentTool && buildingMark.type === currentTool.type) {\n      updatedMark = currentTool.addPoint({ x, y }, { ...buildingMark });\n    } else {\n      updatedMark = currentTool.addPoint({ x, y }, undefined);\n    }\n\n    this.updateMarks(buildingMark, updatedMark, true);\n  };\n\n  render() {\n    const {\n      axesSettings,\n      currentTool,\n      coordinatesOnHover,\n      size,\n      domain,\n      backgroundMarks,\n      range,\n      title,\n      labels,\n      labelModeEnabled\n    } = this.props;\n    let { marks } = this.props;\n\n    const graphProps = createGraphProps(domain, range, size, () => this.rootNode);\n    const maskSize = getMaskSize(size);\n    const common = { graphProps, labelModeEnabled };\n\n    marks = removeBuildingToolIfCurrentToolDiffers({ marks: marks || [], currentTool });\n\n    return (\n      <Root rootRef={r => (this.rootNode = r)} title={title} {...common}>\n        <Labels value={labels} {...common} />\n        <g transform={`translate(${domain.padding}, ${range.padding})`}>\n          <Grid {...common} />\n          <Axes {...axesSettings} {...common} />\n          <Bg {...size} onClick={this.onBgClick} {...common} />\n          <mask id=\"myMask\">\n            <rect {...maskSize} fill=\"white\" /> {/* TODO hardcoded color */}\n          </mask>\n\n          <g id=\"marks\" mask=\"url('#myMask')\">\n            {(backgroundMarks || []).map((m, index) => {\n              const Component = this.getComponent(m);\n              const markType = m.type;\n\n              return (\n                <Component\n                  key={`${markType}-${index}-bg`}\n                  mark={{ ...m, disabled: true, isBackground: true }}\n                  labelNode={this.state.labelNode}\n                  {...common}\n                />\n              );\n            })}\n\n            {marks.map((m, index) => {\n              const Component = this.getComponent(m);\n              const markType = m.type;\n\n              return (\n                <Component\n                  key={`${markType}-${index}`}\n                  mark={m}\n                  coordinatesOnHover={coordinatesOnHover}\n                  onChange={this.changeMark}\n                  onComplete={this.completeMark}\n                  onClick={this.onBgClick}\n                  onDragStart={this.startDrag}\n                  onDragStop={this.stopDrag}\n                  labelNode={this.state.labelNode}\n                  isToolActive={currentTool && markType === currentTool.type}\n                  {...common}\n                />\n              );\n            })}\n\n            <foreignObject\n              ref={labelNode => (this.labelNode = labelNode)}\n              x=\"0\"\n              y=\"0\"\n              {...size}\n              style={{ pointerEvents: 'none' }}\n            />\n          </g>\n        </g>\n      </Root>\n    );\n  }\n}\n\nexport default Graph;\n"],"mappings":"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"}

package/lib/grid-setup.js

@@ -1,10 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -27,27 +31,28 @@ var _configUi = require("@pie-lib/config-ui");
 
 var _editableHtml = _interopRequireDefault(require("@pie-lib/editable-html"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var GridConfig = function GridConfig(props) {
   var classes = props.classes,
       disabled = props.disabled,
+      displayedFields = props.displayedFields,
       labelValue = props.labelValue,
       labelValues = props.labelValues,
       gridValue = props.gridValue,
       gridValues = props.gridValues,
       _onChange = props.onChange;
+  var _displayedFields$labe = displayedFields.labelStep,
+      labelStep = _displayedFields$labe === void 0 ? {} : _displayedFields$labe,
+      _displayedFields$step = displayedFields.step,
+      step = _displayedFields$step === void 0 ? {} : _displayedFields$step;
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.columnView
-  }, /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+  }, step && step.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
     className: classes.mediumTextField,
-    label: "Grid Interval",
+    label: step.label || '',
     value: gridValue,
     customValues: gridValues,
     variant: "outlined",
@@ -55,9 +60,9 @@ var GridConfig = function GridConfig(props) {
     onChange: function onChange(e, v) {
       return _onChange('step', v);
     }
-  }), /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+  }), labelStep && labelStep.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
     className: classes.mediumTextField,
-    label: "Label Interval",
+    label: labelStep.label || '',
     value: labelValue,
     customValues: labelValues,
     variant: "outlined",
@@ -71,20 +76,28 @@ var GridConfig = function GridConfig(props) {
 var AxisConfig = function AxisConfig(props) {
   var classes = props.classes,
       disabled = props.disabled,
+      displayedFields = props.displayedFields,
+      displayHeader = props.displayHeader,
       label = props.label,
       maxValue = props.maxValue,
       minValue = props.minValue,
       _onChange2 = props.onChange,
       type = props.type;
+  var _displayedFields$axis = displayedFields.axisLabel,
+      axisLabel = _displayedFields$axis === void 0 ? {} : _displayedFields$axis,
+      _displayedFields$min = displayedFields.min,
+      min = _displayedFields$min === void 0 ? {} : _displayedFields$min,
+      _displayedFields$max = displayedFields.max,
+      max = _displayedFields$max === void 0 ? {} : _displayedFields$max;
   var activePlugins = ['bold', 'italic', 'underline', 'strikethrough' // 'languageCharacters'
   ];
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.columnView
-  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+  }, displayHeader && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
     variant: "subtitle2"
-  }, /*#__PURE__*/_react["default"].createElement("i", null, type === 'domain' ? 'x' : 'y'), "-axis"), /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+  }, /*#__PURE__*/_react["default"].createElement("i", null, type === 'domain' ? 'x' : 'y'), "-axis"), min && min.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
     className: classes.mediumTextField,
-    label: "Min Value",
+    label: min.label || '',
     value: minValue,
     min: -10000,
     max: maxValue - 0.01,
@@ -93,9 +106,9 @@ var AxisConfig = function AxisConfig(props) {
     onChange: function onChange(e, v) {
       return _onChange2('min', v);
     }
-  }), /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+  }), max && max.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
     className: classes.mediumTextField,
-    label: "Max Value",
+    label: max.label || '',
     value: maxValue,
     min: minValue + 0.01,
     max: 10000,
@@ -104,8 +117,8 @@ var AxisConfig = function AxisConfig(props) {
     onChange: function onChange(e, v) {
       return _onChange2('max', v);
     }
-  }), /*#__PURE__*/_react["default"].createElement(_renderUi.InputContainer, {
-    label: "Label",
+  }), axisLabel && axisLabel.enabled && /*#__PURE__*/_react["default"].createElement(_renderUi.InputContainer, {
+    label: axisLabel.label || '',
     className: classes.mediumTextField
   }, /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
     className: classes.axisLabel,
@@ -121,7 +134,8 @@ var AxisConfig = function AxisConfig(props) {
 var GridSetup = function GridSetup(props) {
   var classes = props.classes,
       domain = props.domain,
-      dimensionsEnabled = props.dimensionsEnabled,
+      _props$displayedField = props.displayedFields,
+      displayedFields = _props$displayedField === void 0 ? {} : _props$displayedField,
       _props$gridValues = props.gridValues,
       gridValues = _props$gridValues === void 0 ? {} : _props$gridValues,
       includeAxes = props.includeAxes,
@@ -137,6 +151,32 @@ var GridSetup = function GridSetup(props) {
     max: 41
   };
 
+  var _ref = displayedFields || {},
+      _ref$axisLabel = _ref.axisLabel,
+      axisLabel = _ref$axisLabel === void 0 ? {} : _ref$axisLabel,
+      dimensionsEnabled = _ref.dimensionsEnabled,
+      includeAxesEnabled = _ref.includeAxesEnabled,
+      _ref$labelStep = _ref.labelStep,
+      labelStep = _ref$labelStep === void 0 ? {} : _ref$labelStep,
+      _ref$min = _ref.min,
+      min = _ref$min === void 0 ? {} : _ref$min,
+      _ref$max = _ref.max,
+      max = _ref$max === void 0 ? {} : _ref$max,
+      standardGridEnabled = _ref.standardGridEnabled,
+      _ref$step = _ref.step,
+      step = _ref$step === void 0 ? {} : _ref$step;
+
+  var displayAxisType = min.enabled || max.enabled || axisLabel.enabled || step.enabled || labelStep.enabled;
+  var gridConfigFields = {
+    step: step,
+    labelStep: labelStep
+  };
+  var axisConfigFields = {
+    min: min,
+    max: max,
+    axisLabel: axisLabel
+  };
+
   var onIncludeAxes = function onIncludeAxes(includeAxes) {
     var noAxesConfig = function noAxesConfig(type) {
       var axis = type === 'domain' ? domain : range;
@@ -176,7 +216,7 @@ var GridSetup = function GridSetup(props) {
   };
 
   var onSizeChanged = function onSizeChanged(key, value) {
-    var graph = _objectSpread(_objectSpread({}, size), {}, _defineProperty({}, key, value));
+    var graph = _objectSpread(_objectSpread({}, size), {}, (0, _defineProperty2["default"])({}, key, value));
 
     if (standardGrid) {
       graph.height = value;
@@ -211,6 +251,8 @@ var GridSetup = function GridSetup(props) {
     className: classes.rowView
   }, /*#__PURE__*/_react["default"].createElement(AxisConfig, {
     classes: classes,
+    displayedFields: axisConfigFields,
+    displayHeader: displayAxisType,
     type: "domain",
     minValue: domain.min,
     maxValue: domain.max,
@@ -219,6 +261,8 @@ var GridSetup = function GridSetup(props) {
     onChange: onDomainChanged
   }), /*#__PURE__*/_react["default"].createElement(AxisConfig, {
     classes: classes,
+    displayedFields: axisConfigFields,
+    displayHeader: displayAxisType,
     type: "range",
     minValue: range.min,
     maxValue: range.max,
@@ -226,12 +270,13 @@ var GridSetup = function GridSetup(props) {
     disabled: standardGrid,
     includeAxes: includeAxes,
     onChange: onRangeChanged
-  })), /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+  })), (min.enabled || max.enabled) && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
     className: classes.text
-  }, "If you want the axis to be visible, use a zero or negative Min Value, and a positive Max Value"), /*#__PURE__*/_react["default"].createElement("div", {
+  }, "If you want the axis to be visible, use a zero or negative Min Value, and a positive Max Value"), (step.enabled || labelStep.enabled) && /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.rowView
   }, /*#__PURE__*/_react["default"].createElement(GridConfig, {
     classes: classes,
+    displayedFields: gridConfigFields,
     gridValue: domain.step,
     labelValue: domain.labelStep,
     gridValues: gridValues.domain || [],
@@ -240,16 +285,17 @@ var GridSetup = function GridSetup(props) {
   }), /*#__PURE__*/_react["default"].createElement(GridConfig, {
     classes: classes,
     disabled: standardGrid,
+    displayedFields: gridConfigFields,
     gridValue: range.step,
     labelValue: range.labelStep,
     gridValues: gridValues.range || [],
     labelValues: labelValues.range || [],
     onChange: onRangeChanged
-  })), /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+  })), labelStep.enabled && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
     className: classes.text
   }, "For unnumbered gridlines, enter a label interval of 0"));
 
-  var gridlinesConfig = /*#__PURE__*/_react["default"].createElement("div", {
+  var gridlinesConfig = max.enabled ? /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.columnView
   }, /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
     className: classes.largeTextField,
@@ -272,8 +318,7 @@ var GridSetup = function GridSetup(props) {
     onChange: function onChange(e, v) {
       return onRangeChanged('max', v);
     }
-  }));
-
+  })) : null;
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.wrapper
   }, /*#__PURE__*/_react["default"].createElement(_ExpansionPanel["default"], null, /*#__PURE__*/_react["default"].createElement(_ExpansionPanelSummary["default"], {
@@ -282,11 +327,11 @@ var GridSetup = function GridSetup(props) {
     variant: "subtitle1"
   }, "Customize Grid Setup")), /*#__PURE__*/_react["default"].createElement(_ExpansionPanelDetails["default"], null, /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.content
-  }, /*#__PURE__*/_react["default"].createElement(_configUi.Toggle, {
+  }, includeAxesEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.Toggle, {
     label: "Include axes and labels?",
     toggle: onIncludeAxes,
     checked: includeAxes
-  }), /*#__PURE__*/_react["default"].createElement(_configUi.Toggle, {
+  }), standardGridEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.Toggle, {
     label: "Constrain to standard coordinate grid?",
     toggle: onStandardGridChanged,
     checked: standardGrid
@@ -323,7 +368,7 @@ var GridSetup = function GridSetup(props) {
 GridSetup.propTypes = {
   classes: _propTypes["default"].object,
   domain: _propTypes["default"].object,
-  dimensionsEnabled: _propTypes["default"].object,
+  displayedFields: _propTypes["default"].object,
   gridValues: _propTypes["default"].object,
   includeAxes: _propTypes["default"].bool,
   labelValues: _propTypes["default"].object,