@tamagui/animations-moti 1.143.0 → 2.0.0-1
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.
- package/dist/cjs/createAnimations.cjs +18 -6
- package/dist/cjs/createAnimations.js +15 -7
- package/dist/cjs/createAnimations.js.map +1 -1
- package/dist/cjs/createAnimations.native.js +30 -11
- package/dist/cjs/createAnimations.native.js.map +1 -1
- package/dist/esm/createAnimations.js +15 -7
- package/dist/esm/createAnimations.js.map +1 -1
- package/dist/esm/createAnimations.mjs +18 -6
- package/dist/esm/createAnimations.mjs.map +1 -1
- package/dist/esm/createAnimations.native.js +30 -11
- package/dist/esm/createAnimations.native.js.map +1 -1
- package/package.json +4 -4
- package/src/createAnimations.tsx +31 -3
- package/types/createAnimations.d.ts.map +2 -2
|
@@ -40,7 +40,8 @@ var import_use_presence = require("@tamagui/use-presence"),
|
|
|
40
40
|
import_react = __toESM(require("react"), 1),
|
|
41
41
|
import_react_native_reanimated = __toESM(require("react-native-reanimated"), 1),
|
|
42
42
|
import_jsx_runtime = require("react/jsx-runtime");
|
|
43
|
-
const
|
|
43
|
+
const resolveDynamicValue = (value, isDark) => value && typeof value == "object" && "dynamic" in value ? isDark ? value.dynamic.dark : value.dynamic.light : value,
|
|
44
|
+
safeESModule = a => {
|
|
44
45
|
const b = a;
|
|
45
46
|
return (b.__esModule || b[Symbol.toStringTag] === "Module" ? b.default : b) || a;
|
|
46
47
|
},
|
|
@@ -185,20 +186,31 @@ function createAnimations(animations) {
|
|
|
185
186
|
isHydrating = componentState.unmounted === !0,
|
|
186
187
|
disableAnimation = isHydrating || !animationKey,
|
|
187
188
|
presenceContext = import_react.default.useContext(import_use_presence.PresenceContext),
|
|
189
|
+
[, themeState] = (0, import_core.useThemeWithState)({}),
|
|
190
|
+
isDark = themeState?.scheme === "dark" || themeState?.name?.startsWith("dark"),
|
|
188
191
|
{
|
|
189
192
|
dontAnimate,
|
|
190
193
|
motiProps
|
|
191
194
|
} = (0, import_react.useMemo)(() => {
|
|
192
195
|
let animate = {},
|
|
193
196
|
dontAnimate2 = {};
|
|
194
|
-
if (disableAnimation)
|
|
197
|
+
if (disableAnimation) for (const key in style) {
|
|
198
|
+
const rawValue = style[key],
|
|
199
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
200
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
201
|
+
} else {
|
|
195
202
|
const animateOnly = props.animateOnly;
|
|
196
203
|
for (const key in style) {
|
|
197
|
-
const
|
|
198
|
-
|
|
204
|
+
const rawValue = style[key],
|
|
205
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
206
|
+
value !== void 0 && (!onlyAnimateKeys[key] || value === "auto" || typeof value == "string" && value.startsWith("calc") || animateOnly && !animateOnly.includes(key) ? dontAnimate2[key] = value : animate[key] = value);
|
|
199
207
|
}
|
|
200
208
|
}
|
|
201
|
-
componentState.unmounted === "should-enter"
|
|
209
|
+
if (componentState.unmounted === "should-enter") for (const key in style) {
|
|
210
|
+
const rawValue = style[key],
|
|
211
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
212
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
213
|
+
}
|
|
202
214
|
const styles = animate,
|
|
203
215
|
isExiting = !!presence?.[1],
|
|
204
216
|
usePresenceValue = presence || void 0;
|
|
@@ -226,7 +238,7 @@ function createAnimations(animations) {
|
|
|
226
238
|
exit: isExiting ? styles : void 0
|
|
227
239
|
}
|
|
228
240
|
};
|
|
229
|
-
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext]),
|
|
241
|
+
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext, isDark]),
|
|
230
242
|
moti = (0, import_author.useMotify)(motiProps);
|
|
231
243
|
return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {
|
|
232
244
|
"componentState.unmounted": componentState.unmounted,
|
|
@@ -26,7 +26,7 @@ __export(createAnimations_exports, {
|
|
|
26
26
|
});
|
|
27
27
|
module.exports = __toCommonJS(createAnimations_exports);
|
|
28
28
|
var import_use_presence = require("@tamagui/use-presence"), import_core = require("@tamagui/core"), import_author = require("moti/author"), import_react = __toESM(require("react"), 1), import_react_native_reanimated = __toESM(require("react-native-reanimated"), 1), import_jsx_runtime = require("react/jsx-runtime");
|
|
29
|
-
const safeESModule = (a) => {
|
|
29
|
+
const resolveDynamicValue = (value, isDark) => value && typeof value == "object" && "dynamic" in value ? isDark ? value.dynamic.dark : value.dynamic.light : value, safeESModule = (a) => {
|
|
30
30
|
const b = a;
|
|
31
31
|
return (b.__esModule || b[Symbol.toStringTag] === "Module" ? b.default : b) || a;
|
|
32
32
|
}, Animated = safeESModule(import_react_native_reanimated.default);
|
|
@@ -155,18 +155,25 @@ function createAnimations(animations) {
|
|
|
155
155
|
return (0, import_react_native_reanimated.useAnimatedStyle)(() => getStyle(derivedValue.value), [val, getStyle, derivedValue, instance]);
|
|
156
156
|
},
|
|
157
157
|
useAnimations: (animationProps) => {
|
|
158
|
-
const { props, presence, style, componentState } = animationProps, animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation, isHydrating = componentState.unmounted === !0, disableAnimation = isHydrating || !animationKey, presenceContext = import_react.default.useContext(import_use_presence.PresenceContext), { dontAnimate, motiProps } = (0, import_react.useMemo)(() => {
|
|
158
|
+
const { props, presence, style, componentState } = animationProps, animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation, isHydrating = componentState.unmounted === !0, disableAnimation = isHydrating || !animationKey, presenceContext = import_react.default.useContext(import_use_presence.PresenceContext), [, themeState] = (0, import_core.useThemeWithState)({}), isDark = themeState?.scheme === "dark" || themeState?.name?.startsWith("dark"), { dontAnimate, motiProps } = (0, import_react.useMemo)(() => {
|
|
159
159
|
let animate = {}, dontAnimate2 = {};
|
|
160
160
|
if (disableAnimation)
|
|
161
|
-
|
|
161
|
+
for (const key in style) {
|
|
162
|
+
const rawValue = style[key], value = resolveDynamicValue(rawValue, isDark);
|
|
163
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
164
|
+
}
|
|
162
165
|
else {
|
|
163
166
|
const animateOnly = props.animateOnly;
|
|
164
167
|
for (const key in style) {
|
|
165
|
-
const
|
|
166
|
-
!onlyAnimateKeys[key] || value === "auto" || typeof value == "string" && value.startsWith("calc") || animateOnly && !animateOnly.includes(key) ? dontAnimate2[key] = value : animate[key] = value;
|
|
168
|
+
const rawValue = style[key], value = resolveDynamicValue(rawValue, isDark);
|
|
169
|
+
value !== void 0 && (!onlyAnimateKeys[key] || value === "auto" || typeof value == "string" && value.startsWith("calc") || animateOnly && !animateOnly.includes(key) ? dontAnimate2[key] = value : animate[key] = value);
|
|
167
170
|
}
|
|
168
171
|
}
|
|
169
|
-
componentState.unmounted === "should-enter"
|
|
172
|
+
if (componentState.unmounted === "should-enter")
|
|
173
|
+
for (const key in style) {
|
|
174
|
+
const rawValue = style[key], value = resolveDynamicValue(rawValue, isDark);
|
|
175
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
176
|
+
}
|
|
170
177
|
const styles = animate, isExiting = !!presence?.[1], usePresenceValue = presence || void 0;
|
|
171
178
|
let transition = isHydrating ? { type: "transition", duration: 0 } : animations[animationKey], hasClonedTransition = !1;
|
|
172
179
|
if (Array.isArray(props.animation)) {
|
|
@@ -193,7 +200,8 @@ function createAnimations(animations) {
|
|
|
193
200
|
animationKey,
|
|
194
201
|
componentState.unmounted,
|
|
195
202
|
JSON.stringify(style),
|
|
196
|
-
presenceContext
|
|
203
|
+
presenceContext,
|
|
204
|
+
isDark
|
|
197
205
|
]), moti = (0, import_author.useMotify)(motiProps);
|
|
198
206
|
return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {
|
|
199
207
|
"componentState.unmounted": componentState.unmounted,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createAnimations.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA4D,kCAE5D,cAUO,
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": ["Animated_", "React", "dontAnimate"]
|
|
6
6
|
}
|
|
@@ -47,7 +47,14 @@ function _type_of(obj) {
|
|
|
47
47
|
|
|
48
48
|
return obj && typeof Symbol < "u" && obj.constructor === Symbol ? "symbol" : typeof obj;
|
|
49
49
|
}
|
|
50
|
-
var
|
|
50
|
+
var resolveDynamicValue = function (value, isDark) {
|
|
51
|
+
if (value && (typeof value > "u" ? "undefined" : _type_of(value)) === "object" && "dynamic" in value) {
|
|
52
|
+
var dynamicValue = isDark ? value.dynamic.dark : value.dynamic.light;
|
|
53
|
+
return dynamicValue;
|
|
54
|
+
}
|
|
55
|
+
return value;
|
|
56
|
+
},
|
|
57
|
+
safeESModule = function (a) {
|
|
51
58
|
var b = a,
|
|
52
59
|
out = b.__esModule || b[Symbol.toStringTag] === "Module" ? b.default : b;
|
|
53
60
|
return out || a;
|
|
@@ -201,7 +208,8 @@ function createAnimations(animations) {
|
|
|
201
208
|
[val, getStyle, derivedValue, instance]);
|
|
202
209
|
},
|
|
203
210
|
useAnimations: function (animationProps) {
|
|
204
|
-
var
|
|
211
|
+
var _themeState_name,
|
|
212
|
+
{
|
|
205
213
|
props,
|
|
206
214
|
presence,
|
|
207
215
|
style,
|
|
@@ -211,20 +219,31 @@ function createAnimations(animations) {
|
|
|
211
219
|
isHydrating = componentState.unmounted === !0,
|
|
212
220
|
disableAnimation = isHydrating || !animationKey,
|
|
213
221
|
presenceContext = import_react.default.useContext(import_use_presence.PresenceContext),
|
|
222
|
+
[, themeState] = (0, import_core.useThemeWithState)({}),
|
|
223
|
+
isDark = themeState?.scheme === "dark" || (themeState == null || (_themeState_name = themeState.name) === null || _themeState_name === void 0 ? void 0 : _themeState_name.startsWith("dark")),
|
|
214
224
|
{
|
|
215
225
|
dontAnimate,
|
|
216
226
|
motiProps
|
|
217
227
|
} = (0, import_react.useMemo)(function () {
|
|
218
228
|
var animate = {},
|
|
219
229
|
dontAnimate2 = {};
|
|
220
|
-
if (disableAnimation)
|
|
230
|
+
if (disableAnimation) for (var key in style) {
|
|
231
|
+
var rawValue = style[key],
|
|
232
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
233
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
234
|
+
} else {
|
|
221
235
|
var animateOnly = props.animateOnly;
|
|
222
|
-
for (var
|
|
223
|
-
var
|
|
224
|
-
|
|
236
|
+
for (var key1 in style) {
|
|
237
|
+
var rawValue1 = style[key1],
|
|
238
|
+
value1 = resolveDynamicValue(rawValue1, isDark);
|
|
239
|
+
value1 !== void 0 && (!onlyAnimateKeys[key1] || value1 === "auto" || typeof value1 == "string" && value1.startsWith("calc") || animateOnly && !animateOnly.includes(key1) ? dontAnimate2[key1] = value1 : animate[key1] = value1);
|
|
225
240
|
}
|
|
226
241
|
}
|
|
227
|
-
componentState.unmounted === "should-enter"
|
|
242
|
+
if (componentState.unmounted === "should-enter") for (var key2 in style) {
|
|
243
|
+
var rawValue2 = style[key2],
|
|
244
|
+
value2 = resolveDynamicValue(rawValue2, isDark);
|
|
245
|
+
value2 !== void 0 && (dontAnimate2[key2] = value2);
|
|
246
|
+
}
|
|
228
247
|
var styles = animate,
|
|
229
248
|
isExiting = !!presence?.[1],
|
|
230
249
|
usePresenceValue = presence || void 0,
|
|
@@ -235,9 +254,9 @@ function createAnimations(animations) {
|
|
|
235
254
|
hasClonedTransition = !1;
|
|
236
255
|
if (Array.isArray(props.animation)) {
|
|
237
256
|
var config = props.animation[1];
|
|
238
|
-
if (config && (typeof config > "u" ? "undefined" : _type_of(config)) === "object") for (var
|
|
239
|
-
var val = config[
|
|
240
|
-
hasClonedTransition || (transition = Object.assign({}, transition), hasClonedTransition = !0), typeof val == "string" ? transition[
|
|
257
|
+
if (config && (typeof config > "u" ? "undefined" : _type_of(config)) === "object") for (var key3 in config) {
|
|
258
|
+
var val = config[key3];
|
|
259
|
+
hasClonedTransition || (transition = Object.assign({}, transition), hasClonedTransition = !0), typeof val == "string" ? transition[key3] = animations[val] : transition[key3] = val;
|
|
241
260
|
}
|
|
242
261
|
}
|
|
243
262
|
return {
|
|
@@ -252,7 +271,7 @@ function createAnimations(animations) {
|
|
|
252
271
|
exit: isExiting ? styles : void 0
|
|
253
272
|
}
|
|
254
273
|
};
|
|
255
|
-
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext]),
|
|
274
|
+
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext, isDark]),
|
|
256
275
|
moti = (0, import_author.useMotify)(motiProps);
|
|
257
276
|
return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {
|
|
258
277
|
"componentState.unmounted": componentState.unmounted,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","createAnimations_exports","__export","createAnimations","module","exports","import_jsx_runtime","require","import_use_presence","import_core","import_author","import_react","__toESM","import_react_native_reanimated","_type_of","obj","Symbol","constructor","safeESModule","a","b","out","__esModule","toStringTag","default","Animated","createTamaguiAnimatedComponent","defaultTag","arguments","length","isText","Component","createAnimatedComponent","forwardRef","propsIn","ref","_hooks_usePropsTransform","forwardedRef","animation","tag","propsRest","hostRef","useRef","composedRefs","useComposedRefs","stateRef","current","host","_","state","useThemeWithState","result","getSplitStyles","Text","staticConfig","View","theme","name","unmounted","isAnimated","noClass","props","viewProps","Element","transformedProps","hooks","usePropsTransform","call","jsx","acceptTagProp","AnimatedView","AnimatedText","onlyAnimateKeys","transform","opacity","height","width","backgroundColor","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth","color","left","right","top","bottom","fontSize","fontWeight","lineHeight","letterSpacing","animations","isWeb","isReactNative","supportsCSS","usePresence","ResetPresence","useAnimatedNumber","initial","sharedValue","useSharedValue","useMemo","getInstance","getValue","setValue","next","config","type","onFinish","withSpring","runOnJS","withTiming","stop","cancelAnimation","useAnimatedNumberReaction","param","onValue","instance","useAnimatedReaction","prev","useAnimatedNumberStyle","val","getStyle","derivedValue","useDerivedValue","useAnimatedStyle","useAnimations","animationProps","presence","style","componentState","animationKey","Array","isArray","isHydrating","disableAnimation","presenceContext","useContext","PresenceContext","dontAnimate","motiProps","animate","dontAnimate2","animateOnly","
|
|
1
|
+
{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","createAnimations_exports","__export","createAnimations","module","exports","import_jsx_runtime","require","import_use_presence","import_core","import_author","import_react","__toESM","import_react_native_reanimated","_type_of","obj","Symbol","constructor","resolveDynamicValue","isDark","dynamicValue","dynamic","dark","light","safeESModule","a","b","out","__esModule","toStringTag","default","Animated","createTamaguiAnimatedComponent","defaultTag","arguments","length","isText","Component","createAnimatedComponent","forwardRef","propsIn","ref","_hooks_usePropsTransform","forwardedRef","animation","tag","propsRest","hostRef","useRef","composedRefs","useComposedRefs","stateRef","current","host","_","state","useThemeWithState","result","getSplitStyles","Text","staticConfig","View","theme","name","unmounted","isAnimated","noClass","props","viewProps","Element","transformedProps","hooks","usePropsTransform","call","jsx","acceptTagProp","AnimatedView","AnimatedText","onlyAnimateKeys","transform","opacity","height","width","backgroundColor","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth","color","left","right","top","bottom","fontSize","fontWeight","lineHeight","letterSpacing","animations","isWeb","isReactNative","supportsCSS","usePresence","ResetPresence","useAnimatedNumber","initial","sharedValue","useSharedValue","useMemo","getInstance","getValue","setValue","next","config","type","onFinish","withSpring","runOnJS","withTiming","stop","cancelAnimation","useAnimatedNumberReaction","param","onValue","instance","useAnimatedReaction","prev","useAnimatedNumberStyle","val","getStyle","derivedValue","useDerivedValue","useAnimatedStyle","useAnimations","animationProps","_themeState_name","presence","style","componentState","animationKey","Array","isArray","isHydrating","disableAnimation","presenceContext","useContext","PresenceContext","themeState","scheme","startsWith","dontAnimate","motiProps","animate","dontAnimate2","key","rawValue","animateOnly","key1","rawValue1","value1","includes","key2","rawValue2","value2","styles","isExiting","usePresenceValue","transition","duration","hasClonedTransition","key3","Object","assign"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -21,7 +21,7 @@ import Animated_, {
|
|
|
21
21
|
withTiming
|
|
22
22
|
} from "react-native-reanimated";
|
|
23
23
|
import { jsx } from "react/jsx-runtime";
|
|
24
|
-
const safeESModule = (a) => {
|
|
24
|
+
const resolveDynamicValue = (value, isDark) => value && typeof value == "object" && "dynamic" in value ? isDark ? value.dynamic.dark : value.dynamic.light : value, safeESModule = (a) => {
|
|
25
25
|
const b = a;
|
|
26
26
|
return (b.__esModule || b[Symbol.toStringTag] === "Module" ? b.default : b) || a;
|
|
27
27
|
}, Animated = safeESModule(Animated_);
|
|
@@ -150,18 +150,25 @@ function createAnimations(animations) {
|
|
|
150
150
|
return useAnimatedStyle(() => getStyle(derivedValue.value), [val, getStyle, derivedValue, instance]);
|
|
151
151
|
},
|
|
152
152
|
useAnimations: (animationProps) => {
|
|
153
|
-
const { props, presence, style, componentState } = animationProps, animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation, isHydrating = componentState.unmounted === !0, disableAnimation = isHydrating || !animationKey, presenceContext = React.useContext(PresenceContext), { dontAnimate, motiProps } = useMemo(() => {
|
|
153
|
+
const { props, presence, style, componentState } = animationProps, animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation, isHydrating = componentState.unmounted === !0, disableAnimation = isHydrating || !animationKey, presenceContext = React.useContext(PresenceContext), [, themeState] = useThemeWithState({}), isDark = themeState?.scheme === "dark" || themeState?.name?.startsWith("dark"), { dontAnimate, motiProps } = useMemo(() => {
|
|
154
154
|
let animate = {}, dontAnimate2 = {};
|
|
155
155
|
if (disableAnimation)
|
|
156
|
-
|
|
156
|
+
for (const key in style) {
|
|
157
|
+
const rawValue = style[key], value = resolveDynamicValue(rawValue, isDark);
|
|
158
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
159
|
+
}
|
|
157
160
|
else {
|
|
158
161
|
const animateOnly = props.animateOnly;
|
|
159
162
|
for (const key in style) {
|
|
160
|
-
const
|
|
161
|
-
!onlyAnimateKeys[key] || value === "auto" || typeof value == "string" && value.startsWith("calc") || animateOnly && !animateOnly.includes(key) ? dontAnimate2[key] = value : animate[key] = value;
|
|
163
|
+
const rawValue = style[key], value = resolveDynamicValue(rawValue, isDark);
|
|
164
|
+
value !== void 0 && (!onlyAnimateKeys[key] || value === "auto" || typeof value == "string" && value.startsWith("calc") || animateOnly && !animateOnly.includes(key) ? dontAnimate2[key] = value : animate[key] = value);
|
|
162
165
|
}
|
|
163
166
|
}
|
|
164
|
-
componentState.unmounted === "should-enter"
|
|
167
|
+
if (componentState.unmounted === "should-enter")
|
|
168
|
+
for (const key in style) {
|
|
169
|
+
const rawValue = style[key], value = resolveDynamicValue(rawValue, isDark);
|
|
170
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
171
|
+
}
|
|
165
172
|
const styles = animate, isExiting = !!presence?.[1], usePresenceValue = presence || void 0;
|
|
166
173
|
let transition = isHydrating ? { type: "transition", duration: 0 } : animations[animationKey], hasClonedTransition = !1;
|
|
167
174
|
if (Array.isArray(props.animation)) {
|
|
@@ -188,7 +195,8 @@ function createAnimations(animations) {
|
|
|
188
195
|
animationKey,
|
|
189
196
|
componentState.unmounted,
|
|
190
197
|
JSON.stringify(style),
|
|
191
|
-
presenceContext
|
|
198
|
+
presenceContext,
|
|
199
|
+
isDark
|
|
192
200
|
]), moti = useMotify(motiProps);
|
|
193
201
|
return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {
|
|
194
202
|
"componentState.unmounted": componentState.unmounted,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createAnimations.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,iBAAiB,eAAe,mBAAmB;AAE5D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": ["dontAnimate"]
|
|
6
6
|
}
|
|
@@ -4,7 +4,8 @@ import { useMotify } from "moti/author";
|
|
|
4
4
|
import React, { forwardRef, useMemo, useRef } from "react";
|
|
5
5
|
import Animated_, { cancelAnimation, runOnJS, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from "react-native-reanimated";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
|
-
const
|
|
7
|
+
const resolveDynamicValue = (value, isDark) => value && typeof value == "object" && "dynamic" in value ? isDark ? value.dynamic.dark : value.dynamic.light : value,
|
|
8
|
+
safeESModule = a => {
|
|
8
9
|
const b = a;
|
|
9
10
|
return (b.__esModule || b[Symbol.toStringTag] === "Module" ? b.default : b) || a;
|
|
10
11
|
},
|
|
@@ -149,20 +150,31 @@ function createAnimations(animations) {
|
|
|
149
150
|
isHydrating = componentState.unmounted === !0,
|
|
150
151
|
disableAnimation = isHydrating || !animationKey,
|
|
151
152
|
presenceContext = React.useContext(PresenceContext),
|
|
153
|
+
[, themeState] = useThemeWithState({}),
|
|
154
|
+
isDark = themeState?.scheme === "dark" || themeState?.name?.startsWith("dark"),
|
|
152
155
|
{
|
|
153
156
|
dontAnimate,
|
|
154
157
|
motiProps
|
|
155
158
|
} = useMemo(() => {
|
|
156
159
|
let animate = {},
|
|
157
160
|
dontAnimate2 = {};
|
|
158
|
-
if (disableAnimation)
|
|
161
|
+
if (disableAnimation) for (const key in style) {
|
|
162
|
+
const rawValue = style[key],
|
|
163
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
164
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
165
|
+
} else {
|
|
159
166
|
const animateOnly = props.animateOnly;
|
|
160
167
|
for (const key in style) {
|
|
161
|
-
const
|
|
162
|
-
|
|
168
|
+
const rawValue = style[key],
|
|
169
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
170
|
+
value !== void 0 && (!onlyAnimateKeys[key] || value === "auto" || typeof value == "string" && value.startsWith("calc") || animateOnly && !animateOnly.includes(key) ? dontAnimate2[key] = value : animate[key] = value);
|
|
163
171
|
}
|
|
164
172
|
}
|
|
165
|
-
componentState.unmounted === "should-enter"
|
|
173
|
+
if (componentState.unmounted === "should-enter") for (const key in style) {
|
|
174
|
+
const rawValue = style[key],
|
|
175
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
176
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
177
|
+
}
|
|
166
178
|
const styles = animate,
|
|
167
179
|
isExiting = !!presence?.[1],
|
|
168
180
|
usePresenceValue = presence || void 0;
|
|
@@ -190,7 +202,7 @@ function createAnimations(animations) {
|
|
|
190
202
|
exit: isExiting ? styles : void 0
|
|
191
203
|
}
|
|
192
204
|
};
|
|
193
|
-
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext]),
|
|
205
|
+
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext, isDark]),
|
|
194
206
|
moti = useMotify(motiProps);
|
|
195
207
|
return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {
|
|
196
208
|
"componentState.unmounted": componentState.unmounted,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["PresenceContext","ResetPresence","usePresence","getSplitStyles","hooks","isWeb","Text","useComposedRefs","useThemeWithState","View","useMotify","React","forwardRef","useMemo","useRef","Animated_","cancelAnimation","runOnJS","useAnimatedReaction","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","withTiming","jsx","safeESModule","a","b","__esModule","Symbol","toStringTag","default","Animated","createTamaguiAnimatedComponent","defaultTag","isText","Component","createAnimatedComponent","propsIn","ref","forwardedRef","animation","tag","propsRest","hostRef","composedRefs","stateRef","current","host","_","state","props","staticConfig","theme","name","unmounted","isAnimated","noClass","viewProps","Element","transformedProps","usePropsTransform","acceptTagProp","AnimatedView","AnimatedText","onlyAnimateKeys","transform","opacity","height","width","backgroundColor","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth","color","left","right","top","bottom","fontSize","fontWeight","lineHeight","letterSpacing","createAnimations","animations","isReactNative","supportsCSS","useAnimatedNumber","initial","sharedValue","getInstance","getValue","
|
|
1
|
+
{"version":3,"names":["PresenceContext","ResetPresence","usePresence","getSplitStyles","hooks","isWeb","Text","useComposedRefs","useThemeWithState","View","useMotify","React","forwardRef","useMemo","useRef","Animated_","cancelAnimation","runOnJS","useAnimatedReaction","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","withTiming","jsx","resolveDynamicValue","value","isDark","dynamic","dark","light","safeESModule","a","b","__esModule","Symbol","toStringTag","default","Animated","createTamaguiAnimatedComponent","defaultTag","isText","Component","createAnimatedComponent","propsIn","ref","forwardedRef","animation","tag","propsRest","hostRef","composedRefs","stateRef","current","host","_","state","props","staticConfig","theme","name","unmounted","isAnimated","noClass","viewProps","Element","transformedProps","usePropsTransform","acceptTagProp","AnimatedView","AnimatedText","onlyAnimateKeys","transform","opacity","height","width","backgroundColor","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth","color","left","right","top","bottom","fontSize","fontWeight","lineHeight","letterSpacing","createAnimations","animations","isReactNative","supportsCSS","useAnimatedNumber","initial","sharedValue","getInstance","getValue","setValue","next","config","type","onFinish","stop","useAnimatedNumberReaction","onValue","instance","prev","useAnimatedNumberStyle","val","getStyle","derivedValue","useAnimations","animationProps","presence","style","componentState","animationKey","Array","isArray","isHydrating","disableAnimation","presenceContext","useContext","themeState","scheme","startsWith","dontAnimate","motiProps","animate","dontAnimate2","key","rawValue","animateOnly","includes","styles","isExiting","usePresenceValue","transition","duration","hasClonedTransition","Object","assign","exit","JSON","stringify","moti","process","env","NODE_ENV","debug","console","info"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -9,7 +9,14 @@ function _type_of(obj) {
|
|
|
9
9
|
|
|
10
10
|
return obj && typeof Symbol < "u" && obj.constructor === Symbol ? "symbol" : typeof obj;
|
|
11
11
|
}
|
|
12
|
-
var
|
|
12
|
+
var resolveDynamicValue = function (value, isDark) {
|
|
13
|
+
if (value && (typeof value > "u" ? "undefined" : _type_of(value)) === "object" && "dynamic" in value) {
|
|
14
|
+
var dynamicValue = isDark ? value.dynamic.dark : value.dynamic.light;
|
|
15
|
+
return dynamicValue;
|
|
16
|
+
}
|
|
17
|
+
return value;
|
|
18
|
+
},
|
|
19
|
+
safeESModule = function (a) {
|
|
13
20
|
var b = a,
|
|
14
21
|
out = b.__esModule || b[Symbol.toStringTag] === "Module" ? b.default : b;
|
|
15
22
|
return out || a;
|
|
@@ -163,7 +170,8 @@ function createAnimations(animations) {
|
|
|
163
170
|
[val, getStyle, derivedValue, instance]);
|
|
164
171
|
},
|
|
165
172
|
useAnimations: function (animationProps) {
|
|
166
|
-
var
|
|
173
|
+
var _themeState_name,
|
|
174
|
+
{
|
|
167
175
|
props,
|
|
168
176
|
presence,
|
|
169
177
|
style,
|
|
@@ -173,20 +181,31 @@ function createAnimations(animations) {
|
|
|
173
181
|
isHydrating = componentState.unmounted === !0,
|
|
174
182
|
disableAnimation = isHydrating || !animationKey,
|
|
175
183
|
presenceContext = React.useContext(PresenceContext),
|
|
184
|
+
[, themeState] = useThemeWithState({}),
|
|
185
|
+
isDark = themeState?.scheme === "dark" || (themeState == null || (_themeState_name = themeState.name) === null || _themeState_name === void 0 ? void 0 : _themeState_name.startsWith("dark")),
|
|
176
186
|
{
|
|
177
187
|
dontAnimate,
|
|
178
188
|
motiProps
|
|
179
189
|
} = useMemo(function () {
|
|
180
190
|
var animate = {},
|
|
181
191
|
dontAnimate2 = {};
|
|
182
|
-
if (disableAnimation)
|
|
192
|
+
if (disableAnimation) for (var key in style) {
|
|
193
|
+
var rawValue = style[key],
|
|
194
|
+
value = resolveDynamicValue(rawValue, isDark);
|
|
195
|
+
value !== void 0 && (dontAnimate2[key] = value);
|
|
196
|
+
} else {
|
|
183
197
|
var animateOnly = props.animateOnly;
|
|
184
|
-
for (var
|
|
185
|
-
var
|
|
186
|
-
|
|
198
|
+
for (var key1 in style) {
|
|
199
|
+
var rawValue1 = style[key1],
|
|
200
|
+
value1 = resolveDynamicValue(rawValue1, isDark);
|
|
201
|
+
value1 !== void 0 && (!onlyAnimateKeys[key1] || value1 === "auto" || typeof value1 == "string" && value1.startsWith("calc") || animateOnly && !animateOnly.includes(key1) ? dontAnimate2[key1] = value1 : animate[key1] = value1);
|
|
187
202
|
}
|
|
188
203
|
}
|
|
189
|
-
componentState.unmounted === "should-enter"
|
|
204
|
+
if (componentState.unmounted === "should-enter") for (var key2 in style) {
|
|
205
|
+
var rawValue2 = style[key2],
|
|
206
|
+
value2 = resolveDynamicValue(rawValue2, isDark);
|
|
207
|
+
value2 !== void 0 && (dontAnimate2[key2] = value2);
|
|
208
|
+
}
|
|
190
209
|
var styles = animate,
|
|
191
210
|
isExiting = !!presence?.[1],
|
|
192
211
|
usePresenceValue = presence || void 0,
|
|
@@ -197,9 +216,9 @@ function createAnimations(animations) {
|
|
|
197
216
|
hasClonedTransition = !1;
|
|
198
217
|
if (Array.isArray(props.animation)) {
|
|
199
218
|
var config = props.animation[1];
|
|
200
|
-
if (config && (typeof config > "u" ? "undefined" : _type_of(config)) === "object") for (var
|
|
201
|
-
var val = config[
|
|
202
|
-
hasClonedTransition || (transition = Object.assign({}, transition), hasClonedTransition = !0), typeof val == "string" ? transition[
|
|
219
|
+
if (config && (typeof config > "u" ? "undefined" : _type_of(config)) === "object") for (var key3 in config) {
|
|
220
|
+
var val = config[key3];
|
|
221
|
+
hasClonedTransition || (transition = Object.assign({}, transition), hasClonedTransition = !0), typeof val == "string" ? transition[key3] = animations[val] : transition[key3] = val;
|
|
203
222
|
}
|
|
204
223
|
}
|
|
205
224
|
return {
|
|
@@ -214,7 +233,7 @@ function createAnimations(animations) {
|
|
|
214
233
|
exit: isExiting ? styles : void 0
|
|
215
234
|
}
|
|
216
235
|
};
|
|
217
|
-
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext]),
|
|
236
|
+
}, [presenceContext, presence, animationKey, componentState.unmounted, JSON.stringify(style), presenceContext, isDark]),
|
|
218
237
|
moti = useMotify(motiProps);
|
|
219
238
|
return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {
|
|
220
239
|
"componentState.unmounted": componentState.unmounted,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["jsx","_jsx","PresenceContext","ResetPresence","usePresence","getSplitStyles","hooks","isWeb","Text","useComposedRefs","useThemeWithState","View","useMotify","React","forwardRef","useMemo","useRef","Animated_","cancelAnimation","runOnJS","useAnimatedReaction","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","withTiming","_type_of","obj","Symbol","constructor","safeESModule","a","b","out","__esModule","toStringTag","default","Animated","createTamaguiAnimatedComponent","defaultTag","arguments","length","isText","Component","createAnimatedComponent","propsIn","ref","_hooks_usePropsTransform","forwardedRef","animation","tag","propsRest","hostRef","composedRefs","stateRef","current","host","_","state","result","staticConfig","theme","name","unmounted","isAnimated","noClass","props","viewProps","Element","transformedProps","usePropsTransform","call","acceptTagProp","AnimatedView","AnimatedText","onlyAnimateKeys","transform","opacity","height","width","backgroundColor","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth","color","left","right","top","bottom","fontSize","fontWeight","lineHeight","letterSpacing","createAnimations","animations","isReactNative","supportsCSS","useAnimatedNumber","initial","sharedValue","getInstance","getValue","
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","PresenceContext","ResetPresence","usePresence","getSplitStyles","hooks","isWeb","Text","useComposedRefs","useThemeWithState","View","useMotify","React","forwardRef","useMemo","useRef","Animated_","cancelAnimation","runOnJS","useAnimatedReaction","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","withTiming","_type_of","obj","Symbol","constructor","resolveDynamicValue","value","isDark","dynamicValue","dynamic","dark","light","safeESModule","a","b","out","__esModule","toStringTag","default","Animated","createTamaguiAnimatedComponent","defaultTag","arguments","length","isText","Component","createAnimatedComponent","propsIn","ref","_hooks_usePropsTransform","forwardedRef","animation","tag","propsRest","hostRef","composedRefs","stateRef","current","host","_","state","result","staticConfig","theme","name","unmounted","isAnimated","noClass","props","viewProps","Element","transformedProps","usePropsTransform","call","acceptTagProp","AnimatedView","AnimatedText","onlyAnimateKeys","transform","opacity","height","width","backgroundColor","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth","color","left","right","top","bottom","fontSize","fontWeight","lineHeight","letterSpacing","createAnimations","animations","isReactNative","supportsCSS","useAnimatedNumber","initial","sharedValue","getInstance","getValue","setValue","next","config","type","onFinish","stop","useAnimatedNumberReaction","param","onValue","instance","prev","useAnimatedNumberStyle","val","getStyle","derivedValue","useAnimations","animationProps","_themeState_name","presence","style","componentState","animationKey","Array","isArray","isHydrating","disableAnimation","presenceContext","useContext","themeState","scheme","startsWith","dontAnimate","motiProps","animate","dontAnimate2","key","rawValue","animateOnly","key1","rawValue1","value1","includes","key2","rawValue2","value2","styles","isExiting","usePresenceValue","transition","duration","hasClonedTransition","key3","Object","assign","exit","JSON","stringify","moti"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/animations-moti",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0-001",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"source": "src/index.ts",
|
|
6
6
|
"license": "MIT",
|
|
@@ -32,12 +32,12 @@
|
|
|
32
32
|
}
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@tamagui/core": "
|
|
36
|
-
"@tamagui/use-presence": "
|
|
35
|
+
"@tamagui/core": "2.0.0-001",
|
|
36
|
+
"@tamagui/use-presence": "2.0.0-001",
|
|
37
37
|
"moti": "^0.30.0"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@tamagui/build": "
|
|
40
|
+
"@tamagui/build": "2.0.0-001",
|
|
41
41
|
"react": "*",
|
|
42
42
|
"react-native": "0.81.5",
|
|
43
43
|
"react-native-reanimated": "~4.1.1"
|
package/src/createAnimations.tsx
CHANGED
|
@@ -11,6 +11,15 @@ import {
|
|
|
11
11
|
type AnimationDriver,
|
|
12
12
|
type UniversalAnimatedNumber,
|
|
13
13
|
} from '@tamagui/core'
|
|
14
|
+
|
|
15
|
+
// Helper to resolve dynamic theme values like {dynamic: {dark: "value", light: undefined}}
|
|
16
|
+
const resolveDynamicValue = (value: any, isDark: boolean): any => {
|
|
17
|
+
if (value && typeof value === 'object' && 'dynamic' in value) {
|
|
18
|
+
const dynamicValue = isDark ? value.dynamic.dark : value.dynamic.light
|
|
19
|
+
return dynamicValue
|
|
20
|
+
}
|
|
21
|
+
return value
|
|
22
|
+
}
|
|
14
23
|
import type { TransitionConfig } from 'moti'
|
|
15
24
|
import { useMotify } from 'moti/author'
|
|
16
25
|
import type { CSSProperties } from 'react'
|
|
@@ -241,6 +250,9 @@ export function createAnimations<A extends Record<string, TransitionConfig>>(
|
|
|
241
250
|
const isHydrating = componentState.unmounted === true
|
|
242
251
|
const disableAnimation = isHydrating || !animationKey
|
|
243
252
|
const presenceContext = React.useContext(PresenceContext)
|
|
253
|
+
const [, themeState] = useThemeWithState({})
|
|
254
|
+
// Check scheme first, then fall back to checking theme name for 'dark'
|
|
255
|
+
const isDark = themeState?.scheme === 'dark' || themeState?.name?.startsWith('dark')
|
|
244
256
|
|
|
245
257
|
// this memo is very important for performance, there's a big cost to
|
|
246
258
|
// updating these values every render
|
|
@@ -249,11 +261,20 @@ export function createAnimations<A extends Record<string, TransitionConfig>>(
|
|
|
249
261
|
let dontAnimate = {}
|
|
250
262
|
|
|
251
263
|
if (disableAnimation) {
|
|
252
|
-
|
|
264
|
+
// Resolve dynamic objects based on current theme
|
|
265
|
+
for (const key in style) {
|
|
266
|
+
const rawValue = style[key]
|
|
267
|
+
const value = resolveDynamicValue(rawValue, isDark)
|
|
268
|
+
if (value === undefined) continue
|
|
269
|
+
dontAnimate[key] = value
|
|
270
|
+
}
|
|
253
271
|
} else {
|
|
254
272
|
const animateOnly = props.animateOnly as string[]
|
|
255
273
|
for (const key in style) {
|
|
256
|
-
const
|
|
274
|
+
const rawValue = style[key]
|
|
275
|
+
// Resolve dynamic theme values (like $theme-dark)
|
|
276
|
+
const value = resolveDynamicValue(rawValue, isDark)
|
|
277
|
+
if (value === undefined) continue
|
|
257
278
|
if (
|
|
258
279
|
!onlyAnimateKeys[key] ||
|
|
259
280
|
value === 'auto' ||
|
|
@@ -269,7 +290,13 @@ export function createAnimations<A extends Record<string, TransitionConfig>>(
|
|
|
269
290
|
|
|
270
291
|
// if we don't do this moti seems to flicker a frame before applying animation
|
|
271
292
|
if (componentState.unmounted === 'should-enter') {
|
|
272
|
-
|
|
293
|
+
// Resolve dynamic objects based on current theme
|
|
294
|
+
for (const key in style) {
|
|
295
|
+
const rawValue = style[key]
|
|
296
|
+
const value = resolveDynamicValue(rawValue, isDark)
|
|
297
|
+
if (value === undefined) continue
|
|
298
|
+
dontAnimate[key] = value
|
|
299
|
+
}
|
|
273
300
|
}
|
|
274
301
|
|
|
275
302
|
const styles = animate
|
|
@@ -325,6 +352,7 @@ export function createAnimations<A extends Record<string, TransitionConfig>>(
|
|
|
325
352
|
componentState.unmounted,
|
|
326
353
|
JSON.stringify(style),
|
|
327
354
|
presenceContext,
|
|
355
|
+
isDark,
|
|
328
356
|
])
|
|
329
357
|
|
|
330
358
|
const moti = useMotify(motiProps)
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
|
-
"mappings": "AAEA,cAQO,uBAEA;
|
|
2
|
+
"mappings": "AAEA,cAQO,uBAEA;AAUP,cAAc,wBAAwB;AAwHtC,OAAO,iBAAS,iBAAiB,UAAU,eAAe,mBACxD,YAAY,IACX,gBAAgB",
|
|
3
3
|
"names": [],
|
|
4
4
|
"sources": [
|
|
5
5
|
"src/createAnimations.tsx"
|
|
6
6
|
],
|
|
7
7
|
"sourcesContent": [
|
|
8
|
-
"import { PresenceContext, ResetPresence, usePresence } from '@tamagui/use-presence'\n// we need core for hooks.usePropsTransform\nimport {\n getSplitStyles,\n hooks,\n isWeb,\n Text,\n useComposedRefs,\n useThemeWithState,\n View,\n type AnimationDriver,\n type UniversalAnimatedNumber,\n} from '@tamagui/core'\nimport type { TransitionConfig } from 'moti'\nimport { useMotify } from 'moti/author'\nimport type { CSSProperties } from 'react'\nimport React, { forwardRef, useMemo, useRef } from 'react'\nimport type { TextStyle } from 'react-native'\nimport type { SharedValue } from 'react-native-reanimated'\nimport Animated_, {\n cancelAnimation,\n runOnJS,\n useAnimatedReaction,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withSpring,\n withTiming,\n} from 'react-native-reanimated'\n\n// fix for building with type module\n// see https://github.com/evanw/esbuild/issues/2480#issuecomment-1833104754\nconst safeESModule = <T,>(a: T | { default: T }): T => {\n const b = a as any\n const out = b.__esModule || b[Symbol.toStringTag] === 'Module' ? b.default : b\n // add metro support\n return out || a\n}\n\nconst Animated = safeESModule(Animated_)\n\ntype ReanimatedAnimatedNumber = SharedValue<number>\n\n// this is our own custom reanimated animated component so we can allow data- attributes, className etc\n// this should ultimately be merged with react-native-web-lite\n\nfunction createTamaguiAnimatedComponent(defaultTag = 'div') {\n const isText = defaultTag === 'span'\n\n const Component = Animated.createAnimatedComponent(\n forwardRef((propsIn: any, ref) => {\n const { forwardedRef, animation, tag = defaultTag, ...propsRest } = propsIn\n const hostRef = useRef(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, hostRef)\n const stateRef = useRef<any>(null)\n if (!stateRef.current) {\n stateRef.current = {\n get host() {\n return hostRef.current\n },\n }\n }\n\n const [_, state] = useThemeWithState({})\n\n // get styles but only inline style\n const result = getSplitStyles(\n propsRest,\n isText ? Text.staticConfig : View.staticConfig,\n state?.theme!,\n state?.name!,\n {\n unmounted: false,\n } as any,\n {\n isAnimated: false,\n noClass: true,\n }\n )\n\n const props = result?.viewProps || {}\n const Element = tag\n const transformedProps = hooks.usePropsTransform?.(tag, props, stateRef, false)\n\n return <Element {...transformedProps} ref={composedRefs} />\n })\n )\n Component['acceptTagProp'] = true\n return Component\n}\n\nconst AnimatedView = createTamaguiAnimatedComponent('div')\nconst AnimatedText = createTamaguiAnimatedComponent('span')\n\n// const AnimatedView = styled(View, {\n// disableClassName: true,\n// })\n\n// const AnimatedText = styled(Text, {\n// disableClassName: true,\n// })\n\nconst onlyAnimateKeys: { [key in keyof TextStyle | keyof CSSProperties]?: boolean } = {\n transform: true,\n opacity: true,\n height: true,\n width: true,\n backgroundColor: true,\n borderColor: true,\n borderLeftColor: true,\n borderRightColor: true,\n borderTopColor: true,\n borderBottomColor: true,\n borderRadius: true,\n borderTopLeftRadius: true,\n borderTopRightRadius: true,\n borderBottomLeftRadius: true,\n borderBottomRightRadius: true,\n borderLeftWidth: true,\n borderRightWidth: true,\n borderTopWidth: true,\n borderBottomWidth: true,\n color: true,\n left: true,\n right: true,\n top: true,\n bottom: true,\n fontSize: true,\n fontWeight: true,\n lineHeight: true,\n letterSpacing: true,\n}\n\nexport function createAnimations<A extends Record<string, TransitionConfig>>(\n animations: A\n): AnimationDriver<A> {\n return {\n View: isWeb ? AnimatedView : Animated.View,\n Text: isWeb ? AnimatedText : Animated.Text,\n // View: Animated.View,\n // Text: Animated.Text,\n isReactNative: true,\n supportsCSS: false,\n animations,\n usePresence,\n ResetPresence,\n\n useAnimatedNumber(initial): UniversalAnimatedNumber<ReanimatedAnimatedNumber> {\n const sharedValue = useSharedValue(initial)\n\n return React.useMemo(\n () => ({\n getInstance() {\n 'worklet'\n return sharedValue\n },\n getValue() {\n 'worklet'\n return sharedValue.value\n },\n setValue(next, config = { type: 'spring' }, onFinish) {\n 'worklet'\n if (config.type === 'direct') {\n sharedValue.value = next\n onFinish?.()\n } else if (config.type === 'spring') {\n sharedValue.value = withSpring(\n next,\n config,\n onFinish\n ? () => {\n 'worklet'\n runOnJS(onFinish)()\n }\n : undefined\n )\n } else {\n sharedValue.value = withTiming(\n next,\n config,\n onFinish\n ? () => {\n 'worklet'\n runOnJS(onFinish)()\n }\n : undefined\n )\n }\n },\n stop() {\n 'worklet'\n cancelAnimation(sharedValue)\n },\n }),\n [sharedValue]\n )\n },\n\n useAnimatedNumberReaction({ value }, onValue) {\n const instance = value.getInstance()\n return useAnimatedReaction(\n () => {\n return instance.value\n },\n (next, prev) => {\n if (prev !== next) {\n // @nate what is the point of this hook? is this necessary?\n // without runOnJS, onValue would need to be a worklet\n runOnJS(onValue)(next)\n }\n },\n // dependency array is very important here\n [onValue, instance]\n )\n },\n\n /**\n * `getStyle` must be a worklet\n */\n useAnimatedNumberStyle(val, getStyle) {\n const instance = val.getInstance()\n\n // this seems wrong but it works\n const derivedValue = useDerivedValue(() => {\n return instance.value\n // dependency array is very important here\n }, [instance, getStyle])\n\n return useAnimatedStyle(() => {\n return getStyle(derivedValue.value)\n // dependency array is very important here\n }, [val, getStyle, derivedValue, instance])\n },\n\n useAnimations: (animationProps) => {\n const { props, presence, style, componentState } = animationProps\n const animationKey = Array.isArray(props.animation)\n ? props.animation[0]\n : props.animation\n\n const isHydrating = componentState.unmounted === true\n const disableAnimation = isHydrating || !animationKey\n const presenceContext = React.useContext(PresenceContext)\n\n // this memo is very important for performance, there's a big cost to\n // updating these values every render\n const { dontAnimate, motiProps } = useMemo(() => {\n let animate = {}\n let dontAnimate = {}\n\n if (disableAnimation) {\n dontAnimate = style\n } else {\n const animateOnly = props.animateOnly as string[]\n for (const key in style) {\n const value = style[key]\n if (\n !onlyAnimateKeys[key] ||\n value === 'auto' ||\n (typeof value === 'string' && value.startsWith('calc')) ||\n (animateOnly && !animateOnly.includes(key))\n ) {\n dontAnimate[key] = value\n } else {\n animate[key] = value\n }\n }\n }\n\n // if we don't do this moti seems to flicker a frame before applying animation\n if (componentState.unmounted === 'should-enter') {\n dontAnimate = style\n }\n\n const styles = animate\n const isExiting = Boolean(presence?.[1])\n const usePresenceValue = (presence || undefined) as any\n\n type UseMotiProps = Parameters<typeof useMotify>[0]\n\n // TODO moti is giving us type troubles, but this should work\n let transition = isHydrating\n ? { type: 'transition', duration: 0 }\n : (animations[animationKey as keyof typeof animations] as any)\n\n let hasClonedTransition = false\n\n if (Array.isArray(props.animation)) {\n const config = props.animation[1]\n if (config && typeof config === 'object') {\n for (const key in config) {\n const val = config[key]\n\n // performance - this seems to have (strangely) huge performance effect in uniswap\n // so instead of cloning up front, we clone only when we absolutely have to\n if (!hasClonedTransition) {\n transition = Object.assign({}, transition)\n hasClonedTransition = true\n }\n\n // referencing a pre-defined config\n if (typeof val === 'string') {\n transition[key] = animations[val]\n } else {\n transition[key] = val\n }\n }\n }\n }\n\n return {\n dontAnimate,\n motiProps: {\n animate: isExiting || componentState.unmounted === true ? {} : styles,\n transition: componentState.unmounted ? { duration: 0 } : transition,\n usePresenceValue,\n presenceContext,\n exit: isExiting ? styles : undefined,\n } satisfies UseMotiProps,\n }\n }, [\n presenceContext,\n presence,\n animationKey,\n componentState.unmounted,\n JSON.stringify(style),\n presenceContext,\n ])\n\n const moti = useMotify(motiProps)\n\n if (\n process.env.NODE_ENV === 'development' &&\n props['debug'] &&\n props['debug'] !== 'profile'\n ) {\n console.info(`useMotify(`, JSON.stringify(motiProps, null, 2) + ')', {\n 'componentState.unmounted': componentState.unmounted,\n animationProps,\n motiProps,\n moti,\n style: [dontAnimate, moti.style],\n })\n }\n\n return {\n style: [dontAnimate, moti.style],\n }\n },\n }\n}\n"
|
|
8
|
+
"import { PresenceContext, ResetPresence, usePresence } from '@tamagui/use-presence'\n// we need core for hooks.usePropsTransform\nimport {\n getSplitStyles,\n hooks,\n isWeb,\n Text,\n useComposedRefs,\n useThemeWithState,\n View,\n type AnimationDriver,\n type UniversalAnimatedNumber,\n} from '@tamagui/core'\n\n// Helper to resolve dynamic theme values like {dynamic: {dark: \"value\", light: undefined}}\nconst resolveDynamicValue = (value: any, isDark: boolean): any => {\n if (value && typeof value === 'object' && 'dynamic' in value) {\n const dynamicValue = isDark ? value.dynamic.dark : value.dynamic.light\n return dynamicValue\n }\n return value\n}\nimport type { TransitionConfig } from 'moti'\nimport { useMotify } from 'moti/author'\nimport type { CSSProperties } from 'react'\nimport React, { forwardRef, useMemo, useRef } from 'react'\nimport type { TextStyle } from 'react-native'\nimport type { SharedValue } from 'react-native-reanimated'\nimport Animated_, {\n cancelAnimation,\n runOnJS,\n useAnimatedReaction,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withSpring,\n withTiming,\n} from 'react-native-reanimated'\n\n// fix for building with type module\n// see https://github.com/evanw/esbuild/issues/2480#issuecomment-1833104754\nconst safeESModule = <T,>(a: T | { default: T }): T => {\n const b = a as any\n const out = b.__esModule || b[Symbol.toStringTag] === 'Module' ? b.default : b\n // add metro support\n return out || a\n}\n\nconst Animated = safeESModule(Animated_)\n\ntype ReanimatedAnimatedNumber = SharedValue<number>\n\n// this is our own custom reanimated animated component so we can allow data- attributes, className etc\n// this should ultimately be merged with react-native-web-lite\n\nfunction createTamaguiAnimatedComponent(defaultTag = 'div') {\n const isText = defaultTag === 'span'\n\n const Component = Animated.createAnimatedComponent(\n forwardRef((propsIn: any, ref) => {\n const { forwardedRef, animation, tag = defaultTag, ...propsRest } = propsIn\n const hostRef = useRef(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, hostRef)\n const stateRef = useRef<any>(null)\n if (!stateRef.current) {\n stateRef.current = {\n get host() {\n return hostRef.current\n },\n }\n }\n\n const [_, state] = useThemeWithState({})\n\n // get styles but only inline style\n const result = getSplitStyles(\n propsRest,\n isText ? Text.staticConfig : View.staticConfig,\n state?.theme!,\n state?.name!,\n {\n unmounted: false,\n } as any,\n {\n isAnimated: false,\n noClass: true,\n }\n )\n\n const props = result?.viewProps || {}\n const Element = tag\n const transformedProps = hooks.usePropsTransform?.(tag, props, stateRef, false)\n\n return <Element {...transformedProps} ref={composedRefs} />\n })\n )\n Component['acceptTagProp'] = true\n return Component\n}\n\nconst AnimatedView = createTamaguiAnimatedComponent('div')\nconst AnimatedText = createTamaguiAnimatedComponent('span')\n\n// const AnimatedView = styled(View, {\n// disableClassName: true,\n// })\n\n// const AnimatedText = styled(Text, {\n// disableClassName: true,\n// })\n\nconst onlyAnimateKeys: { [key in keyof TextStyle | keyof CSSProperties]?: boolean } = {\n transform: true,\n opacity: true,\n height: true,\n width: true,\n backgroundColor: true,\n borderColor: true,\n borderLeftColor: true,\n borderRightColor: true,\n borderTopColor: true,\n borderBottomColor: true,\n borderRadius: true,\n borderTopLeftRadius: true,\n borderTopRightRadius: true,\n borderBottomLeftRadius: true,\n borderBottomRightRadius: true,\n borderLeftWidth: true,\n borderRightWidth: true,\n borderTopWidth: true,\n borderBottomWidth: true,\n color: true,\n left: true,\n right: true,\n top: true,\n bottom: true,\n fontSize: true,\n fontWeight: true,\n lineHeight: true,\n letterSpacing: true,\n}\n\nexport function createAnimations<A extends Record<string, TransitionConfig>>(\n animations: A\n): AnimationDriver<A> {\n return {\n View: isWeb ? AnimatedView : Animated.View,\n Text: isWeb ? AnimatedText : Animated.Text,\n // View: Animated.View,\n // Text: Animated.Text,\n isReactNative: true,\n supportsCSS: false,\n animations,\n usePresence,\n ResetPresence,\n\n useAnimatedNumber(initial): UniversalAnimatedNumber<ReanimatedAnimatedNumber> {\n const sharedValue = useSharedValue(initial)\n\n return React.useMemo(\n () => ({\n getInstance() {\n 'worklet'\n return sharedValue\n },\n getValue() {\n 'worklet'\n return sharedValue.value\n },\n setValue(next, config = { type: 'spring' }, onFinish) {\n 'worklet'\n if (config.type === 'direct') {\n sharedValue.value = next\n onFinish?.()\n } else if (config.type === 'spring') {\n sharedValue.value = withSpring(\n next,\n config,\n onFinish\n ? () => {\n 'worklet'\n runOnJS(onFinish)()\n }\n : undefined\n )\n } else {\n sharedValue.value = withTiming(\n next,\n config,\n onFinish\n ? () => {\n 'worklet'\n runOnJS(onFinish)()\n }\n : undefined\n )\n }\n },\n stop() {\n 'worklet'\n cancelAnimation(sharedValue)\n },\n }),\n [sharedValue]\n )\n },\n\n useAnimatedNumberReaction({ value }, onValue) {\n const instance = value.getInstance()\n return useAnimatedReaction(\n () => {\n return instance.value\n },\n (next, prev) => {\n if (prev !== next) {\n // @nate what is the point of this hook? is this necessary?\n // without runOnJS, onValue would need to be a worklet\n runOnJS(onValue)(next)\n }\n },\n // dependency array is very important here\n [onValue, instance]\n )\n },\n\n /**\n * `getStyle` must be a worklet\n */\n useAnimatedNumberStyle(val, getStyle) {\n const instance = val.getInstance()\n\n // this seems wrong but it works\n const derivedValue = useDerivedValue(() => {\n return instance.value\n // dependency array is very important here\n }, [instance, getStyle])\n\n return useAnimatedStyle(() => {\n return getStyle(derivedValue.value)\n // dependency array is very important here\n }, [val, getStyle, derivedValue, instance])\n },\n\n useAnimations: (animationProps) => {\n const { props, presence, style, componentState } = animationProps\n const animationKey = Array.isArray(props.animation)\n ? props.animation[0]\n : props.animation\n\n const isHydrating = componentState.unmounted === true\n const disableAnimation = isHydrating || !animationKey\n const presenceContext = React.useContext(PresenceContext)\n const [, themeState] = useThemeWithState({})\n // Check scheme first, then fall back to checking theme name for 'dark'\n const isDark = themeState?.scheme === 'dark' || themeState?.name?.startsWith('dark')\n\n // this memo is very important for performance, there's a big cost to\n // updating these values every render\n const { dontAnimate, motiProps } = useMemo(() => {\n let animate = {}\n let dontAnimate = {}\n\n if (disableAnimation) {\n // Resolve dynamic objects based on current theme\n for (const key in style) {\n const rawValue = style[key]\n const value = resolveDynamicValue(rawValue, isDark)\n if (value === undefined) continue\n dontAnimate[key] = value\n }\n } else {\n const animateOnly = props.animateOnly as string[]\n for (const key in style) {\n const rawValue = style[key]\n // Resolve dynamic theme values (like $theme-dark)\n const value = resolveDynamicValue(rawValue, isDark)\n if (value === undefined) continue\n if (\n !onlyAnimateKeys[key] ||\n value === 'auto' ||\n (typeof value === 'string' && value.startsWith('calc')) ||\n (animateOnly && !animateOnly.includes(key))\n ) {\n dontAnimate[key] = value\n } else {\n animate[key] = value\n }\n }\n }\n\n // if we don't do this moti seems to flicker a frame before applying animation\n if (componentState.unmounted === 'should-enter') {\n // Resolve dynamic objects based on current theme\n for (const key in style) {\n const rawValue = style[key]\n const value = resolveDynamicValue(rawValue, isDark)\n if (value === undefined) continue\n dontAnimate[key] = value\n }\n }\n\n const styles = animate\n const isExiting = Boolean(presence?.[1])\n const usePresenceValue = (presence || undefined) as any\n\n type UseMotiProps = Parameters<typeof useMotify>[0]\n\n // TODO moti is giving us type troubles, but this should work\n let transition = isHydrating\n ? { type: 'transition', duration: 0 }\n : (animations[animationKey as keyof typeof animations] as any)\n\n let hasClonedTransition = false\n\n if (Array.isArray(props.animation)) {\n const config = props.animation[1]\n if (config && typeof config === 'object') {\n for (const key in config) {\n const val = config[key]\n\n // performance - this seems to have (strangely) huge performance effect in uniswap\n // so instead of cloning up front, we clone only when we absolutely have to\n if (!hasClonedTransition) {\n transition = Object.assign({}, transition)\n hasClonedTransition = true\n }\n\n // referencing a pre-defined config\n if (typeof val === 'string') {\n transition[key] = animations[val]\n } else {\n transition[key] = val\n }\n }\n }\n }\n\n return {\n dontAnimate,\n motiProps: {\n animate: isExiting || componentState.unmounted === true ? {} : styles,\n transition: componentState.unmounted ? { duration: 0 } : transition,\n usePresenceValue,\n presenceContext,\n exit: isExiting ? styles : undefined,\n } satisfies UseMotiProps,\n }\n }, [\n presenceContext,\n presence,\n animationKey,\n componentState.unmounted,\n JSON.stringify(style),\n presenceContext,\n isDark,\n ])\n\n const moti = useMotify(motiProps)\n\n if (\n process.env.NODE_ENV === 'development' &&\n props['debug'] &&\n props['debug'] !== 'profile'\n ) {\n console.info(`useMotify(`, JSON.stringify(motiProps, null, 2) + ')', {\n 'componentState.unmounted': componentState.unmounted,\n animationProps,\n motiProps,\n moti,\n style: [dontAnimate, moti.style],\n })\n }\n\n return {\n style: [dontAnimate, moti.style],\n }\n },\n }\n}\n"
|
|
9
9
|
],
|
|
10
10
|
"version": 3
|
|
11
11
|
}
|