@tamagui/animations-css 1.88.0 → 1.88.2
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.js +4 -8
- package/dist/cjs/createAnimations.js.map +1 -1
- package/dist/cjs/index.js +0 -4
- package/dist/esm/createAnimations.native.js +34 -18
- package/dist/esm/createAnimations.native.js.map +1 -1
- package/dist/esm/index.native.js +19 -1
- package/dist/esm/index.native.js.map +1 -1
- package/package.json +6 -6
|
@@ -52,7 +52,7 @@ function createAnimations(animations) {
|
|
|
52
52
|
reactionListeners.set(instance, next), queue = next;
|
|
53
53
|
}
|
|
54
54
|
return queue.add(onValue), () => {
|
|
55
|
-
queue
|
|
55
|
+
queue?.delete(onValue);
|
|
56
56
|
};
|
|
57
57
|
}, []);
|
|
58
58
|
},
|
|
@@ -60,26 +60,22 @@ function createAnimations(animations) {
|
|
|
60
60
|
return getStyle(val.getValue());
|
|
61
61
|
},
|
|
62
62
|
useAnimations: ({ props, presence, style, componentState, stateRef }) => {
|
|
63
|
-
const isEntering = !!componentState.unmounted, isExiting =
|
|
63
|
+
const isEntering = !!componentState.unmounted, isExiting = presence?.[0] === !1, sendExitComplete = presence?.[1], [animationKey, animationConfig] = [].concat(props.animation), animation = animations[animationKey], keys = props.animateOnly ?? ["all"];
|
|
64
64
|
return (0, import_constants.useIsomorphicLayoutEffect)(() => {
|
|
65
65
|
const host = stateRef.current.host;
|
|
66
66
|
if (!sendExitComplete || !isExiting || !host)
|
|
67
67
|
return;
|
|
68
68
|
const node = host, onFinishAnimation = () => {
|
|
69
|
-
sendExitComplete
|
|
69
|
+
sendExitComplete?.();
|
|
70
70
|
};
|
|
71
71
|
return node.addEventListener("transitionend", onFinishAnimation), node.addEventListener("transitioncancel", onFinishAnimation), () => {
|
|
72
72
|
node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
|
|
73
73
|
};
|
|
74
74
|
}, [sendExitComplete, isExiting]), animation ? (Array.isArray(style.transform) && (style.transform = (0, import_core.transformsToString)(style.transform)), style.transition = keys.map((key) => {
|
|
75
|
-
const override = animations[animationConfig
|
|
75
|
+
const override = animations[animationConfig?.[key]] ?? animation;
|
|
76
76
|
return `${key} ${override}`;
|
|
77
77
|
}).join(", "), process.env.NODE_ENV === "development" && props.debug && console.info("CSS animation", style, style.transition, { isEntering, isExiting }), { style }) : null;
|
|
78
78
|
}
|
|
79
79
|
};
|
|
80
80
|
}
|
|
81
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
82
|
-
0 && (module.exports = {
|
|
83
|
-
createAnimations
|
|
84
|
-
});
|
|
85
81
|
//# sourceMappingURL=createAnimations.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createAnimations.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAA0C,+BAC1C,cAIO,0BAEP,sBAA2C,kCAC3C,eAAoC;AAE7B,SAAS,iBAAmC,YAAmC;AACpF,QAAM,oBAAoB,oBAAI,QAA4B;AAE1D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IAEjB,kBAAkB,SAA4C;AAC5D,YAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,OAAO;AAEtC,aAAO;AAAA,QACL,cAAc;AACZ,iBAAO;AAAA,QACT;AAAA,QACA,WAAW;AACT,iBAAO;AAAA,QACT;AAAA,QACA,SAAS,MAAM;AACb,iBAAO,IAAI;AACX,gBAAM,YAAY,kBAAkB,IAAI,MAAM;AAC9C,UAAI,aACF,UAAU,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;AAAA,QAEtC;AAAA,QACA,OAAO;AAAA,QAAC;AAAA,MACV;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,kCAAU,MAAM;AACd,cAAM,WAAW,MAAM,YAAY;AACnC,YAAI,QAAQ,kBAAkB,IAAI,QAAQ;AAC1C,YAAI,CAAC,OAAO;AACV,gBAAM,OAAO,oBAAI,IAAc;AAC/B,4BAAkB,IAAI,UAAU,IAAI,GACpC,QAAQ;AAAA,QACV;AACA,qBAAM,IAAI,OAAO,GACV,MAAM;AACX,
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAA0C,+BAC1C,cAIO,0BAEP,sBAA2C,kCAC3C,eAAoC;AAE7B,SAAS,iBAAmC,YAAmC;AACpF,QAAM,oBAAoB,oBAAI,QAA4B;AAE1D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IAEjB,kBAAkB,SAA4C;AAC5D,YAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,OAAO;AAEtC,aAAO;AAAA,QACL,cAAc;AACZ,iBAAO;AAAA,QACT;AAAA,QACA,WAAW;AACT,iBAAO;AAAA,QACT;AAAA,QACA,SAAS,MAAM;AACb,iBAAO,IAAI;AACX,gBAAM,YAAY,kBAAkB,IAAI,MAAM;AAC9C,UAAI,aACF,UAAU,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;AAAA,QAEtC;AAAA,QACA,OAAO;AAAA,QAAC;AAAA,MACV;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,kCAAU,MAAM;AACd,cAAM,WAAW,MAAM,YAAY;AACnC,YAAI,QAAQ,kBAAkB,IAAI,QAAQ;AAC1C,YAAI,CAAC,OAAO;AACV,gBAAM,OAAO,oBAAI,IAAc;AAC/B,4BAAkB,IAAI,UAAU,IAAI,GACpC,QAAQ;AAAA,QACV;AACA,qBAAM,IAAI,OAAO,GACV,MAAM;AACX,iBAAO,OAAO,OAAO;AAAA,QACvB;AAAA,MACF,GAAG,CAAC,CAAC;AAAA,IACP;AAAA,IAEA,uBAAuB,KAAK,UAAU;AACpC,aAAO,SAAS,IAAI,SAAS,CAAC;AAAA,IAChC;AAAA,IAEA,eAAe,CAAC,EAAE,OAAO,UAAU,OAAO,gBAAgB,SAAS,MAAM;AACvE,YAAM,aAAa,CAAC,CAAC,eAAe,WAC9B,YAAY,WAAW,CAAC,MAAM,IAC9B,mBAAmB,WAAW,CAAC,GAE/B,CAAC,cAAc,eAAe,IAAI,CAAC,EAAE,OAAO,MAAM,SAAS,GAC3D,YAAY,WAAW,YAAY,GACnC,OAAO,MAAM,eAAe,CAAC,KAAK;AAkDxC,iBAhDA,4CAA0B,MAAM;AAC9B,cAAM,OAAO,SAAS,QAAQ;AAC9B,YAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC;AAAM;AAC9C,cAAM,OAAO,MACP,oBAAoB,MAAM;AAC9B,6BAAmB;AAAA,QACrB;AACA,oBAAK,iBAAiB,iBAAiB,iBAAiB,GACxD,KAAK,iBAAiB,oBAAoB,iBAAiB,GACpD,MAAM;AACX,eAAK,oBAAoB,iBAAiB,iBAAiB,GAC3D,KAAK,oBAAoB,oBAAoB,iBAAiB;AAAA,QAChE;AAAA,MACF,GAAG,CAAC,kBAAkB,SAAS,CAAC,GAmC3B,aAID,MAAM,QAAQ,MAAM,SAAS,MAC/B,MAAM,gBAAY,gCAAmB,MAAM,SAAS,IAMtD,MAAM,aAAa,KAChB,IAAI,CAAC,QAAQ;AACZ,cAAM,WAAW,WAAW,kBAAkB,GAAG,CAAC,KAAK;AACvD,eAAO,GAAG,GAAG,IAAI,QAAQ;AAAA,MAC3B,CAAC,EACA,KAAK,IAAI,GAMR,QAAQ,IAAI,aAAa,iBAAiB,MAAM,SAClD,QAAQ,KAAK,iBAAiB,OAAO,MAAM,YAAY,EAAE,YAAY,UAAU,CAAC,GAG3E,EAAE,MAAM,KAzBN;AAAA,IA0BX;AAAA,EACF;AACF;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -12,8 +12,4 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0
|
|
|
12
12
|
var src_exports = {};
|
|
13
13
|
module.exports = __toCommonJS(src_exports);
|
|
14
14
|
__reExport(src_exports, require("./createAnimations"), module.exports);
|
|
15
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
16
|
-
0 && (module.exports = {
|
|
17
|
-
...require("./createAnimations")
|
|
18
|
-
});
|
|
19
15
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,18 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: !0 });
|
|
9
|
+
}, __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from == "object" || typeof from == "function")
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
!__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
13
|
+
return to;
|
|
14
|
+
};
|
|
15
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
|
|
16
|
+
var createAnimations_exports = {};
|
|
17
|
+
__export(createAnimations_exports, {
|
|
18
|
+
createAnimations: () => createAnimations
|
|
19
|
+
});
|
|
20
|
+
module.exports = __toCommonJS(createAnimations_exports);
|
|
21
|
+
var import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_use_presence = require("@tamagui/use-presence"), import_react = require("react");
|
|
7
22
|
function createAnimations(animations) {
|
|
8
23
|
const reactionListeners = /* @__PURE__ */ new WeakMap();
|
|
9
24
|
return {
|
|
10
25
|
animations,
|
|
11
|
-
usePresence,
|
|
12
|
-
ResetPresence,
|
|
26
|
+
usePresence: import_use_presence.usePresence,
|
|
27
|
+
ResetPresence: import_use_presence.ResetPresence,
|
|
13
28
|
supportsCSSVars: !0,
|
|
14
29
|
useAnimatedNumber(initial) {
|
|
15
|
-
const [val, setVal] = useState(initial);
|
|
30
|
+
const [val, setVal] = (0, import_react.useState)(initial);
|
|
16
31
|
return {
|
|
17
32
|
getInstance() {
|
|
18
33
|
return setVal;
|
|
@@ -30,7 +45,7 @@ function createAnimations(animations) {
|
|
|
30
45
|
};
|
|
31
46
|
},
|
|
32
47
|
useAnimatedNumberReaction({ value }, onValue) {
|
|
33
|
-
useEffect(() => {
|
|
48
|
+
(0, import_react.useEffect)(() => {
|
|
34
49
|
const instance = value.getInstance();
|
|
35
50
|
let queue = reactionListeners.get(instance);
|
|
36
51
|
if (!queue) {
|
|
@@ -38,7 +53,7 @@ function createAnimations(animations) {
|
|
|
38
53
|
reactionListeners.set(instance, next), queue = next;
|
|
39
54
|
}
|
|
40
55
|
return queue.add(onValue), () => {
|
|
41
|
-
queue
|
|
56
|
+
queue == null || queue.delete(onValue);
|
|
42
57
|
};
|
|
43
58
|
}, []);
|
|
44
59
|
},
|
|
@@ -46,25 +61,26 @@ function createAnimations(animations) {
|
|
|
46
61
|
return getStyle(val.getValue());
|
|
47
62
|
},
|
|
48
63
|
useAnimations: ({ props, presence, style, componentState, stateRef }) => {
|
|
49
|
-
const isEntering = !!componentState.unmounted, isExiting = presence
|
|
50
|
-
return useIsomorphicLayoutEffect(() => {
|
|
64
|
+
const isEntering = !!componentState.unmounted, isExiting = (presence == null ? void 0 : presence[0]) === !1, sendExitComplete = presence == null ? void 0 : presence[1], [animationKey, animationConfig] = [].concat(props.animation), animation = animations[animationKey], keys = props.animateOnly ?? ["all"];
|
|
65
|
+
return (0, import_constants.useIsomorphicLayoutEffect)(() => {
|
|
51
66
|
const host = stateRef.current.host;
|
|
52
67
|
if (!sendExitComplete || !isExiting || !host)
|
|
53
68
|
return;
|
|
54
69
|
const node = host, onFinishAnimation = () => {
|
|
55
|
-
sendExitComplete
|
|
70
|
+
sendExitComplete == null || sendExitComplete();
|
|
56
71
|
};
|
|
57
72
|
return node.addEventListener("transitionend", onFinishAnimation), node.addEventListener("transitioncancel", onFinishAnimation), () => {
|
|
58
73
|
node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
|
|
59
74
|
};
|
|
60
|
-
}, [sendExitComplete, isExiting]), animation ? (Array.isArray(style.transform) && (style.transform = transformsToString(style.transform)), style.transition = keys.map((key) => {
|
|
61
|
-
const override = animations[animationConfig
|
|
75
|
+
}, [sendExitComplete, isExiting]), animation ? (Array.isArray(style.transform) && (style.transform = (0, import_core.transformsToString)(style.transform)), style.transition = keys.map((key) => {
|
|
76
|
+
const override = animations[animationConfig == null ? void 0 : animationConfig[key]] ?? animation;
|
|
62
77
|
return `${key} ${override}`;
|
|
63
78
|
}).join(", "), process.env.NODE_ENV === "development" && props.debug && console.info("CSS animation", style, style.transition, { isEntering, isExiting }), { style }) : null;
|
|
64
79
|
}
|
|
65
80
|
};
|
|
66
81
|
}
|
|
67
|
-
export
|
|
82
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
83
|
+
0 && (module.exports = {
|
|
68
84
|
createAnimations
|
|
69
|
-
};
|
|
85
|
+
});
|
|
70
86
|
//# sourceMappingURL=createAnimations.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createAnimations.tsx"],
|
|
4
|
-
"mappings": "AAAA
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAA0C,+BAC1C,cAIO,0BAEP,sBAA2C,kCAC3C,eAAoC;AAE7B,SAAS,iBAAmC,YAAmC;AACpF,QAAM,oBAAoB,oBAAI,QAA4B;AAE1D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IAEjB,kBAAkB,SAA4C;AAC5D,YAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,OAAO;AAEtC,aAAO;AAAA,QACL,cAAc;AACZ,iBAAO;AAAA,QACT;AAAA,QACA,WAAW;AACT,iBAAO;AAAA,QACT;AAAA,QACA,SAAS,MAAM;AACb,iBAAO,IAAI;AACX,gBAAM,YAAY,kBAAkB,IAAI,MAAM;AAC9C,UAAI,aACF,UAAU,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;AAAA,QAEtC;AAAA,QACA,OAAO;AAAA,QAAC;AAAA,MACV;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,kCAAU,MAAM;AACd,cAAM,WAAW,MAAM,YAAY;AACnC,YAAI,QAAQ,kBAAkB,IAAI,QAAQ;AAC1C,YAAI,CAAC,OAAO;AACV,gBAAM,OAAO,oBAAI,IAAc;AAC/B,4BAAkB,IAAI,UAAU,IAAI,GACpC,QAAQ;AAAA,QACV;AACA,qBAAM,IAAI,OAAO,GACV,MAAM;AACX,iCAAO,OAAO;AAAA,QAChB;AAAA,MACF,GAAG,CAAC,CAAC;AAAA,IACP;AAAA,IAEA,uBAAuB,KAAK,UAAU;AACpC,aAAO,SAAS,IAAI,SAAS,CAAC;AAAA,IAChC;AAAA,IAEA,eAAe,CAAC,EAAE,OAAO,UAAU,OAAO,gBAAgB,SAAS,MAAM;AACvE,YAAM,aAAa,CAAC,CAAC,eAAe,WAC9B,aAAY,qCAAW,QAAO,IAC9B,mBAAmB,qCAAW,IAE9B,CAAC,cAAc,eAAe,IAAI,CAAC,EAAE,OAAO,MAAM,SAAS,GAC3D,YAAY,WAAW,YAAY,GACnC,OAAO,MAAM,eAAe,CAAC,KAAK;AAkDxC,iBAhDA,4CAA0B,MAAM;AAC9B,cAAM,OAAO,SAAS,QAAQ;AAC9B,YAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC;AAAM;AAC9C,cAAM,OAAO,MACP,oBAAoB,MAAM;AAC9B;AAAA,QACF;AACA,oBAAK,iBAAiB,iBAAiB,iBAAiB,GACxD,KAAK,iBAAiB,oBAAoB,iBAAiB,GACpD,MAAM;AACX,eAAK,oBAAoB,iBAAiB,iBAAiB,GAC3D,KAAK,oBAAoB,oBAAoB,iBAAiB;AAAA,QAChE;AAAA,MACF,GAAG,CAAC,kBAAkB,SAAS,CAAC,GAmC3B,aAID,MAAM,QAAQ,MAAM,SAAS,MAC/B,MAAM,gBAAY,gCAAmB,MAAM,SAAS,IAMtD,MAAM,aAAa,KAChB,IAAI,CAAC,QAAQ;AACZ,cAAM,WAAW,WAAW,mDAAkB,IAAI,KAAK;AACvD,eAAO,GAAG,GAAG,IAAI,QAAQ;AAAA,MAC3B,CAAC,EACA,KAAK,IAAI,GAMR,QAAQ,IAAI,aAAa,iBAAiB,MAAM,SAClD,QAAQ,KAAK,iBAAiB,OAAO,MAAM,YAAY,EAAE,YAAY,UAAU,CAAC,GAG3E,EAAE,MAAM,KAzBN;AAAA,IA0BX;AAAA,EACF;AACF;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/esm/index.native.js
CHANGED
|
@@ -1,2 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __copyProps = (to, from, except, desc) => {
|
|
7
|
+
if (from && typeof from == "object" || typeof from == "function")
|
|
8
|
+
for (let key of __getOwnPropNames(from))
|
|
9
|
+
!__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
10
|
+
return to;
|
|
11
|
+
}, __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
12
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
|
|
13
|
+
var src_exports = {};
|
|
14
|
+
module.exports = __toCommonJS(src_exports);
|
|
15
|
+
__reExport(src_exports, require("./createAnimations"), module.exports);
|
|
16
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
17
|
+
0 && (module.exports = {
|
|
18
|
+
...require("./createAnimations")
|
|
19
|
+
});
|
|
2
20
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/animations-css",
|
|
3
|
-
"version": "1.88.
|
|
3
|
+
"version": "1.88.2",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"license": "MIT",
|
|
@@ -13,14 +13,14 @@
|
|
|
13
13
|
"dist"
|
|
14
14
|
],
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@tamagui/constants": "1.88.
|
|
17
|
-
"@tamagui/cubic-bezier-animator": "1.88.
|
|
18
|
-
"@tamagui/use-presence": "1.88.
|
|
19
|
-
"@tamagui/web": "1.88.
|
|
16
|
+
"@tamagui/constants": "1.88.2",
|
|
17
|
+
"@tamagui/cubic-bezier-animator": "1.88.2",
|
|
18
|
+
"@tamagui/use-presence": "1.88.2",
|
|
19
|
+
"@tamagui/web": "1.88.2",
|
|
20
20
|
"react": "^18.2.0"
|
|
21
21
|
},
|
|
22
22
|
"devDependencies": {
|
|
23
|
-
"@tamagui/build": "1.88.
|
|
23
|
+
"@tamagui/build": "1.88.2"
|
|
24
24
|
},
|
|
25
25
|
"scripts": {
|
|
26
26
|
"build": "tamagui-build",
|