support function angle prop for VictoryLabel

FormidableLabs · Oct 8, 2020 · 822a72d · 822a72d
1 parent f0542fe
commit 822a72d
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 3 deletions.
diff --git a/packages/victory-core/src/index.d.ts b/packages/victory-core/src/index.d.ts
@@ -198,7 +198,7 @@ export type OriginType = { x: number; y: number };
 export type LabelOrientationType = "parallel" | "perpendicular" | "vertical";
 
 export interface VictoryLabelProps {
-  angle?: string | number;
+  angle?: StringOrNumberOrCallback;
   ariaLabel?: StringOrCallback;
   backgroundComponent?: React.ReactElement;
   backgroundStyle?: React.CSSProperties | React.CSSProperties[];

diff --git a/packages/victory-core/src/victory-label/victory-label.js b/packages/victory-core/src/victory-label/victory-label.js
@@ -146,7 +146,9 @@ const getTransform = (props) => {
   const { x, y, polar } = props;
   const style = getSingleValue(props.style);
   const defaultAngle = polar ? LabelHelpers.getPolarAngle(props) : 0;
-  const baseAngle = style.angle === undefined ? props.angle : style.angle;
+  const baseAngle = style.angle === undefined
+    ? Helpers.evaluateProp(props.angle, props)
+    : style.angle;
   const angle = baseAngle === undefined ? defaultAngle : baseAngle;
   const transform = props.transform || style.transform;
   const transformPart = transform && Helpers.evaluateProp(transform, props);
@@ -517,7 +519,7 @@ VictoryLabel.role = "label";
 VictoryLabel.defaultStyles = defaultStyles;
 VictoryLabel.propTypes = {
   active: PropTypes.bool,
-  angle: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  angle: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.func]),
   ariaLabel: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
   backgroundComponent: PropTypes.element,
   backgroundPadding: PropTypes.oneOfType([PropTypes.number, PropTypes.object, PropTypes.array]),

diff --git a/test/client/spec/victory-core/victory-label/victory-label.spec.js b/test/client/spec/victory-core/victory-label/victory-label.spec.js
@@ -34,6 +34,12 @@ describe("components/victory-label", () => {
     expect(output.prop("transform")).to.contain("rotate(46");
   });
 
+  it("accepts the angle prop as a function", () => {
+    const wrapper = shallow(<VictoryLabel angle={() => 46} text={"such text, wow"} />);
+    const output = wrapper.find(Text);
+    expect(output.prop("transform")).to.contain("rotate(46");
+  });
+
   it("strips px from fontSize", () => {
     const wrapper = shallow(<VictoryLabel style={{ fontSize: "10px" }} text={"such text, wow"} />);
     const output = wrapper.find(TSpan);