@motionscript/charts 0.1.0-alpha.8 → 0.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.
- package/CHANGELOG.md +6 -0
- package/LICENSE +201 -201
- package/NOTICE +49 -49
- package/README.md +99 -99
- package/dist/bar-chart/bar-chart.js.map +1 -1
- package/dist/bar-chart/category-axis.js.map +1 -1
- package/dist/bar-chart/chart-bars.js.map +1 -1
- package/dist/bar-chart/index.js.map +1 -1
- package/dist/bar-chart/shared.js.map +1 -1
- package/dist/browser/chunks/{chunk-XROBIRQK.js → chunk-TJNHLQGV.js} +1 -1
- package/dist/browser/chunks/chunk-TJNHLQGV.js.map +7 -0
- package/dist/browser/index.js +1 -1
- package/dist/browser/index.js.map +1 -1
- package/dist/browser/kit.js +1 -1
- package/dist/browser/manifest.json +1 -1
- package/dist/engine.d.ts +1 -1
- package/dist/engine.js +1 -1
- package/dist/engine.js.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/kit/cartesian.js.map +1 -1
- package/dist/kit/chart-border.js.map +1 -1
- package/dist/kit/chart-canvas.js.map +1 -1
- package/dist/kit/chart-legend.js.map +1 -1
- package/dist/kit/entries.js.map +1 -1
- package/dist/kit/motion.js.map +1 -1
- package/dist/kit/paints.js.map +1 -1
- package/dist/kit/shared.js.map +1 -1
- package/dist/kit/vertical-axis.js.map +1 -1
- package/dist/line-chart/chart-line.js.map +1 -1
- package/dist/line-chart/chart-region.js.map +1 -1
- package/dist/line-chart/horizontal-axis.js.map +1 -1
- package/dist/line-chart/index.d.ts +1 -1
- package/dist/line-chart/index.js +1 -1
- package/dist/line-chart/index.js.map +1 -1
- package/dist/line-chart/line-chart.js.map +1 -1
- package/dist/line-chart/shared.js.map +1 -1
- package/dist/line-chart/x-scale.js.map +1 -1
- package/dist/nodes.js.map +1 -1
- package/dist/pie-chart/index.js.map +1 -1
- package/dist/pie-chart/pie-chart.js.map +1 -1
- package/dist/pie-chart/pie-legend.js.map +1 -1
- package/dist/pie-chart/pie-ring.js.map +1 -1
- package/dist/pie-chart/shared.js.map +1 -1
- package/package.json +4 -4
- package/registry.json +23 -23
- package/src/bar-chart/bar-chart.ts +542 -542
- package/src/bar-chart/category-axis.ts +162 -162
- package/src/bar-chart/chart-bars.ts +287 -287
- package/src/bar-chart/index.ts +31 -31
- package/src/bar-chart/shared.ts +354 -354
- package/src/engine.ts +28 -28
- package/src/index.ts +5 -5
- package/src/kit/cartesian.ts +81 -81
- package/src/kit/chart-border.ts +50 -50
- package/src/kit/chart-canvas.ts +122 -122
- package/src/kit/chart-legend.ts +229 -229
- package/src/kit/entries.ts +20 -20
- package/src/kit/motion.ts +90 -90
- package/src/kit/paints.ts +15 -15
- package/src/kit/shared.ts +782 -782
- package/src/kit/vertical-axis.ts +194 -194
- package/src/line-chart/chart-line.ts +156 -156
- package/src/line-chart/chart-region.ts +90 -90
- package/src/line-chart/horizontal-axis.ts +151 -151
- package/src/line-chart/index.ts +39 -39
- package/src/line-chart/line-chart.ts +598 -598
- package/src/line-chart/shared.ts +473 -473
- package/src/line-chart/x-scale.ts +382 -382
- package/src/nodes.ts +18 -18
- package/src/pie-chart/index.ts +37 -37
- package/src/pie-chart/pie-chart.ts +296 -296
- package/src/pie-chart/pie-legend.ts +169 -169
- package/src/pie-chart/pie-ring.ts +848 -848
- package/src/pie-chart/shared.ts +496 -496
- package/dist/browser/chunks/chunk-XROBIRQK.js.map +0 -7
- package/src/node_modules/.vite/vitest/da39a3ee5e6b4b0d3255bfef95601890afd80709/results.json +0 -1
package/src/kit/motion.ts
CHANGED
|
@@ -1,90 +1,90 @@
|
|
|
1
|
-
import { Types, easeOut, type EasingFunction, type Piece, type Timeline } from "@motionscript/sdk"
|
|
2
|
-
|
|
3
|
-
const identity: EasingFunction = (t) => t
|
|
4
|
-
|
|
5
|
-
/** Any component's timeline: these helpers only build pieces, which every timeline builds alike. */
|
|
6
|
-
type AnyTimeline = Timeline<any, any>
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* The ease a part's own frames apply to `t`: none when its command was given
|
|
10
|
-
* one, which already eases every frame the command builds, and otherwise the
|
|
11
|
-
* ease-out every chart command defaults to.
|
|
12
|
-
*/
|
|
13
|
-
export function frameEase(timeline: { readonly easing: EasingFunction | undefined }): EasingFunction {
|
|
14
|
-
return timeline.easing ? identity : easeOut()
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
/** A piece of a command placed at its own time: from `at` seconds, for `duration` seconds. */
|
|
18
|
-
export interface Beat {
|
|
19
|
-
readonly at: number
|
|
20
|
-
readonly duration: number
|
|
21
|
-
readonly piece: Piece
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* `beats` at their own offsets over the command, each eased on its own and held
|
|
26
|
-
* at its last frame once it is done. A beat ahead of the playhead writes nothing,
|
|
27
|
-
* so whatever stands before it is written by a piece ahead of these. Beats that
|
|
28
|
-
* run past the command are played faster to end with it.
|
|
29
|
-
*/
|
|
30
|
-
export function beats(timeline: AnyTimeline, parts: readonly Beat[]): Piece {
|
|
31
|
-
const total = timeline.duration
|
|
32
|
-
const natural = parts.reduce((end, part) => Math.max(end, part.at + part.duration), 0)
|
|
33
|
-
const k = natural > total && natural > 0 ? total / natural : 1
|
|
34
|
-
return timeline.together(
|
|
35
|
-
parts.map(({ at, duration, piece }) => {
|
|
36
|
-
const start = at * k
|
|
37
|
-
const length = duration * k
|
|
38
|
-
return timeline.sequence([timeline.wait(start), piece, timeline.wait(Math.max(0, total - start - length))])
|
|
39
|
-
})
|
|
40
|
-
)
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
/** How far one piece of a staggered entrance has come: its opacity, and how far it still sits off its place. */
|
|
44
|
-
export interface Arrival {
|
|
45
|
-
readonly opacity: number
|
|
46
|
-
readonly shift: number
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
/** Each piece's arrival, by key. An unlisted piece has landed. */
|
|
50
|
-
export type Arrivals = Readonly<Record<string, Arrival>>
|
|
51
|
-
|
|
52
|
-
export const LANDED: Arrival = { opacity: 1, shift: 0 }
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* A part's private record of its pieces' arrivals. A write merges into it, so
|
|
56
|
-
* beats placed apart each write their own piece and leave the others as the
|
|
57
|
-
* frame left them.
|
|
58
|
-
*/
|
|
59
|
-
export function arrivalsEntry() {
|
|
60
|
-
return Types.custom<Arrivals>({}, { private: true, resolve: (next: Arrivals, previous?: Arrivals) => ({ ...previous, ...next }) })
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
export function arrivalOf(arrivals: Arrivals, key: string | number): Arrival {
|
|
64
|
-
return arrivals[key] ?? LANDED
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
/** Every piece in `keys` armed at `from`: the first frame of their entrance. */
|
|
68
|
-
export function armed(keys: readonly (string | number)[], from: Arrival): Arrivals {
|
|
69
|
-
const record: Record<string, Arrival> = {}
|
|
70
|
-
for (const key of keys) record[key] = from
|
|
71
|
-
return record
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* A piece arriving from `from` over its beat: a part armed at `from` tweened to
|
|
76
|
-
* `{ opacity: 1, [axis]: 0 }`, eased by `ease`.
|
|
77
|
-
*/
|
|
78
|
-
export function arrival(timeline: AnyTimeline, key: string | number, from: Arrival, ease: EasingFunction): Piece {
|
|
79
|
-
return timeline.animate((t) => {
|
|
80
|
-
const e = ease(t)
|
|
81
|
-
return {
|
|
82
|
-
arrivals: {
|
|
83
|
-
[key]: {
|
|
84
|
-
opacity: from.opacity + (LANDED.opacity - from.opacity) * e,
|
|
85
|
-
shift: from.shift + (LANDED.shift - from.shift) * e,
|
|
86
|
-
},
|
|
87
|
-
},
|
|
88
|
-
}
|
|
89
|
-
})
|
|
90
|
-
}
|
|
1
|
+
import { Types, easeOut, type EasingFunction, type Piece, type Timeline } from "@motionscript/sdk"
|
|
2
|
+
|
|
3
|
+
const identity: EasingFunction = (t) => t
|
|
4
|
+
|
|
5
|
+
/** Any component's timeline: these helpers only build pieces, which every timeline builds alike. */
|
|
6
|
+
type AnyTimeline = Timeline<any, any>
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* The ease a part's own frames apply to `t`: none when its command was given
|
|
10
|
+
* one, which already eases every frame the command builds, and otherwise the
|
|
11
|
+
* ease-out every chart command defaults to.
|
|
12
|
+
*/
|
|
13
|
+
export function frameEase(timeline: { readonly easing: EasingFunction | undefined }): EasingFunction {
|
|
14
|
+
return timeline.easing ? identity : easeOut()
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
/** A piece of a command placed at its own time: from `at` seconds, for `duration` seconds. */
|
|
18
|
+
export interface Beat {
|
|
19
|
+
readonly at: number
|
|
20
|
+
readonly duration: number
|
|
21
|
+
readonly piece: Piece
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
/**
|
|
25
|
+
* `beats` at their own offsets over the command, each eased on its own and held
|
|
26
|
+
* at its last frame once it is done. A beat ahead of the playhead writes nothing,
|
|
27
|
+
* so whatever stands before it is written by a piece ahead of these. Beats that
|
|
28
|
+
* run past the command are played faster to end with it.
|
|
29
|
+
*/
|
|
30
|
+
export function beats(timeline: AnyTimeline, parts: readonly Beat[]): Piece {
|
|
31
|
+
const total = timeline.duration
|
|
32
|
+
const natural = parts.reduce((end, part) => Math.max(end, part.at + part.duration), 0)
|
|
33
|
+
const k = natural > total && natural > 0 ? total / natural : 1
|
|
34
|
+
return timeline.together(
|
|
35
|
+
parts.map(({ at, duration, piece }) => {
|
|
36
|
+
const start = at * k
|
|
37
|
+
const length = duration * k
|
|
38
|
+
return timeline.sequence([timeline.wait(start), piece, timeline.wait(Math.max(0, total - start - length))])
|
|
39
|
+
})
|
|
40
|
+
)
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
/** How far one piece of a staggered entrance has come: its opacity, and how far it still sits off its place. */
|
|
44
|
+
export interface Arrival {
|
|
45
|
+
readonly opacity: number
|
|
46
|
+
readonly shift: number
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
/** Each piece's arrival, by key. An unlisted piece has landed. */
|
|
50
|
+
export type Arrivals = Readonly<Record<string, Arrival>>
|
|
51
|
+
|
|
52
|
+
export const LANDED: Arrival = { opacity: 1, shift: 0 }
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* A part's private record of its pieces' arrivals. A write merges into it, so
|
|
56
|
+
* beats placed apart each write their own piece and leave the others as the
|
|
57
|
+
* frame left them.
|
|
58
|
+
*/
|
|
59
|
+
export function arrivalsEntry() {
|
|
60
|
+
return Types.custom<Arrivals>({}, { private: true, resolve: (next: Arrivals, previous?: Arrivals) => ({ ...previous, ...next }) })
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
export function arrivalOf(arrivals: Arrivals, key: string | number): Arrival {
|
|
64
|
+
return arrivals[key] ?? LANDED
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
/** Every piece in `keys` armed at `from`: the first frame of their entrance. */
|
|
68
|
+
export function armed(keys: readonly (string | number)[], from: Arrival): Arrivals {
|
|
69
|
+
const record: Record<string, Arrival> = {}
|
|
70
|
+
for (const key of keys) record[key] = from
|
|
71
|
+
return record
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
/**
|
|
75
|
+
* A piece arriving from `from` over its beat: a part armed at `from` tweened to
|
|
76
|
+
* `{ opacity: 1, [axis]: 0 }`, eased by `ease`.
|
|
77
|
+
*/
|
|
78
|
+
export function arrival(timeline: AnyTimeline, key: string | number, from: Arrival, ease: EasingFunction): Piece {
|
|
79
|
+
return timeline.animate((t) => {
|
|
80
|
+
const e = ease(t)
|
|
81
|
+
return {
|
|
82
|
+
arrivals: {
|
|
83
|
+
[key]: {
|
|
84
|
+
opacity: from.opacity + (LANDED.opacity - from.opacity) * e,
|
|
85
|
+
shift: from.shift + (LANDED.shift - from.shift) * e,
|
|
86
|
+
},
|
|
87
|
+
},
|
|
88
|
+
}
|
|
89
|
+
})
|
|
90
|
+
}
|
package/src/kit/paints.ts
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import type { FillResolved, Loader, ShadowResolved, StrokeResolved } from "@motionscript/sdk"
|
|
2
|
-
|
|
3
|
-
/** Paints a chart part holds in entries of its own, which no paint entry loads for it. */
|
|
4
|
-
export interface PartPaints {
|
|
5
|
-
readonly fills?: readonly (readonly FillResolved[])[]
|
|
6
|
-
readonly strokes?: readonly (readonly StrokeResolved[])[]
|
|
7
|
-
readonly shadows?: readonly (readonly ShadowResolved[])[]
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
/** Declare `paints` from a component's `load`. */
|
|
11
|
-
export function loadPaints(loader: Loader, paints: PartPaints): void {
|
|
12
|
-
for (const fill of paints.fills ?? []) loader.fill(fill)
|
|
13
|
-
for (const strokes of paints.strokes ?? []) for (const stroke of strokes) loader.fill(stroke.fill)
|
|
14
|
-
for (const shadows of paints.shadows ?? []) for (const shadow of shadows) loader.fill(shadow.fill)
|
|
15
|
-
}
|
|
1
|
+
import type { FillResolved, Loader, ShadowResolved, StrokeResolved } from "@motionscript/sdk"
|
|
2
|
+
|
|
3
|
+
/** Paints a chart part holds in entries of its own, which no paint entry loads for it. */
|
|
4
|
+
export interface PartPaints {
|
|
5
|
+
readonly fills?: readonly (readonly FillResolved[])[]
|
|
6
|
+
readonly strokes?: readonly (readonly StrokeResolved[])[]
|
|
7
|
+
readonly shadows?: readonly (readonly ShadowResolved[])[]
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
/** Declare `paints` from a component's `load`. */
|
|
11
|
+
export function loadPaints(loader: Loader, paints: PartPaints): void {
|
|
12
|
+
for (const fill of paints.fills ?? []) loader.fill(fill)
|
|
13
|
+
for (const strokes of paints.strokes ?? []) for (const stroke of strokes) loader.fill(stroke.fill)
|
|
14
|
+
for (const shadows of paints.shadows ?? []) for (const shadow of shadows) loader.fill(shadow.fill)
|
|
15
|
+
}
|