diff --git a/.changeset/moody-mayflies-attack.md b/.changeset/moody-mayflies-attack.md new file mode 100644 index 000000000..997e98d8c --- /dev/null +++ b/.changeset/moody-mayflies-attack.md @@ -0,0 +1,5 @@ +--- +"victory-core": patch +--- + +Fix the label background position when using dy fns diff --git a/packages/victory-core/src/victory-label/victory-label.tsx b/packages/victory-core/src/victory-label/victory-label.tsx index 3b671a6a9..41dcbe9a9 100644 --- a/packages/victory-core/src/victory-label/victory-label.tsx +++ b/packages/victory-core/src/victory-label/victory-label.tsx @@ -508,7 +508,7 @@ const getCalculatedProps = (props: T) => { verticalAnchor, dx, dy, - originalDy: props.dy, + originalDy: Helpers.evaluateProp(props.dy, props), transform, x, y, diff --git a/stories/victory-label.stories.js b/stories/victory-label.stories.js index 66b094861..20c9752e4 100644 --- a/stories/victory-label.stories.js +++ b/stories/victory-label.stories.js @@ -581,6 +581,38 @@ export const BackgroundStyles = () => { /> } /> + (datum.y > 0 ? -5 : 8)} + verticalAnchor="end" + backgroundPadding={{ top: 5, right: 5, bottom: 5, left: 5 }} + backgroundStyle={{ fill: "plum", stroke: "#000000" }} + text={[ + "Victory is awesome.", + "background styles", + "work with dy functions", + ]} + /> + } + /> + (datum.y > 0 ? -5 : 8)} + verticalAnchor="end" + backgroundPadding={{ top: 5, right: 5, bottom: 5, left: 5 }} + backgroundStyle={{ fill: "thistle", stroke: "#000000" }} + text={[ + "Victory is awesome.", + "background styles", + "work with dx functions", + ]} + /> + } + /> ); };