Minor doc updates to avoid common confusion in issues (#2869)

FormidableLabs · May 16, 2024 · be3d76b · be3d76b
1 parent 359a99e
commit be3d76b
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 2 deletions.
diff --git a/docs/src/content/docs/victory-animation.md b/docs/src/content/docs/victory-animation.md
@@ -8,6 +8,8 @@ type: docs
 
 # VictoryAnimation
 
+> [See this guide to animations with Victory Charts](/guides/animations). The `VictoryAnimation` component is used for animating arbitrary React components and is not commonly used.
+
 `VictoryAnimation` animates prop changes for any React component. To animate prop changes, define a child function that accepts an object of tweened values and other animation information and returns a component to render.
 
 ```jsx

diff --git a/docs/src/content/docs/victory-clip-container.md b/docs/src/content/docs/victory-clip-container.md
@@ -1,7 +1,7 @@
 ---
 id: 10
 title: VictoryClipContainer
-category: more
+category: containers
 type: docs
 scope: null
 ---
@@ -10,6 +10,16 @@ scope: null
 
 `VictoryClipContainer` is a specialized group container that enables curtain-style transitions for continuous data types like `VictoryLine` and `VictoryArea`. `VictoryClipContainer` will render its children either in a regular `<g>` element, or in a `<g>` element clipped by a rectangular clip path when a `clipWidth` is supplied.
 
+```playground
+<VictoryChart>
+ <VictoryLine
+ groupComponent={
+ <VictoryClipContainer clipPadding={{ top: -100 }} />
+ }
+ />
+</VictoryChart>
+```
+
 ## children
 
 `type: element || array[element]`

diff --git a/docs/src/content/docs/victory-tooltip.md b/docs/src/content/docs/victory-tooltip.md
@@ -13,6 +13,26 @@ scope:
 
 *note:* When providing tooltips for `VictoryLine` or `VictoryArea`, it is necessary to use [`VictoryVoronoiContainer`](/docs/victory-voronoi-container), as these components only render a single element for the entire dataset.
 
+See the [tooltips guide](/guides/tooltips) for more expanded examples of usage.
+
+```playground
+<VictoryChart domain={{ x: [0, 11], y: [-10, 10] }}>
+ <VictoryBar
+ labelComponent={<VictoryTooltip/>}
+ data={[
+ {x: 2, y: 5, label: "right-side-up"},
+ {x: 4, y: -6, label: "upside-down"},
+ {x: 6, y: 4, label: "tiny"},
+ {x: 8, y: -5, label: "or a little \n BIGGER"},
+ {x: 10, y: 7, label: "automatically"}
+ ]}
+ style={{
+ data: {fill: "tomato", width: 20}
+ }}
+ />
+</VictoryChart>
+```
+
 ## active
 
 `type: boolean`

diff --git a/docs/src/content/guides/animations.md b/docs/src/content/guides/animations.md
@@ -8,7 +8,7 @@ scope:
 ---
 # Animations
 
-VictoryAnimation is able to animate changes in props using [d3-interpolate][]. Victory components define their animations via the `animate` prop. `duration`, `delay`, `easing` and `onEnd` functions may all be specified via the `animate` prop.
+Victory is able to animate changes in props using [d3-interpolate][]. Victory components define their animations via the `animate` prop. `duration`, `delay`, `easing` and `onEnd` functions may all be specified via the `animate` prop.
 
 ```playground_norender
 function App() {