@pie-lib/graphing 2.9.1 → 2.10.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.10.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/graphing@2.9.1...@pie-lib/graphing@2.10.0) (2022-08-15)
+
+
+### Features
+
+* **graphing, plot:** added pixel guide lines + ui improvements ([02ddff1](https://github.com/pie-framework/pie-lib/commit/02ddff1aed6a279b8a4ae1fcf100c766596c29c4))
+
+
+
+
+
 ## [2.9.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/graphing@2.9.0...@pie-lib/graphing@2.9.1) (2022-08-08)
 
 **Note:** Version bump only for package @pie-lib/graphing

package/lib/axis/axes.js

@@ -164,7 +164,7 @@ var RawXAxis = /*#__PURE__*/function (_React$Component) {
 
       var necessaryRows = (0, _utils.countWords)(domain.axisLabel);
       var longestWord = (0, _utils.findLongestWord)(domain.axisLabel);
-      var necessaryWidth = (0, _utils.amountToIncreaseWidth)(longestWord);
+      var necessaryWidth = (0, _utils.amountToIncreaseWidth)(longestWord) + 2;
       return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_axis.Axis, {
         axisLineClassName: classes.line,
         scale: scale.x,
@@ -191,8 +191,8 @@ var RawXAxis = /*#__PURE__*/function (_React$Component) {
         className: classes.arrow,
         scale: scale
       }), domain.axisLabel && /*#__PURE__*/_react["default"].createElement("foreignObject", {
-        x: size.width + 15,
-        y: scale.y(0) - 10,
+        x: size.width + 17,
+        y: scale.y(0) - 9,
         width: necessaryWidth,
         height: 20 * necessaryRows
       }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -285,7 +285,7 @@ var RawYAxis = /*#__PURE__*/function (_React$Component2) {
         scale: scale
       }), range.axisLabel && /*#__PURE__*/_react["default"].createElement("foreignObject", {
         x: scale.x(0) - necessaryWidth / 2,
-        y: -30,
+        y: -33,
         width: necessaryWidth,
         height: "20"
       }, /*#__PURE__*/_react["default"].createElement(_renderUi.Readable, {

package/lib/axis/axes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/axis/axes.jsx"],"names":["AxisPropTypes","includeArrows","PropTypes","object","graphProps","AxisDefaultProps","left","right","up","down","axisStyles","theme","line","stroke","color","primary","strokeWidth","arrow","fill","tick","labelFontSize","fontSize","typography","axisLabelHolder","padding","margin","textAlign","tickLabelStyles","fontFamily","cursor","sharedValues","firstNegativeX","firstNegativeY","distanceFromOriginToFirstNegativeX","distanceFromOriginToFirstNegativeY","deltaAllowance","dy","result","push","firstNegativeValue","interval","find","element","RawXAxis","props","classes","columnTicksValues","skipValues","scale","domain","size","range","tickValues","labelStep","min","labelProps","label","y","textAnchor","dx","necessaryRows","axisLabel","longestWord","necessaryWidth","x","value","max","width","__html","React","Component","types","GraphPropsType","isRequired","XAxis","RawYAxis","rowTickValues","length","customTickFormat","indexOf","height","digits","toLocaleString","replace","YAxis","Axes","ticks","step","negative","Math","abs","xValues","yValues"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Axis } from '@vx/axis';\nimport { types } from '@pie-lib/plot';\nimport PropTypes from 'prop-types';\nimport Arrow from './arrow';\nimport { withStyles } from '@material-ui/core';\nimport { countWords, findLongestWord, amountToIncreaseWidth, getTickValues } from '../utils';\nimport { color, Readable } from '@pie-lib/render-ui';\n\nexport const AxisPropTypes = {\n  includeArrows: PropTypes.object,\n  graphProps: PropTypes.object\n};\n\nconst AxisDefaultProps = {\n  includeArrows: {\n    left: true,\n    right: true,\n    up: true,\n    down: true\n  }\n};\n\nconst axisStyles = theme => ({\n  line: {\n    stroke: color.primary(),\n    strokeWidth: 5\n  },\n  arrow: {\n    fill: color.primary()\n  },\n  tick: {\n    fill: color.primary(),\n    '& > line': {\n      stroke: color.primary()\n    }\n  },\n  labelFontSize: {\n    fontSize: theme.typography.fontSize\n  },\n  axisLabelHolder: {\n    padding: 0,\n    margin: 0,\n    textAlign: 'center',\n    '* > *': {\n      margin: 0,\n      padding: 0\n    },\n    fontSize: theme.typography.fontSize\n  }\n});\n\nconst tickLabelStyles = {\n  fontFamily: 'Roboto',\n  fontSize: '14px',\n  cursor: 'inherit'\n};\n\nexport const sharedValues = (\n  firstNegativeX,\n  firstNegativeY,\n  distanceFromOriginToFirstNegativeX,\n  distanceFromOriginToFirstNegativeY,\n  deltaAllowance,\n  dy\n) => {\n  let result = [];\n\n  if (\n    firstNegativeX === firstNegativeY &&\n    distanceFromOriginToFirstNegativeX - deltaAllowance < distanceFromOriginToFirstNegativeY &&\n    distanceFromOriginToFirstNegativeY < distanceFromOriginToFirstNegativeX + deltaAllowance &&\n    distanceFromOriginToFirstNegativeX - deltaAllowance < dy &&\n    dy < distanceFromOriginToFirstNegativeX + deltaAllowance\n  ) {\n    result.push(firstNegativeX);\n  }\n\n  return result;\n};\n\nexport const firstNegativeValue = interval => (interval || []).find(element => element < 0);\n\nexport class RawXAxis extends React.Component {\n  static propTypes = {\n    ...AxisPropTypes,\n    classes: PropTypes.object,\n    graphProps: types.GraphPropsType.isRequired\n  };\n  static defaultProps = AxisDefaultProps;\n\n  render() {\n    const {\n      includeArrows,\n      classes,\n      graphProps,\n      columnTicksValues,\n      skipValues,\n      distanceFromOriginToFirstNegativeY,\n      dy\n    } = this.props;\n    const { scale, domain, size, range } = graphProps || {};\n\n    // Having 0 as a number in columnTicksValues does not make 0 to show up\n    // so we use this trick, by defining it as a string:\n    const tickValues =\n      (domain.labelStep || range.labelStep) && domain.min <= 0\n        ? ['0', ...columnTicksValues]\n        : columnTicksValues;\n    // However, the '0' has to be displayed only if other tick labels (y-axis or x-axis) are displayed\n\n    const labelProps = label => {\n      const y = skipValues && skipValues[0] === label ? distanceFromOriginToFirstNegativeY + 4 : dy;\n\n      return {\n        ...tickLabelStyles,\n        textAnchor: 'middle',\n        y: y,\n        dx: label === '0' ? -10 : 0,\n        dy: label === '0' ? -7 : 0\n      };\n    };\n\n    const necessaryRows = countWords(domain.axisLabel);\n    const longestWord = findLongestWord(domain.axisLabel);\n    const necessaryWidth = amountToIncreaseWidth(longestWord);\n\n    return (\n      <React.Fragment>\n        <Axis\n          axisLineClassName={classes.line}\n          scale={scale.x}\n          top={scale.y(0)}\n          left={0}\n          label={domain.label}\n          rangePadding={8}\n          tickClassName={classes.tick}\n          tickFormat={value => value}\n          tickLabelProps={labelProps}\n          tickValues={tickValues}\n        />\n        {includeArrows && includeArrows.left && (\n          <Arrow direction=\"left\" x={domain.min} y={0} className={classes.arrow} scale={scale} />\n        )}\n        {includeArrows && includeArrows.right && (\n          <Arrow direction=\"right\" x={domain.max} y={0} className={classes.arrow} scale={scale} />\n        )}\n        {domain.axisLabel && (\n          <foreignObject\n            x={size.width + 15}\n            y={scale.y(0) - 10}\n            width={necessaryWidth}\n            height={20 * necessaryRows}\n          >\n            <div\n              dangerouslySetInnerHTML={{ __html: domain.axisLabel }}\n              className={classes.labelFontSize}\n            />\n          </foreignObject>\n        )}\n      </React.Fragment>\n    );\n  }\n}\n\nconst XAxis = withStyles(axisStyles)(RawXAxis);\n\nexport class RawYAxis extends React.Component {\n  static propTypes = {\n    ...AxisPropTypes,\n    graphProps: types.GraphPropsType.isRequired\n  };\n  static defaultProps = AxisDefaultProps;\n\n  render() {\n    const { classes, includeArrows, graphProps, skipValues, rowTickValues } = this.props;\n    const { scale, range, size } = graphProps || {};\n\n    const necessaryWidth = range.axisLabel ? amountToIncreaseWidth(range.axisLabel.length) : 0;\n\n    const customTickFormat = value => (skipValues && skipValues.indexOf(value) >= 0 ? '' : value);\n\n    return (\n      <React.Fragment>\n        <Axis\n          axisLineClassName={classes.line}\n          orientation={'left'}\n          scale={scale.y}\n          top={0}\n          height={size.height}\n          left={scale.x(0)}\n          label={range.label}\n          labelProps={{ 'data-pie-readable': false }}\n          rangePadding={8}\n          tickLength={10}\n          tickClassName={classes.tick}\n          tickFormat={customTickFormat}\n          tickLabelProps={value => {\n            let digits = value.toLocaleString().replace(/[.-]/g, '').length || 1;\n\n            return {\n              ...tickLabelStyles,\n              dy: 4,\n              dx: -10 - digits * 9,\n              'data-pie-readable': false\n            };\n          }}\n          hideZero={true}\n          tickTextAnchor={'bottom'}\n          tickValues={rowTickValues}\n        />\n\n        {includeArrows && includeArrows.down && (\n          <Arrow direction=\"down\" x={0} y={range.min} className={classes.arrow} scale={scale} />\n        )}\n        {includeArrows && includeArrows.up && (\n          <Arrow direction=\"up\" x={0} y={range.max} className={classes.arrow} scale={scale} />\n        )}\n        {range.axisLabel && (\n          <foreignObject\n            x={scale.x(0) - necessaryWidth / 2}\n            y={-30}\n            width={necessaryWidth}\n            height=\"20\"\n          >\n            <Readable false>\n              <div\n                dangerouslySetInnerHTML={{ __html: range.axisLabel }}\n                className={classes.axisLabelHolder}\n              />\n            </Readable>\n          </foreignObject>\n        )}\n      </React.Fragment>\n    );\n  }\n}\n\nconst YAxis = withStyles(axisStyles)(RawYAxis);\n\nexport default class Axes extends React.Component {\n  static propTypes = {\n    ...AxisPropTypes,\n    classes: PropTypes.object,\n    graphProps: types.GraphPropsType.isRequired\n  };\n  static defaultProps = AxisDefaultProps;\n\n  xValues = () => {\n    const { graphProps } = this.props;\n    const { scale, domain } = graphProps || {};\n\n    if (!domain || !scale) {\n      return;\n    }\n\n    const ticks = getTickValues({ ...domain, step: domain.labelStep });\n    const negative = firstNegativeValue(ticks);\n\n    return {\n      columnTicksValues: ticks,\n      firstNegativeX: negative,\n      distanceFromOriginToFirstNegativeX: Math.abs(scale.y(0) - scale.y(negative))\n    };\n  };\n\n  yValues = () => {\n    const { graphProps } = this.props;\n    const { scale, range } = graphProps || {};\n\n    if (!range || !scale) {\n      return;\n    }\n\n    const ticks = getTickValues({ ...range, step: range.labelStep });\n    const negative = firstNegativeValue(ticks);\n\n    return {\n      rowTickValues: ticks,\n      firstNegativeY: negative,\n      distanceFromOriginToFirstNegativeY: Math.abs(scale.x(0) - scale.x(negative))\n    };\n  };\n\n  render() {\n    const { graphProps } = this.props;\n    const { domain, range } = graphProps || {};\n    const {\n      columnTicksValues,\n      firstNegativeX,\n      distanceFromOriginToFirstNegativeX\n    } = this.xValues();\n    const { rowTickValues, firstNegativeY, distanceFromOriginToFirstNegativeY } = this.yValues();\n    const deltaAllowance = 6;\n    const dy = 25;\n\n    const skipValues = sharedValues(\n      firstNegativeX,\n      firstNegativeY,\n      distanceFromOriginToFirstNegativeX,\n      distanceFromOriginToFirstNegativeY,\n      deltaAllowance,\n      dy\n    );\n\n    // each axis has to be displayed only if the domain & range include it\n    return (\n      <React.Fragment>\n        {range.min <= 0 ? (\n          <XAxis\n            {...this.props}\n            skipValues={skipValues}\n            columnTicksValues={columnTicksValues}\n            distanceFromOriginToFirstNegativeY={distanceFromOriginToFirstNegativeY}\n            dy={dy}\n          />\n        ) : null}\n        {domain.min <= 0 ? (\n          <YAxis\n            {...this.props}\n            skipValues={skipValues}\n            rowTickValues={rowTickValues}\n            distanceFromOriginToFirstNegativeX={distanceFromOriginToFirstNegativeX}\n          />\n        ) : null}\n      </React.Fragment>\n    );\n  }\n}\n"],"file":"axes.js"}
+{"version":3,"sources":["../../src/axis/axes.jsx"],"names":["AxisPropTypes","includeArrows","PropTypes","object","graphProps","AxisDefaultProps","left","right","up","down","axisStyles","theme","line","stroke","color","primary","strokeWidth","arrow","fill","tick","labelFontSize","fontSize","typography","axisLabelHolder","padding","margin","textAlign","tickLabelStyles","fontFamily","cursor","sharedValues","firstNegativeX","firstNegativeY","distanceFromOriginToFirstNegativeX","distanceFromOriginToFirstNegativeY","deltaAllowance","dy","result","push","firstNegativeValue","interval","find","element","RawXAxis","props","classes","columnTicksValues","skipValues","scale","domain","size","range","tickValues","labelStep","min","labelProps","label","y","textAnchor","dx","necessaryRows","axisLabel","longestWord","necessaryWidth","x","value","max","width","__html","React","Component","types","GraphPropsType","isRequired","XAxis","RawYAxis","rowTickValues","length","customTickFormat","indexOf","height","digits","toLocaleString","replace","YAxis","Axes","ticks","step","negative","Math","abs","xValues","yValues"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Axis } from '@vx/axis';\nimport { types } from '@pie-lib/plot';\nimport PropTypes from 'prop-types';\nimport Arrow from './arrow';\nimport { withStyles } from '@material-ui/core';\nimport { countWords, findLongestWord, amountToIncreaseWidth, getTickValues } from '../utils';\nimport { color, Readable } from '@pie-lib/render-ui';\n\nexport const AxisPropTypes = {\n  includeArrows: PropTypes.object,\n  graphProps: PropTypes.object\n};\n\nconst AxisDefaultProps = {\n  includeArrows: {\n    left: true,\n    right: true,\n    up: true,\n    down: true\n  }\n};\n\nconst axisStyles = theme => ({\n  line: {\n    stroke: color.primary(),\n    strokeWidth: 5\n  },\n  arrow: {\n    fill: color.primary()\n  },\n  tick: {\n    fill: color.primary(),\n    '& > line': {\n      stroke: color.primary()\n    }\n  },\n  labelFontSize: {\n    fontSize: theme.typography.fontSize\n  },\n  axisLabelHolder: {\n    padding: 0,\n    margin: 0,\n    textAlign: 'center',\n    '* > *': {\n      margin: 0,\n      padding: 0\n    },\n    fontSize: theme.typography.fontSize\n  }\n});\n\nconst tickLabelStyles = {\n  fontFamily: 'Roboto',\n  fontSize: '14px',\n  cursor: 'inherit'\n};\n\nexport const sharedValues = (\n  firstNegativeX,\n  firstNegativeY,\n  distanceFromOriginToFirstNegativeX,\n  distanceFromOriginToFirstNegativeY,\n  deltaAllowance,\n  dy\n) => {\n  let result = [];\n\n  if (\n    firstNegativeX === firstNegativeY &&\n    distanceFromOriginToFirstNegativeX - deltaAllowance < distanceFromOriginToFirstNegativeY &&\n    distanceFromOriginToFirstNegativeY < distanceFromOriginToFirstNegativeX + deltaAllowance &&\n    distanceFromOriginToFirstNegativeX - deltaAllowance < dy &&\n    dy < distanceFromOriginToFirstNegativeX + deltaAllowance\n  ) {\n    result.push(firstNegativeX);\n  }\n\n  return result;\n};\n\nexport const firstNegativeValue = interval => (interval || []).find(element => element < 0);\n\nexport class RawXAxis extends React.Component {\n  static propTypes = {\n    ...AxisPropTypes,\n    classes: PropTypes.object,\n    graphProps: types.GraphPropsType.isRequired\n  };\n  static defaultProps = AxisDefaultProps;\n\n  render() {\n    const {\n      includeArrows,\n      classes,\n      graphProps,\n      columnTicksValues,\n      skipValues,\n      distanceFromOriginToFirstNegativeY,\n      dy\n    } = this.props;\n    const { scale, domain, size, range } = graphProps || {};\n\n    // Having 0 as a number in columnTicksValues does not make 0 to show up\n    // so we use this trick, by defining it as a string:\n    const tickValues =\n      (domain.labelStep || range.labelStep) && domain.min <= 0\n        ? ['0', ...columnTicksValues]\n        : columnTicksValues;\n    // However, the '0' has to be displayed only if other tick labels (y-axis or x-axis) are displayed\n\n    const labelProps = label => {\n      const y = skipValues && skipValues[0] === label ? distanceFromOriginToFirstNegativeY + 4 : dy;\n\n      return {\n        ...tickLabelStyles,\n        textAnchor: 'middle',\n        y: y,\n        dx: label === '0' ? -10 : 0,\n        dy: label === '0' ? -7 : 0\n      };\n    };\n\n    const necessaryRows = countWords(domain.axisLabel);\n    const longestWord = findLongestWord(domain.axisLabel);\n    const necessaryWidth = amountToIncreaseWidth(longestWord) + 2;\n\n    return (\n      <React.Fragment>\n        <Axis\n          axisLineClassName={classes.line}\n          scale={scale.x}\n          top={scale.y(0)}\n          left={0}\n          label={domain.label}\n          rangePadding={8}\n          tickClassName={classes.tick}\n          tickFormat={value => value}\n          tickLabelProps={labelProps}\n          tickValues={tickValues}\n        />\n        {includeArrows && includeArrows.left && (\n          <Arrow direction=\"left\" x={domain.min} y={0} className={classes.arrow} scale={scale} />\n        )}\n        {includeArrows && includeArrows.right && (\n          <Arrow direction=\"right\" x={domain.max} y={0} className={classes.arrow} scale={scale} />\n        )}\n        {domain.axisLabel && (\n          <foreignObject\n            x={size.width + 17}\n            y={scale.y(0) - 9}\n            width={necessaryWidth}\n            height={20 * necessaryRows}\n          >\n            <div\n              dangerouslySetInnerHTML={{ __html: domain.axisLabel }}\n              className={classes.labelFontSize}\n            />\n          </foreignObject>\n        )}\n      </React.Fragment>\n    );\n  }\n}\n\nconst XAxis = withStyles(axisStyles)(RawXAxis);\n\nexport class RawYAxis extends React.Component {\n  static propTypes = {\n    ...AxisPropTypes,\n    graphProps: types.GraphPropsType.isRequired\n  };\n  static defaultProps = AxisDefaultProps;\n\n  render() {\n    const { classes, includeArrows, graphProps, skipValues, rowTickValues } = this.props;\n    const { scale, range, size } = graphProps || {};\n\n    const necessaryWidth = range.axisLabel ? amountToIncreaseWidth(range.axisLabel.length) : 0;\n\n    const customTickFormat = value => (skipValues && skipValues.indexOf(value) >= 0 ? '' : value);\n\n    return (\n      <React.Fragment>\n        <Axis\n          axisLineClassName={classes.line}\n          orientation={'left'}\n          scale={scale.y}\n          top={0}\n          height={size.height}\n          left={scale.x(0)}\n          label={range.label}\n          labelProps={{ 'data-pie-readable': false }}\n          rangePadding={8}\n          tickLength={10}\n          tickClassName={classes.tick}\n          tickFormat={customTickFormat}\n          tickLabelProps={value => {\n            let digits = value.toLocaleString().replace(/[.-]/g, '').length || 1;\n\n            return {\n              ...tickLabelStyles,\n              dy: 4,\n              dx: -10 - digits * 9,\n              'data-pie-readable': false\n            };\n          }}\n          hideZero={true}\n          tickTextAnchor={'bottom'}\n          tickValues={rowTickValues}\n        />\n\n        {includeArrows && includeArrows.down && (\n          <Arrow direction=\"down\" x={0} y={range.min} className={classes.arrow} scale={scale} />\n        )}\n        {includeArrows && includeArrows.up && (\n          <Arrow direction=\"up\" x={0} y={range.max} className={classes.arrow} scale={scale} />\n        )}\n        {range.axisLabel && (\n          <foreignObject\n            x={scale.x(0) - necessaryWidth / 2}\n            y={-33}\n            width={necessaryWidth}\n            height=\"20\"\n          >\n            <Readable false>\n              <div\n                dangerouslySetInnerHTML={{ __html: range.axisLabel }}\n                className={classes.axisLabelHolder}\n              />\n            </Readable>\n          </foreignObject>\n        )}\n      </React.Fragment>\n    );\n  }\n}\n\nconst YAxis = withStyles(axisStyles)(RawYAxis);\n\nexport default class Axes extends React.Component {\n  static propTypes = {\n    ...AxisPropTypes,\n    classes: PropTypes.object,\n    graphProps: types.GraphPropsType.isRequired\n  };\n  static defaultProps = AxisDefaultProps;\n\n  xValues = () => {\n    const { graphProps } = this.props;\n    const { scale, domain } = graphProps || {};\n\n    if (!domain || !scale) {\n      return;\n    }\n\n    const ticks = getTickValues({ ...domain, step: domain.labelStep });\n    const negative = firstNegativeValue(ticks);\n\n    return {\n      columnTicksValues: ticks,\n      firstNegativeX: negative,\n      distanceFromOriginToFirstNegativeX: Math.abs(scale.y(0) - scale.y(negative))\n    };\n  };\n\n  yValues = () => {\n    const { graphProps } = this.props;\n    const { scale, range } = graphProps || {};\n\n    if (!range || !scale) {\n      return;\n    }\n\n    const ticks = getTickValues({ ...range, step: range.labelStep });\n    const negative = firstNegativeValue(ticks);\n\n    return {\n      rowTickValues: ticks,\n      firstNegativeY: negative,\n      distanceFromOriginToFirstNegativeY: Math.abs(scale.x(0) - scale.x(negative))\n    };\n  };\n\n  render() {\n    const { graphProps } = this.props;\n    const { domain, range } = graphProps || {};\n    const {\n      columnTicksValues,\n      firstNegativeX,\n      distanceFromOriginToFirstNegativeX\n    } = this.xValues();\n    const { rowTickValues, firstNegativeY, distanceFromOriginToFirstNegativeY } = this.yValues();\n    const deltaAllowance = 6;\n    const dy = 25;\n\n    const skipValues = sharedValues(\n      firstNegativeX,\n      firstNegativeY,\n      distanceFromOriginToFirstNegativeX,\n      distanceFromOriginToFirstNegativeY,\n      deltaAllowance,\n      dy\n    );\n\n    // each axis has to be displayed only if the domain & range include it\n    return (\n      <React.Fragment>\n        {range.min <= 0 ? (\n          <XAxis\n            {...this.props}\n            skipValues={skipValues}\n            columnTicksValues={columnTicksValues}\n            distanceFromOriginToFirstNegativeY={distanceFromOriginToFirstNegativeY}\n            dy={dy}\n          />\n        ) : null}\n        {domain.min <= 0 ? (\n          <YAxis\n            {...this.props}\n            skipValues={skipValues}\n            rowTickValues={rowTickValues}\n            distanceFromOriginToFirstNegativeX={distanceFromOriginToFirstNegativeX}\n          />\n        ) : null}\n      </React.Fragment>\n    );\n  }\n}\n"],"file":"axes.js"}

package/lib/graph-with-controls.js

@@ -207,6 +207,7 @@ var GraphWithControls = /*#__PURE__*/function (_React$Component) {
           domain = _this$props.domain,
           draggableTools = _this$props.draggableTools,
           labels = _this$props.labels,
+          labelsPlaceholders = _this$props.labelsPlaceholders,
           onChangeLabels = _this$props.onChangeLabels,
           onChangeMarks = _this$props.onChangeMarks,
           onChangeTitle = _this$props.onChangeTitle,
@@ -217,8 +218,10 @@ var GraphWithControls = /*#__PURE__*/function (_React$Component) {
           range = _this$props.range,
           size = _this$props.size,
           showLabels = _this$props.showLabels,
+          showPixelGuides = _this$props.showPixelGuides,
           showTitle = _this$props.showTitle,
-          title = _this$props.title;
+          title = _this$props.title,
+          titlePlaceholder = _this$props.titlePlaceholder;
       var _this$props2 = this.props,
           backgroundMarks = _this$props2.backgroundMarks,
           marks = _this$props2.marks,
@@ -275,6 +278,7 @@ var GraphWithControls = /*#__PURE__*/function (_React$Component) {
         domain: domain,
         labels: labels,
         labelModeEnabled: labelModeEnabled,
+        labelsPlaceholders: labelsPlaceholders,
         marks: marks,
         onChangeMarks: !disabled ? onChangeMarks : undefined,
         onChangeLabels: onChangeLabels,
@@ -282,8 +286,10 @@ var GraphWithControls = /*#__PURE__*/function (_React$Component) {
         range: range,
         size: size,
         showLabels: showLabels,
+        showPixelGuides: showPixelGuides,
         showTitle: showTitle,
         title: title,
+        titlePlaceholder: titlePlaceholder,
         tools: tools
       }));
     }
@@ -311,9 +317,12 @@ exports.GraphWithControls = GraphWithControls;
 
 var styles = function styles(theme) {
   return {
-    graphWithControls: {},
+    graphWithControls: {
+      display: 'flex',
+      flexDirection: 'column',
+      width: 'min-content'
+    },
     controls: {
-      width: 'inherit',
       display: 'flex',
       justifyContent: 'space-between',
       padding: theme.spacing.unit,
@@ -328,7 +337,8 @@ var styles = function styles(theme) {
       }
     },
     expansionPanel: {
-      backgroundColor: _renderUi.color.primaryLight()
+      backgroundColor: _renderUi.color.primaryLight(),
+      width: '100%'
     },
     summaryRoot: {
       padding: "0 ".concat(theme.spacing.unit, "px"),
@@ -339,7 +349,9 @@ var styles = function styles(theme) {
     },
     details: {
       padding: 0,
-      marginTop: theme.spacing.unit
+      marginTop: theme.spacing.unit,
+      display: 'flex',
+      justifyContent: 'space-between'
     }
   };
 };

package/lib/graph-with-controls.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/graph-with-controls.jsx"],"names":["setToolbarAvailability","toolbarTools","toolsArr","map","tA","toolbar","find","t","type","toolIsAvailable","tools","currentTool","tool","getAvailableTool","filterByValidToolTypes","backgroundMarks","filter","bM","allTools","filterByVisibleToolTypes","marks","getDefaultCurrentTool","toolType","Collapsible","classes","children","title","expansionPanel","root","summaryRoot","content","summaryContent","details","propTypes","PropTypes","object","array","string","GraphWithControls","props","setState","state","labelModeEnabled","defaultTool","prevProps","axesSettings","className","coordinatesOnHover","collapsibleToolbar","collapsibleToolbarTitle","disabled","disabledLabels","disabledTitle","domain","draggableTools","labels","onChangeLabels","onChangeMarks","onChangeTitle","onChangeTools","onUndo","onRedo","onReset","range","size","showLabels","showTitle","tT","graphActions","changeCurrentTool","toggleLabelMode","graphWithControls","controls","r","labelNode","undefined","React","Component","graphPropTypes","func","arrayOf","styles","theme","width","display","justifyContent","padding","spacing","unit","color","text","backgroundColor","primaryLight","borderTop","primaryDark","borderBottom","borderLeft","borderRight","fontSize","typography","minHeight","margin","marginTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport uniq from 'lodash/uniq';\nimport isString from 'lodash/isString';\nimport { color } from '@pie-lib/render-ui';\n\nimport ToolMenu from './tool-menu';\nimport Graph, { graphPropTypes } from './graph';\nimport UndoRedo from './undo-redo';\nimport { allTools, toolsArr } from './tools';\nimport {\n  ExpansionPanel,\n  ExpansionPanelDetails,\n  ExpansionPanelSummary,\n  Typography\n} from '@material-ui/core';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\n\nexport const setToolbarAvailability = toolbarTools =>\n  toolsArr.map(tA => ({ ...tA, toolbar: !!toolbarTools.find(t => t === tA.type) })) || [];\n\nexport const toolIsAvailable = (tools, currentTool) =>\n  currentTool && tools && (tools.find(tool => tool.type === currentTool.type) || {}).toolbar;\n\nexport const getAvailableTool = tools => tools.find(tool => tool.toolbar);\n\nexport const filterByValidToolTypes = backgroundMarks =>\n  backgroundMarks.filter(bM => !!allTools.find(tool => tool === bM.type));\n\nexport const filterByVisibleToolTypes = (toolbarTools, marks) =>\n  marks.filter(bM => !!toolbarTools.find(tool => tool === bM.type));\n\nconst getDefaultCurrentTool = toolType => toolsArr.find(tool => tool.type === toolType) || null;\n\nconst Collapsible = ({ classes, children, title }) => (\n  <ExpansionPanel\n    elevation={0}\n    className={classes.expansionPanel}\n    disabledGutters={true}\n    square={true}\n  >\n    <ExpansionPanelSummary\n      classes={{\n        root: classes.summaryRoot,\n        content: classes.summaryContent\n      }}\n      expandIcon={<ExpandMoreIcon />}\n    >\n      <Typography variant=\"subheading\">{title}</Typography>\n    </ExpansionPanelSummary>\n    <ExpansionPanelDetails className={classes.details}>{children}</ExpansionPanelDetails>\n  </ExpansionPanel>\n);\n\nCollapsible.propTypes = {\n  classes: PropTypes.object,\n  children: PropTypes.array,\n  title: PropTypes.string\n};\n\nexport class GraphWithControls extends React.Component {\n  static propTypes = {\n    ...graphPropTypes,\n    onUndo: PropTypes.func,\n    onRedo: PropTypes.func,\n    onReset: PropTypes.func,\n    toolbarTools: PropTypes.arrayOf(PropTypes.string) // array of tool types that have to be displayed in the toolbar, same shape as 'allTools'\n  };\n\n  static defaultProps = {\n    collapsibleToolbar: false,\n    collapsibleToolbarTitle: '',\n    disabledLabels: false,\n    disabledTitle: false,\n    showLabels: true,\n    showTitle: true,\n    toolbarTools: []\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      currentTool: getDefaultCurrentTool(props.defaultTool),\n      labelModeEnabled: false\n    };\n  }\n\n  componentDidUpdate(prevProps) {\n    const { defaultTool } = this.props;\n\n    if (prevProps.defaultTool !== defaultTool) {\n      const currentTool = getDefaultCurrentTool(defaultTool);\n\n      this.setState({ currentTool });\n    }\n  }\n\n  changeCurrentTool = (tool, tools) =>\n    this.setState({ currentTool: tools.find(t => t.type === tool) });\n\n  toggleLabelMode = () => this.setState(state => ({ labelModeEnabled: !state.labelModeEnabled }));\n\n  render() {\n    let { currentTool, labelModeEnabled } = this.state;\n    const {\n      axesSettings,\n      classes,\n      className,\n      coordinatesOnHover,\n      collapsibleToolbar,\n      collapsibleToolbarTitle,\n      disabled,\n      disabledLabels,\n      disabledTitle,\n      domain,\n      draggableTools,\n      labels,\n      onChangeLabels,\n      onChangeMarks,\n      onChangeTitle,\n      onChangeTools,\n      onUndo,\n      onRedo,\n      onReset,\n      range,\n      size,\n      showLabels,\n      showTitle,\n      title\n    } = this.props;\n    let { backgroundMarks, marks, toolbarTools } = this.props;\n\n    // make sure only valid tool types are kept (string) and without duplicates\n    toolbarTools = uniq(toolbarTools || []).filter(tT => !!isString(tT)) || [];\n\n    // keep only the backgroundMarks that have valid types\n    backgroundMarks = filterByValidToolTypes(backgroundMarks || []);\n\n    // keep only the marks that have types which appear in toolbar\n    marks = filterByVisibleToolTypes(toolbarTools, marks || []);\n\n    const tools = setToolbarAvailability(toolbarTools);\n\n    // set current tool if there's no current tool or if the existing one is no longer available\n    if (!currentTool || !toolIsAvailable(tools, currentTool)) {\n      currentTool = getAvailableTool(tools);\n    }\n\n    const graphActions = (\n      <React.Fragment>\n        <ToolMenu\n          currentToolType={currentTool && currentTool.type}\n          disabled={!!disabled}\n          draggableTools={draggableTools}\n          labelModeEnabled={labelModeEnabled}\n          onChange={tool => this.changeCurrentTool(tool, tools)}\n          onToggleLabelMode={this.toggleLabelMode}\n          toolbarTools={toolbarTools}\n          onChangeTools={onChangeTools}\n        />\n\n        {!disabled && <UndoRedo onUndo={onUndo} onRedo={onRedo} onReset={onReset} />}\n      </React.Fragment>\n    );\n\n    return (\n      <div className={classNames(classes.graphWithControls, className)}>\n        <div className={classes.controls}>\n          {collapsibleToolbar ? (\n            <Collapsible classes={classes} title={collapsibleToolbarTitle}>\n              {graphActions}\n            </Collapsible>\n          ) : (\n            graphActions\n          )}\n        </div>\n\n        <div ref={r => (this.labelNode = r)} />\n\n        <Graph\n          axesSettings={axesSettings}\n          backgroundMarks={backgroundMarks}\n          coordinatesOnHover={coordinatesOnHover}\n          currentTool={currentTool}\n          disabledLabels={disabledLabels}\n          disabledTitle={disabledTitle}\n          domain={domain}\n          labels={labels}\n          labelModeEnabled={labelModeEnabled}\n          marks={marks}\n          onChangeMarks={!disabled ? onChangeMarks : undefined}\n          onChangeLabels={onChangeLabels}\n          onChangeTitle={onChangeTitle}\n          range={range}\n          size={size}\n          showLabels={showLabels}\n          showTitle={showTitle}\n          title={title}\n          tools={tools}\n        />\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  graphWithControls: {},\n  controls: {\n    width: 'inherit',\n    display: 'flex',\n    justifyContent: 'space-between',\n    padding: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.primaryLight(),\n    borderTop: `solid 1px ${color.primaryDark()}`,\n    borderBottom: `solid 0px ${color.primaryDark()}`,\n    borderLeft: `solid 1px ${color.primaryDark()}`,\n    borderRight: `solid 1px ${color.primaryDark()}`,\n    '& button': {\n      fontSize: theme.typography.fontSize\n    }\n  },\n  expansionPanel: {\n    backgroundColor: color.primaryLight()\n  },\n  summaryRoot: {\n    padding: `0 ${theme.spacing.unit}px`,\n    minHeight: '32px !important'\n  },\n  summaryContent: {\n    margin: '4px 0 !important'\n  },\n  details: {\n    padding: 0,\n    marginTop: theme.spacing.unit\n  }\n});\n\nexport default withStyles(styles)(GraphWithControls);\n"],"file":"graph-with-controls.js"}
+{"version":3,"sources":["../src/graph-with-controls.jsx"],"names":["setToolbarAvailability","toolbarTools","toolsArr","map","tA","toolbar","find","t","type","toolIsAvailable","tools","currentTool","tool","getAvailableTool","filterByValidToolTypes","backgroundMarks","filter","bM","allTools","filterByVisibleToolTypes","marks","getDefaultCurrentTool","toolType","Collapsible","classes","children","title","expansionPanel","root","summaryRoot","content","summaryContent","details","propTypes","PropTypes","object","array","string","GraphWithControls","props","setState","state","labelModeEnabled","defaultTool","prevProps","axesSettings","className","coordinatesOnHover","collapsibleToolbar","collapsibleToolbarTitle","disabled","disabledLabels","disabledTitle","domain","draggableTools","labels","labelsPlaceholders","onChangeLabels","onChangeMarks","onChangeTitle","onChangeTools","onUndo","onRedo","onReset","range","size","showLabels","showPixelGuides","showTitle","titlePlaceholder","tT","graphActions","changeCurrentTool","toggleLabelMode","graphWithControls","controls","r","labelNode","undefined","React","Component","graphPropTypes","func","arrayOf","styles","theme","display","flexDirection","width","justifyContent","padding","spacing","unit","color","text","backgroundColor","primaryLight","borderTop","primaryDark","borderBottom","borderLeft","borderRight","fontSize","typography","minHeight","margin","marginTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport uniq from 'lodash/uniq';\nimport isString from 'lodash/isString';\nimport { color } from '@pie-lib/render-ui';\n\nimport ToolMenu from './tool-menu';\nimport Graph, { graphPropTypes } from './graph';\nimport UndoRedo from './undo-redo';\nimport { allTools, toolsArr } from './tools';\nimport {\n  ExpansionPanel,\n  ExpansionPanelDetails,\n  ExpansionPanelSummary,\n  Typography\n} from '@material-ui/core';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\n\nexport const setToolbarAvailability = toolbarTools =>\n  toolsArr.map(tA => ({ ...tA, toolbar: !!toolbarTools.find(t => t === tA.type) })) || [];\n\nexport const toolIsAvailable = (tools, currentTool) =>\n  currentTool && tools && (tools.find(tool => tool.type === currentTool.type) || {}).toolbar;\n\nexport const getAvailableTool = tools => tools.find(tool => tool.toolbar);\n\nexport const filterByValidToolTypes = backgroundMarks =>\n  backgroundMarks.filter(bM => !!allTools.find(tool => tool === bM.type));\n\nexport const filterByVisibleToolTypes = (toolbarTools, marks) =>\n  marks.filter(bM => !!toolbarTools.find(tool => tool === bM.type));\n\nconst getDefaultCurrentTool = toolType => toolsArr.find(tool => tool.type === toolType) || null;\n\nconst Collapsible = ({ classes, children, title }) => (\n  <ExpansionPanel\n    elevation={0}\n    className={classes.expansionPanel}\n    disabledGutters={true}\n    square={true}\n  >\n    <ExpansionPanelSummary\n      classes={{\n        root: classes.summaryRoot,\n        content: classes.summaryContent\n      }}\n      expandIcon={<ExpandMoreIcon />}\n    >\n      <Typography variant=\"subheading\">{title}</Typography>\n    </ExpansionPanelSummary>\n    <ExpansionPanelDetails className={classes.details}>{children}</ExpansionPanelDetails>\n  </ExpansionPanel>\n);\n\nCollapsible.propTypes = {\n  classes: PropTypes.object,\n  children: PropTypes.array,\n  title: PropTypes.string\n};\n\nexport class GraphWithControls extends React.Component {\n  static propTypes = {\n    ...graphPropTypes,\n    onUndo: PropTypes.func,\n    onRedo: PropTypes.func,\n    onReset: PropTypes.func,\n    toolbarTools: PropTypes.arrayOf(PropTypes.string) // array of tool types that have to be displayed in the toolbar, same shape as 'allTools'\n  };\n\n  static defaultProps = {\n    collapsibleToolbar: false,\n    collapsibleToolbarTitle: '',\n    disabledLabels: false,\n    disabledTitle: false,\n    showLabels: true,\n    showTitle: true,\n    toolbarTools: []\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      currentTool: getDefaultCurrentTool(props.defaultTool),\n      labelModeEnabled: false\n    };\n  }\n\n  componentDidUpdate(prevProps) {\n    const { defaultTool } = this.props;\n\n    if (prevProps.defaultTool !== defaultTool) {\n      const currentTool = getDefaultCurrentTool(defaultTool);\n\n      this.setState({ currentTool });\n    }\n  }\n\n  changeCurrentTool = (tool, tools) =>\n    this.setState({ currentTool: tools.find(t => t.type === tool) });\n\n  toggleLabelMode = () => this.setState(state => ({ labelModeEnabled: !state.labelModeEnabled }));\n\n  render() {\n    let { currentTool, labelModeEnabled } = this.state;\n    const {\n      axesSettings,\n      classes,\n      className,\n      coordinatesOnHover,\n      collapsibleToolbar,\n      collapsibleToolbarTitle,\n      disabled,\n      disabledLabels,\n      disabledTitle,\n      domain,\n      draggableTools,\n      labels,\n      labelsPlaceholders,\n      onChangeLabels,\n      onChangeMarks,\n      onChangeTitle,\n      onChangeTools,\n      onUndo,\n      onRedo,\n      onReset,\n      range,\n      size,\n      showLabels,\n      showPixelGuides,\n      showTitle,\n      title,\n      titlePlaceholder\n    } = this.props;\n    let { backgroundMarks, marks, toolbarTools } = this.props;\n\n    // make sure only valid tool types are kept (string) and without duplicates\n    toolbarTools = uniq(toolbarTools || []).filter(tT => !!isString(tT)) || [];\n\n    // keep only the backgroundMarks that have valid types\n    backgroundMarks = filterByValidToolTypes(backgroundMarks || []);\n\n    // keep only the marks that have types which appear in toolbar\n    marks = filterByVisibleToolTypes(toolbarTools, marks || []);\n\n    const tools = setToolbarAvailability(toolbarTools);\n\n    // set current tool if there's no current tool or if the existing one is no longer available\n    if (!currentTool || !toolIsAvailable(tools, currentTool)) {\n      currentTool = getAvailableTool(tools);\n    }\n\n    const graphActions = (\n      <React.Fragment>\n        <ToolMenu\n          currentToolType={currentTool && currentTool.type}\n          disabled={!!disabled}\n          draggableTools={draggableTools}\n          labelModeEnabled={labelModeEnabled}\n          onChange={tool => this.changeCurrentTool(tool, tools)}\n          onToggleLabelMode={this.toggleLabelMode}\n          toolbarTools={toolbarTools}\n          onChangeTools={onChangeTools}\n        />\n\n        {!disabled && <UndoRedo onUndo={onUndo} onRedo={onRedo} onReset={onReset} />}\n      </React.Fragment>\n    );\n\n    return (\n      <div className={classNames(classes.graphWithControls, className)}>\n        <div className={classes.controls}>\n          {collapsibleToolbar ? (\n            <Collapsible classes={classes} title={collapsibleToolbarTitle}>\n              {graphActions}\n            </Collapsible>\n          ) : (\n            graphActions\n          )}\n        </div>\n\n        <div ref={r => (this.labelNode = r)} />\n\n        <Graph\n          axesSettings={axesSettings}\n          backgroundMarks={backgroundMarks}\n          coordinatesOnHover={coordinatesOnHover}\n          currentTool={currentTool}\n          disabledLabels={disabledLabels}\n          disabledTitle={disabledTitle}\n          domain={domain}\n          labels={labels}\n          labelModeEnabled={labelModeEnabled}\n          labelsPlaceholders={labelsPlaceholders}\n          marks={marks}\n          onChangeMarks={!disabled ? onChangeMarks : undefined}\n          onChangeLabels={onChangeLabels}\n          onChangeTitle={onChangeTitle}\n          range={range}\n          size={size}\n          showLabels={showLabels}\n          showPixelGuides={showPixelGuides}\n          showTitle={showTitle}\n          title={title}\n          titlePlaceholder={titlePlaceholder}\n          tools={tools}\n        />\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  graphWithControls: {\n    display: 'flex',\n    flexDirection: 'column',\n    width: 'min-content'\n  },\n  controls: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    padding: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.primaryLight(),\n    borderTop: `solid 1px ${color.primaryDark()}`,\n    borderBottom: `solid 0px ${color.primaryDark()}`,\n    borderLeft: `solid 1px ${color.primaryDark()}`,\n    borderRight: `solid 1px ${color.primaryDark()}`,\n    '& button': {\n      fontSize: theme.typography.fontSize\n    }\n  },\n  expansionPanel: {\n    backgroundColor: color.primaryLight(),\n    width: '100%'\n  },\n  summaryRoot: {\n    padding: `0 ${theme.spacing.unit}px`,\n    minHeight: '32px !important'\n  },\n  summaryContent: {\n    margin: '4px 0 !important'\n  },\n  details: {\n    padding: 0,\n    marginTop: theme.spacing.unit,\n    display: 'flex',\n    justifyContent: 'space-between'\n  }\n});\n\nexport default withStyles(styles)(GraphWithControls);\n"],"file":"graph-with-controls.js"}

package/lib/graph.js

@@ -84,6 +84,7 @@ var graphPropTypes = {
     height: _propTypes["default"].number.isRequired
   }),
   showLabels: _propTypes["default"].bool,
+  showPixelGuides: _propTypes["default"].bool,
   showTitle: _propTypes["default"].bool,
   title: _propTypes["default"].string,
   tools: _propTypes["default"].array
@@ -251,8 +252,11 @@ var Graph = /*#__PURE__*/function (_React$Component) {
           title = _this$props5.title,
           labels = _this$props5.labels,
           labelModeEnabled = _this$props5.labelModeEnabled,
+          labelsPlaceholders = _this$props5.labelsPlaceholders,
           showLabels = _this$props5.showLabels,
+          showPixelGuides = _this$props5.showPixelGuides,
           showTitle = _this$props5.showTitle,
+          titlePlaceholder = _this$props5.titlePlaceholder,
           onChangeLabels = _this$props5.onChangeLabels,
           onChangeTitle = _this$props5.onChangeTitle;
       var marks = this.props.marks;
@@ -273,8 +277,11 @@ var Graph = /*#__PURE__*/function (_React$Component) {
           return _this2.rootNode = r;
         },
         disabledTitle: disabledTitle,
+        showPixelGuides: showPixelGuides,
+        showLabels: showLabels,
         showTitle: showTitle,
         title: title,
+        titlePlaceholder: titlePlaceholder,
         onChangeTitle: onChangeTitle
       }, common), /*#__PURE__*/_react["default"].createElement("g", {
         transform: "translate(".concat(domain.padding, ", ").concat(range.padding, ")")
@@ -327,6 +334,7 @@ var Graph = /*#__PURE__*/function (_React$Component) {
         }
       })))), showLabels && /*#__PURE__*/_react["default"].createElement(_labels["default"], (0, _extends2["default"])({
         disabledLabels: disabledLabels,
+        placeholders: labelsPlaceholders,
         value: labels,
         onChange: onChangeLabels
       }, common)));

package/lib/graph.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/graph.jsx"],"names":["log","graphPropTypes","axesSettings","PropTypes","shape","AxisPropTypes","backgroundMarks","array","className","string","collapsibleToolbar","bool","collapsibleToolbarTitle","disabledLabels","disabledTitle","domain","types","DomainType","labels","LabelType","labelModeEnabled","coordinatesOnHover","marks","onChangeLabels","func","onChangeMarks","onChangeTitle","range","size","width","number","isRequired","height","showLabels","showTitle","title","tools","getMaskSize","x","y","removeBuildingToolIfCurrentToolDiffers","currentTool","buildingMark","filter","m","building","newMarks","type","index","findIndex","splice","Graph","setState","labelNode","oldMark","newMark","props","markData","updatedMark","complete","updateMarks","existing","update","addIfMissing","mark","tool","find","t","Component","point","addPoint","undefined","graphProps","rootNode","maskSize","common","r","padding","onBgClick","map","getComponent","markType","disabled","isBackground","state","changeMark","completeMark","startDrag","stopDrag","pointerEvents","React","object"],"mappings":"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","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  disabledLabels: PropTypes.bool,\n  disabledTitle: PropTypes.bool,\n  domain: types.DomainType,\n  labels: PropTypes.shape(LabelType),\n  labelModeEnabled: PropTypes.bool,\n  coordinatesOnHover: PropTypes.bool,\n  marks: PropTypes.array,\n  onChangeLabels: PropTypes.func,\n  onChangeMarks: PropTypes.func,\n  onChangeTitle: PropTypes.func,\n  range: types.DomainType,\n  size: PropTypes.shape({\n    width: PropTypes.number.isRequired,\n    height: PropTypes.number.isRequired\n  }),\n  showLabels: PropTypes.bool,\n  showTitle: PropTypes.bool,\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    disabledLabels: false,\n    disabledTitle: false\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      disabledLabels,\n      disabledTitle,\n      domain,\n      backgroundMarks,\n      range,\n      title,\n      labels,\n      labelModeEnabled,\n      showLabels,\n      showTitle,\n      onChangeLabels,\n      onChangeTitle\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\n        rootRef={r => (this.rootNode = r)}\n        disabledTitle={disabledTitle}\n        showTitle={showTitle}\n        title={title}\n        onChangeTitle={onChangeTitle}\n        {...common}\n      >\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        {showLabels && (\n          <Labels\n            disabledLabels={disabledLabels}\n            value={labels}\n            onChange={onChangeLabels}\n            {...common}\n          />\n        )}\n      </Root>\n    );\n  }\n}\n\nexport default Graph;\n"],"file":"graph.js"}
+{"version":3,"sources":["../src/graph.jsx"],"names":["log","graphPropTypes","axesSettings","PropTypes","shape","AxisPropTypes","backgroundMarks","array","className","string","collapsibleToolbar","bool","collapsibleToolbarTitle","disabledLabels","disabledTitle","domain","types","DomainType","labels","LabelType","labelModeEnabled","coordinatesOnHover","marks","onChangeLabels","func","onChangeMarks","onChangeTitle","range","size","width","number","isRequired","height","showLabels","showPixelGuides","showTitle","title","tools","getMaskSize","x","y","removeBuildingToolIfCurrentToolDiffers","currentTool","buildingMark","filter","m","building","newMarks","type","index","findIndex","splice","Graph","setState","labelNode","oldMark","newMark","props","markData","updatedMark","complete","updateMarks","existing","update","addIfMissing","mark","tool","find","t","Component","point","addPoint","undefined","labelsPlaceholders","titlePlaceholder","graphProps","rootNode","maskSize","common","r","padding","onBgClick","map","getComponent","markType","disabled","isBackground","state","changeMark","completeMark","startDrag","stopDrag","pointerEvents","React","object"],"mappings":"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","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  disabledLabels: PropTypes.bool,\n  disabledTitle: PropTypes.bool,\n  domain: types.DomainType,\n  labels: PropTypes.shape(LabelType),\n  labelModeEnabled: PropTypes.bool,\n  coordinatesOnHover: PropTypes.bool,\n  marks: PropTypes.array,\n  onChangeLabels: PropTypes.func,\n  onChangeMarks: PropTypes.func,\n  onChangeTitle: PropTypes.func,\n  range: types.DomainType,\n  size: PropTypes.shape({\n    width: PropTypes.number.isRequired,\n    height: PropTypes.number.isRequired\n  }),\n  showLabels: PropTypes.bool,\n  showPixelGuides: PropTypes.bool,\n  showTitle: PropTypes.bool,\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    disabledLabels: false,\n    disabledTitle: false\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      disabledLabels,\n      disabledTitle,\n      domain,\n      backgroundMarks,\n      range,\n      title,\n      labels,\n      labelModeEnabled,\n      labelsPlaceholders,\n      showLabels,\n      showPixelGuides,\n      showTitle,\n      titlePlaceholder,\n      onChangeLabels,\n      onChangeTitle\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\n        rootRef={r => (this.rootNode = r)}\n        disabledTitle={disabledTitle}\n        showPixelGuides={showPixelGuides}\n        showLabels={showLabels}\n        showTitle={showTitle}\n        title={title}\n        titlePlaceholder={titlePlaceholder}\n        onChangeTitle={onChangeTitle}\n        {...common}\n      >\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        {showLabels && (\n          <Labels\n            disabledLabels={disabledLabels}\n            placeholders={labelsPlaceholders}\n            value={labels}\n            onChange={onChangeLabels}\n            {...common}\n          />\n        )}\n      </Root>\n    );\n  }\n}\n\nexport default Graph;\n"],"file":"graph.js"}

package/lib/grid-setup.js

@@ -73,6 +73,17 @@ var GridConfig = function GridConfig(props) {
   }));
 };
 
+GridConfig.propTypes = {
+  classes: _propTypes["default"].object,
+  disabled: _propTypes["default"].bool,
+  displayedFields: _propTypes["default"].object,
+  labelValue: _propTypes["default"].number,
+  labelValues: _propTypes["default"].array,
+  gridValue: _propTypes["default"].number,
+  gridValues: _propTypes["default"].array,
+  onChange: _propTypes["default"].func
+};
+
 var AxisConfig = function AxisConfig(props) {
   var classes = props.classes,
       disabled = props.disabled,
@@ -142,6 +153,7 @@ var GridSetup = function GridSetup(props) {
       _props$labelValues = props.labelValues,
       labelValues = _props$labelValues === void 0 ? {} : _props$labelValues,
       onChange = props.onChange,
+      onChangeView = props.onChangeView,
       range = props.range,
       size = props.size,
       sizeConstraints = props.sizeConstraints,
@@ -321,7 +333,9 @@ var GridSetup = function GridSetup(props) {
   })) : null;
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.wrapper
-  }, /*#__PURE__*/_react["default"].createElement(_ExpansionPanel["default"], null, /*#__PURE__*/_react["default"].createElement(_ExpansionPanelSummary["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_ExpansionPanel["default"], {
+    onChange: onChangeView
+  }, /*#__PURE__*/_react["default"].createElement(_ExpansionPanelSummary["default"], {
     expandIcon: /*#__PURE__*/_react["default"].createElement(_ExpandMore["default"], null)
   }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
     variant: "subtitle1"
@@ -373,6 +387,7 @@ GridSetup.propTypes = {
   includeAxes: _propTypes["default"].bool,
   labelValues: _propTypes["default"].object,
   onChange: _propTypes["default"]["function"],
+  onChangeView: _propTypes["default"]["function"],
   range: _propTypes["default"].object,
   size: _propTypes["default"].object,
   sizeConstraints: _propTypes["default"].object,

package/lib/grid-setup.js.map

@@ -1 +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"}
+{"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","propTypes","PropTypes","object","bool","number","array","func","AxisConfig","displayHeader","maxValue","minValue","type","axisLabel","min","max","activePlugins","value","GridSetup","domain","includeAxes","onChangeView","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","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\nGridConfig.propTypes = {\n  classes: PropTypes.object,\n  disabled: PropTypes.bool,\n  displayedFields: PropTypes.object,\n  labelValue: PropTypes.number,\n  labelValues: PropTypes.array,\n  gridValue: PropTypes.number,\n  gridValues: PropTypes.array,\n  onChange: PropTypes.func\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    onChangeView,\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 onChange={onChangeView}>\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  onChangeView: 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/labels.js

@@ -77,16 +77,16 @@ exports.getTransform = getTransform;
 var getY = function getY(side, height) {
   switch (side) {
     case 'left':
-      return -height + 6;
+      return -height;
 
     case 'top':
-      return -height + 6;
+      return -height;
 
     case 'right':
-      return -height;
+      return -height - 10;
 
     default:
-      return -height - 15;
+      return -height + 10;
   }
 };
 
@@ -107,6 +107,7 @@ var RawLabel = /*#__PURE__*/function (_React$Component) {
 
       var _this$props = this.props,
           disabledLabel = _this$props.disabledLabel,
+          placeholder = _this$props.placeholder,
           text = _this$props.text,
           side = _this$props.side,
           graphProps = _this$props.graphProps,
@@ -121,13 +122,14 @@ var RawLabel = /*#__PURE__*/function (_React$Component) {
       var width = side === 'left' || side === 'right' ? totalHeight : totalWidth;
       var height = 36;
       var y = getY(side, height);
-      var activePlugins = ['bold', 'italic', 'underline', 'strikethrough' // 'languageCharacters'
+      var finalHeight = side === 'bottom' ? height + 22 : height + 18;
+      var activePlugins = ['bold', 'italic', 'underline', 'strikethrough', 'math' // 'languageCharacters'
       ];
       return /*#__PURE__*/_react["default"].createElement("foreignObject", {
         x: -(width / 2),
         y: y,
         width: width,
-        height: height * 2,
+        height: finalHeight,
         transform: transform,
         textAnchor: "middle"
       }, /*#__PURE__*/_react["default"].createElement(_renderUi.Readable, {
@@ -136,7 +138,7 @@ var RawLabel = /*#__PURE__*/function (_React$Component) {
         className: (0, _classnames["default"])((_cn = {}, (0, _defineProperty2["default"])(_cn, classes.bottomLabel, side === 'bottom'), (0, _defineProperty2["default"])(_cn, classes.disabledAxisLabel, disabledLabel), _cn), classes.axisLabel),
         markup: text || '',
         onChange: onChange,
-        placeholder: !disabledLabel && "Click here to add a ".concat(side, " label"),
+        placeholder: !disabledLabel && placeholder,
         toolbarOpts: {
           position: side === 'bottom' ? 'top' : 'bottom',
           noBorder: true
@@ -153,6 +155,7 @@ var RawLabel = /*#__PURE__*/function (_React$Component) {
   side: _propTypes["default"].string,
   classes: _propTypes["default"].object,
   disabledLabel: _propTypes["default"].bool,
+  placeholder: _propTypes["default"].string,
   graphProps: _plot.types.GraphPropsType.isRequired
 });
 var Label = (0, _styles.withStyles)(function (theme) {
@@ -162,7 +165,8 @@ var Label = (0, _styles.withStyles)(function (theme) {
     },
     axisLabel: {
       fontSize: theme.typography.fontSize - 2,
-      textAlign: 'center'
+      textAlign: 'center',
+      padding: '0 4px'
     },
     disabledAxisLabel: {
       pointerEvents: 'none'
@@ -214,6 +218,8 @@ var Labels = /*#__PURE__*/function (_React$Component2) {
 
       var _this$props3 = this.props,
           disabledLabels = _this$props3.disabledLabels,
+          _this$props3$placehol = _this$props3.placeholders,
+          placeholders = _this$props3$placehol === void 0 ? {} : _this$props3$placehol,
           _this$props3$value = _this$props3.value,
           value = _this$props3$value === void 0 ? {} : _this$props3$value,
           graphProps = _this$props3.graphProps;
@@ -222,6 +228,7 @@ var Labels = /*#__PURE__*/function (_React$Component2) {
         side: "left",
         text: value.left,
         disabledLabel: disabledLabels,
+        placeholder: placeholders.left,
         graphProps: graphProps,
         onChange: function onChange(value) {
           return _this2.onChangeLabel(value, 'left');
@@ -231,6 +238,7 @@ var Labels = /*#__PURE__*/function (_React$Component2) {
         side: "top",
         text: value.top,
         disabledLabel: disabledLabels,
+        placeholder: placeholders.top,
         graphProps: graphProps,
         onChange: function onChange(value) {
           return _this2.onChangeLabel(value, 'top');
@@ -240,6 +248,7 @@ var Labels = /*#__PURE__*/function (_React$Component2) {
         side: "bottom",
         text: value.bottom,
         disabledLabel: disabledLabels,
+        placeholder: placeholders.bottom,
         graphProps: graphProps,
         onChange: function onChange(value) {
           return _this2.onChangeLabel(value, 'bottom');
@@ -249,6 +258,7 @@ var Labels = /*#__PURE__*/function (_React$Component2) {
         side: "right",
         text: value.right,
         disabledLabel: disabledLabels,
+        placeholder: placeholders.right,
         graphProps: graphProps,
         onChange: function onChange(value) {
           return _this2.onChangeLabel(value, 'right');
@@ -264,6 +274,7 @@ exports.Labels = Labels;
   classes: _propTypes["default"].object,
   className: _propTypes["default"].string,
   disabledLabels: _propTypes["default"].bool,
+  placeholders: _propTypes["default"].object,
   value: _propTypes["default"].shape(LabelType),
   graphProps: _propTypes["default"].object
 });

package/lib/labels.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/labels.jsx"],"names":["rotations","left","top","bottom","right","getTransform","side","width","height","t","x","y","rotate","getY","RawLabel","props","disabledLabel","text","graphProps","classes","onChange","size","domain","range","totalHeight","padding","totalWidth","transform","activePlugins","bottomLabel","disabledAxisLabel","axisLabel","position","noBorder","React","Component","PropTypes","string","object","bool","types","GraphPropsType","isRequired","Label","theme","label","fill","color","secondary","fontSize","typography","textAlign","pointerEvents","marginTop","LabelType","Labels","newValue","value","labels","disabledLabels","onChangeLabel","className","shape"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { types } from '@pie-lib/plot';\nimport { color, Readable } from '@pie-lib/render-ui';\nimport EditableHtml from '@pie-lib/editable-html';\nimport cn from 'classnames';\n\nconst rotations = {\n  left: -90,\n  top: 0,\n  bottom: 0,\n  right: 90\n};\n\nexport const getTransform = (side, width, height) => {\n  const t = (x, y, rotate) => `translate(${x}, ${y}), rotate(${rotate})`;\n\n  if (side === 'left') {\n    return t(-20, height / 2, rotations[side]);\n  }\n  if (side === 'right') {\n    return t(width + 30, height / 2, rotations[side]);\n  }\n  if (side === 'top') {\n    return t(width / 2, -20, rotations[side]);\n  }\n  if (side === 'bottom') {\n    return t(width / 2, height + 30, rotations[side]);\n  }\n};\n\nconst getY = (side, height) => {\n  switch (side) {\n    case 'left':\n      return -height + 6;\n    case 'top':\n      return -height + 6;\n    case 'right':\n      return -height;\n    default:\n      return -height - 15;\n  }\n};\n\nclass RawLabel extends React.Component {\n  static propTypes = {\n    text: PropTypes.string,\n    side: PropTypes.string,\n    classes: PropTypes.object,\n    disabledLabel: PropTypes.bool,\n    graphProps: types.GraphPropsType.isRequired\n  };\n\n  render() {\n    const { disabledLabel, text, side, graphProps, classes, onChange } = this.props;\n    const { size, domain, range } = graphProps;\n    const totalHeight = (size.height || 500) + (range.padding || 0) * 2;\n    const totalWidth = (size.width || 500) + (domain.padding || 0) * 2;\n\n    const transform = getTransform(side, totalWidth, totalHeight);\n    const width = side === 'left' || side === 'right' ? totalHeight : totalWidth;\n    const height = 36;\n    const y = getY(side, height);\n\n    const activePlugins = [\n      'bold',\n      'italic',\n      'underline',\n      'strikethrough'\n      // 'languageCharacters'\n    ];\n\n    return (\n      <foreignObject\n        x={-(width / 2)}\n        y={y}\n        width={width}\n        height={height * 2}\n        transform={transform}\n        textAnchor=\"middle\"\n      >\n        <Readable false>\n          <EditableHtml\n            className={cn(\n              {\n                [classes.bottomLabel]: side === 'bottom',\n                [classes.disabledAxisLabel]: disabledLabel\n              },\n              classes.axisLabel\n            )}\n            markup={text || ''}\n            onChange={onChange}\n            placeholder={!disabledLabel && `Click here to add a ${side} label`}\n            toolbarOpts={{\n              position: side === 'bottom' ? 'top' : 'bottom',\n              noBorder: true\n            }}\n            activePlugins={activePlugins}\n          />\n        </Readable>\n      </foreignObject>\n    );\n  }\n}\n\nconst Label = withStyles(theme => ({\n  label: {\n    fill: color.secondary()\n  },\n  axisLabel: {\n    fontSize: theme.typography.fontSize - 2,\n    textAlign: 'center'\n  },\n  disabledAxisLabel: {\n    pointerEvents: 'none'\n  },\n  bottomLabel: {\n    marginTop: '44px'\n  }\n}))(RawLabel);\n\nexport const LabelType = {\n  left: PropTypes.string,\n  top: PropTypes.string,\n  bottom: PropTypes.string,\n  right: PropTypes.string\n};\n\nexport class Labels extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    className: PropTypes.string,\n    disabledLabels: PropTypes.bool,\n    value: PropTypes.shape(LabelType),\n    graphProps: PropTypes.object\n  };\n\n  static defaultProps = {};\n\n  onChangeLabel = (newValue, side) => {\n    const { value, onChange } = this.props;\n    const labels = {\n      ...value,\n      [side]: newValue\n    };\n\n    onChange(labels);\n  };\n\n  render() {\n    const { disabledLabels, value = {}, graphProps } = this.props;\n\n    return (\n      <React.Fragment>\n        <Label\n          key=\"left\"\n          side=\"left\"\n          text={value.left}\n          disabledLabel={disabledLabels}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'left')}\n        />\n        <Label\n          key=\"top\"\n          side=\"top\"\n          text={value.top}\n          disabledLabel={disabledLabels}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'top')}\n        />\n        <Label\n          key=\"bottom\"\n          side=\"bottom\"\n          text={value.bottom}\n          disabledLabel={disabledLabels}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'bottom')}\n        />\n        <Label\n          key=\"right\"\n          side=\"right\"\n          text={value.right}\n          disabledLabel={disabledLabels}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'right')}\n        />\n      </React.Fragment>\n    );\n  }\n}\n\nexport default Labels;\n"],"file":"labels.js"}
+{"version":3,"sources":["../src/labels.jsx"],"names":["rotations","left","top","bottom","right","getTransform","side","width","height","t","x","y","rotate","getY","RawLabel","props","disabledLabel","placeholder","text","graphProps","classes","onChange","size","domain","range","totalHeight","padding","totalWidth","transform","finalHeight","activePlugins","bottomLabel","disabledAxisLabel","axisLabel","position","noBorder","React","Component","PropTypes","string","object","bool","types","GraphPropsType","isRequired","Label","theme","label","fill","color","secondary","fontSize","typography","textAlign","pointerEvents","marginTop","LabelType","Labels","newValue","value","labels","disabledLabels","placeholders","onChangeLabel","className","shape"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { types } from '@pie-lib/plot';\nimport { color, Readable } from '@pie-lib/render-ui';\nimport EditableHtml from '@pie-lib/editable-html';\nimport cn from 'classnames';\n\nconst rotations = {\n  left: -90,\n  top: 0,\n  bottom: 0,\n  right: 90\n};\n\nexport const getTransform = (side, width, height) => {\n  const t = (x, y, rotate) => `translate(${x}, ${y}), rotate(${rotate})`;\n\n  if (side === 'left') {\n    return t(-20, height / 2, rotations[side]);\n  }\n  if (side === 'right') {\n    return t(width + 30, height / 2, rotations[side]);\n  }\n  if (side === 'top') {\n    return t(width / 2, -20, rotations[side]);\n  }\n  if (side === 'bottom') {\n    return t(width / 2, height + 30, rotations[side]);\n  }\n};\n\nconst getY = (side, height) => {\n  switch (side) {\n    case 'left':\n      return -height;\n    case 'top':\n      return -height;\n    case 'right':\n      return -height - 10;\n    default:\n      return -height + 10;\n  }\n};\n\nclass RawLabel extends React.Component {\n  static propTypes = {\n    text: PropTypes.string,\n    side: PropTypes.string,\n    classes: PropTypes.object,\n    disabledLabel: PropTypes.bool,\n    placeholder: PropTypes.string,\n    graphProps: types.GraphPropsType.isRequired\n  };\n\n  render() {\n    const { disabledLabel, placeholder, text, side, graphProps, classes, onChange } = this.props;\n    const { size, domain, range } = graphProps;\n    const totalHeight = (size.height || 500) + (range.padding || 0) * 2;\n    const totalWidth = (size.width || 500) + (domain.padding || 0) * 2;\n\n    const transform = getTransform(side, totalWidth, totalHeight);\n    const width = side === 'left' || side === 'right' ? totalHeight : totalWidth;\n    const height = 36;\n    const y = getY(side, height);\n    const finalHeight = side === 'bottom' ? height + 22 : height + 18;\n\n    const activePlugins = [\n      'bold',\n      'italic',\n      'underline',\n      'strikethrough',\n      'math'\n      // 'languageCharacters'\n    ];\n\n    return (\n      <foreignObject\n        x={-(width / 2)}\n        y={y}\n        width={width}\n        height={finalHeight}\n        transform={transform}\n        textAnchor=\"middle\"\n      >\n        <Readable false>\n          <EditableHtml\n            className={cn(\n              {\n                [classes.bottomLabel]: side === 'bottom',\n                [classes.disabledAxisLabel]: disabledLabel\n              },\n              classes.axisLabel\n            )}\n            markup={text || ''}\n            onChange={onChange}\n            placeholder={!disabledLabel && placeholder}\n            toolbarOpts={{\n              position: side === 'bottom' ? 'top' : 'bottom',\n              noBorder: true\n            }}\n            activePlugins={activePlugins}\n          />\n        </Readable>\n      </foreignObject>\n    );\n  }\n}\n\nconst Label = withStyles(theme => ({\n  label: {\n    fill: color.secondary()\n  },\n  axisLabel: {\n    fontSize: theme.typography.fontSize - 2,\n    textAlign: 'center',\n    padding: '0 4px'\n  },\n  disabledAxisLabel: {\n    pointerEvents: 'none'\n  },\n  bottomLabel: {\n    marginTop: '44px'\n  }\n}))(RawLabel);\n\nexport const LabelType = {\n  left: PropTypes.string,\n  top: PropTypes.string,\n  bottom: PropTypes.string,\n  right: PropTypes.string\n};\n\nexport class Labels extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    className: PropTypes.string,\n    disabledLabels: PropTypes.bool,\n    placeholders: PropTypes.object,\n    value: PropTypes.shape(LabelType),\n    graphProps: PropTypes.object\n  };\n\n  static defaultProps = {};\n\n  onChangeLabel = (newValue, side) => {\n    const { value, onChange } = this.props;\n    const labels = {\n      ...value,\n      [side]: newValue\n    };\n\n    onChange(labels);\n  };\n\n  render() {\n    const { disabledLabels, placeholders = {}, value = {}, graphProps } = this.props;\n\n    return (\n      <React.Fragment>\n        <Label\n          key=\"left\"\n          side=\"left\"\n          text={value.left}\n          disabledLabel={disabledLabels}\n          placeholder={placeholders.left}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'left')}\n        />\n        <Label\n          key=\"top\"\n          side=\"top\"\n          text={value.top}\n          disabledLabel={disabledLabels}\n          placeholder={placeholders.top}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'top')}\n        />\n        <Label\n          key=\"bottom\"\n          side=\"bottom\"\n          text={value.bottom}\n          disabledLabel={disabledLabels}\n          placeholder={placeholders.bottom}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'bottom')}\n        />\n        <Label\n          key=\"right\"\n          side=\"right\"\n          text={value.right}\n          disabledLabel={disabledLabels}\n          placeholder={placeholders.right}\n          graphProps={graphProps}\n          onChange={value => this.onChangeLabel(value, 'right')}\n        />\n      </React.Fragment>\n    );\n  }\n}\n\nexport default Labels;\n"],"file":"labels.js"}

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "2.9.1",
+  "version": "2.10.0",
   "description": "Graphing components",
   "keywords": [
     "react",
@@ -20,8 +20,8 @@
     "@material-ui/core": "^3.8.3",
     "@pie-lib/drag": "^1.1.52",
     "@pie-lib/graphing-utils": "^1.1.20",
-    "@pie-lib/plot": "^2.3.0",
-    "@pie-lib/render-ui": "^4.13.2",
+    "@pie-lib/plot": "^2.4.0",
+    "@pie-lib/render-ui": "^4.13.3",
     "@vx/axis": "^0.0.189",
     "@vx/clip-path": "^0.0.189",
     "@vx/event": "^0.0.189",
@@ -44,6 +44,6 @@
   "peerDependencies": {
     "react": "^16.8.1"
   },
-  "gitHead": "ed8eb5575887c3ea5fdedf0f3a3d5bc64c7890d7",
+  "gitHead": "5cd198308a7395a8faa8d9c09ab548964d9d65bf",
   "scripts": {}
 }

package/src/axis/axes.jsx

@@ -123,7 +123,7 @@ export class RawXAxis extends React.Component {
 
     const necessaryRows = countWords(domain.axisLabel);
     const longestWord = findLongestWord(domain.axisLabel);
-    const necessaryWidth = amountToIncreaseWidth(longestWord);
+    const necessaryWidth = amountToIncreaseWidth(longestWord) + 2;
 
     return (
       <React.Fragment>
@@ -147,8 +147,8 @@ export class RawXAxis extends React.Component {
         )}
         {domain.axisLabel && (
           <foreignObject
-            x={size.width + 15}
-            y={scale.y(0) - 10}
+            x={size.width + 17}
+            y={scale.y(0) - 9}
             width={necessaryWidth}
             height={20 * necessaryRows}
           >
@@ -219,7 +219,7 @@ export class RawYAxis extends React.Component {
         {range.axisLabel && (
           <foreignObject
             x={scale.x(0) - necessaryWidth / 2}
-            y={-30}
+            y={-33}
             width={necessaryWidth}
             height="20"
           >

package/src/graph-with-controls.jsx

@@ -118,6 +118,7 @@ export class GraphWithControls extends React.Component {
       domain,
       draggableTools,
       labels,
+      labelsPlaceholders,
       onChangeLabels,
       onChangeMarks,
       onChangeTitle,
@@ -128,8 +129,10 @@ export class GraphWithControls extends React.Component {
       range,
       size,
       showLabels,
+      showPixelGuides,
       showTitle,
-      title
+      title,
+      titlePlaceholder
     } = this.props;
     let { backgroundMarks, marks, toolbarTools } = this.props;
 
@@ -190,6 +193,7 @@ export class GraphWithControls extends React.Component {
           domain={domain}
           labels={labels}
           labelModeEnabled={labelModeEnabled}
+          labelsPlaceholders={labelsPlaceholders}
           marks={marks}
           onChangeMarks={!disabled ? onChangeMarks : undefined}
           onChangeLabels={onChangeLabels}
@@ -197,8 +201,10 @@ export class GraphWithControls extends React.Component {
           range={range}
           size={size}
           showLabels={showLabels}
+          showPixelGuides={showPixelGuides}
           showTitle={showTitle}
           title={title}
+          titlePlaceholder={titlePlaceholder}
           tools={tools}
         />
       </div>
@@ -207,9 +213,12 @@ export class GraphWithControls extends React.Component {
 }
 
 const styles = theme => ({
-  graphWithControls: {},
+  graphWithControls: {
+    display: 'flex',
+    flexDirection: 'column',
+    width: 'min-content'
+  },
   controls: {
-    width: 'inherit',
     display: 'flex',
     justifyContent: 'space-between',
     padding: theme.spacing.unit,
@@ -224,7 +233,8 @@ const styles = theme => ({
     }
   },
   expansionPanel: {
-    backgroundColor: color.primaryLight()
+    backgroundColor: color.primaryLight(),
+    width: '100%'
   },
   summaryRoot: {
     padding: `0 ${theme.spacing.unit}px`,
@@ -235,7 +245,9 @@ const styles = theme => ({
   },
   details: {
     padding: 0,
-    marginTop: theme.spacing.unit
+    marginTop: theme.spacing.unit,
+    display: 'flex',
+    justifyContent: 'space-between'
   }
 });
 

package/src/graph.jsx

@@ -36,6 +36,7 @@ export const graphPropTypes = {
     height: PropTypes.number.isRequired
   }),
   showLabels: PropTypes.bool,
+  showPixelGuides: PropTypes.bool,
   showTitle: PropTypes.bool,
   title: PropTypes.string,
   tools: PropTypes.array
@@ -167,8 +168,11 @@ export class Graph extends React.Component {
       title,
       labels,
       labelModeEnabled,
+      labelsPlaceholders,
       showLabels,
+      showPixelGuides,
       showTitle,
+      titlePlaceholder,
       onChangeLabels,
       onChangeTitle
     } = this.props;
@@ -184,8 +188,11 @@ export class Graph extends React.Component {
       <Root
         rootRef={r => (this.rootNode = r)}
         disabledTitle={disabledTitle}
+        showPixelGuides={showPixelGuides}
+        showLabels={showLabels}
         showTitle={showTitle}
         title={title}
+        titlePlaceholder={titlePlaceholder}
         onChangeTitle={onChangeTitle}
         {...common}
       >
@@ -245,6 +252,7 @@ export class Graph extends React.Component {
         {showLabels && (
           <Labels
             disabledLabels={disabledLabels}
+            placeholders={labelsPlaceholders}
             value={labels}
             onChange={onChangeLabels}
             {...common}

package/src/grid-setup.jsx

@@ -51,6 +51,17 @@ const GridConfig = props => {
   );
 };
 
+GridConfig.propTypes = {
+  classes: PropTypes.object,
+  disabled: PropTypes.bool,
+  displayedFields: PropTypes.object,
+  labelValue: PropTypes.number,
+  labelValues: PropTypes.array,
+  gridValue: PropTypes.number,
+  gridValues: PropTypes.array,
+  onChange: PropTypes.func
+};
+
 const AxisConfig = props => {
   const {
     classes,
@@ -128,6 +139,7 @@ const GridSetup = props => {
     includeAxes,
     labelValues = {},
     onChange,
+    onChangeView,
     range,
     size,
     sizeConstraints,
@@ -303,7 +315,7 @@ const GridSetup = props => {
 
   return (
     <div className={classes.wrapper}>
-      <ExpansionPanel>
+      <ExpansionPanel onChange={onChangeView}>
         <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
           <Typography variant="subtitle1">Customize Grid Setup</Typography>
         </ExpansionPanelSummary>
@@ -370,6 +382,7 @@ GridSetup.propTypes = {
   includeAxes: PropTypes.bool,
   labelValues: PropTypes.object,
   onChange: PropTypes.function,
+  onChangeView: PropTypes.function,
   range: PropTypes.object,
   size: PropTypes.object,
   sizeConstraints: PropTypes.object,

package/src/labels.jsx

@@ -33,13 +33,13 @@ export const getTransform = (side, width, height) => {
 const getY = (side, height) => {
   switch (side) {
     case 'left':
-      return -height + 6;
+      return -height;
     case 'top':
-      return -height + 6;
-    case 'right':
       return -height;
+    case 'right':
+      return -height - 10;
     default:
-      return -height - 15;
+      return -height + 10;
   }
 };
 
@@ -49,11 +49,12 @@ class RawLabel extends React.Component {
     side: PropTypes.string,
     classes: PropTypes.object,
     disabledLabel: PropTypes.bool,
+    placeholder: PropTypes.string,
     graphProps: types.GraphPropsType.isRequired
   };
 
   render() {
-    const { disabledLabel, text, side, graphProps, classes, onChange } = this.props;
+    const { disabledLabel, placeholder, text, side, graphProps, classes, onChange } = this.props;
     const { size, domain, range } = graphProps;
     const totalHeight = (size.height || 500) + (range.padding || 0) * 2;
     const totalWidth = (size.width || 500) + (domain.padding || 0) * 2;
@@ -62,12 +63,14 @@ class RawLabel extends React.Component {
     const width = side === 'left' || side === 'right' ? totalHeight : totalWidth;
     const height = 36;
     const y = getY(side, height);
+    const finalHeight = side === 'bottom' ? height + 22 : height + 18;
 
     const activePlugins = [
       'bold',
       'italic',
       'underline',
-      'strikethrough'
+      'strikethrough',
+      'math'
       // 'languageCharacters'
     ];
 
@@ -76,7 +79,7 @@ class RawLabel extends React.Component {
         x={-(width / 2)}
         y={y}
         width={width}
-        height={height * 2}
+        height={finalHeight}
         transform={transform}
         textAnchor="middle"
       >
@@ -91,7 +94,7 @@ class RawLabel extends React.Component {
             )}
             markup={text || ''}
             onChange={onChange}
-            placeholder={!disabledLabel && `Click here to add a ${side} label`}
+            placeholder={!disabledLabel && placeholder}
             toolbarOpts={{
               position: side === 'bottom' ? 'top' : 'bottom',
               noBorder: true
@@ -110,7 +113,8 @@ const Label = withStyles(theme => ({
   },
   axisLabel: {
     fontSize: theme.typography.fontSize - 2,
-    textAlign: 'center'
+    textAlign: 'center',
+    padding: '0 4px'
   },
   disabledAxisLabel: {
     pointerEvents: 'none'
@@ -132,6 +136,7 @@ export class Labels extends React.Component {
     classes: PropTypes.object,
     className: PropTypes.string,
     disabledLabels: PropTypes.bool,
+    placeholders: PropTypes.object,
     value: PropTypes.shape(LabelType),
     graphProps: PropTypes.object
   };
@@ -149,7 +154,7 @@ export class Labels extends React.Component {
   };
 
   render() {
-    const { disabledLabels, value = {}, graphProps } = this.props;
+    const { disabledLabels, placeholders = {}, value = {}, graphProps } = this.props;
 
     return (
       <React.Fragment>
@@ -158,6 +163,7 @@ export class Labels extends React.Component {
           side="left"
           text={value.left}
           disabledLabel={disabledLabels}
+          placeholder={placeholders.left}
           graphProps={graphProps}
           onChange={value => this.onChangeLabel(value, 'left')}
         />
@@ -166,6 +172,7 @@ export class Labels extends React.Component {
           side="top"
           text={value.top}
           disabledLabel={disabledLabels}
+          placeholder={placeholders.top}
           graphProps={graphProps}
           onChange={value => this.onChangeLabel(value, 'top')}
         />
@@ -174,6 +181,7 @@ export class Labels extends React.Component {
           side="bottom"
           text={value.bottom}
           disabledLabel={disabledLabels}
+          placeholder={placeholders.bottom}
           graphProps={graphProps}
           onChange={value => this.onChangeLabel(value, 'bottom')}
         />
@@ -182,6 +190,7 @@ export class Labels extends React.Component {
           side="right"
           text={value.right}
           disabledLabel={disabledLabels}
+          placeholder={placeholders.right}
           graphProps={graphProps}
           onChange={value => this.onChangeLabel(value, 'right')}
         />