@pie-lib/graphing 2.6.1 → 2.7.0

package/lib/grid-setup.js

@@ -0,0 +1,435 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _renderUi = require("@pie-lib/render-ui");
+
+var _styles = require("@material-ui/core/styles");
+
+var _ExpansionPanelSummary = _interopRequireDefault(require("@material-ui/core/ExpansionPanelSummary"));
+
+var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
+
+var _ExpansionPanelDetails = _interopRequireDefault(require("@material-ui/core/ExpansionPanelDetails"));
+
+var _ExpansionPanel = _interopRequireDefault(require("@material-ui/core/ExpansionPanel"));
+
+var _ExpandMore = _interopRequireDefault(require("@material-ui/icons/ExpandMore"));
+
+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; }
+
+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
+  }, step && step.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.mediumTextField,
+    label: step.label || '',
+    value: gridValue,
+    customValues: gridValues,
+    variant: "outlined",
+    disabled: disabled,
+    onChange: function onChange(e, v) {
+      return _onChange('step', v);
+    }
+  }), labelStep && labelStep.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.mediumTextField,
+    label: labelStep.label || '',
+    value: labelValue,
+    customValues: labelValues,
+    variant: "outlined",
+    disabled: disabled,
+    onChange: function onChange(e, v) {
+      return _onChange('labelStep', v);
+    }
+  }));
+};
+
+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
+  }, displayHeader && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    variant: "subtitle2"
+  }, /*#__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.label || '',
+    value: minValue,
+    min: -10000,
+    max: maxValue - 0.01,
+    variant: "outlined",
+    disabled: disabled,
+    onChange: function onChange(e, v) {
+      return _onChange2('min', v);
+    }
+  }), max && max.enabled && /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.mediumTextField,
+    label: max.label || '',
+    value: maxValue,
+    min: minValue + 0.01,
+    max: 10000,
+    variant: "outlined",
+    disabled: disabled,
+    onChange: function onChange(e, v) {
+      return _onChange2('max', v);
+    }
+  }), axisLabel && axisLabel.enabled && /*#__PURE__*/_react["default"].createElement(_renderUi.InputContainer, {
+    label: axisLabel.label || '',
+    className: classes.mediumTextField
+  }, /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
+    className: classes.axisLabel,
+    onChange: function onChange(value) {
+      return _onChange2('axisLabel', value);
+    },
+    markup: label || '',
+    charactersLimit: 5,
+    activePlugins: activePlugins
+  })));
+};
+
+var GridSetup = function GridSetup(props) {
+  var classes = props.classes,
+      domain = props.domain,
+      _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,
+      _props$labelValues = props.labelValues,
+      labelValues = _props$labelValues === void 0 ? {} : _props$labelValues,
+      onChange = props.onChange,
+      range = props.range,
+      size = props.size,
+      sizeConstraints = props.sizeConstraints,
+      standardGrid = props.standardGrid;
+  var gridProps = {
+    min: 2,
+    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;
+      return {
+        min: 1,
+        max: axis.max < gridProps.min || axis.max > gridProps.max ? 16 : axis.max,
+        step: 1,
+        labelStep: 0
+      };
+    };
+
+    var updatedRange = _objectSpread(_objectSpread({}, range), includeAxes ? {
+      labelStep: 1
+    } : noAxesConfig('range'));
+
+    var updatedDomain = _objectSpread(_objectSpread({}, domain), includeAxes ? {
+      labelStep: 1
+    } : noAxesConfig('domain'));
+
+    onChange({
+      includeAxes: includeAxes,
+      range: updatedRange,
+      domain: updatedDomain
+    });
+  };
+
+  var onStandardGridChanged = function onStandardGridChanged(value) {
+    onChange({
+      standardGrid: value,
+      range: _objectSpread(_objectSpread({}, domain), {}, {
+        axisLabel: range.axisLabel
+      }),
+      graph: _objectSpread(_objectSpread({}, size), {}, {
+        height: size.width
+      })
+    });
+  };
+
+  var onSizeChanged = function onSizeChanged(key, value) {
+    var graph = _objectSpread(_objectSpread({}, size), {}, _defineProperty({}, key, value));
+
+    if (standardGrid) {
+      graph.height = value;
+    }
+
+    onChange({
+      graph: graph
+    });
+  };
+
+  var onDomainChanged = function onDomainChanged(key, value) {
+    domain[key] = value;
+
+    if (standardGrid && key !== 'axisLabel') {
+      range[key] = value;
+    }
+
+    onChange({
+      domain: domain,
+      range: range
+    });
+  };
+
+  var onRangeChanged = function onRangeChanged(key, value) {
+    range[key] = value;
+    onChange({
+      range: range
+    });
+  };
+
+  var axesConfig = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.rowView
+  }, /*#__PURE__*/_react["default"].createElement(AxisConfig, {
+    classes: classes,
+    displayedFields: axisConfigFields,
+    displayHeader: displayAxisType,
+    type: "domain",
+    minValue: domain.min,
+    maxValue: domain.max,
+    label: domain.axisLabel,
+    includeAxes: includeAxes,
+    onChange: onDomainChanged
+  }), /*#__PURE__*/_react["default"].createElement(AxisConfig, {
+    classes: classes,
+    displayedFields: axisConfigFields,
+    displayHeader: displayAxisType,
+    type: "range",
+    minValue: range.min,
+    maxValue: range.max,
+    label: range.axisLabel,
+    disabled: standardGrid,
+    includeAxes: includeAxes,
+    onChange: onRangeChanged
+  })), (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"), (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 || [],
+    labelValues: labelValues.domain || [],
+    onChange: onDomainChanged
+  }), /*#__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
+  })), labelStep.enabled && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    className: classes.text
+  }, "For unnumbered gridlines, enter a label interval of 0"));
+
+  var gridlinesConfig = max.enabled ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.columnView
+  }, /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.largeTextField,
+    label: "Number of Horizontal Gridlines",
+    value: domain.max,
+    min: !includeAxes && gridProps.min,
+    max: !includeAxes && gridProps.max,
+    variant: "outlined",
+    onChange: function onChange(e, v) {
+      return onDomainChanged('max', v);
+    }
+  }), /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.largeTextField,
+    label: "Number of Vertical Gridlines",
+    value: range.max,
+    min: !includeAxes && gridProps.min,
+    max: !includeAxes && gridProps.max,
+    variant: "outlined",
+    disabled: standardGrid,
+    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"], {
+    expandIcon: /*#__PURE__*/_react["default"].createElement(_ExpandMore["default"], null)
+  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    variant: "subtitle1"
+  }, "Customize Grid Setup")), /*#__PURE__*/_react["default"].createElement(_ExpansionPanelDetails["default"], null, /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.content
+  }, includeAxesEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.Toggle, {
+    label: "Include axes and labels?",
+    toggle: onIncludeAxes,
+    checked: includeAxes
+  }), standardGridEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.Toggle, {
+    label: "Constrain to standard coordinate grid?",
+    toggle: onStandardGridChanged,
+    checked: standardGrid
+  }), includeAxes ? axesConfig : gridlinesConfig, dimensionsEnabled && /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.dimensions
+  }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Typography["default"], null, "Dimensions(px)"), /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    className: classes.disabled
+  }, "Min ", sizeConstraints.min, ", Max ", sizeConstraints.max)), /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.textField,
+    label: "Width",
+    value: size.width,
+    min: sizeConstraints.min,
+    max: sizeConstraints.max,
+    step: sizeConstraints.step,
+    variant: "outlined",
+    onChange: function onChange(e, v) {
+      return onSizeChanged('width', v);
+    }
+  }), /*#__PURE__*/_react["default"].createElement(_configUi.NumberTextFieldCustom, {
+    className: classes.textField,
+    label: "Height",
+    value: size.height,
+    min: sizeConstraints.min,
+    max: sizeConstraints.max,
+    step: sizeConstraints.step,
+    variant: "outlined",
+    disabled: standardGrid,
+    onChange: function onChange(e, v) {
+      return onSizeChanged('height', v);
+    }
+  }))))));
+};
+
+GridSetup.propTypes = {
+  classes: _propTypes["default"].object,
+  domain: _propTypes["default"].object,
+  displayedFields: _propTypes["default"].object,
+  gridValues: _propTypes["default"].object,
+  includeAxes: _propTypes["default"].bool,
+  labelValues: _propTypes["default"].object,
+  onChange: _propTypes["default"]["function"],
+  range: _propTypes["default"].object,
+  size: _propTypes["default"].object,
+  sizeConstraints: _propTypes["default"].object,
+  standardGrid: _propTypes["default"].bool
+};
+
+var styles = function styles(theme) {
+  return {
+    wrapper: {
+      width: '450px'
+    },
+    content: {
+      display: 'flex',
+      flexDirection: 'column',
+      width: '100%'
+    },
+    columnView: {
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center'
+    },
+    rowView: {
+      display: 'flex',
+      justifyContent: 'space-around',
+      alignItems: 'center'
+    },
+    textField: {
+      width: '130px',
+      margin: "".concat(theme.spacing.unit, "px ").concat(theme.spacing.unit / 2, "px")
+    },
+    mediumTextField: {
+      width: '160px',
+      margin: "".concat(theme.spacing.unit, "px ").concat(theme.spacing.unit / 2, "px")
+    },
+    largeTextField: {
+      width: '230px',
+      margin: "".concat(theme.spacing.unit, "px ").concat(theme.spacing.unit / 2, "px")
+    },
+    text: {
+      fontStyle: 'italic',
+      margin: "".concat(theme.spacing.unit, "px 0")
+    },
+    dimensions: {
+      display: 'flex',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    },
+    disabled: {
+      color: _renderUi.color.disabled()
+    },
+    axisLabel: {
+      paddingTop: theme.spacing.unit * 2
+    }
+  };
+};
+
+var _default = (0, _styles.withStyles)(styles)(GridSetup);
+
+exports["default"] = _default;
+//# sourceMappingURL=grid-setup.js.map

package/lib/grid-setup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/grid-setup.jsx"],"names":["GridConfig","props","classes","disabled","displayedFields","labelValue","labelValues","gridValue","gridValues","onChange","labelStep","step","columnView","enabled","mediumTextField","label","e","v","AxisConfig","displayHeader","maxValue","minValue","type","axisLabel","min","max","activePlugins","value","GridSetup","domain","includeAxes","range","size","sizeConstraints","standardGrid","gridProps","dimensionsEnabled","includeAxesEnabled","standardGridEnabled","displayAxisType","gridConfigFields","axisConfigFields","onIncludeAxes","noAxesConfig","axis","updatedRange","updatedDomain","onStandardGridChanged","graph","height","width","onSizeChanged","key","onDomainChanged","onRangeChanged","axesConfig","rowView","text","gridlinesConfig","largeTextField","wrapper","content","dimensions","textField","propTypes","PropTypes","object","bool","styles","theme","display","flexDirection","alignItems","justifyContent","margin","spacing","unit","fontStyle","color","paddingTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { color, InputContainer } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';\nimport Typography from '@material-ui/core/Typography';\nimport ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';\nimport ExpansionPanel from '@material-ui/core/ExpansionPanel';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { NumberTextFieldCustom, Toggle } from '@pie-lib/config-ui';\nimport EditableHTML from '@pie-lib/editable-html';\n\nconst GridConfig = props => {\n  const {\n    classes,\n    disabled,\n    displayedFields,\n    labelValue,\n    labelValues,\n    gridValue,\n    gridValues,\n    onChange\n  } = props;\n  const { labelStep = {}, step = {} } = displayedFields;\n\n  return (\n    <div className={classes.columnView}>\n      {step && step.enabled && (\n        <NumberTextFieldCustom\n          className={classes.mediumTextField}\n          label={step.label || ''}\n          value={gridValue}\n          customValues={gridValues}\n          variant=\"outlined\"\n          disabled={disabled}\n          onChange={(e, v) => onChange('step', v)}\n        />\n      )}\n      {labelStep && labelStep.enabled && (\n        <NumberTextFieldCustom\n          className={classes.mediumTextField}\n          label={labelStep.label || ''}\n          value={labelValue}\n          customValues={labelValues}\n          variant=\"outlined\"\n          disabled={disabled}\n          onChange={(e, v) => onChange('labelStep', v)}\n        />\n      )}\n    </div>\n  );\n};\n\nconst AxisConfig = props => {\n  const {\n    classes,\n    disabled,\n    displayedFields,\n    displayHeader,\n    label,\n    maxValue,\n    minValue,\n    onChange,\n    type\n  } = props;\n  const { axisLabel = {}, min = {}, max = {} } = displayedFields;\n  const activePlugins = [\n    'bold',\n    'italic',\n    'underline',\n    'strikethrough'\n    // 'languageCharacters'\n  ];\n\n  return (\n    <div className={classes.columnView}>\n      {displayHeader && (\n        <Typography variant=\"subtitle2\">\n          <i>{type === 'domain' ? 'x' : 'y'}</i>\n          -axis\n        </Typography>\n      )}\n      {min && min.enabled && (\n        <NumberTextFieldCustom\n          className={classes.mediumTextField}\n          label={min.label || ''}\n          value={minValue}\n          min={-10000}\n          max={maxValue - 0.01}\n          variant=\"outlined\"\n          disabled={disabled}\n          onChange={(e, v) => onChange('min', v)}\n        />\n      )}\n      {max && max.enabled && (\n        <NumberTextFieldCustom\n          className={classes.mediumTextField}\n          label={max.label || ''}\n          value={maxValue}\n          min={minValue + 0.01}\n          max={10000}\n          variant=\"outlined\"\n          disabled={disabled}\n          onChange={(e, v) => onChange('max', v)}\n        />\n      )}\n      {axisLabel && axisLabel.enabled && (\n        <InputContainer label={axisLabel.label || ''} className={classes.mediumTextField}>\n          <EditableHTML\n            className={classes.axisLabel}\n            onChange={value => onChange('axisLabel', value)}\n            markup={label || ''}\n            charactersLimit={5}\n            activePlugins={activePlugins}\n          />\n        </InputContainer>\n      )}\n    </div>\n  );\n};\n\nconst GridSetup = props => {\n  const {\n    classes,\n    domain,\n    displayedFields = {},\n    gridValues = {},\n    includeAxes,\n    labelValues = {},\n    onChange,\n    range,\n    size,\n    sizeConstraints,\n    standardGrid\n  } = props;\n  const gridProps = { min: 2, max: 41 };\n  const {\n    axisLabel = {},\n    dimensionsEnabled,\n    includeAxesEnabled,\n    labelStep = {},\n    min = {},\n    max = {},\n    standardGridEnabled,\n    step = {}\n  } = displayedFields || {};\n  const displayAxisType =\n    min.enabled || max.enabled || axisLabel.enabled || step.enabled || labelStep.enabled;\n  const gridConfigFields = { step, labelStep };\n  const axisConfigFields = { min, max, axisLabel };\n\n  const onIncludeAxes = includeAxes => {\n    const noAxesConfig = type => {\n      const axis = type === 'domain' ? domain : range;\n\n      return {\n        min: 1,\n        max: axis.max < gridProps.min || axis.max > gridProps.max ? 16 : axis.max,\n        step: 1,\n        labelStep: 0\n      };\n    };\n\n    const updatedRange = {\n      ...range,\n      ...(includeAxes ? { labelStep: 1 } : noAxesConfig('range'))\n    };\n    const updatedDomain = {\n      ...domain,\n      ...(includeAxes ? { labelStep: 1 } : noAxesConfig('domain'))\n    };\n\n    onChange({ includeAxes, range: updatedRange, domain: updatedDomain });\n  };\n\n  const onStandardGridChanged = value => {\n    onChange({\n      standardGrid: value,\n      range: {\n        ...domain,\n        axisLabel: range.axisLabel\n      },\n      graph: {\n        ...size,\n        height: size.width\n      }\n    });\n  };\n\n  const onSizeChanged = (key, value) => {\n    const graph = { ...size, [key]: value };\n\n    if (standardGrid) {\n      graph.height = value;\n    }\n\n    onChange({ graph });\n  };\n\n  const onDomainChanged = (key, value) => {\n    domain[key] = value;\n\n    if (standardGrid && key !== 'axisLabel') {\n      range[key] = value;\n    }\n\n    onChange({ domain, range });\n  };\n\n  const onRangeChanged = (key, value) => {\n    range[key] = value;\n\n    onChange({ range });\n  };\n\n  const axesConfig = (\n    <React.Fragment>\n      <div className={classes.rowView}>\n        <AxisConfig\n          classes={classes}\n          displayedFields={axisConfigFields}\n          displayHeader={displayAxisType}\n          type=\"domain\"\n          minValue={domain.min}\n          maxValue={domain.max}\n          label={domain.axisLabel}\n          includeAxes={includeAxes}\n          onChange={onDomainChanged}\n        />\n        <AxisConfig\n          classes={classes}\n          displayedFields={axisConfigFields}\n          displayHeader={displayAxisType}\n          type=\"range\"\n          minValue={range.min}\n          maxValue={range.max}\n          label={range.axisLabel}\n          disabled={standardGrid}\n          includeAxes={includeAxes}\n          onChange={onRangeChanged}\n        />\n      </div>\n      {(min.enabled || max.enabled) && (\n        <Typography className={classes.text}>\n          If you want the axis to be visible, use a zero or negative Min Value, and a positive Max\n          Value\n        </Typography>\n      )}\n      {(step.enabled || labelStep.enabled) && (\n        <div className={classes.rowView}>\n          <GridConfig\n            classes={classes}\n            displayedFields={gridConfigFields}\n            gridValue={domain.step}\n            labelValue={domain.labelStep}\n            gridValues={gridValues.domain || []}\n            labelValues={labelValues.domain || []}\n            onChange={onDomainChanged}\n          />\n          <GridConfig\n            classes={classes}\n            disabled={standardGrid}\n            displayedFields={gridConfigFields}\n            gridValue={range.step}\n            labelValue={range.labelStep}\n            gridValues={gridValues.range || []}\n            labelValues={labelValues.range || []}\n            onChange={onRangeChanged}\n          />\n        </div>\n      )}\n      {labelStep.enabled && (\n        <Typography className={classes.text}>\n          For unnumbered gridlines, enter a label interval of 0\n        </Typography>\n      )}\n    </React.Fragment>\n  );\n\n  const gridlinesConfig = max.enabled ? (\n    <div className={classes.columnView}>\n      <NumberTextFieldCustom\n        className={classes.largeTextField}\n        label=\"Number of Horizontal Gridlines\"\n        value={domain.max}\n        min={!includeAxes && gridProps.min}\n        max={!includeAxes && gridProps.max}\n        variant=\"outlined\"\n        onChange={(e, v) => onDomainChanged('max', v)}\n      />\n      <NumberTextFieldCustom\n        className={classes.largeTextField}\n        label=\"Number of Vertical Gridlines\"\n        value={range.max}\n        min={!includeAxes && gridProps.min}\n        max={!includeAxes && gridProps.max}\n        variant=\"outlined\"\n        disabled={standardGrid}\n        onChange={(e, v) => onRangeChanged('max', v)}\n      />\n    </div>\n  ) : null;\n\n  return (\n    <div className={classes.wrapper}>\n      <ExpansionPanel>\n        <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>\n          <Typography variant=\"subtitle1\">Customize Grid Setup</Typography>\n        </ExpansionPanelSummary>\n        <ExpansionPanelDetails>\n          <div className={classes.content}>\n            {includeAxesEnabled && (\n              <Toggle\n                label=\"Include axes and labels?\"\n                toggle={onIncludeAxes}\n                checked={includeAxes}\n              />\n            )}\n            {standardGridEnabled && (\n              <Toggle\n                label=\"Constrain to standard coordinate grid?\"\n                toggle={onStandardGridChanged}\n                checked={standardGrid}\n              />\n            )}\n            {includeAxes ? axesConfig : gridlinesConfig}\n            {dimensionsEnabled && (\n              <div className={classes.dimensions}>\n                <div>\n                  <Typography>Dimensions(px)</Typography>\n                  <Typography className={classes.disabled}>\n                    Min {sizeConstraints.min}, Max {sizeConstraints.max}\n                  </Typography>\n                </div>\n                <NumberTextFieldCustom\n                  className={classes.textField}\n                  label=\"Width\"\n                  value={size.width}\n                  min={sizeConstraints.min}\n                  max={sizeConstraints.max}\n                  step={sizeConstraints.step}\n                  variant=\"outlined\"\n                  onChange={(e, v) => onSizeChanged('width', v)}\n                />\n                <NumberTextFieldCustom\n                  className={classes.textField}\n                  label=\"Height\"\n                  value={size.height}\n                  min={sizeConstraints.min}\n                  max={sizeConstraints.max}\n                  step={sizeConstraints.step}\n                  variant=\"outlined\"\n                  disabled={standardGrid}\n                  onChange={(e, v) => onSizeChanged('height', v)}\n                />\n              </div>\n            )}\n          </div>\n        </ExpansionPanelDetails>\n      </ExpansionPanel>\n    </div>\n  );\n};\n\nGridSetup.propTypes = {\n  classes: PropTypes.object,\n  domain: PropTypes.object,\n  displayedFields: PropTypes.object,\n  gridValues: PropTypes.object,\n  includeAxes: PropTypes.bool,\n  labelValues: PropTypes.object,\n  onChange: PropTypes.function,\n  range: PropTypes.object,\n  size: PropTypes.object,\n  sizeConstraints: PropTypes.object,\n  standardGrid: PropTypes.bool\n};\n\nconst styles = theme => ({\n  wrapper: {\n    width: '450px'\n  },\n  content: {\n    display: 'flex',\n    flexDirection: 'column',\n    width: '100%'\n  },\n  columnView: {\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center'\n  },\n  rowView: {\n    display: 'flex',\n    justifyContent: 'space-around',\n    alignItems: 'center'\n  },\n  textField: {\n    width: '130px',\n    margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n  },\n  mediumTextField: {\n    width: '160px',\n    margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n  },\n  largeTextField: {\n    width: '230px',\n    margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n  },\n  text: {\n    fontStyle: 'italic',\n    margin: `${theme.spacing.unit}px 0`\n  },\n  dimensions: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    alignItems: 'center'\n  },\n  disabled: {\n    color: color.disabled()\n  },\n  axisLabel: {\n    paddingTop: theme.spacing.unit * 2\n  }\n});\n\nexport default withStyles(styles)(GridSetup);\n"],"file":"grid-setup.js"}

package/lib/grid.js

@@ -127,13 +127,6 @@ var Grid = /*#__PURE__*/function (_React$Component) {
   }
 
   _createClass(Grid, [{
-    key: "shouldComponentUpdate",
-    value: function shouldComponentUpdate(nextProps) {
-      var graphProps = this.props.graphProps;
-      var nextGraphProps = nextProps.graphProps;
-      return !_plot.utils.isDomainRangeEqual(graphProps, nextGraphProps);
-    }
-  }, {
     key: "render",
     value: function render() {
       var _this2 = this;

package/lib/grid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/grid.jsx"],"names":["Grid","rowTickValues","columnTickValues","props","graphProps","scale","size","width","height","domain","range","rowTickLabelValues","step","labelStep","filter","value","includes","columnTickLabelValues","minValueLength","length","Math","min","toString","replace","maxValueLength","max","rowLabelLength","horizontalDistanceToZero","x","verticalDistanceToZero","y","columnLabelLength","rowStrokeDasharray","columnStrokeDasharray","displayAdditionalGrid","filteredColumnValues","filteredRowValues","nextProps","nextGraphProps","utils","isDomainRangeEqual","classes","getAdditionalGridProps","r","grid","color","primary","React","Component","disabled","PropTypes","bool","disabledAdditionalGrid","object","isRequired","types","GraphPropsType","stroke"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport * as vx from '@vx/grid';\nimport { types, utils } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport { getTickValues } from './utils';\n\nexport class Grid extends React.Component {\n  static propTypes = {\n    disabled: PropTypes.bool,\n    disabledAdditionalGrid: PropTypes.bool,\n    classes: PropTypes.object.isRequired,\n    graphProps: types.GraphPropsType.isRequired\n  };\n\n  shouldComponentUpdate(nextProps) {\n    const { graphProps } = this.props;\n    const { graphProps: nextGraphProps } = nextProps;\n\n    return !utils.isDomainRangeEqual(graphProps, nextGraphProps);\n  }\n\n  getAdditionalGridProps = (rowTickValues, columnTickValues) => {\n    const {\n      graphProps: {\n        scale,\n        size: { width, height },\n        domain,\n        range\n      }\n    } = this.props;\n    const rowTickLabelValues = getTickValues({\n      ...range,\n      step: range.labelStep\n    }).filter(value => rowTickValues.includes(value));\n    const columnTickLabelValues = getTickValues({\n      ...domain,\n      step: domain.labelStep\n    }).filter(value => columnTickValues.includes(value));\n\n    const minValueLength =\n      (rowTickLabelValues.length &&\n        Math.min(...rowTickLabelValues)\n          .toString()\n          .replace(/[.-]/g, '').length) ||\n      1;\n    const maxValueLength =\n      (rowTickLabelValues.length &&\n        Math.max(...rowTickLabelValues)\n          .toString()\n          .replace(/[.-]/g, '').length) ||\n      1;\n\n    const rowLabelLength = Math.max(minValueLength, maxValueLength) * 9 + 22;\n    const horizontalDistanceToZero = scale.x(0);\n    const verticalDistanceToZero = scale.y(0);\n    const columnLabelLength = 28;\n    const rowStrokeDasharray = `${horizontalDistanceToZero -\n      rowLabelLength} ${rowLabelLength} ${width}`;\n    const columnStrokeDasharray = `${verticalDistanceToZero} ${columnLabelLength} ${height}`;\n\n    const displayAdditionalGrid =\n      domain.labelStep > 0 &&\n      range.labelStep > 0 &&\n      rowTickLabelValues &&\n      columnTickLabelValues &&\n      rowTickLabelValues.length > 1 &&\n      columnTickLabelValues.length > 1 &&\n      (rowTickLabelValues.length !== rowTickValues.length ||\n        columnTickLabelValues.length !== columnTickValues.length);\n\n    const filteredColumnValues = columnTickLabelValues.filter(\n      value => value >= 0 || horizontalDistanceToZero - scale.x(value) > rowLabelLength\n    );\n    const filteredRowValues = rowTickLabelValues.filter(\n      value => value >= 0 || scale.y(value) - verticalDistanceToZero > columnLabelLength\n    );\n\n    return {\n      rowTickLabelValues: filteredRowValues,\n      columnTickLabelValues: filteredColumnValues,\n      rowStrokeDasharray,\n      columnStrokeDasharray,\n      displayAdditionalGrid\n    };\n  };\n\n  render() {\n    const { classes, graphProps } = this.props;\n    const {\n      scale,\n      size: { height, width },\n      domain,\n      range\n    } = graphProps;\n    const rowTickValues = getTickValues(range);\n    const columnTickValues = getTickValues(domain);\n    const {\n      rowTickLabelValues,\n      columnTickLabelValues,\n      rowStrokeDasharray,\n      columnStrokeDasharray,\n      displayAdditionalGrid\n    } = this.getAdditionalGridProps(rowTickValues, columnTickValues);\n\n    return (\n      <>\n        <vx.Grid\n          innerRef={r => (this.grid = r)}\n          xScale={scale.x}\n          yScale={scale.y}\n          width={width}\n          height={height}\n          className={classes.grid}\n          rowTickValues={rowTickValues}\n          columnTickValues={columnTickValues}\n        />\n        {displayAdditionalGrid && (\n          <>\n            <vx.GridRows\n              scale={scale.y}\n              width={width}\n              tickValues={rowTickLabelValues}\n              stroke={color.primary()}\n              strokeDasharray={rowStrokeDasharray}\n            />\n            <vx.GridColumns\n              scale={scale.x}\n              height={height}\n              tickValues={columnTickLabelValues}\n              stroke={color.primary()}\n              strokeDasharray={columnStrokeDasharray}\n            />\n          </>\n        )}\n      </>\n    );\n  }\n}\n\nexport default withStyles(() => ({\n  grid: {\n    stroke: 'purple' // TODO hardcoded color\n  }\n}))(Grid);\n"],"file":"grid.js"}
+{"version":3,"sources":["../src/grid.jsx"],"names":["Grid","rowTickValues","columnTickValues","props","graphProps","scale","size","width","height","domain","range","rowTickLabelValues","step","labelStep","filter","value","includes","columnTickLabelValues","minValueLength","length","Math","min","toString","replace","maxValueLength","max","rowLabelLength","horizontalDistanceToZero","x","verticalDistanceToZero","y","columnLabelLength","rowStrokeDasharray","columnStrokeDasharray","displayAdditionalGrid","filteredColumnValues","filteredRowValues","classes","getAdditionalGridProps","r","grid","color","primary","React","Component","disabled","PropTypes","bool","disabledAdditionalGrid","object","isRequired","types","GraphPropsType","stroke"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport * as vx from '@vx/grid';\nimport { types, utils } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport { getTickValues } from './utils';\n\nexport class Grid extends React.Component {\n  static propTypes = {\n    disabled: PropTypes.bool,\n    disabledAdditionalGrid: PropTypes.bool,\n    classes: PropTypes.object.isRequired,\n    graphProps: types.GraphPropsType.isRequired\n  };\n\n  getAdditionalGridProps = (rowTickValues, columnTickValues) => {\n    const {\n      graphProps: {\n        scale,\n        size: { width, height },\n        domain,\n        range\n      }\n    } = this.props;\n    const rowTickLabelValues = getTickValues({\n      ...range,\n      step: range.labelStep\n    }).filter(value => rowTickValues.includes(value));\n    const columnTickLabelValues = getTickValues({\n      ...domain,\n      step: domain.labelStep\n    }).filter(value => columnTickValues.includes(value));\n\n    const minValueLength =\n      (rowTickLabelValues.length &&\n        Math.min(...rowTickLabelValues)\n          .toString()\n          .replace(/[.-]/g, '').length) ||\n      1;\n    const maxValueLength =\n      (rowTickLabelValues.length &&\n        Math.max(...rowTickLabelValues)\n          .toString()\n          .replace(/[.-]/g, '').length) ||\n      1;\n\n    const rowLabelLength = Math.max(minValueLength, maxValueLength) * 9 + 22;\n    const horizontalDistanceToZero = scale.x(0);\n    const verticalDistanceToZero = scale.y(0);\n    const columnLabelLength = 28;\n    const rowStrokeDasharray = `${horizontalDistanceToZero -\n      rowLabelLength} ${rowLabelLength} ${width}`;\n    const columnStrokeDasharray = `${verticalDistanceToZero} ${columnLabelLength} ${height}`;\n\n    const displayAdditionalGrid =\n      domain.labelStep > 0 &&\n      range.labelStep > 0 &&\n      rowTickLabelValues &&\n      columnTickLabelValues &&\n      rowTickLabelValues.length > 1 &&\n      columnTickLabelValues.length > 1 &&\n      (rowTickLabelValues.length !== rowTickValues.length ||\n        columnTickLabelValues.length !== columnTickValues.length);\n\n    const filteredColumnValues = columnTickLabelValues.filter(\n      value => value >= 0 || horizontalDistanceToZero - scale.x(value) > rowLabelLength\n    );\n    const filteredRowValues = rowTickLabelValues.filter(\n      value => value >= 0 || scale.y(value) - verticalDistanceToZero > columnLabelLength\n    );\n\n    return {\n      rowTickLabelValues: filteredRowValues,\n      columnTickLabelValues: filteredColumnValues,\n      rowStrokeDasharray,\n      columnStrokeDasharray,\n      displayAdditionalGrid\n    };\n  };\n\n  render() {\n    const { classes, graphProps } = this.props;\n    const {\n      scale,\n      size: { height, width },\n      domain,\n      range\n    } = graphProps;\n    const rowTickValues = getTickValues(range);\n    const columnTickValues = getTickValues(domain);\n    const {\n      rowTickLabelValues,\n      columnTickLabelValues,\n      rowStrokeDasharray,\n      columnStrokeDasharray,\n      displayAdditionalGrid\n    } = this.getAdditionalGridProps(rowTickValues, columnTickValues);\n\n    return (\n      <>\n        <vx.Grid\n          innerRef={r => (this.grid = r)}\n          xScale={scale.x}\n          yScale={scale.y}\n          width={width}\n          height={height}\n          className={classes.grid}\n          rowTickValues={rowTickValues}\n          columnTickValues={columnTickValues}\n        />\n        {displayAdditionalGrid && (\n          <>\n            <vx.GridRows\n              scale={scale.y}\n              width={width}\n              tickValues={rowTickLabelValues}\n              stroke={color.primary()}\n              strokeDasharray={rowStrokeDasharray}\n            />\n            <vx.GridColumns\n              scale={scale.x}\n              height={height}\n              tickValues={columnTickLabelValues}\n              stroke={color.primary()}\n              strokeDasharray={columnStrokeDasharray}\n            />\n          </>\n        )}\n      </>\n    );\n  }\n}\n\nexport default withStyles(() => ({\n  grid: {\n    stroke: 'purple' // TODO hardcoded color\n  }\n}))(Grid);\n"],"file":"grid.js"}

package/lib/index.js

@@ -17,6 +17,12 @@ Object.defineProperty(exports, "GraphContainer", {
     return _container["default"];
   }
 });
+Object.defineProperty(exports, "GridSetup", {
+  enumerable: true,
+  get: function get() {
+    return _gridSetup["default"];
+  }
+});
 Object.defineProperty(exports, "ToolMenu", {
   enumerable: true,
   get: function get() {
@@ -29,6 +35,8 @@ var _graph = _interopRequireDefault(require("./graph"));
 
 var _container = _interopRequireDefault(require("./container"));
 
+var _gridSetup = _interopRequireDefault(require("./grid-setup"));
+
 var tools = _interopRequireWildcard(require("./tools"));
 
 exports.tools = tools;

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;AACA","sourcesContent":["import Graph from './graph';\nimport GraphContainer from './container';\nimport * as tools from './tools';\nimport ToolMenu from './tool-menu';\n\nexport { Graph, GraphContainer, ToolMenu, tools };\n"],"file":"index.js"}
+{"version":3,"sources":["../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AACA","sourcesContent":["import Graph from './graph';\nimport GraphContainer from './container';\nimport GridSetup from './grid-setup';\nimport * as tools from './tools';\nimport ToolMenu from './tool-menu';\n\nexport { Graph, GraphContainer, GridSetup, ToolMenu, tools };\n"],"file":"index.js"}

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "2.6.1",
+  "version": "2.7.0",
   "description": "Graphing components",
   "keywords": [
     "react",
@@ -20,7 +20,7 @@
     "@material-ui/core": "^3.8.3",
     "@pie-lib/graphing-utils": "^1.1.20",
     "@pie-lib/plot": "^2.2.0",
-    "@pie-lib/render-ui": "^4.12.7",
+    "@pie-lib/render-ui": "^4.12.9",
     "@vx/axis": "^0.0.189",
     "@vx/clip-path": "^0.0.189",
     "@vx/event": "^0.0.189",
@@ -43,6 +43,6 @@
   "peerDependencies": {
     "react": "^16.8.1"
   },
-  "gitHead": "611d47d0ed9fb2591be8f26cc78a40049e5e70a5",
+  "gitHead": "2f841d92dcda7472f18cbce517eb664dec2f6442",
   "scripts": {}
 }