@codellyson/framely 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/dist/AbsoluteFill.d.ts +18 -0
- package/dist/AbsoluteFill.d.ts.map +1 -0
- package/dist/AbsoluteFill.js +25 -0
- package/dist/AbsoluteFill.js.map +1 -0
- package/dist/Audio.d.ts +80 -0
- package/dist/Audio.d.ts.map +1 -0
- package/dist/Audio.js +221 -0
- package/dist/Audio.js.map +1 -0
- package/dist/Composition.d.ts +208 -0
- package/dist/Composition.d.ts.map +1 -0
- package/dist/Composition.js +210 -0
- package/dist/Composition.js.map +1 -0
- package/dist/Easing.d.ts +88 -0
- package/dist/Easing.d.ts.map +1 -0
- package/dist/Easing.js +266 -0
- package/dist/Easing.js.map +1 -0
- package/dist/ErrorBoundary.d.ts +35 -0
- package/dist/ErrorBoundary.d.ts.map +1 -0
- package/dist/ErrorBoundary.js +74 -0
- package/dist/ErrorBoundary.js.map +1 -0
- package/dist/Folder.d.ts +46 -0
- package/dist/Folder.d.ts.map +1 -0
- package/dist/Folder.js +44 -0
- package/dist/Folder.js.map +1 -0
- package/dist/Freeze.d.ts +35 -0
- package/dist/Freeze.d.ts.map +1 -0
- package/dist/Freeze.js +40 -0
- package/dist/Freeze.js.map +1 -0
- package/dist/IFrame.d.ts +28 -0
- package/dist/IFrame.d.ts.map +1 -0
- package/dist/IFrame.js +57 -0
- package/dist/IFrame.js.map +1 -0
- package/dist/Img.d.ts +36 -0
- package/dist/Img.d.ts.map +1 -0
- package/dist/Img.js +91 -0
- package/dist/Img.js.map +1 -0
- package/dist/Loop.d.ts +66 -0
- package/dist/Loop.d.ts.map +1 -0
- package/dist/Loop.js +79 -0
- package/dist/Loop.js.map +1 -0
- package/dist/Player.d.ts +118 -0
- package/dist/Player.d.ts.map +1 -0
- package/dist/Player.js +311 -0
- package/dist/Player.js.map +1 -0
- package/dist/Sequence.d.ts +25 -0
- package/dist/Sequence.d.ts.map +1 -0
- package/dist/Sequence.js +37 -0
- package/dist/Sequence.js.map +1 -0
- package/dist/Series.d.ts +52 -0
- package/dist/Series.d.ts.map +1 -0
- package/dist/Series.js +86 -0
- package/dist/Series.js.map +1 -0
- package/dist/Text.d.ts +129 -0
- package/dist/Text.d.ts.map +1 -0
- package/dist/Text.js +211 -0
- package/dist/Text.js.map +1 -0
- package/dist/Video.d.ts +75 -0
- package/dist/Video.d.ts.map +1 -0
- package/dist/Video.js +136 -0
- package/dist/Video.js.map +1 -0
- package/dist/config.d.ts +128 -0
- package/dist/config.d.ts.map +1 -0
- package/dist/config.js +243 -0
- package/dist/config.js.map +1 -0
- package/dist/context.d.ts +84 -0
- package/dist/context.d.ts.map +1 -0
- package/dist/context.js +131 -0
- package/dist/context.js.map +1 -0
- package/dist/delayRender.d.ts +130 -0
- package/dist/delayRender.d.ts.map +1 -0
- package/dist/delayRender.js +197 -0
- package/dist/delayRender.js.map +1 -0
- package/dist/getInputProps.d.ts +118 -0
- package/dist/getInputProps.d.ts.map +1 -0
- package/dist/getInputProps.js +181 -0
- package/dist/getInputProps.js.map +1 -0
- package/dist/hooks/useDelayRender.d.ts +52 -0
- package/dist/hooks/useDelayRender.d.ts.map +1 -0
- package/dist/hooks/useDelayRender.js +92 -0
- package/dist/hooks/useDelayRender.js.map +1 -0
- package/dist/hooks.d.ts +19 -0
- package/dist/hooks.d.ts.map +1 -0
- package/dist/hooks.js +17 -0
- package/dist/hooks.js.map +1 -0
- package/dist/index.d.ts +71 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +65 -0
- package/dist/index.js.map +1 -0
- package/dist/interpolate.d.ts +80 -0
- package/dist/interpolate.d.ts.map +1 -0
- package/dist/interpolate.js +108 -0
- package/dist/interpolate.js.map +1 -0
- package/dist/interpolateColors.d.ts +50 -0
- package/dist/interpolateColors.d.ts.map +1 -0
- package/dist/interpolateColors.js +300 -0
- package/dist/interpolateColors.js.map +1 -0
- package/dist/makeTransform.d.ts +98 -0
- package/dist/makeTransform.d.ts.map +1 -0
- package/dist/makeTransform.js +287 -0
- package/dist/makeTransform.js.map +1 -0
- package/dist/measureSpring.d.ts +75 -0
- package/dist/measureSpring.d.ts.map +1 -0
- package/dist/measureSpring.js +108 -0
- package/dist/measureSpring.js.map +1 -0
- package/dist/noise.d.ts +110 -0
- package/dist/noise.d.ts.map +1 -0
- package/dist/noise.js +228 -0
- package/dist/noise.js.map +1 -0
- package/dist/preload.d.ts +145 -0
- package/dist/preload.d.ts.map +1 -0
- package/dist/preload.js +225 -0
- package/dist/preload.js.map +1 -0
- package/dist/registerRoot.d.ts +140 -0
- package/dist/registerRoot.d.ts.map +1 -0
- package/dist/registerRoot.js +238 -0
- package/dist/registerRoot.js.map +1 -0
- package/dist/shapes/Circle.d.ts +15 -0
- package/dist/shapes/Circle.d.ts.map +1 -0
- package/dist/shapes/Circle.js +11 -0
- package/dist/shapes/Circle.js.map +1 -0
- package/dist/shapes/Ellipse.d.ts +16 -0
- package/dist/shapes/Ellipse.d.ts.map +1 -0
- package/dist/shapes/Ellipse.js +11 -0
- package/dist/shapes/Ellipse.js.map +1 -0
- package/dist/shapes/Line.d.ts +15 -0
- package/dist/shapes/Line.d.ts.map +1 -0
- package/dist/shapes/Line.js +11 -0
- package/dist/shapes/Line.js.map +1 -0
- package/dist/shapes/Path.d.ts +20 -0
- package/dist/shapes/Path.d.ts.map +1 -0
- package/dist/shapes/Path.js +14 -0
- package/dist/shapes/Path.js.map +1 -0
- package/dist/shapes/Polygon.d.ts +15 -0
- package/dist/shapes/Polygon.d.ts.map +1 -0
- package/dist/shapes/Polygon.js +16 -0
- package/dist/shapes/Polygon.js.map +1 -0
- package/dist/shapes/Rect.d.ts +18 -0
- package/dist/shapes/Rect.d.ts.map +1 -0
- package/dist/shapes/Rect.js +11 -0
- package/dist/shapes/Rect.js.map +1 -0
- package/dist/shapes/Svg.d.ts +16 -0
- package/dist/shapes/Svg.d.ts.map +1 -0
- package/dist/shapes/Svg.js +15 -0
- package/dist/shapes/Svg.js.map +1 -0
- package/dist/shapes/index.d.ts +16 -0
- package/dist/shapes/index.d.ts.map +1 -0
- package/dist/shapes/index.js +9 -0
- package/dist/shapes/index.js.map +1 -0
- package/dist/shapes/usePathLength.d.ts +24 -0
- package/dist/shapes/usePathLength.d.ts.map +1 -0
- package/dist/shapes/usePathLength.js +32 -0
- package/dist/shapes/usePathLength.js.map +1 -0
- package/dist/staticFile.d.ts +47 -0
- package/dist/staticFile.d.ts.map +1 -0
- package/dist/staticFile.js +105 -0
- package/dist/staticFile.js.map +1 -0
- package/dist/templates/api.d.ts +26 -0
- package/dist/templates/api.d.ts.map +1 -0
- package/dist/templates/api.js +142 -0
- package/dist/templates/api.js.map +1 -0
- package/dist/templates/index.d.ts +7 -0
- package/dist/templates/index.d.ts.map +1 -0
- package/dist/templates/index.js +7 -0
- package/dist/templates/index.js.map +1 -0
- package/dist/templates/mockData.d.ts +7 -0
- package/dist/templates/mockData.d.ts.map +1 -0
- package/dist/templates/mockData.js +262 -0
- package/dist/templates/mockData.js.map +1 -0
- package/dist/templates/types.d.ts +104 -0
- package/dist/templates/types.d.ts.map +1 -0
- package/dist/templates/types.js +16 -0
- package/dist/templates/types.js.map +1 -0
- package/dist/transitions/TransitionSeries.d.ts +127 -0
- package/dist/transitions/TransitionSeries.d.ts.map +1 -0
- package/dist/transitions/TransitionSeries.js +190 -0
- package/dist/transitions/TransitionSeries.js.map +1 -0
- package/dist/transitions/index.d.ts +52 -0
- package/dist/transitions/index.d.ts.map +1 -0
- package/dist/transitions/index.js +31 -0
- package/dist/transitions/index.js.map +1 -0
- package/dist/transitions/presets/fade.d.ts +45 -0
- package/dist/transitions/presets/fade.d.ts.map +1 -0
- package/dist/transitions/presets/fade.js +56 -0
- package/dist/transitions/presets/fade.js.map +1 -0
- package/dist/transitions/presets/flip.d.ts +99 -0
- package/dist/transitions/presets/flip.d.ts.map +1 -0
- package/dist/transitions/presets/flip.js +153 -0
- package/dist/transitions/presets/flip.js.map +1 -0
- package/dist/transitions/presets/slide.d.ts +61 -0
- package/dist/transitions/presets/slide.d.ts.map +1 -0
- package/dist/transitions/presets/slide.js +116 -0
- package/dist/transitions/presets/slide.js.map +1 -0
- package/dist/transitions/presets/wipe.d.ts +69 -0
- package/dist/transitions/presets/wipe.d.ts.map +1 -0
- package/dist/transitions/presets/wipe.js +136 -0
- package/dist/transitions/presets/wipe.js.map +1 -0
- package/dist/transitions/presets/zoom.d.ts +76 -0
- package/dist/transitions/presets/zoom.d.ts.map +1 -0
- package/dist/transitions/presets/zoom.js +110 -0
- package/dist/transitions/presets/zoom.js.map +1 -0
- package/dist/useAudioData.d.ts +112 -0
- package/dist/useAudioData.d.ts.map +1 -0
- package/dist/useAudioData.js +183 -0
- package/dist/useAudioData.js.map +1 -0
- package/dist/useSpring.d.ts +79 -0
- package/dist/useSpring.d.ts.map +1 -0
- package/dist/useSpring.js +140 -0
- package/dist/useSpring.js.map +1 -0
- package/package.json +51 -0
|
@@ -0,0 +1,300 @@
|
|
|
1
|
+
import { Easing } from './Easing';
|
|
2
|
+
/**
|
|
3
|
+
* Parse a color string into RGBA components.
|
|
4
|
+
*
|
|
5
|
+
* Supports:
|
|
6
|
+
* - Hex: #RGB, #RRGGBB, #RGBA, #RRGGBBAA
|
|
7
|
+
* - RGB: rgb(r, g, b)
|
|
8
|
+
* - RGBA: rgba(r, g, b, a)
|
|
9
|
+
* - HSL: hsl(h, s%, l%)
|
|
10
|
+
* - HSLA: hsla(h, s%, l%, a)
|
|
11
|
+
* - Named colors (limited set)
|
|
12
|
+
*
|
|
13
|
+
* @param {string} color - Color string to parse
|
|
14
|
+
* @returns {{ r: number, g: number, b: number, a: number }} RGBA values (0-255 for RGB, 0-1 for alpha)
|
|
15
|
+
*/
|
|
16
|
+
function parseColor(color) {
|
|
17
|
+
if (typeof color !== 'string') {
|
|
18
|
+
throw new Error(`Invalid color: ${color}`);
|
|
19
|
+
}
|
|
20
|
+
const trimmed = color.trim().toLowerCase();
|
|
21
|
+
// Named colors (common ones)
|
|
22
|
+
const namedColors = {
|
|
23
|
+
transparent: { r: 0, g: 0, b: 0, a: 0 },
|
|
24
|
+
black: { r: 0, g: 0, b: 0, a: 1 },
|
|
25
|
+
white: { r: 255, g: 255, b: 255, a: 1 },
|
|
26
|
+
red: { r: 255, g: 0, b: 0, a: 1 },
|
|
27
|
+
green: { r: 0, g: 128, b: 0, a: 1 },
|
|
28
|
+
blue: { r: 0, g: 0, b: 255, a: 1 },
|
|
29
|
+
yellow: { r: 255, g: 255, b: 0, a: 1 },
|
|
30
|
+
cyan: { r: 0, g: 255, b: 255, a: 1 },
|
|
31
|
+
magenta: { r: 255, g: 0, b: 255, a: 1 },
|
|
32
|
+
gray: { r: 128, g: 128, b: 128, a: 1 },
|
|
33
|
+
grey: { r: 128, g: 128, b: 128, a: 1 },
|
|
34
|
+
orange: { r: 255, g: 165, b: 0, a: 1 },
|
|
35
|
+
purple: { r: 128, g: 0, b: 128, a: 1 },
|
|
36
|
+
pink: { r: 255, g: 192, b: 203, a: 1 },
|
|
37
|
+
};
|
|
38
|
+
if (namedColors[trimmed]) {
|
|
39
|
+
return { ...namedColors[trimmed] };
|
|
40
|
+
}
|
|
41
|
+
// Hex colors
|
|
42
|
+
if (trimmed.startsWith('#')) {
|
|
43
|
+
const hex = trimmed.slice(1);
|
|
44
|
+
let r, g, b, a = 1;
|
|
45
|
+
if (hex.length === 3) {
|
|
46
|
+
// #RGB
|
|
47
|
+
r = parseInt(hex[0] + hex[0], 16);
|
|
48
|
+
g = parseInt(hex[1] + hex[1], 16);
|
|
49
|
+
b = parseInt(hex[2] + hex[2], 16);
|
|
50
|
+
}
|
|
51
|
+
else if (hex.length === 4) {
|
|
52
|
+
// #RGBA
|
|
53
|
+
r = parseInt(hex[0] + hex[0], 16);
|
|
54
|
+
g = parseInt(hex[1] + hex[1], 16);
|
|
55
|
+
b = parseInt(hex[2] + hex[2], 16);
|
|
56
|
+
a = parseInt(hex[3] + hex[3], 16) / 255;
|
|
57
|
+
}
|
|
58
|
+
else if (hex.length === 6) {
|
|
59
|
+
// #RRGGBB
|
|
60
|
+
r = parseInt(hex.slice(0, 2), 16);
|
|
61
|
+
g = parseInt(hex.slice(2, 4), 16);
|
|
62
|
+
b = parseInt(hex.slice(4, 6), 16);
|
|
63
|
+
}
|
|
64
|
+
else if (hex.length === 8) {
|
|
65
|
+
// #RRGGBBAA
|
|
66
|
+
r = parseInt(hex.slice(0, 2), 16);
|
|
67
|
+
g = parseInt(hex.slice(2, 4), 16);
|
|
68
|
+
b = parseInt(hex.slice(4, 6), 16);
|
|
69
|
+
a = parseInt(hex.slice(6, 8), 16) / 255;
|
|
70
|
+
}
|
|
71
|
+
else {
|
|
72
|
+
throw new Error(`Invalid hex color: ${color}`);
|
|
73
|
+
}
|
|
74
|
+
return { r, g, b, a };
|
|
75
|
+
}
|
|
76
|
+
// RGB/RGBA
|
|
77
|
+
const rgbMatch = trimmed.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)(?:\s*,\s*([\d.]+))?\s*\)$/);
|
|
78
|
+
if (rgbMatch) {
|
|
79
|
+
return {
|
|
80
|
+
r: parseInt(rgbMatch[1], 10),
|
|
81
|
+
g: parseInt(rgbMatch[2], 10),
|
|
82
|
+
b: parseInt(rgbMatch[3], 10),
|
|
83
|
+
a: rgbMatch[4] !== undefined ? parseFloat(rgbMatch[4]) : 1,
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
// HSL/HSLA
|
|
87
|
+
const hslMatch = trimmed.match(/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/);
|
|
88
|
+
if (hslMatch) {
|
|
89
|
+
const h = parseFloat(hslMatch[1]) / 360;
|
|
90
|
+
const s = parseFloat(hslMatch[2]) / 100;
|
|
91
|
+
const l = parseFloat(hslMatch[3]) / 100;
|
|
92
|
+
const a = hslMatch[4] !== undefined ? parseFloat(hslMatch[4]) : 1;
|
|
93
|
+
// Convert HSL to RGB
|
|
94
|
+
let r, g, b;
|
|
95
|
+
if (s === 0) {
|
|
96
|
+
r = g = b = l;
|
|
97
|
+
}
|
|
98
|
+
else {
|
|
99
|
+
const hue2rgb = (p, q, t) => {
|
|
100
|
+
if (t < 0)
|
|
101
|
+
t += 1;
|
|
102
|
+
if (t > 1)
|
|
103
|
+
t -= 1;
|
|
104
|
+
if (t < 1 / 6)
|
|
105
|
+
return p + (q - p) * 6 * t;
|
|
106
|
+
if (t < 1 / 2)
|
|
107
|
+
return q;
|
|
108
|
+
if (t < 2 / 3)
|
|
109
|
+
return p + (q - p) * (2 / 3 - t) * 6;
|
|
110
|
+
return p;
|
|
111
|
+
};
|
|
112
|
+
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
113
|
+
const p = 2 * l - q;
|
|
114
|
+
r = hue2rgb(p, q, h + 1 / 3);
|
|
115
|
+
g = hue2rgb(p, q, h);
|
|
116
|
+
b = hue2rgb(p, q, h - 1 / 3);
|
|
117
|
+
}
|
|
118
|
+
return {
|
|
119
|
+
r: Math.round(r * 255),
|
|
120
|
+
g: Math.round(g * 255),
|
|
121
|
+
b: Math.round(b * 255),
|
|
122
|
+
a,
|
|
123
|
+
};
|
|
124
|
+
}
|
|
125
|
+
// OKLCH: oklch(70% 0.15 240) or oklch(70% 0.15 240 / 0.5)
|
|
126
|
+
const oklchMatch = trimmed.match(/^oklch\(\s*([\d.]+)%?\s+([\d.]+)\s+([\d.]+)(?:\s*\/\s*([\d.]+))?\s*\)$/);
|
|
127
|
+
if (oklchMatch) {
|
|
128
|
+
const L = parseFloat(oklchMatch[1]) / 100;
|
|
129
|
+
const C = parseFloat(oklchMatch[2]);
|
|
130
|
+
const H = parseFloat(oklchMatch[3]);
|
|
131
|
+
const a = oklchMatch[4] !== undefined ? parseFloat(oklchMatch[4]) : 1;
|
|
132
|
+
const rgb = oklchToRgb(L, C, H);
|
|
133
|
+
return { r: rgb.r, g: rgb.g, b: rgb.b, a };
|
|
134
|
+
}
|
|
135
|
+
throw new Error(`Unable to parse color: ${color}`);
|
|
136
|
+
}
|
|
137
|
+
// ─── OKLCH ↔ RGB conversion ─────────────────────────────────────────────────
|
|
138
|
+
/**
|
|
139
|
+
* Convert OKLCH to linear RGB, then to sRGB.
|
|
140
|
+
*
|
|
141
|
+
* OKLCH → OKLab → linear RGB → sRGB
|
|
142
|
+
*/
|
|
143
|
+
function oklchToRgb(L, C, H) {
|
|
144
|
+
// OKLCH → OKLab
|
|
145
|
+
const hRad = (H * Math.PI) / 180;
|
|
146
|
+
const a = C * Math.cos(hRad);
|
|
147
|
+
const b = C * Math.sin(hRad);
|
|
148
|
+
// OKLab → linear RGB (via LMS intermediate)
|
|
149
|
+
const l_ = L + 0.3963377774 * a + 0.2158037573 * b;
|
|
150
|
+
const m_ = L - 0.1055613458 * a - 0.0638541728 * b;
|
|
151
|
+
const s_ = L - 0.0894841775 * a - 1.291485548 * b;
|
|
152
|
+
const l = l_ * l_ * l_;
|
|
153
|
+
const m = m_ * m_ * m_;
|
|
154
|
+
const s = s_ * s_ * s_;
|
|
155
|
+
const rLin = +4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s;
|
|
156
|
+
const gLin = -1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s;
|
|
157
|
+
const bLin = -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s;
|
|
158
|
+
return {
|
|
159
|
+
r: Math.round(Math.max(0, Math.min(255, linearToSrgb(rLin) * 255))),
|
|
160
|
+
g: Math.round(Math.max(0, Math.min(255, linearToSrgb(gLin) * 255))),
|
|
161
|
+
b: Math.round(Math.max(0, Math.min(255, linearToSrgb(bLin) * 255))),
|
|
162
|
+
};
|
|
163
|
+
}
|
|
164
|
+
/**
|
|
165
|
+
* Convert sRGB to OKLCH.
|
|
166
|
+
*/
|
|
167
|
+
function rgbToOklch(r, g, b) {
|
|
168
|
+
const rLin = srgbToLinear(r / 255);
|
|
169
|
+
const gLin = srgbToLinear(g / 255);
|
|
170
|
+
const bLin = srgbToLinear(b / 255);
|
|
171
|
+
const l_ = Math.cbrt(0.4122214708 * rLin + 0.5363325363 * gLin + 0.0514459929 * bLin);
|
|
172
|
+
const m_ = Math.cbrt(0.2119034982 * rLin + 0.6806995451 * gLin + 0.1073969566 * bLin);
|
|
173
|
+
const s_ = Math.cbrt(0.0883024619 * rLin + 0.2817188376 * gLin + 0.6299787005 * bLin);
|
|
174
|
+
const L = 0.2104542553 * l_ + 0.793617785 * m_ - 0.0040720468 * s_;
|
|
175
|
+
const a = 1.9779984951 * l_ - 2.428592205 * m_ + 0.4505937099 * s_;
|
|
176
|
+
const bOk = 0.0259040371 * l_ + 0.7827717662 * m_ - 0.808675766 * s_;
|
|
177
|
+
const C = Math.sqrt(a * a + bOk * bOk);
|
|
178
|
+
let H = (Math.atan2(bOk, a) * 180) / Math.PI;
|
|
179
|
+
if (H < 0)
|
|
180
|
+
H += 360;
|
|
181
|
+
return { L, C, H };
|
|
182
|
+
}
|
|
183
|
+
function linearToSrgb(c) {
|
|
184
|
+
return c <= 0.0031308 ? 12.92 * c : 1.055 * Math.pow(c, 1 / 2.4) - 0.055;
|
|
185
|
+
}
|
|
186
|
+
function srgbToLinear(c) {
|
|
187
|
+
return c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
|
|
188
|
+
}
|
|
189
|
+
/**
|
|
190
|
+
* Convert RGBA components to a CSS color string.
|
|
191
|
+
*
|
|
192
|
+
* @param {{ r: number, g: number, b: number, a: number }} color
|
|
193
|
+
* @returns {string} CSS color string
|
|
194
|
+
*/
|
|
195
|
+
function colorToString(color) {
|
|
196
|
+
const r = Math.round(Math.max(0, Math.min(255, color.r)));
|
|
197
|
+
const g = Math.round(Math.max(0, Math.min(255, color.g)));
|
|
198
|
+
const b = Math.round(Math.max(0, Math.min(255, color.b)));
|
|
199
|
+
const a = Math.max(0, Math.min(1, color.a));
|
|
200
|
+
if (a === 1) {
|
|
201
|
+
return `rgb(${r}, ${g}, ${b})`;
|
|
202
|
+
}
|
|
203
|
+
return `rgba(${r}, ${g}, ${b}, ${a.toFixed(3)})`;
|
|
204
|
+
}
|
|
205
|
+
/**
|
|
206
|
+
* Interpolate between colors across a range.
|
|
207
|
+
*
|
|
208
|
+
* Works like interpolate() but for colors. Supports any CSS color format.
|
|
209
|
+
*
|
|
210
|
+
* Usage:
|
|
211
|
+
* interpolateColors(frame, [0, 30], ['#ff0000', '#0000ff'])
|
|
212
|
+
* interpolateColors(frame, [0, 30], ['red', 'blue'], { easing: Easing.easeOut })
|
|
213
|
+
* interpolateColors(frame, [0, 30, 60], ['red', 'yellow', 'green']) // multi-color
|
|
214
|
+
*
|
|
215
|
+
* @param {number} value - The input value (usually the current frame)
|
|
216
|
+
* @param {number[]} inputRange - Array of ascending input breakpoints
|
|
217
|
+
* @param {string[]} outputRange - Corresponding color values
|
|
218
|
+
* @param {object} [options]
|
|
219
|
+
* @param {function} [options.easing=Easing.linear] - Easing function
|
|
220
|
+
* @param {'extend'|'clamp'} [options.extrapolateLeft='clamp']
|
|
221
|
+
* @param {'extend'|'clamp'} [options.extrapolateRight='clamp']
|
|
222
|
+
* @param {'rgb'|'oklch'} [options.colorSpace='rgb'] - Interpolation color space
|
|
223
|
+
* @returns {string} Interpolated CSS color string
|
|
224
|
+
*/
|
|
225
|
+
export function interpolateColors(value, inputRange, outputRange, options = {}) {
|
|
226
|
+
const { easing = Easing.linear, extrapolateLeft = 'clamp', extrapolateRight = 'clamp', colorSpace = 'rgb', } = options;
|
|
227
|
+
if (inputRange.length !== outputRange.length) {
|
|
228
|
+
throw new Error('inputRange and outputRange must have the same length');
|
|
229
|
+
}
|
|
230
|
+
if (inputRange.length < 2) {
|
|
231
|
+
throw new Error('inputRange must have at least 2 elements');
|
|
232
|
+
}
|
|
233
|
+
// Parse all colors upfront
|
|
234
|
+
const parsedColors = outputRange.map(parseColor);
|
|
235
|
+
// Find which segment we're in
|
|
236
|
+
let segIndex = 0;
|
|
237
|
+
for (let i = 1; i < inputRange.length; i++) {
|
|
238
|
+
if (value >= inputRange[i - 1]) {
|
|
239
|
+
segIndex = i - 1;
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
const inputMin = inputRange[segIndex];
|
|
243
|
+
const inputMax = inputRange[segIndex + 1] ?? inputRange[segIndex];
|
|
244
|
+
const colorMin = parsedColors[segIndex];
|
|
245
|
+
const colorMax = parsedColors[segIndex + 1] ?? parsedColors[segIndex];
|
|
246
|
+
// Calculate progress within this segment (0 to 1)
|
|
247
|
+
let progress;
|
|
248
|
+
if (inputMax === inputMin) {
|
|
249
|
+
progress = 0;
|
|
250
|
+
}
|
|
251
|
+
else {
|
|
252
|
+
progress = (value - inputMin) / (inputMax - inputMin);
|
|
253
|
+
}
|
|
254
|
+
// Handle extrapolation
|
|
255
|
+
if (progress < 0) {
|
|
256
|
+
progress = extrapolateLeft === 'clamp' ? 0 : progress;
|
|
257
|
+
}
|
|
258
|
+
if (progress > 1) {
|
|
259
|
+
progress = extrapolateRight === 'clamp' ? 1 : progress;
|
|
260
|
+
}
|
|
261
|
+
// Apply easing only to the 0-1 range
|
|
262
|
+
const easedProgress = progress < 0 || progress > 1 ? progress : easing(progress);
|
|
263
|
+
// Interpolate in the chosen color space
|
|
264
|
+
let interpolated;
|
|
265
|
+
if (colorSpace === 'oklch') {
|
|
266
|
+
// Convert to OKLCH, interpolate there, convert back
|
|
267
|
+
const oklch1 = rgbToOklch(colorMin.r, colorMin.g, colorMin.b);
|
|
268
|
+
const oklch2 = rgbToOklch(colorMax.r, colorMax.g, colorMax.b);
|
|
269
|
+
// Interpolate hue via shortest path
|
|
270
|
+
let hDiff = oklch2.H - oklch1.H;
|
|
271
|
+
if (hDiff > 180)
|
|
272
|
+
hDiff -= 360;
|
|
273
|
+
if (hDiff < -180)
|
|
274
|
+
hDiff += 360;
|
|
275
|
+
const L = oklch1.L + easedProgress * (oklch2.L - oklch1.L);
|
|
276
|
+
const C = oklch1.C + easedProgress * (oklch2.C - oklch1.C);
|
|
277
|
+
let H = oklch1.H + easedProgress * hDiff;
|
|
278
|
+
if (H < 0)
|
|
279
|
+
H += 360;
|
|
280
|
+
if (H >= 360)
|
|
281
|
+
H -= 360;
|
|
282
|
+
const rgb = oklchToRgb(L, C, H);
|
|
283
|
+
interpolated = {
|
|
284
|
+
...rgb,
|
|
285
|
+
a: colorMin.a + easedProgress * (colorMax.a - colorMin.a),
|
|
286
|
+
};
|
|
287
|
+
}
|
|
288
|
+
else {
|
|
289
|
+
// RGB interpolation (default)
|
|
290
|
+
interpolated = {
|
|
291
|
+
r: colorMin.r + easedProgress * (colorMax.r - colorMin.r),
|
|
292
|
+
g: colorMin.g + easedProgress * (colorMax.g - colorMin.g),
|
|
293
|
+
b: colorMin.b + easedProgress * (colorMax.b - colorMin.b),
|
|
294
|
+
a: colorMin.a + easedProgress * (colorMax.a - colorMin.a),
|
|
295
|
+
};
|
|
296
|
+
}
|
|
297
|
+
return colorToString(interpolated);
|
|
298
|
+
}
|
|
299
|
+
export default interpolateColors;
|
|
300
|
+
//# sourceMappingURL=interpolateColors.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interpolateColors.js","sourceRoot":"","sources":["../src/interpolateColors.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* makeTransform Utility
|
|
3
|
+
*
|
|
4
|
+
* Build CSS transform strings from an array of transform operations.
|
|
5
|
+
* Helps construct complex transforms in a readable, composable way.
|
|
6
|
+
*
|
|
7
|
+
* Usage:
|
|
8
|
+
* const transform = makeTransform([
|
|
9
|
+
* { translateX: '100px' },
|
|
10
|
+
* { rotate: '45deg' },
|
|
11
|
+
* { scale: 1.5 },
|
|
12
|
+
* ]);
|
|
13
|
+
* // => "translateX(100px) rotate(45deg) scale(1.5)"
|
|
14
|
+
*
|
|
15
|
+
* // Or using the fluent API:
|
|
16
|
+
* const transform = transform()
|
|
17
|
+
* .translateX('100px')
|
|
18
|
+
* .rotate('45deg')
|
|
19
|
+
* .scale(1.5)
|
|
20
|
+
* .toString();
|
|
21
|
+
*/
|
|
22
|
+
/**
|
|
23
|
+
* A single transform operation mapping function names to their values.
|
|
24
|
+
* Values can be numbers, strings, or arrays of numbers/strings (for multi-arg functions).
|
|
25
|
+
*/
|
|
26
|
+
type TransformValue = number | string;
|
|
27
|
+
type TransformOperation = Record<string, TransformValue | TransformValue[]>;
|
|
28
|
+
/**
|
|
29
|
+
* Build a CSS transform string from an array of transform operations.
|
|
30
|
+
*
|
|
31
|
+
* @param {TransformOperation | TransformOperation[]} operations - Array of transform operation objects
|
|
32
|
+
* @returns {string} CSS transform string
|
|
33
|
+
*
|
|
34
|
+
* @example
|
|
35
|
+
* makeTransform([
|
|
36
|
+
* { translateX: 100 },
|
|
37
|
+
* { rotate: 45 },
|
|
38
|
+
* { scale: 1.5 },
|
|
39
|
+
* ])
|
|
40
|
+
* // => "translateX(100px) rotate(45deg) scale(1.5)"
|
|
41
|
+
*/
|
|
42
|
+
export declare function makeTransform(operations: TransformOperation | TransformOperation[]): string;
|
|
43
|
+
/**
|
|
44
|
+
* Fluent transform builder class.
|
|
45
|
+
*/
|
|
46
|
+
declare class TransformBuilder {
|
|
47
|
+
operations: TransformOperation[];
|
|
48
|
+
constructor();
|
|
49
|
+
translateX(value: TransformValue): this;
|
|
50
|
+
translateY(value: TransformValue): this;
|
|
51
|
+
translate(x: TransformValue, y?: TransformValue): this;
|
|
52
|
+
scaleX(value: TransformValue): this;
|
|
53
|
+
scaleY(value: TransformValue): this;
|
|
54
|
+
scale(x: TransformValue, y?: TransformValue): this;
|
|
55
|
+
rotate(value: TransformValue): this;
|
|
56
|
+
skewX(value: TransformValue): this;
|
|
57
|
+
skewY(value: TransformValue): this;
|
|
58
|
+
skew(x: TransformValue, y?: TransformValue): this;
|
|
59
|
+
translateZ(value: TransformValue): this;
|
|
60
|
+
translate3d(x: TransformValue, y: TransformValue, z: TransformValue): this;
|
|
61
|
+
scaleZ(value: TransformValue): this;
|
|
62
|
+
scale3d(x: TransformValue, y: TransformValue, z: TransformValue): this;
|
|
63
|
+
rotateX(value: TransformValue): this;
|
|
64
|
+
rotateY(value: TransformValue): this;
|
|
65
|
+
rotateZ(value: TransformValue): this;
|
|
66
|
+
rotate3d(x: TransformValue, y: TransformValue, z: TransformValue, angle: TransformValue): this;
|
|
67
|
+
perspective(value: TransformValue): this;
|
|
68
|
+
matrix(...values: TransformValue[]): this;
|
|
69
|
+
matrix3d(...values: TransformValue[]): this;
|
|
70
|
+
toString(): string;
|
|
71
|
+
toArray(): TransformOperation[];
|
|
72
|
+
clear(): this;
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Create a new transform builder for fluent API usage.
|
|
76
|
+
*
|
|
77
|
+
* @returns {TransformBuilder}
|
|
78
|
+
*
|
|
79
|
+
* @example
|
|
80
|
+
* const transform = transform()
|
|
81
|
+
* .translateX(100)
|
|
82
|
+
* .rotate(45)
|
|
83
|
+
* .scale(1.5)
|
|
84
|
+
* .toString();
|
|
85
|
+
*/
|
|
86
|
+
export declare function transform(): TransformBuilder;
|
|
87
|
+
/**
|
|
88
|
+
* Interpolate between two transform strings.
|
|
89
|
+
* Note: This is a simplified version that works best with matching operations.
|
|
90
|
+
*
|
|
91
|
+
* @param {number} progress - Interpolation progress (0-1)
|
|
92
|
+
* @param {TransformOperation[]} fromOps - Starting transform operations
|
|
93
|
+
* @param {TransformOperation[]} toOps - Ending transform operations
|
|
94
|
+
* @returns {string} Interpolated transform string
|
|
95
|
+
*/
|
|
96
|
+
export declare function interpolateTransform(progress: number, fromOps: TransformOperation[], toOps: TransformOperation[]): string;
|
|
97
|
+
export default makeTransform;
|
|
98
|
+
//# sourceMappingURL=makeTransform.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"makeTransform.d.ts","sourceRoot":"","sources":["../src/makeTransform.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH;;;GAGG;AACH,KAAK,cAAc,GAAG,MAAM,GAAG,MAAM,CAAC;AACtC,KAAK,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,cAAc,GAAG,cAAc,EAAE,CAAC,CAAC;AAgF5E;;;;;;;;;;;;;GAaG;AACH,wBAAgB,aAAa,CAAC,UAAU,EAAE,kBAAkB,GAAG,kBAAkB,EAAE,GAAG,MAAM,CAS3F;AAED;;GAEG;AACH,cAAM,gBAAgB;IACpB,UAAU,EAAE,kBAAkB,EAAE,CAAC;;IAOjC,UAAU,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKvC,UAAU,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKvC,SAAS,CAAC,CAAC,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,cAAc,GAAG,IAAI;IAKtD,MAAM,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKnC,MAAM,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKnC,KAAK,CAAC,CAAC,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,cAAc,GAAG,IAAI;IAKlD,MAAM,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKnC,KAAK,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKlC,KAAK,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKlC,IAAI,CAAC,CAAC,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,cAAc,GAAG,IAAI;IAMjD,UAAU,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKvC,WAAW,CAAC,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE,cAAc,GAAG,IAAI;IAK1E,MAAM,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKnC,OAAO,CAAC,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE,cAAc,GAAG,IAAI;IAKtE,OAAO,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKpC,OAAO,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKpC,OAAO,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAKpC,QAAQ,CAAC,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE,cAAc,EAAE,KAAK,EAAE,cAAc,GAAG,IAAI;IAK9F,WAAW,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAMxC,MAAM,CAAC,GAAG,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI;IAKzC,QAAQ,CAAC,GAAG,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI;IAM3C,QAAQ,IAAI,MAAM;IAKlB,OAAO,IAAI,kBAAkB,EAAE;IAK/B,KAAK,IAAI,IAAI;CAId;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,SAAS,IAAI,gBAAgB,CAE5C;AAED;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,kBAAkB,EAAE,EAC7B,KAAK,EAAE,kBAAkB,EAAE,GAC1B,MAAM,CAwCR;AAED,eAAe,aAAa,CAAC"}
|