Verify each finding against the current code and only fix it if needed.

Inline comments:
In @.github/skills/example/SKILL.md:
- Line 13: Typo in the guideline sentence: replace "It most not import any
internal Recharts components or utilities, but only use the public API of
Recharts. Meaning: only imports directly from `recharts` package are allowed."
with the corrected wording using "must" instead of "most" (e.g., "It must not
import any internal Recharts components or utilities...") to fix the spelling
error in SKILL.md.
- Around line 24-37: The description and code example use inconsistent function
names: the text mentions generateRandomData while the example imports and uses
generateMockData; choose one name and make both match. Update either the
human-readable list item to mention generateMockData (if that is the real API)
or change the import and usage in the example to generateRandomData so the
symbol names align; ensure the referenced function name (generateRandomData or
generateMockData) appears identically in both the description and in the
import/usage within the example component.

In `@www/src/components/GuideView/Animations/AnimationsExample.tsx`:
- Around line 19-24: The ControlsType currently forces isAnimationActive to
boolean, which prevents the example from representing the documented boolean |
'auto' API; change the isAnimationActive property in ControlsType to "boolean |
'auto'", update the AnimationsExample component's initial controls/default state
to use 'auto' (not true) as the default, and update any UI controls/handlers in
AnimationsExample that set or toggle isAnimationActive to accept and preserve
the 'auto' value so the demo correctly passes boolean | 'auto' through to the
animated components (search for ControlsType, isAnimationActive, and any
setControls or onChange handlers to apply these changes).

In `@www/src/components/GuideView/Animations/index.tsx`:
- Around line 74-77: Update the docstring for the animation prop in Animations
(index.tsx) so the description of 'auto' no longer implies SSR is currently
supported: state that SSR rendering for charts is not yet supported and the
SSR-related behavior is preparatory, and emphasize that in practice 'auto'
primarily respects the user's reduced-motion preference while 'true' forces
animation (ignoring reduced-motion). Reference the 'auto' value and the file's
Animations description text to locate and replace the existing paragraph.
- Around line 155-161: Update the explanatory text about cubic-bezier in the
GuideView Animations component to remove the strict "between 0 and 1" statement
and instead state that control points are typically in the 0–1 range but may
exceed those bounds (e.g., cubic-bezier(.32,1.75,0,.94) uses y1 > 1) so the
example is consistent with the guidance; modify the paragraph that currently
mentions "<code>x1</code>, <code>y1</code>, <code>x2</code> and <code>y2</code>
are numbers between 0 and 1" to the relaxed wording and keep the existing
example and link intact.

Verify each finding against the current code and only fix it if needed.

Inline comments:
In @.github/skills/example/SKILL.md:
- Line 8: Update the prose in the SKILL.md guide to fix the awkward phrasing:
change "Example is a JSX component that renders a chart." to "The Example
component is a JSX component that renders a chart." remove any stray ".:"
characters, change "and couple..." to "and a couple..." and add the missing
article in "accept object..." to "accept an object..."; search for those exact
phrases ("Example is a JSX component that renders a chart.", ".:", "and couple",
"accept object") and apply these small wording/grammar edits consistently at the
other occurrences mentioned.

---

Duplicate comments:
In `@www/src/components/GuideView/Animations/index.tsx`:
- Around line 157-161: Update the explanatory text in the Animations guide where
it currently states that x1, y1, x2 and y2 "are numbers between 0 and 1" to
reflect that control points are typically in the 0–1 range but may be less than
0 or greater than 1 to produce overshooting curves (as shown by the example in
AnimationsExample.tsx where y1 = 1.75); change the sentence in the paragraph
around the cubic-bezier explanation to mention that out-of-range values create
overshoot and keep the cubic-bezier.com link intact so readers can experiment
visually.

---

Nitpick comments:
In `@www/src/components/GuideView/Animations/AnimationsExample.tsx`:
- Line 92: Remove the blanket "/* eslint-disable
jsx-a11y/control-has-associated-label */" at the top of AnimationsExample and
address accessibility per-control: locate the AnimationsExample component and
for each control element (buttons, icon buttons, inputs) add an appropriate
aria-label or aria-labelledby attribute or wrap with a <label>, or if you must
suppress a rule do a focused eslint-disable-next-line directly on the specific
JSX line (e.g., on the IconButton or <button> element) instead of disabling the
rule globally.