@ssgoi/core 5.2.1 → 6.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (240) hide show
  1. package/dist/animation/animation.d.ts +50 -0
  2. package/dist/animation/animation.d.ts.map +1 -0
  3. package/dist/animation/host-animation.d.ts +43 -0
  4. package/dist/animation/host-animation.d.ts.map +1 -0
  5. package/dist/animation/index.d.ts +6 -0
  6. package/dist/animation/index.d.ts.map +1 -0
  7. package/dist/animation/integrator/double-spring-integrator.d.ts.map +1 -0
  8. package/dist/{animator → animation}/integrator/index.d.ts +1 -0
  9. package/dist/animation/integrator/index.d.ts.map +1 -0
  10. package/dist/animation/integrator/inertia-integrator.d.ts.map +1 -0
  11. package/dist/animation/integrator/linear-integrator.d.ts +23 -0
  12. package/dist/animation/integrator/linear-integrator.d.ts.map +1 -0
  13. package/dist/{animator → animation}/integrator/provider.d.ts +1 -1
  14. package/dist/animation/integrator/provider.d.ts.map +1 -0
  15. package/dist/animation/integrator/spring-integrator.d.ts.map +1 -0
  16. package/dist/animation/integrator/types.d.ts.map +1 -0
  17. package/dist/animation/multi-animation.d.ts +39 -0
  18. package/dist/animation/multi-animation.d.ts.map +1 -0
  19. package/dist/animation/web-animation.d.ts +63 -0
  20. package/dist/animation/web-animation.d.ts.map +1 -0
  21. package/dist/index.cjs +35 -1
  22. package/dist/index.d.ts +4 -7
  23. package/dist/index.d.ts.map +1 -1
  24. package/dist/index.js +1271 -1192
  25. package/dist/internal.cjs +1 -0
  26. package/dist/internal.d.ts +4 -0
  27. package/dist/internal.d.ts.map +1 -0
  28. package/dist/internal.js +504 -0
  29. package/dist/multi-animation-B_Hl1HEU.cjs +1 -0
  30. package/dist/multi-animation-CST6aZ8y.js +276 -0
  31. package/dist/ssgoi-transition/create-context-manager.d.ts +1 -1
  32. package/dist/ssgoi-transition/create-context-manager.d.ts.map +1 -1
  33. package/dist/ssgoi-transition/create-ssgoi-transition-context.d.ts +18 -31
  34. package/dist/ssgoi-transition/create-ssgoi-transition-context.d.ts.map +1 -1
  35. package/dist/ssgoi-transition/find-matching-transition.d.ts +4 -4
  36. package/dist/ssgoi-transition/find-matching-transition.d.ts.map +1 -1
  37. package/dist/ssgoi-transition/navigation-detector-strategy.d.ts +5 -15
  38. package/dist/ssgoi-transition/navigation-detector-strategy.d.ts.map +1 -1
  39. package/dist/ssgoi-transition/process-symmetric-transitions.d.ts +2 -2
  40. package/dist/ssgoi-transition/process-symmetric-transitions.d.ts.map +1 -1
  41. package/dist/ssgoi-transition/unmount-observer.d.ts +17 -0
  42. package/dist/ssgoi-transition/unmount-observer.d.ts.map +1 -0
  43. package/dist/transitions/blind/index.d.ts +6 -0
  44. package/dist/transitions/blind/index.d.ts.map +1 -0
  45. package/dist/transitions/blind/transition.d.ts +16 -0
  46. package/dist/transitions/blind/transition.d.ts.map +1 -0
  47. package/dist/transitions/drill/index.d.ts +9 -0
  48. package/dist/transitions/drill/index.d.ts.map +1 -0
  49. package/dist/transitions/drill/provider/crossfade.d.ts +3 -0
  50. package/dist/transitions/drill/provider/crossfade.d.ts.map +1 -0
  51. package/dist/transitions/drill/provider/index.d.ts +3 -0
  52. package/dist/transitions/drill/provider/index.d.ts.map +1 -0
  53. package/dist/transitions/drill/provider/parallax.d.ts +3 -0
  54. package/dist/transitions/drill/provider/parallax.d.ts.map +1 -0
  55. package/dist/transitions/drill/transition.d.ts +5 -0
  56. package/dist/transitions/drill/transition.d.ts.map +1 -0
  57. package/dist/transitions/drill/types.d.ts +23 -0
  58. package/dist/transitions/drill/types.d.ts.map +1 -0
  59. package/dist/transitions/fade/index.d.ts +6 -0
  60. package/dist/transitions/fade/index.d.ts.map +1 -0
  61. package/dist/transitions/fade/transition.d.ts +6 -0
  62. package/dist/transitions/fade/transition.d.ts.map +1 -0
  63. package/dist/transitions/film/index.d.ts +6 -0
  64. package/dist/transitions/film/index.d.ts.map +1 -0
  65. package/dist/transitions/film/transition.d.ts +27 -0
  66. package/dist/transitions/film/transition.d.ts.map +1 -0
  67. package/dist/transitions/hero/index.d.ts +6 -0
  68. package/dist/transitions/hero/index.d.ts.map +1 -0
  69. package/dist/transitions/hero/transition.d.ts +7 -0
  70. package/dist/transitions/hero/transition.d.ts.map +1 -0
  71. package/dist/transitions/index.d.ts +10 -12
  72. package/dist/transitions/index.d.ts.map +1 -1
  73. package/dist/transitions/jaemin/index.d.ts +6 -0
  74. package/dist/transitions/jaemin/index.d.ts.map +1 -0
  75. package/dist/transitions/jaemin/transition.d.ts +18 -0
  76. package/dist/transitions/jaemin/transition.d.ts.map +1 -0
  77. package/dist/transitions/rotate/index.d.ts +6 -0
  78. package/dist/transitions/rotate/index.d.ts.map +1 -0
  79. package/dist/transitions/rotate/transition.d.ts +6 -0
  80. package/dist/transitions/rotate/transition.d.ts.map +1 -0
  81. package/dist/transitions/scroll/index.d.ts +15 -0
  82. package/dist/transitions/scroll/index.d.ts.map +1 -0
  83. package/dist/transitions/scroll/transition.d.ts +7 -0
  84. package/dist/transitions/scroll/transition.d.ts.map +1 -0
  85. package/dist/transitions/sheet/index.d.ts +9 -0
  86. package/dist/transitions/sheet/index.d.ts.map +1 -0
  87. package/dist/transitions/sheet/provider/background-scale.d.ts +3 -0
  88. package/dist/transitions/sheet/provider/background-scale.d.ts.map +1 -0
  89. package/dist/transitions/sheet/provider/index.d.ts +3 -0
  90. package/dist/transitions/sheet/provider/index.d.ts.map +1 -0
  91. package/dist/transitions/sheet/provider/static.d.ts +3 -0
  92. package/dist/transitions/sheet/provider/static.d.ts.map +1 -0
  93. package/dist/transitions/sheet/transition.d.ts +5 -0
  94. package/dist/transitions/sheet/transition.d.ts.map +1 -0
  95. package/dist/transitions/sheet/types.d.ts +19 -0
  96. package/dist/transitions/sheet/types.d.ts.map +1 -0
  97. package/dist/transitions/slide/index.d.ts +6 -0
  98. package/dist/transitions/slide/index.d.ts.map +1 -0
  99. package/dist/transitions/slide/transition.d.ts +7 -0
  100. package/dist/transitions/slide/transition.d.ts.map +1 -0
  101. package/dist/transitions/strip/index.d.ts +6 -0
  102. package/dist/transitions/strip/index.d.ts.map +1 -0
  103. package/dist/transitions/strip/transition.d.ts +6 -0
  104. package/dist/transitions/strip/transition.d.ts.map +1 -0
  105. package/dist/transitions/utils.d.ts +11 -7
  106. package/dist/transitions/utils.d.ts.map +1 -1
  107. package/dist/transitions/zoom/index.d.ts +8 -0
  108. package/dist/transitions/zoom/index.d.ts.map +1 -0
  109. package/dist/transitions/zoom/provider/expand.d.ts +5 -0
  110. package/dist/transitions/zoom/provider/expand.d.ts.map +1 -0
  111. package/dist/transitions/zoom/provider/index.d.ts +3 -0
  112. package/dist/transitions/zoom/provider/index.d.ts.map +1 -0
  113. package/dist/transitions/zoom/provider/static.d.ts +5 -0
  114. package/dist/transitions/zoom/provider/static.d.ts.map +1 -0
  115. package/dist/transitions/zoom/transition.d.ts +5 -0
  116. package/dist/transitions/zoom/transition.d.ts.map +1 -0
  117. package/dist/transitions/zoom/types.d.ts +34 -0
  118. package/dist/transitions/zoom/types.d.ts.map +1 -0
  119. package/dist/transitions/zoom/zoom-element.d.ts +4 -0
  120. package/dist/transitions/zoom/zoom-element.d.ts.map +1 -0
  121. package/dist/types/index.d.ts +175 -0
  122. package/dist/types/index.d.ts.map +1 -0
  123. package/dist/types.cjs +1 -1
  124. package/dist/types.d.ts +2 -504
  125. package/dist/types.js +3 -77
  126. package/dist/utils/get-scrolling-element.d.ts.map +1 -1
  127. package/dist/utils/get-viewport-rect.d.ts +17 -0
  128. package/dist/utils/get-viewport-rect.d.ts.map +1 -0
  129. package/dist/utils/index.d.ts +2 -0
  130. package/dist/utils/index.d.ts.map +1 -1
  131. package/dist/utils/prepare-outgoing.d.ts +2 -2
  132. package/dist/utils/prepare-outgoing.d.ts.map +1 -1
  133. package/dist/utils/promise-all.d.ts +18 -0
  134. package/dist/utils/promise-all.d.ts.map +1 -0
  135. package/package.json +7 -19
  136. package/dist/animator/integrator/double-spring-integrator.d.ts.map +0 -1
  137. package/dist/animator/integrator/index.d.ts.map +0 -1
  138. package/dist/animator/integrator/inertia-integrator.d.ts.map +0 -1
  139. package/dist/animator/integrator/provider.d.ts.map +0 -1
  140. package/dist/animator/integrator/spring-integrator.d.ts.map +0 -1
  141. package/dist/animator/integrator/types.d.ts.map +0 -1
  142. package/dist/animator/multi-animator.d.ts +0 -101
  143. package/dist/animator/multi-animator.d.ts.map +0 -1
  144. package/dist/animator/runner/css-runner.d.ts +0 -17
  145. package/dist/animator/runner/css-runner.d.ts.map +0 -1
  146. package/dist/animator/runner/keyframes-runner.d.ts +0 -14
  147. package/dist/animator/runner/keyframes-runner.d.ts.map +0 -1
  148. package/dist/animator/runner/provider.d.ts +0 -44
  149. package/dist/animator/runner/provider.d.ts.map +0 -1
  150. package/dist/animator/runner/tick-runner.d.ts +0 -16
  151. package/dist/animator/runner/tick-runner.d.ts.map +0 -1
  152. package/dist/animator/runner/ticker.d.ts +0 -38
  153. package/dist/animator/runner/ticker.d.ts.map +0 -1
  154. package/dist/animator/runner/types.d.ts +0 -34
  155. package/dist/animator/runner/types.d.ts.map +0 -1
  156. package/dist/animator/single-animator.d.ts +0 -65
  157. package/dist/animator/single-animator.d.ts.map +0 -1
  158. package/dist/animator/types.d.ts +0 -57
  159. package/dist/animator/types.d.ts.map +0 -1
  160. package/dist/presets/index.cjs +0 -1
  161. package/dist/presets/index.d.ts +0 -22
  162. package/dist/presets/index.d.ts.map +0 -1
  163. package/dist/presets/index.js +0 -50
  164. package/dist/provider-B2B8CK6H.js +0 -142
  165. package/dist/provider-BKaONTeg.cjs +0 -1
  166. package/dist/spring-integrator-95Mh7mdw.cjs +0 -1
  167. package/dist/spring-integrator-BM4a-82c.js +0 -33
  168. package/dist/transition/create-transition-callback.d.ts +0 -8
  169. package/dist/transition/create-transition-callback.d.ts.map +0 -1
  170. package/dist/transition/transition-scope.d.ts +0 -36
  171. package/dist/transition/transition-scope.d.ts.map +0 -1
  172. package/dist/transition/transition-strategy.d.ts +0 -75
  173. package/dist/transition/transition-strategy.d.ts.map +0 -1
  174. package/dist/transition/transition.d.ts +0 -51
  175. package/dist/transition/transition.d.ts.map +0 -1
  176. package/dist/transition/unmount-observer.d.ts +0 -43
  177. package/dist/transition/unmount-observer.d.ts.map +0 -1
  178. package/dist/transitions/blur.d.ts +0 -12
  179. package/dist/transitions/blur.d.ts.map +0 -1
  180. package/dist/transitions/bounce.d.ts +0 -13
  181. package/dist/transitions/bounce.d.ts.map +0 -1
  182. package/dist/transitions/fade.d.ts +0 -10
  183. package/dist/transitions/fade.d.ts.map +0 -1
  184. package/dist/transitions/fly.d.ts +0 -11
  185. package/dist/transitions/fly.d.ts.map +0 -1
  186. package/dist/transitions/index.cjs +0 -1
  187. package/dist/transitions/index.js +0 -285
  188. package/dist/transitions/mask.d.ts +0 -12
  189. package/dist/transitions/mask.d.ts.map +0 -1
  190. package/dist/transitions/none.d.ts +0 -8
  191. package/dist/transitions/none.d.ts.map +0 -1
  192. package/dist/transitions/rotate.d.ts +0 -15
  193. package/dist/transitions/rotate.d.ts.map +0 -1
  194. package/dist/transitions/scale.d.ts +0 -11
  195. package/dist/transitions/scale.d.ts.map +0 -1
  196. package/dist/transitions/slide.d.ts +0 -13
  197. package/dist/transitions/slide.d.ts.map +0 -1
  198. package/dist/types.d.ts.map +0 -1
  199. package/dist/view-transitions/blind.d.ts +0 -11
  200. package/dist/view-transitions/blind.d.ts.map +0 -1
  201. package/dist/view-transitions/curtain-reveal.d.ts +0 -18
  202. package/dist/view-transitions/curtain-reveal.d.ts.map +0 -1
  203. package/dist/view-transitions/depth.d.ts +0 -21
  204. package/dist/view-transitions/depth.d.ts.map +0 -1
  205. package/dist/view-transitions/drill.d.ts +0 -9
  206. package/dist/view-transitions/drill.d.ts.map +0 -1
  207. package/dist/view-transitions/fade.d.ts +0 -8
  208. package/dist/view-transitions/fade.d.ts.map +0 -1
  209. package/dist/view-transitions/film.d.ts +0 -10
  210. package/dist/view-transitions/film.d.ts.map +0 -1
  211. package/dist/view-transitions/hero.d.ts +0 -9
  212. package/dist/view-transitions/hero.d.ts.map +0 -1
  213. package/dist/view-transitions/index.cjs +0 -35
  214. package/dist/view-transitions/index.d.ts +0 -18
  215. package/dist/view-transitions/index.d.ts.map +0 -1
  216. package/dist/view-transitions/index.js +0 -1614
  217. package/dist/view-transitions/instagram.d.ts +0 -8
  218. package/dist/view-transitions/instagram.d.ts.map +0 -1
  219. package/dist/view-transitions/jaemin.d.ts +0 -21
  220. package/dist/view-transitions/jaemin.d.ts.map +0 -1
  221. package/dist/view-transitions/pinterest.d.ts +0 -8
  222. package/dist/view-transitions/pinterest.d.ts.map +0 -1
  223. package/dist/view-transitions/rotate.d.ts +0 -6
  224. package/dist/view-transitions/rotate.d.ts.map +0 -1
  225. package/dist/view-transitions/scroll.d.ts +0 -8
  226. package/dist/view-transitions/scroll.d.ts.map +0 -1
  227. package/dist/view-transitions/sheet.d.ts +0 -21
  228. package/dist/view-transitions/sheet.d.ts.map +0 -1
  229. package/dist/view-transitions/slide.d.ts +0 -8
  230. package/dist/view-transitions/slide.d.ts.map +0 -1
  231. package/dist/view-transitions/snap.d.ts +0 -16
  232. package/dist/view-transitions/snap.d.ts.map +0 -1
  233. package/dist/view-transitions/strip.d.ts +0 -7
  234. package/dist/view-transitions/strip.d.ts.map +0 -1
  235. package/dist/view-transitions/swap.d.ts +0 -15
  236. package/dist/view-transitions/swap.d.ts.map +0 -1
  237. /package/dist/{animator → animation}/integrator/double-spring-integrator.d.ts +0 -0
  238. /package/dist/{animator → animation}/integrator/inertia-integrator.d.ts +0 -0
  239. /package/dist/{animator → animation}/integrator/spring-integrator.d.ts +0 -0
  240. /package/dist/{animator → animation}/integrator/types.d.ts +0 -0
package/dist/types.d.ts CHANGED
@@ -1,504 +1,2 @@
1
- import { Integrator } from './animator/integrator';
2
- export type TransitionKey = string | symbol;
3
- /**
4
- * Double spring follower configuration
5
- * Allows customizing the follower spring independently
6
- */
7
- export type DoubleSpringFollowerConfig = {
8
- stiffness: number;
9
- damping: number;
10
- };
11
- export type SpringConfig = {
12
- stiffness: number;
13
- damping: number;
14
- /**
15
- * Enable double spring for ease-in-out effect (Chained/Lagged Spring)
16
- *
17
- * - true: same stiffness for both springs
18
- * - number (0-1): follower stiffness ratio (smaller = stronger ease-in)
19
- * - 1.0: same as true
20
- * - 0.5: follower has half stiffness → stronger ease-in
21
- * - 0.3: even stronger ease-in
22
- * - { stiffness, damping }: custom follower spring config
23
- *
24
- * Creates a two-spring system:
25
- * - Leader spring: tracks the target directly
26
- * - Follower spring: tracks the leader's position (this is the output)
27
- */
28
- doubleSpring?: boolean | number | DoubleSpringFollowerConfig;
29
- /**
30
- * Position threshold for settling detection
31
- * When distance to target is below this, position is considered settled
32
- * @default 0.01
33
- */
34
- restDelta?: number;
35
- /**
36
- * Velocity threshold for settling detection
37
- * When speed is below this, velocity is considered settled
38
- * @default 0.01
39
- */
40
- restSpeed?: number;
41
- };
42
- /**
43
- * Resistance type for inertia physics
44
- * - linear: resistance proportional to velocity (F = -r * v)
45
- * - quadratic: resistance proportional to velocity squared (F = -r * v²)
46
- */
47
- export type ResistanceType = "linear" | "quadratic";
48
- /**
49
- * Inertia configuration for ease-in effect
50
- * Simulates acceleration with resistance
51
- */
52
- export type InertiaConfig = {
53
- /** Acceleration force (higher = faster acceleration) */
54
- acceleration: number;
55
- /** Resistance coefficient (higher = more resistance) */
56
- resistance: number;
57
- /** Resistance type (default: 'quadratic') */
58
- resistanceType?: ResistanceType;
59
- /**
60
- * Minimum boundary value
61
- * When position goes below this, spring bounce is applied
62
- */
63
- min?: number;
64
- /**
65
- * Maximum boundary value
66
- * When position goes above this, spring bounce is applied
67
- */
68
- max?: number;
69
- /**
70
- * Spring stiffness for boundary bounce effect
71
- * Higher value = stiffer bounce
72
- * @default 500
73
- */
74
- bounceStiffness?: number;
75
- /**
76
- * Spring damping for boundary bounce effect
77
- * Higher value = faster settling
78
- * @default 10
79
- */
80
- bounceDamping?: number;
81
- /**
82
- * Position threshold for settling detection
83
- * When distance to target is below this, position is considered settled
84
- * @default 0.01
85
- */
86
- restDelta?: number;
87
- };
88
- /**
89
- * Custom integrator factory function
90
- * Allows using custom physics implementations
91
- */
92
- export type IntegratorFactory = () => Integrator;
93
- /**
94
- * Physics options for animations
95
- * Use with & to add physics options to any config type
96
- *
97
- * @example
98
- * type FadeOptions = { from?: number; to?: number } & PhysicsOptions;
99
- */
100
- export type PhysicsOptions = {
101
- /** Spring physics (ease-out) */
102
- spring?: SpringConfig;
103
- /** Inertia physics (ease-in) */
104
- inertia?: InertiaConfig;
105
- /** Custom integrator factory */
106
- integrator?: IntegratorFactory;
107
- };
108
- /**
109
- * CSS style object type
110
- */
111
- export type StyleObject = Record<string, number | string>;
112
- /**
113
- * Schedule strategy for multi-spring animations (user-facing)
114
- * - parallel: All springs start immediately (offset = 0)
115
- * - sequential: Each spring waits for previous to complete (offset = 1)
116
- * - stagger: Springs start at custom progress offsets (0-1)
117
- */
118
- export type ScheduleType = "parallel" | "sequential" | "stagger";
119
- /**
120
- * Base configuration shared by both single and multi-spring transitions
121
- */
122
- export type BaseTransitionConfig = {
123
- prepare?: () => void;
124
- wait?: () => Promise<void>;
125
- onReady?: () => void;
126
- onStart?: () => void;
127
- onEnd?: () => void;
128
- };
129
- /**
130
- * Single spring configuration
131
- * Used for simple transitions with a single animation value
132
- *
133
- * Supports two animation modes:
134
- * - tick: RAF-based animation with callback on each frame
135
- * - css: Web Animation API with CSS string generation
136
- */
137
- export type SingleSpringConfig = BaseTransitionConfig & {
138
- /**
139
- * Physics configuration for animation
140
- * Choose one: spring (ease-out), inertia (ease-in), or custom integrator
141
- */
142
- physics?: PhysicsOptions;
143
- tick?: (progress: number) => void;
144
- /**
145
- * Style generator for Web Animation API mode
146
- *
147
- * When provided, the animation uses Web Animation API instead of RAF.
148
- * Spring physics are pre-computed and converted to keyframes.
149
- *
150
- * @param progress - Current progress value (0 to 1)
151
- * @returns Style object for Web Animation API
152
- *
153
- * @example
154
- * ```ts
155
- * css: (progress) => ({
156
- * opacity: progress,
157
- * transform: `translateY(${(1 - progress) * 20}px)`,
158
- * })
159
- * ```
160
- */
161
- css?: (progress: number) => StyleObject;
162
- };
163
- /**
164
- * Common fields shared by every AnimationItem variant
165
- */
166
- type AnimationItemBase = {
167
- onStart?: () => void;
168
- onComplete?: () => void;
169
- /**
170
- * Progress offset (0-1) before this spring starts
171
- * - 0: Start immediately (parallel behavior)
172
- * - 1: Start after previous spring completes (sequential behavior)
173
- * - 0.5: Start when previous spring is 50% complete
174
- *
175
- * Only applies to 'stagger' schedule mode.
176
- * For 'parallel' mode, all springs start at 0.
177
- * For 'sequential' mode, all springs use offset 1.
178
- */
179
- offset?: number;
180
- };
181
- /**
182
- * Spring-driven animation item — physics drives a tick or css generator
183
- */
184
- export type SpringAnimationItem = AnimationItemBase & {
185
- /**
186
- * Physics configuration for animation
187
- * Choose one: spring (ease-out), inertia (ease-in), or custom integrator
188
- */
189
- physics?: PhysicsOptions;
190
- /**
191
- * Frame callback - called on each animation frame with progress value (RAF-based)
192
- *
193
- * **Performance Warning:** Use WRITE-ONLY operations for best performance.
194
- * Avoid reading layout properties inside tick to prevent layout thrashing.
195
- *
196
- * @example
197
- * tick: (progress) => {
198
- * element.style.opacity = String(progress)
199
- * }
200
- */
201
- tick?: (progress: number) => void;
202
- /**
203
- * Style generator for Web Animation API mode
204
- *
205
- * When provided, the animation uses Web Animation API instead of RAF.
206
- * Spring physics are pre-computed and converted to keyframes.
207
- *
208
- * Two forms supported:
209
- * 1. Function only - uses parent element: `css: (progress) => ({ ... })`
210
- * 2. Object with element - specifies target element: `css: { element, style: (progress) => ({ ... }) }`
211
- *
212
- * @param progress - Current progress value (0 to 1)
213
- * @returns Style object for Web Animation API
214
- */
215
- css?: ((progress: number) => StyleObject) | {
216
- element: HTMLElement;
217
- style: (progress: number) => StyleObject;
218
- };
219
- /** keyframes mode is mutually exclusive with physics/tick/css */
220
- keyframes?: never;
221
- };
222
- /**
223
- * Pre-baked keyframes animation item — bypasses physics simulation
224
- *
225
- * Plays a pre-built `Keyframe[]` directly via Web Animation API. Use this when
226
- * you've already composed the desired motion as keyframes (e.g. multiple springs
227
- * baked into a single timeline) and want the animation to run entirely on the
228
- * compositor with zero per-frame JS.
229
- */
230
- export type KeyframesAnimationItem = AnimationItemBase & {
231
- keyframes: {
232
- /** Element to animate */
233
- element: HTMLElement;
234
- /** WAAPI keyframe array (offsets 0..1) */
235
- frames: Keyframe[];
236
- /** Total animation duration in ms */
237
- duration: number;
238
- /** WAAPI easing string (default: "linear") */
239
- easing?: string;
240
- };
241
- /** physics/tick/css are not used in keyframes mode */
242
- physics?: never;
243
- tick?: never;
244
- css?: never;
245
- };
246
- /**
247
- * Individual animation item in a multi-animation config
248
- *
249
- * Three mutually-exclusive modes:
250
- * - tick: RAF-based animation with callback on each frame
251
- * - css: Web Animation API, generated from spring physics
252
- * - keyframes: Web Animation API, played from pre-baked Keyframe[]
253
- */
254
- export type AnimationItem = SpringAnimationItem | KeyframesAnimationItem;
255
- /**
256
- * Multi-animation configuration
257
- * Used for complex transitions with multiple coordinated animations
258
- */
259
- export type MultiAnimationConfig = BaseTransitionConfig & {
260
- items: AnimationItem[];
261
- schedule?: ScheduleType;
262
- onProgress?: (completed: number, total: number) => void;
263
- };
264
- /**
265
- * Transition configuration - supports both single and multi animations
266
- * Uses Union Type for type safety and backward compatibility
267
- */
268
- export type TransitionConfig = SingleSpringConfig | MultiAnimationConfig;
269
- /**
270
- * Type guard to check if config is single animation
271
- */
272
- export declare function isSingleAnimation(config: TransitionConfig): config is SingleSpringConfig;
273
- /**
274
- * Type guard to check if config is multi-animation
275
- */
276
- export declare function isMultiAnimation(config: TransitionConfig): config is MultiAnimationConfig;
277
- /**
278
- * Type guard to check if config uses CSS mode (Web Animation API)
279
- */
280
- export declare function isCssAnimation(config: SingleSpringConfig): config is SingleSpringConfig & {
281
- css: (progress: number) => string;
282
- };
283
- /**
284
- * Type guard to check if config uses tick mode (RAF-based)
285
- */
286
- export declare function isTickAnimation(config: SingleSpringConfig): config is SingleSpringConfig & {
287
- tick: (progress: number) => void;
288
- };
289
- /**
290
- * Type guard to check if an AnimationItem uses pre-baked keyframes mode
291
- */
292
- export declare function isKeyframesAnimation(item: AnimationItem): item is KeyframesAnimationItem;
293
- /**
294
- * Normalize TransitionConfig to MultiAnimationConfig
295
- * Converts SingleSpringConfig to MultiAnimationConfig with single animation item
296
- * Accepts both sync config and Promise<TransitionConfig>
297
- * @internal
298
- */
299
- export declare function normalizeToMultiAnimation(config: TransitionConfig | Promise<TransitionConfig>): Promise<MultiAnimationConfig>;
300
- export type GetTransitionConfig<TContext = undefined> = TContext extends undefined ? (node: HTMLElement) => TransitionConfig | Promise<TransitionConfig> : (node: HTMLElement, context: TContext) => TransitionConfig | Promise<TransitionConfig>;
301
- export type Transition<TContext = undefined> = {
302
- in?: GetTransitionConfig<TContext>;
303
- out?: GetTransitionConfig<TContext>;
304
- key?: TransitionKey;
305
- };
306
- /**
307
- * Scope behavior for transitions
308
- * - 'global': Always run animations (default)
309
- * - 'local': Skip animations when mounting/unmounting with parent TransitionScope
310
- */
311
- export type TransitionScope = "global" | "local";
312
- export type TransitionOptions<TContext = undefined> = Transition<TContext> & {
313
- key: TransitionKey;
314
- /**
315
- * Controls animation behavior relative to TransitionScope
316
- * - 'global' (default): Always run IN/OUT animations
317
- * - 'local': Skip animations when mounting/unmounting simultaneously with scope
318
- */
319
- scope?: TransitionScope;
320
- };
321
- export type TransitionCallback = (element: HTMLElement | null) => void | (() => void);
322
- /**
323
- * Ref callback type for 'auto' mode
324
- * Handles null and manages unmount automatically via MutationObserver
325
- */
326
- export type RefCallback = (element: HTMLElement | null) => void;
327
- /**
328
- * Transition mode
329
- * - 'manual': Returns TransitionCallback with cleanup function (default)
330
- * - 'auto': Returns RefCallback with automatic unmount detection via MutationObserver
331
- */
332
- export type TransitionMode = "manual" | "auto";
333
- /**
334
- * Context object passed to view transitions
335
- * Provides essential information for smooth page transitions
336
- */
337
- export type SggoiTransitionContext = {
338
- /**
339
- * The scroll position difference between 'from' and 'to' pages
340
- * Used in hero and pinterest transitions to maintain natural scroll position
341
- * when transitioning between pages with different scroll states
342
- */
343
- scrollOffset: {
344
- x: number;
345
- y: number;
346
- };
347
- /**
348
- * The current page's scroll position
349
- * Provides the actual scroll coordinates for precise viewport calculations
350
- * OUT transition receives 'from' page scroll, IN transition receives 'to' page scroll
351
- */
352
- scroll: {
353
- x: number;
354
- y: number;
355
- };
356
- /**
357
- * The scrollable container element (document.documentElement or custom container)
358
- * Provides viewport dimensions for calculating transition animations
359
- * Lazy-evaluated to handle delayed initialization
360
- */
361
- scrollingElement: HTMLElement;
362
- /**
363
- * The positioned parent element (containing block for absolute positioning)
364
- * Returns the nearest ancestor with position: relative/absolute/fixed/sticky
365
- * Falls back to document.body if no positioned ancestor exists
366
- * Lazy-evaluated to handle delayed initialization
367
- */
368
- positionedParent: HTMLElement;
369
- };
370
- export type SggoiTransition = Transition<SggoiTransitionContext>;
371
- export type SsgoiConfig = {
372
- transitions?: {
373
- from: string;
374
- to: string;
375
- transition: SggoiTransition;
376
- symmetric?: boolean;
377
- }[];
378
- defaultTransition?: SggoiTransition;
379
- middleware?: (from: string, to: string) => {
380
- from: string;
381
- to: string;
382
- };
383
- /**
384
- * Automatically preserve and restore scroll position when navigating between pages.
385
- *
386
- * - `false`: scroll positions are tracked only for the OUT transition diff,
387
- * then evicted — SSGOI does not restore scroll on arrival.
388
- * - `true`: save scroll on leave, restore on return. New (unvisited) paths scroll to 0.
389
- * - `{ exclude: string[] }`: preserve everywhere except matching paths. Excluded paths
390
- * behave like `false` (evict, no restore). Supports wildcards: `/post/*`, `*`.
391
- * - `(isMobile) => value`: function returning any of the above; evaluated on each
392
- * navigation so the answer can vary by environment (e.g. mobile vs. desktop).
393
- *
394
- * @default (isMobile) => isMobile // mobile preserves, desktop does not
395
- */
396
- preserveScroll?: PreserveScrollOption;
397
- };
398
- export type PreserveScrollValue = boolean | {
399
- exclude: string[];
400
- };
401
- export type PreserveScrollFn = (isMobile: boolean) => PreserveScrollValue;
402
- export type PreserveScrollOption = PreserveScrollValue | PreserveScrollFn;
403
- /**
404
- * Internal options for framework adapters
405
- * Not exposed to end users
406
- * @internal
407
- */
408
- export type SsgoiInternalOptions = {
409
- /**
410
- * Whether OUT transition must arrive before IN transition
411
- *
412
- * - true (default): OUT must arrive first, IN completes the pair.
413
- * Best for frameworks with native destroy callbacks (Svelte).
414
- *
415
- * - false: OUT and IN can arrive in any order, both wait indefinitely.
416
- * Best for frameworks using MutationObserver for unmount detection
417
- * (React, Vue, Solid).
418
- *
419
- * @default true
420
- */
421
- outFirst?: boolean;
422
- };
423
- export type SsgoiContext = (path: string) => Transition & {
424
- key: TransitionKey;
425
- };
426
- /**
427
- * Normalized schedule entry for internal processing
428
- * All schedule types are normalized to progress-based offsets (0-1)
429
- *
430
- * Progress offset determines when each spring starts relative to previous spring:
431
- * - 0: Start immediately (parallel)
432
- * - 1: Start after previous completes (sequential)
433
- * - 0.5: Start when previous is 50% complete
434
- *
435
- * @internal
436
- */
437
- export type NormalizedScheduleEntry = {
438
- id: string;
439
- /**
440
- * Progress offset (0-1) relative to previous spring
441
- * - 0: Start immediately with previous spring
442
- * - 1: Start after previous spring completes
443
- * - 0-1: Start when previous spring reaches this progress
444
- */
445
- offset: number;
446
- };
447
- /**
448
- * Normalized animation item for internal use
449
- * - css is always in object form: { element, style } (spring mode)
450
- * - keyframes pass through as-is (already normalized — element required)
451
- * - normalizedOffset is always present
452
- * @internal
453
- */
454
- export type NormalizedAnimationItem = {
455
- onStart?: () => void;
456
- onComplete?: () => void;
457
- normalizedOffset: number;
458
- physics?: PhysicsOptions;
459
- tick?: (progress: number) => void;
460
- css?: {
461
- element: HTMLElement;
462
- style: (progress: number) => StyleObject;
463
- };
464
- keyframes?: {
465
- element: HTMLElement;
466
- frames: Keyframe[];
467
- duration: number;
468
- easing?: string;
469
- };
470
- };
471
- /**
472
- * Normalized multi-animation config for internal use
473
- * Schedule is always normalized to progress-based offsets
474
- * @internal
475
- */
476
- export type NormalizedMultiAnimationConfig = Omit<MultiAnimationConfig, "items" | "schedule"> & {
477
- items: NormalizedAnimationItem[];
478
- };
479
- /**
480
- * Normalize MultiAnimationConfig schedule to progress-based offsets
481
- *
482
- * Converts user-facing schedule types to unified offset values:
483
- * - parallel: All items get offset 0 (start together)
484
- * - sequential: All items get offset 1 (wait for previous)
485
- * - stagger: Use each item's custom offset (0-1)
486
- *
487
- * Also normalizes css to object form: { element, style }
488
- *
489
- * @internal
490
- */
491
- export declare function normalizeSchedule(config: MultiAnimationConfig, element?: HTMLElement): NormalizedMultiAnimationConfig;
492
- /**
493
- * Animation state
494
- * For MultiAnimator: returns first animator's state
495
- * @internal
496
- */
497
- export type AnimationState = {
498
- position: number;
499
- velocity: number;
500
- from: number;
501
- to: number;
502
- };
503
- export {};
504
- //# sourceMappingURL=types.d.ts.map
1
+ export * from './types/index'
2
+ export {}
package/dist/types.js CHANGED
@@ -1,80 +1,6 @@
1
- function h(e) {
2
- return ("tick" in e || "css" in e) && !("items" in e);
3
- }
4
- function d(e) {
5
- return "items" in e;
6
- }
7
- function k(e) {
8
- return "css" in e && typeof e.css == "function";
9
- }
10
- function w(e) {
11
- return "tick" in e && typeof e.tick == "function";
12
- }
13
- function f(e) {
14
- return "keyframes" in e && e.keyframes !== void 0 && e.keyframes !== null;
15
- }
16
- async function A(e) {
17
- const t = await e;
18
- return d(t) ? {
19
- prepare: t.prepare,
20
- wait: t.wait,
21
- onReady: t.onReady,
22
- onStart: t.onStart,
23
- onEnd: t.onEnd,
24
- items: t.items,
25
- schedule: t.schedule
26
- } : {
27
- prepare: t.prepare,
28
- wait: t.wait,
29
- onReady: t.onReady,
30
- onStart: t.onStart,
31
- onEnd: t.onEnd,
32
- items: [
33
- {
34
- physics: t.physics,
35
- tick: t.tick,
36
- css: t.css
37
- }
38
- ],
39
- schedule: "parallel"
40
- };
41
- }
42
- function S(e, t) {
43
- const a = e.schedule ?? "parallel", r = e.items.map(
44
- (i) => {
45
- let n;
46
- switch (a) {
47
- case "parallel":
48
- n = 0;
49
- break;
50
- case "sequential":
51
- n = 1;
52
- break;
53
- case "stagger":
54
- n = Math.max(0, Math.min(1, i.offset ?? 0));
55
- break;
56
- default:
57
- n = 0;
58
- }
59
- if (f(i)) {
60
- const { offset: y, ...u } = i;
61
- return { ...u, normalizedOffset: n };
62
- }
63
- const { css: s, offset: p, ...c } = i, l = s ? typeof s == "function" ? t ? { element: t, style: s } : void 0 : { element: s.element, style: s.style } : void 0;
64
- return { ...c, css: l, normalizedOffset: n };
65
- }
66
- ), { schedule: m, ...o } = e;
67
- return {
68
- ...o,
69
- items: r
70
- };
1
+ function e(n) {
2
+ return n;
71
3
  }
72
4
  export {
73
- k as isCssAnimation,
74
- f as isKeyframesAnimation,
75
- d as isMultiAnimation,
76
- h as isSingleAnimation,
77
- w as isTickAnimation,
78
- S as normalizeSchedule,
79
- A as normalizeToMultiAnimation
5
+ e as defineTransition
80
6
  };
@@ -1 +1 @@
1
- {"version":3,"file":"get-scrolling-element.d.ts","sourceRoot":"","sources":["../../src/lib/utils/get-scrolling-element.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,SAAS,WAAW,KAAG,WAyB1D,CAAC"}
1
+ {"version":3,"file":"get-scrolling-element.d.ts","sourceRoot":"","sources":["../../src/lib/utils/get-scrolling-element.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,SAAS,WAAW,KAAG,WAkB1D,CAAC"}
@@ -0,0 +1,17 @@
1
+ import { SsgoiTransitionContext } from '../types/index.ts';
2
+ /**
3
+ * Viewport-aligned slice of the scrolling container, anchored at the
4
+ * chosen side's scroll position. Used by page transitions
5
+ * (sheet/jaemin/film) to size the visible page area.
6
+ *
7
+ * When scrolling === positioned, no offset is subtracted — that container
8
+ * IS the viewport and its body-relative top is not an inset. Otherwise
9
+ * the positioned parent's offset within scrolling is subtracted.
10
+ */
11
+ export declare function getViewportRect(context: SsgoiTransitionContext, side: "from" | "to"): {
12
+ top: number;
13
+ left: number;
14
+ width: number;
15
+ height: number;
16
+ };
17
+ //# sourceMappingURL=get-viewport-rect.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"get-viewport-rect.d.ts","sourceRoot":"","sources":["../../src/lib/utils/get-viewport-rect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,QAAQ,CAAC;AAGrD;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,EAC/B,IAAI,EAAE,MAAM,GAAG,IAAI;;;;;EAcpB"}
@@ -3,7 +3,9 @@ export { getScrollingElement } from './get-scrolling-element';
3
3
  export { getPositionedParent } from './get-positioned-parent';
4
4
  export { sleep } from './sleep';
5
5
  export { getRect } from './get-rect';
6
+ export { getViewportRect } from './get-viewport-rect';
6
7
  export { round, floor, ceil, toFixed } from './number';
7
8
  export { withResolvers } from './with-resolvers';
8
9
  export { waitPaint } from './wait-paint';
10
+ export { promiseAll, type AwaitedObject } from './promise-all';
9
11
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC"}
@@ -1,7 +1,7 @@
1
- import { SggoiTransitionContext } from '../types';
1
+ import { SsgoiTransitionContext } from '../types/index.ts';
2
2
  /**
3
3
  * Applies common styles for outgoing page elements
4
4
  * Makes the element absolute positioned to allow the incoming page to take its place
5
5
  */
6
- export declare const prepareOutgoing: (element: HTMLElement, context?: SggoiTransitionContext) => void;
6
+ export declare const prepareOutgoing: (element: HTMLElement, context?: Pick<SsgoiTransitionContext, "scrollOffset">) => void;
7
7
  //# sourceMappingURL=prepare-outgoing.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"prepare-outgoing.d.ts","sourceRoot":"","sources":["../../src/lib/utils/prepare-outgoing.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAEvD;;;GAGG;AACH,eAAO,MAAM,eAAe,GAC1B,SAAS,WAAW,EACpB,UAAU,sBAAsB,KAC/B,IAKF,CAAC"}
1
+ {"version":3,"file":"prepare-outgoing.d.ts","sourceRoot":"","sources":["../../src/lib/utils/prepare-outgoing.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,QAAQ,CAAC;AAErD;;;GAGG;AACH,eAAO,MAAM,eAAe,GAC1B,SAAS,WAAW,EACpB,UAAU,IAAI,CAAC,sBAAsB,EAAE,cAAc,CAAC,KACrD,IAKF,CAAC"}
@@ -0,0 +1,18 @@
1
+ /**
2
+ * Resolve every value in an object that may be a Promise. Returns a Promise
3
+ * of the same shape with each value awaited.
4
+ *
5
+ * @example
6
+ * promiseAll({ from: fromPromise, to: toPromise, count: 7 })
7
+ * .then(({ from, to, count }) => …)
8
+ *
9
+ * Useful inside transition presets that need both `from` and `to` resolved
10
+ * before they can compute layout-derived state.
11
+ */
12
+ type Awaited<T> = T extends Promise<infer U> ? U : T;
13
+ export type AwaitedObject<T> = {
14
+ [K in keyof T]: Awaited<T[K]>;
15
+ };
16
+ export declare function promiseAll<T extends Record<string, unknown>>(obj: T): Promise<AwaitedObject<T>>;
17
+ export {};
18
+ //# sourceMappingURL=promise-all.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"promise-all.d.ts","sourceRoot":"","sources":["../../src/lib/utils/promise-all.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,SAAS,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AACrD,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AAEjE,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC1D,GAAG,EAAE,CAAC,GACL,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAS3B"}