@sonordev/site-kit 5.1.0 → 5.3.1

package/dist/motion/index.js

@@ -0,0 +1,252 @@
+'use client';
+'use strict';
+
+var chunkAEW7EFYU_js = require('../chunk-AEW7EFYU.js');
+require('../chunk-SNAQBZPT.js');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/motion/failsafe.ts
+var scrolled = false;
+var armed = false;
+function arm() {
+  if (armed || typeof window === "undefined") return;
+  armed = true;
+  window.addEventListener(
+    "scroll",
+    () => {
+      scrolled = true;
+    },
+    { passive: true, once: true }
+  );
+}
+function onNoScroll(fn, ms = 2500) {
+  if (typeof window === "undefined") return () => {
+  };
+  arm();
+  const t = setTimeout(() => {
+    if (!scrolled) fn();
+  }, ms);
+  return () => clearTimeout(t);
+}
+var DEFAULT_EASING = "cubic-bezier(0.22, 1, 0.36, 1)";
+var DEFAULT_STAGGER = 0.08;
+function hiddenTransform(from, distance, scale) {
+  let t = "";
+  if (from === "up") t = `translate3d(0, ${distance}px, 0)`;
+  else if (from === "down") t = `translate3d(0, ${-distance}px, 0)`;
+  else if (from === "left") t = `translate3d(${-distance}px, 0, 0)`;
+  else if (from === "right") t = `translate3d(${distance}px, 0, 0)`;
+  if (scale !== void 0) t = `${t} scale(${scale})`.trim();
+  return t;
+}
+function Reveal({
+  children,
+  as = "div",
+  className,
+  style,
+  id,
+  from = "up",
+  distance = 24,
+  delay = 0,
+  duration = 0.7,
+  stagger = false,
+  once = true,
+  threshold = 0.15,
+  scale,
+  opacity = 0,
+  easing = DEFAULT_EASING
+}) {
+  const ref = react.useRef(null);
+  const Tag = as;
+  react.useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (chunkAEW7EFYU_js.prefersReducedMotion()) return;
+    const step = stagger === true ? DEFAULT_STAGGER : stagger || 0;
+    const targets = () => step > 0 && el.children.length > 0 ? Array.from(el.children) : [el];
+    const hiddenOpacity = String(opacity);
+    const transform = hiddenTransform(from, distance, scale);
+    let clearTimer;
+    let animObserver = null;
+    let cancelFailsafe;
+    let shown = false;
+    const hide = (animated) => {
+      clearTimeout(clearTimer);
+      for (const t of targets()) {
+        t.style.transition = animated ? `opacity ${duration * 0.5}s ${easing}, transform ${duration * 0.5}s ${easing}` : "none";
+        t.style.opacity = hiddenOpacity;
+        t.style.transform = transform;
+      }
+    };
+    const show = () => {
+      const list = targets();
+      let total = 0;
+      list.forEach((t, i) => {
+        const d = delay + step * i;
+        total = Math.max(total, d + duration);
+        t.style.transition = `opacity ${duration}s ${easing} ${d}s, transform ${duration}s ${easing} ${d}s`;
+        t.style.opacity = "";
+        t.style.transform = "";
+      });
+      clearTimeout(clearTimer);
+      clearTimer = setTimeout(() => {
+        for (const t of list) t.style.transition = "";
+      }, total * 1e3 + 100);
+    };
+    const restore = () => {
+      clearTimeout(clearTimer);
+      for (const t of targets()) {
+        t.style.transition = "";
+        t.style.opacity = "";
+        t.style.transform = "";
+      }
+    };
+    const foldObserver = new IntersectionObserver(([entry]) => {
+      foldObserver.disconnect();
+      if (!el.isConnected || entry?.isIntersecting) return;
+      hide(false);
+      cancelFailsafe = onNoScroll(() => {
+        animObserver?.disconnect();
+        restore();
+      });
+      animObserver = new IntersectionObserver(
+        ([e]) => {
+          if (!e) return;
+          if (e.isIntersecting) {
+            shown = true;
+            if (once) animObserver?.disconnect();
+            show();
+          } else if (shown && !once) {
+            hide(true);
+          }
+        },
+        // Fire when the element's top crosses `threshold` up from the
+        // bottom edge — the same trigger line as GSAP's "top 85%", and it
+        // works for elements taller than the viewport.
+        { rootMargin: `0px 0px -${Math.round(threshold * 100)}% 0px`, threshold: 0 }
+      );
+      animObserver.observe(el);
+    });
+    foldObserver.observe(el);
+    return () => {
+      foldObserver.disconnect();
+      animObserver?.disconnect();
+      cancelFailsafe?.();
+      clearTimeout(clearTimer);
+    };
+  }, [from, distance, delay, duration, stagger, once, threshold, scale, opacity, easing]);
+  return /* @__PURE__ */ jsxRuntime.jsx(Tag, { ref, id, className, style, "data-sk-reveal": "", children });
+}
+function useParallax(ref, options = {}) {
+  const { y = [40, -40], x, scale, opacity, rotate } = options;
+  const easeRef = react.useRef(options.ease);
+  easeRef.current = options.ease;
+  const key = JSON.stringify([y, x, scale, opacity, rotate]);
+  react.useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (chunkAEW7EFYU_js.prefersReducedMotion()) return;
+    const between = (r, q) => r[0] + (r[1] - r[0]) * q;
+    return chunkAEW7EFYU_js.registerScene(
+      el,
+      (p, info) => {
+        const q = easeRef.current ? easeRef.current(p) : p;
+        let t = `translate3d(${x ? between(x, q) : 0}px, ${between(y, q)}px, 0)`;
+        if (scale) t += ` scale(${between(scale, q)})`;
+        if (rotate) t += ` rotate(${between(rotate, q)}deg)`;
+        el.style.transform = t;
+        if (opacity) el.style.opacity = String(between(opacity, q));
+        el.style.willChange = info.visible ? "transform" : "";
+      },
+      { mode: "view", lerp: 1 }
+    );
+  }, [ref, key]);
+}
+function Parallax({ children, as = "div", className, style, id, ...options }) {
+  const ref = react.useRef(null);
+  const Tag = as;
+  useParallax(ref, options);
+  return /* @__PURE__ */ jsxRuntime.jsx(Tag, { ref, id, className, style, "data-sk-parallax": "", children });
+}
+function useScrollScene(ref, onProgress, options = {}) {
+  const cbRef = react.useRef(onProgress);
+  cbRef.current = onProgress;
+  const { continuous, reducedP, mode, lerp, cssVar } = options;
+  react.useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    const prop = cssVar === false ? null : cssVar ?? "--sk-p";
+    return chunkAEW7EFYU_js.registerScene(
+      el,
+      (p, info) => {
+        if (prop) el.style.setProperty(prop, p.toFixed(4));
+        cbRef.current?.(p, info);
+      },
+      { continuous, reducedP, mode, lerp }
+    );
+  }, [ref, continuous, reducedP, mode, lerp, cssVar]);
+}
+function ScrollScene({
+  children,
+  length = "300vh",
+  as = "section",
+  className,
+  style,
+  id,
+  stageClassName,
+  stageStyle,
+  onProgress,
+  continuous,
+  reducedP,
+  lerp,
+  cssVar
+}) {
+  const ref = react.useRef(null);
+  const Tag = as;
+  useScrollScene(ref, onProgress, { continuous, reducedP, lerp, cssVar, mode: "pin" });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Tag,
+    {
+      ref,
+      id,
+      className,
+      style: { position: "relative", height: length, ...style },
+      "data-sk-scene": "",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: stageClassName,
+          style: { position: "sticky", top: 0, height: "100svh", overflow: "hidden", ...stageStyle },
+          "data-sk-stage": "",
+          children
+        }
+      )
+    }
+  );
+}
+
+Object.defineProperty(exports, "prefersReducedMotion", {
+  enumerable: true,
+  get: function () { return chunkAEW7EFYU_js.prefersReducedMotion; }
+});
+Object.defineProperty(exports, "refreshScenes", {
+  enumerable: true,
+  get: function () { return chunkAEW7EFYU_js.refreshScenes; }
+});
+Object.defineProperty(exports, "registerScene", {
+  enumerable: true,
+  get: function () { return chunkAEW7EFYU_js.registerScene; }
+});
+Object.defineProperty(exports, "sceneProgress", {
+  enumerable: true,
+  get: function () { return chunkAEW7EFYU_js.sceneProgress; }
+});
+exports.Parallax = Parallax;
+exports.Reveal = Reveal;
+exports.ScrollScene = ScrollScene;
+exports.onNoScroll = onNoScroll;
+exports.useParallax = useParallax;
+exports.useScrollScene = useScrollScene;
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/motion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/motion/failsafe.ts","../../src/motion/Reveal.tsx","../../src/motion/Parallax.tsx","../../src/motion/ScrollScene.tsx"],"names":["useRef","useEffect","prefersReducedMotion","jsx","registerScene"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Renderer failsafe for scroll-entrance reveals.\n *\n * Headless renderers — Google's Web Rendering Service included — execute\n * JavaScript but never scroll, so a scroll-triggered reveal would leave\n * below-the-fold content transparent in the rendered snapshot that gets\n * indexed. (Measured at ~85 transparent elements on one page before this\n * guard existed.) If the visitor hasn't scrolled shortly after a reveal\n * arms, we assume nobody is going to and show the content. Real visitors\n * scroll well inside the window, so animations are unaffected.\n *\n * Single source of truth for every reveal system in the kit. Ported from\n * upforge.io's lib/reveal-failsafe.\n */\n\nlet scrolled = false\nlet armed = false\n\nfunction arm() {\n  if (armed || typeof window === 'undefined') return\n  armed = true\n  window.addEventListener(\n    'scroll',\n    () => {\n      scrolled = true\n    },\n    { passive: true, once: true },\n  )\n}\n\n/**\n * Run `fn` after `ms` milliseconds unless the visitor scrolls first.\n * Returns a cancel function for effect cleanups.\n */\nexport function onNoScroll(fn: () => void, ms = 2500): () => void {\n  if (typeof window === 'undefined') return () => {}\n  arm()\n  const t = setTimeout(() => {\n    if (!scrolled) fn()\n  }, ms)\n  return () => clearTimeout(t)\n}\n","'use client'\n\nimport { useEffect, useRef, type CSSProperties, type ElementType, type ReactNode } from 'react'\nimport { prefersReducedMotion } from './engine'\nimport { onNoScroll } from './failsafe'\n\n/**\n * <Reveal> — scroll-entrance reveal with no animation library.\n *\n * The SEO contract, in order of importance:\n *\n * 1. The server HTML is fully visible. Nothing is hidden by a stylesheet or\n *    an inline style at render time, so crawlers, no-JS visitors, and the\n *    LCP measurement all see the finished page.\n * 2. Above-the-fold content is never touched. On mount, one\n *    IntersectionObserver pass asks whether the element is already on\n *    screen; if it is, this component does nothing at all.\n * 3. Only below-the-fold content is hidden (offscreen, so nobody sees the\n *    swap) and revealed with a compositor-only CSS transition on opacity\n *    and transform as it scrolls in.\n * 4. A headless renderer that never scrolls gets the content back after\n *    2.5s (see ./failsafe), so the indexed snapshot is never transparent.\n * 5. prefers-reduced-motion disables all of it.\n *\n * Replaces the per-site Reveal / ScrollReveal / RevealOnScroll components.\n */\n\nexport type RevealDirection = 'up' | 'down' | 'left' | 'right' | 'none'\n\nexport interface RevealProps {\n  children?: ReactNode\n  /** Element to render. Default \"div\". */\n  as?: ElementType\n  className?: string\n  style?: CSSProperties\n  id?: string\n  /** Where the element travels in from. Default \"up\" (starts lower). */\n  from?: RevealDirection\n  /** Travel distance in px. Default 24. */\n  distance?: number\n  /** Seconds before the transition starts. Default 0. */\n  delay?: number\n  /** Transition length in seconds. Default 0.7. */\n  duration?: number\n  /**\n   * Reveal the element's direct children one after another instead of the\n   * element itself. `true` = 0.08s apart; a number = that many seconds.\n   */\n  stagger?: boolean | number\n  /** Play once (default) or re-hide when the element scrolls back out. */\n  once?: boolean\n  /**\n   * How far up the viewport the element's top must travel before it\n   * reveals, as a fraction of viewport height. 0.15 (default) = reveal when\n   * the top crosses 85% down the screen.\n   */\n  threshold?: number\n  /** Starting scale, e.g. 0.96. Off by default. */\n  scale?: number\n  /** Starting opacity. Default 0. */\n  opacity?: number\n  /** CSS easing. Default an ease-out-quint curve. */\n  easing?: string\n}\n\nconst DEFAULT_EASING = 'cubic-bezier(0.22, 1, 0.36, 1)'\nconst DEFAULT_STAGGER = 0.08\n\nfunction hiddenTransform(from: RevealDirection, distance: number, scale?: number): string {\n  let t = ''\n  if (from === 'up') t = `translate3d(0, ${distance}px, 0)`\n  else if (from === 'down') t = `translate3d(0, ${-distance}px, 0)`\n  else if (from === 'left') t = `translate3d(${-distance}px, 0, 0)`\n  else if (from === 'right') t = `translate3d(${distance}px, 0, 0)`\n  if (scale !== undefined) t = `${t} scale(${scale})`.trim()\n  return t\n}\n\nexport function Reveal({\n  children,\n  as = 'div',\n  className,\n  style,\n  id,\n  from = 'up',\n  distance = 24,\n  delay = 0,\n  duration = 0.7,\n  stagger = false,\n  once = true,\n  threshold = 0.15,\n  scale,\n  opacity = 0,\n  easing = DEFAULT_EASING,\n}: RevealProps) {\n  const ref = useRef<HTMLElement>(null)\n  const Tag = as as ElementType\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (prefersReducedMotion()) return\n\n    const step = stagger === true ? DEFAULT_STAGGER : stagger || 0\n    const targets = (): HTMLElement[] =>\n      step > 0 && el.children.length > 0\n        ? (Array.from(el.children) as HTMLElement[])\n        : [el]\n    const hiddenOpacity = String(opacity)\n    const transform = hiddenTransform(from, distance, scale)\n\n    let clearTimer: ReturnType<typeof setTimeout> | undefined\n    let animObserver: IntersectionObserver | null = null\n    let cancelFailsafe: (() => void) | undefined\n    let shown = false\n\n    const hide = (animated: boolean) => {\n      clearTimeout(clearTimer)\n      for (const t of targets()) {\n        t.style.transition = animated\n          ? `opacity ${duration * 0.5}s ${easing}, transform ${duration * 0.5}s ${easing}`\n          : 'none'\n        t.style.opacity = hiddenOpacity\n        t.style.transform = transform\n      }\n    }\n\n    const show = () => {\n      const list = targets()\n      let total = 0\n      list.forEach((t, i) => {\n        const d = delay + step * i\n        total = Math.max(total, d + duration)\n        t.style.transition = `opacity ${duration}s ${easing} ${d}s, transform ${duration}s ${easing} ${d}s`\n        t.style.opacity = ''\n        t.style.transform = ''\n      })\n      // Once the transition has run, drop the inline transition too, so the\n      // element is back to exactly what the stylesheet says.\n      clearTimeout(clearTimer)\n      clearTimer = setTimeout(() => {\n        for (const t of list) t.style.transition = ''\n      }, total * 1000 + 100)\n    }\n\n    const restore = () => {\n      clearTimeout(clearTimer)\n      for (const t of targets()) {\n        t.style.transition = ''\n        t.style.opacity = ''\n        t.style.transform = ''\n      }\n    }\n\n    // Pass 1: one observation with no margin tells us above-vs-below fold\n    // without a forced layout read. Above the fold: leave the static render\n    // alone. Below: hide (offscreen, unseen) and arm the reveal.\n    const foldObserver = new IntersectionObserver(([entry]) => {\n      foldObserver.disconnect()\n      if (!el.isConnected || entry?.isIntersecting) return\n\n      hide(false)\n\n      cancelFailsafe = onNoScroll(() => {\n        animObserver?.disconnect()\n        restore()\n      })\n\n      animObserver = new IntersectionObserver(\n        ([e]) => {\n          if (!e) return\n          if (e.isIntersecting) {\n            shown = true\n            if (once) animObserver?.disconnect()\n            show()\n          } else if (shown && !once) {\n            hide(true)\n          }\n        },\n        // Fire when the element's top crosses `threshold` up from the\n        // bottom edge — the same trigger line as GSAP's \"top 85%\", and it\n        // works for elements taller than the viewport.\n        { rootMargin: `0px 0px -${Math.round(threshold * 100)}% 0px`, threshold: 0 },\n      )\n      animObserver.observe(el)\n    })\n    foldObserver.observe(el)\n\n    return () => {\n      foldObserver.disconnect()\n      animObserver?.disconnect()\n      cancelFailsafe?.()\n      clearTimeout(clearTimer)\n    }\n  }, [from, distance, delay, duration, stagger, once, threshold, scale, opacity, easing])\n\n  return (\n    <Tag ref={ref} id={id} className={className} style={style} data-sk-reveal=\"\">\n      {children}\n    </Tag>\n  )\n}\n","'use client'\n\nimport {\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ElementType,\n  type ReactNode,\n  type RefObject,\n} from 'react'\nimport { prefersReducedMotion, registerScene } from './engine'\n\n/**\n * Scroll-linked parallax with no animation library.\n *\n * The element's progress through the viewport (0 as its top enters at the\n * bottom, 1 as its bottom leaves at the top) is mapped onto transform and\n * opacity — compositor-only properties, so a page full of these never\n * triggers layout or paint. Driven by the shared engine, so thirty of them\n * cost one requestAnimationFrame.\n *\n * Server-rendered exactly as authored: no offset, no hidden state. Under\n * prefers-reduced-motion nothing registers and the element stays put.\n *\n * Replaces the per-site ParallaxImage / ParallaxY components: wrap the\n * image in an overflow-hidden frame and give <Parallax> a scale so the\n * travel never shows the frame's edges.\n */\n\nexport interface ParallaxOptions {\n  /** Vertical travel in px as [at p=0, at p=1]. Default [40, -40]. */\n  y?: [number, number]\n  /** Horizontal travel in px. */\n  x?: [number, number]\n  /** Scale as [from, to]. */\n  scale?: [number, number]\n  /** Opacity as [from, to]. */\n  opacity?: [number, number]\n  /** Rotation in degrees as [from, to]. */\n  rotate?: [number, number]\n  /** Remap progress before it's applied (e.g. an ease-in-out). */\n  ease?: (p: number) => number\n}\n\nexport function useParallax(ref: RefObject<HTMLElement | null>, options: ParallaxOptions = {}): void {\n  const { y = [40, -40], x, scale, opacity, rotate } = options\n  const easeRef = useRef(options.ease)\n  easeRef.current = options.ease\n  // Ranges are small tuples; a string key keeps the effect stable across\n  // renders that pass a fresh array literal with the same values.\n  const key = JSON.stringify([y, x, scale, opacity, rotate])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (prefersReducedMotion()) return\n\n    const between = (r: [number, number], q: number) => r[0] + (r[1] - r[0]) * q\n\n    return registerScene(\n      el,\n      (p, info) => {\n        const q = easeRef.current ? easeRef.current(p) : p\n        let t = `translate3d(${x ? between(x, q) : 0}px, ${between(y, q)}px, 0)`\n        if (scale) t += ` scale(${between(scale, q)})`\n        if (rotate) t += ` rotate(${between(rotate, q)}deg)`\n        el.style.transform = t\n        if (opacity) el.style.opacity = String(between(opacity, q))\n        // Promote to its own layer only while it's actually moving on screen.\n        el.style.willChange = info.visible ? 'transform' : ''\n      },\n      { mode: 'view', lerp: 1 },\n    )\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ref, key])\n}\n\nexport interface ParallaxProps extends ParallaxOptions {\n  children?: ReactNode\n  /** Element to render. Default \"div\". */\n  as?: ElementType\n  className?: string\n  style?: CSSProperties\n  id?: string\n}\n\nexport function Parallax({ children, as = 'div', className, style, id, ...options }: ParallaxProps) {\n  const ref = useRef<HTMLElement>(null)\n  const Tag = as as ElementType\n  useParallax(ref, options)\n  return (\n    <Tag ref={ref} id={id} className={className} style={style} data-sk-parallax=\"\">\n      {children}\n    </Tag>\n  )\n}\n","'use client'\n\nimport {\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ElementType,\n  type ReactNode,\n  type RefObject,\n} from 'react'\nimport { registerScene, type SceneInfo, type SceneOptions } from './engine'\n\n/**\n * A pinned scene: a tall wrapper with a sticky, viewport-sized stage inside\n * it. As the visitor scrolls the wrapper's height, the stage stays put and\n * the scene's progress runs 0 → 1. This is the unit of scroll cinema.\n *\n * What it does for you on every frame:\n *   - writes progress to a CSS custom property on the wrapper (`--sk-p` by\n *     default), so choreography can be pure CSS: `opacity: var(--sk-p)`,\n *     `transform: translateX(calc(var(--sk-p) * -40vw))` — no per-frame JS.\n *   - calls `onProgress(p, info)` for anything that needs code (canvas\n *     frame-scrub, three.js, DOM measured moves).\n *\n * The children are server-rendered. A \"use client\" component still renders\n * its children on the server when they arrive as props, so the copy inside\n * a scene is in the HTML for crawlers and for first paint. What you must\n * NOT do is load this (or a component containing it) through\n * `dynamic(..., { ssr: false })` — that de-opts the whole subtree to client\n * rendering and the copy disappears from the HTML.\n */\n\nexport interface UseScrollSceneOptions extends SceneOptions {\n  /** CSS custom property to write progress to. Default \"--sk-p\"; false to skip. */\n  cssVar?: string | false\n}\n\nexport function useScrollScene(\n  ref: RefObject<HTMLElement | null>,\n  onProgress?: (p: number, info: SceneInfo) => void,\n  options: UseScrollSceneOptions = {},\n): void {\n  const cbRef = useRef(onProgress)\n  cbRef.current = onProgress\n  const { continuous, reducedP, mode, lerp, cssVar } = options\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    const prop = cssVar === false ? null : (cssVar ?? '--sk-p')\n    return registerScene(\n      el,\n      (p, info) => {\n        if (prop) el.style.setProperty(prop, p.toFixed(4))\n        cbRef.current?.(p, info)\n      },\n      { continuous, reducedP, mode, lerp },\n    )\n  }, [ref, continuous, reducedP, mode, lerp, cssVar])\n}\n\nexport interface ScrollSceneProps extends Omit<UseScrollSceneOptions, 'mode'> {\n  children?: ReactNode\n  /** Scroll length of the scene — the wrapper's height. Default \"300vh\". */\n  length?: string\n  /** Wrapper element. Default \"section\". */\n  as?: ElementType\n  className?: string\n  style?: CSSProperties\n  id?: string\n  /** Class/style for the sticky stage that holds the children. */\n  stageClassName?: string\n  stageStyle?: CSSProperties\n  onProgress?: (p: number, info: SceneInfo) => void\n}\n\nexport function ScrollScene({\n  children,\n  length = '300vh',\n  as = 'section',\n  className,\n  style,\n  id,\n  stageClassName,\n  stageStyle,\n  onProgress,\n  continuous,\n  reducedP,\n  lerp,\n  cssVar,\n}: ScrollSceneProps) {\n  const ref = useRef<HTMLElement>(null)\n  const Tag = as as ElementType\n  useScrollScene(ref, onProgress, { continuous, reducedP, lerp, cssVar, mode: 'pin' })\n  return (\n    <Tag\n      ref={ref}\n      id={id}\n      className={className}\n      style={{ position: 'relative', height: length, ...style }}\n      data-sk-scene=\"\"\n    >\n      <div\n        className={stageClassName}\n        style={{ position: 'sticky', top: 0, height: '100svh', overflow: 'hidden', ...stageStyle }}\n        data-sk-stage=\"\"\n      >\n        {children}\n      </div>\n    </Tag>\n  )\n}\n"]}

package/dist/motion/index.mjs

@@ -0,0 +1,230 @@
+'use client';
+import { prefersReducedMotion, registerScene } from '../chunk-MLXUMVBK.mjs';
+export { prefersReducedMotion, refreshScenes, registerScene, sceneProgress } from '../chunk-MLXUMVBK.mjs';
+import '../chunk-BEXTDHO4.mjs';
+import { useRef, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/motion/failsafe.ts
+var scrolled = false;
+var armed = false;
+function arm() {
+  if (armed || typeof window === "undefined") return;
+  armed = true;
+  window.addEventListener(
+    "scroll",
+    () => {
+      scrolled = true;
+    },
+    { passive: true, once: true }
+  );
+}
+function onNoScroll(fn, ms = 2500) {
+  if (typeof window === "undefined") return () => {
+  };
+  arm();
+  const t = setTimeout(() => {
+    if (!scrolled) fn();
+  }, ms);
+  return () => clearTimeout(t);
+}
+var DEFAULT_EASING = "cubic-bezier(0.22, 1, 0.36, 1)";
+var DEFAULT_STAGGER = 0.08;
+function hiddenTransform(from, distance, scale) {
+  let t = "";
+  if (from === "up") t = `translate3d(0, ${distance}px, 0)`;
+  else if (from === "down") t = `translate3d(0, ${-distance}px, 0)`;
+  else if (from === "left") t = `translate3d(${-distance}px, 0, 0)`;
+  else if (from === "right") t = `translate3d(${distance}px, 0, 0)`;
+  if (scale !== void 0) t = `${t} scale(${scale})`.trim();
+  return t;
+}
+function Reveal({
+  children,
+  as = "div",
+  className,
+  style,
+  id,
+  from = "up",
+  distance = 24,
+  delay = 0,
+  duration = 0.7,
+  stagger = false,
+  once = true,
+  threshold = 0.15,
+  scale,
+  opacity = 0,
+  easing = DEFAULT_EASING
+}) {
+  const ref = useRef(null);
+  const Tag = as;
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (prefersReducedMotion()) return;
+    const step = stagger === true ? DEFAULT_STAGGER : stagger || 0;
+    const targets = () => step > 0 && el.children.length > 0 ? Array.from(el.children) : [el];
+    const hiddenOpacity = String(opacity);
+    const transform = hiddenTransform(from, distance, scale);
+    let clearTimer;
+    let animObserver = null;
+    let cancelFailsafe;
+    let shown = false;
+    const hide = (animated) => {
+      clearTimeout(clearTimer);
+      for (const t of targets()) {
+        t.style.transition = animated ? `opacity ${duration * 0.5}s ${easing}, transform ${duration * 0.5}s ${easing}` : "none";
+        t.style.opacity = hiddenOpacity;
+        t.style.transform = transform;
+      }
+    };
+    const show = () => {
+      const list = targets();
+      let total = 0;
+      list.forEach((t, i) => {
+        const d = delay + step * i;
+        total = Math.max(total, d + duration);
+        t.style.transition = `opacity ${duration}s ${easing} ${d}s, transform ${duration}s ${easing} ${d}s`;
+        t.style.opacity = "";
+        t.style.transform = "";
+      });
+      clearTimeout(clearTimer);
+      clearTimer = setTimeout(() => {
+        for (const t of list) t.style.transition = "";
+      }, total * 1e3 + 100);
+    };
+    const restore = () => {
+      clearTimeout(clearTimer);
+      for (const t of targets()) {
+        t.style.transition = "";
+        t.style.opacity = "";
+        t.style.transform = "";
+      }
+    };
+    const foldObserver = new IntersectionObserver(([entry]) => {
+      foldObserver.disconnect();
+      if (!el.isConnected || entry?.isIntersecting) return;
+      hide(false);
+      cancelFailsafe = onNoScroll(() => {
+        animObserver?.disconnect();
+        restore();
+      });
+      animObserver = new IntersectionObserver(
+        ([e]) => {
+          if (!e) return;
+          if (e.isIntersecting) {
+            shown = true;
+            if (once) animObserver?.disconnect();
+            show();
+          } else if (shown && !once) {
+            hide(true);
+          }
+        },
+        // Fire when the element's top crosses `threshold` up from the
+        // bottom edge — the same trigger line as GSAP's "top 85%", and it
+        // works for elements taller than the viewport.
+        { rootMargin: `0px 0px -${Math.round(threshold * 100)}% 0px`, threshold: 0 }
+      );
+      animObserver.observe(el);
+    });
+    foldObserver.observe(el);
+    return () => {
+      foldObserver.disconnect();
+      animObserver?.disconnect();
+      cancelFailsafe?.();
+      clearTimeout(clearTimer);
+    };
+  }, [from, distance, delay, duration, stagger, once, threshold, scale, opacity, easing]);
+  return /* @__PURE__ */ jsx(Tag, { ref, id, className, style, "data-sk-reveal": "", children });
+}
+function useParallax(ref, options = {}) {
+  const { y = [40, -40], x, scale, opacity, rotate } = options;
+  const easeRef = useRef(options.ease);
+  easeRef.current = options.ease;
+  const key = JSON.stringify([y, x, scale, opacity, rotate]);
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (prefersReducedMotion()) return;
+    const between = (r, q) => r[0] + (r[1] - r[0]) * q;
+    return registerScene(
+      el,
+      (p, info) => {
+        const q = easeRef.current ? easeRef.current(p) : p;
+        let t = `translate3d(${x ? between(x, q) : 0}px, ${between(y, q)}px, 0)`;
+        if (scale) t += ` scale(${between(scale, q)})`;
+        if (rotate) t += ` rotate(${between(rotate, q)}deg)`;
+        el.style.transform = t;
+        if (opacity) el.style.opacity = String(between(opacity, q));
+        el.style.willChange = info.visible ? "transform" : "";
+      },
+      { mode: "view", lerp: 1 }
+    );
+  }, [ref, key]);
+}
+function Parallax({ children, as = "div", className, style, id, ...options }) {
+  const ref = useRef(null);
+  const Tag = as;
+  useParallax(ref, options);
+  return /* @__PURE__ */ jsx(Tag, { ref, id, className, style, "data-sk-parallax": "", children });
+}
+function useScrollScene(ref, onProgress, options = {}) {
+  const cbRef = useRef(onProgress);
+  cbRef.current = onProgress;
+  const { continuous, reducedP, mode, lerp, cssVar } = options;
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    const prop = cssVar === false ? null : cssVar ?? "--sk-p";
+    return registerScene(
+      el,
+      (p, info) => {
+        if (prop) el.style.setProperty(prop, p.toFixed(4));
+        cbRef.current?.(p, info);
+      },
+      { continuous, reducedP, mode, lerp }
+    );
+  }, [ref, continuous, reducedP, mode, lerp, cssVar]);
+}
+function ScrollScene({
+  children,
+  length = "300vh",
+  as = "section",
+  className,
+  style,
+  id,
+  stageClassName,
+  stageStyle,
+  onProgress,
+  continuous,
+  reducedP,
+  lerp,
+  cssVar
+}) {
+  const ref = useRef(null);
+  const Tag = as;
+  useScrollScene(ref, onProgress, { continuous, reducedP, lerp, cssVar, mode: "pin" });
+  return /* @__PURE__ */ jsx(
+    Tag,
+    {
+      ref,
+      id,
+      className,
+      style: { position: "relative", height: length, ...style },
+      "data-sk-scene": "",
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: stageClassName,
+          style: { position: "sticky", top: 0, height: "100svh", overflow: "hidden", ...stageStyle },
+          "data-sk-stage": "",
+          children
+        }
+      )
+    }
+  );
+}
+
+export { Parallax, Reveal, ScrollScene, onNoScroll, useParallax, useScrollScene };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/motion/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/motion/failsafe.ts","../../src/motion/Reveal.tsx","../../src/motion/Parallax.tsx","../../src/motion/ScrollScene.tsx"],"names":["useRef","useEffect","jsx"],"mappings":"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","file":"index.mjs","sourcesContent":["/**\n * Renderer failsafe for scroll-entrance reveals.\n *\n * Headless renderers — Google's Web Rendering Service included — execute\n * JavaScript but never scroll, so a scroll-triggered reveal would leave\n * below-the-fold content transparent in the rendered snapshot that gets\n * indexed. (Measured at ~85 transparent elements on one page before this\n * guard existed.) If the visitor hasn't scrolled shortly after a reveal\n * arms, we assume nobody is going to and show the content. Real visitors\n * scroll well inside the window, so animations are unaffected.\n *\n * Single source of truth for every reveal system in the kit. Ported from\n * upforge.io's lib/reveal-failsafe.\n */\n\nlet scrolled = false\nlet armed = false\n\nfunction arm() {\n  if (armed || typeof window === 'undefined') return\n  armed = true\n  window.addEventListener(\n    'scroll',\n    () => {\n      scrolled = true\n    },\n    { passive: true, once: true },\n  )\n}\n\n/**\n * Run `fn` after `ms` milliseconds unless the visitor scrolls first.\n * Returns a cancel function for effect cleanups.\n */\nexport function onNoScroll(fn: () => void, ms = 2500): () => void {\n  if (typeof window === 'undefined') return () => {}\n  arm()\n  const t = setTimeout(() => {\n    if (!scrolled) fn()\n  }, ms)\n  return () => clearTimeout(t)\n}\n","'use client'\n\nimport { useEffect, useRef, type CSSProperties, type ElementType, type ReactNode } from 'react'\nimport { prefersReducedMotion } from './engine'\nimport { onNoScroll } from './failsafe'\n\n/**\n * <Reveal> — scroll-entrance reveal with no animation library.\n *\n * The SEO contract, in order of importance:\n *\n * 1. The server HTML is fully visible. Nothing is hidden by a stylesheet or\n *    an inline style at render time, so crawlers, no-JS visitors, and the\n *    LCP measurement all see the finished page.\n * 2. Above-the-fold content is never touched. On mount, one\n *    IntersectionObserver pass asks whether the element is already on\n *    screen; if it is, this component does nothing at all.\n * 3. Only below-the-fold content is hidden (offscreen, so nobody sees the\n *    swap) and revealed with a compositor-only CSS transition on opacity\n *    and transform as it scrolls in.\n * 4. A headless renderer that never scrolls gets the content back after\n *    2.5s (see ./failsafe), so the indexed snapshot is never transparent.\n * 5. prefers-reduced-motion disables all of it.\n *\n * Replaces the per-site Reveal / ScrollReveal / RevealOnScroll components.\n */\n\nexport type RevealDirection = 'up' | 'down' | 'left' | 'right' | 'none'\n\nexport interface RevealProps {\n  children?: ReactNode\n  /** Element to render. Default \"div\". */\n  as?: ElementType\n  className?: string\n  style?: CSSProperties\n  id?: string\n  /** Where the element travels in from. Default \"up\" (starts lower). */\n  from?: RevealDirection\n  /** Travel distance in px. Default 24. */\n  distance?: number\n  /** Seconds before the transition starts. Default 0. */\n  delay?: number\n  /** Transition length in seconds. Default 0.7. */\n  duration?: number\n  /**\n   * Reveal the element's direct children one after another instead of the\n   * element itself. `true` = 0.08s apart; a number = that many seconds.\n   */\n  stagger?: boolean | number\n  /** Play once (default) or re-hide when the element scrolls back out. */\n  once?: boolean\n  /**\n   * How far up the viewport the element's top must travel before it\n   * reveals, as a fraction of viewport height. 0.15 (default) = reveal when\n   * the top crosses 85% down the screen.\n   */\n  threshold?: number\n  /** Starting scale, e.g. 0.96. Off by default. */\n  scale?: number\n  /** Starting opacity. Default 0. */\n  opacity?: number\n  /** CSS easing. Default an ease-out-quint curve. */\n  easing?: string\n}\n\nconst DEFAULT_EASING = 'cubic-bezier(0.22, 1, 0.36, 1)'\nconst DEFAULT_STAGGER = 0.08\n\nfunction hiddenTransform(from: RevealDirection, distance: number, scale?: number): string {\n  let t = ''\n  if (from === 'up') t = `translate3d(0, ${distance}px, 0)`\n  else if (from === 'down') t = `translate3d(0, ${-distance}px, 0)`\n  else if (from === 'left') t = `translate3d(${-distance}px, 0, 0)`\n  else if (from === 'right') t = `translate3d(${distance}px, 0, 0)`\n  if (scale !== undefined) t = `${t} scale(${scale})`.trim()\n  return t\n}\n\nexport function Reveal({\n  children,\n  as = 'div',\n  className,\n  style,\n  id,\n  from = 'up',\n  distance = 24,\n  delay = 0,\n  duration = 0.7,\n  stagger = false,\n  once = true,\n  threshold = 0.15,\n  scale,\n  opacity = 0,\n  easing = DEFAULT_EASING,\n}: RevealProps) {\n  const ref = useRef<HTMLElement>(null)\n  const Tag = as as ElementType\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (prefersReducedMotion()) return\n\n    const step = stagger === true ? DEFAULT_STAGGER : stagger || 0\n    const targets = (): HTMLElement[] =>\n      step > 0 && el.children.length > 0\n        ? (Array.from(el.children) as HTMLElement[])\n        : [el]\n    const hiddenOpacity = String(opacity)\n    const transform = hiddenTransform(from, distance, scale)\n\n    let clearTimer: ReturnType<typeof setTimeout> | undefined\n    let animObserver: IntersectionObserver | null = null\n    let cancelFailsafe: (() => void) | undefined\n    let shown = false\n\n    const hide = (animated: boolean) => {\n      clearTimeout(clearTimer)\n      for (const t of targets()) {\n        t.style.transition = animated\n          ? `opacity ${duration * 0.5}s ${easing}, transform ${duration * 0.5}s ${easing}`\n          : 'none'\n        t.style.opacity = hiddenOpacity\n        t.style.transform = transform\n      }\n    }\n\n    const show = () => {\n      const list = targets()\n      let total = 0\n      list.forEach((t, i) => {\n        const d = delay + step * i\n        total = Math.max(total, d + duration)\n        t.style.transition = `opacity ${duration}s ${easing} ${d}s, transform ${duration}s ${easing} ${d}s`\n        t.style.opacity = ''\n        t.style.transform = ''\n      })\n      // Once the transition has run, drop the inline transition too, so the\n      // element is back to exactly what the stylesheet says.\n      clearTimeout(clearTimer)\n      clearTimer = setTimeout(() => {\n        for (const t of list) t.style.transition = ''\n      }, total * 1000 + 100)\n    }\n\n    const restore = () => {\n      clearTimeout(clearTimer)\n      for (const t of targets()) {\n        t.style.transition = ''\n        t.style.opacity = ''\n        t.style.transform = ''\n      }\n    }\n\n    // Pass 1: one observation with no margin tells us above-vs-below fold\n    // without a forced layout read. Above the fold: leave the static render\n    // alone. Below: hide (offscreen, unseen) and arm the reveal.\n    const foldObserver = new IntersectionObserver(([entry]) => {\n      foldObserver.disconnect()\n      if (!el.isConnected || entry?.isIntersecting) return\n\n      hide(false)\n\n      cancelFailsafe = onNoScroll(() => {\n        animObserver?.disconnect()\n        restore()\n      })\n\n      animObserver = new IntersectionObserver(\n        ([e]) => {\n          if (!e) return\n          if (e.isIntersecting) {\n            shown = true\n            if (once) animObserver?.disconnect()\n            show()\n          } else if (shown && !once) {\n            hide(true)\n          }\n        },\n        // Fire when the element's top crosses `threshold` up from the\n        // bottom edge — the same trigger line as GSAP's \"top 85%\", and it\n        // works for elements taller than the viewport.\n        { rootMargin: `0px 0px -${Math.round(threshold * 100)}% 0px`, threshold: 0 },\n      )\n      animObserver.observe(el)\n    })\n    foldObserver.observe(el)\n\n    return () => {\n      foldObserver.disconnect()\n      animObserver?.disconnect()\n      cancelFailsafe?.()\n      clearTimeout(clearTimer)\n    }\n  }, [from, distance, delay, duration, stagger, once, threshold, scale, opacity, easing])\n\n  return (\n    <Tag ref={ref} id={id} className={className} style={style} data-sk-reveal=\"\">\n      {children}\n    </Tag>\n  )\n}\n","'use client'\n\nimport {\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ElementType,\n  type ReactNode,\n  type RefObject,\n} from 'react'\nimport { prefersReducedMotion, registerScene } from './engine'\n\n/**\n * Scroll-linked parallax with no animation library.\n *\n * The element's progress through the viewport (0 as its top enters at the\n * bottom, 1 as its bottom leaves at the top) is mapped onto transform and\n * opacity — compositor-only properties, so a page full of these never\n * triggers layout or paint. Driven by the shared engine, so thirty of them\n * cost one requestAnimationFrame.\n *\n * Server-rendered exactly as authored: no offset, no hidden state. Under\n * prefers-reduced-motion nothing registers and the element stays put.\n *\n * Replaces the per-site ParallaxImage / ParallaxY components: wrap the\n * image in an overflow-hidden frame and give <Parallax> a scale so the\n * travel never shows the frame's edges.\n */\n\nexport interface ParallaxOptions {\n  /** Vertical travel in px as [at p=0, at p=1]. Default [40, -40]. */\n  y?: [number, number]\n  /** Horizontal travel in px. */\n  x?: [number, number]\n  /** Scale as [from, to]. */\n  scale?: [number, number]\n  /** Opacity as [from, to]. */\n  opacity?: [number, number]\n  /** Rotation in degrees as [from, to]. */\n  rotate?: [number, number]\n  /** Remap progress before it's applied (e.g. an ease-in-out). */\n  ease?: (p: number) => number\n}\n\nexport function useParallax(ref: RefObject<HTMLElement | null>, options: ParallaxOptions = {}): void {\n  const { y = [40, -40], x, scale, opacity, rotate } = options\n  const easeRef = useRef(options.ease)\n  easeRef.current = options.ease\n  // Ranges are small tuples; a string key keeps the effect stable across\n  // renders that pass a fresh array literal with the same values.\n  const key = JSON.stringify([y, x, scale, opacity, rotate])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (prefersReducedMotion()) return\n\n    const between = (r: [number, number], q: number) => r[0] + (r[1] - r[0]) * q\n\n    return registerScene(\n      el,\n      (p, info) => {\n        const q = easeRef.current ? easeRef.current(p) : p\n        let t = `translate3d(${x ? between(x, q) : 0}px, ${between(y, q)}px, 0)`\n        if (scale) t += ` scale(${between(scale, q)})`\n        if (rotate) t += ` rotate(${between(rotate, q)}deg)`\n        el.style.transform = t\n        if (opacity) el.style.opacity = String(between(opacity, q))\n        // Promote to its own layer only while it's actually moving on screen.\n        el.style.willChange = info.visible ? 'transform' : ''\n      },\n      { mode: 'view', lerp: 1 },\n    )\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ref, key])\n}\n\nexport interface ParallaxProps extends ParallaxOptions {\n  children?: ReactNode\n  /** Element to render. Default \"div\". */\n  as?: ElementType\n  className?: string\n  style?: CSSProperties\n  id?: string\n}\n\nexport function Parallax({ children, as = 'div', className, style, id, ...options }: ParallaxProps) {\n  const ref = useRef<HTMLElement>(null)\n  const Tag = as as ElementType\n  useParallax(ref, options)\n  return (\n    <Tag ref={ref} id={id} className={className} style={style} data-sk-parallax=\"\">\n      {children}\n    </Tag>\n  )\n}\n","'use client'\n\nimport {\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ElementType,\n  type ReactNode,\n  type RefObject,\n} from 'react'\nimport { registerScene, type SceneInfo, type SceneOptions } from './engine'\n\n/**\n * A pinned scene: a tall wrapper with a sticky, viewport-sized stage inside\n * it. As the visitor scrolls the wrapper's height, the stage stays put and\n * the scene's progress runs 0 → 1. This is the unit of scroll cinema.\n *\n * What it does for you on every frame:\n *   - writes progress to a CSS custom property on the wrapper (`--sk-p` by\n *     default), so choreography can be pure CSS: `opacity: var(--sk-p)`,\n *     `transform: translateX(calc(var(--sk-p) * -40vw))` — no per-frame JS.\n *   - calls `onProgress(p, info)` for anything that needs code (canvas\n *     frame-scrub, three.js, DOM measured moves).\n *\n * The children are server-rendered. A \"use client\" component still renders\n * its children on the server when they arrive as props, so the copy inside\n * a scene is in the HTML for crawlers and for first paint. What you must\n * NOT do is load this (or a component containing it) through\n * `dynamic(..., { ssr: false })` — that de-opts the whole subtree to client\n * rendering and the copy disappears from the HTML.\n */\n\nexport interface UseScrollSceneOptions extends SceneOptions {\n  /** CSS custom property to write progress to. Default \"--sk-p\"; false to skip. */\n  cssVar?: string | false\n}\n\nexport function useScrollScene(\n  ref: RefObject<HTMLElement | null>,\n  onProgress?: (p: number, info: SceneInfo) => void,\n  options: UseScrollSceneOptions = {},\n): void {\n  const cbRef = useRef(onProgress)\n  cbRef.current = onProgress\n  const { continuous, reducedP, mode, lerp, cssVar } = options\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    const prop = cssVar === false ? null : (cssVar ?? '--sk-p')\n    return registerScene(\n      el,\n      (p, info) => {\n        if (prop) el.style.setProperty(prop, p.toFixed(4))\n        cbRef.current?.(p, info)\n      },\n      { continuous, reducedP, mode, lerp },\n    )\n  }, [ref, continuous, reducedP, mode, lerp, cssVar])\n}\n\nexport interface ScrollSceneProps extends Omit<UseScrollSceneOptions, 'mode'> {\n  children?: ReactNode\n  /** Scroll length of the scene — the wrapper's height. Default \"300vh\". */\n  length?: string\n  /** Wrapper element. Default \"section\". */\n  as?: ElementType\n  className?: string\n  style?: CSSProperties\n  id?: string\n  /** Class/style for the sticky stage that holds the children. */\n  stageClassName?: string\n  stageStyle?: CSSProperties\n  onProgress?: (p: number, info: SceneInfo) => void\n}\n\nexport function ScrollScene({\n  children,\n  length = '300vh',\n  as = 'section',\n  className,\n  style,\n  id,\n  stageClassName,\n  stageStyle,\n  onProgress,\n  continuous,\n  reducedP,\n  lerp,\n  cssVar,\n}: ScrollSceneProps) {\n  const ref = useRef<HTMLElement>(null)\n  const Tag = as as ElementType\n  useScrollScene(ref, onProgress, { continuous, reducedP, lerp, cssVar, mode: 'pin' })\n  return (\n    <Tag\n      ref={ref}\n      id={id}\n      className={className}\n      style={{ position: 'relative', height: length, ...style }}\n      data-sk-scene=\"\"\n    >\n      <div\n        className={stageClassName}\n        style={{ position: 'sticky', top: 0, height: '100svh', overflow: 'hidden', ...stageStyle }}\n        data-sk-stage=\"\"\n      >\n        {children}\n      </div>\n    </Tag>\n  )\n}\n"]}

package/dist/motion/motion.test.d.ts

@@ -0,0 +1,16 @@
+/**
+ * The motion module's contracts:
+ *
+ * 1. Server HTML never hides content. Every primitive renders its children
+ *    fully visible with no opacity/transform in the markup — that is the
+ *    whole reason this module exists instead of the per-site reveals it
+ *    replaces (crawlers, no-JS visitors, and LCP all read the server HTML).
+ * 2. The progress math is exact.
+ * 3. The tiers are real: nothing outside src/motion/gsap.ts imports gsap,
+ *    nothing outside src/motion/three.ts imports three. A stray import in
+ *    the zero-dep tier would force every consumer of ./motion to install a
+ *    library it never asked for — bundlers resolve even dynamic import()
+ *    at build time.
+ */
+export {};
+//# sourceMappingURL=motion.test.d.ts.map

package/dist/motion/motion.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.test.d.ts","sourceRoot":"","sources":["../../src/motion/motion.test.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG"}