react-native-screen-transitions 2.0.4 → 2.1.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 (300) hide show
  1. package/README.md +100 -77
  2. package/lib/commonjs/components/{bounds-activator.js → bound-capture.js} +4 -4
  3. package/lib/commonjs/components/bound-capture.js.map +1 -0
  4. package/lib/commonjs/components/controllers/screen-lifecycle.js +18 -4
  5. package/lib/commonjs/components/controllers/screen-lifecycle.js.map +1 -1
  6. package/lib/commonjs/components/create-transition-aware-component.js +14 -12
  7. package/lib/commonjs/components/create-transition-aware-component.js.map +1 -1
  8. package/lib/commonjs/components/integrations/masked-view.js +52 -0
  9. package/lib/commonjs/components/integrations/masked-view.js.map +1 -0
  10. package/lib/commonjs/components/root-transition-aware.js +6 -15
  11. package/lib/commonjs/components/root-transition-aware.js.map +1 -1
  12. package/lib/commonjs/configs/index.js +15 -5
  13. package/lib/commonjs/configs/index.js.map +1 -1
  14. package/lib/commonjs/configs/presets.js +378 -7
  15. package/lib/commonjs/configs/presets.js.map +1 -1
  16. package/lib/commonjs/configs/specs.js +1 -1
  17. package/lib/commonjs/hooks/animation/use-associated-style.js +7 -10
  18. package/lib/commonjs/hooks/animation/use-associated-style.js.map +1 -1
  19. package/lib/commonjs/hooks/animation/use-screen-animation.js +37 -37
  20. package/lib/commonjs/hooks/animation/use-screen-animation.js.map +1 -1
  21. package/lib/commonjs/hooks/bounds/use-bound-registry.js +73 -0
  22. package/lib/commonjs/hooks/bounds/use-bound-registry.js.map +1 -0
  23. package/lib/commonjs/hooks/gestures/use-build-gestures.js +156 -152
  24. package/lib/commonjs/hooks/gestures/use-build-gestures.js.map +1 -1
  25. package/lib/commonjs/hooks/gestures/use-parent-gesture-registry.js +28 -0
  26. package/lib/commonjs/hooks/gestures/use-parent-gesture-registry.js.map +1 -0
  27. package/lib/commonjs/hooks/gestures/use-scroll-registry.js +146 -0
  28. package/lib/commonjs/hooks/gestures/use-scroll-registry.js.map +1 -0
  29. package/lib/commonjs/index.js +3 -0
  30. package/lib/commonjs/index.js.map +1 -1
  31. package/lib/commonjs/integrations/native-stack/views/NativeStackView.native.js +7 -4
  32. package/lib/commonjs/integrations/native-stack/views/NativeStackView.native.js.map +1 -1
  33. package/lib/commonjs/providers/gestures.js +16 -16
  34. package/lib/commonjs/providers/gestures.js.map +1 -1
  35. package/lib/commonjs/providers/transition-styles.js +44 -0
  36. package/lib/commonjs/providers/transition-styles.js.map +1 -0
  37. package/lib/commonjs/stores/bounds.js +142 -1
  38. package/lib/commonjs/stores/bounds.js.map +1 -1
  39. package/lib/commonjs/stores/utils/reset-stores-for-screen.js +4 -2
  40. package/lib/commonjs/stores/utils/reset-stores-for-screen.js.map +1 -1
  41. package/lib/commonjs/types/gesture.js +11 -0
  42. package/lib/commonjs/types/gesture.js.map +1 -1
  43. package/lib/commonjs/utils/animation/derivations.js +39 -0
  44. package/lib/commonjs/utils/animation/derivations.js.map +1 -0
  45. package/lib/commonjs/utils/animation/run-transition.js +6 -2
  46. package/lib/commonjs/utils/animation/run-transition.js.map +1 -1
  47. package/lib/commonjs/utils/bounds/_utils/flatten-styles.js.map +1 -0
  48. package/lib/commonjs/utils/bounds/_utils/geometry.js +179 -0
  49. package/lib/commonjs/utils/bounds/_utils/geometry.js.map +1 -0
  50. package/lib/commonjs/utils/bounds/{get-bounds.js → _utils/get-bounds.js} +7 -9
  51. package/lib/commonjs/utils/bounds/_utils/get-bounds.js.map +1 -0
  52. package/lib/commonjs/utils/bounds/_utils/is-bounds-equal.js +19 -0
  53. package/lib/commonjs/utils/bounds/_utils/is-bounds-equal.js.map +1 -0
  54. package/lib/commonjs/utils/bounds/_utils/style-composers.js +201 -0
  55. package/lib/commonjs/utils/bounds/_utils/style-composers.js.map +1 -0
  56. package/lib/commonjs/utils/bounds/constants.js +14 -3
  57. package/lib/commonjs/utils/bounds/constants.js.map +1 -1
  58. package/lib/commonjs/utils/bounds/index.js +210 -17
  59. package/lib/commonjs/utils/bounds/index.js.map +1 -1
  60. package/lib/commonjs/utils/gesture/apply-offset-rules.js +233 -0
  61. package/lib/commonjs/utils/gesture/apply-offset-rules.js.map +1 -0
  62. package/lib/commonjs/utils/gesture/check-gesture-activation.js +231 -0
  63. package/lib/commonjs/utils/gesture/check-gesture-activation.js.map +1 -0
  64. package/lib/commonjs/utils/gesture/determine-dismissal.js +98 -0
  65. package/lib/commonjs/utils/gesture/determine-dismissal.js.map +1 -0
  66. package/lib/module/components/{bounds-activator.js → bound-capture.js} +2 -2
  67. package/lib/module/components/bound-capture.js.map +1 -0
  68. package/lib/module/components/controllers/screen-lifecycle.js +18 -4
  69. package/lib/module/components/controllers/screen-lifecycle.js.map +1 -1
  70. package/lib/module/components/create-transition-aware-component.js +14 -12
  71. package/lib/module/components/create-transition-aware-component.js.map +1 -1
  72. package/lib/module/components/integrations/masked-view.js +48 -0
  73. package/lib/module/components/integrations/masked-view.js.map +1 -0
  74. package/lib/module/components/root-transition-aware.js +7 -16
  75. package/lib/module/components/root-transition-aware.js.map +1 -1
  76. package/lib/module/configs/index.js +15 -2
  77. package/lib/module/configs/index.js.map +1 -1
  78. package/lib/module/configs/presets.js +374 -6
  79. package/lib/module/configs/presets.js.map +1 -1
  80. package/lib/module/configs/specs.js +1 -1
  81. package/lib/module/hooks/animation/use-associated-style.js +6 -10
  82. package/lib/module/hooks/animation/use-associated-style.js.map +1 -1
  83. package/lib/module/hooks/animation/use-screen-animation.js +37 -37
  84. package/lib/module/hooks/animation/use-screen-animation.js.map +1 -1
  85. package/lib/module/hooks/bounds/use-bound-registry.js +68 -0
  86. package/lib/module/hooks/bounds/use-bound-registry.js.map +1 -0
  87. package/lib/module/hooks/gestures/use-build-gestures.js +156 -153
  88. package/lib/module/hooks/gestures/use-build-gestures.js.map +1 -1
  89. package/lib/module/hooks/gestures/use-parent-gesture-registry.js +23 -0
  90. package/lib/module/hooks/gestures/use-parent-gesture-registry.js.map +1 -0
  91. package/lib/module/hooks/gestures/use-scroll-registry.js +140 -0
  92. package/lib/module/hooks/gestures/use-scroll-registry.js.map +1 -0
  93. package/lib/module/index.js +2 -0
  94. package/lib/module/index.js.map +1 -1
  95. package/lib/module/integrations/native-stack/views/NativeStackView.native.js +7 -4
  96. package/lib/module/integrations/native-stack/views/NativeStackView.native.js.map +1 -1
  97. package/lib/module/providers/gestures.js +16 -16
  98. package/lib/module/providers/gestures.js.map +1 -1
  99. package/lib/module/providers/transition-styles.js +39 -0
  100. package/lib/module/providers/transition-styles.js.map +1 -0
  101. package/lib/module/stores/bounds.js +142 -1
  102. package/lib/module/stores/bounds.js.map +1 -1
  103. package/lib/module/stores/utils/reset-stores-for-screen.js +4 -2
  104. package/lib/module/stores/utils/reset-stores-for-screen.js.map +1 -1
  105. package/lib/module/types/gesture.js +7 -0
  106. package/lib/module/types/gesture.js.map +1 -1
  107. package/lib/module/utils/animation/derivations.js +34 -0
  108. package/lib/module/utils/animation/derivations.js.map +1 -0
  109. package/lib/module/utils/animation/run-transition.js +6 -2
  110. package/lib/module/utils/animation/run-transition.js.map +1 -1
  111. package/lib/module/utils/bounds/_utils/flatten-styles.js.map +1 -0
  112. package/lib/module/utils/bounds/_utils/geometry.js +174 -0
  113. package/lib/module/utils/bounds/_utils/geometry.js.map +1 -0
  114. package/lib/module/utils/bounds/{get-bounds.js → _utils/get-bounds.js} +7 -9
  115. package/lib/module/utils/bounds/_utils/get-bounds.js.map +1 -0
  116. package/lib/module/utils/bounds/_utils/is-bounds-equal.js +14 -0
  117. package/lib/module/utils/bounds/_utils/is-bounds-equal.js.map +1 -0
  118. package/lib/module/utils/bounds/_utils/style-composers.js +194 -0
  119. package/lib/module/utils/bounds/_utils/style-composers.js.map +1 -0
  120. package/lib/module/utils/bounds/constants.js +14 -3
  121. package/lib/module/utils/bounds/constants.js.map +1 -1
  122. package/lib/module/utils/bounds/index.js +208 -15
  123. package/lib/module/utils/bounds/index.js.map +1 -1
  124. package/lib/module/utils/gesture/apply-offset-rules.js +228 -0
  125. package/lib/module/utils/gesture/apply-offset-rules.js.map +1 -0
  126. package/lib/module/utils/gesture/check-gesture-activation.js +226 -0
  127. package/lib/module/utils/gesture/check-gesture-activation.js.map +1 -0
  128. package/lib/module/utils/gesture/determine-dismissal.js +93 -0
  129. package/lib/module/utils/gesture/determine-dismissal.js.map +1 -0
  130. package/lib/typescript/components/bound-capture.d.ts +8 -0
  131. package/lib/typescript/components/bound-capture.d.ts.map +1 -0
  132. package/lib/typescript/components/controllers/screen-lifecycle.d.ts.map +1 -1
  133. package/lib/typescript/components/create-transition-aware-component.d.ts.map +1 -1
  134. package/lib/typescript/components/integrations/masked-view.d.ts +6 -0
  135. package/lib/typescript/components/integrations/masked-view.d.ts.map +1 -0
  136. package/lib/typescript/components/root-transition-aware.d.ts +3 -3
  137. package/lib/typescript/components/root-transition-aware.d.ts.map +1 -1
  138. package/lib/typescript/configs/index.d.ts +15 -2
  139. package/lib/typescript/configs/index.d.ts.map +1 -1
  140. package/lib/typescript/configs/presets.d.ts +3 -0
  141. package/lib/typescript/configs/presets.d.ts.map +1 -1
  142. package/lib/typescript/hooks/animation/use-associated-style.d.ts +6 -4
  143. package/lib/typescript/hooks/animation/use-associated-style.d.ts.map +1 -1
  144. package/lib/typescript/hooks/animation/use-screen-animation.d.ts.map +1 -1
  145. package/lib/typescript/hooks/bounds/{use-bound-measurer.d.ts → use-bound-registry.d.ts} +5 -4
  146. package/lib/typescript/hooks/bounds/{use-bound-measurer.d.ts.map → use-bound-registry.d.ts.map} +1 -1
  147. package/lib/typescript/hooks/gestures/use-build-gestures.d.ts +6 -5
  148. package/lib/typescript/hooks/gestures/use-build-gestures.d.ts.map +1 -1
  149. package/lib/typescript/hooks/gestures/use-parent-gesture-registry.d.ts +6 -0
  150. package/lib/typescript/hooks/gestures/use-parent-gesture-registry.d.ts.map +1 -0
  151. package/lib/typescript/hooks/gestures/{use-scroll-progress.d.ts → use-scroll-registry.d.ts} +2 -2
  152. package/lib/typescript/hooks/gestures/use-scroll-registry.d.ts.map +1 -0
  153. package/lib/typescript/index.d.ts +25 -11
  154. package/lib/typescript/index.d.ts.map +1 -1
  155. package/lib/typescript/integrations/native-stack/views/NativeStackView.native.d.ts.map +1 -1
  156. package/lib/typescript/providers/gestures.d.ts +4 -2
  157. package/lib/typescript/providers/gestures.d.ts.map +1 -1
  158. package/lib/typescript/providers/transition-styles.d.ts +8 -0
  159. package/lib/typescript/providers/transition-styles.d.ts.map +1 -0
  160. package/lib/typescript/stores/bounds.d.ts +11 -0
  161. package/lib/typescript/stores/bounds.d.ts.map +1 -1
  162. package/lib/typescript/stores/utils/reset-stores-for-screen.d.ts +3 -1
  163. package/lib/typescript/stores/utils/reset-stores-for-screen.d.ts.map +1 -1
  164. package/lib/typescript/types/bounds.d.ts +5 -1
  165. package/lib/typescript/types/bounds.d.ts.map +1 -1
  166. package/lib/typescript/types/gesture.d.ts +14 -0
  167. package/lib/typescript/types/gesture.d.ts.map +1 -1
  168. package/lib/typescript/types/navigator.d.ts +5 -1
  169. package/lib/typescript/types/navigator.d.ts.map +1 -1
  170. package/lib/typescript/utils/animation/derivations.d.ts +19 -0
  171. package/lib/typescript/utils/animation/derivations.d.ts.map +1 -0
  172. package/lib/typescript/utils/animation/run-transition.d.ts +2 -1
  173. package/lib/typescript/utils/animation/run-transition.d.ts.map +1 -1
  174. package/lib/typescript/utils/bounds/_types/builder.d.ts +96 -14
  175. package/lib/typescript/utils/bounds/_types/builder.d.ts.map +1 -1
  176. package/lib/typescript/utils/bounds/_types/geometry.d.ts +0 -1
  177. package/lib/typescript/utils/bounds/_types/geometry.d.ts.map +1 -1
  178. package/lib/typescript/utils/bounds/_utils/flatten-styles.d.ts.map +1 -0
  179. package/lib/typescript/utils/bounds/{geometry.d.ts → _utils/geometry.d.ts} +8 -5
  180. package/lib/typescript/utils/bounds/_utils/geometry.d.ts.map +1 -0
  181. package/lib/typescript/utils/bounds/_utils/get-bounds.d.ts +4 -0
  182. package/lib/typescript/utils/bounds/_utils/get-bounds.d.ts.map +1 -0
  183. package/lib/typescript/utils/bounds/_utils/is-bounds-equal.d.ts +7 -0
  184. package/lib/typescript/utils/bounds/_utils/is-bounds-equal.d.ts.map +1 -0
  185. package/lib/typescript/utils/bounds/{style-composers.d.ts → _utils/style-composers.d.ts} +7 -10
  186. package/lib/typescript/utils/bounds/_utils/style-composers.d.ts.map +1 -0
  187. package/lib/typescript/utils/bounds/constants.d.ts +5 -5
  188. package/lib/typescript/utils/bounds/constants.d.ts.map +1 -1
  189. package/lib/typescript/utils/bounds/index.d.ts +2 -4
  190. package/lib/typescript/utils/bounds/index.d.ts.map +1 -1
  191. package/lib/typescript/utils/gesture/apply-offset-rules.d.ts +38 -0
  192. package/lib/typescript/utils/gesture/apply-offset-rules.d.ts.map +1 -0
  193. package/lib/typescript/utils/gesture/check-gesture-activation.d.ts +38 -0
  194. package/lib/typescript/utils/gesture/check-gesture-activation.d.ts.map +1 -0
  195. package/lib/typescript/utils/gesture/determine-dismissal.d.ts +25 -0
  196. package/lib/typescript/utils/gesture/determine-dismissal.d.ts.map +1 -0
  197. package/package.json +2 -3
  198. package/src/__tests__/geometry.test.ts +15 -12
  199. package/src/components/{bounds-activator.tsx → bound-capture.tsx} +1 -1
  200. package/src/components/controllers/screen-lifecycle.tsx +13 -5
  201. package/src/components/create-transition-aware-component.tsx +17 -11
  202. package/src/components/integrations/masked-view.tsx +56 -0
  203. package/src/components/root-transition-aware.tsx +31 -39
  204. package/src/configs/index.ts +26 -2
  205. package/src/configs/presets.ts +401 -6
  206. package/src/configs/specs.ts +1 -1
  207. package/src/hooks/animation/use-associated-style.tsx +12 -11
  208. package/src/hooks/animation/use-screen-animation.tsx +48 -49
  209. package/src/hooks/bounds/{use-bound-measurer.tsx → use-bound-registry.tsx} +32 -20
  210. package/src/hooks/gestures/use-build-gestures.tsx +193 -228
  211. package/src/hooks/gestures/use-parent-gesture-registry.tsx +18 -0
  212. package/src/hooks/gestures/use-scroll-registry.tsx +145 -0
  213. package/src/index.ts +2 -0
  214. package/src/integrations/native-stack/views/NativeStackView.native.tsx +8 -5
  215. package/src/providers/gestures.tsx +19 -22
  216. package/src/providers/transition-styles.tsx +52 -0
  217. package/src/stores/bounds.ts +156 -0
  218. package/src/stores/utils/reset-stores-for-screen.ts +7 -2
  219. package/src/types/bounds.ts +8 -1
  220. package/src/types/gesture.ts +19 -0
  221. package/src/types/navigator.ts +5 -1
  222. package/src/utils/animation/derivations.ts +38 -0
  223. package/src/utils/animation/run-transition.ts +4 -1
  224. package/src/utils/bounds/_types/builder.ts +127 -11
  225. package/src/utils/bounds/_types/geometry.ts +0 -1
  226. package/src/utils/bounds/_utils/geometry.ts +166 -0
  227. package/src/utils/bounds/_utils/get-bounds.ts +54 -0
  228. package/src/utils/bounds/_utils/is-bounds-equal.ts +24 -0
  229. package/src/utils/bounds/_utils/style-composers.ts +216 -0
  230. package/src/utils/bounds/constants.ts +37 -22
  231. package/src/utils/bounds/index.ts +269 -19
  232. package/src/utils/gesture/apply-offset-rules.ts +314 -0
  233. package/src/utils/gesture/check-gesture-activation.ts +310 -0
  234. package/src/utils/gesture/determine-dismissal.ts +131 -0
  235. package/lib/commonjs/components/bounds-activator.js.map +0 -1
  236. package/lib/commonjs/hooks/bounds/use-bound-measurer.js +0 -52
  237. package/lib/commonjs/hooks/bounds/use-bound-measurer.js.map +0 -1
  238. package/lib/commonjs/hooks/gestures/use-scroll-progress.js +0 -57
  239. package/lib/commonjs/hooks/gestures/use-scroll-progress.js.map +0 -1
  240. package/lib/commonjs/utils/bounds/build-bound-styles.js +0 -145
  241. package/lib/commonjs/utils/bounds/build-bound-styles.js.map +0 -1
  242. package/lib/commonjs/utils/bounds/flatten-styles.js.map +0 -1
  243. package/lib/commonjs/utils/bounds/geometry.js +0 -94
  244. package/lib/commonjs/utils/bounds/geometry.js.map +0 -1
  245. package/lib/commonjs/utils/bounds/get-bounds.js.map +0 -1
  246. package/lib/commonjs/utils/bounds/style-composers.js +0 -199
  247. package/lib/commonjs/utils/bounds/style-composers.js.map +0 -1
  248. package/lib/commonjs/utils/gesture/apply-gesture-activation-criteria.js +0 -81
  249. package/lib/commonjs/utils/gesture/apply-gesture-activation-criteria.js.map +0 -1
  250. package/lib/commonjs/utils/gesture/normalize-gesture-translation.js +0 -21
  251. package/lib/commonjs/utils/gesture/normalize-gesture-translation.js.map +0 -1
  252. package/lib/commonjs/utils/index.js +0 -17
  253. package/lib/commonjs/utils/index.js.map +0 -1
  254. package/lib/module/components/bounds-activator.js.map +0 -1
  255. package/lib/module/hooks/bounds/use-bound-measurer.js +0 -47
  256. package/lib/module/hooks/bounds/use-bound-measurer.js.map +0 -1
  257. package/lib/module/hooks/gestures/use-scroll-progress.js +0 -52
  258. package/lib/module/hooks/gestures/use-scroll-progress.js.map +0 -1
  259. package/lib/module/utils/bounds/build-bound-styles.js +0 -141
  260. package/lib/module/utils/bounds/build-bound-styles.js.map +0 -1
  261. package/lib/module/utils/bounds/flatten-styles.js.map +0 -1
  262. package/lib/module/utils/bounds/geometry.js +0 -89
  263. package/lib/module/utils/bounds/geometry.js.map +0 -1
  264. package/lib/module/utils/bounds/get-bounds.js.map +0 -1
  265. package/lib/module/utils/bounds/style-composers.js +0 -191
  266. package/lib/module/utils/bounds/style-composers.js.map +0 -1
  267. package/lib/module/utils/gesture/apply-gesture-activation-criteria.js +0 -76
  268. package/lib/module/utils/gesture/apply-gesture-activation-criteria.js.map +0 -1
  269. package/lib/module/utils/gesture/normalize-gesture-translation.js +0 -16
  270. package/lib/module/utils/gesture/normalize-gesture-translation.js.map +0 -1
  271. package/lib/module/utils/index.js +0 -4
  272. package/lib/module/utils/index.js.map +0 -1
  273. package/lib/typescript/components/bounds-activator.d.ts +0 -8
  274. package/lib/typescript/components/bounds-activator.d.ts.map +0 -1
  275. package/lib/typescript/hooks/gestures/use-scroll-progress.d.ts.map +0 -1
  276. package/lib/typescript/utils/bounds/build-bound-styles.d.ts +0 -4
  277. package/lib/typescript/utils/bounds/build-bound-styles.d.ts.map +0 -1
  278. package/lib/typescript/utils/bounds/flatten-styles.d.ts.map +0 -1
  279. package/lib/typescript/utils/bounds/geometry.d.ts.map +0 -1
  280. package/lib/typescript/utils/bounds/get-bounds.d.ts +0 -4
  281. package/lib/typescript/utils/bounds/get-bounds.d.ts.map +0 -1
  282. package/lib/typescript/utils/bounds/style-composers.d.ts.map +0 -1
  283. package/lib/typescript/utils/gesture/apply-gesture-activation-criteria.d.ts +0 -17
  284. package/lib/typescript/utils/gesture/apply-gesture-activation-criteria.d.ts.map +0 -1
  285. package/lib/typescript/utils/gesture/normalize-gesture-translation.d.ts +0 -6
  286. package/lib/typescript/utils/gesture/normalize-gesture-translation.d.ts.map +0 -1
  287. package/lib/typescript/utils/index.d.ts +0 -2
  288. package/lib/typescript/utils/index.d.ts.map +0 -1
  289. package/src/hooks/gestures/use-scroll-progress.tsx +0 -60
  290. package/src/utils/bounds/build-bound-styles.ts +0 -184
  291. package/src/utils/bounds/geometry.ts +0 -113
  292. package/src/utils/bounds/get-bounds.ts +0 -56
  293. package/src/utils/bounds/style-composers.ts +0 -172
  294. package/src/utils/gesture/apply-gesture-activation-criteria.ts +0 -109
  295. package/src/utils/gesture/normalize-gesture-translation.ts +0 -20
  296. package/src/utils/index.ts +0 -1
  297. /package/lib/commonjs/utils/bounds/{flatten-styles.js → _utils/flatten-styles.js} +0 -0
  298. /package/lib/module/utils/bounds/{flatten-styles.js → _utils/flatten-styles.js} +0 -0
  299. /package/lib/typescript/utils/bounds/{flatten-styles.d.ts → _utils/flatten-styles.d.ts} +0 -0
  300. /package/src/utils/bounds/{flatten-styles.ts → _utils/flatten-styles.ts} +0 -0
package/README.md CHANGED
@@ -1,8 +1,9 @@
1
1
  # react-native-screen-transitions
2
2
 
3
+
3
4
  | iOS | Android |
4
5
  |---|---|
5
- | <video src="https://github.com/user-attachments/assets/81f39391-80c0-4ce4-b6ff-76de85d2cf03" width="300" height="600" controls></video> | <video src="https://github.com/user-attachments/assets/c2b4c6ca-2b0c-4cf4-a164-f7e68cee0c32" width="300" controls></video> |
6
+ | <video src="https://github.com/user-attachments/assets/c0d17b8f-7268-421c-9051-e242f8ddca76" width="300" height="600" controls></video> | <video src="https://github.com/user-attachments/assets/3f8d5fb1-96d2-4fe3-860d-62f6fb5a687e" width="300" controls></video> |
6
7
 
7
8
 
8
9
  **WIP**: This package is a work-in-progress. It provides customizable screen transition animations for React Native apps, primarily designed for use with `expo-router` and `react-navigation`. It supports gestures, predefined presets, and custom animations, making it easy to add polished transitions to your navigation flows.
@@ -84,6 +85,7 @@ All the usual native-stack options are available, plus the following extras:
84
85
  | `gestureVelocityImpact` | `number` | How much the gesture’s velocity affects dismissal. |
85
86
  | `gestureResponseDistance` | `number` | Distance from screen where the gesture is recognized. |
86
87
  | `gestureDrivesProgress` | `boolean` | Whether the gesture directly drives the transition progress. |
88
+ | `gestureActivationArea` | `GestureActivationArea` | Where a gesture may start. `'edge' | 'screen'` or per-side `{ left|right|top|bottom: 'edge'|'screen' }`. |
87
89
 
88
90
  ### Renamed native options (extended stack)
89
91
 
@@ -122,7 +124,43 @@ The incoming screen automatically controls the previous screen.
122
124
  ...Transition.presets.SlideFromBottom(),
123
125
  }}
124
126
  />
125
- </Stack>
127
+ </Stack>
128
+ ```
129
+
130
+ #### Shared element presets (new)
131
+
132
+ Ready-made presets for common shared-element patterns. These leverage the bounds API under the hood. Tag your views with `sharedBoundTag` on both screens.
133
+
134
+ ```tsx
135
+ <Stack.Screen name="feed" />
136
+ <Stack.Screen
137
+ name="post"
138
+ options={{
139
+ ...Transition.presets.SharedIGImage(),
140
+ }}
141
+ />
142
+ ```
143
+
144
+ Other presets: `SharedAppleMusic()`, `SharedXImage()`.
145
+
146
+ Note: Masked container required
147
+
148
+ - For `SharedIGImage` and `SharedAppleMusic`, wrap the next screen with `Transition.MaskedView` as the first element so the preset can animate `_ROOT_CONTAINER` and `_ROOT_MASKED` correctly.
149
+ - Install the mask package:
150
+ - Expo: `npx expo install @react-native-masked-view/masked-view`
151
+ - Bare RN: `npm i @react-native-masked-view/masked-view` (then iOS: `cd ios && pod install`)
152
+ - `Transition.MaskedView` lazy-loads the native mask and falls back to a plain `View` if missing, but the mask is required for the full shared effect.
153
+
154
+ Minimal usage on the destination screen:
155
+
156
+ ```tsx
157
+ export default function PostScreen() {
158
+ return (
159
+ <Transition.MaskedView style={{ flex: 1, backgroundColor: 'white' }}>
160
+ {/* screen content, including the destination bound */}
161
+ </Transition.MaskedView>
162
+ );
163
+ }
126
164
  ```
127
165
 
128
166
  ### Navigator-level custom animations
@@ -136,7 +174,7 @@ Instead of presets, you can define a custom transition directly on the screen’
136
174
  - `next` – state for the next screen (may be `undefined`).
137
175
  - `layouts.screen` – `{ width, height }` of the container.
138
176
  - `insets` – `{ top, right, bottom, left }` safe-area insets.
139
- - `bounds(id)` – helper to compute shared-element transforms (see IntelliSense for chainable methods).
177
+ - `bounds(options)` – compute shared-bound transforms/styles or raw values for a given bound. See "Bounds" below.
140
178
  - `activeBoundId` – id of the active bound.
141
179
  - `focused` – state of the current screen
142
180
 
@@ -213,10 +251,10 @@ const FlatList = Transition.FlatList;
213
251
 
214
252
  // Or wrap any list you like
215
253
  const TransitionFlashList =
216
- Transition.createTransitionAwareScrollable(FlashList, { isScrollable: true });
254
+ Transition.createTransitionAwareComponent(FlashList, { isScrollable: true });
217
255
 
218
256
  const TransitionLegendList =
219
- Transition.createTransitionAwareScrollable(LegendList, { isScrollable: true} );
257
+ Transition.createTransitionAwareComponent(LegendList, { isScrollable: true} );
220
258
  ```
221
259
 
222
260
  Enable the gesture on the screen:
@@ -253,108 +291,94 @@ Gesture rules (handled automatically):
253
291
  These rules apply **only when the screen contains a scrollable**.
254
292
  If no scroll view is present, the gesture can begin from **anywhere on the screen**—not restricted to the edges.
255
293
 
256
- ## Bounds (measure-driven screen transitions)
294
+ ### Gesture activation area
257
295
 
258
- Bounds let you animate **any component** between two screens by measuring its start and end positions.
259
- They are **not shared elements**—they’re just measurements.
260
- Tag the component you want to animate with `sharedBoundTag`, then describe how it should move when the screen transition starts.
261
-
262
- 1. Tag the source component
296
+ Control where gestures can start using `gestureActivationArea` on the screen options:
263
297
 
264
298
  ```tsx
265
- <Transition.View sharedBoundTag="hero" style={{ width: 100, height: 100 }}>
266
- <Image source={uri} style={{ width: '100%', height: '100%' }} resizeMode="cover" />
267
- </Transition.View>
299
+ // Gesture must start from any screen edge (all sides)
300
+ gestureActivationArea: 'edge'
301
+
302
+ // Allow vertical drags anywhere, horizontal drags only from the left edge
303
+ gestureDirection: ['vertical', 'horizontal']
304
+ gestureActivationArea: { top: 'screen', left: 'edge' }
268
305
  ```
269
306
 
270
- 2. Tag the destination component (same id)
307
+ ## Bounds (measure-driven screen transitions)
308
+
309
+ Bounds let you animate any component between two screens by measuring its start and end positions. They are not shared elements — just measurements. Tag components with `sharedBoundTag` on both screens, then compute styles using `bounds(options)`.
310
+
311
+ 1) Tag source and destination
271
312
 
272
313
  ```tsx
273
- <Transition.View sharedBoundTag="hero" style={{ width: 200, height: 200 }}>
274
- <Image source={uri} style={{ width: '100%', height: '100%' }} resizeMode="cover" />
275
- </Transition.View>
314
+ <Transition.View sharedBoundTag="hero" style={{ width: 100, height: 100 }} />
315
+ // ... next screen
316
+ <Transition.View sharedBoundTag="hero" style={{ width: 200, height: 200 }} />
276
317
  ```
277
318
 
278
- 3. Drive the animation in `screenStyleInterpolator`
319
+ 2) Drive the animation with the object API
279
320
 
280
321
  ```tsx
281
- screenStyleInterpolator: ({
282
- activeBoundId,
283
- bounds,
284
- focused,
285
- current,
286
- next,
287
- }) => {
322
+ screenStyleInterpolator: ({ activeBoundId, bounds }) => {
288
323
  "worklet";
289
324
 
290
- const animatedBoundStyles = bounds()
291
- .relative()
292
- .transform()
293
- .build();
325
+ const styles = bounds({
326
+ method: "transform", // "transform" | "size" | "content"
327
+ space: "relative", // "relative" | "absolute"
328
+ scaleMode: "match", // "match" | "none" | "uniform"
329
+ anchor: "center", // see anchors below
330
+ // target: "bound" | "fullscreen" | { x, y, width, height, pageX, pageY }
331
+ // gestures: { x?: number; y?: number }
332
+ });
294
333
 
295
- return {
296
- [activeBoundId]: animatedBoundStyles,
297
- };
298
- };
334
+ return { [activeBoundId]: styles };
335
+ }
299
336
  ```
300
337
 
301
- That’s it—the bounds helper works alongside focused and unfocused screens.
302
- For further customization, separate logic by the `focused` prop:
338
+ 3) Raw values when you need them
303
339
 
304
340
  ```tsx
305
- screenStyleInterpolator: ({
306
- activeBoundId,
307
- bounds,
308
- focused,
309
- current,
310
- next,
311
- }) => {
312
- "worklet";
313
-
341
+ const raw = bounds({ method: "transform", raw: true });
342
+ // { translateX, translateY, scaleX, scaleY }
343
+ ```
314
344
 
315
- if (focused) {
316
- const focusedBoundStyles = bounds()
317
- .relative()
318
- .transform()
319
- .build();
345
+ Or for size/content methods:
320
346
 
321
- return {
322
- [activeBoundId]: focusedBoundStyles,
323
- };
324
- }
347
+ ```tsx
348
+ const toSize = bounds({ method: "size", target: "fullscreen", space: "absolute", raw: true });
349
+ // { width, height, translateX, translateY }
325
350
 
326
- return {}
327
- };
351
+ const content = bounds({ method: "content", raw: true });
352
+ // { translateX, translateY, scale }
328
353
  ```
329
354
 
355
+ Anchors and scale
330
356
 
331
- ### Choosing the right modifier
357
+ - `anchor`: "topLeading" | "top" | "topTrailing" | "leading" | "center" | "trailing" | "bottomLeading" | "bottom" | "bottomTrailing"
358
+ - `scaleMode`: "match" | "none" | "uniform"
332
359
 
333
- | Modifier | When to use |
334
- |---|---|
335
- | `gestures({x,y})` | Sync the bound with live gesture deltas (drag, swipe). |
336
- | `toFullscreen()` | Destination has no `sharedBoundTag`; animate to full-screen size. |
337
- | `absolute()` | Element is not constrained by parent layout (uses pageX/pageY). |
338
- | `relative()` | Element is inside layout constraints (default). |
339
- | `transform()` | Animate with `translateX/Y` + `scaleX/Y` (default). |
340
- | `size()` | Animate `translateX/Y` + `width/height` (no scale). |
341
- | `content()` | Center the container so its bound aligns with the source at progress start. |
342
- | `contentFill()` / `contentFit()` | Control how the content scales inside the container. |
343
- | `build()` | Finalize the animated style object. |
360
+ Targets and space
361
+
362
+ - `target`: "bound" (default), "fullscreen", or explicit `{ x, y, width, height, pageX, pageY }`
363
+ - `space`: "relative" (within layout constraints) or "absolute" (window coordinates)
344
364
 
345
- ### Quick access: `bounds.get()`
365
+ Gestures (sync focused screen deltas)
346
366
 
347
- Need the raw measurements or styles for a specific bound?
348
- Call `bounds.get(boundId, phase)` to retrieve the exact dimensions and style object for any bound tag and screen phase (`current`, `next`, or `previous`).
367
+ - `gestures`: `{ x?: number; y?: number }` adds live drag offsets to the computed transforms
368
+
369
+ Deprecated builder API
370
+
371
+ - The old chainable builder (`bounds().relative().transform().build()`) is deprecated. Migrate to the object form shown above. The builder remains temporarily for backward compatibility.
372
+
373
+ Quick access: `bounds.get()`
374
+
375
+ Use `bounds.get(id?, phase?)` to retrieve raw measurements and the resolved style for any bound in a given phase (`current`, `next`, `previous`).
349
376
 
350
377
  ```tsx
351
- const heroMetrics = bounds.get('hero', 'current');
352
- // heroMetrics = { bounds: { x, y, width, height, pageX, pageY }, styles: { ... } }
378
+ const { bounds: metrics, styles } = bounds.get('hero', 'current');
353
379
  ```
354
380
 
355
- Use this when you want explicit control over which bound’s data you animate, regardless of the current screen focus.
356
-
357
- ### Animating individual components with `styleId`
381
+ ## Animating individual components with `styleId`
358
382
 
359
383
  Use `styleId` to animate a single view inside a screen.
360
384
 
@@ -383,7 +407,6 @@ The red square fades in as the screen opens.
383
407
  ## Known Issues
384
408
 
385
409
  - **Delayed Touch Events** – There’s a noticeable delay in touch events, likely caused by the `beforeRemove` listener in the native stack. If this affects your app, please hold off on using this package until a fix is available.
386
- - **Deeply nested navigators with scrollables** – Behavior is currently unstable. We recommend using programmatic dismissal for deeply nested navigators that contain scrollables, as the gesture-driven dismissal logic needs an overhaul.
387
410
 
388
411
 
389
412
  ## Support and Development
@@ -3,12 +3,12 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.BoundActivator = void 0;
6
+ exports.BoundCapture = void 0;
7
7
  var _react = require("react");
8
8
  var _reactNativeGestureHandler = require("react-native-gesture-handler");
9
9
  var _bounds = require("../stores/bounds");
10
10
  var _jsxRuntime = require("react/jsx-runtime");
11
- const BoundActivator = ({
11
+ const BoundCapture = ({
12
12
  sharedBoundTag,
13
13
  children,
14
14
  measure
@@ -29,5 +29,5 @@ const BoundActivator = ({
29
29
  children: children
30
30
  });
31
31
  };
32
- exports.BoundActivator = BoundActivator;
33
- //# sourceMappingURL=bounds-activator.js.map
32
+ exports.BoundCapture = BoundCapture;
33
+ //# sourceMappingURL=bound-capture.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","_reactNativeGestureHandler","_bounds","_jsxRuntime","BoundCapture","sharedBoundTag","children","measure","tapGesture","useMemo","Gesture","Tap","onStart","Bounds","setActiveBoundId","jsx","GestureDetector","gesture","exports"],"sourceRoot":"../../../src","sources":["components/bound-capture.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,0BAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAA0C,IAAAG,WAAA,GAAAH,OAAA;AAQnC,MAAMI,YAAY,GAAGA,CAAC;EAC5BC,cAAc;EACdC,QAAQ;EACRC;AACoB,CAAC,KAAK;EAC1B,MAAMC,UAAU,GAAG,IAAAC,cAAO,EAAC,MAAM;IAChC,OAAOC,kCAAO,CAACC,GAAG,CAAC,CAAC,CAACC,OAAO,CAAC,MAAM;MAClC,SAAS;;MACT,IAAIP,cAAc,EAAE;QACnBQ,cAAM,CAACC,gBAAgB,CAACT,cAAc,CAAC;QACvCE,OAAO,CAAC,CAAC;MACV;IACD,CAAC,CAAC;EACH,CAAC,EAAE,CAACF,cAAc,EAAEE,OAAO,CAAC,CAAC;EAE7B,IAAI,CAACF,cAAc,EAAE,OAAOC,QAAQ;EAEpC,oBAAO,IAAAH,WAAA,CAAAY,GAAA,EAACd,0BAAA,CAAAe,eAAe;IAACC,OAAO,EAAET,UAAW;IAAAF,QAAA,EAAEA;EAAQ,CAAkB,CAAC;AAC1E,CAAC;AAACY,OAAA,CAAAd,YAAA,GAAAA,YAAA","ignoreList":[]}
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.ScreenLifecycleController = void 0;
7
7
  var _react = require("react");
8
+ var _useParentGestureRegistry = require("../../hooks/gestures/use-parent-gesture-registry");
8
9
  var _useStableCallback = _interopRequireDefault(require("../../hooks/use-stable-callback"));
9
10
  var _keys = require("../../providers/keys");
10
11
  var _animations = require("../../stores/animations");
@@ -25,20 +26,30 @@ const ScreenLifecycleController = ({
25
26
 
26
27
  // Don't run e.preventDefault when the dismissal was on the local root
27
28
  if (requestedDismissOnNavigator) {
28
- (0, _resetStoresForScreen.resetStoresForScreen)(current);
29
+ (0, _resetStoresForScreen.resetStoresForScreen)(current, {
30
+ clearActive: true
31
+ });
29
32
  return;
30
33
  }
31
34
 
32
35
  // Don't run e.preventDefault when this is the first screen of the stack
33
36
  if (current.navigation.getState().index === 0) {
34
- (0, _resetStoresForScreen.resetStoresForScreen)(current);
37
+ (0, _resetStoresForScreen.resetStoresForScreen)(current, {
38
+ clearActive: true
39
+ });
35
40
  return;
36
41
  }
37
42
  e.preventDefault();
38
43
  const onFinish = finished => {
39
44
  if (finished) {
40
- (0, _resetStoresForScreen.resetStoresForScreen)(current);
41
45
  current.navigation.dispatch(e.data.action);
46
+
47
+ // we'll ensure the dispatch is complete before resetting stores
48
+ requestAnimationFrame(() => {
49
+ (0, _resetStoresForScreen.resetStoresForScreen)(current, {
50
+ clearActive: false
51
+ });
52
+ });
42
53
  }
43
54
  };
44
55
  (0, _runTransition.runTransition)({
@@ -55,11 +66,14 @@ const ScreenLifecycleController = ({
55
66
  animations
56
67
  });
57
68
  });
58
- (0, _react.useLayoutEffect)(handleInitialize, []);
59
69
  (0, _react.useEffect)(() => {
60
70
  const unsubscribe = current.navigation.addListener("beforeRemove", handleBeforeRemove);
61
71
  return unsubscribe;
62
72
  }, [current.navigation, handleBeforeRemove]);
73
+ (0, _react.useLayoutEffect)(handleInitialize, []);
74
+
75
+ // important for t.a scrollviews inside nested navigators.
76
+ (0, _useParentGestureRegistry.useParentGestureRegistry)();
63
77
  return children;
64
78
  };
65
79
  exports.ScreenLifecycleController = ScreenLifecycleController;
@@ -1 +1 @@
1
- {"version":3,"names":["_react","require","_useStableCallback","_interopRequireDefault","_keys","_animations","_navigatorDismissState","_resetStoresForScreen","_runTransition","e","__esModule","default","ScreenLifecycleController","children","current","useKeys","animations","Animations","getAll","route","key","handleBeforeRemove","useStableCallback","navigation","getParent","getState","requestedDismissOnNavigator","NavigatorDismissState","get","resetStoresForScreen","index","preventDefault","onFinish","finished","dispatch","data","action","runTransition","target","spec","options","transitionSpec","handleInitialize","useLayoutEffect","useEffect","unsubscribe","addListener","exports"],"sourceRoot":"../../../../src","sources":["components/controllers/screen-lifecycle.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,kBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,WAAA,GAAAJ,OAAA;AACA,IAAAK,sBAAA,GAAAL,OAAA;AACA,IAAAM,qBAAA,GAAAN,OAAA;AACA,IAAAO,cAAA,GAAAP,OAAA;AAAqE,SAAAE,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAM9D,MAAMG,yBAAyB,GAAGA,CAAC;EACzCC;AACqB,CAAC,KAAK;EAC3B,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,aAAO,EAAC,CAAC;EAE7B,MAAMC,UAAU,GAAGC,sBAAU,CAACC,MAAM,CAACJ,OAAO,CAACK,KAAK,CAACC,GAAG,CAAC;EAEvD,MAAMC,kBAAkB,GAAG,IAAAC,0BAAiB,EAAEb,CAAM,IAAK;IACxD,MAAMW,GAAG,GAAGN,OAAO,CAACS,UAAU,CAACC,SAAS,CAAC,CAAC,EAAEC,QAAQ,CAAC,CAAC,CAACL,GAAG;IAC1D,MAAMM,2BAA2B,GAAGC,4CAAqB,CAACC,GAAG,CAACR,GAAG,CAAC;;IAElE;IACA,IAAIM,2BAA2B,EAAE;MAChC,IAAAG,0CAAoB,EAACf,OAAO,CAAC;MAC7B;IACD;;IAEA;IACA,IAAIA,OAAO,CAACS,UAAU,CAACE,QAAQ,CAAC,CAAC,CAACK,KAAK,KAAK,CAAC,EAAE;MAC9C,IAAAD,0CAAoB,EAACf,OAAO,CAAC;MAC7B;IACD;IAEAL,CAAC,CAACsB,cAAc,CAAC,CAAC;IAClB,MAAMC,QAAQ,GAAIC,QAAiB,IAAK;MACvC,IAAIA,QAAQ,EAAE;QACb,IAAAJ,0CAAoB,EAACf,OAAO,CAAC;QAC7BA,OAAO,CAACS,UAAU,CAACW,QAAQ,CAACzB,CAAC,CAAC0B,IAAI,CAACC,MAAM,CAAC;MAC3C;IACD,CAAC;IAED,IAAAC,4BAAa,EAAC;MACbC,MAAM,EAAE,OAAO;MACfC,IAAI,EAAEzB,OAAO,CAAC0B,OAAO,CAACC,cAAc;MACpCT,QAAQ;MACRhB;IACD,CAAC,CAAC;EACH,CAAC,CAAC;EAEF,MAAM0B,gBAAgB,GAAG,IAAApB,0BAAiB,EAAC,MAAM;IAChD,IAAAe,4BAAa,EAAC;MACbC,MAAM,EAAE,MAAM;MACdC,IAAI,EAAEzB,OAAO,CAAC0B,OAAO,CAACC,cAAc;MACpCzB;IACD,CAAC,CAAC;EACH,CAAC,CAAC;EAEF,IAAA2B,sBAAe,EAACD,gBAAgB,EAAE,EAAE,CAAC;EAErC,IAAAE,gBAAS,EAAC,MAAM;IACf,MAAMC,WAAW,GAAG/B,OAAO,CAACS,UAAU,CAACuB,WAAW,CACjD,cAAc,EACdzB,kBACD,CAAC;IAED,OAAOwB,WAAW;EACnB,CAAC,EAAE,CAAC/B,OAAO,CAACS,UAAU,EAAEF,kBAAkB,CAAC,CAAC;EAE5C,OAAOR,QAAQ;AAChB,CAAC;AAACkC,OAAA,CAAAnC,yBAAA,GAAAA,yBAAA","ignoreList":[]}
1
+ {"version":3,"names":["_react","require","_useParentGestureRegistry","_useStableCallback","_interopRequireDefault","_keys","_animations","_navigatorDismissState","_resetStoresForScreen","_runTransition","e","__esModule","default","ScreenLifecycleController","children","current","useKeys","animations","Animations","getAll","route","key","handleBeforeRemove","useStableCallback","navigation","getParent","getState","requestedDismissOnNavigator","NavigatorDismissState","get","resetStoresForScreen","clearActive","index","preventDefault","onFinish","finished","dispatch","data","action","requestAnimationFrame","runTransition","target","spec","options","transitionSpec","handleInitialize","useEffect","unsubscribe","addListener","useLayoutEffect","useParentGestureRegistry","exports"],"sourceRoot":"../../../../src","sources":["components/controllers/screen-lifecycle.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,yBAAA,GAAAD,OAAA;AACA,IAAAE,kBAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AACA,IAAAM,sBAAA,GAAAN,OAAA;AACA,IAAAO,qBAAA,GAAAP,OAAA;AACA,IAAAQ,cAAA,GAAAR,OAAA;AAAqE,SAAAG,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAM9D,MAAMG,yBAAyB,GAAGA,CAAC;EACzCC;AACqB,CAAC,KAAK;EAC3B,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,aAAO,EAAC,CAAC;EAE7B,MAAMC,UAAU,GAAGC,sBAAU,CAACC,MAAM,CAACJ,OAAO,CAACK,KAAK,CAACC,GAAG,CAAC;EAEvD,MAAMC,kBAAkB,GAAG,IAAAC,0BAAiB,EAAEb,CAAM,IAAK;IACxD,MAAMW,GAAG,GAAGN,OAAO,CAACS,UAAU,CAACC,SAAS,CAAC,CAAC,EAAEC,QAAQ,CAAC,CAAC,CAACL,GAAG;IAC1D,MAAMM,2BAA2B,GAAGC,4CAAqB,CAACC,GAAG,CAACR,GAAG,CAAC;;IAElE;IACA,IAAIM,2BAA2B,EAAE;MAChC,IAAAG,0CAAoB,EAACf,OAAO,EAAE;QAAEgB,WAAW,EAAE;MAAK,CAAC,CAAC;MACpD;IACD;;IAEA;IACA,IAAIhB,OAAO,CAACS,UAAU,CAACE,QAAQ,CAAC,CAAC,CAACM,KAAK,KAAK,CAAC,EAAE;MAC9C,IAAAF,0CAAoB,EAACf,OAAO,EAAE;QAAEgB,WAAW,EAAE;MAAK,CAAC,CAAC;MACpD;IACD;IAEArB,CAAC,CAACuB,cAAc,CAAC,CAAC;IAClB,MAAMC,QAAQ,GAAIC,QAAiB,IAAK;MACvC,IAAIA,QAAQ,EAAE;QACbpB,OAAO,CAACS,UAAU,CAACY,QAAQ,CAAC1B,CAAC,CAAC2B,IAAI,CAACC,MAAM,CAAC;;QAE1C;QACAC,qBAAqB,CAAC,MAAM;UAC3B,IAAAT,0CAAoB,EAACf,OAAO,EAAE;YAAEgB,WAAW,EAAE;UAAM,CAAC,CAAC;QACtD,CAAC,CAAC;MACH;IACD,CAAC;IAED,IAAAS,4BAAa,EAAC;MACbC,MAAM,EAAE,OAAO;MACfC,IAAI,EAAE3B,OAAO,CAAC4B,OAAO,CAACC,cAAc;MACpCV,QAAQ;MACRjB;IACD,CAAC,CAAC;EACH,CAAC,CAAC;EAEF,MAAM4B,gBAAgB,GAAG,IAAAtB,0BAAiB,EAAC,MAAM;IAChD,IAAAiB,4BAAa,EAAC;MACbC,MAAM,EAAE,MAAM;MACdC,IAAI,EAAE3B,OAAO,CAAC4B,OAAO,CAACC,cAAc;MACpC3B;IACD,CAAC,CAAC;EACH,CAAC,CAAC;EAEF,IAAA6B,gBAAS,EAAC,MAAM;IACf,MAAMC,WAAW,GAAGhC,OAAO,CAACS,UAAU,CAACwB,WAAW,CACjD,cAAc,EACd1B,kBACD,CAAC;IAED,OAAOyB,WAAW;EACnB,CAAC,EAAE,CAAChC,OAAO,CAACS,UAAU,EAAEF,kBAAkB,CAAC,CAAC;EAE5C,IAAA2B,sBAAe,EAACJ,gBAAgB,EAAE,EAAE,CAAC;;EAErC;EACA,IAAAK,kDAAwB,EAAC,CAAC;EAE1B,OAAOpC,QAAQ;AAChB,CAAC;AAACqC,OAAA,CAAAtC,yBAAA,GAAAA,yBAAA","ignoreList":[]}
@@ -8,11 +8,11 @@ var _react = require("react");
8
8
  var _reactNativeGestureHandler = require("react-native-gesture-handler");
9
9
  var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
10
10
  var _useAssociatedStyle = require("../hooks/animation/use-associated-style");
11
- var _useBoundMeasurer = require("../hooks/bounds/use-bound-measurer");
12
- var _useScrollProgress = require("../hooks/gestures/use-scroll-progress");
11
+ var _useBoundRegistry = require("../hooks/bounds/use-bound-registry");
12
+ var _useScrollRegistry = require("../hooks/gestures/use-scroll-registry");
13
13
  var _gestures = require("../providers/gestures");
14
14
  var _keys = require("../providers/keys");
15
- var _boundsActivator = require("./bounds-activator");
15
+ var _boundCapture = require("./bound-capture");
16
16
  var _jsxRuntime = require("react/jsx-runtime");
17
17
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
18
18
  function createTransitionAwareComponent(Wrapped, options = {}) {
@@ -28,10 +28,10 @@ function createTransitionAwareComponent(Wrapped, options = {}) {
28
28
  scrollHandler,
29
29
  onContentSizeChange,
30
30
  onLayout
31
- } = (0, _useScrollProgress.useScrollProgress)({
31
+ } = (0, _useScrollRegistry.useScrollRegistry)({
32
32
  onScroll: props.onScroll,
33
33
  onContentSizeChange: props.onContentSizeChange,
34
- onLayout: props.onLayout // Add this line to pass through onLayout
34
+ onLayout: props.onLayout
35
35
  });
36
36
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector, {
37
37
  gesture: nativeGesture,
@@ -64,9 +64,9 @@ function createTransitionAwareComponent(Wrapped, options = {}) {
64
64
  id: sharedBoundTag || styleId
65
65
  });
66
66
  const {
67
- measureAndSet,
68
- measureOnLayout
69
- } = (0, _useBoundMeasurer.useBoundMeasurer)({
67
+ measureBounds,
68
+ handleLayout
69
+ } = (0, _useBoundRegistry.useBoundsRegistry)({
70
70
  sharedBoundTag,
71
71
  animatedRef,
72
72
  current,
@@ -75,18 +75,20 @@ function createTransitionAwareComponent(Wrapped, options = {}) {
75
75
  if (isScrollable) {
76
76
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ScrollableInner, {
77
77
  ...props,
78
- ref: ref
78
+ ref: ref,
79
+ measureBounds: measureBounds,
80
+ handleLayout: handleLayout
79
81
  });
80
82
  }
81
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_boundsActivator.BoundActivator, {
83
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_boundCapture.BoundCapture, {
82
84
  sharedBoundTag: sharedBoundTag,
83
- measure: measureAndSet,
85
+ measure: measureBounds,
84
86
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(AnimatedComponent, {
85
87
  ...rest,
86
88
  ref: animatedRef,
87
89
  style: [style, associatedStyles],
88
90
  onPress: onPress,
89
- onLayout: (0, _reactNativeReanimated.runOnUI)(measureOnLayout),
91
+ onLayout: (0, _reactNativeReanimated.runOnUI)(handleLayout),
90
92
  children: children
91
93
  })
92
94
  });
@@ -1 +1 @@
1
- {"version":3,"names":["_react","require","_reactNativeGestureHandler","_reactNativeReanimated","_interopRequireWildcard","_useAssociatedStyle","_useBoundMeasurer","_useScrollProgress","_gestures","_keys","_boundsActivator","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","createTransitionAwareComponent","Wrapped","options","isScrollable","AnimatedComponent","Animated","createAnimatedComponent","ScrollableInner","forwardRef","props","ref","nativeGesture","useGestureContext","scrollHandler","onContentSizeChange","onLayout","useScrollProgress","onScroll","jsx","GestureDetector","gesture","children","scrollEventThrottle","Inner","style","sharedBoundTag","styleId","onPress","rest","animatedRef","useAnimatedRef","current","useKeys","associatedStyles","useAssociatedStyles","id","measureAndSet","measureOnLayout","useBoundMeasurer","BoundActivator","measure","runOnUI","memo"],"sourceRoot":"../../../src","sources":["components/create-transition-aware-component.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","require","_reactNativeGestureHandler","_reactNativeReanimated","_interopRequireWildcard","_useAssociatedStyle","_useBoundRegistry","_useScrollRegistry","_gestures","_keys","_boundCapture","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","createTransitionAwareComponent","Wrapped","options","isScrollable","AnimatedComponent","Animated","createAnimatedComponent","ScrollableInner","forwardRef","props","ref","nativeGesture","useGestureContext","scrollHandler","onContentSizeChange","onLayout","useScrollRegistry","onScroll","jsx","GestureDetector","gesture","children","scrollEventThrottle","Inner","style","sharedBoundTag","styleId","onPress","rest","animatedRef","useAnimatedRef","current","useKeys","associatedStyles","useAssociatedStyles","id","measureBounds","handleLayout","useBoundsRegistry","BoundCapture","measure","runOnUI","memo"],"sourceRoot":"../../../src","sources":["components/create-transition-aware-component.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,52 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = MaskedView;
7
+ var _reactNative = require("react-native");
8
+ var _createTransitionAwareComponent = require("../create-transition-aware-component");
9
+ var _jsxRuntime = require("react/jsx-runtime");
10
+ const TransitionView = (0, _createTransitionAwareComponent.createTransitionAwareComponent)(_reactNative.View);
11
+ let LazyMaskedView = _reactNative.View;
12
+ try {
13
+ LazyMaskedView = require("@react-native-masked-view/masked-view").default;
14
+ } catch (_) {
15
+ // noop
16
+ }
17
+ const MASK_STYLE_ID = "_ROOT_MASKED";
18
+ const CONTAINER_STYLE_ID = "_ROOT_CONTAINER";
19
+ function MaskedView({
20
+ children,
21
+ style: userStyles = {}
22
+ }) {
23
+ if (LazyMaskedView === _reactNative.View) {
24
+ return children;
25
+ }
26
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(LazyMaskedView, {
27
+ style: styles.root
28
+ // @ts-expect-error
29
+ ,
30
+ maskElement: /*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionView, {
31
+ styleId: MASK_STYLE_ID,
32
+ style: styles.rootMask
33
+ }),
34
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionView, {
35
+ styleId: CONTAINER_STYLE_ID,
36
+ style: [styles.rootContainer, userStyles],
37
+ children: children
38
+ })
39
+ });
40
+ }
41
+ const styles = _reactNative.StyleSheet.create({
42
+ root: {
43
+ flex: 1
44
+ },
45
+ rootMask: {
46
+ backgroundColor: "white"
47
+ },
48
+ rootContainer: {
49
+ flex: 1
50
+ }
51
+ });
52
+ //# sourceMappingURL=masked-view.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_reactNative","require","_createTransitionAwareComponent","_jsxRuntime","TransitionView","createTransitionAwareComponent","View","LazyMaskedView","default","_","MASK_STYLE_ID","CONTAINER_STYLE_ID","MaskedView","children","style","userStyles","jsx","styles","root","maskElement","styleId","rootMask","rootContainer","StyleSheet","create","flex","backgroundColor"],"sourceRoot":"../../../../src","sources":["components/integrations/masked-view.tsx"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,+BAAA,GAAAD,OAAA;AAAsF,IAAAE,WAAA,GAAAF,OAAA;AAEtF,MAAMG,cAAc,GAAG,IAAAC,8DAA8B,EAACC,iBAAI,CAAC;AAE3D,IAAIC,cAAc,GAAGD,iBAAI;AAEzB,IAAI;EACHC,cAAc,GAAGN,OAAO,CAAC,uCAAuC,CAAC,CAACO,OAAO;AAC1E,CAAC,CAAC,OAAOC,CAAC,EAAE;EACX;AAAA;AAGD,MAAMC,aAAa,GAAG,cAAc;AACpC,MAAMC,kBAAkB,GAAG,iBAAiB;AAE7B,SAASC,UAAUA,CAAC;EAClCC,QAAQ;EACRC,KAAK,EAAEC,UAAU,GAAG,CAAC;AAItB,CAAC,EAAE;EACF,IAAIR,cAAc,KAAKD,iBAAI,EAAE;IAC5B,OAAOO,QAAQ;EAChB;EAEA,oBACC,IAAAV,WAAA,CAAAa,GAAA,EAACT,cAAc;IACdO,KAAK,EAAEG,MAAM,CAACC;IACd;IAAA;IACAC,WAAW,eACV,IAAAhB,WAAA,CAAAa,GAAA,EAACZ,cAAc;MAACgB,OAAO,EAAEV,aAAc;MAACI,KAAK,EAAEG,MAAM,CAACI;IAAS,CAAE,CACjE;IAAAR,QAAA,eAED,IAAAV,WAAA,CAAAa,GAAA,EAACZ,cAAc;MACdgB,OAAO,EAAET,kBAAmB;MAC5BG,KAAK,EAAE,CAACG,MAAM,CAACK,aAAa,EAAEP,UAAU,CAAE;MAAAF,QAAA,EAEzCA;IAAQ,CACM;EAAC,CACF,CAAC;AAEnB;AAEA,MAAMI,MAAM,GAAGM,uBAAU,CAACC,MAAM,CAAC;EAChCN,IAAI,EAAE;IACLO,IAAI,EAAE;EACP,CAAC;EACDJ,QAAQ,EAAE;IACTK,eAAe,EAAE;EAClB,CAAC;EACDJ,aAAa,EAAE;IACdG,IAAI,EAAE;EACP;AACD,CAAC,CAAC","ignoreList":[]}
@@ -7,34 +7,25 @@ exports.RootTransitionAware = void 0;
7
7
  var _react = require("react");
8
8
  var _reactNative = require("react-native");
9
9
  var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
10
- var _useScreenAnimation2 = require("../hooks/animation/use-screen-animation");
10
+ var _transitionStyles = require("../providers/transition-styles");
11
11
  var _jsxRuntime = require("react/jsx-runtime");
12
12
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
13
+ const EMPTY_STYLE = Object.freeze({});
13
14
  const RootTransitionAware = exports.RootTransitionAware = /*#__PURE__*/(0, _react.memo)(({
14
15
  children
15
16
  }) => {
16
- const {
17
- screenInterpolatorProps,
18
- screenStyleInterpolator
19
- } = (0, _useScreenAnimation2._useScreenAnimation)();
17
+ const stylesMap = (0, _transitionStyles.useTransitionStyles)();
20
18
  const animatedContentStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
21
19
  "worklet";
22
20
 
23
- if (!screenStyleInterpolator) {
24
- return {};
25
- }
26
- const props = screenInterpolatorProps.value;
27
- return screenStyleInterpolator(props).contentStyle || {};
21
+ return stylesMap.value.contentStyle || EMPTY_STYLE;
28
22
  });
29
23
  const animatedOverlayStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
30
24
  "worklet";
31
25
 
32
- if (!screenStyleInterpolator) {
33
- return {};
34
- }
35
- return screenStyleInterpolator(screenInterpolatorProps.value).overlayStyle || {};
26
+ return stylesMap.value.overlayStyle || EMPTY_STYLE;
36
27
  });
37
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
28
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
38
29
  style: styles.container,
39
30
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
40
31
  style: [_reactNative.StyleSheet.absoluteFillObject, animatedOverlayStyle],
@@ -1 +1 @@
1
- {"version":3,"names":["_react","require","_reactNative","_reactNativeReanimated","_interopRequireWildcard","_useScreenAnimation2","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","RootTransitionAware","exports","memo","children","screenInterpolatorProps","screenStyleInterpolator","_useScreenAnimation","animatedContentStyle","useAnimatedStyle","props","value","contentStyle","animatedOverlayStyle","overlayStyle","jsxs","View","style","styles","container","jsx","StyleSheet","absoluteFillObject","pointerEvents","content","create","flex"],"sourceRoot":"../../../src","sources":["components/root-transition-aware.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","require","_reactNative","_reactNativeReanimated","_interopRequireWildcard","_transitionStyles","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","EMPTY_STYLE","freeze","RootTransitionAware","exports","memo","children","stylesMap","useTransitionStyles","animatedContentStyle","useAnimatedStyle","value","contentStyle","animatedOverlayStyle","overlayStyle","jsxs","View","style","styles","container","jsx","StyleSheet","absoluteFillObject","pointerEvents","content","create","flex"],"sourceRoot":"../../../src","sources":["components/root-transition-aware.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAC,uBAAA,CAAAH,OAAA;AAIA,IAAAI,iBAAA,GAAAJ,OAAA;AAAqE,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAG,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAMrE,MAAMkB,WAAW,GAAGH,MAAM,CAACI,MAAM,CAAC,CAAC,CAAe,CAAC;AAE5C,MAAMC,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,gBAAG,IAAAE,WAAI,EAAC,CAAC;EAAEC;AAAgB,CAAC,KAAK;EAChE,MAAMC,SAAS,GAAG,IAAAC,qCAAmB,EAAC,CAAC;EAEvC,MAAMC,oBAAoB,GAAG,IAAAC,uCAAgB,EAAC,MAAM;IACnD,SAAS;;IACT,OAAOH,SAAS,CAACI,KAAK,CAACC,YAAY,IAAIX,WAAW;EACnD,CAAC,CAAC;EAEF,MAAMY,oBAAoB,GAAG,IAAAH,uCAAgB,EAAC,MAAM;IACnD,SAAS;;IACT,OAAOH,SAAS,CAACI,KAAK,CAACG,YAAY,IAAIb,WAAW;EACnD,CAAC,CAAC;EAEF,oBACC,IAAApB,WAAA,CAAAkC,IAAA,EAACtC,YAAA,CAAAuC,IAAI;IAACC,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAb,QAAA,gBAC7B,IAAAzB,WAAA,CAAAuC,GAAA,EAAC1C,sBAAA,CAAAc,OAAQ,CAACwB,IAAI;MACbC,KAAK,EAAE,CAACI,uBAAU,CAACC,kBAAkB,EAAET,oBAAoB,CAAE;MAC7DU,aAAa,EAAC;IAAM,CACpB,CAAC,eACF,IAAA1C,WAAA,CAAAuC,GAAA,EAAC1C,sBAAA,CAAAc,OAAQ,CAACwB,IAAI;MAACC,KAAK,EAAE,CAACC,MAAM,CAACM,OAAO,EAAEf,oBAAoB,CAAE;MAAAH,QAAA,EAC3DA;IAAQ,CACK,CAAC;EAAA,CACX,CAAC;AAET,CAAC,CAAC;AAEF,MAAMY,MAAM,GAAGG,uBAAU,CAACI,MAAM,CAAC;EAChCN,SAAS,EAAE;IACVO,IAAI,EAAE;EACP,CAAC;EACDF,OAAO,EAAE;IACRE,IAAI,EAAE;EACP;AACD,CAAC,CAAC","ignoreList":[]}
@@ -4,9 +4,19 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.specs = exports.presets = void 0;
7
- var _presets = _interopRequireWildcard(require("./presets"));
8
- exports.presets = _presets;
9
- var _specs = _interopRequireWildcard(require("./specs"));
10
- exports.specs = _specs;
11
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
7
+ var _presets = require("./presets");
8
+ var _specs = require("./specs");
9
+ const specs = exports.specs = {
10
+ DefaultSpec: _specs.DefaultSpec
11
+ };
12
+ const presets = exports.presets = {
13
+ SlideFromTop: _presets.SlideFromTop,
14
+ ZoomIn: _presets.ZoomIn,
15
+ SlideFromBottom: _presets.SlideFromBottom,
16
+ DraggableCard: _presets.DraggableCard,
17
+ ElasticCard: _presets.ElasticCard,
18
+ SharedIGImage: _presets.SharedIGImage,
19
+ SharedAppleMusic: _presets.SharedAppleMusic,
20
+ SharedXImage: _presets.SharedXImage
21
+ };
12
22
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sourceRoot":"../../../src","sources":["configs/index.ts"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"names":["_presets","require","_specs","specs","exports","DefaultSpec","presets","SlideFromTop","ZoomIn","SlideFromBottom","DraggableCard","ElasticCard","SharedIGImage","SharedAppleMusic","SharedXImage"],"sourceRoot":"../../../src","sources":["configs/index.ts"],"mappings":";;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAUA,IAAAC,MAAA,GAAAD,OAAA;AAEO,MAAME,KAAK,GAAAC,OAAA,CAAAD,KAAA,GAAG;EACpBE,WAAW,EAAXA;AACD,CAAC;AAEM,MAAMC,OAAO,GAAAF,OAAA,CAAAE,OAAA,GAAG;EACtBC,YAAY,EAAZA,qBAAY;EACZC,MAAM,EAANA,eAAM;EACNC,eAAe,EAAfA,wBAAe;EACfC,aAAa,EAAbA,sBAAa;EACbC,WAAW,EAAXA,oBAAW;EACXC,aAAa,EAAbA,sBAAa;EACbC,gBAAgB,EAAhBA,yBAAgB;EAChBC,YAAY,EAAZA;AACD,CAAC","ignoreList":[]}