svg-scroll-draw 2.13.0 → 2.15.0

package/README.md

@@ -363,7 +363,7 @@ import { ScrollDraw } from 'svg-scroll-draw/vue';
 ## AOS drop-in — switch from AOS in one line
 
 Already using [AOS](https://github.com/michalsnik/aos)? `svg-scroll-draw/aos` speaks its API and
-reads its markup, so the move is an import change. Keep every `data-aos`, `data-aos-offset`,
+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`,
 `data-aos-delay`, `data-aos-anchor-placement` and custom animation; delete `aos.css` — the styles ship
 inside the module. 3.0 KB gzipped with the styles, against 6.7 KB for AOS 2.3.4 with its stylesheet.
 
@@ -375,6 +375,8 @@ inside the module. 3.0 KB gzipped with the styles, against 6.7 KB for AOS 2.3.4
   AOS.init({ once: true });
 ```
 
+[Try it on StackBlitz](https://stackblitz.com/github/DhruvilChauahan0210/ink-scroll/tree/main/examples/aos) — a page written for the original library, with only the import changed.
+
 No bundler? Swap the script tag, and drop the stylesheet link:
 
 ```html
@@ -382,6 +384,22 @@ No bundler? Swap the script tag, and drop the stylesheet link:
 <script>AOS.init();</script>
 ```
 
+**React and Next.js.** `svg-scroll-draw/aos/react` owns the lifecycle AOS never had: it initialises on mount,
+destroys on unmount (so StrictMode's double mount is safe), and new `[data-aos]` content from a route change is
+picked up automatically. The file is marked `"use client"`, so it drops straight into an App Router layout:
+
+```tsx
+// app/layout.tsx — a Server Component
+import { AOSInit } from 'svg-scroll-draw/aos/react';
+
+export default function RootLayout({ children }) {
+  return <html lang="en"><body><AOSInit once duration={600} />{children}</body></html>;
+}
+```
+
+Or call `useAOS(options, refreshKey)` in any client component; changing `refreshKey` (say, the pathname)
+re-measures positions.
+
 `init`, `refresh` and `refreshHard` behave as in AOS 2.3.4: the same trigger positions (anchor
 placements, `data-aos-anchor`, offsets — including AOS's rule that an inline anchor placement without an
 inline offset uses 0), the same `aos-init` / `aos-animate` classes, the same transforms and end states.
@@ -403,7 +421,8 @@ Differences, on purpose:
 
 On [ScrollReveal](https://scrollrevealjs.org)? It is GPL-3.0 (with a paid licence for commercial work)
 and has not shipped since 4.0.9. `svg-scroll-draw/scrollreveal` is an independent, MIT-licensed
-implementation of the same API, so the move is an import change. 4.5 KB gzipped, against 5.6 KB.
+implementation of the same API, so the move is an import change — or one command: `npx svg-scroll-draw migrate`.
+4.5 KB gzipped, against 5.6 KB.
 
 ```diff
 - import ScrollReveal from 'scrollreveal';
@@ -412,10 +431,26 @@ implementation of the same API, so the move is an import change. 4.5 KB gzipped,
   ScrollReveal({ distance: '40px', duration: 800 }).reveal('.card', { interval: 80 });
 ```
 
+[Try it on StackBlitz](https://stackblitz.com/github/DhruvilChauahan0210/ink-scroll/tree/main/examples/scrollreveal) — a page written for the original library, with only the import changed.
+
 No bundler? `<script src="https://unpkg.com/svg-scroll-draw/dist/cdn/scrollreveal.global.js"></script>`
 defines `window.ScrollReveal` as the function, like ScrollReveal's own file. With CommonJS,
 `require('svg-scroll-draw/scrollreveal').default` is the function.
 
+**React and Next.js.** `useScrollReveal()` from `svg-scroll-draw/scrollreveal/react` reveals the element its
+ref is on — or its children matching `selector`, for `interval` sequences — and cleans up on unmount, so
+components that mount later (a route change, a list that loads) are revealed too:
+
+```tsx
+'use client';
+import { useScrollReveal } from 'svg-scroll-draw/scrollreveal/react';
+
+export function Cards() {
+  const ref = useScrollReveal({ selector: '.card', interval: 80, distance: '30px' });
+  return <div ref={ref}>{/* .card children */}</div>;
+}
+```
+
 Every option behaves as in 4.0.9 — `distance` / `origin`, `opacity`, `scale`, `rotate`, `duration`,
 `delay`, `easing`, `interval` sequences, `reset`, `useDelay`, `viewFactor`, `viewOffset`,
 `container`, `mobile` / `desktop`, `cleanup` and the four callbacks — as do `reveal`, `clean`, `sync`,
@@ -434,8 +469,8 @@ Differences, on purpose:
 ## vivus drop-in — keep your `new Vivus()` code
 
 On [vivus](https://github.com/maxwellito/vivus)? It has not shipped since 0.4.6 (April 2021).
-`svg-scroll-draw/vivus` runs the same API, so the move is an import change. 3.9 KB gzipped, against
-4.1 KB.
+`svg-scroll-draw/vivus` runs the same API, so the move is an import change — or one command:
+`npx svg-scroll-draw migrate`. 3.9 KB gzipped, against 4.1 KB.
 
 ```diff
 - import Vivus from 'vivus';
@@ -444,9 +479,24 @@ On [vivus](https://github.com/maxwellito/vivus)? It has not shipped since 0.4.6
   new Vivus('my-svg', { type: 'oneByOne', duration: 200 }, () => console.log('drawn'));
 ```
 
+[Try it on StackBlitz](https://stackblitz.com/github/DhruvilChauahan0210/ink-scroll/tree/main/examples/vivus) — a page written for the original library, with only the import changed.
+
 No bundler? `<script src="https://unpkg.com/svg-scroll-draw/dist/cdn/vivus.global.js"></script>`
 defines `window.Vivus`. With CommonJS, `require('svg-scroll-draw/vivus').default` is the class.
 
+**React and Next.js.** `useVivus()` from `svg-scroll-draw/vivus/react` creates the instance on the mounted
+`<svg>`, destroys it on unmount, and hands it back for `play()`, `reset()` and the rest:
+
+```tsx
+'use client';
+import { useVivus } from 'svg-scroll-draw/vivus/react';
+
+export function Logo() {
+  const [ref, vivus] = useVivus<SVGSVGElement>({ type: 'oneByOne', duration: 120 });
+  return <svg ref={ref} onClick={() => vivus?.reset().play()}>{/* paths */}</svg>;
+}
+```
+
 Every option, every animation type (`delayed`, `sync`, `async`, `nsync`, `oneByOne`, `scenario`,
 `scenario-sync`), the `start` modes, `file` and `<object>` loading, the `data-start` / `data-duration` /
 `data-delay` / `data-async` / `data-ignore` attributes, `Vivus.EASE` and the other timing functions, and
@@ -554,6 +604,9 @@ devtools.highlight('#my-element'); // outline for 2 seconds
 | `svg-scroll-draw/aos` | `AOS` (default), `init`, `refresh`, `refreshHard`, `destroy` |
 | `svg-scroll-draw/scrollreveal` | `ScrollReveal` (default and named) |
 | `svg-scroll-draw/vivus` | `Vivus` (default and named) |
+| `svg-scroll-draw/aos/react` | `useAOS`, `AOSInit` (`"use client"`) |
+| `svg-scroll-draw/scrollreveal/react` | `useScrollReveal` (`"use client"`) |
+| `svg-scroll-draw/vivus/react` | `useVivus` (`"use client"`) |
 
 ---
 
@@ -604,6 +657,19 @@ npx svg-scroll-draw init
 
 Scaffolds a ready-to-use starter file for React, Vue, Svelte, Solid, or Vanilla JS.
 
+### Switching from AOS, ScrollReveal or vivus
+
+```bash
+npx svg-scroll-draw migrate --dry-run   # see what would change
+npx svg-scroll-draw migrate             # apply it
+```
+
+Points every `import` / `require` of `aos`, `scrollreveal` and `vivus` at the matching drop-in, swaps CDN
+`<script>` tags for the script-tag builds (dropping any stale `integrity` hash), removes AOS's `aos.css`
+imports, `<link>`s and `@import`s, and swaps the dependency in `package.json`. It rewrites module names,
+URLs and dependency entries only — never the code that uses them — skips `node_modules` and build output,
+and will not write over uncommitted git changes unless you pass `--force`.
+
 ---
 
 ## Browser support

package/dist/aos/index.d.mts

@@ -0,0 +1,53 @@
+type AOSAnchorPlacement = 'top-bottom' | 'top-center' | 'top-top' | 'center-bottom' | 'center-center' | 'center-top' | 'bottom-bottom' | 'bottom-center' | 'bottom-top';
+interface AOSOptions {
+    /** Px from the trigger point before the animation starts. Default 120. */
+    offset?: number;
+    /** Ms to wait before animating in. Default 0. */
+    delay?: number;
+    /** Animation length in ms. Default 400. */
+    duration?: number;
+    /** An AOS easing name (`'ease-out-back'`…) or any CSS timing function. Default `'ease'`. */
+    easing?: string;
+    /** Animate only the first time the element scrolls in. Default false. */
+    once?: boolean;
+    /** Animate out again when the element scrolls past the top. Default false. */
+    mirror?: boolean;
+    /** Which edge of the element meets which edge of the window. Default `'top-bottom'`. */
+    anchorPlacement?: AOSAnchorPlacement;
+    /** Skip animations entirely: a boolean, a predicate, or a viewport class. */
+    disable?: boolean | 'phone' | 'tablet' | 'mobile' | (() => boolean);
+    /** Document event that starts AOS. Default `'DOMContentLoaded'`. */
+    startEvent?: string;
+    /** Do not watch the DOM for new `[data-aos]` elements. Default false. */
+    disableMutationObserver?: boolean;
+    /** Class added at init. Default `'aos-init'`. */
+    initClassName?: string;
+    /** Class added while animated in. Default `'aos-animate'`. */
+    animatedClassName?: string;
+    /** Also add the `data-aos` value as classes (for animate.css-style sets). Default false. */
+    useClassNames?: boolean;
+    /** Accepted for compatibility; scroll handling is batched per frame instead. */
+    throttleDelay?: number;
+    /** Accepted for compatibility; resize handling is debounced internally. */
+    debounceDelay?: number;
+}
+/** Start animating every `[data-aos]` element. Same options as AOS. */
+declare function init(options?: AOSOptions): HTMLElement[];
+/** Recalculate every trigger position (after a layout change). */
+declare function refresh(): void;
+/** Find `[data-aos]` elements again (after adding or removing some), then refresh. */
+declare function refreshHard(): void;
+/**
+ * Stop listening and remove the injected stylesheet. Not in AOS — added for
+ * single-page apps that unmount the page AOS was started on. Elements keep
+ * whatever classes they have.
+ */
+declare function destroy(): void;
+declare const AOS: {
+    init: typeof init;
+    refresh: typeof refresh;
+    refreshHard: typeof refreshHard;
+    destroy: typeof destroy;
+};
+
+export { type AOSAnchorPlacement, type AOSOptions, AOS as default, destroy, init, refresh, refreshHard };

package/dist/aos/index.d.ts

@@ -0,0 +1,53 @@
+type AOSAnchorPlacement = 'top-bottom' | 'top-center' | 'top-top' | 'center-bottom' | 'center-center' | 'center-top' | 'bottom-bottom' | 'bottom-center' | 'bottom-top';
+interface AOSOptions {
+    /** Px from the trigger point before the animation starts. Default 120. */
+    offset?: number;
+    /** Ms to wait before animating in. Default 0. */
+    delay?: number;
+    /** Animation length in ms. Default 400. */
+    duration?: number;
+    /** An AOS easing name (`'ease-out-back'`…) or any CSS timing function. Default `'ease'`. */
+    easing?: string;
+    /** Animate only the first time the element scrolls in. Default false. */
+    once?: boolean;
+    /** Animate out again when the element scrolls past the top. Default false. */
+    mirror?: boolean;
+    /** Which edge of the element meets which edge of the window. Default `'top-bottom'`. */
+    anchorPlacement?: AOSAnchorPlacement;
+    /** Skip animations entirely: a boolean, a predicate, or a viewport class. */
+    disable?: boolean | 'phone' | 'tablet' | 'mobile' | (() => boolean);
+    /** Document event that starts AOS. Default `'DOMContentLoaded'`. */
+    startEvent?: string;
+    /** Do not watch the DOM for new `[data-aos]` elements. Default false. */
+    disableMutationObserver?: boolean;
+    /** Class added at init. Default `'aos-init'`. */
+    initClassName?: string;
+    /** Class added while animated in. Default `'aos-animate'`. */
+    animatedClassName?: string;
+    /** Also add the `data-aos` value as classes (for animate.css-style sets). Default false. */
+    useClassNames?: boolean;
+    /** Accepted for compatibility; scroll handling is batched per frame instead. */
+    throttleDelay?: number;
+    /** Accepted for compatibility; resize handling is debounced internally. */
+    debounceDelay?: number;
+}
+/** Start animating every `[data-aos]` element. Same options as AOS. */
+declare function init(options?: AOSOptions): HTMLElement[];
+/** Recalculate every trigger position (after a layout change). */
+declare function refresh(): void;
+/** Find `[data-aos]` elements again (after adding or removing some), then refresh. */
+declare function refreshHard(): void;
+/**
+ * Stop listening and remove the injected stylesheet. Not in AOS — added for
+ * single-page apps that unmount the page AOS was started on. Elements keep
+ * whatever classes they have.
+ */
+declare function destroy(): void;
+declare const AOS: {
+    init: typeof init;
+    refresh: typeof refresh;
+    refreshHard: typeof refreshHard;
+    destroy: typeof destroy;
+};
+
+export { type AOSAnchorPlacement, type AOSOptions, AOS as default, destroy, init, refresh, refreshHard };

package/dist/aos/react/index.cjs

@@ -0,0 +1,3 @@
+"use client";
+"use strict";var h=Object.defineProperty;var W=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Z=Object.prototype.hasOwnProperty;var j=(e,t)=>{for(var n in t)h(e,n,{get:t[n],enumerable:!0})},U=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of X(t))!Z.call(e,i)&&i!==n&&h(e,i,{get:()=>t[i],enumerable:!(o=W(t,i))||o.enumerable});return e};var K=e=>U(h({},"__esModule",{value:!0}),e);var ue={};j(ue,{AOSInit:()=>ce,useAOS:()=>G});module.exports=K(ue);var m=require("react");function $(){return typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia("(prefers-reduced-motion: reduce)").matches}var J=typeof __SVG_SCROLL_DRAW_DEV__<"u"?__SVG_SCROLL_DRAW_DEV__:typeof process<"u"&&typeof process.env<"u"&&process.env.NODE_ENV!=="production";function M(e,...t){J&&console.warn(`[svg-scroll-draw] ${e}`,...t)}var C={offset:120,delay:0,duration:400,easing:"ease",once:!1,mirror:!1,anchorPlacement:"top-bottom",disable:!1,startEvent:"DOMContentLoaded",disableMutationObserver:!1,initClassName:"aos-init",animatedClassName:"aos-animate",useClassNames:!1,throttleDelay:99,debounceDelay:50},ee={"ease-in-back":"cubic-bezier(.6,-.28,.735,.045)","ease-out-back":"cubic-bezier(.175,.885,.32,1.275)","ease-in-out-back":"cubic-bezier(.68,-.55,.265,1.55)","ease-in-sine":"cubic-bezier(.47,0,.745,.715)","ease-out-sine":"cubic-bezier(.39,.575,.565,1)","ease-in-out-sine":"cubic-bezier(.445,.05,.55,.95)","ease-in-quad":"cubic-bezier(.55,.085,.68,.53)","ease-out-quad":"cubic-bezier(.25,.46,.45,.94)","ease-in-out-quad":"cubic-bezier(.455,.03,.515,.955)","ease-in-cubic":"cubic-bezier(.55,.055,.675,.19)","ease-out-cubic":"cubic-bezier(.215,.61,.355,1)","ease-in-out-cubic":"cubic-bezier(.645,.045,.355,1)","ease-in-quart":"cubic-bezier(.895,.03,.685,.22)","ease-out-quart":"cubic-bezier(.165,.84,.44,1)","ease-in-out-quart":"cubic-bezier(.77,0,.175,1)"},E="svg-scroll-draw-aos",r=(e,t)=>`translate3d(${e},${t},0)`,te=[["fade-up",r("0","100px")],["fade-down",r("0","-100px")],["fade-right",r("-100px","0")],["fade-left",r("100px","0")],["fade-up-right",r("-100px","100px")],["fade-up-left",r("100px","100px")],["fade-down-right",r("-100px","-100px")],["fade-down-left",r("100px","-100px")],["zoom-in","scale(.6)"],["zoom-out","scale(1.2)"],["zoom-in-up",`${r("0","100px")} scale(.6)`],["zoom-in-down",`${r("0","-100px")} scale(.6)`],["zoom-in-right",`${r("-100px","0")} scale(.6)`],["zoom-in-left",`${r("100px","0")} scale(.6)`],["zoom-out-up",`${r("0","100px")} scale(1.2)`],["zoom-out-down",`${r("0","-100px")} scale(1.2)`],["zoom-out-right",`${r("-100px","0")} scale(1.2)`],["zoom-out-left",`${r("100px","0")} scale(1.2)`],["slide-up",r("0","100%")],["slide-down",r("0","-100%")],["slide-right",r("-100%","0")],["slide-left",r("100%","0")],["flip-left","perspective(2500px) rotateY(-100deg)"],["flip-right","perspective(2500px) rotateY(100deg)"],["flip-up","perspective(2500px) rotateX(-100deg)"],["flip-down","perspective(2500px) rotateX(100deg)"]];function ne(e){let t=`.${e}`,n=o=>`[data-aos^=${o}][data-aos^=${o}]`;return["[data-aos][data-aos]{transition-duration:var(--aos-duration,400ms);transition-timing-function:var(--aos-easing,ease);transition-delay:0s}",`[data-aos][data-aos]${t}{transition-delay:var(--aos-delay,0ms)}`,`${n("fade")}{opacity:0;transition-property:opacity,transform}`,`${n("fade")}${t}{opacity:1;transform:translateZ(0)}`,`${n("zoom")}{opacity:0;transition-property:opacity,transform}`,`${n("zoom")}${t}{opacity:1;transform:translateZ(0) scale(1)}`,`${n("slide")}{transition-property:transform}`,`${n("slide")}${t}{transform:translateZ(0)}`,`${n("flip")}{backface-visibility:hidden;transition-property:transform}`,...te.map(([o,i])=>`[data-aos=${o}]{transform:${i}}`),...["left","right"].map(o=>`[data-aos=flip-${o}]${t}{transform:perspective(2500px) rotateY(0)}`),...["up","down"].map(o=>`[data-aos=flip-${o}]${t}{transform:perspective(2500px) rotateX(0)}`),"[data-aos-instant][data-aos-instant]{transition:none!important}"].join(`
+`)}var a={...C},c=[],f=!1,p=0,L,b=null,d=null,A=!1,N=()=>typeof window<"u"&&typeof document<"u";function D(e){if(!(e instanceof HTMLElement))return e.getBoundingClientRect().top+window.scrollY;let t=0,n=e;for(;n;)t+=n.offsetTop-(n.tagName!=="BODY"?n.scrollTop:0),n=n.offsetParent;return t}var R=e=>e instanceof HTMLElement?e.offsetHeight:e.getBoundingClientRect().height;function u(e,t){return e.getAttribute(`data-aos-${t}`)}function z(e,t,n){let o=u(e,t);return o==="true"?!0:o==="false"?!1:n}function k(e,t){let n=u(e,"offset");return n&&!isNaN(Number(n))?parseInt(n,10):n||t?0:a.offset}function oe(e){let t=window.innerHeight,n=u(e,"anchor-placement"),o=k(e,n),i=u(e,"anchor"),O=i?document.querySelector(i):null;i&&!O&&M(`aos: data-aos-anchor="${i}" matches nothing; using the element itself`);let S=O||e,l=R(S),s=D(S)-t;switch(n||a.anchorPlacement){case"center-bottom":s+=l/2;break;case"bottom-bottom":s+=l;break;case"top-center":s+=t/2;break;case"center-center":s+=t/2+l/2;break;case"bottom-center":s+=t/2+l;break;case"top-top":s+=t;break;case"bottom-top":s+=t+l;break;case"center-top":s+=t+l/2;break;default:break}return s+o}function ae(e){return D(e)+R(e)-k(e,null)}function re(e){let t=u(e,"duration")??String(a.duration),n=u(e,"delay")??String(a.delay),o=u(e,"easing")??a.easing;e.style.setProperty("--aos-duration",`${parseFloat(t)||0}ms`),e.style.setProperty("--aos-delay",`${parseFloat(n)||0}ms`),e.style.setProperty("--aos-easing",ee[o]??o)}function H(){c=Array.from(document.querySelectorAll("[data-aos]")).map(e=>{let t=c.find(n=>n.node===e);return{node:e,in:0,out:0,once:z(e,"once",a.once),mirror:z(e,"mirror",a.mirror),animated:t?t.animated:e.classList.contains(a.animatedClassName),classes:a.useClassNames?(e.getAttribute("data-aos")||"").split(" ").filter(Boolean):[],id:u(e,"id")}});for(let e of c)re(e.node),e.node.classList.add(a.initClassName)}function I(){for(let e of c)e.in=oe(e.node),e.out=ae(e.node)}function q(e,t){document.dispatchEvent(new CustomEvent(`aos:${e}`,{detail:t.node})),t.id&&document.dispatchEvent(new CustomEvent(`aos:${e}:${t.id}`,{detail:t.node}))}function T(e){e.animated||(e.animated=!0,e.node.classList.add(a.animatedClassName,...e.classes),q("in",e))}function _(e){e.animated&&(e.animated=!1,e.node.classList.remove(a.animatedClassName,...e.classes),q("out",e))}function x(){p=0;let e=window.scrollY;for(let t of c){if(A){T(t);continue}t.mirror&&!t.once&&e>t.out?_(t):e>t.in?T(t):t.once||_(t)}}var P=()=>{p||(p=requestAnimationFrame(x))};function v(){clearTimeout(L),L=setTimeout(y,50)}var Q=()=>y();function F(){let e=a.disable;if(typeof e=="function")return e();if(e===!0)return!0;let t=window.innerWidth;return e==="phone"?t<768:e==="tablet"?t>=768&&t<1024:e==="mobile"?t<1024:!1}function V(){document.querySelectorAll("[data-aos]").forEach(e=>{for(let t of["data-aos","data-aos-easing","data-aos-duration","data-aos-delay"])e.removeAttribute(t)})}function ie(){if(document.getElementById(E))return;let e=document.createElement("style");e.id=E,e.textContent=ne(a.animatedClassName),document.head.appendChild(e)}function w(){if(!f){if(f=!0,d=null,H(),A)for(let e of c)e.node.setAttribute("data-aos-instant","");I(),x(),window.addEventListener("scroll",P,{passive:!0}),window.addEventListener("resize",v),window.addEventListener("orientationchange",v),window.addEventListener("load",Q),!a.disableMutationObserver&&typeof MutationObserver<"u"&&(b=new MutationObserver(e=>{e.some(n=>[...Array.from(n.addedNodes),...Array.from(n.removedNodes)].some(o=>o instanceof Element&&(o.hasAttribute("data-aos")||o.querySelector("[data-aos]"))))&&Y()}),b.observe(document.documentElement,{childList:!0,subtree:!0}))}}function se(e={}){if(!N())return[];if((f||d)&&B(),a={...C,...e},F())return V(),[];A=$(),ie();let t=document.readyState!=="loading";if(a.startEvent==="DOMContentLoaded"&&t)w();else if(a.startEvent==="load"&&document.readyState==="complete")w();else{let n=a.startEvent==="load"?window:document,o=()=>w();n.addEventListener(a.startEvent,o,{once:!0}),d={target:n,type:a.startEvent,fn:o}}return Array.from(document.querySelectorAll("[data-aos]"))}function y(){f&&(I(),x())}function Y(){if(f){if(F()){V();return}H(),y()}}function B(){if(N()){d&&d.target.removeEventListener(d.type,d.fn),d=null,cancelAnimationFrame(p),p=0,clearTimeout(L),window.removeEventListener("scroll",P),window.removeEventListener("resize",v),window.removeEventListener("orientationchange",v),window.removeEventListener("load",Q),b?.disconnect(),b=null;for(let e of c)e.node.removeAttribute("data-aos-instant");c=[],f=!1,document.getElementById(E)?.remove()}}var de={init:se,refresh:y,refreshHard:Y,destroy:B},g=de;function G(e={},t){let n=(0,m.useRef)(e);n.current=e,(0,m.useEffect)(()=>(g.init(n.current),()=>g.destroy()),[]);let o=(0,m.useRef)(!0);(0,m.useEffect)(()=>{if(o.current){o.current=!1;return}g.refreshHard()},[t])}function ce({refreshKey:e,...t}){return G(t,e),null}0&&(module.exports={AOSInit,useAOS});

package/dist/aos/react/index.d.mts

@@ -0,0 +1,44 @@
+type AOSAnchorPlacement = 'top-bottom' | 'top-center' | 'top-top' | 'center-bottom' | 'center-center' | 'center-top' | 'bottom-bottom' | 'bottom-center' | 'bottom-top';
+interface AOSOptions {
+    /** Px from the trigger point before the animation starts. Default 120. */
+    offset?: number;
+    /** Ms to wait before animating in. Default 0. */
+    delay?: number;
+    /** Animation length in ms. Default 400. */
+    duration?: number;
+    /** An AOS easing name (`'ease-out-back'`…) or any CSS timing function. Default `'ease'`. */
+    easing?: string;
+    /** Animate only the first time the element scrolls in. Default false. */
+    once?: boolean;
+    /** Animate out again when the element scrolls past the top. Default false. */
+    mirror?: boolean;
+    /** Which edge of the element meets which edge of the window. Default `'top-bottom'`. */
+    anchorPlacement?: AOSAnchorPlacement;
+    /** Skip animations entirely: a boolean, a predicate, or a viewport class. */
+    disable?: boolean | 'phone' | 'tablet' | 'mobile' | (() => boolean);
+    /** Document event that starts AOS. Default `'DOMContentLoaded'`. */
+    startEvent?: string;
+    /** Do not watch the DOM for new `[data-aos]` elements. Default false. */
+    disableMutationObserver?: boolean;
+    /** Class added at init. Default `'aos-init'`. */
+    initClassName?: string;
+    /** Class added while animated in. Default `'aos-animate'`. */
+    animatedClassName?: string;
+    /** Also add the `data-aos` value as classes (for animate.css-style sets). Default false. */
+    useClassNames?: boolean;
+    /** Accepted for compatibility; scroll handling is batched per frame instead. */
+    throttleDelay?: number;
+    /** Accepted for compatibility; resize handling is debounced internally. */
+    debounceDelay?: number;
+}
+
+/** Start AOS for the page, and stop it on unmount. Options are read once, on mount. */
+declare function useAOS(options?: AOSOptions, refreshKey?: unknown): void;
+type AOSInitProps = AOSOptions & {
+    /** Re-measure trigger positions whenever this changes (e.g. the pathname). */
+    refreshKey?: unknown;
+};
+/** `useAOS` as a component, for a layout that cannot call hooks itself. Renders nothing. */
+declare function AOSInit({ refreshKey, ...options }: AOSInitProps): null;
+
+export { AOSInit, type AOSInitProps, useAOS };

package/dist/aos/react/index.d.ts

@@ -0,0 +1,44 @@
+type AOSAnchorPlacement = 'top-bottom' | 'top-center' | 'top-top' | 'center-bottom' | 'center-center' | 'center-top' | 'bottom-bottom' | 'bottom-center' | 'bottom-top';
+interface AOSOptions {
+    /** Px from the trigger point before the animation starts. Default 120. */
+    offset?: number;
+    /** Ms to wait before animating in. Default 0. */
+    delay?: number;
+    /** Animation length in ms. Default 400. */
+    duration?: number;
+    /** An AOS easing name (`'ease-out-back'`…) or any CSS timing function. Default `'ease'`. */
+    easing?: string;
+    /** Animate only the first time the element scrolls in. Default false. */
+    once?: boolean;
+    /** Animate out again when the element scrolls past the top. Default false. */
+    mirror?: boolean;
+    /** Which edge of the element meets which edge of the window. Default `'top-bottom'`. */
+    anchorPlacement?: AOSAnchorPlacement;
+    /** Skip animations entirely: a boolean, a predicate, or a viewport class. */
+    disable?: boolean | 'phone' | 'tablet' | 'mobile' | (() => boolean);
+    /** Document event that starts AOS. Default `'DOMContentLoaded'`. */
+    startEvent?: string;
+    /** Do not watch the DOM for new `[data-aos]` elements. Default false. */
+    disableMutationObserver?: boolean;
+    /** Class added at init. Default `'aos-init'`. */
+    initClassName?: string;
+    /** Class added while animated in. Default `'aos-animate'`. */
+    animatedClassName?: string;
+    /** Also add the `data-aos` value as classes (for animate.css-style sets). Default false. */
+    useClassNames?: boolean;
+    /** Accepted for compatibility; scroll handling is batched per frame instead. */
+    throttleDelay?: number;
+    /** Accepted for compatibility; resize handling is debounced internally. */
+    debounceDelay?: number;
+}
+
+/** Start AOS for the page, and stop it on unmount. Options are read once, on mount. */
+declare function useAOS(options?: AOSOptions, refreshKey?: unknown): void;
+type AOSInitProps = AOSOptions & {
+    /** Re-measure trigger positions whenever this changes (e.g. the pathname). */
+    refreshKey?: unknown;
+};
+/** `useAOS` as a component, for a layout that cannot call hooks itself. Renders nothing. */
+declare function AOSInit({ refreshKey, ...options }: AOSInitProps): null;
+
+export { AOSInit, type AOSInitProps, useAOS };

package/dist/aos/react/index.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{useEffect as Y,useRef as B}from"react";function O(){return typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia("(prefers-reduced-motion: reduce)").matches}var G=typeof __SVG_SCROLL_DRAW_DEV__<"u"?__SVG_SCROLL_DRAW_DEV__:typeof process<"u"&&typeof process.env<"u"&&process.env.NODE_ENV!=="production";function S(e,...t){G&&console.warn(`[svg-scroll-draw] ${e}`,...t)}var T={offset:120,delay:0,duration:400,easing:"ease",once:!1,mirror:!1,anchorPlacement:"top-bottom",disable:!1,startEvent:"DOMContentLoaded",disableMutationObserver:!1,initClassName:"aos-init",animatedClassName:"aos-animate",useClassNames:!1,throttleDelay:99,debounceDelay:50},W={"ease-in-back":"cubic-bezier(.6,-.28,.735,.045)","ease-out-back":"cubic-bezier(.175,.885,.32,1.275)","ease-in-out-back":"cubic-bezier(.68,-.55,.265,1.55)","ease-in-sine":"cubic-bezier(.47,0,.745,.715)","ease-out-sine":"cubic-bezier(.39,.575,.565,1)","ease-in-out-sine":"cubic-bezier(.445,.05,.55,.95)","ease-in-quad":"cubic-bezier(.55,.085,.68,.53)","ease-out-quad":"cubic-bezier(.25,.46,.45,.94)","ease-in-out-quad":"cubic-bezier(.455,.03,.515,.955)","ease-in-cubic":"cubic-bezier(.55,.055,.675,.19)","ease-out-cubic":"cubic-bezier(.215,.61,.355,1)","ease-in-out-cubic":"cubic-bezier(.645,.045,.355,1)","ease-in-quart":"cubic-bezier(.895,.03,.685,.22)","ease-out-quart":"cubic-bezier(.165,.84,.44,1)","ease-in-out-quart":"cubic-bezier(.77,0,.175,1)"},h="svg-scroll-draw-aos",r=(e,t)=>`translate3d(${e},${t},0)`,X=[["fade-up",r("0","100px")],["fade-down",r("0","-100px")],["fade-right",r("-100px","0")],["fade-left",r("100px","0")],["fade-up-right",r("-100px","100px")],["fade-up-left",r("100px","100px")],["fade-down-right",r("-100px","-100px")],["fade-down-left",r("100px","-100px")],["zoom-in","scale(.6)"],["zoom-out","scale(1.2)"],["zoom-in-up",`${r("0","100px")} scale(.6)`],["zoom-in-down",`${r("0","-100px")} scale(.6)`],["zoom-in-right",`${r("-100px","0")} scale(.6)`],["zoom-in-left",`${r("100px","0")} scale(.6)`],["zoom-out-up",`${r("0","100px")} scale(1.2)`],["zoom-out-down",`${r("0","-100px")} scale(1.2)`],["zoom-out-right",`${r("-100px","0")} scale(1.2)`],["zoom-out-left",`${r("100px","0")} scale(1.2)`],["slide-up",r("0","100%")],["slide-down",r("0","-100%")],["slide-right",r("-100%","0")],["slide-left",r("100%","0")],["flip-left","perspective(2500px) rotateY(-100deg)"],["flip-right","perspective(2500px) rotateY(100deg)"],["flip-up","perspective(2500px) rotateX(-100deg)"],["flip-down","perspective(2500px) rotateX(100deg)"]];function Z(e){let t=`.${e}`,n=o=>`[data-aos^=${o}][data-aos^=${o}]`;return["[data-aos][data-aos]{transition-duration:var(--aos-duration,400ms);transition-timing-function:var(--aos-easing,ease);transition-delay:0s}",`[data-aos][data-aos]${t}{transition-delay:var(--aos-delay,0ms)}`,`${n("fade")}{opacity:0;transition-property:opacity,transform}`,`${n("fade")}${t}{opacity:1;transform:translateZ(0)}`,`${n("zoom")}{opacity:0;transition-property:opacity,transform}`,`${n("zoom")}${t}{opacity:1;transform:translateZ(0) scale(1)}`,`${n("slide")}{transition-property:transform}`,`${n("slide")}${t}{transform:translateZ(0)}`,`${n("flip")}{backface-visibility:hidden;transition-property:transform}`,...X.map(([o,u])=>`[data-aos=${o}]{transform:${u}}`),...["left","right"].map(o=>`[data-aos=flip-${o}]${t}{transform:perspective(2500px) rotateY(0)}`),...["up","down"].map(o=>`[data-aos=flip-${o}]${t}{transform:perspective(2500px) rotateX(0)}`),"[data-aos-instant][data-aos-instant]{transition:none!important}"].join(`
+`)}var a={...T},d=[],f=!1,m=0,w,p=null,s=null,E=!1,_=()=>typeof window<"u"&&typeof document<"u";function C(e){if(!(e instanceof HTMLElement))return e.getBoundingClientRect().top+window.scrollY;let t=0,n=e;for(;n;)t+=n.offsetTop-(n.tagName!=="BODY"?n.scrollTop:0),n=n.offsetParent;return t}var N=e=>e instanceof HTMLElement?e.offsetHeight:e.getBoundingClientRect().height;function c(e,t){return e.getAttribute(`data-aos-${t}`)}function $(e,t,n){let o=c(e,t);return o==="true"?!0:o==="false"?!1:n}function D(e,t){let n=c(e,"offset");return n&&!isNaN(Number(n))?parseInt(n,10):n||t?0:a.offset}function j(e){let t=window.innerHeight,n=c(e,"anchor-placement"),o=D(e,n),u=c(e,"anchor"),A=u?document.querySelector(u):null;u&&!A&&S(`aos: data-aos-anchor="${u}" matches nothing; using the element itself`);let x=A||e,l=N(x),i=C(x)-t;switch(n||a.anchorPlacement){case"center-bottom":i+=l/2;break;case"bottom-bottom":i+=l;break;case"top-center":i+=t/2;break;case"center-center":i+=t/2+l/2;break;case"bottom-center":i+=t/2+l;break;case"top-top":i+=t;break;case"bottom-top":i+=t+l;break;case"center-top":i+=t+l/2;break;default:break}return i+o}function U(e){return C(e)+N(e)-D(e,null)}function K(e){let t=c(e,"duration")??String(a.duration),n=c(e,"delay")??String(a.delay),o=c(e,"easing")??a.easing;e.style.setProperty("--aos-duration",`${parseFloat(t)||0}ms`),e.style.setProperty("--aos-delay",`${parseFloat(n)||0}ms`),e.style.setProperty("--aos-easing",W[o]??o)}function R(){d=Array.from(document.querySelectorAll("[data-aos]")).map(e=>{let t=d.find(n=>n.node===e);return{node:e,in:0,out:0,once:$(e,"once",a.once),mirror:$(e,"mirror",a.mirror),animated:t?t.animated:e.classList.contains(a.animatedClassName),classes:a.useClassNames?(e.getAttribute("data-aos")||"").split(" ").filter(Boolean):[],id:c(e,"id")}});for(let e of d)K(e.node),e.node.classList.add(a.initClassName)}function k(){for(let e of d)e.in=j(e.node),e.out=U(e.node)}function H(e,t){document.dispatchEvent(new CustomEvent(`aos:${e}`,{detail:t.node})),t.id&&document.dispatchEvent(new CustomEvent(`aos:${e}:${t.id}`,{detail:t.node}))}function M(e){e.animated||(e.animated=!0,e.node.classList.add(a.animatedClassName,...e.classes),H("in",e))}function z(e){e.animated&&(e.animated=!1,e.node.classList.remove(a.animatedClassName,...e.classes),H("out",e))}function L(){m=0;let e=window.scrollY;for(let t of d){if(E){M(t);continue}t.mirror&&!t.once&&e>t.out?z(t):e>t.in?M(t):t.once||z(t)}}var I=()=>{m||(m=requestAnimationFrame(L))};function b(){clearTimeout(w),w=setTimeout(v,50)}var q=()=>v();function P(){let e=a.disable;if(typeof e=="function")return e();if(e===!0)return!0;let t=window.innerWidth;return e==="phone"?t<768:e==="tablet"?t>=768&&t<1024:e==="mobile"?t<1024:!1}function Q(){document.querySelectorAll("[data-aos]").forEach(e=>{for(let t of["data-aos","data-aos-easing","data-aos-duration","data-aos-delay"])e.removeAttribute(t)})}function J(){if(document.getElementById(h))return;let e=document.createElement("style");e.id=h,e.textContent=Z(a.animatedClassName),document.head.appendChild(e)}function g(){if(!f){if(f=!0,s=null,R(),E)for(let e of d)e.node.setAttribute("data-aos-instant","");k(),L(),window.addEventListener("scroll",I,{passive:!0}),window.addEventListener("resize",b),window.addEventListener("orientationchange",b),window.addEventListener("load",q),!a.disableMutationObserver&&typeof MutationObserver<"u"&&(p=new MutationObserver(e=>{e.some(n=>[...Array.from(n.addedNodes),...Array.from(n.removedNodes)].some(o=>o instanceof Element&&(o.hasAttribute("data-aos")||o.querySelector("[data-aos]"))))&&F()}),p.observe(document.documentElement,{childList:!0,subtree:!0}))}}function ee(e={}){if(!_())return[];if((f||s)&&V(),a={...T,...e},P())return Q(),[];E=O(),J();let t=document.readyState!=="loading";if(a.startEvent==="DOMContentLoaded"&&t)g();else if(a.startEvent==="load"&&document.readyState==="complete")g();else{let n=a.startEvent==="load"?window:document,o=()=>g();n.addEventListener(a.startEvent,o,{once:!0}),s={target:n,type:a.startEvent,fn:o}}return Array.from(document.querySelectorAll("[data-aos]"))}function v(){f&&(k(),L())}function F(){if(f){if(P()){Q();return}R(),v()}}function V(){if(_()){s&&s.target.removeEventListener(s.type,s.fn),s=null,cancelAnimationFrame(m),m=0,clearTimeout(w),window.removeEventListener("scroll",I),window.removeEventListener("resize",b),window.removeEventListener("orientationchange",b),window.removeEventListener("load",q),p?.disconnect(),p=null;for(let e of d)e.node.removeAttribute("data-aos-instant");d=[],f=!1,document.getElementById(h)?.remove()}}var te={init:ee,refresh:v,refreshHard:F,destroy:V},y=te;function ne(e={},t){let n=B(e);n.current=e,Y(()=>(y.init(n.current),()=>y.destroy()),[]);let o=B(!0);Y(()=>{if(o.current){o.current=!1;return}y.refreshHard()},[t])}function ue({refreshKey:e,...t}){return ne(t,e),null}export{ue as AOSInit,ne as useAOS};