@pie-lib/graphing 3.1.0-next.2 → 3.1.0-next.26

package/lib/bg.js

@@ -0,0 +1,120 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.reflect.construct.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.array.index-of.js");
+require("core-js/modules/es.array.reduce.js");
+require("core-js/modules/es.object.to-string.js");
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _d3Selection = require("d3-selection");
+var _plot = require("@pie-lib/plot");
+var _utils = require("./utils");
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var Bg = exports["default"] = /*#__PURE__*/function (_React$Component) {
+  function Bg() {
+    var _this;
+    (0, _classCallCheck2["default"])(this, Bg);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, Bg, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "getRectPadding", function () {
+      var graphProps = _this.props.graphProps;
+      return (0, _utils.thinnerShapesNeeded)(graphProps) ? 6 : 10;
+    });
+    /**
+     * Note: we use d3 click + pointer to give us domain values directly.
+     * Saves us having to calculate them ourselves from a MouseEvent.
+     */
+    (0, _defineProperty2["default"])(_this, "onRectClick", function (rect, event) {
+      var _this$props = _this.props,
+        onClick = _this$props.onClick,
+        graphProps = _this$props.graphProps;
+      var scale = graphProps.scale;
+      var padding = _this.getRectPadding();
+      var coords = (0, _d3Selection.pointer)(event, rect.node());
+
+      // decrease the padding from coordinates to indicate the correct point clicked
+      var x = scale.x.invert(coords[0] - padding);
+      var y = scale.y.invert(coords[1] - padding);
+      var rowTicks = (0, _utils.getTickValues)(graphProps.range);
+      var columnTicks = (0, _utils.getTickValues)(graphProps.domain);
+      var closest = function closest(ticks, value) {
+        return ticks.length && ticks.reduce(function (prev, curr) {
+          var currentDistance = Math.abs(curr - value);
+          var previousDistance = Math.abs(prev - value);
+          return currentDistance <= previousDistance ? curr : prev;
+        });
+      };
+      var snapped = {};
+      if (columnTicks.indexOf(x) >= 0 && rowTicks.indexOf(y) >= 0) {
+        snapped.x = x;
+        snapped.y = y;
+      } else {
+        snapped.x = closest(columnTicks, x);
+        snapped.y = closest(rowTicks, y);
+      }
+      onClick(snapped);
+    });
+    return _this;
+  }
+  (0, _inherits2["default"])(Bg, _React$Component);
+  return (0, _createClass2["default"])(Bg, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this2 = this;
+      var rect = (0, _d3Selection.select)(this.rect);
+      rect.on('click', function (event) {
+        return _this2.onRectClick(rect, event);
+      });
+    }
+  }, {
+    key: "shouldComponentUpdate",
+    value: function shouldComponentUpdate(nextProps) {
+      return !_plot.utils.isDomainRangeEqual(this.props.graphProps, nextProps.graphProps) || this.props.width !== nextProps.width || this.props.height !== nextProps.height;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this3 = this;
+      var _this$props2 = this.props,
+        width = _this$props2.width,
+        height = _this$props2.height;
+      var padding = this.getRectPadding();
+
+      // expand the size of clickable area so a small area outside the edges of the grid lines to be clickable
+      return /*#__PURE__*/_react["default"].createElement("rect", {
+        ref: function ref(rect) {
+          return _this3.rect = rect;
+        },
+        transform: "translate(-".concat(padding, ", -").concat(padding, ")"),
+        fill: "red",
+        fillOpacity: "0.0",
+        width: width + padding * 2,
+        height: height + padding * 2
+      });
+    }
+  }]);
+}(_react["default"].Component);
+(0, _defineProperty2["default"])(Bg, "propTypes", {
+  width: _propTypes["default"].number.isRequired,
+  height: _propTypes["default"].number.isRequired,
+  onClick: _propTypes["default"].func.isRequired,
+  graphProps: _plot.types.GraphPropsType.isRequired
+});
+(0, _defineProperty2["default"])(Bg, "defaultProps", {});
+//# sourceMappingURL=bg.js.map

package/lib/bg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bg.js","names":["_react","_interopRequireDefault","require","_propTypes","_d3Selection","_plot","_utils","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","Bg","exports","_React$Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","concat","_defineProperty2","graphProps","props","thinnerShapesNeeded","rect","event","_this$props","onClick","scale","padding","getRectPadding","coords","pointer","node","x","invert","y","rowTicks","getTickValues","range","columnTicks","domain","closest","ticks","value","reduce","prev","curr","currentDistance","Math","abs","previousDistance","snapped","indexOf","_inherits2","_createClass2","key","componentDidMount","_this2","select","on","onRectClick","shouldComponentUpdate","nextProps","utils","isDomainRangeEqual","width","height","render","_this3","_this$props2","createElement","ref","transform","fill","fillOpacity","React","Component","PropTypes","number","isRequired","func","types","GraphPropsType"],"sources":["../src/bg.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { select, pointer } from 'd3-selection';\nimport { types, utils } from '@pie-lib/plot';\nimport { getTickValues, thinnerShapesNeeded } from './utils';\n\nexport default class Bg extends React.Component {\n  static propTypes = {\n    width: PropTypes.number.isRequired,\n    height: PropTypes.number.isRequired,\n    onClick: PropTypes.func.isRequired,\n    graphProps: types.GraphPropsType.isRequired,\n  };\n\n  static defaultProps = {};\n\n  componentDidMount() {\n    const rect = select(this.rect);\n\n    rect.on('click', (event) => this.onRectClick(rect, event));\n  }\n\n  shouldComponentUpdate(nextProps) {\n    return (\n      !utils.isDomainRangeEqual(this.props.graphProps, nextProps.graphProps) ||\n      this.props.width !== nextProps.width ||\n      this.props.height !== nextProps.height\n    );\n  }\n\n  getRectPadding = () => {\n    const { graphProps } = this.props;\n\n    return thinnerShapesNeeded(graphProps) ? 6 : 10;\n  };\n\n  /**\n   * Note: we use d3 click + pointer to give us domain values directly.\n   * Saves us having to calculate them ourselves from a MouseEvent.\n   */\n  onRectClick = (rect, event) => {\n    const { onClick, graphProps } = this.props;\n    const { scale } = graphProps;\n\n    const padding = this.getRectPadding();\n    const coords = pointer(event, rect.node());\n\n    // decrease the padding from coordinates to indicate the correct point clicked\n    const x = scale.x.invert(coords[0] - padding);\n    const y = scale.y.invert(coords[1] - padding);\n\n    const rowTicks = getTickValues(graphProps.range);\n    const columnTicks = getTickValues(graphProps.domain);\n\n    const closest = (ticks, value) => {\n      return (\n        ticks.length &&\n        ticks.reduce((prev, curr) => {\n          const currentDistance = Math.abs(curr - value);\n          const previousDistance = Math.abs(prev - value);\n\n          return currentDistance <= previousDistance ? curr : prev;\n        })\n      );\n    };\n\n    let snapped = {};\n\n    if (columnTicks.indexOf(x) >= 0 && rowTicks.indexOf(y) >= 0) {\n      snapped.x = x;\n      snapped.y = y;\n    } else {\n      snapped.x = closest(columnTicks, x);\n      snapped.y = closest(rowTicks, y);\n    }\n\n    onClick(snapped);\n  };\n\n  render() {\n    const { width, height } = this.props;\n    const padding = this.getRectPadding();\n\n    // expand the size of clickable area so a small area outside the edges of the grid lines to be clickable\n    return (\n      <rect\n        ref={(rect) => (this.rect = rect)}\n        transform={`translate(-${padding}, -${padding})`}\n        fill=\"red\"\n        fillOpacity=\"0.0\"\n        width={width + padding * 2}\n        height={height + padding * 2}\n      />\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/container/actions.js

@@ -0,0 +1,19 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.changeMarks = exports.addMark = void 0;
+var addMark = exports.addMark = function addMark() {
+  return {
+    type: 'ADD_MARK'
+  };
+};
+var changeMarks = exports.changeMarks = function changeMarks(marks) {
+  return {
+    type: 'CHANGE_MARKS',
+    marks: marks
+  };
+};
+//# sourceMappingURL=actions.js.map

package/lib/container/actions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"actions.js","names":["addMark","exports","type","changeMarks","marks"],"sources":["../../src/container/actions.js"],"sourcesContent":["export const addMark = () => ({\n  type: 'ADD_MARK',\n});\n\nexport const changeMarks = (marks) => ({\n  type: 'CHANGE_MARKS',\n  marks,\n});\n"],"mappings":";;;;;;;AAAO,IAAMA,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,SAAVA,OAAOA,CAAA;EAAA,OAAU;IAC5BE,IAAI,EAAE;EACR,CAAC;AAAA,CAAC;AAEK,IAAMC,WAAW,GAAAF,OAAA,CAAAE,WAAA,GAAG,SAAdA,WAAWA,CAAIC,KAAK;EAAA,OAAM;IACrCF,IAAI,EAAE,cAAc;IACpBE,KAAK,EAALA;EACF,CAAC;AAAA,CAAC","ignoreList":[]}

package/lib/container/index.js

@@ -0,0 +1,122 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.reflect.construct.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.GraphContainer = void 0;
+require("core-js/modules/es.array.find.js");
+require("core-js/modules/es.object.to-string.js");
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _reactRedux = require("react-redux");
+var _react = _interopRequireDefault(require("react"));
+var _redux = require("redux");
+var _reducer = _interopRequireDefault(require("./reducer"));
+var _actions = require("./actions");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
+var _reduxUndo = require("redux-undo");
+var _graphWithControls = _interopRequireDefault(require("../graph-with-controls"));
+var _middleware = require("./middleware");
+var _excluded = ["onChangeMarks", "marks"];
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var mapStateToProps = function mapStateToProps(s) {
+  return {
+    marks: s.marks.present
+  };
+};
+var mapDispatchToProps = function mapDispatchToProps(dispatch) {
+  return {
+    onChangeMarks: function onChangeMarks(m) {
+      return dispatch((0, _actions.changeMarks)(m));
+    },
+    onUndo: function onUndo() {
+      return dispatch(_reduxUndo.ActionCreators.undo());
+    },
+    onRedo: function onRedo() {
+      return dispatch(_reduxUndo.ActionCreators.redo());
+    },
+    onReset: function onReset() {
+      return dispatch((0, _actions.changeMarks)([]));
+    }
+  };
+};
+var GraphContainer = exports.GraphContainer = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(_graphWithControls["default"]);
+
+/**
+ * The graph component entry point with undo/redo
+ * Redux is an implementation detail, hide it in the react component.
+ */
+var Root = /*#__PURE__*/function (_React$Component) {
+  function Root(props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, Root);
+    _this = _callSuper(this, Root, [props]);
+    (0, _defineProperty2["default"])(_this, "onStoreChange", function () {
+      var _this$props = _this.props,
+        marks = _this$props.marks,
+        onChangeMarks = _this$props.onChangeMarks;
+      var storeState = _this.store.getState();
+      if (!(0, _isEqual["default"])(storeState.marks.present, marks)) {
+        onChangeMarks(storeState.marks.present);
+      }
+    });
+    var r = (0, _reducer["default"])();
+    _this.store = (0, _redux.createStore)(r, {
+      marks: props.marks
+    }, (0, _redux.applyMiddleware)(_middleware.lastActionMiddleware));
+    _this.store.subscribe(_this.onStoreChange);
+    return _this;
+  }
+  (0, _inherits2["default"])(Root, _React$Component);
+  return (0, _createClass2["default"])(Root, [{
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      var marks = this.props.marks;
+      var storeState = this.store.getState();
+      if ((0, _isEqual["default"])(storeState.marks.present, marks)) {
+        return;
+      }
+      if (!(0, _isEqual["default"])(prevProps.marks, marks)) {
+        this.store.dispatch((0, _actions.changeMarks)(marks));
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      // eslint-disable-next-line no-unused-vars
+      var _this$props2 = this.props,
+        onChangeMarks = _this$props2.onChangeMarks,
+        marks = _this$props2.marks,
+        rest = (0, _objectWithoutProperties2["default"])(_this$props2, _excluded);
+      var correctnessSet = marks && marks.find(function (m) {
+        return m.correctness;
+      });
+      if (correctnessSet) {
+        return /*#__PURE__*/_react["default"].createElement(_graphWithControls["default"], (0, _extends2["default"])({}, rest, {
+          marks: marks,
+          disabled: correctnessSet
+        }));
+      }
+      return /*#__PURE__*/_react["default"].createElement(_reactRedux.Provider, {
+        store: this.store
+      }, /*#__PURE__*/_react["default"].createElement(GraphContainer, rest));
+    }
+  }]);
+}(_react["default"].Component);
+(0, _defineProperty2["default"])(Root, "propTypes", {
+  onChangeMarks: _propTypes["default"].func,
+  marks: _propTypes["default"].array
+});
+var _default = exports["default"] = Root;
+//# sourceMappingURL=index.js.map

package/lib/container/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_reactRedux","require","_react","_interopRequireDefault","_redux","_reducer","_actions","_propTypes","_isEqual","_reduxUndo","_graphWithControls","_middleware","_excluded","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","mapStateToProps","s","marks","present","mapDispatchToProps","dispatch","onChangeMarks","m","changeMarks","onUndo","ActionCreators","undo","onRedo","redo","onReset","GraphContainer","exports","connect","GraphWithControls","Root","_React$Component","props","_this","_classCallCheck2","_defineProperty2","_this$props","storeState","store","getState","isEqual","r","reducer","createStore","applyMiddleware","lastActionMiddleware","subscribe","onStoreChange","_inherits2","_createClass2","key","value","componentDidUpdate","prevProps","render","_this$props2","rest","_objectWithoutProperties2","correctnessSet","find","correctness","createElement","_extends2","disabled","Provider","React","Component","PropTypes","func","array","_default"],"sources":["../../src/container/index.jsx"],"sourcesContent":["import { connect } from 'react-redux';\nimport React from 'react';\nimport { Provider } from 'react-redux';\nimport { applyMiddleware, createStore } from 'redux';\nimport reducer from './reducer';\nimport { changeMarks } from './actions';\nimport PropTypes from 'prop-types';\nimport isEqual from 'lodash/isEqual';\nimport { ActionCreators } from 'redux-undo';\nimport GraphWithControls from '../graph-with-controls';\nimport { lastActionMiddleware } from './middleware';\n\nconst mapStateToProps = (s) => ({\n  marks: s.marks.present,\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n  onChangeMarks: (m) => dispatch(changeMarks(m)),\n  onUndo: () => dispatch(ActionCreators.undo()),\n  onRedo: () => dispatch(ActionCreators.redo()),\n  onReset: () => dispatch(changeMarks([])),\n});\n\nexport const GraphContainer = connect(mapStateToProps, mapDispatchToProps)(GraphWithControls);\n\n/**\n * The graph component entry point with undo/redo\n * Redux is an implementation detail, hide it in the react component.\n */\nclass Root extends React.Component {\n  static propTypes = {\n    onChangeMarks: PropTypes.func,\n    marks: PropTypes.array,\n  };\n\n  constructor(props) {\n    super(props);\n\n    const r = reducer();\n    this.store = createStore(r, { marks: props.marks }, applyMiddleware(lastActionMiddleware));\n\n    this.store.subscribe(this.onStoreChange);\n  }\n\n  componentDidUpdate(prevProps) {\n    const { marks } = this.props;\n    const storeState = this.store.getState();\n\n    if (isEqual(storeState.marks.present, marks)) {\n      return;\n    }\n\n    if (!isEqual(prevProps.marks, marks)) {\n      this.store.dispatch(changeMarks(marks));\n    }\n  }\n\n  onStoreChange = () => {\n    const { marks, onChangeMarks } = this.props;\n    const storeState = this.store.getState();\n\n    if (!isEqual(storeState.marks.present, marks)) {\n      onChangeMarks(storeState.marks.present);\n    }\n  };\n\n  render() {\n    // eslint-disable-next-line no-unused-vars\n    const { onChangeMarks, marks, ...rest } = this.props;\n    const correctnessSet = marks && marks.find((m) => m.correctness);\n\n    if (correctnessSet) {\n      return <GraphWithControls {...rest} marks={marks} disabled={correctnessSet} />;\n    }\n\n    return (\n      <Provider store={this.store}>\n        <GraphContainer {...rest} />\n      </Provider>\n    );\n  }\n}\n\nexport default Root;\n"],"mappings":"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","ignoreList":[]}

package/lib/container/marks.js

@@ -0,0 +1,24 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+require("core-js/modules/es.array.is-array.js");
+var marks = function marks() {
+  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var action = arguments.length > 1 ? arguments[1] : undefined;
+  switch (action.type) {
+    case 'CHANGE_MARKS':
+      if (Array.isArray(action.marks)) {
+        return action.marks;
+      } else {
+        throw new Error('marks must be an array');
+      }
+    default:
+      return state;
+  }
+};
+var _default = exports["default"] = marks;
+//# sourceMappingURL=marks.js.map

package/lib/container/marks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"marks.js","names":["marks","state","arguments","length","undefined","action","type","Array","isArray","Error","_default","exports"],"sources":["../../src/container/marks.js"],"sourcesContent":["const marks = (state = [], action) => {\n  switch (action.type) {\n    case 'CHANGE_MARKS':\n      if (Array.isArray(action.marks)) {\n        return action.marks;\n      } else {\n        throw new Error('marks must be an array');\n      }\n    default:\n      return state;\n  }\n};\n\nexport default marks;\n"],"mappings":";;;;;;;;AAAA,IAAMA,KAAK,GAAG,SAARA,KAAKA,CAAA,EAA2B;EAAA,IAAvBC,KAAK,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,EAAE;EAAA,IAAEG,MAAM,GAAAH,SAAA,CAAAC,MAAA,OAAAD,SAAA,MAAAE,SAAA;EAC/B,QAAQC,MAAM,CAACC,IAAI;IACjB,KAAK,cAAc;MACjB,IAAIC,KAAK,CAACC,OAAO,CAACH,MAAM,CAACL,KAAK,CAAC,EAAE;QAC/B,OAAOK,MAAM,CAACL,KAAK;MACrB,CAAC,MAAM;QACL,MAAM,IAAIS,KAAK,CAAC,wBAAwB,CAAC;MAC3C;IACF;MACE,OAAOR,KAAK;EAChB;AACF,CAAC;AAAC,IAAAS,QAAA,GAAAC,OAAA,cAEaX,KAAK","ignoreList":[]}

package/lib/container/middleware.js

@@ -0,0 +1,20 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.lastActionMiddleware = exports.getLastAction = void 0;
+var lastAction = null;
+var getLastAction = exports.getLastAction = function getLastAction() {
+  return lastAction;
+};
+var lastActionMiddleware = exports.lastActionMiddleware = function lastActionMiddleware() {
+  return function (next) {
+    return function (action) {
+      lastAction = action;
+      return next(action);
+    };
+  };
+};
+//# sourceMappingURL=middleware.js.map

package/lib/container/middleware.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"middleware.js","names":["lastAction","getLastAction","exports","lastActionMiddleware","next","action"],"sources":["../../src/container/middleware.js"],"sourcesContent":["let lastAction = null;\nexport const getLastAction = () => lastAction;\n\nexport const lastActionMiddleware = () => (next) => (action) => {\n  lastAction = action;\n  return next(action);\n};\n"],"mappings":";;;;;;;AAAA,IAAIA,UAAU,GAAG,IAAI;AACd,IAAMC,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,SAAhBA,aAAaA,CAAA;EAAA,OAASD,UAAU;AAAA;AAEtC,IAAMG,oBAAoB,GAAAD,OAAA,CAAAC,oBAAA,GAAG,SAAvBA,oBAAoBA,CAAA;EAAA,OAAS,UAACC,IAAI;IAAA,OAAK,UAACC,MAAM,EAAK;MAC9DL,UAAU,GAAGK,MAAM;MACnB,OAAOD,IAAI,CAACC,MAAM,CAAC;IACrB,CAAC;EAAA;AAAA","ignoreList":[]}

package/lib/container/reducer.js

@@ -0,0 +1,19 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _redux = require("redux");
+var _marks = _interopRequireDefault(require("./marks"));
+var _reduxUndo = _interopRequireDefault(require("redux-undo"));
+var _default = exports["default"] = function _default() {
+  return (0, _redux.combineReducers)({
+    marks: (0, _reduxUndo["default"])(_marks["default"], {
+      debug: false
+    })
+  });
+};
+//# sourceMappingURL=reducer.js.map

package/lib/container/reducer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reducer.js","names":["_redux","require","_marks","_interopRequireDefault","_reduxUndo","_default","exports","combineReducers","marks","undoable","debug"],"sources":["../../src/container/reducer.js"],"sourcesContent":["import { combineReducers } from 'redux';\nimport marks from './marks';\nimport undoable from 'redux-undo';\n\nexport default () => combineReducers({ marks: undoable(marks, { debug: false }) });\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,UAAA,GAAAD,sBAAA,CAAAF,OAAA;AAAkC,IAAAI,QAAA,GAAAC,OAAA,cAEnB,SAAAD,SAAA;EAAA,OAAM,IAAAE,sBAAe,EAAC;IAAEC,KAAK,EAAE,IAAAC,qBAAQ,EAACD,iBAAK,EAAE;MAAEE,KAAK,EAAE;IAAM,CAAC;EAAE,CAAC,CAAC;AAAA","ignoreList":[]}

package/lib/coordinates-label.js

@@ -0,0 +1,90 @@
+"use strict";
+
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.object.define-properties.js");
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+require("core-js/modules/es.object.keys.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getLabelPosition = exports["default"] = exports.CoordinatesLabel = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+require("core-js/modules/es.array.concat.js");
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _plot = require("@pie-lib/plot");
+var _renderUi = require("@pie-lib/render-ui");
+var _styles = require("@mui/material/styles");
+var _InputBase = _interopRequireDefault(require("@mui/material/InputBase"));
+var _utils = require("./utils");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var StyledInputBase = (0, _styles.styled)(_InputBase["default"])(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    fontFamily: theme.typography.fontFamily,
+    fontSize: theme.typography.fontSize,
+    borderRadius: '8px',
+    background: theme.palette.common.white,
+    color: _renderUi.color.defaults.PRIMARY_DARK,
+    '& .MuiInputBase-input': {
+      padding: 0
+    }
+  };
+});
+
+// eslint-disable-next-line react/prop-types
+var getLabelPosition = exports.getLabelPosition = function getLabelPosition(graphProps, x, y, labelLength) {
+  var scale = graphProps.scale,
+    domain = graphProps.domain,
+    range = graphProps.range;
+  // treat corner cases for maximum and minimum
+  var topShift = y === range.min ? 16 : y === range.max ? 0 : 8;
+  var leftShift = 10;
+  var rightEdge = scale.x(x) + labelLength + leftShift;
+  if (rightEdge >= scale.x(domain.max)) {
+    return {
+      left: scale.x(x) - leftShift - labelLength,
+      top: scale.y(y) - topShift
+    };
+  }
+  return {
+    left: scale.x(x) + leftShift,
+    top: scale.y(y) - topShift
+  };
+};
+var CoordinatesLabel = exports.CoordinatesLabel = function CoordinatesLabel(_ref2) {
+  var x = _ref2.x,
+    y = _ref2.y,
+    graphProps = _ref2.graphProps;
+  var label = "(".concat((0, _utils.roundNumber)(x), ", ").concat((0, _utils.roundNumber)(y), ")");
+  var labelLength = (label.length || 0) * 6;
+  var labelPosition = getLabelPosition(graphProps, x, y, labelLength);
+  var style = _objectSpread({
+    position: 'absolute',
+    pointerEvents: 'auto',
+    width: labelLength,
+    padding: 0
+  }, labelPosition);
+  return /*#__PURE__*/_react["default"].createElement(StyledInputBase, {
+    style: style,
+    value: label,
+    inputProps: {
+      ariaLabel: 'naked'
+    }
+  });
+};
+CoordinatesLabel.propTypes = {
+  graphProps: _plot.types.GraphPropsType,
+  x: _propTypes["default"].number,
+  y: _propTypes["default"].number
+};
+var _default = exports["default"] = CoordinatesLabel;
+//# sourceMappingURL=coordinates-label.js.map

package/lib/coordinates-label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"coordinates-label.js","names":["_react","_interopRequireDefault","require","_propTypes","_plot","_renderUi","_styles","_InputBase","_utils","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","StyledInputBase","styled","InputBase","_ref","theme","fontFamily","typography","fontSize","borderRadius","background","palette","common","white","color","defaults","PRIMARY_DARK","padding","getLabelPosition","exports","graphProps","x","y","labelLength","scale","domain","range","topShift","min","max","leftShift","rightEdge","left","top","CoordinatesLabel","_ref2","label","concat","roundNumber","labelPosition","style","position","pointerEvents","width","createElement","value","inputProps","ariaLabel","propTypes","types","GraphPropsType","PropTypes","number","_default"],"sources":["../src/coordinates-label.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { types } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\nimport { styled } from '@mui/material/styles';\nimport InputBase from '@mui/material/InputBase';\nimport { roundNumber } from './utils';\n\nconst StyledInputBase = styled(InputBase)(({ theme }) => ({\n  fontFamily: theme.typography.fontFamily,\n  fontSize: theme.typography.fontSize,\n  borderRadius: '8px',\n  background: theme.palette.common.white,\n  color: color.defaults.PRIMARY_DARK,\n  '& .MuiInputBase-input': {\n    padding: 0,\n  },\n}));\n\n// eslint-disable-next-line react/prop-types\nexport const getLabelPosition = (graphProps, x, y, labelLength) => {\n  const { scale, domain, range } = graphProps;\n  // treat corner cases for maximum and minimum\n  const topShift = y === range.min ? 16 : y === range.max ? 0 : 8;\n  const leftShift = 10;\n  const rightEdge = scale.x(x) + labelLength + leftShift;\n\n  if (rightEdge >= scale.x(domain.max)) {\n    return {\n      left: scale.x(x) - leftShift - labelLength,\n      top: scale.y(y) - topShift,\n    };\n  }\n\n  return {\n    left: scale.x(x) + leftShift,\n    top: scale.y(y) - topShift,\n  };\n};\n\nexport const CoordinatesLabel = ({ x, y, graphProps }) => {\n  const label = `(${roundNumber(x)}, ${roundNumber(y)})`;\n  const labelLength = (label.length || 0) * 6;\n  const labelPosition = getLabelPosition(graphProps, x, y, labelLength);\n\n  const style = {\n    position: 'absolute',\n    pointerEvents: 'auto',\n    width: labelLength,\n    padding: 0,\n    ...labelPosition,\n  };\n\n  return (\n    <StyledInputBase\n      style={style}\n      value={label}\n      inputProps={{ ariaLabel: 'naked' }}\n    />\n  );\n};\n\nCoordinatesLabel.propTypes = {\n  graphProps: types.GraphPropsType,\n  x: PropTypes.number,\n  y: PropTypes.number,\n};\n\nexport default CoordinatesLabel;\n"],"mappings":"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","ignoreList":[]}