Skip to content

docs: remove false animate-[...] arbitrary-value section (#83) #88

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
claude wants to merge 1 commit into from
Closed

docs: remove false animate-[...] arbitrary-value section (#83) #88

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,14 @@ This project follows [Semantic Versioning 2.0.0](https://semver.org/spec/v2.0.0.

---

## [Unreleased]

### Fixed

- `doc/interactivity/animation.md`: removed the Arbitrary Values section that claimed `animate-[...]` bracket syntax works; `AnimationParser` only resolves theme-map keys, so the example silently no-ops. Use the Customizing Theme section to register custom animations. (#83)
Copy link
Copy Markdown
Author

@claude claude Bot May 27, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

CLAUDE.md rule: "one-line bullet per change." This reads as two sentences; the trailing sentence about the Customizing Theme section is guidance, not a description of the change itself. The issue ref (#83) is correct.

Suggested change
- `doc/interactivity/animation.md`: removed the Arbitrary Values section that claimed `animate-[...]` bracket syntax works; `AnimationParser` only resolves theme-map keys, so the example silently no-ops. Use the Customizing Theme section to register custom animations. (#83)
- `doc/interactivity/animation.md`: removed the `Arbitrary Values` section — `animate-[...]` bracket syntax is not implemented in `AnimationParser`; tokens not present in `context.theme.animations` silently no-op. (#83)


---

## [1.0.0] - 2026-05-21

The first stable release. Wind ships a complete utility-first styling layer for Flutter with className syntax, theming, responsive breakpoints, dark mode, dynamic JSON rendering, and a contracts-based debug bridge for external tooling. All public APIs in this release are considered stable; the surface follows Semantic Versioning from this point on.
Expand Down
10 changes: 0 additions & 10 deletions doc/interactivity/animation.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ Utilities for animating elements with CSS-like animation classes. Whether you're
- [Bounce](#bounce)
- [Responsive Design](#responsive-design)
- [Dark Mode](#dark-mode)
- [Arbitrary Values](#arbitrary-values)
- [Customizing Theme](#customizing-theme)
- [Related Documentation](#related-documentation)

Expand Down Expand Up @@ -114,15 +113,6 @@ Animations work seamlessly with dark mode. You'll typically just change the colo
WDiv(className: 'animate-pulse bg-gray-200 dark:bg-gray-700')
```

<a name="arbitrary-values"></a>
## Arbitrary Values

If the built-in animations don't quite fit, you can use arbitrary values to specify custom animation strings.

```dart
WDiv(className: 'animate-[wiggle_1s_ease-in-out_infinite]')
```

<a name="customizing-theme"></a>
## Customizing Theme
Copy link
Copy Markdown
Author

@claude claude Bot May 27, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This section (the PR's stated "correct extension path") has a bug in its own example.

AnimationParser looks up the full class token against the theme map — className is e.g. 'animate-wiggle', not 'wiggle':

// animation_parser.dart:40
context.theme.animations.containsKey(className)

The defaults confirm the key format (lib/src/theme/defaults/animations.dart):

'animate-spin': WindAnimationType.spin,
'animate-ping': WindAnimationType.ping,
// ...

The example below this heading uses 'wiggle' as the key. A user following that example gets the same silent no-op this PR is trying to fix. The key must be 'animate-wiggle':

// WRONG (current)
WindThemeData(animations: {'wiggle': WindAnimationType.bounce})

// CORRECT
WindThemeData(animations: {'animate-wiggle': WindAnimationType.bounce})

This needs fixing before the PR lands — otherwise removing the arbitrary-values section and pointing to this section is a net-zero improvement for users.


Expand Down