@pie-lib/charting 5.1.4 → 5.1.7

package/src/chart.jsx

@@ -47,6 +47,7 @@ export class Chart extends React.Component {
     title: PropTypes.string,
     onDataChange: PropTypes.func,
     addCategoryEnabled: PropTypes.bool,
+    showPixelGuides: PropTypes.bool,
     categoryDefaultLabel: PropTypes.string,
     defineChart: PropTypes.bool,
     theme: PropTypes.object
@@ -140,7 +141,16 @@ export class Chart extends React.Component {
   };
 
   render() {
-    const { classes, className, domain, range, size, title, addCategoryEnabled } = this.props;
+    const {
+      classes,
+      className,
+      domain,
+      range,
+      size,
+      title,
+      addCategoryEnabled,
+      showPixelGuides
+    } = this.props;
     let { chartType } = this.props;
 
     const defineChart = this.props.defineChart || false;
@@ -186,7 +196,7 @@ export class Chart extends React.Component {
     rootCommon.graphProps.size.height += top + increaseHeight;
 
     return (
-      <div className={classNames(classes.class, className)}>
+      <div className={classNames(classes.chart, className)}>
         <div className={classes.controls}>
           <ToolMenu
             className={classes.toolMenu}
@@ -194,7 +204,14 @@ export class Chart extends React.Component {
             addCategory={() => this.addCategory(correctValues.range)}
           />
         </div>
-        <Root title={title} classes={classes} rootRef={r => (this.rootNode = r)} {...rootCommon}>
+        <Root
+          title={title}
+          thisIsChart={defineChart}
+          showPixelGuides={showPixelGuides}
+          classes={classes}
+          rootRef={r => (this.rootNode = r)}
+          {...rootCommon}
+        >
           <ChartGrid
             {...common}
             xBand={xBand}
@@ -233,8 +250,12 @@ const styles = theme => ({
   graphBox: {
     transform: 'translate(60px, 35px)'
   },
+  chart: {
+    display: 'flex',
+    flexDirection: 'column',
+    width: 'min-content'
+  },
   controls: {
-    width: 'inherit',
     display: 'flex',
     justifyContent: 'space-between',
     padding: theme.spacing.unit,
@@ -244,12 +265,6 @@ const styles = theme => ({
     borderLeft: `solid 1px ${color.primaryDark()}`,
     borderRight: `solid 1px ${color.primaryDark()}`
   },
-  root: {
-    overflow: 'hidden'
-  },
-  svg: {
-    overflow: 'visible'
-  },
   toolMenu: {
     minHeight: '36px'
   }

package/src/common/drag-handle.jsx

@@ -33,6 +33,7 @@ export class RawDragHandle extends React.Component {
       ...rest
     } = this.props;
     const { scale } = graphProps;
+
     return (
       <svg
         x={x}
@@ -107,6 +108,7 @@ export const D = gridDraggable({
     //TODO: should be in grid-draggable, if axis is y delta.x should always be 0.
     delta.x = 0;
     const newPoint = utils.point(props).add(utils.point(delta));
+
     return newPoint.y;
   },
   bounds: (props, { domain, range }) => {

package/src/mark-label.jsx

@@ -16,8 +16,7 @@ const styles = theme => ({
     color: color.primaryDark(),
     '&.correct': correct('color'),
     '&.incorrect': incorrect('color'),
-    '&.disabled': disabled('color'),
-    backgroundColor: 'transparent !important'
+    '&.disabled': { ...disabled('color'), backgroundColor: 'transparent !important' }
   }
 });