New package: @remotion/rough-notation#9018
Conversation
![pullfrog[bot]](https://avatars.githubusercontent.com/in/1768019?s=60&v=4){kind=small}
There was a problem hiding this comment.
Important
One correctness issue to address before merging: the annotation renderer can produce duplicate React keys whenever iterations draws the same path, so React drops the duplicates and only one iteration renders.
Reviewed changes — This PR adds a new @remotion/rough-notation package with rough annotation components, docs, and example compositions to Remotion.
- Add
@remotion/rough-notationpackage withcreateAnnotation(),<AnnotationBehind>,<AnnotationOnTop>, andannotationConfig. - Add documentation pages for the new APIs under
docs/docs/rough-notation/. - Register six example compositions in
packages/example/src/RoughNotation. - Wire the package into the monorepo via
package.json,bun.lock,tsconfig.json,sidebars.ts, and package lists.
Kimi K2 (free via Pullfrog for OSS) ｜ 𝕏
|
|
||
| return ( | ||
| <path | ||
| key={d} |
There was a problem hiding this comment.
Using the raw SVG path d as key produces duplicate keys whenever iterations draws the same path (e.g. repeated box strokes with the same seed). React drops duplicates, so only one iteration renders. Use an index-aware key such as ${d}-${i}.
| title: '@remotion/rough-notation' | ||
| --- | ||
|
|
||
| # @remotion/rough-notation<AvailableFrom v="4.0.489" /> |
There was a problem hiding this comment.
The AvailableFrom version (4.0.489) doesn't match the package version this PR bumps to (4.0.488). If this package ships with 4.0.488, update this to 4.0.488.
| --- | ||
|
|
||
| # <AnnotationBehind><AvailableFrom v="4.0.489" /> | ||
|
|
There was a problem hiding this comment.
Same version mismatch as index.mdx: AvailableFrom says 4.0.489 but the package is being bumped to 4.0.488.
| --- | ||
|
|
||
| # <AnnotationOnTop><AvailableFrom v="4.0.489" /> | ||
|
|
There was a problem hiding this comment.
Same version mismatch as index.mdx: AvailableFrom says 4.0.489 but the package is being bumped to 4.0.488.
| crumb: '@remotion/rough-notation' | ||
| --- | ||
|
|
||
| # annotationConfig<AvailableFrom v="4.0.489" /> |
There was a problem hiding this comment.
Same version mismatch as index.mdx: AvailableFrom says 4.0.489 but the package is being bumped to 4.0.488.
| crumb: '@remotion/rough-notation' | ||
| --- | ||
|
|
||
| # createAnnotation()<AvailableFrom v="4.0.489" /> |
There was a problem hiding this comment.
Same version mismatch as index.mdx: AvailableFrom says 4.0.489 but the package is being bumped to 4.0.488.
There was a problem hiding this comment.
Incremental review of the latest commits. The Interactive/Sequence integration and the split examples are nice improvements. However, the duplicate React key issue in packages/rough-notation/src/render-annotation.tsx still needs a fix; the new Box.tsx example now directly demonstrates the problem with iterations={2}. I’m also withdrawing my earlier AvailableFrom version comment — pointing new docs to the next patch version (4.0.489) matches Remotion’s convention.
Kimi K2 (free via Pullfrog for OSS) ｜ 𝕏
JonnyBurger
changed the title
@remotion/rough-notation: Add rough notation package@remotion/rough-notation
1 participant
Summary
Testing