@ssgoi/react 3.0.0 → 3.1.0

package/dist/core/dist/types.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function p(n){return("tick"in n||"css"in n)&&!("springs"in n)}function r(n){return"springs"in n}function s(n){return"css"in n&&typeof n.css=="function"}function e(n){return"tick"in n&&typeof n.tick=="function"}function o(n){if(s(n)&&e(n))throw new Error("SingleSpringConfig cannot have both 'tick' and 'css' defined. Use one or the other.")}function a(n){if(n.tick&&n.css)throw new Error("SpringItem cannot have both 'tick' and 'css' defined. Use one or the other.")}function f(n){return r(n)?(n.springs.forEach(a),n):(o(n),{prepare:n.prepare,wait:n.wait,onStart:n.onStart,onEnd:n.onEnd,springs:[{spring:n.spring,tick:n.tick,css:n.css}],schedule:"parallel"})}function g(n){const c=n.schedule??"parallel",l=n.springs.map(t=>{let i;switch(c){case"parallel":i=0;break;case"sequential":i=1;break;case"stagger":i=Math.max(0,Math.min(1,t.offset??0));break;default:i=0}return{...t,normalizedOffset:i}}),{schedule:d,...u}=n;return{...u,springs:l}}exports.isCssAnimation=s;exports.isMultiSpring=r;exports.isSingleSpring=p;exports.isTickAnimation=e;exports.normalizeMultiSpringSchedule=g;exports.normalizeToMultiSpring=f;exports.validateAnimationMode=o;exports.validateSpringItem=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function p(n){return("tick"in n||"css"in n)&&!("springs"in n)}function r(n){return"springs"in n}function s(n){return"css"in n&&typeof n.css=="function"}function a(n){return"tick"in n&&typeof n.tick=="function"}function o(n){if(s(n)&&a(n))throw new Error("SingleSpringConfig cannot have both 'tick' and 'css' defined. Use one or the other.")}function c(n){if(n.tick&&n.css)throw new Error("SpringItem cannot have both 'tick' and 'css' defined. Use one or the other.")}async function f(n){const i=await n;return r(i)?(i.springs.forEach(c),i):(o(i),{prepare:i.prepare,wait:i.wait,onStart:i.onStart,onEnd:i.onEnd,springs:[{spring:i.spring,tick:i.tick,css:i.css}],schedule:"parallel"})}function g(n){const i=n.schedule??"parallel",l=n.springs.map(t=>{let e;switch(i){case"parallel":e=0;break;case"sequential":e=1;break;case"stagger":e=Math.max(0,Math.min(1,t.offset??0));break;default:e=0}return{...t,normalizedOffset:e}}),{schedule:d,...u}=n;return{...u,springs:l}}exports.isCssAnimation=s;exports.isMultiSpring=r;exports.isSingleSpring=p;exports.isTickAnimation=a;exports.normalizeMultiSpringSchedule=g;exports.normalizeToMultiSpring=f;exports.validateAnimationMode=o;exports.validateSpringItem=c;

package/dist/core/dist/types.js

@@ -1,7 +1,7 @@
 function f(n) {
   return ("tick" in n || "css" in n) && !("springs" in n);
 }
-function e(n) {
+function a(n) {
   return "springs" in n;
 }
 function o(n) {
@@ -22,48 +22,49 @@ function p(n) {
       "SpringItem cannot have both 'tick' and 'css' defined. Use one or the other."
     );
 }
-function g(n) {
-  return e(n) ? (n.springs.forEach(p), n) : (l(n), {
-    prepare: n.prepare,
-    wait: n.wait,
-    onStart: n.onStart,
-    onEnd: n.onEnd,
+async function g(n) {
+  const i = await n;
+  return a(i) ? (i.springs.forEach(p), i) : (l(i), {
+    prepare: i.prepare,
+    wait: i.wait,
+    onStart: i.onStart,
+    onEnd: i.onEnd,
     springs: [
       {
-        spring: n.spring,
-        tick: n.tick,
-        css: n.css
+        spring: i.spring,
+        tick: i.tick,
+        css: i.css
       }
     ],
     schedule: "parallel"
   });
 }
 function h(n) {
-  const r = n.schedule ?? "parallel", s = n.springs.map((t) => {
-    let i;
-    switch (r) {
+  const i = n.schedule ?? "parallel", s = n.springs.map((e) => {
+    let t;
+    switch (i) {
       case "parallel":
-        i = 0;
+        t = 0;
         break;
       case "sequential":
-        i = 1;
+        t = 1;
         break;
       case "stagger":
-        i = Math.max(0, Math.min(1, t.offset ?? 0));
+        t = Math.max(0, Math.min(1, e.offset ?? 0));
         break;
       default:
-        i = 0;
+        t = 0;
     }
-    return { ...t, normalizedOffset: i };
-  }), { schedule: u, ...a } = n;
+    return { ...e, normalizedOffset: t };
+  }), { schedule: u, ...r } = n;
   return {
-    ...a,
+    ...r,
     springs: s
   };
 }
 export {
   o as isCssAnimation,
-  e as isMultiSpring,
+  a as isMultiSpring,
   f as isSingleSpring,
   c as isTickAnimation,
   h as normalizeMultiSpringSchedule,

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@ssgoi/core"),i=require("./core/dist/types.cjs"),e=require("./react/src/lib/ssgoi.cjs"),t=require("./react/src/lib/ssgoi-transition.cjs");Object.defineProperty(exports,"transition",{enumerable:!0,get:()=>n.transition});exports.isCssAnimation=i.isCssAnimation;exports.isMultiSpring=i.isMultiSpring;exports.isSingleSpring=i.isSingleSpring;exports.isTickAnimation=i.isTickAnimation;exports.normalizeMultiSpringSchedule=i.normalizeMultiSpringSchedule;exports.normalizeToMultiSpring=i.normalizeToMultiSpring;exports.validateAnimationMode=i.validateAnimationMode;exports.validateSpringItem=i.validateSpringItem;exports.Ssgoi=e.Ssgoi;exports.SsgoiTransition=t.SsgoiTransition;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@ssgoi/core"),i=require("./core/dist/types.cjs"),e=require("./react/src/lib/ssgoi.cjs"),t=require("./react/src/lib/ssgoi-transition.cjs"),o=require("./react/src/lib/transition-scope.cjs");Object.defineProperty(exports,"transition",{enumerable:!0,get:()=>n.transition});exports.isCssAnimation=i.isCssAnimation;exports.isMultiSpring=i.isMultiSpring;exports.isSingleSpring=i.isSingleSpring;exports.isTickAnimation=i.isTickAnimation;exports.normalizeMultiSpringSchedule=i.normalizeMultiSpringSchedule;exports.normalizeToMultiSpring=i.normalizeToMultiSpring;exports.validateAnimationMode=i.validateAnimationMode;exports.validateSpringItem=i.validateSpringItem;exports.Ssgoi=e.Ssgoi;exports.SsgoiTransition=t.SsgoiTransition;exports.TransitionScope=o.TransitionScope;

package/dist/index.d.ts

@@ -2,3 +2,4 @@ export { transition } from './transition';
 export * from './types';
 export { Ssgoi } from './ssgoi';
 export { SsgoiTransition } from './ssgoi-transition';
+export { TransitionScope } from './transition-scope';

package/dist/index.js

@@ -1,17 +1,19 @@
 import { transition as n } from "@ssgoi/core";
-import { isCssAnimation as t, isMultiSpring as e, isSingleSpring as a, isTickAnimation as m, normalizeMultiSpringSchedule as s, normalizeToMultiSpring as l, validateAnimationMode as p, validateSpringItem as S } from "./core/dist/types.js";
-import { Ssgoi as d } from "./react/src/lib/ssgoi.js";
-import { SsgoiTransition as u } from "./react/src/lib/ssgoi-transition.js";
+import { isCssAnimation as t, isMultiSpring as e, isSingleSpring as a, isTickAnimation as m, normalizeMultiSpringSchedule as p, normalizeToMultiSpring as s, validateAnimationMode as S, validateSpringItem as l } from "./core/dist/types.js";
+import { Ssgoi as f } from "./react/src/lib/ssgoi.js";
+import { SsgoiTransition as d } from "./react/src/lib/ssgoi-transition.js";
+import { TransitionScope as M } from "./react/src/lib/transition-scope.js";
 export {
-  d as Ssgoi,
-  u as SsgoiTransition,
+  f as Ssgoi,
+  d as SsgoiTransition,
+  M as TransitionScope,
   t as isCssAnimation,
   e as isMultiSpring,
   a as isSingleSpring,
   m as isTickAnimation,
-  s as normalizeMultiSpringSchedule,
-  l as normalizeToMultiSpring,
+  p as normalizeMultiSpringSchedule,
+  s as normalizeToMultiSpring,
   n as transition,
-  p as validateAnimationMode,
-  S as validateSpringItem
+  S as validateAnimationMode,
+  l as validateSpringItem
 };

package/dist/react/src/lib/transition-scope.cjs

@@ -0,0 +1,2 @@
+"use client";
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("@ssgoi/core");function r({children:e}){return t.jsx("div",{ref:n.createTransitionScope(),style:{display:"contents"},children:e})}exports.TransitionScope=r;

package/dist/react/src/lib/transition-scope.js

@@ -0,0 +1,9 @@
+"use client";
+import { jsx as r } from "react/jsx-runtime";
+import { createTransitionScope as t } from "@ssgoi/core";
+function n({ children: o }) {
+  return /* @__PURE__ */ r("div", { ref: t(), style: { display: "contents" }, children: o });
+}
+export {
+  n as TransitionScope
+};

package/dist/transition-scope.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+type TransitionScopeProps = {
+    children: ReactNode;
+};
+/**
+ * TransitionScope creates a boundary for local-scoped transitions.
+ *
+ * Child elements with `scope: 'local'` will:
+ * - Skip IN animation when mounted simultaneously with the scope
+ * - Skip OUT animation when unmounted simultaneously with the scope
+ *
+ * This is useful for:
+ * - Page transitions where child elements shouldn't animate individually
+ * - Modal/dialog content that appears/disappears with the container
+ * - List items that shouldn't animate when the entire list mounts/unmounts
+ *
+ * @example
+ * ```tsx
+ * <TransitionScope>
+ *   <div ref={transition(fadeIn(), { scope: 'local' })}>
+ *     This will only animate when added/removed independently,
+ *     not when the entire scope mounts/unmounts.
+ *   </div>
+ * </TransitionScope>
+ * ```
+ */
+export declare function TransitionScope({ children }: TransitionScopeProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ssgoi/react",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "description": "React bindings for SSGOI - Native app-like page transitions for React applications",
   "private": false,
   "type": "module",
@@ -45,7 +45,7 @@
     }
   },
   "dependencies": {
-    "@ssgoi/core": "^3.0.0"
+    "@ssgoi/core": "^3.1.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",