@pie-lib/charting 5.6.17-next.0 → 5.6.17-next.32

package/lib/chart.js

@@ -165,10 +165,16 @@ var Chart = /*#__PURE__*/function (_React$Component) {
         open: false
       }
     };
+    _this.maskUid = _this.generateMaskId();
     return _this;
   }
 
   (0, _createClass2["default"])(Chart, [{
+    key: "generateMaskId",
+    value: function generateMaskId() {
+      return 'chart-' + (Math.random() * 10000).toFixed();
+    }
+  }, {
     key: "render",
     value: function render() {
       var _this2 = this;
@@ -282,12 +288,12 @@ var Chart = /*#__PURE__*/function (_React$Component) {
         top: top,
         error: error
       })), /*#__PURE__*/_react["default"].createElement("mask", {
-        id: "myMask"
+        mask: "".concat(this.maskUid)
       }, /*#__PURE__*/_react["default"].createElement("rect", (0, _extends2["default"])({}, maskSize, {
         fill: "white"
       }))), /*#__PURE__*/_react["default"].createElement("g", {
         id: "marks",
-        mask: "url('#myMask')"
+        mask: "url('#".concat(this.maskUid, "')")
       }, /*#__PURE__*/_react["default"].createElement(ChartComponent, (0, _extends2["default"])({}, common, {
         data: categories,
         defineChart: defineChart,

package/lib/chart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/chart.jsx"],"names":["log","Chart","props","charts","chartTypes","Bar","Histogram","LineDot","LineCross","DotPlot","LinePlot","open","callback","setState","dialog","state","chartType","ChartComponent","chart","find","type","Component","data","onDataChange","index","newCategory","integerIndex","parseInt","range","categoryDefaultLabel","defineChart","length","title","text","onConfirm","handleAlertDialog","inDefineChart","autoFocus","label","value","step","deletable","editable","interactive","map","d","classes","className","domain","size","onChangeTitle","onChangeLabels","labelsPlaceholders","titlePlaceholder","addCategoryEnabled","showPixelGuides","error","width","height","labels","left","bottom","getChart","categories","getFilteredCategories","correctValues","verticalLines","horizontalLines","leftAxis","common","graphProps","rootNode","maskSize","x","y","scale","xBand","bandWidth","bandwidth","barWidth","max","increaseHeight","top","rootCommon","chartBox","controls","toolMenu","addCategory","r","changeData","changeCategory","onClose","React","PropTypes","object","isRequired","string","shape","number","min","axisLabel","arrayOf","labelStep","array","func","bool","theme","styles","graphBox","transform","display","justifyContent","padding","spacing","unit","backgroundColor","color","primaryLight","borderTop","primaryDark","borderBottom","borderLeft","borderRight","svg","overflow","minHeight","withTheme"],"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 { Root, createGraphProps } from '@pie-lib/plot';\nimport cloneDeep from 'lodash/cloneDeep';\nimport ChartGrid from './grid';\nimport ChartAxes from './axes';\nimport debug from 'debug';\nimport { color } from '@pie-lib/render-ui';\nimport { dataToXBand, getDomainAndRangeByChartType, getGridLinesAndAxisByChartType, getTopPadding } from './utils';\nimport ToolMenu from './tool-menu';\nimport chartTypes from './chart-types';\nimport { AlertDialog } from '@pie-lib/config-ui';\n\nconst log = debug('pie-lib:charts:chart');\n\nexport class Chart extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      dialog: {\n        open: false,\n      },\n    };\n  }\n\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    chartType: PropTypes.string.isRequired,\n    size: PropTypes.shape({\n      width: PropTypes.number,\n      height: PropTypes.number,\n    }),\n    domain: PropTypes.shape({\n      label: PropTypes.string,\n      min: PropTypes.number,\n      max: PropTypes.number,\n      axisLabel: PropTypes.string,\n    }),\n    data: PropTypes.arrayOf(PropTypes.shape({ label: PropTypes.string, value: PropTypes.number })),\n    range: PropTypes.shape({\n      label: PropTypes.string,\n      min: PropTypes.number,\n      max: PropTypes.number,\n      step: PropTypes.number,\n      labelStep: PropTypes.number,\n      axisLabel: PropTypes.string,\n    }),\n    charts: PropTypes.array,\n    title: PropTypes.string,\n    onDataChange: PropTypes.func,\n    addCategoryEnabled: PropTypes.bool,\n    showPixelGuides: PropTypes.bool,\n    categoryDefaultLabel: PropTypes.string,\n    defineChart: PropTypes.bool,\n    theme: PropTypes.object,\n  };\n\n  static defaultProps = {\n    size: {\n      width: 480,\n      height: 480,\n    },\n  };\n\n  state = {\n    charts: [\n      chartTypes.Bar(),\n      chartTypes.Histogram(),\n      chartTypes.LineDot(),\n      chartTypes.LineCross(),\n      chartTypes.DotPlot(),\n      chartTypes.LinePlot(),\n    ],\n  };\n\n  handleAlertDialog = (open, callback) =>\n    this.setState(\n      {\n        dialog: { open },\n      },\n      callback,\n    );\n\n  getChart = () => {\n    const charts = this.props.charts || this.state.charts;\n    let { chartType } = this.props;\n    let ChartComponent = null;\n    let chart = null;\n\n    if (chartType) {\n      chart = charts && charts.find((chart) => chart.type === chartType);\n      ChartComponent = chart && chart.Component;\n    } else {\n      chart = charts && charts[0];\n      ChartComponent = chart && chart.Component;\n      chartType = chart && chart.type;\n    }\n\n    return {\n      type: chartType,\n      ChartComponent,\n    };\n  };\n\n  changeData = (data) => {\n    const { onDataChange } = this.props;\n\n    onDataChange(data);\n  };\n\n  changeCategory = (index, newCategory) => {\n    const integerIndex = parseInt(index, 10);\n\n    if (integerIndex >= 0) {\n      const { data, onDataChange } = this.props;\n      data[integerIndex] = {\n        ...data[integerIndex],\n        ...newCategory,\n      };\n\n      onDataChange(data);\n    }\n  };\n\n  addCategory = (range) => {\n    const { onDataChange, data, categoryDefaultLabel, defineChart } = this.props;\n\n    if (!defineChart && data.length > 19) {\n      this.setState({\n        dialog: {\n          open: true,\n          title: 'Warning',\n          text: \"There can't be more than 20 categories.\",\n          onConfirm: () => this.handleAlertDialog(false),\n        },\n      });\n    } else {\n      onDataChange([\n        ...data,\n        {\n          inDefineChart: defineChart,\n          autoFocus: true,\n          label: categoryDefaultLabel || 'New Bar',\n          value: range.step,\n          deletable: true,\n          editable: true,\n          interactive: true,\n        },\n      ]);\n    }\n  };\n\n  getFilteredCategories = () => {\n    const { data, defineChart } = this.props;\n\n    return data\n      ? data.map((d) => ({\n          ...d,\n          deletable: defineChart || d.deletable,\n        }))\n      : [];\n  };\n\n  render() {\n    const {\n      classes,\n      className,\n      domain = {},\n      range = {},\n      size,\n      title,\n      onChangeTitle,\n      onChangeLabels,\n      labelsPlaceholders,\n      titlePlaceholder,\n      addCategoryEnabled,\n      showPixelGuides,\n      error,\n    } = this.props;\n    let { chartType } = this.props;\n\n    const { dialog } = this.state;\n    const defineChart = this.props.defineChart || false;\n    const { width, height } = size || {};\n    const labels = { left: range?.label || '', bottom: domain?.label || '' };\n\n    const { ChartComponent } = this.getChart();\n    const categories = this.getFilteredCategories();\n\n    const correctValues = getDomainAndRangeByChartType(domain, range, chartType);\n\n    const { verticalLines, horizontalLines, leftAxis } = getGridLinesAndAxisByChartType(correctValues.range, chartType);\n    const common = {\n      graphProps: createGraphProps(correctValues.domain, correctValues.range, size, () => this.rootNode),\n    };\n\n    log('[render] common:', common);\n\n    const maskSize = { x: -10, y: -10, width: width + 20, height: height + 80 };\n    const { scale } = common.graphProps;\n    const xBand = dataToXBand(scale.x, categories, width, chartType);\n\n    if (!ChartComponent) {\n      return null;\n    }\n\n    const bandWidth = xBand.bandwidth();\n    // for chartType \"line\", bandWidth will be 0, so we have to calculate it\n    const barWidth = bandWidth || scale.x(correctValues.domain.max) / categories.length;\n    const increaseHeight = defineChart ? 160 : 60;\n\n    // if there are many categories, we have to rotate their names in order to fit\n    // and we have to add extra value on top of some items\n    const top = getTopPadding(barWidth);\n    const rootCommon = cloneDeep(common);\n    rootCommon.graphProps.size.height += top + increaseHeight;\n\n    return (\n      <div className={classNames(classes.chart, classes.chartBox, className)}>\n        <div className={classes.controls}>\n          <ToolMenu\n            className={classes.toolMenu}\n            disabled={!addCategoryEnabled}\n            addCategory={() => this.addCategory(correctValues.range)}\n          />\n        </div>\n\n        <Root\n          title={title}\n          onChangeTitle={onChangeTitle}\n          disabledTitle={!defineChart}\n          showTitle={true}\n          showLabels={true}\n          labels={labels}\n          onChangeLabels={onChangeLabels}\n          labelsPlaceholders={labelsPlaceholders}\n          titlePlaceholder={titlePlaceholder}\n          defineChart={defineChart}\n          disabledLabels={!defineChart}\n          isChart={true}\n          showPixelGuides={showPixelGuides}\n          rootRef={(r) => (this.rootNode = r)}\n          {...rootCommon}\n        >\n          <ChartGrid {...common} xBand={xBand} rowTickValues={horizontalLines} columnTickValues={verticalLines} />\n          <ChartAxes\n            {...common}\n            defineChart={defineChart}\n            categories={categories}\n            xBand={xBand}\n            leftAxis={leftAxis}\n            onChange={this.changeData}\n            onChangeCategory={this.changeCategory}\n            top={top}\n            error={error}\n          />\n          <mask id=\"myMask\">\n            <rect {...maskSize} fill=\"white\" />\n          </mask>\n          <g id=\"marks\" mask=\"url('#myMask')\">\n            <ChartComponent\n              {...common}\n              data={categories}\n              defineChart={defineChart}\n              onChange={this.changeData}\n              onChangeCategory={this.changeCategory}\n            />\n          </g>\n        </Root>\n        <AlertDialog\n          open={dialog.open}\n          title={dialog.title}\n          text={dialog.text}\n          onClose={dialog.onClose}\n          onConfirm={dialog.onConfirm}\n        />\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  graphBox: {\n    transform: 'translate(60px, 35px)',\n  },\n  controls: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    padding: theme.spacing.unit,\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  },\n  svg: {\n    overflow: 'visible',\n  },\n  toolMenu: {\n    minHeight: '36px',\n  },\n  chartBox: {\n    width: 'min-content',\n  },\n});\n\nexport default withStyles(styles, { withTheme: true })(Chart);\n"],"file":"chart.js"}
+{"version":3,"sources":["../src/chart.jsx"],"names":["log","Chart","props","charts","chartTypes","Bar","Histogram","LineDot","LineCross","DotPlot","LinePlot","open","callback","setState","dialog","state","chartType","ChartComponent","chart","find","type","Component","data","onDataChange","index","newCategory","integerIndex","parseInt","range","categoryDefaultLabel","defineChart","length","title","text","onConfirm","handleAlertDialog","inDefineChart","autoFocus","label","value","step","deletable","editable","interactive","map","d","maskUid","generateMaskId","Math","random","toFixed","classes","className","domain","size","onChangeTitle","onChangeLabels","labelsPlaceholders","titlePlaceholder","addCategoryEnabled","showPixelGuides","error","width","height","labels","left","bottom","getChart","categories","getFilteredCategories","correctValues","verticalLines","horizontalLines","leftAxis","common","graphProps","rootNode","maskSize","x","y","scale","xBand","bandWidth","bandwidth","barWidth","max","increaseHeight","top","rootCommon","chartBox","controls","toolMenu","addCategory","r","changeData","changeCategory","onClose","React","PropTypes","object","isRequired","string","shape","number","min","axisLabel","arrayOf","labelStep","array","func","bool","theme","styles","graphBox","transform","display","justifyContent","padding","spacing","unit","backgroundColor","color","primaryLight","borderTop","primaryDark","borderBottom","borderLeft","borderRight","svg","overflow","minHeight","withTheme"],"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 { Root, createGraphProps } from '@pie-lib/plot';\nimport cloneDeep from 'lodash/cloneDeep';\nimport ChartGrid from './grid';\nimport ChartAxes from './axes';\nimport debug from 'debug';\nimport { color } from '@pie-lib/render-ui';\nimport { dataToXBand, getDomainAndRangeByChartType, getGridLinesAndAxisByChartType, getTopPadding } from './utils';\nimport ToolMenu from './tool-menu';\nimport chartTypes from './chart-types';\nimport { AlertDialog } from '@pie-lib/config-ui';\n\nconst log = debug('pie-lib:charts:chart');\n\nexport class Chart extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      dialog: {\n        open: false,\n      },\n    };\n    this.maskUid = this.generateMaskId();\n  }\n\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    chartType: PropTypes.string.isRequired,\n    size: PropTypes.shape({\n      width: PropTypes.number,\n      height: PropTypes.number,\n    }),\n    domain: PropTypes.shape({\n      label: PropTypes.string,\n      min: PropTypes.number,\n      max: PropTypes.number,\n      axisLabel: PropTypes.string,\n    }),\n    data: PropTypes.arrayOf(PropTypes.shape({ label: PropTypes.string, value: PropTypes.number })),\n    range: PropTypes.shape({\n      label: PropTypes.string,\n      min: PropTypes.number,\n      max: PropTypes.number,\n      step: PropTypes.number,\n      labelStep: PropTypes.number,\n      axisLabel: PropTypes.string,\n    }),\n    charts: PropTypes.array,\n    title: PropTypes.string,\n    onDataChange: PropTypes.func,\n    addCategoryEnabled: PropTypes.bool,\n    showPixelGuides: PropTypes.bool,\n    categoryDefaultLabel: PropTypes.string,\n    defineChart: PropTypes.bool,\n    theme: PropTypes.object,\n  };\n\n  static defaultProps = {\n    size: {\n      width: 480,\n      height: 480,\n    },\n  };\n\n  state = {\n    charts: [\n      chartTypes.Bar(),\n      chartTypes.Histogram(),\n      chartTypes.LineDot(),\n      chartTypes.LineCross(),\n      chartTypes.DotPlot(),\n      chartTypes.LinePlot(),\n    ],\n  };\n\n  generateMaskId() {\n    return 'chart-' + (Math.random() * 10000).toFixed();\n  }\n\n  handleAlertDialog = (open, callback) =>\n    this.setState(\n      {\n        dialog: { open },\n      },\n      callback,\n    );\n\n  getChart = () => {\n    const charts = this.props.charts || this.state.charts;\n    let { chartType } = this.props;\n    let ChartComponent = null;\n    let chart = null;\n\n    if (chartType) {\n      chart = charts && charts.find((chart) => chart.type === chartType);\n      ChartComponent = chart && chart.Component;\n    } else {\n      chart = charts && charts[0];\n      ChartComponent = chart && chart.Component;\n      chartType = chart && chart.type;\n    }\n\n    return {\n      type: chartType,\n      ChartComponent,\n    };\n  };\n\n  changeData = (data) => {\n    const { onDataChange } = this.props;\n\n    onDataChange(data);\n  };\n\n  changeCategory = (index, newCategory) => {\n    const integerIndex = parseInt(index, 10);\n\n    if (integerIndex >= 0) {\n      const { data, onDataChange } = this.props;\n      data[integerIndex] = {\n        ...data[integerIndex],\n        ...newCategory,\n      };\n\n      onDataChange(data);\n    }\n  };\n\n  addCategory = (range) => {\n    const { onDataChange, data, categoryDefaultLabel, defineChart } = this.props;\n\n    if (!defineChart && data.length > 19) {\n      this.setState({\n        dialog: {\n          open: true,\n          title: 'Warning',\n          text: \"There can't be more than 20 categories.\",\n          onConfirm: () => this.handleAlertDialog(false),\n        },\n      });\n    } else {\n      onDataChange([\n        ...data,\n        {\n          inDefineChart: defineChart,\n          autoFocus: true,\n          label: categoryDefaultLabel || 'New Bar',\n          value: range.step,\n          deletable: true,\n          editable: true,\n          interactive: true,\n        },\n      ]);\n    }\n  };\n\n  getFilteredCategories = () => {\n    const { data, defineChart } = this.props;\n\n    return data\n      ? data.map((d) => ({\n          ...d,\n          deletable: defineChart || d.deletable,\n        }))\n      : [];\n  };\n\n  render() {\n    const {\n      classes,\n      className,\n      domain = {},\n      range = {},\n      size,\n      title,\n      onChangeTitle,\n      onChangeLabels,\n      labelsPlaceholders,\n      titlePlaceholder,\n      addCategoryEnabled,\n      showPixelGuides,\n      error,\n    } = this.props;\n    let { chartType } = this.props;\n\n    const { dialog } = this.state;\n    const defineChart = this.props.defineChart || false;\n    const { width, height } = size || {};\n    const labels = { left: range?.label || '', bottom: domain?.label || '' };\n\n    const { ChartComponent } = this.getChart();\n    const categories = this.getFilteredCategories();\n\n    const correctValues = getDomainAndRangeByChartType(domain, range, chartType);\n\n    const { verticalLines, horizontalLines, leftAxis } = getGridLinesAndAxisByChartType(correctValues.range, chartType);\n    const common = {\n      graphProps: createGraphProps(correctValues.domain, correctValues.range, size, () => this.rootNode),\n    };\n\n    log('[render] common:', common);\n\n    const maskSize = { x: -10, y: -10, width: width + 20, height: height + 80 };\n    const { scale } = common.graphProps;\n    const xBand = dataToXBand(scale.x, categories, width, chartType);\n\n    if (!ChartComponent) {\n      return null;\n    }\n\n    const bandWidth = xBand.bandwidth();\n    // for chartType \"line\", bandWidth will be 0, so we have to calculate it\n    const barWidth = bandWidth || scale.x(correctValues.domain.max) / categories.length;\n    const increaseHeight = defineChart ? 160 : 60;\n\n    // if there are many categories, we have to rotate their names in order to fit\n    // and we have to add extra value on top of some items\n    const top = getTopPadding(barWidth);\n    const rootCommon = cloneDeep(common);\n    rootCommon.graphProps.size.height += top + increaseHeight;\n\n    return (\n      <div className={classNames(classes.chart, classes.chartBox, className)}>\n        <div className={classes.controls}>\n          <ToolMenu\n            className={classes.toolMenu}\n            disabled={!addCategoryEnabled}\n            addCategory={() => this.addCategory(correctValues.range)}\n          />\n        </div>\n\n        <Root\n          title={title}\n          onChangeTitle={onChangeTitle}\n          disabledTitle={!defineChart}\n          showTitle={true}\n          showLabels={true}\n          labels={labels}\n          onChangeLabels={onChangeLabels}\n          labelsPlaceholders={labelsPlaceholders}\n          titlePlaceholder={titlePlaceholder}\n          defineChart={defineChart}\n          disabledLabels={!defineChart}\n          isChart={true}\n          showPixelGuides={showPixelGuides}\n          rootRef={(r) => (this.rootNode = r)}\n          {...rootCommon}\n        >\n          <ChartGrid {...common} xBand={xBand} rowTickValues={horizontalLines} columnTickValues={verticalLines} />\n          <ChartAxes\n            {...common}\n            defineChart={defineChart}\n            categories={categories}\n            xBand={xBand}\n            leftAxis={leftAxis}\n            onChange={this.changeData}\n            onChangeCategory={this.changeCategory}\n            top={top}\n            error={error}\n          />\n          <mask mask={`${this.maskUid}`}>\n            <rect {...maskSize} fill=\"white\" />\n          </mask>\n          <g id=\"marks\" mask={`url('#${this.maskUid}')`}>\n            <ChartComponent\n              {...common}\n              data={categories}\n              defineChart={defineChart}\n              onChange={this.changeData}\n              onChangeCategory={this.changeCategory}\n            />\n          </g>\n        </Root>\n        <AlertDialog\n          open={dialog.open}\n          title={dialog.title}\n          text={dialog.text}\n          onClose={dialog.onClose}\n          onConfirm={dialog.onConfirm}\n        />\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  graphBox: {\n    transform: 'translate(60px, 35px)',\n  },\n  controls: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    padding: theme.spacing.unit,\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  },\n  svg: {\n    overflow: 'visible',\n  },\n  toolMenu: {\n    minHeight: '36px',\n  },\n  chartBox: {\n    width: 'min-content',\n  },\n});\n\nexport default withStyles(styles, { withTheme: true })(Chart);\n"],"file":"chart.js"}

package/lib/common/styles.js

@@ -15,7 +15,7 @@ var disabled = function disabled() {
   var _ref;
 
   var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'fill';
-  return _ref = {}, (0, _defineProperty2["default"])(_ref, key, "var(--graph-disabled, ".concat(_renderUi.color.disabled(), ")")), (0, _defineProperty2["default"])(_ref, "pointerEvents", 'none'), _ref;
+  return _ref = {}, (0, _defineProperty2["default"])(_ref, key, "var(--graph-disabled, ".concat(_renderUi.color.disabled(), ")")), (0, _defineProperty2["default"])(_ref, "pointerEvents", 'none'), (0, _defineProperty2["default"])(_ref, "border", 'none'), _ref;
 };
 
 exports.disabled = disabled;
@@ -24,7 +24,7 @@ var correct = function correct() {
   var _ref2;
 
   var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'fill';
-  return _ref2 = {}, (0, _defineProperty2["default"])(_ref2, key, _renderUi.color.correct()), (0, _defineProperty2["default"])(_ref2, "pointerEvents", 'none'), _ref2;
+  return _ref2 = {}, (0, _defineProperty2["default"])(_ref2, key, _renderUi.color.correct()), (0, _defineProperty2["default"])(_ref2, "pointerEvents", 'none'), (0, _defineProperty2["default"])(_ref2, "border", "solid 1px ".concat(_renderUi.color.correct())), _ref2;
 };
 
 exports.correct = correct;
@@ -33,7 +33,7 @@ var incorrect = function incorrect() {
   var _ref3;
 
   var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'fill';
-  return _ref3 = {}, (0, _defineProperty2["default"])(_ref3, key, _renderUi.color.incorrect()), (0, _defineProperty2["default"])(_ref3, "pointerEvents", 'none'), _ref3;
+  return _ref3 = {}, (0, _defineProperty2["default"])(_ref3, key, _renderUi.color.incorrect()), (0, _defineProperty2["default"])(_ref3, "pointerEvents", 'none'), (0, _defineProperty2["default"])(_ref3, "border", "solid 1px ".concat(_renderUi.color.incorrect())), _ref3;
 };
 
 exports.incorrect = incorrect;

package/lib/common/styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/common/styles.js"],"names":["disabled","key","color","correct","incorrect"],"mappings":";;;;;;;;;;;AAAA;;AAEO,IAAMA,QAAQ,GAAG,SAAXA,QAAW;AAAA;;AAAA,MAACC,GAAD,uEAAO,MAAP;AAAA,2DACrBA,GADqB,kCACUC,gBAAMF,QAAN,EADV,iEAEP,MAFO;AAAA,CAAjB;;;;AAKA,IAAMG,OAAO,GAAG,SAAVA,OAAU;AAAA;;AAAA,MAACF,GAAD,uEAAO,MAAP;AAAA,6DACpBA,GADoB,EACdC,gBAAMC,OAAN,EADc,4DAEN,MAFM;AAAA,CAAhB;;;;AAKA,IAAMC,SAAS,GAAG,SAAZA,SAAY;AAAA;;AAAA,MAACH,GAAD,uEAAO,MAAP;AAAA,6DACtBA,GADsB,EAChBC,gBAAME,SAAN,EADgB,4DAER,MAFQ;AAAA,CAAlB","sourcesContent":["import { color } from '@pie-lib/render-ui';\n\nexport const disabled = (key = 'fill') => ({\n  [key]: `var(--graph-disabled, ${color.disabled()})`,\n  pointerEvents: 'none',\n});\n\nexport const correct = (key = 'fill') => ({\n  [key]: color.correct(),\n  pointerEvents: 'none',\n});\n\nexport const incorrect = (key = 'fill') => ({\n  [key]: color.incorrect(),\n  pointerEvents: 'none',\n});\n"],"file":"styles.js"}
+{"version":3,"sources":["../../src/common/styles.js"],"names":["disabled","key","color","correct","incorrect"],"mappings":";;;;;;;;;;;AAAA;;AAEO,IAAMA,QAAQ,GAAG,SAAXA,QAAW;AAAA;;AAAA,MAACC,GAAD,uEAAO,MAAP;AAAA,2DACrBA,GADqB,kCACUC,gBAAMF,QAAN,EADV,iEAEP,MAFO,oDAGd,MAHc;AAAA,CAAjB;;;;AAMA,IAAMG,OAAO,GAAG,SAAVA,OAAU;AAAA;;AAAA,MAACF,GAAD,uEAAO,MAAP;AAAA,6DACpBA,GADoB,EACdC,gBAAMC,OAAN,EADc,4DAEN,MAFM,yEAGAD,gBAAMC,OAAN,EAHA;AAAA,CAAhB;;;;AAMA,IAAMC,SAAS,GAAG,SAAZA,SAAY;AAAA;;AAAA,MAACH,GAAD,uEAAO,MAAP;AAAA,6DACtBA,GADsB,EAChBC,gBAAME,SAAN,EADgB,4DAER,MAFQ,yEAGFF,gBAAME,SAAN,EAHE;AAAA,CAAlB","sourcesContent":["import { color } from '@pie-lib/render-ui';\n\nexport const disabled = (key = 'fill') => ({\n  [key]: `var(--graph-disabled, ${color.disabled()})`,\n  pointerEvents: 'none',\n  border: 'none',\n});\n\nexport const correct = (key = 'fill') => ({\n  [key]: color.correct(),\n  pointerEvents: 'none',\n  border: `solid 1px ${color.correct()}`,\n});\n\nexport const incorrect = (key = 'fill') => ({\n  [key]: color.incorrect(),\n  pointerEvents: 'none',\n  border: `solid 1px ${color.incorrect()}`,\n});\n"],"file":"styles.js"}

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "5.6.17-next.0+fc6e1d15",
+  "version": "5.6.17-next.32+e8e4e4e4",
   "description": "charting",
   "keywords": [
     "react",
@@ -43,5 +43,5 @@
   "peerDependencies": {
     "react": "^16.8.1"
   },
-  "gitHead": "fc6e1d15f626c41ec611aff2ab7ade905456097f"
+  "gitHead": "e8e4e4e4fcef020b935fdee086a97908a79d4a89"
 }

package/src/chart.jsx

@@ -23,6 +23,7 @@ export class Chart extends React.Component {
         open: false,
       },
     };
+    this.maskUid = this.generateMaskId();
   }
 
   static propTypes = {
@@ -76,6 +77,10 @@ export class Chart extends React.Component {
     ],
   };
 
+  generateMaskId() {
+    return 'chart-' + (Math.random() * 10000).toFixed();
+  }
+
   handleAlertDialog = (open, callback) =>
     this.setState(
       {
@@ -257,10 +262,10 @@ export class Chart extends React.Component {
             top={top}
             error={error}
           />
-          <mask id="myMask">
+          <mask mask={`${this.maskUid}`}>
             <rect {...maskSize} fill="white" />
           </mask>
-          <g id="marks" mask="url('#myMask')">
+          <g id="marks" mask={`url('#${this.maskUid}')`}>
             <ChartComponent
               {...common}
               data={categories}

package/src/common/styles.js

@@ -3,14 +3,17 @@ import { color } from '@pie-lib/render-ui';
 export const disabled = (key = 'fill') => ({
   [key]: `var(--graph-disabled, ${color.disabled()})`,
   pointerEvents: 'none',
+  border: 'none',
 });
 
 export const correct = (key = 'fill') => ({
   [key]: color.correct(),
   pointerEvents: 'none',
+  border: `solid 1px ${color.correct()}`,
 });
 
 export const incorrect = (key = 'fill') => ({
   [key]: color.incorrect(),
   pointerEvents: 'none',
+  border: `solid 1px ${color.incorrect()}`,
 });