@voila.dev/chart 5.0.118 → 6.0.121
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/core/motion/motion-store.d.ts.map +1 -1
- package/dist/core/motion/motion-store.js +65 -105
- package/dist/core/motion/motion-store.js.map +3 -3
- package/dist/core/motion/points-motion.d.ts.map +1 -1
- package/dist/core/motion/points-motion.js +9 -22
- package/dist/core/motion/points-motion.js.map +2 -2
- package/dist/core/motion/strings.d.ts +4 -2
- package/dist/core/motion/strings.d.ts.map +1 -1
- package/dist/core/motion/strings.js +5 -6
- package/dist/core/motion/strings.js.map +2 -2
- package/dist/core/motion/timing.d.ts +16 -18
- package/dist/core/motion/timing.d.ts.map +1 -1
- package/dist/core/motion/timing.js +9 -8
- package/dist/core/motion/timing.js.map +2 -2
- package/dist/core/motion/tween-timing.d.ts +17 -0
- package/dist/core/motion/tween-timing.d.ts.map +1 -0
- package/dist/core/motion/tween-timing.js +22 -0
- package/dist/core/motion/tween-timing.js.map +7 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +2 -2
- package/dist/react/chart.d.ts +3 -2
- package/dist/react/chart.d.ts.map +1 -1
- package/dist/react/chart.js +3 -1
- package/dist/react/chart.js.map +2 -2
- package/dist/react/use-animated-scene.d.ts.map +1 -1
- package/dist/react/use-animated-scene.js +4 -4
- package/dist/react/use-animated-scene.js.map +2 -2
- package/package.json +2 -2
- package/src/core/motion/motion-store.ts +93 -139
- package/src/core/motion/points-motion.ts +12 -24
- package/src/core/motion/strings.ts +9 -12
- package/src/core/motion/timing.ts +28 -33
- package/src/core/motion/tween-timing.ts +35 -0
- package/src/index.ts +2 -0
- package/src/react/chart.tsx +9 -4
- package/src/react/use-animated-scene.ts +6 -4
- package/dist/core/motion/leaving.d.ts +0 -12
- package/dist/core/motion/leaving.d.ts.map +0 -1
- package/dist/core/motion/leaving.js +0 -33
- package/dist/core/motion/leaving.js.map +0 -7
- package/src/core/motion/leaving.ts +0 -55
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { shouldReduceMotion } from "@voila.dev/motion";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import {
|
|
4
4
|
createMotionStore,
|
|
@@ -53,20 +53,22 @@ export function useAnimatedScene(
|
|
|
53
53
|
return;
|
|
54
54
|
}
|
|
55
55
|
if (changed) store.retarget(scene, performance.now());
|
|
56
|
+
// One chart needs one callback a frame: a plain requestAnimationFrame
|
|
57
|
+
// keeps motion's shared frame loop out of every chart bundle.
|
|
58
|
+
let request = 0;
|
|
56
59
|
function tick() {
|
|
57
60
|
const now = performance.now();
|
|
58
61
|
if (store?.settled(now)) {
|
|
59
62
|
// Only once it has played: StrictMode's rerun of the effect starts it again.
|
|
60
63
|
introduced.current = true;
|
|
61
|
-
cancelFrame(tick);
|
|
62
64
|
setShown(scene);
|
|
63
65
|
return;
|
|
64
66
|
}
|
|
65
67
|
setShown(store?.frame(now) ?? scene);
|
|
68
|
+
request = requestAnimationFrame(tick);
|
|
66
69
|
}
|
|
67
70
|
tick();
|
|
68
|
-
|
|
69
|
-
return () => cancelFrame(tick);
|
|
71
|
+
return () => cancelAnimationFrame(request);
|
|
70
72
|
}, [scene, trigger, timing]);
|
|
71
73
|
|
|
72
74
|
return shown;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type { SceneNode } from "../types.js";
|
|
2
|
-
export interface LeavingGuide {
|
|
3
|
-
readonly node: SceneNode;
|
|
4
|
-
/** The group it sat in, or null at the root. */
|
|
5
|
-
readonly parent: string | null;
|
|
6
|
-
readonly index: number;
|
|
7
|
-
}
|
|
8
|
-
/** The guides of `nodes` whose keys `stays` no longer has. */
|
|
9
|
-
export declare function leavingGuides(nodes: readonly SceneNode[], stays: (key: string) => boolean, parent?: string | null, into?: LeavingGuide[]): LeavingGuide[];
|
|
10
|
-
/** `children` with the leaving guides of `parent` back at their places, faded to `opacity`. */
|
|
11
|
-
export declare function withLeaving(children: readonly SceneNode[], parent: string | null, leaving: ReadonlyArray<readonly [LeavingGuide, number]>): SceneNode[];
|
|
12
|
-
//# sourceMappingURL=leaving.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"leaving.d.ts","sourceRoot":"","sources":["../../../src/core/motion/leaving.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AASjD,MAAM,WAAW,YAAY;IAC5B,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAC;IACzB,gDAAgD;IAChD,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACvB;AAED,8DAA8D;AAC9D,wBAAgB,aAAa,CAC5B,KAAK,EAAE,SAAS,SAAS,EAAE,EAC3B,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,EAC/B,MAAM,GAAE,MAAM,GAAG,IAAW,EAC5B,IAAI,GAAE,YAAY,EAAO,GACvB,YAAY,EAAE,CAWhB;AAED,+FAA+F;AAC/F,wBAAgB,WAAW,CAC1B,QAAQ,EAAE,SAAS,SAAS,EAAE,EAC9B,MAAM,EAAE,MAAM,GAAG,IAAI,EACrB,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,GACrD,SAAS,EAAE,CAcb"}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
const GUIDE_ROLES = /* @__PURE__ */ new Set(["grid", "axis"]);
|
|
2
|
-
function leavingGuides(nodes, stays, parent = null, into = []) {
|
|
3
|
-
for (const [index, node] of nodes.entries()) {
|
|
4
|
-
if (node.kind === "group") {
|
|
5
|
-
leavingGuides(node.children, stays, node.key, into);
|
|
6
|
-
continue;
|
|
7
|
-
}
|
|
8
|
-
if (!stays(node.key) && GUIDE_ROLES.has(node.role ?? "")) {
|
|
9
|
-
into.push({ node, parent, index });
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
return into;
|
|
13
|
-
}
|
|
14
|
-
function withLeaving(children, parent, leaving) {
|
|
15
|
-
const placed = [...children];
|
|
16
|
-
for (const [guide, opacity] of leaving) {
|
|
17
|
-
if (guide.parent !== parent || guide.node.kind === "group") continue;
|
|
18
|
-
const faded = {
|
|
19
|
-
...guide.node,
|
|
20
|
-
paint: {
|
|
21
|
-
...guide.node.paint,
|
|
22
|
-
opacity: (guide.node.paint.opacity ?? 1) * opacity
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
placed.splice(Math.min(guide.index, placed.length), 0, faded);
|
|
26
|
-
}
|
|
27
|
-
return placed;
|
|
28
|
-
}
|
|
29
|
-
export {
|
|
30
|
-
leavingGuides,
|
|
31
|
-
withLeaving
|
|
32
|
-
};
|
|
33
|
-
//# sourceMappingURL=leaving.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/core/motion/leaving.ts"],
|
|
4
|
-
"sourcesContent": ["import type { SceneNode } from \"#/core/types.ts\";\n\n/**\n * Guides that left the scene still fade out where they stood: a tick label\n * or a grid line vanishing at once reads as a glitch. Data marks never\n * linger \u2014 a bar the data no longer has would show a value that isn't true.\n */\nconst GUIDE_ROLES = new Set([\"grid\", \"axis\"]);\n\nexport interface LeavingGuide {\n\treadonly node: SceneNode;\n\t/** The group it sat in, or null at the root. */\n\treadonly parent: string | null;\n\treadonly index: number;\n}\n\n/** The guides of `nodes` whose keys `stays` no longer has. */\nexport function leavingGuides(\n\tnodes: readonly SceneNode[],\n\tstays: (key: string) => boolean,\n\tparent: string | null = null,\n\tinto: LeavingGuide[] = [],\n): LeavingGuide[] {\n\tfor (const [index, node] of nodes.entries()) {\n\t\tif (node.kind === \"group\") {\n\t\t\tleavingGuides(node.children, stays, node.key, into);\n\t\t\tcontinue;\n\t\t}\n\t\tif (!stays(node.key) && GUIDE_ROLES.has(node.role ?? \"\")) {\n\t\t\tinto.push({ node, parent, index });\n\t\t}\n\t}\n\treturn into;\n}\n\n/** `children` with the leaving guides of `parent` back at their places, faded to `opacity`. */\nexport function withLeaving(\n\tchildren: readonly SceneNode[],\n\tparent: string | null,\n\tleaving: ReadonlyArray<readonly [LeavingGuide, number]>,\n): SceneNode[] {\n\tconst placed = [...children];\n\tfor (const [guide, opacity] of leaving) {\n\t\tif (guide.parent !== parent || guide.node.kind === \"group\") continue;\n\t\tconst faded = {\n\t\t\t...guide.node,\n\t\t\tpaint: {\n\t\t\t\t...guide.node.paint,\n\t\t\t\topacity: (guide.node.paint.opacity ?? 1) * opacity,\n\t\t\t},\n\t\t} as SceneNode;\n\t\tplaced.splice(Math.min(guide.index, placed.length), 0, faded);\n\t}\n\treturn placed;\n}\n"],
|
|
5
|
-
"mappings": "AAOA,MAAM,cAAc,oBAAI,IAAI,CAAC,QAAQ,MAAM,CAAC;AAUrC,SAAS,cACf,OACA,OACA,SAAwB,MACxB,OAAuB,CAAC,GACP;AACjB,aAAW,CAAC,OAAO,IAAI,KAAK,MAAM,QAAQ,GAAG;AAC5C,QAAI,KAAK,SAAS,SAAS;AAC1B,oBAAc,KAAK,UAAU,OAAO,KAAK,KAAK,IAAI;AAClD;AAAA,IACD;AACA,QAAI,CAAC,MAAM,KAAK,GAAG,KAAK,YAAY,IAAI,KAAK,QAAQ,EAAE,GAAG;AACzD,WAAK,KAAK,EAAE,MAAM,QAAQ,MAAM,CAAC;AAAA,IAClC;AAAA,EACD;AACA,SAAO;AACR;AAGO,SAAS,YACf,UACA,QACA,SACc;AACd,QAAM,SAAS,CAAC,GAAG,QAAQ;AAC3B,aAAW,CAAC,OAAO,OAAO,KAAK,SAAS;AACvC,QAAI,MAAM,WAAW,UAAU,MAAM,KAAK,SAAS,QAAS;AAC5D,UAAM,QAAQ;AAAA,MACb,GAAG,MAAM;AAAA,MACT,OAAO;AAAA,QACN,GAAG,MAAM,KAAK;AAAA,QACd,UAAU,MAAM,KAAK,MAAM,WAAW,KAAK;AAAA,MAC5C;AAAA,IACD;AACA,WAAO,OAAO,KAAK,IAAI,MAAM,OAAO,OAAO,MAAM,GAAG,GAAG,KAAK;AAAA,EAC7D;AACA,SAAO;AACR;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import type { SceneNode } from "#/core/types.ts";
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Guides that left the scene still fade out where they stood: a tick label
|
|
5
|
-
* or a grid line vanishing at once reads as a glitch. Data marks never
|
|
6
|
-
* linger — a bar the data no longer has would show a value that isn't true.
|
|
7
|
-
*/
|
|
8
|
-
const GUIDE_ROLES = new Set(["grid", "axis"]);
|
|
9
|
-
|
|
10
|
-
export interface LeavingGuide {
|
|
11
|
-
readonly node: SceneNode;
|
|
12
|
-
/** The group it sat in, or null at the root. */
|
|
13
|
-
readonly parent: string | null;
|
|
14
|
-
readonly index: number;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
/** The guides of `nodes` whose keys `stays` no longer has. */
|
|
18
|
-
export function leavingGuides(
|
|
19
|
-
nodes: readonly SceneNode[],
|
|
20
|
-
stays: (key: string) => boolean,
|
|
21
|
-
parent: string | null = null,
|
|
22
|
-
into: LeavingGuide[] = [],
|
|
23
|
-
): LeavingGuide[] {
|
|
24
|
-
for (const [index, node] of nodes.entries()) {
|
|
25
|
-
if (node.kind === "group") {
|
|
26
|
-
leavingGuides(node.children, stays, node.key, into);
|
|
27
|
-
continue;
|
|
28
|
-
}
|
|
29
|
-
if (!stays(node.key) && GUIDE_ROLES.has(node.role ?? "")) {
|
|
30
|
-
into.push({ node, parent, index });
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
return into;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
/** `children` with the leaving guides of `parent` back at their places, faded to `opacity`. */
|
|
37
|
-
export function withLeaving(
|
|
38
|
-
children: readonly SceneNode[],
|
|
39
|
-
parent: string | null,
|
|
40
|
-
leaving: ReadonlyArray<readonly [LeavingGuide, number]>,
|
|
41
|
-
): SceneNode[] {
|
|
42
|
-
const placed = [...children];
|
|
43
|
-
for (const [guide, opacity] of leaving) {
|
|
44
|
-
if (guide.parent !== parent || guide.node.kind === "group") continue;
|
|
45
|
-
const faded = {
|
|
46
|
-
...guide.node,
|
|
47
|
-
paint: {
|
|
48
|
-
...guide.node.paint,
|
|
49
|
-
opacity: (guide.node.paint.opacity ?? 1) * opacity,
|
|
50
|
-
},
|
|
51
|
-
} as SceneNode;
|
|
52
|
-
placed.splice(Math.min(guide.index, placed.length), 0, faded);
|
|
53
|
-
}
|
|
54
|
-
return placed;
|
|
55
|
-
}
|