svg-scroll-draw 2.23.5 → 2.23.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +17 -2
- package/package.json +8 -2
package/README.md
CHANGED
|
@@ -7,7 +7,22 @@
|
|
|
7
7
|
[](./LICENSE)
|
|
8
8
|
[](https://github.com/DhruvilChauahan0210/ink-scroll/stargazers)
|
|
9
9
|
|
|
10
|
-
>
|
|
10
|
+
> SVG line drawing on scroll, done right: correct path lengths, stagger across many paths, and `morphTo`. Where the browser supports `animation-timeline: view()` the draw runs on its own scroll timeline in CSS, with no per-frame JavaScript; in other browsers, and for options CSS can't express, a JavaScript engine draws it, and a parity suite checks in Chromium, Firefox and WebKit that both draw the same frame. **11.4 KB gzipped for every API, from 1.6 KB if you import one**, against 47.5 KB for GSAP + ScrollTrigger + DrawSVG. Zero dependencies, MIT.
|
|
11
|
+
|
|
12
|
+
**Switch in one line.** Already on AOS, ScrollReveal or vivus? Change the import and keep your markup and calls:
|
|
13
|
+
|
|
14
|
+
```diff
|
|
15
|
+
- import AOS from 'aos';
|
|
16
|
+
+ import AOS from 'svg-scroll-draw/aos'; // and delete aos.css: the styles ship inside
|
|
17
|
+
- import ScrollReveal from 'scrollreveal';
|
|
18
|
+
+ import ScrollReveal from 'svg-scroll-draw/scrollreveal';
|
|
19
|
+
- import Vivus from 'vivus';
|
|
20
|
+
+ import Vivus from 'svg-scroll-draw/vivus';
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
Each drop-in is tested side by side against the original in real browsers (AOS 2.3.4, which has had no release since; ScrollReveal 4.0.9, which is GPL-3.0 where this is MIT; vivus 0.4.6). `npx svg-scroll-draw migrate` makes the change across a project.
|
|
24
|
+
|
|
25
|
+
**And the rest of scroll animation.** Reveal, pin, snap, parallax, counters, video scrub and text splitting, each its own entry point, so you load only what you import. Works in React, Next.js, Vue, Svelte, Solid, Angular, Astro, Nuxt and vanilla JS. Plus [free in-browser tools](https://svg-scroll-draw.vercel.app/tools) — generators, editors and converters — that write the code for you.
|
|
11
26
|
|
|
12
27
|
**[Live Demo](https://svg-scroll-draw.vercel.app)** · [npm](https://www.npmjs.com/package/svg-scroll-draw) · [Docs](https://svg-scroll-draw.vercel.app/docs) · [Examples](https://svg-scroll-draw.vercel.app/examples) · [Report a bug](https://github.com/DhruvilChauahan0210/ink-scroll/issues)
|
|
13
28
|
|
|
@@ -378,7 +393,7 @@ import { ScrollDraw } from 'svg-scroll-draw/vue';
|
|
|
378
393
|
Already using [AOS](https://github.com/michalsnik/aos)? `svg-scroll-draw/aos` speaks its API and
|
|
379
394
|
reads its markup, so the move is an import change — or one command: `npx svg-scroll-draw migrate`. Keep every `data-aos`, `data-aos-offset`,
|
|
380
395
|
`data-aos-delay`, `data-aos-anchor-placement` and custom animation; delete `aos.css` — the styles ship
|
|
381
|
-
inside the module. 3.
|
|
396
|
+
inside the module. 3.2 KB gzipped with the styles, against 6.7 KB for AOS 2.3.4 with its stylesheet.
|
|
382
397
|
|
|
383
398
|
```diff
|
|
384
399
|
- import AOS from 'aos';
|
package/package.json
CHANGED
|
@@ -1,14 +1,19 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "svg-scroll-draw",
|
|
3
|
-
"version": "2.23.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "2.23.6",
|
|
4
|
+
"description": "SVG line drawing on scroll, on the browser's own scroll timeline (CSS animation-timeline, JS fallback). Drop-in for AOS, ScrollReveal and vivus. Plus reveal, pin, snap, text, video. Zero dependencies. React, Vue, Svelte, Solid, Angular, Astro, vanilla JS",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"svg",
|
|
7
7
|
"scroll",
|
|
8
8
|
"animation",
|
|
9
9
|
"path",
|
|
10
10
|
"draw",
|
|
11
|
+
"draw-on-scroll",
|
|
12
|
+
"svg-draw-on-scroll",
|
|
13
|
+
"scroll-animation-library",
|
|
14
|
+
"scroll-driven-animations",
|
|
11
15
|
"stroke-dashoffset",
|
|
16
|
+
"stroke-dasharray",
|
|
12
17
|
"scroll-driven",
|
|
13
18
|
"intersection-observer",
|
|
14
19
|
"react",
|
|
@@ -65,6 +70,7 @@
|
|
|
65
70
|
"scroll-reveal-mit",
|
|
66
71
|
"vivus",
|
|
67
72
|
"vivus-alternative",
|
|
73
|
+
"drawsvg-alternative",
|
|
68
74
|
"svg-line-drawing",
|
|
69
75
|
"line-drawing",
|
|
70
76
|
"react-aos",
|