Open
Conversation
Generate structured rule files to help LLMs understand and recommend motion presets. Includes 15 pilot files across all 5 categories for format validation: - entrance: FadeIn, ArcIn, BounceIn - scroll: ParallaxScroll, FadeScroll, ArcScroll - ongoing: Pulse, Bounce, Spin - mouse: Tilt3DMouse, TrackMouse, BounceMouse - background-scroll: BgParallax, BgZoom, BgFade Each rule contains: synonyms, visual description, when to use/not use, TypeScript parameters with constraints, minimal examples, and related presets.
- Updated visual descriptions to use plain language, focusing on user experience rather than technical details. - Streamlined "When to Use" and "When NOT to Use" sections for clarity and brevity. - Enhanced examples to demonstrate meaningful differences in behavior. - Removed unnecessary technical jargon and emphasized user-centric language across multiple preset files.
- Add 5 category files (entrance.md, scroll.md, ongoing.md, mouse.md, background-scroll.md) with decision guides - Each preset now has tags and synonyms for better LLM intent matching - Simplified preset files to focus on visual description, parameters, examples - Added accessibility considerations section to category files - Added time units (ms) to all duration/delay parameters - Updated PLAN.md with new structure and guidelines
- Updated descriptions, tags, and synonyms across multiple preset files to ensure uniform formatting. - Enhanced readability by standardizing bullet points and spacing. - Improved accessibility considerations and decision guides in category files for better user guidance.
ameerabuf
reviewed
Jan 26, 2026
ydaniv
requested changes
Jan 26, 2026
Collaborator
There was a problem hiding this comment.
@tombigel @ameerabuf I don't think there's any use for a rules file per effect. I don't think there's a use-case for asking a whole file for a specific effect.
IMO there should be a single file per feature (e.g. entrance, loop) with a comparison table of all effects in that category.
Perhaps we need another single file which allows to quickly review all possible categories.
I think we should delete the single preset files. I don't think anyone will be able to review and maintain those.
Also, let's rename ongoing -> loop and mouse -> pointer
…e of truth - Add power-controlled params notes to all presets (Entrance, Scroll, Ongoing, Mouse) - Update PLAN.md with complete power mappings for regeneration - Consolidate documentation structure with presets-reference.md
- Clarify that background scroll requires data-motion-part attributes - Note that these animate DOM elements via transforms, not CSS background-position - Add ImageParallax exception for regular img elements
…n tation plan - Refactor section headings for better readability across all preset files. - Standardize usage notes for when to use and not use each animation type. - Consolidate available presets information and enhance quick decision tables. - Update PLAN.md to reflect the current status and versioning of presets.
ydaniv
requested changes
Feb 10, 2026
|
|
||
| **Important:** Entrance animations only support the `viewEnter` trigger natively. For click, toggle, or other event-based triggers, implement triggering logic separately. | ||
|
|
||
| ### Combining Animations |
Comment on lines
160
to
166
| ### Background Scroll Requirements | ||
|
|
||
| Requires `data-motion-part` attributes: `BG_LAYER`, `BG_MEDIA`, `BG_IMG` | ||
|
|
||
| Animates DOM elements via CSS transforms (not `background-position`). | ||
|
|
||
| **Exception:** `ImageParallax` works on regular `<img>` elements without `data-motion-part`. |
Collaborator
There was a problem hiding this comment.
This should be removed. Some of it is completely off, the rest not relevant for now, we'll have to review this mechanism.
|
|
||
| **Important:** Entrance animations only support the `viewEnter` trigger natively. For click, toggle, or other event-based triggers, implement triggering logic separately. | ||
|
|
||
| ### Combining Animations |
Comment on lines
140
to
146
| | Trigger | Mechanism | Notes | | ||
| | ----------------- | ------------------------------------- | --------------------------------------- | | ||
| | entrance | `viewEnter` (intersection observer) | Plays once when element enters viewport | | ||
| | scroll | Scroll position binding | Tied to scroll progress (0-100%) | | ||
| | ongoing | Continuous loop | Runs indefinitely until stopped | | ||
| | mouse | Pointer position binding | Desktop only, real-time response | | ||
| | background-scroll | Scroll + `data-motion-part` targeting | Requires structured DOM (see below) | |
Collaborator
There was a problem hiding this comment.
These are not triggers, these are sort of preset categories. They are sometimes optimized for a specific trigger but not necessarily.
entrance can be used with hover, click, animationend, etc.
So this section requires rewriting.
Contributor
Author
There was a problem hiding this comment.
yeah, i get it, it should be more like "what to use when the user asks for..." right?
|
|
||
| **Important:** Entrance animations only support the `viewEnter` trigger natively. For click, toggle, or other event-based triggers, implement triggering logic separately. | ||
|
|
||
| ### Combining Animations |
|
|
||
| ## Regeneration Steps | ||
|
|
||
| 1. Check Preset Registry in this file for active presets (skip REMOVED presets) |
| 3. For each active preset, get params from library implementation | ||
| 4. Apply parameter naming conventions from this file | ||
| 5. Generate using preset entry format above | ||
| 6. Organize by trigger category |
Collaborator
There was a problem hiding this comment.
Not "trigger", category maybe yes
|
|
||
| ## Intensity Value Guide (Legacy Power Reference) | ||
|
|
||
| The `power` parameter was removed from presets. When users ask for "soft", "subtle", "medium", or "hard"/"dramatic" effects, use these value mappings as guidance for suggesting appropriate parameter values. |
Collaborator
There was a problem hiding this comment.
Since we're removing power, we can remove referencing it.
| | Preset | Parameter | Subtle/Soft | Medium | Dramatic/Hard | | ||
| | -------- | ---------------- | ----------- | ------- | ------------- | | ||
| | ArcIn | easing | quintInOut | backOut | backInOut | | ||
| | BlurIn | blur | 6px | 25px | 50px | |
Collaborator
There was a problem hiding this comment.
I think 50px is kinda extreme.
Maybe use 12-15 for Med and 20-30 for Hard
Comment on lines
470
to
483
| ## Migration Reference | ||
|
|
||
| For users migrating from removed presets: | ||
|
|
||
| | Removed Preset | Migration | | ||
| | -------------- | --------------------------------------------------------------------------- | | ||
| | GlitchIn | Use `GlideIn` with desired `angle` (default 270 = from left) | | ||
| | ExpandIn | Use `GrowIn` with `angle` and `distance` to achieve expand-from-edge effect | | ||
| | CircleIn | No direct replacement (legacy preset) | | ||
| | PunchIn | No direct replacement (legacy preset) | | ||
|
|
||
| ### GlideIn Default Change | ||
|
|
||
| GlideIn default `angle` changed from `0` (from top) to `270` (from left) to match the more common slide-in-from-left behavior. |
Co-authored-by: Yehonatan Daniv <maggotfish@gmail.com>
- Rewrite trigger mechanisms as preset categories (not triggers) - Remove background scroll section (not functional yet) - Remove Status column and deleted presets from registry tables - Clarify animation options vs preset parameters (duration/delay are config-level) - Fix intensity values to match actual code powermaps (ArcIn, SpinIn, TiltScroll, ongoing presets) - Remove power reference from intensity guide heading - Add conditions note for reduced motion in accessibility section - Rewrite combining animations as general rules about CSS property conflicts - Remove migration reference and merge data sources into regeneration steps - Clean up Bg* preset references, fix desktop-only claim for mouse presets - Trim parameter naming conventions to overloaded names only (direction) - Remove --motion-opacity (unused), update distance units documentation Co-authored-by: Cursor <cursoragent@cursor.com>
- Rename GrowIn to ExpandIn across all preset docs (aligned with src/library) - Remove duplicate ExpandIn section in presets-reference.md - Remove deleted background-scroll.md - Add registry verification as first regeneration step in PLAN.md - Regenerate all category docs from updated PLAN.md Co-authored-by: Cursor <cursoragent@cursor.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.