@pie-lib/charting 4.5.6 → 4.5.11-next.256

package/lib/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils.js"],"names":["tickCount","utils","bounds","point","bandKey","d","index","label","dataToXBand","scaleX","data","width","type","rangeRound","domain","map","padding","range","getTickValues","prop","tickValues","tickVal","min","max","push","Math","round","step","getDomainAndRangeByChartType","chartType","labelStep","numberMax","parseFloat","intMin","intMax","getGridLinesAndAxisByChartType","verticalLines","undefined","horizontalLines","leftAxis","getRotateAngle","barWidth","getTopPadding"],"mappings":"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","sourcesContent":["import { scaleBand, scalePoint } from '@vx/scale';\nimport { utils } from '@pie-lib/plot';\n\nexport const tickCount = utils.tickCount;\nexport const bounds = utils.bounds;\nexport const point = utils.point;\n\nexport const bandKey = (d, index) => `${index}-${d.label || '-'}`;\n\nexport const dataToXBand = (scaleX, data, width, type) => {\n  switch (type) {\n    case 'bar':\n    case 'dotPlot':\n    case 'linePlot':\n      return scaleBand({\n        rangeRound: [0, width],\n        domain: data && data.map(bandKey),\n        padding: 0.2\n      });\n    case 'histogram':\n      return scaleBand({\n        rangeRound: [0, width],\n        domain: data && data.map(bandKey),\n        padding: 0\n      });\n    case 'lineCross':\n    case 'lineDot':\n      return scalePoint({\n        domain: data && data.map(bandKey),\n        rangeRound: [0, width]\n      });\n    default:\n      return scaleBand({\n        range: [0, width],\n        domain: data && data.map(bandKey),\n        padding: 0\n      });\n  }\n};\n\nexport const getTickValues = (prop = {}) => {\n  const tickValues = [];\n  let tickVal = prop.min;\n\n  while (tickVal <= prop.max) {\n    tickValues.push(tickVal);\n    tickVal = Math.round((tickVal + prop.step) * 100) / 100;\n  }\n\n  return tickValues;\n};\n\nexport const getDomainAndRangeByChartType = (domain, range, chartType) => {\n  let { step, labelStep, min, max } = range || {};\n\n  if (!min) {\n    min = 0;\n  }\n\n  if (!max || max < 0) {\n    max = range.min + 1;\n  }\n\n  const numberMax = parseFloat(max);\n\n  if (!step) {\n    if (numberMax < 20) {\n      step = 1;\n    } else if (numberMax >= 20 && numberMax < 100) {\n      step = 5;\n    } else {\n      step = 10;\n    }\n  }\n\n  if (!labelStep) {\n    labelStep = numberMax;\n  }\n\n  switch (chartType) {\n    // if chart is dot plot or line plot, we should ignore step and make sure that min & max are integer values\n    case 'dotPlot':\n    case 'linePlot': {\n      const intMin = Math.round(min);\n      const intMax = Math.round(max);\n\n      return {\n        domain: {\n          ...domain,\n          step: 1,\n          labelStep: 1,\n          min: 0,\n          max: 1\n        },\n        range: {\n          ...range,\n          min: intMin,\n          max: intMin === intMax ? intMin + 1 : intMax,\n          labelStep,\n          step: 1\n        }\n      };\n    }\n    default:\n      return {\n        domain: {\n          ...domain,\n          step: 1,\n          labelStep: 1,\n          min: 0,\n          max: 1\n        },\n        range: {\n          ...range,\n          labelStep,\n          step\n        }\n      };\n  }\n};\n\nexport const getGridLinesAndAxisByChartType = (range, chartType) => {\n  switch (chartType) {\n    case 'lineDot':\n    case 'lineCross':\n      return {\n        verticalLines: undefined,\n        horizontalLines: getTickValues(range),\n        leftAxis: true\n      };\n    case 'dotPlot':\n    case 'linePlot':\n      return {\n        verticalLines: [],\n        horizontalLines: [],\n        leftAxis: false\n      };\n    default:\n      return {\n        verticalLines: [],\n        horizontalLines: getTickValues(range),\n        leftAxis: true\n      };\n  }\n};\n\nexport const getRotateAngle = barWidth => {\n  if (barWidth < 30) {\n    return 75;\n  }\n\n  if (barWidth < 40) {\n    return 45;\n  }\n\n  if (barWidth < 60) {\n    return 25;\n  }\n\n  return 0;\n};\n\nexport const getTopPadding = barWidth => {\n  if (barWidth < 30) {\n    return 50;\n  }\n\n  if (barWidth < 40) {\n    return 30;\n  }\n\n  if (barWidth < 60) {\n    return 15;\n  }\n\n  return 0;\n};\n"],"file":"utils.js"}
+{"version":3,"sources":["../src/utils.js"],"names":["tickCount","utils","bounds","point","bandKey","d","index","label","dataToXBand","scaleX","data","width","type","rangeRound","domain","map","padding","range","getTickValues","prop","tickValues","tickVal","min","max","push","Math","round","step","customLabelStep","rangeMax","size","labelFontSize","ceilMax","ceil","segmentLength","height","ticksToFitInOneSegment","tickWidthPerSegment","rawLabelStep","roundedStep","labelStep","crowdedTicks","numberOfSegments","modulo","a","b","Number","isInteger","decimals","toString","split","pop","length","aux","pow","getDomainAndRangeByChartType","chartType","isNaN","crowded","intMin","intMax","getGridLinesAndAxisByChartType","verticalLines","undefined","horizontalLines","leftAxis","getRotateAngle","fontSize","getTopPadding","barWidth"],"mappings":"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","sourcesContent":["import { scaleBand, scalePoint } from '@vx/scale';\nimport { utils } from '@pie-lib/plot';\n\nexport const tickCount = utils.tickCount;\nexport const bounds = utils.bounds;\nexport const point = utils.point;\n\nexport const bandKey = (d, index) => `${index}-${d.label || '-'}`;\n\nexport const dataToXBand = (scaleX, data, width, type) => {\n  switch (type) {\n    case 'bar':\n    case 'dotPlot':\n    case 'linePlot':\n      return scaleBand({\n        rangeRound: [0, width],\n        domain: data && data.map(bandKey),\n        padding: 0.2\n      });\n    case 'histogram':\n      return scaleBand({\n        rangeRound: [0, width],\n        domain: data && data.map(bandKey),\n        padding: 0\n      });\n    case 'lineCross':\n    case 'lineDot':\n      return scalePoint({\n        domain: data && data.map(bandKey),\n        rangeRound: [0, width]\n      });\n    default:\n      return scaleBand({\n        range: [0, width],\n        domain: data && data.map(bandKey),\n        padding: 0\n      });\n  }\n};\n\nexport const getTickValues = (prop = {}) => {\n  const tickValues = [];\n  let tickVal = prop.min;\n\n  while (tickVal <= prop.max) {\n    tickValues.push(tickVal);\n    tickVal = Math.round((tickVal + prop.step) * 100) / 100;\n  }\n\n  return tickValues;\n};\n\nexport const customLabelStep = (rangeMax, size, labelFontSize) => {\n  const ceilMax = Math.ceil(rangeMax);\n  const segmentLength = size.height / ceilMax;\n  const ticksToFitInOneSegment = 2;\n\n  // how many ticksWidth fit in a segment\n  const tickWidthPerSegment = segmentLength / labelFontSize;\n  const rawLabelStep = ticksToFitInOneSegment / tickWidthPerSegment;\n  const roundedStep = Math.ceil((rawLabelStep * 10) / 10);\n\n  let labelStep;\n\n  if (rawLabelStep > 0.15) {\n    labelStep = roundedStep;\n  } else if (rawLabelStep < 0.05) {\n    labelStep = 0.1;\n  } else {\n    labelStep = 0.5;\n  }\n\n  return labelStep;\n};\n\nexport const crowdedTicks = (rangeMax, customLabelStep, size, labelFontSize) => {\n  const ceilMax = Math.ceil(rangeMax);\n\n  const numberOfSegments = ceilMax * customLabelStep;\n\n  return size.height / numberOfSegments < labelFontSize && size.height / numberOfSegments > 0.5;\n};\n\n// multiply values with 10^number_of_decimals if needed because modulo function(%) is only defined for integers\nconst modulo = (a, b) => {\n  if (Number.isInteger(b)) {\n    return a % b;\n  }\n\n  const decimals = b\n    .toString()\n    .split('.')\n    .pop().length;\n  const aux = Math.pow(10, decimals);\n\n  return (a * aux) % (b * aux);\n};\n\nexport const getDomainAndRangeByChartType = (domain, range, size, chartType, labelFontSize) => {\n  let { step, labelStep, min, max } = range || {};\n\n  if (!min) {\n    min = 0;\n  }\n\n  if (!max || max < 0) {\n    max = range.min + 1;\n  }\n\n  if (labelStep && !step) {\n    step = labelStep;\n  }\n  if (!labelStep || (isNaN(labelStep) && step)) {\n    let customLabelStep = step;\n    let crowded = crowdedTicks(max, customLabelStep, size, labelFontSize);\n\n    if (crowded) {\n      customLabelStep = customLabelStep * 2;\n    }\n\n    labelStep = customLabelStep;\n  }\n\n  if (!step || (isNaN(step) && !labelStep) || isNaN(labelStep)) {\n    labelStep = customLabelStep(max, size, labelFontSize);\n\n    if (labelStep <= 1) {\n      step = labelStep;\n    } else if (labelStep <= 4) {\n      step = 1;\n    } else if (labelStep > 4 && labelStep < 10) {\n      step = labelStep / 2;\n    } else {\n      step = labelStep / 3;\n    }\n  }\n\n  if (modulo(max, step) !== 0) {\n    max = max + step;\n  }\n\n  range.max = max;\n\n  switch (chartType) {\n    // if chart is dot plot or line plot, we should ignore step and make sure that min & max are integer values\n    case 'dotPlot':\n    case 'linePlot': {\n      const intMin = Math.round(min);\n      const intMax = Math.round(max);\n\n      return {\n        domain: {\n          ...domain,\n          step: 1,\n          labelStep: 1,\n          min: 0,\n          max: 1\n        },\n        range: {\n          ...range,\n          min: intMin,\n          max: intMin === intMax ? intMin + 1 : intMax,\n          labelStep,\n          step: 1\n        }\n      };\n    }\n    default:\n      return {\n        domain: {\n          ...domain,\n          step: 1,\n          labelStep: 1,\n          min: 0,\n          max: 1\n        },\n        range: {\n          ...range,\n          labelStep,\n          step\n        }\n      };\n  }\n};\n\nexport const getGridLinesAndAxisByChartType = (range, chartType) => {\n  switch (chartType) {\n    case 'lineDot':\n    case 'lineCross':\n      return {\n        verticalLines: undefined,\n        horizontalLines: getTickValues(range),\n        leftAxis: true\n      };\n    case 'dotPlot':\n    case 'linePlot':\n      return {\n        verticalLines: [],\n        horizontalLines: [],\n        leftAxis: false\n      };\n    default:\n      return {\n        verticalLines: [],\n        horizontalLines: getTickValues(range),\n        leftAxis: true\n      };\n  }\n};\n\nexport const getRotateAngle = (fontSize, height) => {\n  if (height >= fontSize * 2) {\n    return 25;\n  }\n\n  return 0;\n};\n\nexport const getTopPadding = barWidth => {\n  if (barWidth < 30) {\n    return 50;\n  }\n\n  if (barWidth < 40) {\n    return 30;\n  }\n\n  if (barWidth < 60) {\n    return 15;\n  }\n\n  return 0;\n};\n"],"file":"utils.js"}

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "4.5.6",
+  "version": "4.5.11-next.256+a82f29f3",
   "description": "charting",
   "keywords": [
     "react",
@@ -19,7 +19,7 @@
   "dependencies": {
     "@mapbox/point-geometry": "^0.1.0",
     "@material-ui/core": "^3.8.3",
-    "@pie-lib/plot": "^2.1.5",
+    "@pie-lib/plot": "^2.1.9",
     "@vx/axis": "^0.0.183",
     "@vx/event": "^0.0.182",
     "@vx/grid": "^0.0.183",
@@ -43,5 +43,5 @@
   "peerDependencies": {
     "react": "^16.8.1"
   },
-  "gitHead": "28d864a7a5b82946b6c32c9e5ca77dd3fb842e89"
+  "gitHead": "a82f29f3ebb98147471c1f0f727052e792cd2957"
 }

package/src/axes.jsx

@@ -46,6 +46,14 @@ export class TickComponent extends React.Component {
     const category = categories[index];
     const { deletable, editable, interactive, label, correctness } = category || {};
     const barX = xBand(bandKey({ label }, index));
+    const longestCategory = (categories || []).reduce((a, b) => {
+      const lengthA = a && a.label ? a.label.length : 0;
+      const lengthB = b && b.label ? b.label.length : 0;
+
+      return lengthA > lengthB ? a : b;
+    });
+
+    const longestLabel = (longestCategory && longestCategory.label) || '';
 
     return (
       <g>
@@ -56,6 +64,21 @@ export class TickComponent extends React.Component {
           height={24}
           style={{ pointerEvents: 'none', overflow: 'visible' }}
         >
+          {index === 0 && (
+            <div
+              id="hiddenLabel"
+              style={{
+                position: 'absolute',
+                visibility: 'hidden',
+                wordBreak: 'break-word',
+                overflow: 'visible',
+                maxWidth: barWidth,
+                display: 'block'
+              }}
+            >
+              {longestLabel}
+            </div>
+          )}
           <MarkLabel
             inputRef={r => (this.input = r)}
             disabled={!(editable && interactive)}
@@ -121,9 +144,20 @@ export class RawChartAxes extends React.Component {
     leftAxis: PropTypes.bool,
     onChange: PropTypes.func,
     onChangeCategory: PropTypes.func,
-    top: PropTypes.number
+    top: PropTypes.number,
+    theme: PropTypes.object
   };
 
+  state = { height: 0 };
+
+  componentDidMount() {
+    const height = document.getElementById('hiddenLabel')
+      ? document.getElementById('hiddenLabel').offsetHeight
+      : 0;
+
+    this.setState({ height });
+  }
+
   render() {
     const {
       classes,
@@ -133,17 +167,23 @@ export class RawChartAxes extends React.Component {
       onChange,
       onChangeCategory,
       categories = [],
-      top
+      top,
+      theme
     } = this.props;
+
     const { axis, axisLine, tick, axisLabel } = classes;
     const { scale = {}, range = {}, domain = {}, size = {} } = graphProps || {};
+    const { height } = this.state;
+
     const bottomScale =
       xBand && typeof xBand.rangeRound === 'function' && xBand.rangeRound([0, size.width]);
     const bandWidth = xBand && typeof xBand.bandwidth === 'function' && xBand.bandwidth();
     // for chartType "line", bandWidth will be 0, so we have to calculate it
     const barWidth = bandWidth || (scale.x && scale.x(domain.max) / categories.length);
+
     const rowTickValues = getTickValues({ ...range, step: range.labelStep });
-    const rotate = getRotateAngle(barWidth);
+    const fontSize = theme && theme.typography ? theme.typography.fontSize : 14;
+    const rotate = getRotateAngle(fontSize, height);
 
     const getTickLabelProps = value => ({
       dy: 4,
@@ -203,34 +243,37 @@ export class RawChartAxes extends React.Component {
   }
 }
 
-const ChartAxes = withStyles(theme => ({
-  axisLabel: {
-    fontFamily: theme.typography.body1.fontFamily,
-    fontSize: theme.typography.fontSize,
-    fill: color.secondary()
-  },
-  axis: {
-    stroke: color.primaryDark(),
-    strokeWidth: 2
-  },
-  axisLine: {
-    stroke: color.primaryDark(),
-    strokeWidth: 2
-  },
-  tick: {
-    '& > line': {
+const ChartAxes = withStyles(
+  theme => ({
+    axisLabel: {
+      fontFamily: theme.typography.body1.fontFamily,
+      fontSize: theme.typography.fontSize,
+      fill: color.secondary()
+    },
+    axis: {
       stroke: color.primaryDark(),
       strokeWidth: 2
     },
-    fill: color.primaryDark(),
-    fontFamily: theme.typography.body1.fontFamily,
-    fontSize: theme.typography.fontSize,
-    textAnchor: 'middle'
-  },
-  dottedLine: {
-    stroke: color.primaryLight(),
-    opacity: 0.2
-  }
-}))(RawChartAxes);
+    axisLine: {
+      stroke: color.primaryDark(),
+      strokeWidth: 2
+    },
+    tick: {
+      '& > line': {
+        stroke: color.primaryDark(),
+        strokeWidth: 2
+      },
+      fill: color.primaryDark(),
+      fontFamily: theme.typography.body1.fontFamily,
+      fontSize: theme.typography.fontSize,
+      textAnchor: 'middle'
+    },
+    dottedLine: {
+      stroke: color.primaryLight(),
+      opacity: 0.2
+    }
+  }),
+  { withTheme: true }
+)(RawChartAxes);
 
 export default ChartAxes;

package/src/chart.jsx

@@ -48,7 +48,8 @@ export class Chart extends React.Component {
     onDataChange: PropTypes.func,
     addCategoryEnabled: PropTypes.bool,
     editCategoryEnabled: PropTypes.bool,
-    categoryDefaultLabel: PropTypes.string
+    categoryDefaultLabel: PropTypes.string,
+    theme: PropTypes.object
   };
 
   static defaultProps = {
@@ -126,25 +127,43 @@ export class Chart extends React.Component {
   };
 
   getFilteredCategories = () => {
-    const { data, editCategoryEnabled } = this.props;
+    const { data, editCategoryEnabled, addCategoryEnabled } = this.props;
 
     return data
       ? data.map(d => ({
           ...d,
           editable: !d.initial || (d.initial && editCategoryEnabled),
-          deletable: !d.initial
+          deletable: !d.initial || (d.initial && addCategoryEnabled)
         }))
       : [];
   };
 
   render() {
-    const { classes, className, domain, range, size, title, addCategoryEnabled } = this.props;
+    const {
+      classes,
+      className,
+      domain,
+      range,
+      size,
+      title,
+      addCategoryEnabled,
+      theme
+    } = this.props;
     let { chartType } = this.props;
     const { width, height } = size || {};
 
     const { ChartComponent } = this.getChart();
     const categories = this.getFilteredCategories();
-    const correctValues = getDomainAndRangeByChartType(domain, range, chartType);
+
+    const labelFontSize = (theme && theme.typography && theme.typography.fontSize) || 14;
+    const correctValues = getDomainAndRangeByChartType(
+      domain,
+      range,
+      size,
+      chartType,
+      labelFontSize
+    );
+
     const { verticalLines, horizontalLines, leftAxis } = getGridLinesAndAxisByChartType(
       correctValues.range,
       chartType
@@ -234,9 +253,15 @@ const styles = theme => ({
     borderLeft: `solid 1px ${color.primaryDark()}`,
     borderRight: `solid 1px ${color.primaryDark()}`
   },
+  root: {
+    overflow: 'hidden'
+  },
+  svg: {
+    overflow: 'visible'
+  },
   toolMenu: {
     minHeight: '36px'
   }
 });
 
-export default withStyles(styles)(Chart);
+export default withStyles(styles, { withTheme: true })(Chart);

package/src/line/common/line.jsx

@@ -18,7 +18,7 @@ const getData = (data, domain) => {
 
   return data.map((el, i) => ({
     ...el,
-    x: i * (max / (length - 1)),
+    x: length > 1 ? i * (max / (length - 1)) : 0.5,
     y: el.value
   }));
 };

package/src/mark-label.jsx

@@ -16,7 +16,8 @@ const styles = theme => ({
     color: color.primaryDark(),
     '&.correct': correct('color'),
     '&.incorrect': incorrect('color'),
-    '&.disabled': disabled('color')
+    '&.disabled': disabled('color'),
+    backgroundColor: 'transparent !important'
   }
 });
 
@@ -37,8 +38,14 @@ export const MarkLabel = props => {
   const [label, setLabel] = useState(mark.label);
   const onChange = e => setLabel(e.target.value);
   const onChangeProp = e => props.onChange(e.target.value);
+  let extraStyle = {};
 
-  const left = rotate === 75 ? '9px' : 0;
+  if (rotate) {
+    extraStyle = {
+      width: 'unset',
+      textAlign: 'left'
+    };
+  }
 
   // useState only sets the value once, to synch props to state need useEffect
   useEffect(() => {
@@ -56,14 +63,18 @@ export const MarkLabel = props => {
       inputStyle={{
         minWidth: barWidth,
         textAlign: 'center',
-        background: 'transparent'
+        background: 'transparent',
+        boxSizing: 'border-box',
+        paddingLeft: 0,
+        paddingRight: 0,
+        ...extraStyle
       }}
       value={label}
       style={{
         position: 'absolute',
         pointerEvents: 'auto',
         top: 0,
-        left,
+        left: 0,
         minWidth: barWidth,
         transformOrigin: 'left',
         transform: `rotate(${rotate}deg)`

package/src/utils.js

@@ -50,7 +50,53 @@ export const getTickValues = (prop = {}) => {
   return tickValues;
 };
 
-export const getDomainAndRangeByChartType = (domain, range, chartType) => {
+export const customLabelStep = (rangeMax, size, labelFontSize) => {
+  const ceilMax = Math.ceil(rangeMax);
+  const segmentLength = size.height / ceilMax;
+  const ticksToFitInOneSegment = 2;
+
+  // how many ticksWidth fit in a segment
+  const tickWidthPerSegment = segmentLength / labelFontSize;
+  const rawLabelStep = ticksToFitInOneSegment / tickWidthPerSegment;
+  const roundedStep = Math.ceil((rawLabelStep * 10) / 10);
+
+  let labelStep;
+
+  if (rawLabelStep > 0.15) {
+    labelStep = roundedStep;
+  } else if (rawLabelStep < 0.05) {
+    labelStep = 0.1;
+  } else {
+    labelStep = 0.5;
+  }
+
+  return labelStep;
+};
+
+export const crowdedTicks = (rangeMax, customLabelStep, size, labelFontSize) => {
+  const ceilMax = Math.ceil(rangeMax);
+
+  const numberOfSegments = ceilMax * customLabelStep;
+
+  return size.height / numberOfSegments < labelFontSize && size.height / numberOfSegments > 0.5;
+};
+
+// multiply values with 10^number_of_decimals if needed because modulo function(%) is only defined for integers
+const modulo = (a, b) => {
+  if (Number.isInteger(b)) {
+    return a % b;
+  }
+
+  const decimals = b
+    .toString()
+    .split('.')
+    .pop().length;
+  const aux = Math.pow(10, decimals);
+
+  return (a * aux) % (b * aux);
+};
+
+export const getDomainAndRangeByChartType = (domain, range, size, chartType, labelFontSize) => {
   let { step, labelStep, min, max } = range || {};
 
   if (!min) {
@@ -61,22 +107,40 @@ export const getDomainAndRangeByChartType = (domain, range, chartType) => {
     max = range.min + 1;
   }
 
-  const numberMax = parseFloat(max);
+  if (labelStep && !step) {
+    step = labelStep;
+  }
+  if (!labelStep || (isNaN(labelStep) && step)) {
+    let customLabelStep = step;
+    let crowded = crowdedTicks(max, customLabelStep, size, labelFontSize);
 
-  if (!step) {
-    if (numberMax < 20) {
+    if (crowded) {
+      customLabelStep = customLabelStep * 2;
+    }
+
+    labelStep = customLabelStep;
+  }
+
+  if (!step || (isNaN(step) && !labelStep) || isNaN(labelStep)) {
+    labelStep = customLabelStep(max, size, labelFontSize);
+
+    if (labelStep <= 1) {
+      step = labelStep;
+    } else if (labelStep <= 4) {
       step = 1;
-    } else if (numberMax >= 20 && numberMax < 100) {
-      step = 5;
+    } else if (labelStep > 4 && labelStep < 10) {
+      step = labelStep / 2;
     } else {
-      step = 10;
+      step = labelStep / 3;
     }
   }
 
-  if (!labelStep) {
-    labelStep = numberMax;
+  if (modulo(max, step) !== 0) {
+    max = max + step;
   }
 
+  range.max = max;
+
   switch (chartType) {
     // if chart is dot plot or line plot, we should ignore step and make sure that min & max are integer values
     case 'dotPlot':
@@ -144,16 +208,8 @@ export const getGridLinesAndAxisByChartType = (range, chartType) => {
   }
 };
 
-export const getRotateAngle = barWidth => {
-  if (barWidth < 30) {
-    return 75;
-  }
-
-  if (barWidth < 40) {
-    return 45;
-  }
-
-  if (barWidth < 60) {
+export const getRotateAngle = (fontSize, height) => {
+  if (height >= fontSize * 2) {
     return 25;
   }